/* Responsive spacing audit: reserve room for glyphs, copy and controls. */
.hero-copy h1{line-height:1.12;letter-spacing:-.03em}
h2,.story-heading h2,.macro-copy h2,.assembly-heading h2,.flavour-heading h2,.early-intro h2{line-height:1.1;letter-spacing:-.025em}
.story-lead{line-height:1.18}
.habit h2{line-height:1.14;letter-spacing:-.05em}
.flavour-heading>div,.early-intro,.order-panel,.flavour-layout>*{min-width:0}
.flavour-heading{gap:30px}.flavour-heading>p{margin-left:0}
.flavour-tab>span:nth-child(2){min-width:0}
.flavour-tab strong{letter-spacing:-.035em}
.order-panel select{max-width:100%;text-overflow:ellipsis}
.primary-order-label{min-width:0;line-height:1.5}
.hero-brandline{pointer-events:none}
@media(min-width:701px) and (max-width:1050px){
 .hero-copy{max-width:57vw}.hero-copy h1{font-size:8vw}
 .hero-brandline{right:5%;top:19%;font-size:8px}
 .flavour-heading h2{font-size:7.2vw}
 .flavour-heading>p{max-width:210px;flex-shrink:1}
 .flavour-tab,.flavour-tab:last-child{grid-template-columns:30px minmax(0,1fr) 18px;gap:9px;padding-left:10px;padding-right:10px}
 .flavour-tab.active{padding-left:10px}
 .flavour-tab strong{font-size:clamp(22px,2.8vw,29px)}
 .early-access{gap:5vw}.order-panel{padding:24px 22px}.primary-order{padding:16px;font-size:14px;gap:10px}
}
@media(max-width:700px){
 .hero-copy h1{font-size:clamp(46px,13.5vw,62px)}
 .hero-copy p{line-height:1.6}
 .hero-art{top:46%}
 .hero-brandline{font-size:8px;right:4vw}
 .flavour-heading{gap:0}
 .early-intro h2{font-size:clamp(43px,12vw,62px)}
 .story-heading h2{font-size:clamp(49px,14vw,74px)}
 .story-heading h2 em{text-underline-offset:.13em}
 .assembly-heading h2{font-size:clamp(32px,9.6vw,48px)}
 .ingredient-legend{max-width:88%;margin:auto}
}
@media(max-width:700px) and (max-height:680px){
 .hero-copy{top:102px}.hero-copy h1{font-size:43px;line-height:1.1}
 .hero-copy .eyebrow{margin-bottom:12px}.hero-copy p{font-size:13px;margin:12px 0 8px}
 .hero-actions{gap:18px}.hero-actions .text-link{font-size:13px}
 .hero-art{inset:53% -22% 7% -22%}
 .macro-copy h2{font-size:58px}.macro-copy .section-index{margin-bottom:20px}
 .macro-caption{margin-top:20px}
 .callout-1,.callout-2{top:39%}
}
@media(max-height:500px) and (min-width:701px) and (max-width:1000px){
 .hero-copy{top:88px;left:5vw;right:auto;width:48vw;max-width:48vw}
 .hero-copy h1{font-size:43px;line-height:1.08}
 .hero-copy .eyebrow{margin-bottom:9px;font-size:9px}
 .hero-copy p{font-size:12px;line-height:1.5;margin:12px 0 6px}
 .hero-actions{gap:18px}.hero-actions .text-link,.hero-flavours{min-height:44px;font-size:12px}
 .hero-brandline{display:none}.hero-art{inset:12% -13% 3% 40%}
 .hero-bottom{bottom:7px}.scroll-cue{min-height:44px}.scroll-line{display:none}
 .macro-copy{top:38px;max-width:48%;}.macro-copy .section-index{margin-bottom:15px}
 .macro-copy h2{font-size:60px}.macro-caption{font-size:12px;margin-top:18px}
 .assembly-heading{top:22px}.assembly-heading h2{font-size:42px}
 .assembly-heading .section-index{margin-bottom:12px}.callout-1,.callout-2{top:43%}
 .callout-3,.callout-4{bottom:14%}.ingredient-legend{font-size:9px;gap:12px}
}
@media(min-width:701px) and (max-width:900px) and (min-height:800px){
 .hero-copy{top:170px;left:7vw;width:85vw;max-width:85vw}
 .hero-copy h1{font-size:70px}
 .hero-art{inset:43% -10% 4% 8%}
 .hero-brandline{top:15%;right:7%}
}
