/* Layout: full-bleed bands (black for footage, cream for reading, red for the brand) around a 1440px content column.
   One art direction throughout: warm, low-key light, real footage and photography shown whole. */
:root{
  --black:#0B0A09;
  --black-2:#16120F;
  --cream:#F1E6CC;
  --red:#8E0B0E;
  --red-deep:#6A080B;
  --ink:#22160E;
  --mute-d:#A99B8B;   /* secondary text on black */
  --mute-l:#6D5A49;   /* secondary text on cream */
  --mute-r:#EDC6BD;   /* secondary text on red */
  --ember:#E9773F;

  --sans:"Archivo","Helvetica Neue",Arial,sans-serif;
  --mark:"Bowlby One","Arial Black",sans-serif;
  --arabic:"Lalezar","Geeza Pro","Noto Naskh Arabic",serif;

  --gutter:clamp(20px,4.4vw,72px);
  --section:clamp(96px,11vw,176px);
  --t-sm:clamp(.84rem,.82rem + .1vw,.92rem);
  --t-base:clamp(1rem,.97rem + .18vw,1.1rem);
  --t-lg:clamp(1.15rem,1.05rem + .45vw,1.45rem);
  --t-xl:clamp(1.6rem,1.2rem + 1.5vw,2.5rem);
  --t-2xl:clamp(2.5rem,1.4rem + 4.2vw,5.4rem);
  --t-3xl:clamp(3.2rem,1.2rem + 7.6vw,9.4rem);
  color-scheme:dark;
}
*{box-sizing:border-box}
html{background:var(--black);overflow-x:clip}
body{margin:0;background:var(--black);color:var(--cream);font-family:var(--sans);font-size:var(--t-base);line-height:1.55;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:clip}
p{margin:0}
img,video{display:block;max-width:100%}
img{color:transparent}
a{color:inherit}
h1,h2,h3{margin:0;font-weight:800;text-wrap:balance}
:focus-visible{outline:2px solid var(--ember);outline-offset:4px;border-radius:6px}
[lang="ar"]{font-family:var(--arabic);font-weight:400;letter-spacing:0}
.wrap{width:100%;max-width:1440px;margin-inline:auto;padding-inline:var(--gutter)}
.display,.h2,.h3{font-family:var(--sans);font-weight:850;font-stretch:72%;text-transform:uppercase;letter-spacing:-.004em}
.display{line-height:.88;font-size:var(--t-3xl)}
.h2{line-height:.9;font-size:var(--t-2xl)}
.h3{line-height:.95;font-size:var(--t-xl)}

