/* Pizzeria Maki — shared base for options 11–20. Mobile-first: base rules target phones; min-width queries add layout. */
/* Palmer Lake's glyphs are drawn at ~half the usual cap height; normalize so font-size means what it says. */
@font-face{font-family:"Palmer Lake Print";src:url(fonts/PalmerLakePrint-Regular.otf) format("opentype");font-display:swap;size-adjust:200%;ascent-override:40%;descent-override:8%;line-gap-override:0%}
@font-face{font-family:"Palmer Lake Script";src:url(fonts/PalmerLakeScript-Regular.otf) format("opentype");font-display:swap;size-adjust:140%;ascent-override:62%;descent-override:22%;line-gap-override:0%}
@font-face{font-family:"Horizon";src:url(fonts/Horizon.otf) format("opentype");font-display:swap}
@font-face{font-family:"Knockout";src:url(fonts/KnockoutJuniorCruiserweight.otf) format("opentype");font-display:swap}
@font-face{font-family:"Dreaming Outloud";src:url(fonts/DreamingOutloud-Regular.otf) format("opentype");font-display:swap}

:root{
  --o:#fe5008;--o-dk:#d94200;--cream:#ffe3d6;--peach:#ffa884;--ink:#141414;--paper:#fffaf6;
  --f-print:"Palmer Lake Print",Impact,sans-serif;
  --f-script:"Palmer Lake Script","Brush Script MT",cursive;
  --f-wide:"Horizon","Arial Black",sans-serif;
  --f-body:"Knockout",system-ui,sans-serif;
  --pad:18px;--wrap:1240px;--mbar-h:72px;
  --hdr-bg:var(--o);--hdr-fg:#fff;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;font-family:var(--f-body);font-size:17px;line-height:1.5;color:var(--ink);background:var(--paper);padding-bottom:calc(var(--mbar-h) + env(safe-area-inset-bottom))}
img,video{max-width:100%;display:block}
a{color:inherit}
:focus-visible{outline:3px solid var(--o);outline-offset:3px}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--pad)}
section{padding:56px 0}

