/* Oscar's Fresh Mex: home page (sunny + juicy) */

/* ---------- loader ---------- */
.loader{position:fixed;inset:0;z-index:200;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(14px,3vh,30px);background:var(--canvas);transition:transform 1s var(--ease-io) .2s,visibility 0s 1.3s}
html:not(.js) .loader{display:none}
.loader-mark{position:relative;width:min(58vmin,600px);aspect-ratio:761/874;transition:transform 1.1s var(--ease-io),opacity .8s var(--ease-out);animation:mark-in 1s var(--ease-out) both}
@keyframes mark-in{from{transform:scale(.86) rotate(-6deg);opacity:0}to{transform:none;opacity:1}}
.loader-mark img{position:absolute;inset:0;width:100%;height:100%}
.o-dim{filter:grayscale(1) brightness(.2) contrast(.6);opacity:.12}
.o-fill{position:absolute;inset:0;clip-path:inset(calc(100% - var(--p,0) * 100%) 0 0 0)}
.o-line{position:absolute;left:-6%;right:-6%;height:3px;border-radius:3px;top:calc(100% - var(--p,0) * 100%);background:var(--accent);box-shadow:0 0 18px 4px rgba(227,22,29,.35);opacity:calc(1 - var(--p,0) * var(--p,0));transform:translateY(-50%)}
.o-fill img{filter:none}
.loader-mark::after{content:"";position:absolute;left:18%;right:18%;bottom:-6%;height:8%;border-radius:50%;background:radial-gradient(closest-side,rgba(120,40,10,.22),rgba(120,40,10,0));filter:blur(6px)}
.loader-row{position:relative;display:flex;gap:22px;align-items:baseline;transition:opacity .5s}
.loader-tag{font-family:var(--f-hand);font-size:clamp(30px,3.6vmin,46px);color:var(--accent)}
.loader-pct{font-size:14px;font-weight:700;color:var(--ink);min-width:4ch;text-align:right;font-variant-numeric:tabular-nums}
.loader.out{transform:translateY(-100%);visibility:hidden}
.loader.out .loader-mark{transform:scale(2.4);opacity:0}
.loader.out .loader-row{opacity:0}
.loader-curtain{position:absolute;left:0;right:0;bottom:-90px;height:90px;background:var(--canvas);border-radius:0 0 50% 50%/0 0 100% 100%}

