/* Pass 2 — external critique: richer material depth, a visible steep curve, and stronger editorial rhythm. */

html{scroll-padding-top:24px}
body{-webkit-tap-highlight-color:rgba(216,137,43,.22)}
a,button,input{touch-action:manipulation}
h1,h2,h3{text-wrap:balance}
p,blockquote{text-wrap:pretty}
section[id],.guide-article section{scroll-margin-top:28px}
.skip-link{position:absolute;top:0;transform:translateY(-120%);transition:transform .2s ease}
.skip-link:focus-visible{transform:translateY(12px)}
.primary-nav a,.site-footer a,.hero-scroll,.closing-link{transition:color .25s ease,opacity .25s ease}
.primary-nav a:hover,.site-footer a:hover,.hero-scroll:hover,.closing-link:hover{color:#ffd098}
.hero-scroll:hover i,.closing-link:hover svg{transform:translateX(7px)}
.hero-scroll i,.closing-link svg{transition:transform .35s cubic-bezier(.2,.8,.2,1)}

/* One opening gesture: the photograph settles while a veil of mist crosses once. */
.hero::after{content:"";position:absolute;z-index:2;inset:-15% -35%;pointer-events:none;background:linear-gradient(105deg,transparent 28%,rgba(244,242,232,.3) 47%,rgba(244,242,232,.08) 58%,transparent 72%);transform:translateX(-62%);animation:mist-lift 2.2s cubic-bezier(.22,.8,.2,1) .15s both;mix-blend-mode:screen}
.hero-media img{animation:estate-settle 2.4s cubic-bezier(.2,.75,.2,1) both}
.reveal{animation-duration:1.05s}
@keyframes mist-lift{to{transform:translateX(58%);opacity:0}}
@keyframes estate-settle{from{transform:scale(1.075)}to{transform:scale(1.02)}}

.primary-nav a::after{right:0;transform:scaleX(0);transform-origin:left center;transition:transform .35s ease}
.primary-nav a:hover::after{right:0;transform:scaleX(1)}

/* Copper enters the story physically, as a code-drawn kettle. */
.copper-kettle{position:absolute;z-index:1;width:190px;right:2%;top:52px;overflow:visible;opacity:.78;filter:drop-shadow(0 24px 20px rgba(0,0,0,.3));transform:rotate(-7deg);animation:kettle-arrive 1.1s cubic-bezier(.2,.9,.25,1) .55s both}
.copper-kettle path,.copper-kettle circle{vector-effect:non-scaling-stroke}
.kettle-body{fill:url(#copper-body);stroke:#f0bd96;stroke-width:1}
.kettle-handle{fill:none;stroke:#a95b42;stroke-width:13;stroke-linecap:round}
.kettle-lid,.kettle-spout{fill:url(#copper-body);stroke:#e7a67f;stroke-width:1}
.kettle-glint{fill:none;stroke:rgba(255,235,211,.55);stroke-width:2;stroke-linecap:round}
.copper-kettle circle{fill:#613027;stroke:#e8a47c}
@keyframes kettle-arrive{from{opacity:0;transform:translate(32px,-18px) rotate(-15deg)}to{opacity:.78;transform:translate(0,0) rotate(-7deg)}}
.glass-stage{background:radial-gradient(ellipse at 77% 23%,rgba(184,105,67,.22),transparent 27%),radial-gradient(ellipse at 50% 66%,rgba(203,134,72,.2),transparent 37%),linear-gradient(90deg,transparent 49.8%,rgba(255,255,255,.04) 50%,transparent 50.2%)}
.tasting-glass{background:linear-gradient(100deg,rgba(255,255,255,.08),transparent 28%,rgba(255,255,255,.025) 73%,rgba(255,255,255,.07));box-shadow:inset 0 0 35px rgba(242,240,232,.08),inset -18px 0 30px rgba(5,20,16,.15)}
.liquor{box-shadow:inset 0 18px 25px rgba(255,255,255,.1),inset 0 -35px 45px rgba(74,38,20,.2)}
.liquor::after{content:"";position:absolute;inset:14% -10% auto;height:36%;background:radial-gradient(ellipse at center,rgba(255,231,150,.24),transparent 67%);transform:rotate(-7deg);mix-blend-mode:screen}
.steam{z-index:2}

/* The actual extraction model is now visible, not buried in JavaScript. */
.infusion-curve{margin:-24px 0 34px;padding:16px 0 12px;border-top:1px solid rgba(255,255,255,.13);border-bottom:1px solid rgba(255,255,255,.13)}
.curve-heading{display:flex;justify-content:space-between;gap:16px;text-transform:uppercase;letter-spacing:.2em;font-size:8px;color:#9fb1a5}
.curve-heading b{color:#e5b18d;font-weight:500}.curve-heading output{font-variant-numeric:tabular-nums;color:#d6ddd7}
.infusion-curve svg{display:block;width:100%;height:104px;overflow:visible;margin-top:8px}
.curve-grid{fill:none;stroke:rgba(255,255,255,.12);stroke-width:1;stroke-dasharray:3 6}
.curve-area{fill:rgba(216,137,43,.08)}
.curve-line{fill:none;stroke:#d5cc91;stroke-width:2}
.bitter-line{fill:none;stroke:#ba6846;stroke-width:1.4;stroke-dasharray:4 5}
.curve-time{stroke:rgba(242,240,232,.35);stroke-width:1}
.curve-dot{fill:#d78655;stroke:#f2e8d6;stroke-width:2;filter:drop-shadow(0 0 8px rgba(216,137,43,.6))}
.infusion-curve text{fill:#90a498;font-family:var(--body);font-size:8px;letter-spacing:.08em}
.range-label span{display:flex;flex-direction:column;gap:1px}.range-label span:nth-child(2){align-items:center}.range-label span:last-child{align-items:flex-end}
.range-label small{color:#7f9387;font-size:7px;letter-spacing:.08em;font-weight:400}
.clock-row output,.estate-facts dt,.lot-date{font-variant-numeric:tabular-nums}
.flush-tabs button::after{left:0;right:0;transform:scaleX(0);transition:transform .3s ease}
.flush-tabs button.active::after{left:0;right:0;transform:scaleX(1)}
.state-meter b{width:100%;transform:scaleX(.5);transform-origin:left center;transition:transform .5s ease}

/* The craft rail follows the day uphill instead of repeating four equal cards. */
.duration-mark{display:block;width:100%;height:3px;margin:0 0 18px;background:linear-gradient(90deg,var(--copper),rgba(184,105,67,.1));transform-origin:left}
.process-rail li:nth-child(1) .duration-mark{width:100%}
.process-rail li:nth-child(2) .duration-mark{width:18%}
.process-rail li:nth-child(3) .duration-mark{width:48%}
.process-rail li:nth-child(4) .duration-mark{width:14%}
.process-orbit{transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.process-rail li:hover .process-orbit{transform:translateY(-7px) rotate(7deg);border-color:var(--terra)}
@media(min-width:901px){
  .process-section{padding-bottom:210px;overflow:hidden}
  .process-rail{position:relative;border-top:0;margin-top:75px;padding-top:52px;align-items:start}
  .process-rail::before{content:"";position:absolute;left:1.5%;top:35px;width:98%;height:1px;background:linear-gradient(90deg,rgba(157,78,53,.3),var(--terra),rgba(157,78,53,.22));transform:rotate(5.6deg);transform-origin:left center}
  .process-rail li{border-top:1px solid rgba(23,61,45,.3);border-right:0;border-left:1px solid rgba(23,61,45,.23)!important;padding-top:42px;min-height:355px;background:linear-gradient(145deg,rgba(255,255,255,.08),transparent 58%)}
  .process-rail li:last-child{border-right:1px solid rgba(23,61,45,.23)}
  .process-rail li:nth-child(2){margin-top:42px}
  .process-rail li:nth-child(3){margin-top:84px}
  .process-rail li:nth-child(4){margin-top:126px}
}

/* Editorial detail and a complete six-morning ledger. */
.season-title-wrap::after{content:"03:58 — 06:32\A SIX PLUCKING WINDOWS";white-space:pre;display:block;margin-top:50px;padding-top:16px;border-top:1px solid rgba(23,61,45,.22);font-size:8px;line-height:1.8;letter-spacing:.2em;color:#617267}
.lot-list article::before{content:"";position:absolute;left:0;top:18%;bottom:18%;width:2px;background:var(--copper);transform:scaleY(0);transform-origin:center;transition:transform .3s ease}
.lot-list article:hover::before{transform:scaleY(1)}
.lot-list article{transition:background-color .35s ease;padding-left:0}
.lot-list article:hover{padding-left:0}
.lot-list article h3{transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.lot-list article:hover h3{transform:translateX(10px)}
.season-note{box-shadow:18px 20px 0 rgba(157,78,53,.09)}

/* Scroll entrances are small and material: diagrams rise as if lifted from a field drawer. */
.scroll-watch{opacity:1;transform:none}
.scroll-watch.in-view{animation:field-lift .8s cubic-bezier(.2,.8,.2,1) both}
@keyframes field-lift{from{opacity:.22;transform:translateY(26px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}
.process-rail li.scroll-watch:nth-child(2),.lot-list article.scroll-watch:nth-child(2){transition-delay:.07s}
.process-rail li.scroll-watch:nth-child(3),.lot-list article.scroll-watch:nth-child(3){transition-delay:.14s}
.process-rail li.scroll-watch:nth-child(4),.lot-list article.scroll-watch:nth-child(4){transition-delay:.21s}
.lot-list article.scroll-watch:nth-child(5){transition-delay:.28s}.lot-list article.scroll-watch:nth-child(6){transition-delay:.35s}

/* Guide — field notebook rather than generic documentation. */
.guide-hero{min-height:610px;background:linear-gradient(118deg,#163f2e 0%,#31583e 52%,#a5aa94 100%)}
.guide-hero::before{content:"";position:absolute;left:0;right:0;bottom:0;height:42%;background:linear-gradient(transparent,rgba(9,39,30,.2));pointer-events:none}
.guide-hero>p:last-of-type{font-family:var(--display);font-size:24px;line-height:1.5;max-width:560px;margin-left:12vw;position:relative;z-index:1}
.guide-folio{position:absolute;right:clamp(32px,8vw,120px);bottom:68px;width:176px;height:176px;border:1px solid rgba(242,240,232,.3);border-radius:50%;display:grid;place-items:center;color:var(--mist);z-index:2}
.guide-folio::before,.guide-folio::after{content:"";position:absolute;border:1px solid rgba(242,240,232,.15);border-radius:50%;inset:10px}.guide-folio::after{inset:22px;border-style:dotted}
.guide-folio span{font-family:var(--display);font-size:70px;font-weight:300;line-height:1}.guide-folio i,.guide-folio b{position:absolute;font-family:var(--body);font-size:7px;letter-spacing:.18em;font-style:normal;font-weight:500}.guide-folio i{top:42px}.guide-folio b{bottom:38px;color:#ffd098}
.guide-content{max-width:1280px;grid-template-columns:230px minmax(0,840px);justify-content:space-between;gap:9vw;padding-top:115px}
.guide-index::after{content:"74";display:block;margin-top:35px;font-family:var(--display);font-size:150px;line-height:.7;color:rgba(242,240,232,.055)}
.guide-index a{min-height:44px;display:flex;align-items:center;border-bottom:1px solid rgba(255,255,255,.06);transition:padding-left .25s ease,color .25s ease}
.guide-index a:hover{padding-left:8px;color:#ffd098}
.guide-article{max-width:840px}
.guide-article section{position:relative;margin-bottom:90px}
.guide-article h2{font-size:clamp(48px,5vw,68px);letter-spacing:-.025em}
.guide-article h3{font-size:31px}
.guide-article p{max-width:760px;font-size:16px}
.guide-pullquote{width:calc(100% + 70px);margin:40px 0 0 -70px;padding:35px 45px;background:var(--terra);color:var(--mist);font-family:var(--display);font-size:27px;line-height:1.35;font-style:italic;box-shadow:18px 18px 0 rgba(184,105,67,.13)}
.guide-curve{position:relative;margin:32px 0 45px;padding:25px 30px 8px;border:1px solid rgba(242,240,232,.2);background:radial-gradient(circle at 30% 40%,rgba(216,137,43,.09),transparent 32%)}
.guide-curve>span{font-size:8px;letter-spacing:.22em;color:#dfaa83}
.guide-curve svg{width:100%;overflow:visible}.guide-curve path{fill:none;stroke:url(#guide-amber);stroke-width:3}.guide-curve .guide-bitter{stroke:#bc6848;stroke-width:2;stroke-dasharray:5 7}.guide-curve circle{fill:#d8892b;stroke:#f2f0e8;stroke-width:2}.guide-curve text{fill:#aab9af;font:8px var(--body);letter-spacing:.13em}
.token-strip{grid-template-columns:1.15fr .9fr 1.35fr .82fr .95fr;height:145px}
.token-strip div:nth-child(even){transform:translateY(12px)}
.type-sample{border:0;border-left:1px solid rgba(242,240,232,.4);background:linear-gradient(90deg,rgba(255,255,255,.035),transparent);padding:24px 30px}
.type-sample:nth-of-type(2){margin-left:42px}
.prompt-card{width:calc(100% + 55px);margin-left:-55px;padding:42px 50px;background:linear-gradient(105deg,#e9e1cc,#f4f0e6 67%,#ded2b4);box-shadow:18px 20px 0 rgba(184,105,67,.12)}

@media(max-width:900px){
  .copper-kettle{width:172px;right:6%;top:55px}
  .process-rail li{background:linear-gradient(145deg,rgba(255,255,255,.1),transparent 62%)}
  .guide-folio{width:142px;height:142px;right:22px;bottom:38px}.guide-folio span{font-size:56px}.guide-folio i{top:30px}.guide-folio b{bottom:27px}
}

@media(max-width:700px){
  .guide-hero{min-height:540px;padding-bottom:120px}
  .guide-hero>p:last-of-type{margin-left:20px;font-size:22px;max-width:300px}
  .guide-content{grid-template-columns:1fr;justify-content:stretch;gap:0}
  .guide-folio{width:105px;height:105px;right:18px;bottom:20px}.guide-folio span{font-size:42px}.guide-folio i{top:20px;font-size:6px}.guide-folio b{bottom:18px;font-size:6px}.guide-folio::after{inset:16px}
  .guide-index::after{display:none}
  .guide-index a{min-height:46px}
  .guide-article section{margin-bottom:72px}
  .guide-pullquote,.prompt-card{width:auto;margin-left:0;padding:28px 24px;box-shadow:10px 12px 0 rgba(184,105,67,.11)}
  .guide-curve{padding:20px 15px 6px}
  .token-strip div:nth-child(even){transform:none}
  .type-sample:nth-of-type(2){margin-left:0}
}

@media(max-width:560px){
  .hero::after{inset:-10% -90%}
  .copper-kettle{width:128px;right:-6px;top:74px;opacity:.62}
  .glass-stage::before{left:12px}
  .infusion-curve{margin-top:-12px}
  .curve-heading{font-size:7px}.infusion-curve svg{height:96px}.infusion-curve text{font-size:7px}
  .range-label{font-size:7px}.range-label small{font-size:6px}
  .process-rail li,.process-rail li:nth-child(3){grid-template-rows:auto auto auto 1fr;grid-template-areas:"orbit time" "orbit title" "orbit duration" "orbit copy"}
  .duration-mark{grid-area:duration;margin:0 0 8px;width:70px!important}
  .season-title-wrap::after{margin-top:35px}
  .lot-list article:hover{padding-left:7px}
  .guide-hero h1{font-size:74px;line-height:.74}
  .guide-hero>p:last-child{font-size:22px;max-width:300px}
  .guide-article h2{font-size:45px}
  .guide-article p{font-size:15px}
  .guide-pullquote{font-size:23px}
  .guide-curve{margin-left:-7px;margin-right:-7px}
  .prompt-card{font-size:20px}
}

@media(prefers-reduced-motion:reduce){
  .hero::after{display:none}
  .hero-media img{animation:none;transform:scale(1.02)}
  .copper-kettle{animation:none;transform:none;filter:none}
  .scroll-watch,.scroll-watch.in-view{opacity:1;transform:none;animation:none}
}