.opt{background:#111;color:#bbb;font:13px/1.4 system-ui,sans-serif;padding:7px var(--pad)}
.opt a{color:var(--o);font-weight:700;text-decoration:none}

.print{font-family:var(--f-print);font-weight:400;text-transform:uppercase;line-height:1.02;letter-spacing:.01em;margin:0}
.script{font-family:var(--f-script);font-weight:400;line-height:1;margin:0}
.k{font-family:var(--f-wide);font-size:11px;letter-spacing:.16em;text-transform:uppercase;margin:0 0 10px;color:var(--o)}
.h2{font-size:clamp(32px,8vw,56px);margin:0 0 14px}
.lede{font-size:clamp(17px,4.4vw,20px);margin:0 0 22px}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:50px;padding:12px 22px;border-radius:12px;border:2px solid transparent;font:12px/1.1 var(--f-wide);letter-spacing:.1em;text-transform:uppercase;text-decoration:none;cursor:pointer;transition:transform .12s,background .2s}
.btn:active{transform:scale(.98)}
.btn-o{background:var(--o);color:#fff}
.btn-o:hover{background:var(--o-dk)}
.btn-ink{background:var(--ink);color:#fff}
.btn-white{background:#fff;color:var(--ink)}
.btn-line{border-color:currentColor;background:transparent}
.row{display:flex;flex-wrap:wrap;gap:10px}
.row .btn{flex:1 1 auto}

/* header */
.hdr{position:sticky;top:0;z-index:50;background:var(--hdr-bg);color:var(--hdr-fg)}
.hdr .bar{display:flex;align-items:center;gap:14px;padding:6px var(--pad);max-width:var(--wrap);margin:0 auto}
.hdr .logo img{height:58px;width:auto}
.hdr nav.main{display:none}
.hdr .hbtn{display:none}
.menu{margin-left:auto}
.menu summary{list-style:none;cursor:pointer;display:grid;place-items:center;width:48px;height:48px;border-radius:12px}
.menu summary::-webkit-details-marker{display:none}
.menu summary svg{width:28px;height:28px}
.menu .panel{position:absolute;left:0;right:0;top:100%;background:var(--hdr-bg);padding:6px var(--pad) 18px;display:grid;box-shadow:0 18px 30px rgba(0,0,0,.2);max-height:calc(100vh - 80px);overflow:auto}
.menu .panel a{font:14px var(--f-wide);letter-spacing:.08em;text-transform:uppercase;text-decoration:none;padding:15px 0;border-bottom:1px solid rgba(127,127,127,.3)}
.menu .panel a.go{color:var(--o)}
.hdr[data-tone=orange] .menu .panel a.go{color:var(--ink)}

/* sticky mobile action bar */
.mbar{position:fixed;left:0;right:0;bottom:0;z-index:60;display:grid;grid-template-columns:1.7fr 1fr;gap:8px;padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:#fff;box-shadow:0 -6px 22px rgba(0,0,0,.14)}
.mbar .btn{min-height:52px}
.mbar .btn-line{color:var(--ink)}

/* media */
.media{position:relative;overflow:hidden;background:#222}
.media>img,.media>video{width:100%;height:100%;object-fit:cover}
.media>video{position:absolute;inset:0}
@media (prefers-reduced-motion:reduce){.media>video{display:none}}

.status{display:inline-flex;align-items:center;gap:8px;font:10px var(--f-wide);letter-spacing:.12em;text-transform:uppercase;padding:7px 12px;border-radius:999px;background:#fff;color:var(--ink)}
.status::before{content:"";width:8px;height:8px;border-radius:50%;background:#999}
.status.is-open::before{background:#1fa855}
.status.is-closed::before{background:#d9480f}

/* horizontal swipe rail on phones, grid from tablet up */
.rail{display:grid;grid-auto-flow:column;grid-auto-columns:78%;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:var(--pad);padding:4px var(--pad) 12px;margin:0 calc(var(--pad) * -1);scrollbar-width:none;-webkit-overflow-scrolling:touch}
.rail::-webkit-scrollbar{display:none}
.rail>*{scroll-snap-align:start}
.hint{font-size:13px;opacity:.7;margin:6px 0 0}

.map{border-radius:20px;overflow:hidden;min-height:300px;background:#ddd}
.map iframe{width:100%;height:100%;min-height:300px;border:0;display:block}

/* footer */
.foot{background:var(--ink);color:#d8d8d8;padding:48px 0 32px}
.foot .grid{display:grid;gap:30px}
.foot .tile{background:var(--o);border-radius:18px;padding:12px;display:inline-block}
.foot .tile img{height:96px;width:auto}
.foot h4{font:11px var(--f-wide);letter-spacing:.14em;text-transform:uppercase;color:#fff;margin:0 0 12px}
.foot ul{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.foot ul a{display:inline-block;padding:6px 0;text-decoration:none}
.foot a:hover{color:#fff}
.foot .fine{margin-top:34px;font-size:13px;color:#8a8a8a}

@media (min-width:760px){
  :root{--pad:32px}
  section{padding:84px 0}
  .row .btn{flex:0 0 auto}
  .rail{grid-auto-flow:row;grid-template-columns:repeat(var(--rail-cols,3),1fr);overflow:visible;margin:0;padding:0}
  .hint{display:none}
  .hdr .hbtn{display:inline-flex;margin-left:auto}
  .menu{margin-left:0}
  .foot .grid{grid-template-columns:repeat(2,1fr)}
}
@media (min-width:1080px){
  :root{--pad:48px}
  body{padding-bottom:0}
  .mbar,.menu{display:none}
  .hdr .logo img{height:84px}
  .hdr nav.main{display:flex;gap:22px;margin-left:auto}
  .hdr nav.main a{font:11px var(--f-wide);letter-spacing:.1em;text-transform:uppercase;text-decoration:none;padding:10px 0;border-bottom:2px solid transparent}
  .hdr nav.main a:hover{border-bottom-color:currentColor}
  .hdr .hbtn{margin-left:10px}
  .foot .grid{grid-template-columns:auto 1fr 1fr 1fr}
}