/* ---------- hero ---------- */
.hero{height:440vh;background:var(--canvas)}
.stage{position:sticky;top:0;height:100vh;overflow:hidden;background:#f6e7cf}
.poster{position:absolute;inset:0;background:#f6e7cf center/cover no-repeat}
#heroVideo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .7s var(--ease-out);will-change:transform;transform:translateZ(0)}
.video-ready #heroVideo{opacity:1}
.video-failed #heroVideo{display:none}
.scrim{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(255,246,230,.35) 0%,rgba(255,246,230,0) 26%,rgba(255,246,230,0) 74%,rgba(255,246,230,.3) 100%)}
.vignette{position:absolute;inset:auto 0 0 0;height:16%;pointer-events:none;background:linear-gradient(180deg,rgba(255,248,236,0),var(--canvas))}

.stage .band{position:absolute;top:50%;z-index:3;width:min(25vw,430px);opacity:0;transform:translateY(-50%);pointer-events:none}
.stage .band.live{pointer-events:auto}
.stage .band::before{content:"";position:absolute;top:-60%;bottom:-60%;left:calc(-1 * var(--gutter) - 2px);width:calc(100% + var(--gutter) + 24vw);z-index:-1;pointer-events:none;opacity:calc(.35 + .65 * var(--k,1));background:radial-gradient(ellipse 72% 58% at 24% 50%,rgba(255,247,232,.96) 0%,rgba(255,247,232,.92) 42%,rgba(255,247,232,.6) 66%,rgba(255,247,232,0) 100%);filter:blur(22px)}
.stage .b-right::before{left:auto;right:calc(-1 * var(--gutter) - 2px);background:radial-gradient(ellipse 72% 58% at 76% 50%,rgba(255,247,232,.96) 0%,rgba(255,247,232,.92) 42%,rgba(255,247,232,.6) 66%,rgba(255,247,232,0) 100%)}
.stage .b-left{left:var(--gutter);width:min(31vw,600px)}
.stage .b-right{right:var(--gutter);top:13%;transform:none;width:min(27vw,520px)}
.band-kicker{margin:0 0 14px;font-size:clamp(26px,2.3vw,38px)!important;opacity:clamp(0,calc(var(--k,0) * 2),1)}
.band-h{font-family:var(--f-display);font-weight:800;letter-spacing:-.045em;line-height:.9;margin:0;font-size:clamp(64px,7.6vw,150px);color:var(--ink)}
.band-h .w:last-child{color:var(--accent)}
.stage .b-right .band-h{font-size:clamp(56px,6.4vw,124px)}
.band-p{margin:24px 0 0;font-size:clamp(18px,1.55vw,25px);line-height:1.45;color:var(--ink);font-weight:500;max-width:28ch;opacity:clamp(0,calc((var(--k,0) - .45) * 2.4),1);transform:translateY(calc((1 - clamp(0,calc((var(--k,0) - .45) * 2.4),1)) * 14px))}
.stage .b-settle{top:auto;bottom:clamp(50px,8vh,100px);transform:none;width:min(29vw,560px)}
.stage .b-settle .band-h{font-size:clamp(50px,5vw,96px)}
.deal-price{margin:8px 0 0;font-family:var(--f-display);font-weight:800;letter-spacing:-.05em;font-size:clamp(120px,12.5vw,240px);line-height:.82;color:var(--accent);--ks:clamp(0,calc((var(--k,0) - .55) * 3.2),1);opacity:var(--ks);transform:translateY(calc((1 - var(--ks)) * 26px)) rotate(calc((1 - var(--ks)) * -6deg));transform-origin:left bottom}
.deal-price .cur{font-size:.42em;vertical-align:.95em;margin-right:.04em}
.deal-price .cents{font-size:.42em;vertical-align:.95em}
.band-cta{display:flex;flex-wrap:wrap;gap:14px;margin-top:26px}
.b-settle .band-cta{--kb:clamp(0,calc((var(--k,0) - .74) * 4.4),1);opacity:var(--kb);transform:translateY(calc((1 - var(--kb)) * 18px))}
.stage .b-chip{top:auto;bottom:clamp(60px,10vh,120px);transform:none;width:auto;max-width:290px}
.stage .b-chip::before{display:none}
.chip-note{display:flex;gap:12px;align-items:center;margin:0;padding:14px 18px;border-radius:18px;background:#fff;box-shadow:0 18px 40px -20px rgba(90,35,15,.5);font-size:15px;font-weight:600;line-height:1.4;--kc:clamp(0,calc(var(--k,0) * 2),1);transform:rotate(2deg) translateX(calc((1 - var(--kc)) * 20px))}
.chip-note .dot{flex:none;width:12px;height:12px;border-radius:50%;background:var(--jalapeno);box-shadow:0 0 0 5px rgba(47,138,62,.18)}

/* split text */
.w{display:inline-block;white-space:nowrap}
.c{display:inline-block}
.fx-drift .w{--kc:clamp(0,calc((var(--k,0) - var(--th,0)) * 2.8),1);opacity:var(--kc);transform:translateY(calc((1 - var(--kc)) * -.5em)) rotate(calc((1 - var(--kc)) * -4deg))}
.fx-scatter .c{--kc:clamp(0,calc((var(--k,0) - var(--th,0)) * 2.6),1);opacity:var(--kc);transform:translate(calc((1 - var(--kc)) * var(--jx,0px)),calc((1 - var(--kc)) * var(--jy,0px))) rotate(calc((1 - var(--kc)) * var(--jr,0deg)))}
.fx-rise .w{--kc:clamp(0,calc((var(--k,0) - var(--th,0)) * 3),1);opacity:var(--kc);transform:translateY(calc((1 - var(--kc)) * .6em))}

.static-copy{display:none}
.cue{position:absolute;left:50%;bottom:26px;z-index:4;display:flex;flex-direction:column;align-items:center;gap:6px;transform:translateX(-50%);transition:opacity .6s var(--ease-out)}
.cue.gone{opacity:0}
.ring{width:42px;height:42px;transform:rotate(-90deg)}
.ring circle{fill:none;stroke-width:3}
.ring-bg{stroke:rgba(43,19,12,.15)}
.ring-fg{stroke:var(--accent);stroke-linecap:round;transition:stroke-dashoffset .2s linear}
.cue-label{font-family:var(--f-hand);font-size:20px;color:var(--ink)}
.cue .chev{width:42px;height:42px;display:grid;place-items:center;color:var(--ink);animation:chev 2.4s var(--ease-io) infinite;animation-delay:-.6s}
@keyframes chev{0%,100%{transform:translateY(0)}50%{transform:translateY(7px)}}
.progress-rail{display:none}

@media (max-width: 720px), (orientation: portrait) and (max-width: 1024px), (orientation: portrait) and (pointer: coarse), (orientation: landscape) and (pointer: coarse) and (max-height: 560px), (prefers-reduced-motion: reduce){
  .hero{height:auto}
  .stage{position:relative;height:auto;min-height:100vh;min-height:100svh;display:flex;align-items:flex-end}
  .poster{background-image:url('/assets/video/hero-ending.jpg');background-position:50% 35%}
  #heroVideo,.stage .band,.cue,.progress-rail{display:none}
  .scrim{background:linear-gradient(180deg,rgba(255,248,236,.0) 0%,rgba(255,248,236,0) 38%,rgba(255,248,236,.86) 62%,var(--canvas) 84%)}
  .static-copy{position:relative;z-index:3;display:flex;flex-direction:column;gap:16px;padding:0 var(--gutter) clamp(40px,7vh,80px);max-width:720px}
  .static-copy .static-h{margin:0;font-size:clamp(56px,15vw,112px);color:var(--ink)}
}
@media (max-height:560px){.cue{display:none}}

/* ---------- the lineup: one smooth scrubbed stage ---------- */
.lineup{height:calc(100vh + 8 * 75vh)}
.lu-stage{--lu-bg:#ffc83d;--lu-ink:#2b130c;position:sticky;top:0;height:100vh;overflow:hidden;background:var(--lu-bg);color:var(--lu-ink);isolation:isolate}
.lu-stage::after{content:"";position:absolute;inset:0;z-index:-1;opacity:.06;mix-blend-mode:multiply;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.lu-clouds,.lu-steam{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.lu-clouds{z-index:-1}
.lu-steam{z-index:1}
.lu-head{position:absolute;left:var(--gutter);right:var(--gutter);top:calc(var(--nav-h) + 24px);display:flex;justify-content:space-between;align-items:center}
.lu-kicker{color:var(--lu-ink)!important;font-size:30px!important}
.lu-count{font-size:15px;font-weight:700;font-variant-numeric:tabular-nums}
.lu-dish{position:absolute;right:calc(var(--gutter) + min(17vw,270px));top:55%;width:min(36vw,56vh,540px);aspect-ratio:1;transform:translate(50%,-50%)}
.dish-img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 34px 34px rgba(80,30,10,.32)) drop-shadow(0 8px 10px rgba(80,30,10,.18));opacity:0;will-change:transform,opacity}
.lu-info{position:absolute;z-index:2;left:var(--gutter);top:54%;transform:translateY(-50%);width:min(50vw,760px);height:min(64vh,560px)}
.lu-card{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;opacity:0;will-change:transform,opacity;pointer-events:none}
.lu-card.live{pointer-events:auto}
.lu-cat{font-family:var(--f-hand);font-size:clamp(28px,2.5vw,40px);margin:0 0 6px;transform:rotate(-2deg);transform-origin:left}
.lu-name{font-family:var(--f-display);font-weight:800;letter-spacing:-.045em;font-size:clamp(66px,8vw,156px);line-height:.86;margin:0 0 24px}
.lu-desc{margin:0 0 30px;font-size:clamp(19px,1.65vw,26px);line-height:1.45;font-weight:500;max-width:32ch;opacity:.92}
.lu-row{display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.lu-price{margin:0;font-family:var(--f-display);font-weight:800;letter-spacing:-.03em;font-size:clamp(42px,3.8vw,64px)}
.lu-price small{font-family:var(--f-body);font-size:.42em;font-weight:600;letter-spacing:0;margin-left:6px;opacity:.75}
.lu-nav{position:absolute;right:var(--gutter);bottom:34px;display:flex;gap:12px}
.lu-arrow{display:grid;place-items:center;width:58px;height:58px;border-radius:50%;border:0;background:#fff;color:var(--ink);cursor:pointer;box-shadow:0 12px 24px -12px rgba(43,19,12,.45);transition:transform .45s var(--ease-back),box-shadow .3s}
.lu-arrow:hover{transform:translateY(-3px)}
.lu-arrow:active{transform:scale(.95)}
.lu-arrow svg{width:22px;height:22px}
.lu-rail{position:absolute;left:var(--gutter);bottom:40px;display:flex;gap:8px;list-style:none;margin:0;padding:0}
.lu-rail button{width:12px;height:12px;border-radius:50%;border:0;padding:0;background:var(--lu-ink);opacity:.25;cursor:pointer;transition:opacity .3s,width .4s var(--ease-out)}
.lu-rail button:hover{opacity:.6}
.lu-rail button[aria-current="true"]{opacity:1;width:34px;border-radius:999px}
@media (pointer:coarse){.lu-rail button{width:16px;height:16px}.lu-rail button[aria-current="true"]{width:40px}.lu-rail{gap:12px}}
@media (max-width:900px),(pointer:coarse) and (orientation:portrait),(prefers-reduced-motion:reduce){
  .lineup{height:auto}
  .lu-stage{position:relative;height:auto;min-height:100svh;padding:calc(var(--nav-h) + 16px) var(--gutter) 110px;display:flex;flex-direction:column;transition:background-color .7s var(--ease-out)}
  .lu-head{position:relative;left:auto;right:auto;top:auto}
    .lu-dish{position:relative;right:auto;top:auto;transform:none;width:min(86vw,460px);margin:10px auto 0;touch-action:pan-y}
  .lu-info{position:relative;left:auto;top:auto;transform:none;width:auto;height:auto;display:grid;margin-top:16px}
  .lu-card{position:relative;grid-area:1/1;inset:auto}
  .lu-name{font-size:clamp(46px,12vw,72px)}
  .lu-nav{right:var(--gutter);bottom:30px}
  .lu-rail{bottom:50px}
}

/* ---------- heat (press and hold) ---------- */
.heat{--heat:0;padding:clamp(100px,12vw,170px) 0;overflow:hidden;isolation:isolate;background:var(--canvas);transition:color .6s var(--ease-out)}
.heat-glow{position:absolute;inset:0;z-index:-1;opacity:var(--heat);background:radial-gradient(70% 80% at 70% 50%,#ff3b24 0%,#e3161d 45%,#b30f15 100%)}
.heat.hot{color:var(--on-red)}
.heat.hot .lede,.heat.hot .heat-hint{color:rgba(255,248,236,.88)}
.heat.hot .kicker{color:var(--sun)}
.heat-sparks{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.spark{position:absolute;bottom:-10px;width:var(--s,6px);height:var(--s,6px);border-radius:50%;background:radial-gradient(circle,#fff6c8,#ffc83d 55%,rgba(255,140,30,0) 72%);animation:spark-rise var(--d,1.8s) var(--ease-out) forwards}
@keyframes spark-rise{0%{transform:translate3d(0,0,0);opacity:0}15%{opacity:1}100%{transform:translate3d(var(--x,0px),calc(-1 * var(--h,60vh)),0) scale(.2);opacity:0}}
.heat-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(30px,5vw,80px);align-items:center}
.heat-copy{position:relative;display:grid}
.heat-before,.heat-after{grid-area:1/1;transition:opacity .8s var(--ease-out),transform 1s var(--ease-out)}
.heat-after{opacity:0;transform:translateY(30px) scale(.98);pointer-events:none}
.heat.done .heat-before{opacity:0;transform:translateY(-30px) scale(.98);pointer-events:none}
.heat.done .heat-after{opacity:1;transform:none;pointer-events:auto}
.heat-h{font-size:clamp(54px,7vw,120px);margin:12px 0 22px}
.heat .lede{transition:color .6s}
.heat-after .btn{margin-top:30px}
.heat-after .btn{--g1:#ffd25a;--g2:#f5b622;--glow:rgba(120,20,10,.5);color:var(--ink)}
.heat-after .btn .arr{background:var(--ink);color:var(--sun)}
.heat-ctl{display:flex;flex-direction:column;align-items:center;gap:18px;position:relative}
.heat-btn{--sx:0px;--sy:0px;position:relative;width:min(400px,78vw);aspect-ratio:1;border-radius:50%;border:0;padding:0;cursor:pointer;background:radial-gradient(circle at 50% 38%,#fff,#fff1d6 70%);box-shadow:0 10px 0 rgba(43,19,12,.12),0 40px 70px -30px rgba(120,40,10,.55),inset 0 0 0 1px rgba(43,19,12,.08);display:grid;place-items:center;transform:translate(var(--sx),var(--sy)) scale(calc(1 + var(--heat) * .04));transition:box-shadow .4s;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.heat-btn img{width:76%;height:auto;pointer-events:none;filter:drop-shadow(0 24px 24px rgba(80,30,10,.35));transform:rotate(calc(var(--heat) * 10deg)) scale(calc(1 + var(--heat) * .07))}
.heat-ring{position:absolute;inset:-16px;width:calc(100% + 32px);height:calc(100% + 32px);transform:rotate(-90deg);pointer-events:none}
.heat-ring circle{fill:none;stroke-width:6}
.hr-bg{stroke:rgba(43,19,12,.1)}
.heat.hot .hr-bg{stroke:rgba(255,248,236,.25)}
.hr-fg{stroke:var(--sun);stroke-linecap:round;stroke-dasharray:590.6;stroke-dashoffset:calc(590.6 * (1 - var(--heat)))}
.heat-label{position:absolute;bottom:11%;left:50%;transform:translateX(-50%) rotate(-3deg);padding:8px 18px;border-radius:999px;background:var(--accent);color:#fff;font-family:var(--f-hand);font-size:22px;box-shadow:0 10px 20px -8px rgba(179,15,21,.6);pointer-events:none;white-space:nowrap}
.heat-hint{margin:0;font-size:15px;font-weight:600;color:var(--text-secondary);transition:color .6s}
.gauge{display:flex;gap:8px;list-style:none;margin:6px 0 0;padding:0;font-size:13.5px;font-weight:700}
.gauge li{padding:8px 14px;border-radius:999px;background:rgba(43,19,12,.06);transition:background-color .4s,color .4s,transform .4s var(--ease-back)}
.heat.hot .gauge li{background:rgba(255,248,236,.16)}
.gauge li.on{background:var(--sun)!important;color:var(--ink);transform:translateY(-2px)}
@media (max-width:860px){.heat-grid{grid-template-columns:1fr}.heat-ctl{order:-1}.gauge{flex-wrap:wrap;justify-content:center}}

/* ---------- proof: stickers ---------- */
.proof{padding:clamp(30px,5vw,70px) 0 clamp(80px,9vw,130px)}
.proof-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,2.4vw,34px)}
.stat{position:relative;aspect-ratio:1;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:12%;box-shadow:0 8px 0 rgba(43,19,12,.12),0 30px 50px -30px rgba(90,35,15,.5);transition:transform .6s var(--ease-back)}
.stat:hover{transform:rotate(0) scale(1.04)!important}
.stat:nth-child(1){background:var(--sun);transform:rotate(-6deg)}
.stat:nth-child(2){background:var(--sky);transform:rotate(4deg)}
.stat:nth-child(3){background:var(--accent);color:var(--on-red);transform:rotate(-3deg)}
.stat:nth-child(4){background:var(--lime);transform:rotate(5deg)}
.stat-n{margin:0;font-size:clamp(64px,7.4vw,124px);line-height:.85}
.stat-n small{font-size:.36em;margin-left:.04em}
.stat-l{margin:10px 0 0;font-family:var(--f-hand);font-size:clamp(17px,1.5vw,23px);line-height:1.15;max-width:14ch}
@media (max-width:800px){.proof-grid{grid-template-columns:1fr 1fr}}

/* ---------- story ---------- */
.story{background:var(--masa);color:var(--ink);padding:clamp(100px,12vw,170px) 0 clamp(80px,9vw,120px);overflow:hidden;border-radius:clamp(30px,4vw,60px);margin:0 clamp(8px,1.4vw,22px)}
.story-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,100px);align-items:center}
.story h2{font-size:clamp(52px,6.4vw,108px);margin:14px 0 28px;color:var(--ink)}
.story h2 .mask-line{display:block}
.story-p{max-width:46ch;color:var(--text-secondary);font-size:18px;margin:0 0 18px}
.story .btn{margin-top:14px}
.story-photos{position:relative;height:clamp(420px,46vw,620px)}
.pol{position:absolute;margin:0;width:clamp(200px,22vw,320px);padding:12px 12px 0;background:#fff;border-radius:6px;box-shadow:0 30px 60px -24px rgba(90,35,15,.45),0 2px 6px rgba(90,35,15,.15);transition:transform .9s var(--ease-out),box-shadow .9s var(--ease-out)}
.pol img{width:100%;aspect-ratio:1;object-fit:cover;filter:sepia(.06) saturate(1.05)}
.pol figcaption{font-family:var(--f-hand);font-size:clamp(19px,1.6vw,24px);line-height:1.15;color:#3a2a20;padding:12px 6px 16px;min-height:62px}
.pol.p1{left:2%;top:4%;transform:rotate(-7deg) translateY(var(--py,0px))}
.pol.p2{right:2%;top:0;transform:rotate(5deg) translateY(var(--py,0px))}
.pol.p3{left:28%;bottom:0;transform:rotate(-2deg) translateY(var(--py,0px));z-index:2}
.pol::before{content:"";position:absolute;left:50%;top:-12px;width:90px;height:26px;transform:translateX(-50%) rotate(-3deg);background:rgba(255,200,61,.75);box-shadow:0 2px 4px rgba(0,0,0,.08)}
.pol:hover{transform:rotate(0) translateY(-10px) scale(1.04);z-index:5}
.timeline{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;list-style:none;padding:0;margin-top:clamp(60px,8vw,110px)}
.timeline li{display:flex;flex-direction:column;gap:10px;padding:26px 26px 30px;border-radius:24px;background:#fff;box-shadow:0 20px 40px -28px rgba(90,35,15,.4)}
.tl-y{font-size:clamp(48px,5vw,84px);color:var(--accent)}
.tl-t{color:var(--text-secondary);max-width:28ch;font-weight:500}
@media (max-width:900px){.story-grid{grid-template-columns:1fr}.story-photos{height:clamp(420px,110vw,560px)}.pol{width:clamp(180px,48vw,280px)}.timeline{grid-template-columns:1fr}}

/* ---------- handmade ---------- */
.handmade{padding:clamp(100px,12vw,160px) 0}
.hm-head{display:grid;grid-template-columns:auto 1fr;align-items:end;gap:12px 50px;margin-bottom:clamp(30px,4vw,56px)}
.hm-head .kicker{grid-column:1/-1}
.hm-head h2{font-size:clamp(54px,7vw,124px);color:var(--ink)}
.hm-head .lede{justify-self:end;max-width:38ch}
.hm-frame{position:relative;border-radius:clamp(22px,3vw,36px);overflow:hidden;aspect-ratio:21/9;background:#f0dfc4;box-shadow:0 50px 90px -40px rgba(90,35,15,.55)}
.hm-frame video{width:100%;height:100%;object-fit:cover}
.hm-tags{position:absolute;left:20px;bottom:20px;display:flex;flex-wrap:wrap;gap:8px}
.hm-tags span{padding:8px 14px;border-radius:999px;background:#fff;color:var(--ink);font-size:13.5px;font-weight:700;box-shadow:0 6px 16px -8px rgba(0,0,0,.4)}
.hm-tags span:nth-child(1){transform:rotate(-2deg)}.hm-tags span:nth-child(3){transform:rotate(2deg)}
@media (max-width:800px){.hm-head{grid-template-columns:1fr}.hm-head .lede{justify-self:start}.hm-frame{aspect-ratio:4/3}}

/* ---------- locations ---------- */
.locs{padding:clamp(90px,11vw,150px) 0 clamp(80px,10vw,130px)}
.locs-head{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;flex-wrap:wrap;margin-bottom:30px}
.locs-head h2{font-size:clamp(54px,7vw,120px);margin:12px 0 18px}
.locs-tools{display:flex;flex-direction:column;align-items:flex-end;gap:10px}
.near-msg{margin:0;font-size:14.5px;font-weight:600;color:var(--text-secondary);min-height:1.4em;text-align:right}
#stateChips{margin-bottom:26px}
@media (min-width:1000px){.home-locs{grid-template-columns:repeat(3,1fr)}}
.locs-more{display:flex;justify-content:center;margin-top:44px}
@media (max-width:700px){.locs-tools{align-items:flex-start}.near-msg{text-align:left}}

/* ---------- join ---------- */
.join{padding:0 0 clamp(90px,11vw,150px)}
.join-card{display:grid;grid-template-columns:1.1fr 1fr;border-radius:clamp(26px,3vw,40px);overflow:hidden;background:var(--sky);box-shadow:0 30px 60px -36px rgba(20,70,110,.6)}
.join-card img{width:100%;height:100%;object-fit:cover;min-height:340px}
.join-copy{padding:clamp(34px,5vw,70px);display:flex;flex-direction:column;justify-content:center;gap:14px}
.join-copy h2{font-size:clamp(50px,5.6vw,96px)}
.join-copy .lede{color:#1f3c52}
.join-copy .btn{align-self:flex-start;margin-top:12px}
@media (max-width:820px){.join-card{grid-template-columns:1fr}}

/* ---------- final ---------- */
.final{position:relative;padding:clamp(120px,14vw,200px) 0 clamp(120px,13vw,190px);overflow:hidden;text-align:center;isolation:isolate;background:var(--accent);color:var(--on-red);border-radius:clamp(30px,4vw,60px);margin:0 clamp(8px,1.4vw,22px)}
.final::before{content:"";position:absolute;inset:0;z-index:-2;background:radial-gradient(50% 60% at 50% 40%,#ff4a36,rgba(227,22,29,0) 70%)}
.final-inner{display:flex;flex-direction:column;align-items:center;gap:20px}
.final-h{font-size:clamp(100px,18vw,300px);line-height:.85;display:flex;flex-wrap:wrap;justify-content:center;gap:0 .18em;letter-spacing:-.055em}
.final-h .red{color:var(--sun)}
.final .lede{text-align:center;color:rgba(255,248,236,.92)}
.picker{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;margin-top:10px;width:min(100%,660px)}
.select{position:relative;flex:1 1 300px}
.select::after{content:"";position:absolute;right:22px;top:50%;width:9px;height:9px;border-right:2.5px solid var(--ink);border-bottom:2.5px solid var(--ink);transform:translateY(-70%) rotate(45deg);pointer-events:none}
.select select{width:100%;min-height:58px;padding:0 50px 0 22px;border-radius:999px;border:0;background:#fff;color:var(--ink);font:600 16.5px var(--f-body);appearance:none;-webkit-appearance:none;cursor:pointer;box-shadow:0 14px 30px -16px rgba(60,10,5,.6)}
.picker .btn{min-height:58px;--g1:#ffd25a;--g2:#f5b622;--glow:rgba(120,20,10,.5);color:var(--ink)}
.picker .btn .arr{background:var(--ink);color:var(--sun)}
.picker-msg{min-height:1.4em;margin:0;font-size:14.5px;font-weight:600;color:rgba(255,248,236,.92)}
.final-dishes img{position:absolute;z-index:-1;filter:drop-shadow(0 30px 30px rgba(90,10,5,.45));animation:fd-float 9s ease-in-out infinite}
.fd1{width:clamp(170px,22vw,360px);left:-3%;top:8%;animation-delay:-2s}
.fd2{width:clamp(160px,20vw,330px);right:-3%;top:40%;animation-delay:-5s}
.fd3{width:clamp(70px,7vw,120px);left:10%;bottom:8%;animation-delay:-7s}
@keyframes fd-float{0%,100%{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-16px) rotate(3deg)}}
@media (max-width:700px){.fd1{left:-18%;top:2%;opacity:.55}.fd2{right:-22%;top:auto;bottom:2%;opacity:.55}.fd3{display:none}}

@media (prefers-reduced-motion:reduce){
  .loader{display:none}
}
/* lineup: one screen, switched with arrows / dots / swipe / keys */
.lineup{height:auto}
.lu-stage{position:relative;top:auto;height:100vh;min-height:680px;max-height:1000px}
.lu-stage:focus-visible{outline:3px solid var(--sky-deep);outline-offset:-6px}
.lu-hint{position:absolute;left:50%;bottom:44px;transform:translateX(-50%);font-family:var(--f-hand);font-size:22px;opacity:.7;pointer-events:none}
@media (max-width:900px),(pointer:coarse) and (orientation:portrait){.lu-stage{height:auto;max-height:none}.lu-hint{display:none}}

/* ---------- home locations: collapsible drawer ---------- */
.locs-tip{margin:4px 0 0;font-size:24px;color:var(--accent);transition:opacity .4s}
.loc-drawer{display:grid;grid-template-rows:0fr;transition:grid-template-rows .7s var(--ease-out)}
.loc-drawer.open{grid-template-rows:1fr}
.loc-drawer-in{min-height:0;overflow:hidden;opacity:0;transition:opacity .5s var(--ease-out)}
.loc-drawer.open .loc-drawer-in{opacity:1;padding-top:26px}
#locations.drawer-open .locs-tip{display:none}
.locs-more{gap:12px;flex-wrap:wrap}
#locations .chip-btn[aria-pressed="true"]::after{content:"×";margin-left:4px;font-size:16px;line-height:1;opacity:.8}

/* ---------- static hero (phones / tablets portrait): readable kicker ---------- */
@media (max-width: 720px), (orientation: portrait) and (max-width: 1024px), (orientation: portrait) and (pointer: coarse), (orientation: landscape) and (pointer: coarse) and (max-height: 560px), (prefers-reduced-motion: reduce){
  .scrim{background:linear-gradient(180deg,rgba(255,248,236,0) 0%,rgba(255,248,236,0) 28%,rgba(255,248,236,.78) 48%,rgba(255,248,236,.96) 62%,var(--canvas) 80%)}
  .static-copy .kicker{align-self:flex-start;background:#fff;padding:6px 14px 4px;border-radius:999px;box-shadow:0 8px 20px -10px rgba(90,35,15,.4);margin:0}
  .static-copy .band-cta{flex-wrap:wrap}
}

/* ---------- lineup on phones: fits one screen, swipe + tidy controls ---------- */
@media (max-width:900px),(pointer:coarse) and (orientation:portrait){
  .lu-stage{min-height:0;height:auto;padding:calc(var(--nav-h) - 6px) var(--gutter) 100px;touch-action:pan-y}
  .lu-dish{width:min(72vw,33svh,420px);margin:0 auto}
  .lu-info{margin-top:6px}
  .lu-name{font-size:clamp(38px,10.5vw,64px);margin:0 0 12px}
  .lu-desc{font-size:16.5px;margin:0 0 18px}
  .lu-price{font-size:34px}
  .lu-cat{font-size:24px}
  .lu-nav{position:absolute;right:var(--gutter);bottom:28px;gap:10px}
  .lu-arrow{width:50px;height:50px}
  .lu-rail{position:absolute;left:var(--gutter);right:auto;bottom:47px;gap:10px}
  .lu-rail button{width:12px;height:12px}
  .lu-rail button[aria-current="true"]{width:30px}
}
@media (min-width:600px) and (max-width:900px){.lu-dish{width:min(56vw,40svh,460px)}}

@media (max-width:900px) and (max-height:740px){
  .lu-stage{padding-bottom:90px}
  .lu-head .lu-kicker{font-size:24px!important}
  .lu-dish{width:min(60vw,27svh,340px)}
  .lu-cat{font-size:20px;margin-bottom:2px}
  .lu-name{font-size:clamp(32px,9vw,48px);margin-bottom:8px}
  .lu-desc{font-size:15px;line-height:1.4;margin-bottom:14px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .lu-price{font-size:28px}
  .lu-row .btn{min-height:44px}
}