/* ═══════════════════════════════════════════
   ТОМАШЕВАЧКА — landing
   ═══════════════════════════════════════════ */

:root{
  --ink:        #0B0806;
  --ink-2:      #120C08;
  --ink-3:      #1A120B;
  --cream:      #F0E4D2;
  --cream-dim:  rgba(240,228,210,.62);
  --cream-mute: rgba(240,228,210,.36);
  --amber:      #E2A75C;
  --amber-deep: #B8752A;
  --amber-lite: #F7DCA8;
  --line:       rgba(240,228,210,.14);

  --serif: "Playfair Display", "Georgia", "Times New Roman", serif;
  --sans:  "Manrope", system-ui, "Segoe UI", Roboto, sans-serif;

  --pad: clamp(20px, 5vw, 88px);
  --ease: cubic-bezier(.22,.61,.36,1);
  --ease-out: cubic-bezier(.16,1,.3,1);
}

*,*::before,*::after{ box-sizing:border-box; }

html{ scroll-behavior:smooth; }

body{
  margin:0;
  background:var(--ink);
  color:var(--cream);
  font-family:var(--sans);
  font-weight:400;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

body.is-loading{ overflow:hidden; height:100vh; }

img{ max-width:100%; height:auto; display:block; }
a{ color:inherit; text-decoration:none; }
ul,ol,dl,dd{ margin:0; padding:0; list-style:none; }
h1,h2,h3,p,figure{ margin:0; }
::selection{ background:var(--amber); color:#1a0f04; }

/* ── scrollbar (webkit) ── */
::-webkit-scrollbar{ width:9px; }
::-webkit-scrollbar-track{ background:#0a0705; }
::-webkit-scrollbar-thumb{ background:#3a2a18; border-radius:9px; }
::-webkit-scrollbar-thumb:hover{ background:var(--amber-deep); }


/* ═══ PRELOADER ═══════════════════════════ */
.loader{
  position:fixed; inset:0; z-index:200;
  background:var(--ink);
  display:grid; place-items:center;
  transition:opacity .9s var(--ease), visibility .9s;
}
.loader.is-done{ opacity:0; visibility:hidden; }
.loader__inner{ width:min(560px, 78vw); text-align:center; }

.loader__mark{ position:relative; display:inline-block; }
.loader__mark span{
  font-family:var(--serif); font-weight:700;
  font-size:clamp(24px, 5.2vw, 54px);
  letter-spacing:.16em; line-height:1; display:block;
}
.loader__mark-base{ color:rgba(240,228,210,.19); }
.loader__mark-fill{
  position:absolute; inset:0;
  color:var(--amber-lite);
  clip-path:inset(100% 0 0 0);
  transition:clip-path .45s var(--ease);
  text-shadow:0 0 34px rgba(226,167,92,.45);
}
.loader__meta{
  display:flex; justify-content:space-between;
  margin-top:26px; font-size:11px; letter-spacing:.32em;
  color:var(--cream-mute);
}
.loader__bar{ margin-top:10px; height:1px; background:var(--line); overflow:hidden; }
.loader__bar i{ display:block; height:100%; width:0; background:var(--amber); transition:width .35s var(--ease); }


/* ═══ AMBIENT BACKGROUND ══════════════════ */
.ambient{
  position:fixed; inset:-25%;
  width:150%; height:150%;
  z-index:-3;
  filter:blur(90px) saturate(1.7) brightness(.85);
  transform:scale(1.15);
  opacity:.52;
}
.ambient-veil{
  position:fixed; inset:0; z-index:-2; pointer-events:none;
  background:
    radial-gradient(120% 85% at 50% 45%, transparent 0%, rgba(11,8,6,.55) 58%, rgba(11,8,6,.92) 100%),
    linear-gradient(180deg, rgba(11,8,6,.72) 0%, rgba(11,8,6,.3) 30%, rgba(11,8,6,.3) 70%, rgba(11,8,6,.8) 100%);
}
.grain{
  position:fixed; inset:0; z-index:99; pointer-events:none; opacity:.055;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  mix-blend-mode:overlay;
}

/* ── scroll progress ── */
.scrollbar{ position:fixed; top:0; left:0; right:0; height:2px; z-index:120; }
.scrollbar i{
  display:block; height:100%; width:0;
  background:linear-gradient(90deg, var(--amber-deep), var(--amber-lite));
  box-shadow:0 0 14px rgba(226,167,92,.6);
}

/* ── custom cursor ── */
.cursor{ position:fixed; top:0; left:0; z-index:150; pointer-events:none; opacity:0; }
.cursor.is-on{ opacity:1; }
.cursor__dot,.cursor__ring{
  position:absolute; border-radius:50%; transform:translate(-50%,-50%);
  transition:width .3s var(--ease), height .3s var(--ease), opacity .3s;
}
.cursor__dot{ width:6px; height:6px; background:var(--amber-lite); }
.cursor__ring{
  width:36px; height:36px; border:1px solid rgba(226,167,92,.5);
  background:radial-gradient(circle, rgba(226,167,92,.16), transparent 70%);
}
.cursor.is-hot .cursor__ring{ width:72px; height:72px; border-color:rgba(226,167,92,.85); }
.cursor.is-hot .cursor__dot{ opacity:0; }
@media (pointer:coarse){ .cursor{ display:none; } }


/* ═══ NAV ═════════════════════════════════ */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:110;
  display:flex; align-items:center; justify-content:space-between;
  gap:24px; padding:22px var(--pad);
  transition:transform .55s var(--ease), background .5s, padding .5s, border-color .5s;
  border-bottom:1px solid transparent;
}
.nav.is-stuck{
  background:rgba(11,8,6,.72);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  border-bottom-color:var(--line);
  padding-top:14px; padding-bottom:14px;
}
.nav.is-hidden{ transform:translateY(-110%); }

.nav__brand{
  display:flex; align-items:center; gap:10px;
  font-family:var(--serif); font-weight:700;
  font-size:14px; letter-spacing:.26em;
}
.nav__diamond{ color:var(--amber); font-size:11px; transition:transform .6s var(--ease); }
.nav__brand:hover .nav__diamond{ transform:rotate(180deg) scale(1.3); }

.nav__links{ display:flex; gap:34px; }
.nav__links a{
  position:relative; font-size:12.5px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--cream-dim);
  transition:color .3s;
}
.nav__links a::after{
  content:""; position:absolute; left:0; bottom:-6px;
  width:100%; height:1px; background:var(--amber);
  transform:scaleX(0); transform-origin:right; transition:transform .45s var(--ease);
}
.nav__links a:hover{ color:var(--cream); }
.nav__links a:hover::after{ transform:scaleX(1); transform-origin:left; }


/* ═══ SHARED BITS ═════════════════════════ */
.eyebrow{
  font-size:11px; letter-spacing:.36em; text-transform:uppercase;
  color:var(--amber); margin-bottom:22px;
}
.h2{
  font-family:var(--serif); font-weight:600;
  font-size:clamp(32px, 4.6vw, 66px);
  line-height:1.06; letter-spacing:-.015em;
}
.h2 em{ font-style:italic; color:var(--amber); }

.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding:15px 30px; border-radius:999px;
  font-size:12px; letter-spacing:.16em; text-transform:uppercase; font-weight:600;
  border:1px solid transparent; cursor:pointer;
  transition:background .4s var(--ease), color .4s, border-color .4s, transform .25s var(--ease);
  will-change:transform;
}
.btn--solid{ background:var(--amber); color:#1B0F03; }
.btn--solid:hover{ background:var(--amber-lite); }
.btn--line{ border-color:var(--line); color:var(--cream); }
.btn--line:hover{ border-color:var(--amber); color:var(--amber); }
.btn--ghost{ border-color:var(--line); padding:11px 22px; font-size:11px; }
.btn--ghost:hover{ background:var(--amber); color:#1B0F03; border-color:var(--amber); }
.btn--lg{ padding:19px 40px; font-size:13px; }

/* reveal */
[data-reveal]{
  opacity:0; transform:translateY(26px);
  transition:opacity 1s var(--ease-out), transform 1s var(--ease-out);
  transition-delay:var(--d,0ms);
}
[data-reveal].is-in{ opacity:1; transform:none; }

/* split text */
.word{ display:inline-block; overflow:hidden; vertical-align:top; }
.word i{
  display:inline-block; font-style:normal;
  transform:translateY(105%);
  transition:transform 1.1s var(--ease-out);
  transition-delay:var(--d,0ms);
}
.is-split-in .word i{ transform:none; }


/* ═══ HERO ════════════════════════════════ */
.hero{
  position:relative; min-height:100svh;
  display:grid; place-items:center;
  padding:120px var(--pad) 100px; text-align:center;
  overflow:hidden;
}
.hero__grid{
  position:absolute; inset:0; pointer-events:none; opacity:.5;
  background-image:linear-gradient(var(--line) 1px, transparent 1px),
                   linear-gradient(90deg, var(--line) 1px, transparent 1px);
  background-size:100% 25vh, 25vw 100%;
  -webkit-mask-image:radial-gradient(70% 60% at 50% 50%, #000, transparent 78%);
          mask-image:radial-gradient(70% 60% at 50% 50%, #000, transparent 78%);
}
.hero__inner{ position:relative; max-width:1000px; }

.hero__title{ margin:0 0 26px; filter:drop-shadow(0 24px 46px rgba(0,0,0,.6)); }
.hero__word{
  display:block;
  font-family:var(--serif); font-weight:700;
  font-size:clamp(38px, 9.2vw, 148px);
  line-height:.95; letter-spacing:.02em;
}
.hero__script{
  display:block; margin-top:.06em;
  font-family:var(--serif); font-style:italic; font-weight:500;
  font-size:clamp(34px, 8vw, 116px);
  line-height:1;
  background:linear-gradient(105deg, var(--amber-deep) 0%, var(--amber-lite) 45%, var(--amber) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.hero__lead{
  max-width:52ch; margin:0 auto;
  color:var(--cream-dim); font-size:clamp(15px,1.35vw,18px); font-weight:300;
}
.hero__actions{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; margin-top:38px; }

.hero__meta{
  position:absolute; bottom:52px;
  display:flex; flex-direction:column; gap:6px;
  font-size:10.5px; letter-spacing:.3em; color:var(--cream-dim);
}
.hero__meta span:first-child{ color:var(--amber); }
.hero__meta--left{ left:var(--pad); }
.hero__meta--right{ right:var(--pad); text-align:right; }

.scroll-cue{
  position:absolute; left:50%; bottom:34px; transform:translateX(-50%);
  display:flex; flex-direction:column; align-items:center; gap:12px;
  font-size:9.5px; letter-spacing:.4em; color:var(--cream-mute);
}
.scroll-cue__line{ position:relative; width:1px; height:56px; background:var(--line); overflow:hidden; }
.scroll-cue__line i{
  position:absolute; top:-56px; left:0; width:100%; height:56px;
  background:linear-gradient(180deg, transparent, var(--amber));
  animation:cue 2.4s var(--ease) infinite;
}
@keyframes cue{ 0%{transform:translateY(0)} 70%,100%{transform:translateY(112px)} }


/* ═══ REEL (scroll-scrubbed video) ════════ */
.reel{ position:relative; height:520vh; }
.reel__sticky{
  position:sticky; top:0; height:100svh; overflow:hidden;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:clamp(24px,5vh,52px); padding:6vh var(--pad) 8vh;
}

/* ── stage: framed film-still (default / phones) ── */
.reel__stage{
  position:relative;
  width:min(86vw, 44vh); aspect-ratio:1;
  transform:scale(var(--s,1));
  border-radius:4px;
  will-change:transform;
}
.stage__canvas{
  width:100%; height:100%; display:block; border-radius:inherit;
  box-shadow:0 50px 120px -30px rgba(0,0,0,.9), 0 0 0 1px rgba(240,228,210,.09);
  background:#100b07;
}
.stage__glow{
  position:absolute; inset:-14%; z-index:-1; border-radius:50%;
  background:radial-gradient(circle, rgba(226,167,92,.24), transparent 65%);
  filter:blur(40px);
}
.stage__scrim{ display:none; }
.stage__corner{
  position:absolute; width:16px; height:16px;
  border:1px solid rgba(226,167,92,.65);
}
.stage__corner--tl{ top:-9px; left:-9px; border-right:0; border-bottom:0; }
.stage__corner--tr{ top:-9px; right:-9px; border-left:0; border-bottom:0; }
.stage__corner--bl{ bottom:-9px; left:-9px; border-right:0; border-top:0; }
.stage__corner--br{ bottom:-9px; right:-9px; border-left:0; border-top:0; }

/* chapters */
.reel__chapters{
  position:relative; width:100%;
  display:grid; justify-items:center; text-align:center;
}
.chapter{
  grid-area:1/1; align-self:center;
  opacity:var(--a,0);
  transform:translateY(calc((1 - var(--a,0)) * 34px));
  filter:blur(calc((1 - var(--a,0)) * 6px));
  pointer-events:none;
}
.chapter__no{
  font-size:10.5px; letter-spacing:.36em; color:var(--amber); margin-bottom:14px;
}
.chapter__title{
  font-family:var(--serif); font-weight:600;
  font-size:clamp(34px, 5.6vw, 84px); line-height:1;
  letter-spacing:-.02em; margin-bottom:14px;
  text-shadow:0 16px 50px rgba(0,0,0,.6);
}
.chapter__text{ color:var(--cream-dim); font-weight:300; font-size:clamp(14px,1.2vw,17px); max-width:34ch; }

/* rail */
.reel__rail{ display:none; }
.rail__line{ position:relative; display:block; width:1px; height:190px; background:var(--line); }
.rail__line i{ position:absolute; top:0; left:0; width:100%; height:0; background:var(--amber); }
.rail__ticks{ display:flex; flex-direction:column; justify-content:space-between; height:190px; }
.rail__ticks li{
  display:flex; flex-direction:row-reverse; align-items:center; gap:9px;
  font-size:9px; letter-spacing:.28em; color:var(--cream-mute);
  transition:color .4s; white-space:nowrap;
}
.rail__ticks li span{
  width:5px; height:5px; border-radius:50%; background:var(--line);
  transition:background .4s, box-shadow .4s, transform .4s;
}
.rail__ticks li.is-on{ color:var(--cream); }
.rail__ticks li.is-on span{ background:var(--amber); transform:scale(1.5); box-shadow:0 0 12px rgba(226,167,92,.9); }

/* counter */
.reel__counter{
  position:absolute; left:var(--pad); bottom:2.5vh;
  display:flex; align-items:baseline; gap:14px;
  font-size:10px; letter-spacing:.3em; color:var(--cream-mute);
}
.reel__counter-num b{ color:var(--amber); font-weight:600; }


/* ── stage: full-bleed with a scroll-driven virtual camera (desktop) ── */
@media (min-width:1101px){
  .reel__sticky{ display:block; padding:0; }

  .reel__stage{
    position:absolute; inset:0;
    width:100%; height:100%; aspect-ratio:auto;
    transform:none; border-radius:0;
  }
  .stage__canvas{ border-radius:0; box-shadow:none; }
  .stage__glow{ display:none; }

  /* keeps the left-hand copy readable over a moving image */
  .stage__scrim{
    display:block; position:absolute; inset:0; pointer-events:none;
    background:
      linear-gradient(96deg, rgba(11,8,6,.95) 0%, rgba(11,8,6,.86) 24%,
                             rgba(11,8,6,.34) 50%, rgba(11,8,6,.08) 72%,
                             rgba(11,8,6,.5) 100%),
      linear-gradient(180deg, rgba(11,8,6,.8) 0%, rgba(11,8,6,0) 20%,
                              rgba(11,8,6,0) 72%, rgba(11,8,6,.82) 100%);
  }

  /* viewfinder marks instead of a picture frame */
  .stage__corner{ width:24px; height:24px; border-color:rgba(240,228,210,.24); }
  .stage__corner--tl{ top:28px; left:28px; }
  .stage__corner--tr{ top:28px; right:28px; }
  .stage__corner--bl{ bottom:28px; left:28px; }
  .stage__corner--br{ bottom:28px; right:28px; }

  .reel__chapters{
    position:absolute; left:clamp(120px, 9.5vw, 180px); top:50%;
    transform:translateY(-50%);
    width:min(40ch, 36vw);
    justify-items:start; text-align:left;
  }
  .chapter__no{ margin-bottom:20px; }
  .chapter__title{ margin-bottom:20px; }
  .chapter__text{ text-shadow:0 6px 24px rgba(0,0,0,.75); }

  .reel__rail{
    display:flex; position:absolute; left:34px; top:50%;
    transform:translateY(-50%);
    flex-direction:row-reverse; align-items:center; gap:14px;
  }
  .reel__counter{ left:auto; right:5vw; bottom:5vh; }
}


/* ═══ MARQUEE ═════════════════════════════ */
.marquee{
  border-top:1px solid var(--line); border-bottom:1px solid var(--line);
  padding:22px 0; overflow:hidden; background:rgba(11,8,6,.5);
}
.marquee__track{ display:flex; width:max-content; animation:slide 32s linear infinite; }
.marquee__track span{
  display:flex; align-items:center;
  font-family:var(--serif); font-size:clamp(18px,2.4vw,32px); font-style:italic;
  white-space:nowrap; padding-right:0;
}
.marquee__track i{ color:var(--amber); font-style:normal; font-size:.5em; padding:0 clamp(18px,2.6vw,42px); }
@keyframes slide{ to{ transform:translateX(-50%); } }


/* ═══ STORY ═══════════════════════════════ */
.story{
  display:grid; grid-template-columns:1fr 1fr; gap:clamp(40px,7vw,120px);
  padding:clamp(90px,14vh,180px) var(--pad);
  max-width:1500px; margin:0 auto;
}
.story__col--sticky{ position:sticky; top:16vh; align-self:start; }
.story__figure{ margin-top:44px; position:relative; max-width:340px; }
.story__figure img{
  border-radius:3px; filter:saturate(.92) contrast(1.05);
  box-shadow:0 40px 90px -30px rgba(0,0,0,.85), 0 0 0 1px var(--line);
}
.story__figure figcaption{
  margin-top:14px; font-size:11px; letter-spacing:.18em;
  text-transform:uppercase; color:var(--cream-mute);
}
.story__p{
  font-size:clamp(16px,1.55vw,21px); font-weight:300; line-height:1.72;
  color:var(--cream-dim); margin-bottom:32px; max-width:46ch;
}
.story__p:first-child{ color:var(--cream); }
.story__p:first-child::first-letter{
  font-family:var(--serif); float:left; font-size:3.9em; line-height:.82;
  padding:6px 14px 0 0; color:var(--amber);
}
.facts{ display:flex; flex-wrap:wrap; gap:clamp(24px,4vw,64px); margin-top:56px; padding-top:40px; border-top:1px solid var(--line); }
.facts b{
  display:block; font-family:var(--serif); font-weight:600;
  font-size:clamp(32px,3.6vw,52px); line-height:1; color:var(--amber);
}
.facts span{ display:block; margin-top:8px; font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--cream-mute); }


/* ═══ STEPS ═══════════════════════════════ */
.steps{ padding:clamp(70px,10vh,140px) var(--pad); max-width:1500px; margin:0 auto; }
.steps__head{ margin-bottom:clamp(40px,6vw,80px); }
.steps__list{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); border:1px solid var(--line); }
.step{
  background:var(--ink); padding:clamp(24px,2.6vw,40px);
  min-height:300px; display:flex; flex-direction:column;
  transition:background .5s var(--ease), transform .5s var(--ease);
}
.step:hover{ background:var(--ink-3); }
.step__no{
  font-family:var(--serif); font-size:clamp(30px,3.2vw,46px);
  color:rgba(240,228,210,.16); line-height:1;
  transition:color .5s;
}
.step:hover .step__no{ color:var(--amber); }
.step h3{ font-family:var(--serif); font-weight:600; font-size:clamp(20px,1.8vw,26px); margin:clamp(50px,7vw,96px) 0 12px; }
.step p{ font-size:14.5px; font-weight:300; color:var(--cream-dim); }


/* ═══ UKUSI ═══════════════════════════════ */
.range{
  position:relative;
  padding:clamp(80px,13vh,180px) var(--pad);
  max-width:1500px; margin:0 auto;
}
.range__halo{
  position:absolute; left:50%; top:22%; transform:translateX(-50%);
  width:min(80vw,900px); aspect-ratio:1; z-index:-1;
  background:radial-gradient(circle, rgba(226,167,92,.17), transparent 62%);
  filter:blur(60px);
}
.range__intro{
  display:grid; grid-template-columns:1fr auto; align-items:center;
  gap:clamp(40px,6vw,90px); margin-bottom:clamp(56px,8vw,110px);
}
.range__lead{
  margin-top:26px; max-width:44ch; color:var(--cream-dim);
  font-weight:300; font-size:clamp(15px,1.35vw,19px);
}
.range__price{
  margin-top:36px; padding-top:30px; border-top:1px solid var(--line);
  display:flex; align-items:baseline; gap:16px; flex-wrap:wrap;
}
.range__price b{
  font-family:var(--serif); font-weight:600; color:var(--amber);
  font-size:clamp(38px,4.4vw,62px); line-height:1;
}
.range__price span{ font-size:11px; letter-spacing:.26em; text-transform:uppercase; color:var(--cream-mute); }

.range__figure{ width:min(36vw,400px); }
.range__figure img{
  border-radius:4px;
  box-shadow:0 60px 130px -40px rgba(0,0,0,.95), 0 0 0 1px var(--line);
}

.range__grid{
  display:grid; grid-template-columns:repeat(7,1fr);
  gap:clamp(12px,1.4vw,22px);
}
.flavour{ text-align:center; }
.flavour__img{
  display:block; position:relative; overflow:hidden;
  border-radius:3px; margin-bottom:18px;
  box-shadow:0 30px 70px -30px rgba(0,0,0,.9), 0 0 0 1px var(--line);
  transition:transform .6s var(--ease), box-shadow .6s var(--ease);
}
.flavour__img img{ width:100%; aspect-ratio:2/5; object-fit:cover; }
/* keeps the eye on the bottle in the middle — the shelf shots have neighbours */
.flavour__img::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(120% 62% at 50% 46%, transparent 34%, rgba(11,8,6,.72) 100%);
}
.flavour:hover .flavour__img{
  transform:translateY(-8px);
  box-shadow:0 40px 90px -30px rgba(0,0,0,.95), 0 0 0 1px rgba(226,167,92,.45);
}
.flavour h3{
  font-family:var(--serif); font-weight:600;
  font-size:clamp(15px,1.35vw,20px); margin-bottom:6px;
}
.flavour__sub{ font-size:12px; font-weight:300; color:var(--cream-dim); }
.flavour__meta{
  margin-top:10px; display:flex; justify-content:center; gap:12px;
  font-size:10px; letter-spacing:.16em; color:var(--cream-mute);
}
.flavour__meta span + span{ padding-left:12px; border-left:1px solid var(--line); }

.range__notes{
  display:flex; flex-wrap:wrap; justify-content:center; gap:14px 0;
  margin-top:clamp(46px,6vw,80px); padding-top:40px; border-top:1px solid var(--line);
}
.range__notes li{
  padding:0 clamp(16px,2.4vw,38px);
  font-size:11px; letter-spacing:.26em; text-transform:uppercase; color:var(--cream-mute);
}
.range__notes li + li{ border-left:1px solid var(--line); }


/* ═══ TASTE ═══════════════════════════════ */
.taste{
  display:grid; grid-template-columns:1fr 1fr; gap:clamp(40px,6vw,110px);
  align-items:start;
  padding:clamp(80px,12vh,170px) var(--pad);
  max-width:1500px; margin:0 auto;
  border-top:1px solid var(--line);
}
.taste__lead{ margin-top:26px; max-width:40ch; color:var(--cream-dim); font-weight:300; font-size:clamp(15px,1.3vw,18px); }
.taste__bars{ display:flex; flex-direction:column; gap:26px; }
.bar{ display:grid; grid-template-columns:minmax(96px,auto) 1fr auto; align-items:center; gap:18px; }
.bar__label{ font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--cream-dim); }
.bar__track{ position:relative; height:2px; background:var(--line); display:block; }
.bar__track i{
  position:absolute; inset:0 auto 0 0; width:0;
  background:linear-gradient(90deg, var(--amber-deep), var(--amber-lite));
  box-shadow:0 0 12px rgba(226,167,92,.55);
  transition:width 1.5s var(--ease-out); transition-delay:var(--d,0ms);
}
.bar__val{ font-family:var(--serif); font-size:15px; color:var(--amber); min-width:2ch; text-align:right; }

.serve{ grid-column:1/-1; display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(24px,3vw,50px); margin-top:clamp(10px,2vw,26px); padding-top:44px; border-top:1px solid var(--line); }
.serve b{ display:block; font-family:var(--serif); font-weight:600; font-size:clamp(19px,1.9vw,27px); margin-bottom:12px; }
.serve span{ font-size:14.5px; font-weight:300; color:var(--cream-dim); }


/* ═══ CTA ═════════════════════════════════ */
.cta{
  position:relative; text-align:center;
  padding:clamp(90px,16vh,210px) var(--pad);
  border-top:1px solid var(--line);
}
.cta__title{
  font-family:var(--serif); font-weight:600;
  font-size:clamp(40px,7.5vw,124px); line-height:1; letter-spacing:-.02em;
}
.cta__title em{ font-style:italic; color:var(--amber); }
.cta__lead{ max-width:46ch; margin:28px auto 0; color:var(--cream-dim); font-weight:300; font-size:clamp(15px,1.3vw,18px); }
.cta__lead b{ color:var(--amber); font-weight:600; }
.cta__actions{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; margin-top:44px; }
.cta__info{
  display:flex; justify-content:center; flex-wrap:wrap; gap:clamp(28px,5vw,80px);
  margin-top:clamp(50px,7vw,90px); padding-top:44px; border-top:1px solid var(--line);
}
.cta__info dt{ font-size:10.5px; letter-spacing:.3em; text-transform:uppercase; color:var(--cream-mute); margin-bottom:10px; }
.cta__info dd{ font-family:var(--serif); font-size:clamp(16px,1.5vw,21px); }
.cta__info a:hover{ color:var(--amber); }


/* ═══ FOOTER ══════════════════════════════ */
.footer{
  padding:clamp(50px,7vh,80px) var(--pad);
  border-top:1px solid var(--line);
  display:flex; flex-wrap:wrap; gap:20px 40px;
  align-items:center; justify-content:space-between;
}
.footer__mark{ font-family:var(--serif); font-weight:700; letter-spacing:.26em; font-size:13px; display:flex; align-items:center; gap:10px; }
.footer__mark span{ color:var(--amber); font-size:10px; }
.footer__note{ font-size:12px; color:var(--cream-mute); max-width:44ch; }
.footer__copy{ font-size:11px; letter-spacing:.12em; color:var(--cream-mute); }


/* ═══ RESPONSIVE ══════════════════════════ */
@media (max-width:1100px){
  .nav__links{ display:none; }

  .reel{ height:460vh; }

  .story, .taste{ grid-template-columns:1fr; }
  .story__col--sticky{ position:static; }
  .story__figure{ max-width:280px; }
  .steps__list{ grid-template-columns:repeat(2,1fr); }
  .range__intro{ grid-template-columns:1fr; justify-items:center; text-align:center; }
  .range__figure{ width:min(66vw,320px); order:-1; }
  .range__price{ justify-content:center; }
  .range__lead{ margin-left:auto; margin-right:auto; }
  .range__grid{ grid-template-columns:repeat(4,1fr); }
  .serve{ grid-template-columns:1fr; }
}

@media (max-width:640px){
  .steps__list{ grid-template-columns:1fr; }
  .step{ min-height:auto; }
  .range__grid{ grid-template-columns:repeat(2,1fr); gap:20px 14px; }
  .range__notes{ flex-direction:column; align-items:center; gap:12px; }
  .range__notes li{ border-left:0 !important; padding:0; }
  .hero__meta{ display:none; }
  .chapter__title{ font-size:clamp(30px,9vw,44px); }
  .footer{ flex-direction:column; align-items:flex-start; }
}


/* ═══ REDUCED MOTION ══════════════════════ */
@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
  [data-reveal]{ opacity:1; transform:none; }
  .word i{ transform:none; }
  .cursor{ display:none; }
}