[data-sig=coffee-pour]{height:220dvh;background:var(--depot);color:var(--paper);position:relative;view-timeline-name:--pour;view-timeline-axis:block}[data-sig=coffee-pour] .pour-stage{height:100dvh;position:sticky;top:0;overflow:hidden;display:grid;grid-template-columns:.7fr 1.3fr;align-items:center;max-width:1920px;margin:auto;padding:32px var(--edge) 56px;gap:16px}[data-sig=coffee-pour] .intro{position:relative;z-index:3;align-self:center}[data-sig=coffee-pour] .place{font-family:var(--display);font-size:20px;margin-bottom:28px}[data-sig=coffee-pour] .intro h2{font-size:clamp(52px,6.7vw,96px);line-height:.95;max-width:7ch}[data-sig=coffee-pour] .intro p{margin-top:28px;max-width:29ch;font-size:15px}[data-sig=coffee-pour] .intro .button{margin-top:32px}[data-sig=coffee-pour] .cup-scene{position:relative;width:100%;aspect-ratio:1/1;max-height:88dvh;align-self:center}[data-sig=coffee-pour] .pour-photo{position:absolute;inset:0;opacity:0;width:100%;height:100%;border-radius:50%;overflow:hidden}[data-sig=coffee-pour] .pour-photo:first-child{opacity:1}[data-sig=coffee-pour] .pour-photo img{height:100%;object-fit:cover;object-position:50% 50%}[data-sig=coffee-pour] .cup-title{position:absolute;inset:0;z-index:2;width:100%;height:100%;overflow:visible;pointer-events:none}[data-sig=coffee-pour] .cup-title text{font-family:var(--display);font-weight:800;font-size:40px;letter-spacing:1px;fill:var(--ink)}[data-sig=coffee-pour] .pour-footer{position:absolute;bottom:24px;left:var(--edge);right:var(--edge);display:flex;justify-content:space-between;gap:16px;font-family:var(--display);font-size:18px}[data-sig=coffee-pour] .phase{font-variant-numeric:tabular-nums}
@supports(animation-timeline:view()){[data-sig=coffee-pour] .pour-photo{animation:pour-frame linear both;animation-timeline:--pour;animation-range:contain 0% contain 100%}[data-sig=coffee-pour] .pour-photo:nth-child(1){animation-name:pour-one}[data-sig=coffee-pour] .pour-photo:nth-child(2){animation-name:pour-two}[data-sig=coffee-pour] .pour-photo:nth-child(3){animation-name:pour-three}[data-sig=coffee-pour] .pour-photo:nth-child(4){animation-name:pour-four}@keyframes pour-one{0%,27%{opacity:1}31%,100%{opacity:0}}@keyframes pour-two{0%,27%{opacity:0}31%,60%{opacity:1}64%,100%{opacity:0}}@keyframes pour-three{0%,60%{opacity:0}64%,93%{opacity:1}97%,100%{opacity:0}}@keyframes pour-four{0%,93%{opacity:0}97%,100%{opacity:1}}}
@media(max-width:700px){[data-sig=coffee-pour]{height:170dvh}[data-sig=coffee-pour] .pour-stage{padding:28px 24px 90px;grid-template-columns:1fr;grid-template-rows:auto 1fr;gap:8px}[data-sig=coffee-pour] .intro{display:grid;grid-template-columns:1fr auto;align-items:center;gap:8px 16px}[data-sig=coffee-pour] .place{font-size:16px;margin:0;grid-column:1/-1}[data-sig=coffee-pour] .intro h2{font-size:48px;max-width:8ch}[data-sig=coffee-pour] .intro p{font-size:13px;margin:0;grid-column:1/-1;max-width:38ch}[data-sig=coffee-pour] .intro .button{margin:0;padding:8px 16px;font-size:20px}[data-sig=coffee-pour] .cup-scene{width:min(105%,54dvh);justify-self:center;max-height:52dvh}[data-sig=coffee-pour] .cup-title text{font-size:38px}[data-sig=coffee-pour] .pour-footer{bottom:78px;font-size:15px}}
@media(prefers-reduced-motion:reduce){[data-sig=coffee-pour]{height:auto}[data-sig=coffee-pour] .pour-stage{position:relative;min-height:740px;height:auto}[data-sig=coffee-pour] .pour-photo{animation:none;opacity:0!important}[data-sig=coffee-pour] .pour-photo:nth-child(4){opacity:1!important}@media(max-width:700px){[data-sig=coffee-pour] .pour-stage{min-height:760px}}}
@media(min-width:701px){[data-sig=coffee-pour] .cup-scene{width:min(100%,88dvh);max-height:none;justify-self:end}}
[data-sig=coffee-pour]:not(.images-ready) .pour-photo{animation:none}