/* The film and its copy share a single pinned viewport. */
:root{--nav-height:82px}
.header{transition:background-color .35s,color .35s,border-color .35s}
.header.is-cinematic{background:var(--ink);color:var(--cream);border-bottom-color:#f6f4eb20}
.header.is-cinematic .menu-toggle span{background:var(--cream)}
.header.is-cinematic nav.open{background:var(--ink);color:var(--cream)}
.scroll-story{height:auto;min-height:0;max-height:none;overflow:visible;isolation:auto;background:var(--ink);color:var(--ink)}
.scroll-story:after{display:none}
.story-stage{position:relative;height:calc(100svh - var(--nav-height));min-height:560px;overflow:hidden;isolation:isolate;background:var(--ink)}
.story-enabled{height:430svh}
.story-enabled .story-stage{position:sticky;top:var(--nav-height)}
.story-visual{position:absolute;inset:0;z-index:-2;overflow:hidden;background:var(--ink)}
.story-poster,.story-video{position:absolute;left:0;top:0;max-width:none;width:1280px;height:720px;transform-origin:0 0;transform:translate3d(var(--film-x,0px),var(--film-y,0px),0) scale(var(--film-scale,1));will-change:transform}
.story-poster{opacity:1}
.story-video{opacity:0;pointer-events:none}
.story-ready .story-video{opacity:1}
.story-ready .story-poster{opacity:0}
.story-shade{position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,#d2e8ec44,transparent 55%);opacity:var(--intro-opacity,1)}
.scroll-story .hero-content{width:58%;padding-top:clamp(70px,8.5vh,130px);opacity:var(--intro-opacity,1);transform:translate3d(0,var(--intro-y,0px),0);will-change:transform,opacity}
.scroll-story .hero-stamp{opacity:var(--intro-opacity,1);transform:rotate(12deg) scale(var(--stamp-scale,1));bottom:16%}
.story-whisper,.story-arrival{position:absolute;left:4.1%;pointer-events:none;opacity:0}
.story-whisper{left:auto;right:6%;bottom:17%;text-align:right;opacity:var(--whisper-opacity,0);transform:translate3d(0,var(--whisper-y,20px),0);color:var(--cream)}
.story-whisper p{font:400 clamp(36px,4.2vw,68px)/1.02 var(--display);letter-spacing:-.05em;margin-top:16px}
.story-whisper p em{font-size:1.16em}
.story-arrival{top:6%;right:4.1%;text-align:center;color:var(--cream);opacity:var(--arrival-opacity,0);transform:translate3d(0,var(--arrival-y,20px),0)}
.story-arrival p{font:400 clamp(27px,3.1vw,48px)/1.05 var(--display);letter-spacing:-.045em;margin-top:12px}
.story-arrival p br{display:none}
.story-arrival em{color:var(--lime);font-size:1.17em}
.story-controls{position:absolute;bottom:30px;left:4.1%;right:4.1%;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;font-size:12px;font-weight:600;letter-spacing:.02em;transition:color .25s}
.story-dark .story-controls{color:var(--cream)}
.story-chapter{display:flex;align-items:center;gap:13px}
.chapter-index{border:1px solid currentColor;border-radius:50%;width:31px;height:31px;display:grid;place-items:center;font-size:12px}
.chapter-label{font-size:11px;letter-spacing:.09em}
.story-scroll-cue{display:flex;align-items:center;gap:12px}
.cue-line{position:relative;display:block;width:1px;height:30px;background:currentColor;opacity:.8;overflow:hidden}
.cue-line:after{content:'';position:absolute;background:var(--lime);width:1px;height:12px;animation:scroll-cue 2s ease-in-out infinite}
.story-skip{justify-self:end;display:flex;align-items:center;gap:17px;border:1px solid currentColor;border-radius:50px;padding:10px 17px;font-size:12px;transition:background .2s,color .2s}
.story-skip:hover{background:var(--lime);border-color:var(--lime);color:var(--ink)}
.story-skip span{font-size:20px;line-height:1}
.story-progress{position:absolute;bottom:0;left:0;right:0;height:3px;background:#191b1720}
.story-progress>span{display:block;width:100%;height:100%;background:var(--lime);transform:scaleX(var(--story-progress,0));transform-origin:left}
.story-enabled:not(.story-ready) .story-progress>span{transform:scaleX(.04);opacity:.5}
.scroll-story:not(.story-enabled) .story-progress,.scroll-story:not(.story-enabled) .story-chapter,.scroll-story:not(.story-enabled) .story-scroll-cue{display:none}
.scroll-story:not(.story-enabled) .story-controls{display:flex;justify-content:flex-end}
.flavors{position:relative;background:var(--ink);padding-top:78px}
.flavors .section-heading{border-top:1px solid #f6f4eb25;padding-top:45px}
.product-image img{transition:transform .65s cubic-bezier(.2,.8,.2,1)}
.motion-ready [data-reveal]{opacity:0;transform:translate3d(0,28px,0);transition:opacity .75s ease,transform .75s cubic-bezier(.2,.8,.2,1);transition-delay:var(--reveal-delay,0ms)}
.motion-ready [data-reveal].is-visible{opacity:1;transform:none}
@keyframes scroll-cue{0%{transform:translateY(-14px)}70%,100%{transform:translateY(32px)}}
@media(min-width:1500px){.scroll-story .hero-content{padding-top:clamp(95px,12vh,150px)}}
@media(max-width:1050px){.scroll-story .hero-content{width:68%}.story-controls{grid-template-columns:1fr auto}.story-scroll-cue{display:none}.story-arrival{top:9%}.story-arrival p{font-size:35px}}
@media(max-width:767px){
  :root{--nav-height:69px}
  .story-enabled{height:380svh}
  .story-stage{height:calc(100svh - var(--nav-height));min-height:620px}
  .scroll-story .hero-content{padding:37px 24px 0;width:100%}
  .scroll-story .hero-content h1{font-size:clamp(38px,10.8vw,72px)}
  .scroll-story .hero-copy{font-size:14px;margin:20px 0}
  .story-shade{background:linear-gradient(180deg,#abdce8 0%,#abdce8ee 32%,#abdce880 47%,transparent 66%)}
  .scroll-story .hero-stamp{bottom:16%;right:24px;width:80px;height:80px}
  .story-controls{left:18px;right:18px;bottom:25px;gap:8px;padding:7px 11px;border-radius:30px;background:#f6f4ebdf;border:1px solid #191b1725}
  .story-dark .story-controls{background:#191b17dd;border-color:#f6f4eb35}
  .story-chapter{display:none}
  .story-scroll-cue{display:flex;gap:8px;font-size:11px;letter-spacing:0}
  .cue-line{height:22px}
  .story-chapter{gap:8px}.chapter-label{font-size:10px;letter-spacing:.035em}.chapter-index{width:25px;height:25px;font-size:10px}
  .story-skip{gap:7px;padding:7px 0 7px 10px;font-size:12px;border:0;border-radius:0;border-left:1px solid #191b1730}
  .story-dark .story-skip{border-left-color:#f6f4eb35}
  .story-whisper{left:24px;right:24px;bottom:14%;text-align:left}.story-whisper p{font-size:43px}.story-whisper .eyebrow{font-size:10px}
  .story-arrival{top:10%;left:24px;right:24px}.story-arrival p{font-size:39px}.story-arrival p br{display:block}.story-arrival .eyebrow{font-size:11px}
  .flavors{padding-top:34px}.flavors .section-heading{padding-top:34px}
}
@media(prefers-reduced-motion:reduce){.story-enabled{height:auto}.story-enabled .story-stage{position:relative;top:auto}.story-video,.story-whisper,.story-arrival,.story-progress,.story-chapter,.story-scroll-cue{display:none!important}.story-poster,.scroll-story .hero-content,.scroll-story .hero-stamp{opacity:1!important}.scroll-story .hero-content{transform:none!important}.story-shade{opacity:1!important}.story-controls{color:var(--ink)!important}.motion-ready [data-reveal]{opacity:1;transform:none;transition:none}}

.story-video{-webkit-mask-image:linear-gradient(to bottom,transparent,#000 var(--film-feather,0%),#000 calc(100% - var(--film-feather,0%)),transparent),linear-gradient(to right,transparent,#000 var(--film-feather,0%),#000 calc(100% - var(--film-feather,0%)),transparent);mask-image:linear-gradient(to bottom,transparent,#000 var(--film-feather,0%),#000 calc(100% - var(--film-feather,0%)),transparent),linear-gradient(to right,transparent,#000 var(--film-feather,0%),#000 calc(100% - var(--film-feather,0%)),transparent);-webkit-mask-composite:source-in;mask-composite:intersect}
.scroll-story:not(.story-enabled) .story-poster{width:100%;height:100%;object-fit:cover;object-position:62% 50%;transform:none}
