/* Phone layout: the product gets its own space; text and touch controls follow normal flow. */
.mobile-back-top{display:none}
.flavor-dots>button>span{display:none}
@media(max-width:600px){
 html{scroll-padding-top:22px;-webkit-text-size-adjust:100%;text-size-adjust:100%}
 body{overflow-x:clip}
 button,a{-webkit-tap-highlight-color:transparent}
 .wrap{width:88vw}
 .top{height:calc(74px + env(safe-area-inset-top));padding:calc(12px + env(safe-area-inset-top)) 6vw 12px;gap:15px}
 .brand-logo{width:76px;height:46px}.top nav{gap:15px;flex-wrap:nowrap;max-width:none}.top nav a{font-size:12px;min-height:46px;min-width:44px;white-space:nowrap;display:flex;align-items:center;justify-content:center}
 .hero-story{height:auto;min-height:0}
 .hero-sticky{position:relative;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;height:auto;min-height:0;padding:calc(105px + env(safe-area-inset-top)) 6vw 27px;overflow:hidden}
 .hero-copy{padding:0;z-index:3;width:100%}.hero-copy .eyebrow{font-size:10px;line-height:1.4;letter-spacing:.09em;margin-bottom:19px;gap:10px}
 .hero-copy h1{font-size:clamp(51px,13.9vw,64px);line-height:.91;letter-spacing:0;padding-right:8px;max-width:100%}
 .hero-copy>p{font-size:13px;line-height:1.65;margin-top:19px;max-width:none;color:#c0c9b6}
 .hero-copy .concept-mark{font-size:9px;line-height:1.5;letter-spacing:.06em;margin-top:12px;color:#a0ae90}
 .hero-stage{position:relative;inset:auto;flex:0 0 auto;width:100vw;height:clamp(305px,84vw,385px);min-height:0;margin:13px -6vw 0;overflow:hidden}
 .hero-stage[data-render-state=fallback] .hero-fallback{inset:0;width:100%;height:100%;object-fit:contain;object-position:center}
 .hero-ghost{font-size:54vw;right:5%;bottom:25%;opacity:.25}
 .hero-picker{position:relative;inset:auto;display:block;margin:7px 0 0;width:100%;z-index:4}
 .hero-picker-heading{align-items:center;margin-bottom:14px;gap:12px}
 .hero-picker-heading>span:first-child{font-size:26px;line-height:1.05;letter-spacing:.01em}
 .hero-picker-heading>span:last-child{font-size:11px;color:#a5b397;flex-shrink:0;letter-spacing:.06em}
 .hero-flavor-buttons{gap:8px}.hero-flavor-buttons button{font-size:12px;min-height:49px;border-radius:9px;gap:7px;border-color:#4a573f;background:#10160eed}.hero-flavor-buttons i{width:6px;height:6px}
 .hero-swipe-hint{font-size:11px;line-height:1.5;margin-top:13px;color:#9cae8b;letter-spacing:0}
 .hero-bottom{position:relative;inset:auto;justify-content:center;margin:23px 0 0;gap:0}
 .hero-bottom .scroll-cue{font-size:10px;line-height:1.5;gap:10px;color:#b1bd9f;max-width:none}.hero-bottom .scroll-cue>span{font-size:17px}
 .hero-flavors,.hero-index{display:none}
 .manifesto{padding:53px 0 37px}.manifesto h2{font-size:clamp(45px,12.2vw,58px);line-height:.98;overflow-wrap:normal}
 .manifesto-bottom{margin:27px 0 32px;gap:19px}.manifesto-bottom p{font-size:14px;line-height:1.8;max-width:none;color:#b9c3ad}
 .brand-ribbon{font-size:clamp(25px,7.3vw,34px);letter-spacing:.01em;gap:10px;padding:20px 0}
 .eyebrow{font-size:10px;line-height:1.45;letter-spacing:.1em;margin-bottom:19px}
 .flavor-section{padding:46px 0 40px}.section-heading{margin-bottom:27px}.section-heading h2{font-size:clamp(46px,12.8vw,61px);line-height:.96}
 .section-heading>p{font-size:14px;line-height:1.7;max-width:none;margin-top:21px}
 .flavor-carousel-hint{font-size:11px;line-height:1.5;margin-bottom:18px;color:#b2bfa2}
 .flavor-grid{width:100vw;margin-left:-6vw;padding:0 6vw 6px;gap:13px;scroll-padding:6vw}
 .flavor-card{flex-basis:86vw;border-color:#38472d;border-radius:14px;background:#0c110b}
 .flavor-image{aspect-ratio:1/1.02}.flavor-image img{height:111%;object-position:center top}
 .flavor-info{padding:23px 21px 27px}.flavor-number b{font-size:30px}.flavor-number>span{font-size:10px;letter-spacing:.08em;padding-left:12px}
 .flavor-info h3{font-size:40px;line-height:1.02;max-width:13ch;margin:16px 0 21px}
 .flavor-quote{font-size:26px;line-height:1.15;padding-left:13px}
 .flavor-description{font-size:14px;line-height:1.75;margin-top:21px;color:#b2bea6;max-width:none}
 .flavor-dots{display:grid;grid-template-columns:1fr 1fr 1fr auto;align-items:center;gap:7px;margin-top:16px}
 .flavor-dots>button{width:auto;min-width:0;min-height:46px;height:auto;padding:10px 1px;border-bottom:2px solid #36452b;border-radius:0;font:500 12px var(--font-text);color:#aebb9c;text-align:center}
 .flavor-dots>button::before{display:none}.flavor-dots>button>span{display:inline}
 .flavor-dots>button[aria-pressed=true]{border-color:var(--lime);color:var(--lime);font-weight:700}
 .flavor-dots>span{font-size:10px;letter-spacing:0;margin-left:9px;white-space:nowrap;color:#a7b895}
 .section-note,.flavor-section .section-note,.recipe-section .section-note{font-size:11px;line-height:1.75;margin-top:22px;color:#9eac91;max-width:none}
 .recipe-section{padding:47px 0 48px}.recipe-section .section-heading{margin-bottom:29px}.recipe-grid{border-color:#3a4a30}
 .recipe-item{border-color:#3a4a30;transition:background-color .2s}.recipe-item[open]{background:linear-gradient(90deg,#b9f0000a,transparent)}
 .recipe-item summary{min-height:77px;padding:8px 2px;gap:13px}.recipe-item summary>span{font-size:25px;width:26px;color:#91a975}
 .recipe-item summary h3{font-size:19px;line-height:1.3;letter-spacing:-.025em}.recipe-item summary>i{margin-left:2px;font-size:23px}
 .recipe-item>p{font-size:14px;line-height:1.8;max-width:none;padding:0 12px 26px 41px;color:#b3bfa6}
 /* Keep the scroll assembly, but let its caption, model and footnote size themselves. */
 .assembly{height:235svh}
 .assembly-sticky{display:grid;grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr) auto;align-items:stretch;gap:11px;height:100svh;min-height:620px;padding:25px 6vw 20px;overflow:hidden}
 .assembly-copy{position:relative;padding:0;max-width:none;align-self:start}
 .assembly-copy .eyebrow{font-size:10px;margin:0 0 14px}.assembly-copy h2{font-size:clamp(42px,11.8vw,53px);line-height:.96;letter-spacing:0;max-width:100%;margin:0}
 .assembly-phase{position:relative;inset:auto;min-height:68px;max-width:none;margin:20px 0 0}
 .assembly-phase strong{font-size:17px;line-height:1.3;margin-bottom:7px}.assembly-phase span{font-size:12px;line-height:1.6;max-width:34ch}
 .assembly-stage{position:relative;inset:auto;height:100%;min-height:0;min-width:0;margin:0 -6vw;width:100vw;align-self:stretch}
 .assembly-part{font-size:10px;line-height:1.3}
 .assembly-bottom{position:relative;inset:auto;display:block;margin:0;padding:0;align-self:end}
 .assembly-progress{width:100%;margin:0 0 12px}.assembly-progress span{font-size:10px;letter-spacing:.08em;margin-bottom:8px}
 .assembly-note{font-size:10px;line-height:1.65;max-width:none;color:#a0ac93}
 /* The breakfast photograph gets a full panel instead of being hidden behind copy. */
 .occasion{display:flex;flex-direction:column;align-items:stretch;min-height:0;overflow:hidden;background:#0b0d0b}
 .occasion:after{display:none}
 .occasion-copy{order:0;position:relative;inset:auto;margin:0;max-width:none;width:auto;padding:43px 6vw 24px}
 .occasion-copy .eyebrow{font-size:10px;margin-bottom:18px}.occasion-copy h2{font-size:clamp(51px,14.2vw,65px);line-height:.96}
 .occasion-copy>p{font-size:14px;line-height:1.75;margin-top:23px}.occasion-tags{margin:24px 0 17px;gap:8px}.occasion-tags span{font-size:11px;padding:9px 11px;border-radius:5px}
 .occasion-copy small{font-size:10px;line-height:1.6;color:#a0ad93}
 .occasion-visual{order:1;position:relative;inset:auto;aspect-ratio:1/1.06;width:100%;overflow:hidden}
 .occasion-visual img{width:100%;height:100%;object-fit:cover;object-position:100% center}
 .occasion-visual:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#0b0d0b 0%,transparent 14%,transparent 86%,#0b0d0b 95%,#0b0d0b 100%);pointer-events:none}
 .kit-sticky{padding:38px 0 29px}.kit-heading{padding:0 6vw}.kit-heading .eyebrow{font-size:10px;margin-bottom:17px}
 .kit-heading h2{font-size:clamp(42px,11.9vw,56px);line-height:.94;max-width:none;letter-spacing:0}
 .kit-stage{height:clamp(218px,58vw,270px);margin:24px 0 0;overflow:hidden}
 .kit-view-badge{font-size:9px;letter-spacing:.08em;right:6vw;top:1px;padding:4px 7px}
 .kit-stage[data-zoomed=true]{height:clamp(370px,113vw,480px)}
 .kit-zoom-controls{margin:14px 6vw 0;gap:12px}.kit-zoom-stepper{border-radius:9px;flex-shrink:0}
 .kit-zoom-controls button{min-height:48px;font-size:12px;padding:10px 12px;border-radius:9px}
 .kit-zoom-stepper button{width:44px;font-size:25px;padding:0;border-radius:0}.kit-zoom-stepper output{min-width:48px;font-size:13px;font-weight:500}
 .kit-flavor-caption{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:17px 6vw 22px}
 .kit-flavor-caption>button{display:flex;flex-direction:column;justify-content:space-between;align-items:center;gap:9px;min-height:90px;padding:12px 5px 10px;white-space:normal;text-align:center;border:1px solid #394a2d;border-radius:10px;background:#11190ed9;color:#e2e9d7;letter-spacing:0}
 .kit-focus-name{position:relative;display:block;font-size:12px;font-weight:600;line-height:1.35;width:100%;padding-top:9px}
 .kit-focus-name>i{position:absolute;width:5px;height:5px;top:0;left:calc(50% - 2.5px);margin:0}
 .kit-flavor-caption small{font-size:10px;line-height:1.35;font-weight:400;color:#a2b690}
 .kit-flavor-caption>button[aria-pressed=true]{border-color:#9db94c;background:#26351a;color:#fff}.kit-flavor-caption>button[aria-pressed=true] small{color:#c1f000}
 .kit-bottom{margin:0 6vw;gap:17px 10px;grid-template-columns:minmax(0,1fr) auto}
 .kit-gesture{font-size:11px;line-height:1.5;min-height:46px;padding:2px 0 0;max-width:none}
 .kit-gesture .kit-pinch-hint{font-size:10px;line-height:1.5;max-width:150px;margin-top:5px;color:#a3b78f}
 .kit-control-row{align-self:start}.kit-buttons{gap:7px}.kit-buttons button{font-size:12px;min-height:46px;padding:10px 15px;border-radius:9px}
 .kit-progress span{font-size:10px;letter-spacing:.08em;margin-bottom:10px}.kit-note{font-size:10px;line-height:1.65;color:#a0ae91;max-width:none}
 .closing{padding:57px 0 49px}.closing h2{font-size:clamp(51px,14vw,65px);line-height:.97}.closing p{font-size:14px;line-height:1.75;margin-top:25px}.closing-line{margin-top:29px}
 footer{padding:29px 6vw calc(24px + env(safe-area-inset-bottom));gap:23px}
 .footer-brand strong{font-size:30px}.footer-brand span{font-size:12px}footer p{font-size:11px;line-height:1.8;max-width:none;color:#9fab93}
 .mobile-back-top{display:flex;justify-content:space-between;align-items:center;min-height:48px;border-top:1px solid #34432b;padding-top:14px;color:#d0dfbe;font-size:12px;line-height:1.4}.mobile-back-top>span{font-size:21px;color:#c1f000}
}
@media(max-width:360px){
 .top nav{gap:11px}.top nav a{font-size:11px}.brand-logo{width:69px}
 .hero-copy h1{font-size:50px}.hero-copy>p{font-size:12px}.hero-copy .eyebrow{font-size:9px}
 .hero-stage{height:305px}.hero-flavor-buttons button{font-size:11px}.hero-picker-heading>span:first-child{font-size:24px}
 .flavor-info{padding-inline:18px}.flavor-info h3{font-size:37px}.flavor-quote{font-size:25px}
 .assembly-sticky{padding-top:22px;gap:9px}.assembly-copy h2{font-size:41px}.assembly-phase{margin-top:17px}.assembly-phase strong{font-size:16px}.assembly-phase span{font-size:11px}.assembly-note{font-size:9px}
 .kit-focus-name{font-size:11px}.kit-flavor-caption small{font-size:9px}.kit-buttons button{font-size:11px;padding-inline:12px}.kit-gesture{font-size:10px}.kit-gesture .kit-pinch-hint{font-size:9px}
 .kit-zoom-controls button{font-size:11px}.kit-zoom-stepper button{font-size:25px}
}
@media(prefers-reduced-motion:reduce) and (max-width:600px){
 .assembly{height:auto}.assembly-sticky{position:relative;height:760px;min-height:0}
 .recipe-item{transition:none}
}