/* ---------- nav ---------- */
.nav{position:fixed;z-index:80;top:calc(env(safe-area-inset-top,0px) + 14px);left:0;right:0;pointer-events:none}
.nav .wrap{display:flex;justify-content:space-between;align-items:center;gap:12px}
.nav .wrap > *{pointer-events:auto}
.pill{background:rgba(11,10,9,.62);backdrop-filter:blur(16px) saturate(1.3);-webkit-backdrop-filter:blur(16px) saturate(1.3);border:1px solid rgba(241,230,204,.14);border-radius:999px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;padding:10px 18px}
.logo b{font-family:var(--mark);font-weight:400;font-size:1.15rem;letter-spacing:.01em;line-height:1}
.logo span{font-size:1.05rem;color:var(--mute-d);line-height:1}
.links{display:flex;gap:2px;padding:5px}
.links a{text-decoration:none;font-size:.93rem;font-weight:500;padding:8px 15px;border-radius:999px;white-space:nowrap;transition:background-color .2s}
.links a:hover{background:rgba(241,230,204,.1)}
.links a.cta{background:var(--cream);color:var(--red);font-weight:650}
.links a.cta:hover{background:#fff6e0}
.nav-right{display:flex;align-items:center;gap:8px}
.menu-btn{display:none;align-items:center;gap:10px;padding:13px 18px;color:var(--cream);font:600 .93rem/1 var(--sans);cursor:pointer}
.menu-btn i{position:relative;width:16px;height:10px;border-top:2px solid currentColor;border-bottom:2px solid currentColor;transition:transform .3s}
.menu-btn[aria-expanded="true"] i{transform:scaleY(.2)}
@media (pointer:coarse){.links a{display:inline-flex;align-items:center;min-height:44px}.logo{min-height:44px}}   /* tablets: finger-size nav */
@media (max-width:820px){.links a:not(.cta){display:none}.logo span{display:none}.menu-btn{display:inline-flex}}
@media (max-width:520px){.links{display:none}}
.sheet{position:fixed;inset:0;z-index:70;background:var(--black);padding:calc(env(safe-area-inset-top,0px) + 100px) var(--gutter) calc(env(safe-area-inset-bottom,0px) + 28px);display:flex;flex-direction:column;justify-content:space-between;gap:32px;overflow-y:auto;opacity:0;visibility:hidden;transform:translateY(-14px);transition:opacity .3s ease,transform .45s cubic-bezier(.2,.8,.2,1),visibility 0s linear .45s}
.sheet.open{opacity:1;visibility:visible;transform:none;transition:opacity .3s ease,transform .45s cubic-bezier(.2,.8,.2,1)}
.sheet nav{display:grid}
.sheet nav a{font-weight:850;font-stretch:72%;text-transform:uppercase;font-size:clamp(2.4rem,11vw,4.2rem);line-height:1.05;text-decoration:none;padding:10px 0;border-bottom:1px solid rgba(241,230,204,.14)}
.sheet-foot{display:grid;gap:8px;color:var(--mute-d);font-size:var(--t-sm)}
.sheet-foot b{color:var(--cream);font-weight:600}
.sheet-foot .btn{margin-top:14px;justify-self:start}
html.sheet-open{overflow:hidden}
@media (min-width:821px){.sheet{display:none}}

.btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 28px;border-radius:999px;text-decoration:none;font-weight:650;font-size:1rem;transition:background-color .2s,border-color .2s,transform .2s cubic-bezier(.2,.8,.2,1)}
.btn:active{transform:scale(.97)}
.btn-red{background:var(--red);color:var(--cream)}
.btn-red:hover{background:#a8121a}
.btn-cream{background:var(--cream);color:var(--red)}
.btn-cream:hover{background:#fff6e0}
.btn-ghost{border:1px solid rgba(241,230,204,.45)}
.btn-ghost:hover{border-color:var(--cream);background:rgba(241,230,204,.08)}

/* ---------- hero ---------- */
.hero{position:relative;height:100vh;height:100svh;min-height:660px;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;background:var(--black)}
.hero-media{position:absolute;inset:0;overflow:hidden;transform-origin:50% 0}
.hero-film{position:absolute;inset:0}
.hero-media video,.hero-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 45%}
.hero-shade{position:absolute;inset:0;background:
  linear-gradient(90deg,rgba(11,10,9,.88) 0%,rgba(11,10,9,.55) 38%,rgba(11,10,9,.08) 72%),
  linear-gradient(0deg,rgba(11,10,9,.92) 0%,rgba(11,10,9,0) 38%)}
.hero-content{position:relative;z-index:2;display:grid;gap:clamp(20px,3vh,30px);padding-bottom:clamp(28px,5vh,52px)}
.hero h1{font-size:min(var(--t-3xl),15vh)}
.hero h1 .ln{display:block;overflow:hidden;padding-bottom:.04em}
.hero h1 .ln > span{display:block}
.hero h1 .ln:nth-child(2){color:var(--ember)}
.hero .lede{font-size:var(--t-lg);line-height:1.45;color:#e2d6be;max-width:30rem}
.ctas{display:flex;flex-wrap:wrap;gap:12px}
.hero-bar{position:relative;z-index:2;padding-bottom:calc(env(safe-area-inset-bottom,0px) + 26px)}
.hero-bar > div{display:flex;flex-wrap:wrap;gap:8px 48px;padding-top:18px;border-top:1px solid rgba(241,230,204,.2);font-size:var(--t-sm);color:var(--mute-d)}
.hero-bar b{color:var(--cream);font-weight:600}
.status{display:inline-flex;align-items:center;gap:10px;font-weight:600;color:var(--cream)}
.status::before{content:"";width:8px;height:8px;border-radius:50%;background:#9c8f80;flex:none}
.status.open::before{background:#6fd38a;box-shadow:0 0 0 4px rgba(111,211,138,.18)}
/* portrait phones and tablets get the portrait cut of the film (see index.html); poster and film share this framing */
@media (max-width:899px) and (orientation:portrait){.hero-media video,.hero-media img{object-position:62% 50%}}
@media (max-width:760px){
  .hero-shade{background:linear-gradient(0deg,rgba(11,10,9,.95) 0%,rgba(11,10,9,.6) 45%,rgba(11,10,9,.15) 80%)}
  .hero-media video,.hero-media img{object-position:62% 50%}
  .hero h1{font-size:min(clamp(2.9rem,13.5vw,5rem),10.5vh)}
  .hero-bar .addr{display:none}
}

/* ---------- manifesto ---------- */
.manifesto{position:relative;z-index:5;background:var(--cream);color:var(--ink);border-radius:28px 28px 0 0;padding-block:var(--section) calc(var(--section) * .8)}
.manifesto .big{font-weight:650;font-stretch:88%;font-size:clamp(1.9rem,1.1rem + 3.2vw,4.3rem);line-height:1.08;letter-spacing:-.018em;max-width:1160px}
.manifesto .big em{font-style:normal;color:var(--red)}
.facts{margin-top:clamp(56px,7vw,104px);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid rgba(34,22,14,.2)}
.fact{padding:24px 24px 0 0;display:grid;gap:6px;min-width:0}
.fact + .fact{padding-left:24px;border-left:1px solid rgba(34,22,14,.2)}
.fact b{font-weight:850;font-stretch:72%;font-size:var(--t-2xl);line-height:1;color:var(--red);font-variant-numeric:tabular-nums}
.fact span{color:var(--mute-l);max-width:18rem}
@media (max-width:700px){.facts{grid-template-columns:minmax(0,1fr)}.fact + .fact{border-left:0;padding-left:0;border-top:1px solid rgba(34,22,14,.2)}.fact{padding-bottom:22px}}

/* ---------- process (sticky media) ---------- */
.process{position:relative;z-index:5;background:var(--black);padding-block:var(--section)}
.sec-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:20px 56px;margin-bottom:clamp(40px,6vw,88px)}
.sec-head p{max-width:25rem;font-size:var(--t-lg);line-height:1.4}
.process .sec-head p{color:var(--mute-d)}
.proc-grid{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(40px,7vw,120px)}
.proc-media{position:sticky;align-self:start;top:max(96px,14vh);height:min(76vh,760px);perspective:1500px}
.pm-frame{position:relative;height:100%;border-radius:22px;overflow:hidden;background:var(--black-2);transform-origin:50% 50%}
.pm{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.06);transition:opacity .8s ease,transform 1.4s cubic-bezier(.2,.8,.2,1)}
.pm.on{opacity:1;transform:scale(1)}
.pm-count{position:absolute;left:20px;bottom:18px;z-index:2;font-weight:700;font-variant-numeric:tabular-nums;font-size:var(--t-sm);color:var(--cream);background:rgba(11,10,9,.55);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);padding:6px 12px;border-radius:999px}
.steps{list-style:none;margin:0;padding:0}
.pstep{min-height:min(76vh,760px);display:grid;align-content:center;gap:14px;border-top:1px solid rgba(241,230,204,.16);opacity:.32;transition:opacity .5s}
.pstep.on{opacity:1}
.pstep:last-child{border-bottom:1px solid rgba(241,230,204,.16)}
.pstep .when{color:var(--ember);font-weight:600;font-variant-numeric:tabular-nums}
.pstep p{color:var(--mute-d);max-width:27rem;font-size:var(--t-lg);line-height:1.45}
.pstep-media{display:none;margin:0 0 6px;border-radius:18px;overflow:hidden;aspect-ratio:4/5;background:var(--black-2)}
.pstep-media img,.pstep-media video{width:100%;height:100%;object-fit:cover}
.steps-nav{display:none}
.pdeck,.deck-stage,.mdeck,.mdeck-stage{display:contents}
.deck-bar,.cat-badge{display:none}
.deck-dim{position:absolute;inset:0;z-index:4;background:var(--black);opacity:0;pointer-events:none}
@media (max-width:899px){
  .proc-grid{grid-template-columns:minmax(0,1fr)}
  .proc-media{display:none}
  .steps{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;margin-inline:calc(var(--gutter) * -1);padding-inline:var(--gutter);scroll-padding-inline:var(--gutter);scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
  .steps::-webkit-scrollbar{display:none}
  .pstep,.pstep:last-child{flex:0 0 min(82%,420px);scroll-snap-align:start;min-height:0;opacity:1;transition:none;padding:0;border:0;align-content:start;gap:10px}
  .pstep p{font-size:1.02rem}
  .pstep-media{display:block}
  .steps-nav{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:28px}
  .steps-dots{display:flex;gap:6px}
  .steps-dots i{width:7px;height:7px;border-radius:4px;background:rgba(241,230,204,.28);transition:width .35s cubic-bezier(.2,.8,.2,1),background-color .35s}
  .steps-dots i.on{width:26px;background:var(--cream)}
  .steps-hint{font-size:var(--t-sm);color:var(--mute-d)}
}

/* ---------- signature ---------- */
.signature{position:relative;z-index:5;background:var(--red);color:var(--cream);padding-block:var(--section)}
.sig-grid{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(40px,7vw,120px);align-items:center}
.sig-photo{margin:0;border-radius:22px;overflow:hidden;aspect-ratio:4/5;background:var(--red-deep);box-shadow:0 60px 100px -50px rgba(30,0,0,.75)}
.sig-photo img{width:100%;height:118%;object-fit:cover;object-position:50% 40%}
.sig-text{display:grid;gap:26px;align-content:center;min-width:0}
.sig-title{display:flex;justify-content:space-between;align-items:flex-end;gap:20px}
.sig-title .price{font-weight:850;font-stretch:72%;font-size:var(--t-2xl);line-height:.9;font-variant-numeric:tabular-nums}
/* two-column desktop: a smaller size keeps "The chicken" on one line instead of orphaning "The" */
@media (min-width:900px){.sig-title .h2,.sig-title .price{font-size:clamp(2.5rem,1.4rem + 3.2vw,4.4rem)}}
.sig-text > p{font-size:var(--t-lg);line-height:1.45;color:#f4dcd4;max-width:32rem}
.specs{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);margin:0;border-top:1px solid rgba(241,230,204,.3)}
.specs div{padding:16px 16px 16px 0;border-bottom:1px solid rgba(241,230,204,.3);min-width:0}
.specs div:nth-child(even){padding-left:16px;border-left:1px solid rgba(241,230,204,.3)}
.specs dt{font-size:var(--t-sm);color:var(--mute-r)}
.specs dd{margin:2px 0 0;font-weight:600}
@media (max-width:899px){.sig-grid{grid-template-columns:minmax(0,1fr)}.sig-photo{aspect-ratio:4/3}.sig-photo img{object-position:50% 45%}}

/* ---------- menu ---------- */
.menu{position:relative;z-index:5;background:var(--cream);color:var(--ink);padding-block:var(--section)}
.menu .h2{color:var(--red);font-size:var(--t-3xl)}
.menu-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(40px,7vw,120px);align-items:start}
.frame{position:sticky;top:110px;margin:0;perspective:1600px}
.frame-in{position:relative;aspect-ratio:4/5;max-height:calc(100vh - 150px);border-radius:22px;overflow:hidden;background:var(--black)}
.frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .7s ease}
.frame img.on{opacity:1}
.frame figcaption{position:absolute;left:16px;bottom:16px;z-index:2;color:var(--cream);font-size:var(--t-sm);font-weight:600;background:rgba(11,10,9,.5);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);padding:6px 12px;border-radius:999px}
.cats{display:grid;gap:clamp(56px,6vw,96px)}
.cat{scroll-margin-top:150px}
.menu-chips{display:flex;gap:8px;margin:calc(clamp(44px,6vw,80px) * -.45) 0 clamp(36px,4vw,56px)}
.menu-chips a{flex:none;padding:10px 18px;border-radius:999px;border:1px solid rgba(142,11,14,.3);background:var(--cream);color:var(--red);text-decoration:none;font-weight:600;font-size:.93rem;white-space:nowrap;transition:background-color .2s,color .2s,border-color .2s}
.menu-chips a:hover,.menu-chips a.on{background:var(--red);border-color:var(--red);color:var(--cream)}
.cat-photo{display:none;margin:0 0 20px;border-radius:18px;overflow:hidden;aspect-ratio:3/2;background:var(--black)}
.cat-photo img{width:100%;height:100%;object-fit:cover}
.cat h3{display:flex;justify-content:space-between;align-items:baseline;gap:16px;color:var(--red);padding-bottom:14px;border-bottom:2px solid var(--red)}
.cat h3 [lang="ar"]{font-size:.8em;text-transform:none}
.cat ul{list-style:none;margin:0;padding:0}
.cat li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 24px;padding:18px 0;border-bottom:1px solid rgba(34,22,14,.14)}
.cat li b{font-weight:650;font-size:1.1rem}
.cat li .p{grid-row:span 2;font-weight:800;font-stretch:80%;font-size:1.2rem;color:var(--red);font-variant-numeric:tabular-nums}
.cat li span:not(.p){color:var(--mute-l);font-size:.95rem}
.menu-note{margin-top:clamp(28px,4vw,44px);color:var(--mute-l);font-size:var(--t-sm);max-width:40rem}
@media (max-width:899px){
  .menu-grid{grid-template-columns:minmax(0,1fr)}.frame{display:none}.cat-photo{display:block}
  .menu-chips{margin:0 0 24px;padding:4px;gap:4px;border-radius:999px;background:rgba(142,11,14,.08)}
  .menu-chips a{flex:1 1 auto;text-align:center;border:0;background:transparent;padding:12px 10px}
  .menu-chips a.on{background:var(--red);color:var(--cream)}
  .cats.tabbed .cat{display:none}
  .cats.tabbed .cat.show{display:block}
}

