.postcards{max-width:1600px;margin:84px auto 0}.postcards__head{display:grid;gap:14px;max-width:640px;margin-bottom:34px}.postcards h2{font:500 46px/.95 Behind The Nineties,Georgia,serif;letter-spacing:-.045em;color:var(--l-paper)}.postcards h2 em{font-weight:500}.postcards__head p{max-width:46ch;font-size:18px;line-height:1.6;color:rgba(255,248,233,.9)}.postcards__row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 14px}.postcard{display:grid;align-content:start;gap:14px;min-width:0}.postcard__frame{position:relative;overflow:hidden;aspect-ratio:9/16;border-radius:14px;background:#241a17;box-shadow:0 30px 50px -30px rgba(48,4,2,.75)}.postcard__poster,.postcard__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.postcard__play{position:absolute;left:50%;top:50%;display:grid;place-items:center;width:68px;height:68px;margin:-34px 0 0 -34px;padding:0;border:0;border-radius:50%;background:rgba(24,19,19,.3);color:var(--l-paper);cursor:pointer;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);transition:transform .6s var(--l-ease),opacity .5s ease,background-color .4s ease}.postcard__play svg{width:64px;height:64px}.postcard__play:hover{transform:scale(1.06)}.postcard__frame[data-playing=true] .postcard__play{opacity:0}.postcard__frame[data-playing=true] .postcard__play:focus-visible,.postcard__frame[data-playing=true]:hover .postcard__play{opacity:1}.postcard__sound{position:absolute;top:10px;right:10px;display:grid;place-items:center;width:48px;height:48px;padding:0;border:0;border-radius:50%;background:rgba(24,19,19,.38);color:var(--l-paper);cursor:pointer}.postcard__sound svg{width:26px;height:26px}.postcard :is(button):focus-visible{outline:2px solid var(--l-paper);outline-offset:3px}.postcard figcaption{display:grid;gap:4px}.postcard figcaption strong{display:block;font:700 clamp(26px,2.4vw,34px)/1.12 Behind The Nineties,Georgia,serif;letter-spacing:-.025em;text-wrap:balance;color:var(--l-paper)}.postcard figcaption span{font-size:16px;line-height:1.45;color:rgba(255,248,233,.88)}.postcard--placeholder .postcard__frame{display:grid;place-items:center}.postcard--butter .postcard__frame{background:var(--l-butter)}.postcard--cream .postcard__frame{background:var(--l-cream)}.postcard--paper .postcard__frame{background:var(--l-paper)}.postcard--night .postcard__frame{background:#241a17}.postcard--placeholder .example-tag{position:absolute;z-index:2;top:10px;left:10px;right:10px;justify-content:flex-start;align-items:flex-start;border-radius:12px}.postcard--placeholder .example-tag:before{margin-top:5px}.postcard--butter .example-tag{background:var(--l-paper)}.postcard__product{width:66%;height:auto;margin-top:8%;transform:rotate(-6deg);filter:drop-shadow(0 16px 16px rgba(80,30,10,.18))}.postcard--paper .postcard__product{width:58%;transform:rotate(-10deg)}.postcard--cream .postcard__product{width:56%;transform:rotate(5deg)}.postcard--night .postcard__product{width:60%;transform:rotate(8deg);filter:drop-shadow(0 12px 22px rgba(0,0,0,.4))}.postcard--placeholder .postcard__play{top:auto;bottom:18px;margin-top:0;width:60px;height:60px;margin-left:-30px;background:var(--l-red);color:var(--l-paper);-webkit-backdrop-filter:none;backdrop-filter:none}.postcard--placeholder .postcard__play svg{width:56px;height:56px}.postcard--night .postcard__play{background:var(--l-paper);color:var(--l-red)}.postcard__about{position:absolute;inset:0;z-index:3;display:grid;align-content:end;gap:14px;padding:18px 16px 20px;background:rgba(24,19,19,.92);color:var(--l-paper);font-size:16px;line-height:1.5}.postcard__about[hidden]{display:none}.postcard__about button{position:absolute;top:8px;right:8px;display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;background:none;color:var(--l-paper);cursor:pointer}.postcard__about button svg{width:26px;height:26px}@media (min-width:700px){.postcards__row{grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}}@media (min-width:1000px){.postcards{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);column-gap:clamp(48px,7vw,128px);row-gap:48px;margin-top:clamp(104px,9vw,144px)}.postcards__head{display:contents}.postcards h2{grid-column:1;align-self:end;font-size:clamp(54px,4.8vw,70px)}.postcards__head p{grid-column:2;align-self:end;max-width:44ch}.postcards__row{grid-column:1/-1;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px}.postcard__frame{transition:transform .9s var(--l-ease),box-shadow .9s var(--l-ease)}.postcards__row>li:nth-child(4n+1) .postcard__frame{transform:rotate(-1.6deg)}.postcards__row>li:nth-child(4n+2) .postcard__frame{transform:rotate(1.1deg)}.postcards__row>li:nth-child(4n+3) .postcard__frame{transform:rotate(-.7deg)}.postcards__row>li:nth-child(4n+4) .postcard__frame{transform:rotate(1.5deg)}.postcards__row>li .postcard:is(:hover,:focus-within) .postcard__frame,.postcards__row>li .postcard__frame[data-playing=true]{transform:translateY(-6px);box-shadow:0 40px 60px -30px rgba(48,4,2,.8)}}@media (prefers-reduced-motion:reduce){.postcards *,.postcards :before{transition:none!important;animation:none!important}}