/* Papa Park's Provisions: one stylesheet for every public page.
   Look: a scratch kitchen's printed menu card on warm paper. Fraunces for the voice, Inter for the facts. */
:root{
  --ink:#241C16; --ink-soft:#4A3F35; --ink-faint:#7A6C5D; --paper:#F5EEE1; --card:#FBF6EC; --white:#FFFDF8;
  --ember:#9F2B20; --ember-dark:#7C2018; --mustard:#C89530; --mustard-soft:#F1E2BC; --sage:#5C6B4C; --line:#D9C8A6;
  --display:'Fraunces', Georgia, 'Times New Roman', serif;
  --body:'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --radius:14px;
  --grain: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='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .14 0 0 0 0 .11 0 0 0 0 .09 0 0 0 .05 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{ margin:0; background:var(--paper) var(--grain); color:var(--ink); font:16px/1.6 var(--body); -webkit-font-smoothing:antialiased; }
img{ max-width:100%; display:block; }
a{ color:var(--ember-dark); }
h1,h2,h3{ font-family:var(--display); font-weight:700; letter-spacing:-.015em; margin:0; text-wrap:balance; line-height:1.1; }
p{ margin:0; }
.wrap{ max-width:1080px; margin:0 auto; padding-inline:18px; }
.eyebrow{ font:700 .72rem/1 var(--body); letter-spacing:.16em; text-transform:uppercase; color:var(--ember); }
.muted{ color:var(--ink-soft); }
.small{ font-size:.88rem; }
.sr{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
[hidden]{ display:none !important; }
:focus-visible{ outline:2px solid var(--ember); outline-offset:3px; border-radius:4px; }

/* ---------- top bar */
.top{ position:sticky; top:0; z-index:20; background:rgba(245,238,225,.92); backdrop-filter:blur(8px); border-bottom:1px solid rgba(217,200,166,.6); }
.top .wrap{ display:flex; align-items:center; justify-content:space-between; gap:14px; padding-block:10px; }
.brand{ display:flex; align-items:center; gap:10px; text-decoration:none; color:var(--ink); }
.badge{ width:38px; height:38px; border-radius:10px; background:var(--ember-dark); color:var(--paper); display:grid; place-items:center; font:700 19px var(--display); flex:none; }
.brand b{ font:700 1.05rem/1.1 var(--display); display:block; }
.brand small{ font:600 .6rem/1 var(--body); letter-spacing:.14em; text-transform:uppercase; color:var(--sage); }
.top nav{ display:flex; align-items:center; gap:4px; }
.top nav a{ text-decoration:none; color:var(--ink-soft); font-weight:600; font-size:.9rem; padding:8px 10px; border-radius:8px; }
.top nav a:hover{ color:var(--ink); background:rgba(217,200,166,.35); }
@media (max-width:760px){ .top nav a.opt{ display:none; } }
@media (max-width:480px){ .brand small{ display:none; } .top nav a:not(.btn){ display:none; } .brand b{ font-size:.98rem; } }
.brand > span{ min-width:0; }

/* ---------- buttons */
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:8px; font:700 .95rem var(--body); text-decoration:none; border-radius:12px; padding:13px 18px; border:1.5px solid transparent; cursor:pointer; transition:transform .15s, background .15s, box-shadow .15s; }
.btn.primary{ background:var(--ember-dark); color:var(--paper); box-shadow:0 6px 18px rgba(124,32,24,.22); }
.btn.primary:hover{ background:var(--ember); transform:translateY(-1px); }
.btn.ghost{ background:transparent; color:var(--ink); border-color:var(--line); }
.btn.ghost:hover{ border-color:var(--ink-faint); }
.btn.small{ padding:8px 12px; font-size:.85rem; border-radius:10px; }
.top .btn.small{ background:var(--ink); color:var(--paper); }
button.btn{ font-family:var(--body); }
button.btn:disabled{ opacity:.6; cursor:wait; }

/* ---------- notice */
.notice{ background:var(--ember-dark); color:var(--paper); text-align:center; font-weight:600; padding:10px 18px; }

/* ---------- hero */
.hero{ padding-block:44px 28px; display:grid; grid-template-columns:1.25fr .9fr; gap:36px; align-items:center; }
.hero h1{ font-size:clamp(2.4rem, 6.4vw, 4.3rem); margin:14px 0 16px; }
.hero h1 .swash{ position:relative; white-space:nowrap; color:var(--ember-dark); }
.hero h1 .swash svg{ position:absolute; left:-2%; right:-2%; bottom:-.12em; width:104%; height:.32em; overflow:visible; }
.hero .lede{ font-size:1.12rem; color:var(--ink-soft); max-width:34em; }
.hero .ctas{ display:flex; flex-wrap:wrap; gap:10px; margin-top:24px; }
.status{ background:var(--white); border:1px solid var(--line); border-radius:20px; padding:22px; box-shadow:0 18px 40px -22px rgba(36,28,22,.35); display:grid; gap:14px; position:relative; }
.status .bowl{ width:120px; height:auto; margin:-6px auto 0; }
.status .when{ font:700 1.6rem/1.15 var(--display); }
.status .where{ color:var(--ink-soft); }
.live{ display:inline-flex; align-items:center; gap:8px; font:700 .74rem var(--body); letter-spacing:.12em; text-transform:uppercase; color:var(--sage); }
.live i{ width:9px; height:9px; border-radius:50%; background:var(--sage); box-shadow:0 0 0 0 rgba(92,107,76,.5); animation:pulse 2s infinite; }
.live.on{ color:#2F6B34; } .live.on i{ background:#3C8A43; }
@keyframes pulse{ 0%{ box-shadow:0 0 0 0 rgba(60,138,67,.45); } 70%{ box-shadow:0 0 0 10px rgba(60,138,67,0); } 100%{ box-shadow:0 0 0 0 rgba(60,138,67,0); } }
.steam path{ stroke:var(--ink-faint); stroke-width:2.2; fill:none; stroke-linecap:round; opacity:.7; animation:steam 3.2s ease-in-out infinite; }
.steam path:nth-child(2){ animation-delay:.8s; } .steam path:nth-child(3){ animation-delay:1.6s; }
@keyframes steam{ 0%{ transform:translateY(6px); opacity:0; } 35%{ opacity:.7; } 100%{ transform:translateY(-10px); opacity:0; } }
@media (max-width:820px){ .hero{ grid-template-columns:1fr; padding-top:28px; gap:24px; } }

/* ---------- sections */
section.block{ padding-block:44px; }
.head{ display:flex; flex-wrap:wrap; align-items:end; justify-content:space-between; gap:12px; margin-bottom:22px; }
.head h2{ font-size:clamp(1.8rem, 4vw, 2.5rem); }

/* ---------- the menu card */
.menucard{ background:var(--white); border-radius:6px; padding:clamp(22px, 4vw, 44px); position:relative;
  box-shadow:0 1px 0 var(--line), 0 26px 50px -30px rgba(36,28,22,.45); outline:1px solid var(--line); outline-offset:-10px; }
.menucard::after{ content:""; position:absolute; inset:14px; border:1px solid var(--line); pointer-events:none; border-radius:2px; }
.menutop{ display:flex; flex-wrap:wrap; gap:12px 20px; align-items:center; justify-content:space-between; padding-bottom:18px; border-bottom:2px solid var(--ink); position:relative; z-index:1; }
.menutop h3{ font-size:clamp(1.6rem, 3.6vw, 2.2rem); }
.stamp{ font:800 .78rem/1 var(--body); letter-spacing:.16em; text-transform:uppercase; color:var(--ember); border:2px solid var(--ember); border-radius:8px; padding:8px 12px; transform:rotate(-3deg); background:rgba(159,43,32,.04); }
.cols{ display:grid; grid-template-columns:1fr 1fr; gap:10px 48px; margin-top:8px; position:relative; z-index:1; }
@media (max-width:760px){ .cols{ grid-template-columns:1fr; } }
.cat{ padding-top:22px; }
.cat h4{ display:flex; align-items:center; gap:10px; margin:0 0 6px; font:700 .78rem/1 var(--body); letter-spacing:.16em; text-transform:uppercase; color:var(--sage); }
.cat h4 svg{ width:26px; height:26px; flex:none; }
.dish{ display:grid; grid-template-columns:1fr auto; gap:2px 14px; padding:12px 0; border-bottom:1px dashed var(--line); }
.dish:last-child{ border-bottom:0; }
.dish.has-photo{ grid-template-columns:72px 1fr auto; }
.dish .ph{ grid-row:span 3; width:72px; height:72px; border-radius:10px; object-fit:cover; }
.dish .name{ display:flex; align-items:baseline; gap:8px; font:700 1.12rem/1.25 var(--display); min-width:0; }
.dish .name::after{ content:""; flex:1; border-bottom:2px dotted var(--line); transform:translateY(-4px); min-width:12px; }
.dish .price{ font:700 1.08rem var(--display); color:var(--ember-dark); font-variant-numeric:tabular-nums; }
.dish .about{ grid-column:1 / -1; color:var(--ink-soft); font-size:.93rem; }
.dish.has-photo .about, .dish.has-photo .meta{ grid-column:2 / -1; }
.dish .meta{ grid-column:1 / -1; display:flex; flex-wrap:wrap; gap:6px 10px; align-items:center; margin-top:4px; font-size:.8rem; color:var(--ink-faint); }
.tag{ font:700 .64rem/1 var(--body); letter-spacing:.1em; text-transform:uppercase; padding:5px 7px; border-radius:6px; background:var(--mustard-soft); color:#6E4F10; }
.tag.spicy{ background:#F6D8D2; color:var(--ember-dark); }
.tag.new{ background:var(--ink); color:var(--paper); }
.tag.vegetarian{ background:#DDE5D2; color:#3B4A2E; }
.stars{ color:var(--mustard); letter-spacing:1px; font-weight:700; }
.menufoot{ position:relative; z-index:1; display:flex; flex-wrap:wrap; gap:10px 24px; justify-content:space-between; align-items:center; margin-top:22px; padding-top:16px; border-top:2px solid var(--ink); font-size:.9rem; color:var(--ink-soft); }
.combo{ position:relative; z-index:1; display:flex; flex-wrap:wrap; align-items:baseline; gap:6px 14px; margin-top:20px; padding:14px 18px; border:2px dashed var(--ember); border-radius:12px; background:rgba(159,43,32,.04); }
.combo span:not(.eyebrow){ flex:1 1 200px; color:var(--ink); }
.combo b{ font:700 1.35rem/1 var(--display); color:var(--ember); }
.nextweek b{ font-family:var(--display); color:var(--ink); }

/* ---------- community */
.voices{ display:grid; grid-template-columns:.8fr 1.6fr; gap:22px; align-items:start; }
@media (max-width:820px){ .voices{ grid-template-columns:1fr; } }
.tally{ background:var(--ink); color:var(--paper); border-radius:var(--radius); padding:24px; display:grid; gap:18px; }
.tally .big{ font:700 3rem/1 var(--display); color:var(--mustard); }
.tally .row{ border-top:1px solid rgba(245,238,225,.18); padding-top:14px; }
.tally small{ display:block; font:700 .66rem/1.2 var(--body); letter-spacing:.14em; text-transform:uppercase; color:rgba(245,238,225,.65); margin-bottom:6px; }
.tally b{ font:700 1.2rem/1.25 var(--display); }
.quotes{ display:grid; grid-template-columns:repeat(auto-fill, minmax(240px, 1fr)); gap:14px; }
.quote{ background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:20px; display:grid; gap:10px; align-content:start; }
.quote p{ font:500 1.08rem/1.45 var(--display); }
.quote p::before{ content:"\201C"; color:var(--ember); }
.quote p::after{ content:"\201D"; color:var(--ember); }
.quote footer{ font-size:.82rem; color:var(--ink-faint); }
.empty{ border:2px dashed var(--line); border-radius:var(--radius); padding:26px; display:grid; gap:12px; justify-items:start; background:rgba(251,246,236,.6); }

.request{ margin-top:22px; background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:clamp(18px, 3vw, 28px); display:grid; grid-template-columns:1fr 1.1fr; gap:22px; align-items:start; }
.request h3{ font-size:1.5rem; margin:8px 0 6px; }
.reqform{ display:grid; gap:10px; }
.reqform textarea{ font:16px var(--body); color:var(--ink); background:var(--white); border:1.5px solid var(--line); border-radius:12px; padding:12px; width:100%; min-height:84px; }
.asked{ margin-top:14px; }
.asked small{ display:block; font:700 .66rem/1.2 var(--body); letter-spacing:.14em; text-transform:uppercase; color:var(--sage); margin-bottom:8px; }
.chiprow{ display:flex; flex-wrap:wrap; gap:6px; }
@media (max-width:760px){ .request{ grid-template-columns:1fr; } }

/* ---------- bands */
.band{ background:var(--ember-dark); color:var(--paper); border-radius:24px; padding:clamp(26px, 5vw, 48px); display:grid; grid-template-columns:1.4fr 1fr; gap:24px; align-items:center; position:relative; overflow:hidden; }
.band h2{ font-size:clamp(1.7rem, 4vw, 2.4rem); }
.band p{ color:#EBD9C7; margin-top:10px; }
.band .btn.primary{ background:var(--paper); color:var(--ember-dark); box-shadow:none; }
.band .btn.primary:hover{ background:var(--white); }
@media (max-width:760px){ .band{ grid-template-columns:1fr; } }
.story{ display:grid; grid-template-columns:1fr 1.3fr; gap:32px; align-items:start; }
.story .card{ background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:24px; display:grid; gap:12px; }
.story .sig{ font:italic 600 1.3rem var(--display); color:var(--ember-dark); }
@media (max-width:760px){ .story{ grid-template-columns:1fr; } }
.facts{ display:grid; grid-template-columns:repeat(3, 1fr); gap:12px; }
.facts div{ background:var(--white); border:1px solid var(--line); border-radius:12px; padding:14px; }
.facts b{ display:block; font:700 1.5rem var(--display); color:var(--ember-dark); }
.facts span{ font-size:.82rem; color:var(--ink-soft); }
.signup{ display:flex; gap:8px; flex-wrap:wrap; }
.signup input{ flex:1 1 220px; min-width:0; font:16px var(--body); padding:13px 14px; border-radius:12px; border:1.5px solid var(--line); background:var(--white); color:var(--ink); }
.band .signup input{ border-color:transparent; }
.formmsg{ min-height:1.4em; font-weight:600; font-size:.9rem; margin-top:8px; }
.copyline{ display:inline-flex; gap:8px; align-items:center; flex-wrap:wrap; background:var(--white); border:1px solid var(--line); border-radius:12px; padding:8px 8px 8px 14px; font-weight:600; max-width:100%; }
.copyline > span{ min-width:0; overflow-wrap:anywhere; }

/* ---------- forms (rate a dish, survey) */
.formpage{ max-width:620px; margin:0 auto; padding-block:30px 60px; }
.formpage h1{ font-size:clamp(2rem, 6vw, 2.8rem); margin:10px 0 8px; }
form.stack{ display:grid; gap:26px; margin-top:24px; }
fieldset{ border:0; padding:0; margin:0; display:grid; gap:8px; min-width:0; }
legend{ font:700 1.15rem var(--display); margin-bottom:8px; padding:0; }
legend small{ font:500 .82rem var(--body); color:var(--ink-faint); margin-left:6px; }
.opt{ position:relative; display:block; }
.opt input{ position:absolute; opacity:0; inset:0; margin:0; cursor:pointer; }
.opt > span{ display:block; background:var(--white); border:1.5px solid var(--line); border-radius:12px; padding:12px 14px; transition:border-color .15s, box-shadow .15s; }
.opt small{ display:block; color:var(--ink-faint); font-size:.82rem; }
.opt input:checked + span{ border-color:var(--ember-dark); box-shadow:0 0 0 3px rgba(124,32,24,.13); }
.opt input:focus-visible + span{ outline:2px solid var(--ember); outline-offset:2px; }
.chips{ display:flex; flex-wrap:wrap; gap:8px; }
.chips .opt > span{ padding:10px 14px; font-weight:600; text-align:center; min-width:52px; }
.scale .opt > span{ padding:0; width:56px; height:56px; display:grid; place-items:center; font-size:1.6rem; color:var(--line); }
.scale .opt.on > span{ color:var(--mustard); border-color:var(--mustard); }
.nps{ display:grid; grid-template-columns:repeat(11, 1fr); gap:5px; }
.nps .opt > span{ padding:10px 0; text-align:center; font-weight:700; font-variant-numeric:tabular-nums; }
.nps-ends{ display:flex; justify-content:space-between; font-size:.78rem; color:var(--ink-faint); }
@media (max-width:420px){ .nps{ grid-template-columns:repeat(6, 1fr); } }
label.f{ display:grid; gap:6px; font-weight:600; }
label.f input, label.f textarea{ font:16px var(--body); color:var(--ink); background:var(--white); border:1.5px solid var(--line); border-radius:12px; padding:12px; width:100%; }
textarea{ min-height:90px; resize:vertical; }
.check{ display:flex; gap:10px; align-items:flex-start; }
.check input{ width:20px; height:20px; margin:3px 0 0; accent-color:var(--ember-dark); flex:none; }
.hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.err{ color:var(--ember); font-weight:700; min-height:1.4em; }
.thanks{ background:var(--white); border:1px solid var(--line); border-radius:20px; padding:28px; display:grid; gap:14px; margin-top:24px; }

/* ---------- footer */
.foot{ margin-top:40px; border-top:1px solid var(--line); padding-block:34px 44px; }
.foot .wrap{ display:grid; grid-template-columns:1.3fr 1fr; gap:24px; }
.foot .maker{ font:600 1.15rem var(--display); }
.foot a{ font-weight:600; }
.foot .links{ display:flex; flex-wrap:wrap; gap:6px 16px; font-size:.9rem; }
@media (max-width:760px){ .foot .wrap{ grid-template-columns:1fr; } }
@media (prefers-reduced-motion: reduce){ *{ animation:none !important; transition:none !important; } html{ scroll-behavior:auto; } }