/* ---------- band ---------- */
.band{position:relative;z-index:5;height:92vh;height:92svh;min-height:600px;overflow:hidden;background:var(--black);display:flex;align-items:flex-end}
.band img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 38%}
.band::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(11,10,9,.9) 0%,rgba(11,10,9,.25) 50%,rgba(11,10,9,.1) 100%)}
.band .wrap{position:relative;z-index:2;padding-bottom:clamp(40px,7vh,80px);display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:20px 56px}
.band .h2{font-size:var(--t-3xl);max-width:12ch}
.band p{max-width:24rem;font-size:var(--t-lg);line-height:1.45;color:#e2d6be}

/* ---------- shops ---------- */
.shops{position:relative;z-index:5;background:var(--cream);color:var(--ink);padding-block:var(--section)}
.shops .h2{color:var(--red)}
.shops-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(40px,7vw,120px);align-items:start}
.shop{padding:clamp(24px,3vw,36px) 0;border-top:2px solid var(--red);display:grid;gap:18px;min-width:0}
.shop + .shop{border-top:1px solid rgba(34,22,14,.2)}
.shop-top{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:8px 20px}
@media (max-width:760px){.shop-top{flex-direction:column;align-items:flex-start;gap:6px}}
.shop h3{color:var(--red)}
.shop dl{display:grid;grid-template-columns:7rem 1fr;gap:8px 20px;margin:0;font-variant-numeric:tabular-nums}
.shop dt{color:var(--mute-l)}
.shop dd{margin:0}
.shop .status{color:var(--ink)}
.shop .status::before{background:#a8957a}
.shop .status.open::before{background:#2f9e44;box-shadow:0 0 0 4px rgba(47,158,68,.16)}
.shops .note{color:var(--mute-l);max-width:32rem;padding-top:8px}
.shop-photo{margin:0;border-radius:22px;overflow:hidden;aspect-ratio:4/5;background:var(--black)}
.shop-photo img{width:100%;height:116%;object-fit:cover;object-position:46% 50%}
@media (max-width:899px){.shops-grid{grid-template-columns:minmax(0,1fr)}.shop-photo{aspect-ratio:16/10;order:-1}}
/* phones on their side: photos become full-width bands instead of pictures taller than the screen */
@media (max-width:899px) and (orientation:landscape){
  .sig-photo,.shop-photo,.menu:not(.deck) .cat-photo,.process:not(.deck) .pstep-media{aspect-ratio:auto;height:62vh;height:62svh}
}
.shop-actions{display:flex;flex-wrap:wrap;gap:10px}
.btn-sm{min-height:46px;padding:0 22px;font-size:.95rem}
.btn-outline{border:1px solid rgba(142,11,14,.4);color:var(--red)}
.btn-outline:hover{background:var(--red);border-color:var(--red);color:var(--cream)}

/* ---------- footer ---------- */
.foot{position:relative;z-index:5;background:var(--red);color:var(--cream);padding-block:clamp(64px,8vw,110px) calc(env(safe-area-inset-bottom,0px) + 26px);overflow:hidden}
.foot-cta{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:32px 64px;align-items:end;padding-bottom:clamp(40px,5vw,64px);margin-bottom:clamp(28px,3vw,40px);border-bottom:1px solid rgba(241,230,204,.3)}
.foot-cta .h2{max-width:14ch}
.phones{display:grid;gap:18px;min-width:0}
.phones div{display:grid;gap:2px}
.phones span{font-size:var(--t-sm);color:var(--mute-r)}
.phones a{padding-block:12px;margin-block:-12px;font-weight:850;font-stretch:72%;font-size:var(--t-xl);line-height:1;text-decoration:none;font-variant-numeric:tabular-nums}
.phones a:hover{text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:2px}
@media (max-width:760px){.foot-cta{grid-template-columns:minmax(0,1fr)}}
.foot-top{display:flex;flex-wrap:wrap;justify-content:space-between;gap:20px 48px}
.foot-top p{max-width:26rem}
.foot-top nav{display:flex;gap:26px;flex-wrap:wrap;font-weight:600}
.foot-top nav a{text-decoration:none;padding-block:10px;margin-block:-10px;min-width:44px}   /* 44 px tap height, same layout */
.foot-top nav a:hover{text-decoration:underline;text-underline-offset:5px}
.wordmark{display:flex;align-items:flex-end;justify-content:space-between;gap:3vw;margin-top:clamp(48px,7vw,96px)}
.wordmark b{font-family:var(--mark);font-weight:400;font-size:clamp(4.4rem,23vw,24rem);line-height:.74;letter-spacing:-.035em}
.wordmark span{font-size:clamp(2.4rem,9vw,8.5rem);line-height:1;color:var(--mute-r);padding-bottom:1%}
.legal{margin-top:28px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 24px;font-size:.82rem;color:var(--mute-r)}
.legal a{display:inline-block;padding:15px 4px;margin:-15px -4px}   /* finger-size tap area, same line */

/* ---------- phone decks: scrolling deals the cards one at a time ---------- */
@media (max-width:899px){
  .deck-bar{position:relative;height:3px;border-radius:2px;background:rgba(241,230,204,.18);overflow:hidden}
  .deck-bar i{position:absolute;inset:0;background:var(--cream);transform-origin:0 50%;transform:scaleX(0)}

  /* the steps */
  .process.deck .pdeck{display:block;position:relative;height:calc(100vh + 3 * 80vh);height:calc(100svh + 3 * 80svh)}
  .process.deck .deck-stage{display:flex;flex-direction:column;justify-content:center;gap:20px;position:sticky;top:calc(env(safe-area-inset-top,0px) + 60px);height:calc(100vh - 60px);height:calc(100svh - 60px - env(safe-area-inset-top,0px));padding-bottom:64px}
  .process.deck .steps{display:block;position:relative;overflow:visible;margin:0 auto;padding:0;width:100%;max-width:520px;height:min(60vh,580px);height:min(60svh,580px)}
  .process.deck .pstep,.process.deck .pstep:last-child{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;gap:8px;padding:22px 20px;border:0;border-radius:22px;overflow:hidden;background:var(--black-2);transform-origin:50% 0;box-shadow:0 -10px 24px -14px rgba(0,0,0,.7);will-change:transform;backface-visibility:hidden}
  .process.deck .pstep-media{position:absolute;inset:0;margin:0;aspect-ratio:auto;border-radius:0;z-index:0;will-change:transform}
  .process.deck .pstep::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(0deg,rgba(11,10,9,.94) 0%,rgba(11,10,9,.6) 36%,rgba(11,10,9,0) 64%)}
  .process.deck .pstep > :not(.pstep-media):not(.deck-dim){position:relative;z-index:2}
  .process.deck .pstep p{color:#e2d6be;font-size:.98rem;max-width:30rem}
  .process.deck .steps-nav{margin:0 auto;width:100%;max-width:520px;gap:18px}
  .process.deck .steps-nav .deck-bar{display:block;flex:1}
  .process.deck .steps-hint{display:none}

  /* the menu */
  .menu.deck .mdeck{display:block;position:relative;height:calc(100vh + 2 * 80vh);height:calc(100svh + 2 * 80svh)}
  .menu.deck .mdeck-stage{display:flex;flex-direction:column;gap:14px;position:sticky;top:calc(env(safe-area-inset-top,0px) + 60px);height:calc(100vh - 60px);height:calc(100svh - 60px - env(safe-area-inset-top,0px));padding-top:14px}
  .menu.deck .menu-chips{margin:0}
  .menu.deck .mdeck-stage > .deck-bar{display:block;background:rgba(142,11,14,.14)}
  .menu.deck .mdeck-stage > .deck-bar i{background:var(--red)}
  .menu.deck .menu-grid{display:block;padding-top:34px}
  .menu.deck .cats{display:block;position:relative;max-width:520px;margin:0 auto;height:var(--deck-h,520px)}
  .menu.deck .cat{position:absolute;left:0;right:0;top:0;height:var(--deck-h,auto);display:flex;flex-direction:column;padding:0 18px 4px;border-radius:22px;background:#FFF9EC;border:1px solid rgba(142,11,14,.12);box-shadow:0 -10px 24px -16px rgba(60,20,10,.45);overflow:hidden;transform-origin:50% 0;will-change:transform;backface-visibility:hidden}
  .menu.deck .cat-photo,.menu.deck .cat-badge{display:block;margin:0 -18px 14px;border-radius:0;aspect-ratio:5/2;flex:1 0 auto}   /* shorter cards: the picture takes the spare height, no empty card bottom */
  .menu.deck .cat-badge{display:grid;place-content:center;gap:4px;background:var(--red);color:var(--cream);text-align:center}
  .menu.deck .cat-badge span{font-size:3rem;line-height:1}
  .menu.deck .cat-badge b{font-size:.85rem;font-weight:600;color:var(--mute-r)}
  .menu.deck .cat h3{font-size:1.35rem;padding-bottom:10px}
  .menu.deck .cat li{padding:10px 0}
  .menu.deck .cat li:last-child{border-bottom:0}
  .menu.deck .cat li span:not(.p){font-size:.86rem;line-height:1.35}
  .menu.deck .cat .deck-dim{background:var(--ink)}
  .menu.deck .cats.compact .cat-photo,.menu.deck .cats.compact .cat-badge{aspect-ratio:4/1;margin-bottom:10px}
  .menu.deck .cats.compact .cat-badge span{font-size:2.2rem}
  .menu.deck .cats.compact .cat h3{font-size:1.2rem;padding-bottom:8px}
  .menu.deck .cats.compact .cat li{padding:8px 0}
  .menu.deck .cats.compact .cat li b{font-size:.98rem}
  .menu.deck .cats.compact .cat li span:not(.p){font-size:.82rem}
  .menu.deck .cats.nophoto .cat-photo,.menu.deck .cats.nophoto .cat-badge{display:none}
  .menu.deck .cats.nophoto .cat{padding-top:14px}
}

/* ---------- phone dock ---------- */
.dock{position:fixed;left:0;right:0;bottom:0;z-index:65;display:none;gap:10px;padding:10px var(--gutter) calc(env(safe-area-inset-bottom,0px) + 10px);background:rgba(11,10,9,.88);backdrop-filter:blur(16px) saturate(1.3);-webkit-backdrop-filter:blur(16px) saturate(1.3);border-top:1px solid rgba(241,230,204,.12);transform:translateY(110%);transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.dock.show{transform:none}
.dock .btn{flex:1;min-height:50px}
.dock .call{flex:0 0 auto;border:1px solid rgba(241,230,204,.4);color:var(--cream);padding:0 24px}

/* ---------- touch-size top bar ---------- */
@media (max-width:820px){
  .nav{top:0;padding-top:env(safe-area-inset-top,0px);border-bottom:1px solid transparent;transition:background-color .3s,border-color .3s}
  .nav .wrap{height:60px}
  .nav .pill{background:none;border-color:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}
  .nav.solid{background:rgba(11,10,9,.88);backdrop-filter:blur(16px) saturate(1.3);-webkit-backdrop-filter:blur(16px) saturate(1.3);border-bottom-color:rgba(241,230,204,.1)}
  .logo{padding:10px 0;min-height:44px}
  .menu-btn{padding:12px 2px 12px 14px;min-height:44px}
  .sheet{padding-top:calc(env(safe-area-inset-top,0px) + 84px)}
}

/* ---------- phone layout ---------- */
@media (max-width:760px){
  :root{--section:76px;--t-2xl:clamp(2.1rem,9.4vw,2.75rem);--t-xl:clamp(1.4rem,6vw,1.7rem);--t-lg:1.04rem}
  .dock{display:flex}
  .hero{min-height:560px}
  .hero-content{gap:18px;padding-bottom:22px}
  .hero .lede{font-size:1.02rem;line-height:1.5}
  .hero .ctas{display:grid;grid-template-columns:1fr 1fr}
  .hero .ctas .btn{padding:0 12px}
  .hero-bar{padding-bottom:calc(env(safe-area-inset-bottom,0px) + 18px)}
  .manifesto{border-radius:22px 22px 0 0}
  .manifesto .big{font-size:1.5rem;line-height:1.18;letter-spacing:-.012em}
  .facts{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:44px}
  .fact,.fact + .fact{padding:18px 8px 0 12px;border-top:0;border-left:1px solid rgba(34,22,14,.2)}
  .fact:first-child{border-left:0;padding-left:0}
  .fact b{font-size:1.8rem}
  .fact span{font-size:.8rem;line-height:1.35}
  .sec-head{margin-bottom:28px;gap:12px}
  .sec-head p{font-size:1rem}
  .menu .h2{font-size:var(--t-2xl)}
  .pstep .h3{font-size:1.5rem}
  .sig-grid{gap:28px}
  .sig-text{gap:18px}
  .sig-text > p{font-size:1rem}
  .specs dt{font-size:.78rem}
  .specs dd{font-size:.94rem}
  .sig-text .ctas,.shop-actions{display:grid;grid-template-columns:1fr 1fr}
  .sig-text .ctas .btn,.shop-actions .btn{padding:0 12px}
  .cat li{padding:15px 0}
  .cat li b{font-size:1.02rem}
  .cat li span:not(.p){font-size:.9rem}
  .band{height:68vh;height:68svh;min-height:460px}
  .band .h2{font-size:clamp(2.4rem,11vw,3.2rem)}
  .band p{font-size:1rem}
  .shop-photo{aspect-ratio:16/10}
  .shop{gap:14px}
  .shop dl{grid-template-columns:5.5rem 1fr;font-size:.95rem}
  .foot-cta .h2{font-size:var(--t-2xl)}
  .phones{grid-template-columns:1fr 1fr;gap:12px}
  .phones a{font-size:1.3rem}
  .wordmark{margin-top:40px}
}