/* ============================================================
   HARVEST HOUSE — website (mobile-first) layer on top of hh.css
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Caveat:wght@600;700&display=swap');

html{ background:#0B3338; }
body{
  background:#0B3338;
  min-height:100vh;
}

/* —— organic warmth: filmic grain + warm shadow tokens —— */
:root{
  --shadow-warm:0 2px 2px rgba(58,38,20,.06), 0 16px 30px -20px rgba(92,58,34,.5);
  --emboss:0 1px 0 rgba(255,252,244,.55);
  --deboss:0 1px 0 rgba(0,0,0,.28);
}

/* the phone-width column that centers on larger screens */
.site{
  max-width:520px;
  margin:0 auto;
  background:var(--cream);
  min-height:100vh;
  position:relative;
  overflow:visible;
  box-shadow:0 0 60px -10px rgba(0,0,0,.55);
  padding-bottom:78px; /* room for tab bar */
}

/* filmic grain over the whole column — kills the flat "screen fill" look */
.site::after{
  content:""; position:absolute; inset:0; z-index:44; pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E");
  opacity:.10; mix-blend-mode:overlay;
}

/* soft paper vignette so edges feel printed, not cropped */
.site::before{
  content:""; position:absolute; inset:0; z-index:43; pointer-events:none;
  box-shadow:inset 0 0 90px rgba(58,38,20,.10);
}

/* —— top bar —— */
.topbar{
  position:sticky; top:0; z-index:60;
  height:58px; display:flex; align-items:center; gap:12px;
  padding:0 16px;
  background:var(--teal-ink);
  color:var(--cream);
  border-bottom:1px solid rgba(224,169,49,.28);
}
.topbar .brand{ display:flex; align-items:center; gap:9px; text-decoration:none; color:var(--cream); }
.topbar .brand .mark{ height:30px; color:var(--gold); }
.topbar .brand b{ font-family:'Anton'; font-weight:400; text-transform:uppercase; font-size:1.02rem; letter-spacing:.02em; line-height:1; }
.topbar .order{
  margin-left:auto;
  font-family:'Archivo'; font-weight:800; font-size:.7rem; letter-spacing:.11em; text-transform:uppercase;
  background:var(--gold); color:var(--ink); text-decoration:none;
  padding:9px 15px; border-radius:999px; white-space:nowrap;
}
.topbar .order:active{ transform:translateY(1px); }

/* desktop nav links in the top bar — hidden on mobile (tab bar covers it) */
.desknav{ display:none; }

/* —— generic section —— */
.sec{ padding:36px 20px; }
.sec.tight{ padding:26px 20px; }
.eyebrow{
  display:inline-flex; align-items:center; gap:9px;
  font-family:'Archivo'; font-weight:800; font-size:.66rem; letter-spacing:.18em; text-transform:uppercase;
  color:var(--oak);
}
.eyebrow::before{ content:""; width:22px; height:2px; background:currentColor; opacity:.7; }
h1,h2,h3{ font-family:'Anton'; font-weight:400; text-transform:uppercase; margin:0; letter-spacing:.01em; line-height:.98; color:var(--teal-ink); }
.sec h1{ font-size:clamp(2.1rem,9vw,2.9rem); margin:10px 0 0; }
.sec h2{ font-size:clamp(1.9rem,8vw,2.5rem); margin:12px 0 0; }
.lead{ margin:14px 0 0; font-size:1.02rem; line-height:1.62; color:#4a463d; }

/* —— buttons —— */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  font-family:'Archivo'; font-weight:800; font-size:.82rem; letter-spacing:.1em; text-transform:uppercase;
  padding:15px 22px; border-radius:999px; border:2px solid transparent;
  text-decoration:none; cursor:pointer; width:100%; text-align:center;
}
.btn.gold{ background:var(--gold); color:var(--ink); }
.btn.teal{ background:var(--teal-ink); color:var(--cream); }
.btn.ghost{ background:transparent; border-color:currentColor; color:var(--teal-ink); }
.btn.ghost.cream{ color:var(--cream); }
.btn:active{ transform:translateY(1px); }
.btnrow{ display:flex; flex-direction:column; gap:11px; margin-top:22px; }
.btnpair{ display:flex; gap:11px; width:100%; }
.btnpair .btn{ flex:1; width:auto; padding-left:12px; padding-right:12px; }

/* —— open-now chip —— */
.status{
  display:inline-flex; align-items:center; gap:8px;
  font-family:'Archivo'; font-weight:700; font-size:.74rem; letter-spacing:.06em;
  padding:7px 13px 7px 11px; border-radius:999px;
  background:rgba(243,236,217,.12); color:var(--cream); border:1px solid rgba(243,236,217,.25);
}
.status .dot{ width:8px; height:8px; border-radius:50%; background:#8a8a8a; box-shadow:0 0 0 3px rgba(255,255,255,.08); }
.status.is-open .dot{ background:#63c07a; box-shadow:0 0 0 3px rgba(99,192,122,.22); }
.status.is-closed .dot{ background:var(--gold); box-shadow:0 0 0 3px rgba(224,169,49,.2); }

/* —— HERO —— */
.hero{
  position:relative; background:var(--teal-ink); color:var(--cream);
  padding:26px 22px 34px; overflow:hidden;
}
/* Dot-grid texture removed site-wide (Ty, 2026-07-13). The .ht overlay elements
   painted the repeating dot pattern on the dark sections (hero, happy hour, menu
   & tap-wall headers). Smooth teal gradients + film grain are kept. Restore: delete this rule. */
.ht{ display:none; }

.hero .ht{
  position:absolute; inset:0; color:var(--gold); opacity:.06; pointer-events:none;
  background-image:radial-gradient(currentColor 1px,transparent 1.4px); background-size:15px 15px;
}
.hero .inner{ position:relative; z-index:2; display:flex; flex-direction:column; align-items:center; text-align:center; }
.hero .mark{ height:64px; color:var(--gold); }
.hero .wordmark{ width:min(78vw,300px); color:var(--cream); margin-top:16px; }
.hero .kicker{ margin-top:18px; font-family:'Archivo'; font-weight:700; font-size:.72rem; letter-spacing:.2em; text-transform:uppercase; color:rgba(243,236,217,.72); }
.hero .tagline{ font-family:'Anton'; font-weight:400; text-transform:uppercase; color:var(--cream); font-size:clamp(1.5rem,6.4vw,2rem); line-height:1.02; margin:12px 4px 0; }
.hero .tagline b{ color:var(--gold); font-weight:400; }
.hero .status{ margin-top:20px; }
.hero .btnrow{ width:100%; margin-top:32px; }

/* full-bleed photo strip */
.photostrip{ position:relative; height:210px; overflow:hidden; }
.photostrip image-slot, .photostrip img{ width:100%; height:100%; display:block; object-fit:cover; }
.photostrip .cap{
  position:absolute; left:14px; bottom:12px; z-index:2;
  font-family:'Archivo'; font-weight:800; font-size:.64rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--cream); background:rgba(11,51,56,.72); padding:6px 11px; border-radius:999px; backdrop-filter:blur(3px);
}

/* —— info rows / hours —— */
.hours{ display:flex; flex-direction:column; gap:2px; margin-top:16px; }
.hours .row{ display:flex; justify-content:space-between; align-items:baseline; padding:11px 0; border-bottom:1px solid rgba(33,31,27,.1); }
.hours .row .d{ font-weight:700; color:var(--teal-ink); }
.hours .row .h{ color:#5a564c; font-variant-numeric:tabular-nums; }
.hours .row.now{ }
.hours .row.now .d::after{ content:"TODAY"; margin-left:9px; font-size:.58rem; font-weight:800; letter-spacing:.1em; color:var(--oak); vertical-align:middle; }

/* —— card —— */
.card{
  background:var(--cream-2); border:1.5px solid rgba(33,31,27,.1); border-radius:16px;
  padding:20px; box-shadow:var(--shadow-card);
}
.card + .card{ margin-top:14px; }

/* On the Stage — weekly lineup card (dark, so it reads as a "stage" moment on the cream page) */
.stagecard{
  background:var(--teal-ink); color:var(--cream);
  border-radius:16px 18px 15px 17px; padding:4px 22px;
  box-shadow:var(--shadow-warm);
}
.stagerow{
  display:flex; align-items:center; gap:14px;
  padding:16px 2px; border-bottom:1px solid rgba(243,236,217,.13);
}
.stagerow:last-child{ border-bottom:none; }
.stagedot{ width:10px; height:10px; border-radius:50%; flex:0 0 auto;
  box-shadow:0 0 0 3px rgba(0,0,0,.18); }
.stagename{ font-weight:700; color:var(--cream); font-size:1.04rem; letter-spacing:.005em; }
.stagewhen{ margin-left:auto; color:var(--gold); font-size:.76rem; font-weight:700;
  letter-spacing:.05em; text-transform:uppercase; white-space:nowrap; padding-left:12px; }

/* Featured show — announcement bar under the hero. Hidden until JS finds a featured show. */
.annbar{
  display:none; align-items:center; justify-content:center; gap:12px; flex-wrap:wrap;
  background:var(--gold); color:var(--ink); text-decoration:none;
  padding:13px 20px; text-align:center;
  font-family:'Archivo', sans-serif; font-weight:800; font-size:.94rem; line-height:1.3;
  box-shadow:inset 0 -2px 0 rgba(58,38,20,.16);
}
.annbar.on{ display:flex; }
.annbar .when{
  font-size:.66rem; letter-spacing:.1em; text-transform:uppercase;
  background:rgba(38,35,32,.17); padding:4px 10px; border-radius:20px; white-space:nowrap;
}
.annbar .go{ font-size:.72rem; letter-spacing:.06em; text-transform:uppercase; text-decoration:underline; white-space:nowrap; opacity:.75; }
.annbar:active{ transform:translateY(1px); }

/* "This week" — the week ahead as a printed listing (one line per day, not a calendar widget) */
.wklist{ margin-top:14px; border-top:2px solid var(--teal-ink); }
.wkrow{ display:flex; align-items:baseline; gap:14px; padding:13px 4px;
  border-bottom:1px solid rgba(38,35,32,.13); }
.wkrow .d{ font-family:'Anton', sans-serif; font-weight:400; font-size:.95rem; letter-spacing:.05em;
  text-transform:uppercase; color:var(--teal-ink); flex:0 0 74px; }
.wkrow .n{ flex:1; min-width:0; font-weight:700; color:var(--ink); font-size:1rem; line-height:1.25; }
.wkrow .more{ font-weight:600; font-size:.82rem; color:#6b665c; white-space:nowrap; }
.wkrow .t{ color:var(--coral); font-weight:800; font-size:.74rem; letter-spacing:.05em;
  text-transform:uppercase; white-space:nowrap; }
.wkrow.today{ background:linear-gradient(90deg, rgba(224,169,49,.16), transparent 62%); }
.wkrow.today .d{ color:var(--coral-deep); }
.wkrow.none .n{ color:#918c80; font-weight:600; }

/* —— story —— */
.story .photostrip{ border-radius:16px; height:250px; margin-top:18px; box-shadow:var(--shadow-card); }
.story .signoff{ margin-top:16px; font-family:'Archivo'; font-style:italic; color:var(--oak); font-weight:600; }

/* —— happy hour banner —— */
.happy{ background:var(--gold); color:var(--ink); position:relative; overflow:hidden; }
.happy .ht{ position:absolute; inset:0; color:var(--ink); opacity:.05; background-image:radial-gradient(currentColor 1px,transparent 1.4px); background-size:14px 14px; }
.happy .inner{ position:relative; z-index:2; }
.happy .eyebrow{ color:var(--oak-deep); }
.happy h2{ color:var(--ink); }
.happy .lead{ color:#3d3527; }
.happy .when{ display:inline-block; margin-top:16px; font-family:'Anton'; text-transform:uppercase; font-size:1.1rem; color:var(--teal-ink); background:var(--cream); padding:8px 15px; border-radius:10px; }

/* —— tap list —— */
.taps{ display:flex; flex-direction:column; gap:0; margin-top:16px; }
.tap{ display:flex; align-items:baseline; gap:12px; padding:13px 0; border-bottom:1px solid rgba(33,31,27,.1); }
.tap .nm{ font-weight:700; color:var(--teal-ink); }
.tap .meta{ font-size:.82rem; color:#6b665c; }
.tap .abv{ margin-left:auto; font-family:'Archivo'; font-weight:800; font-size:.78rem; color:var(--oak); white-space:nowrap; }
.tap .local{ font-size:.56rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--gold-deep); background:rgba(224,169,49,.16); padding:2px 7px; border-radius:999px; }

/* —— booking form —— */
.form{ margin-top:18px; display:flex; flex-direction:column; gap:14px; }
.field{ display:flex; flex-direction:column; gap:6px; }
.field label{ font-family:'Archivo'; font-weight:700; font-size:.72rem; letter-spacing:.08em; text-transform:uppercase; color:var(--teal-ink); }
.field input, .field textarea, .field select{
  font-family:'Archivo'; font-size:.98rem; color:var(--ink);
  background:var(--cream); border:1.5px solid rgba(33,31,27,.2); border-radius:11px; padding:13px 14px; width:100%;
}
.field input:focus, .field textarea:focus, .field select:focus{ outline:none; border-color:var(--teal); box-shadow:0 0 0 3px rgba(26,96,104,.14); }
.field .hint{ font-size:.72rem; color:#8b8577; }
.formnote{ font-size:.78rem; color:#6b665c; margin-top:2px; }

/* —— visit —— */
.map{ position:relative; height:190px; border-radius:16px; overflow:hidden; margin-top:16px; background:var(--teal-deep); box-shadow:var(--shadow-card); }
.map .grid{ position:absolute; inset:0; opacity:.5;
  background-image:linear-gradient(rgba(243,236,217,.14) 1px,transparent 1px),linear-gradient(90deg,rgba(243,236,217,.14) 1px,transparent 1px);
  background-size:34px 34px; }
.map .road{ position:absolute; background:rgba(243,236,217,.22); }
.map .r1{ left:0; right:0; top:58%; height:12px; transform:rotate(-4deg); }
.map .r2{ top:0; bottom:0; left:38%; width:11px; }
.map .pin{ position:absolute; left:38%; top:58%; transform:translate(-50%,-100%); z-index:3; }
.map .pin .mark{ height:26px; color:var(--ink); }
.map .pindot{ width:44px; height:44px; border-radius:50% 50% 50% 4px; background:var(--gold); display:grid; place-items:center; transform:rotate(45deg); box-shadow:0 8px 18px -6px rgba(0,0,0,.5); }
.map .pindot .mark{ transform:rotate(-45deg); }
.addr{ margin-top:16px; }
.addr .line{ display:flex; gap:11px; align-items:flex-start; padding:11px 0; border-bottom:1px solid rgba(33,31,27,.1); }
.addr .line svg{ width:18px; height:18px; color:var(--oak); flex:none; margin-top:2px; }
.addr .line b{ color:var(--teal-ink); }
.addr .line span{ color:#5a564c; font-size:.92rem; }

/* —— footer —— */
.foot{ background:var(--teal-ink); color:var(--cream); padding:30px 22px 34px; text-align:center; }
.foot .mark{ height:44px; color:var(--gold); margin:0 auto; }
.foot .social{ display:flex; justify-content:center; gap:14px; margin-top:20px; }
.foot .social a{ width:44px; height:44px; border-radius:50%; border:1.5px solid rgba(243,236,217,.3); display:grid; place-items:center; color:var(--cream); text-decoration:none; }
.foot .social a svg{ width:20px; height:20px; }
.foot .fine{ margin-top:20px; font-size:.74rem; color:rgba(243,236,217,.6); line-height:1.7; }
.foot .footlink{ display:inline-block; margin-top:18px; font-family:'Archivo'; font-weight:800; font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; color:var(--gold); text-decoration:none; border-bottom:1.5px solid rgba(224,169,49,.5); padding-bottom:3px; }

/* —— unified footer with real venue info —— */
.foot .footlogo{ width:150px; height:auto; margin:0 auto; display:block; }
.foot .footcontact{ margin-top:14px; }
.foot .footcontact p{ margin:0; font-size:.94rem; line-height:1.62; color:rgba(243,236,217,.85); }
.foot .footcontact .footaddr{ font-style:normal; }
.foot .footcontact a{ color:inherit; text-decoration:none; }
.foot .footcontact a:hover{ color:var(--gold); }
.foot .foothours{ margin-top:18px; font-size:.9rem; line-height:1.62; color:rgba(243,236,217,.75); }
.foot .foothours b{ display:block; font-family:'Archivo'; font-weight:800; font-size:.66rem; letter-spacing:.16em; text-transform:uppercase; color:var(--gold); margin-bottom:4px; }
.foot .foothours p{ margin:0; font-variant-numeric:tabular-nums; }
.foot .footnav{ display:flex; flex-wrap:wrap; justify-content:center; gap:9px 20px; margin-top:22px; padding-top:20px; border-top:1px solid rgba(243,236,217,.16); }
.foot .footnav a{ font-family:'Archivo'; font-weight:700; font-size:.74rem; letter-spacing:.09em; text-transform:uppercase; color:var(--cream); text-decoration:none; opacity:.9; }
.foot .footnav a:hover{ color:var(--gold); opacity:1; }

/* —— bottom tab bar —— */
.tabbar{
  position:fixed; left:50%; transform:translateX(-50%); bottom:0; z-index:50;
  width:100%; max-width:520px;
  display:grid; grid-template-columns:repeat(5,1fr);
  background:var(--cream); border-top:1.5px solid rgba(33,31,27,.12);
  padding:8px 4px calc(8px + env(safe-area-inset-bottom));
}
.tabbar a{
  display:flex; flex-direction:column; align-items:center; gap:3px; text-decoration:none;
  color:#8a8577; font-family:'Archivo'; font-weight:700; font-size:.6rem; letter-spacing:.02em;
  padding:5px 1px; border-radius:10px;
}
.tabbar a svg{ width:23px; height:23px; }
.tabbar a.active{ color:var(--teal-ink); }
.tabbar a.active svg{ color:var(--gold); }

/* —— section divider tick —— */
.tick{ display:flex; align-items:center; gap:12px; color:var(--oak); opacity:.5; }
.tick::before,.tick::after{ content:""; height:1.5px; background:currentColor; flex:1; }
.tick .mark{ height:16px; }

/* —— menu page —— */
.menuhead{ background:var(--teal-ink); color:var(--cream); padding:26px 22px 30px; text-align:center; position:relative; overflow:hidden; }
.menuhead .ht{ position:absolute; inset:0; color:var(--gold); opacity:.06; background-image:radial-gradient(currentColor 1px,transparent 1.4px); background-size:15px 15px; }
.menuhead .mark{ height:40px; color:var(--gold); position:relative; }
.menuhead h1{ color:var(--cream); font-size:2.1rem; margin-top:10px; position:relative; }
.menuhead p{ position:relative; margin:8px 0 0; color:rgba(243,236,217,.75); font-size:.9rem; }
/* menu header over the kitchen photo (2026-07-09) */
.menuhead{ z-index:45; min-height:210px; display:flex; flex-direction:column; justify-content:center; }
.menuhead .bg{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:50% 60%; z-index:0; }
.menuhead .scrim{ position:absolute; inset:0; z-index:1; background:linear-gradient(180deg, rgba(8,10,9,.48) 0%, rgba(8,10,9,.64) 100%); }
.menuhead .ht{ z-index:1; }
.menuhead h1{ z-index:2; text-shadow:0 2px 10px rgba(0,0,0,.55); }
.menuhead p{ z-index:2; color:rgba(243,236,217,.92); text-shadow:0 1px 8px rgba(0,0,0,.6); }
.menujump{ position:sticky; top:58px; z-index:30; display:flex; gap:8px; overflow-x:auto; padding:11px 16px; background:var(--cream-2); border-bottom:1px solid rgba(33,31,27,.1); -webkit-overflow-scrolling:touch; }
.menujump a{ white-space:nowrap; font-family:'Archivo'; font-weight:700; font-size:.72rem; letter-spacing:.06em; text-transform:uppercase; color:var(--teal-ink); text-decoration:none; padding:7px 13px; border-radius:999px; border:1.5px solid rgba(33,31,27,.16); background:var(--cream); }
/* cross-page pill: jump from the food menu to the drinks page */
.menujump a.jumpdrinks{ background:var(--gold); color:var(--ink); border-color:var(--gold); font-weight:800; margin-left:auto; }
.mgroup{ padding:26px 20px 8px; scroll-margin-top:112px; }
.mgroup .gh{ display:flex; align-items:center; gap:10px; }
.mgroup .gh .mark{ height:20px; color:var(--gold); }
.mgroup .gh h2{ font-size:1.5rem; }
.mgroup .note{ font-family:'Archivo'; font-style:italic; color:var(--oak); font-size:.86rem; margin:10px 0 2px; }
/* On Tap section header — matches the Toast category headers for one cohesive system */
#ontap{ scroll-margin-top:112px; padding:26px 20px 0; }
#thisweek{ scroll-margin-top:72px; } /* clear the 58px sticky topbar when jumped to from the hero */
#ontap .gh{ display:flex; align-items:center; gap:10px; }
#ontap .gh .mark{ height:20px; color:var(--gold); }
#ontap .gh h2{ font-size:1.5rem; }
.mitem{ padding:15px 0; border-bottom:1px solid rgba(33,31,27,.1); }
.mitem .top{ display:flex; justify-content:space-between; align-items:baseline; gap:12px; }
.mitem .nm{ font-family:'Archivo'; font-weight:800; font-size:1.02rem; color:var(--teal-ink); letter-spacing:.01em; }
.mitem .pr{ font-family:'Anton'; font-weight:400; color:var(--oak); font-size:1.15rem; white-space:nowrap; }
.mitem .desc{ margin:5px 0 0; font-size:.9rem; color:#5a564c; line-height:1.5; }
.saucegrid{ display:grid; grid-template-columns:1fr; gap:11px; margin-top:14px; }
/* —— home: header reveals after scrolling 75% of the hero —— */
html.js body[data-page="home"] .topbar{
  margin-bottom:-58px; /* hero rises into the header slot */
  transform:translateY(-102%); visibility:hidden;
  transition:transform .35s cubic-bezier(.4,0,.2,1), visibility 0s .35s;
}
html.js body[data-page="home"].hdr-show .topbar{
  transform:translateY(0); visibility:visible;
  transition:transform .35s cubic-bezier(.4,0,.2,1), visibility 0s 0s;
}
@media (prefers-reduced-motion: reduce){
  html.js body[data-page="home"] .topbar,
  html.js body[data-page="home"].hdr-show .topbar{ transition:none; }
}

/* —— hero over the real backyard photo —— */
.hero{ z-index:45; } /* lift above the site grain+vignette overlays (z43/44) so the photo stays clean; topbar is bumped above this */
.hero .bg{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; }
.hero .scrim{ position:absolute; inset:0; z-index:1;
  background:linear-gradient(rgba(8,10,9,.14), rgba(8,10,9,.14)),
    linear-gradient(180deg, rgba(8,10,9,.42) 0%, rgba(8,10,9,.16) 42%, rgba(8,10,9,.56) 100%); }
.hero .tagline{ text-shadow:0 2px 10px rgba(0,0,0,.55); }
.hero .wordmark{ filter:drop-shadow(0 2px 7px rgba(0,0,0,.5)); }
.hero .ht{ z-index:1; }
.hero .tagline{ margin-top:20px; font-size:clamp(1.7rem,7.5vw,2.4rem); }
.hero{ padding:calc(52px + env(safe-area-inset-top)) 26px 58px; }

/* —— Google reviews (home) —— */
.revlist{ display:flex; flex-direction:column; gap:14px; margin-top:18px; }
.revcard{ margin:0; background:var(--cream-2); border:1.5px solid rgba(92,58,34,.16); border-radius:14px 16px 15px 13px; box-shadow:var(--shadow-warm); padding:18px; }
.revstars{ color:var(--gold); font-size:.95rem; letter-spacing:2px; }
.revcard blockquote{ margin:10px 0 0; font-size:.95rem; line-height:1.6; color:#4a463d; }
.revcard figcaption{ margin-top:10px; font-family:'Archivo'; font-weight:700; font-size:.78rem; color:var(--teal-ink); }
.revcard figcaption span{ font-weight:600; color:#8b8577; }
@media (min-width: 900px){
  .revlist{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; align-items:start; }
}

/* live-menu badges (Toast-driven) */
.badgefav, .badge86{
  display:inline-block; margin-left:8px; vertical-align:2px;
  font-family:'Archivo'; font-weight:800; font-size:.56rem; letter-spacing:.08em; text-transform:uppercase;
  padding:2px 7px; border-radius:999px; text-shadow:none; white-space:nowrap;
}
.badgefav{ color:var(--gold-deep,#8a6516); background:rgba(224,169,49,.18); }
.badge86{ color:#8a3a28; background:rgba(154,74,52,.14); }
.mitem.is86 .nmx, .mitem.is86 .desc, .mitem.is86 .pr{ opacity:.45; }
.sauceitem{ font-size:.9rem; color:#5a564c; }
.sauceitem b{ color:var(--teal-ink); }
.orderbar{ padding:22px 20px 30px; }

/* —— calendar page —— */
.calhead{ background:var(--teal-ink); color:var(--cream); padding:24px 20px; text-align:center; }
.calhead h1{ color:var(--cream); font-size:1.9rem; }
.calhead .sub{ color:rgba(243,236,217,.72); font-size:.86rem; margin-top:6px; }
.calnav{ display:flex; align-items:center; justify-content:space-between; padding:16px 20px 4px; }
.calnav .mo{ font-family:'Anton'; text-transform:uppercase; font-size:1.3rem; color:var(--teal-ink); }
.calnav button{ width:38px; height:38px; border-radius:50%; border:1.5px solid rgba(33,31,27,.2); background:var(--cream); color:var(--teal-ink); font-size:1.1rem; cursor:pointer; display:grid; place-items:center; }
.filters{ display:flex; gap:8px; overflow-x:auto; padding:12px 20px; -webkit-overflow-scrolling:touch; }
.filters button{ white-space:nowrap; font-family:'Archivo'; font-weight:700; font-size:.7rem; letter-spacing:.05em; text-transform:uppercase; color:var(--teal-ink); border:1.5px solid rgba(33,31,27,.18); background:var(--cream); padding:7px 13px; border-radius:999px; cursor:pointer; display:flex; align-items:center; gap:6px; }
.filters button .sw{ width:9px; height:9px; border-radius:50%; }
.filters button.active{ background:var(--teal-ink); color:var(--cream); border-color:var(--teal-ink); }
.calgrid{ padding:6px 12px 0; }
.dow{ display:grid; grid-template-columns:repeat(7,1fr); gap:4px; margin-bottom:4px; }
.dow span{ text-align:center; font-family:'Archivo'; font-weight:800; font-size:.6rem; letter-spacing:.04em; text-transform:uppercase; color:#8a8577; }
.days{ display:grid; grid-template-columns:repeat(7,1fr); gap:4px; }
.day{ aspect-ratio:1; border-radius:9px; padding:5px 0 0; position:relative; display:flex; flex-direction:column; align-items:center; background:var(--cream-2); border:1px solid transparent; cursor:default; }
.day.empty{ background:transparent; }
.day .n{ font-family:'Archivo'; font-weight:700; font-size:.72rem; color:#5a564c; }
.day.today{ border-color:var(--gold); }
.day.today .n{ color:var(--oak); }
.day.has{ cursor:pointer; }
.day .dots{ display:flex; gap:2px; margin-top:auto; margin-bottom:5px; flex-wrap:wrap; justify-content:center; max-width:80%; }
.day .dots i{ width:5px; height:5px; border-radius:50%; }
.day.sel{ background:var(--teal-ink); }
.day.sel .n{ color:var(--cream); }
.legend-hint{ text-align:center; font-size:.72rem; color:#8a8577; padding:12px 20px 4px; }
.evlist{ padding:8px 20px 26px; }
.evlist .dayhdr{ font-family:'Anton'; text-transform:uppercase; color:var(--teal-ink); font-size:1.15rem; margin:18px 0 10px; }
.ev{ display:flex; gap:13px; padding:13px; border-radius:13px; background:var(--cream-2); border:1.5px solid rgba(33,31,27,.09); margin-bottom:10px; }
.ev .time{ font-family:'Anton'; text-transform:uppercase; color:var(--oak); font-size:.92rem; width:58px; flex:none; line-height:1.15; padding-top:2px; }
.ev .body{ flex:1; }
.ev .type{ display:inline-flex; align-items:center; gap:6px; font-family:'Archivo'; font-weight:800; font-size:.6rem; letter-spacing:.09em; text-transform:uppercase; color:#6b665c; }
.ev .type .sw{ width:8px; height:8px; border-radius:50%; }
.ev .name{ font-family:'Archivo'; font-weight:800; color:var(--teal-ink); font-size:1rem; margin:3px 0 0; }
.ev .sub{ font-size:.84rem; color:#5a564c; margin-top:2px; }
.ev .free{ margin-left:auto; align-self:flex-start; font-size:.58rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:#2f7d4a; background:rgba(99,192,122,.16); padding:3px 8px; border-radius:999px; }
.emptyday{ text-align:center; color:#8a8577; padding:26px 20px; font-size:.92rem; }

/* ============================================================
   ORGANIC / AUTHENTIC OVERRIDES  (less "digital")
   ============================================================ */

/* letterpress: dark headings pressed into cream, light headings debossed into ink */
.sec h2, .mgroup .gh h2, #ontap .gh h2, .story h2, .happy h2,
.eyebrow, .signoff, .mitem .nm, .tap .nm, .addr .line b{
  text-shadow:var(--emboss);
}
.hero .tagline, .menuhead h1, .calhead h1, .hero .kicker, .foot .fine{
  text-shadow:var(--deboss);
}
.hero .wordmark{ filter:drop-shadow(0 2px 7px rgba(0,0,0,.5)); }

/* warm, sepia shadows instead of cool blue */
.card, .photostrip, .map, .story .photostrip{ box-shadow:var(--shadow-warm); }

/* photos: warm them and let grain sit on top so they read like prints, not stock */
.photostrip img, .photostrip image-slot{ filter:saturate(.92) contrast(1.02) sepia(.06); }
.photostrip::after{
  content:""; position:absolute; inset:0; pointer-events:none; z-index:1;
  background:linear-gradient(180deg, rgba(92,58,34,.10), transparent 30%, rgba(11,51,56,.14));
  mix-blend-mode:multiply;
}
.photostrip{ position:relative; }

/* buttons: stamped/physical rather than flat digital pills */
.btn{ border-radius:12px; box-shadow:inset 0 1px 0 rgba(255,255,255,.22), 0 2px 0 rgba(58,38,20,.18); }
.btn.ghost{ box-shadow:none; }
.btn:active{ box-shadow:inset 0 2px 3px rgba(58,38,20,.28); }
.topbar .order{ border-radius:9px; box-shadow:inset 0 1px 0 rgba(255,255,255,.3), 0 2px 0 rgba(58,38,20,.22); }

/* cards & inputs: hand-cut edges, slightly irregular radius, softer borders */
.card{ border-radius:14px 16px 15px 13px; border-color:rgba(92,58,34,.16); background:var(--cream-2); }
.field input, .field textarea, .field select{ border-radius:11px 12px 11px 12px; border-color:rgba(92,58,34,.24); background:var(--cream); }
.happy .when{ border-radius:8px 10px 9px 11px; }

/* hero: richer screenprint — layered dots + subtle top light */
.hero{ background:radial-gradient(120% 90% at 50% -10%, #14454b 0%, var(--teal-ink) 62%); }
.hero .ht{ opacity:.09; background-size:13px 13px; }
.menuhead{ background:radial-gradient(120% 100% at 50% -20%, #14454b, var(--teal-ink)); }

/* the "handwritten" signoff — give it a real script face for a personal touch */
.signoff{ font-family:'Caveat','Archivo',cursive; font-style:normal; font-size:1.45rem; font-weight:600; letter-spacing:.01em; text-shadow:none; }

/* stamped visit photo caption / pin keeps a hand-inked ring */
.map .pindot{ border:2px solid rgba(255,252,244,.65); }

/* tab bar: warm paper, softer than pure chrome */
.tabbar{ background:var(--cream); box-shadow:0 -8px 20px -14px rgba(58,38,20,.4); }

/* section rhythm: hand-torn rule under eyebrows instead of a clean tick */
.eyebrow::before{ height:3px; border-radius:2px; background:currentColor; opacity:.85; }

/* —— statement band (first section after hero) —— */
.statement{ background:var(--cream); padding:40px 24px 34px; text-align:center; }
.statement h2{ font-family:'Anton'; font-weight:400; text-transform:uppercase; color:var(--teal-ink); font-size:clamp(2.4rem,12vw,3.4rem); line-height:.94; letter-spacing:.01em; text-shadow:var(--emboss); }
.statement h2 b{ color:var(--gold); font-weight:400; }

/* —— statement overlaid on hero photo —— */
.hero-photo{ height:340px; }
.hero-photo::before{ content:""; position:absolute; inset:0; z-index:2; background:linear-gradient(to top, rgba(11,51,56,.82) 0%, rgba(11,51,56,.35) 45%, rgba(11,51,56,.12) 100%); }
.overlay-statement{ position:absolute; left:0; right:0; bottom:0; z-index:3; padding:24px; text-align:left;
  font-family:'Anton'; font-weight:400; text-transform:uppercase; color:var(--cream);
  font-size:clamp(2.3rem,11vw,3.2rem); line-height:.92; letter-spacing:.01em; text-shadow:0 2px 10px rgba(0,0,0,.4); }
.overlay-statement b{ color:var(--gold); font-weight:400; }

/* —— overlay header (title + subtitle over a photo) —— */
.overlay-head{ position:absolute; left:0; right:0; bottom:0; z-index:3; padding:24px; }
.overlay-head .mark{ height:34px; color:var(--gold); margin-bottom:10px; filter:drop-shadow(0 2px 6px rgba(0,0,0,.4)); }
.overlay-head h1{ font-family:'Anton'; font-weight:400; text-transform:uppercase; color:var(--cream); font-size:clamp(2rem,9vw,2.7rem); line-height:.94; letter-spacing:.01em; text-shadow:0 2px 10px rgba(0,0,0,.45); margin:0; }
.overlay-head p{ margin:8px 0 0; font-family:'Archivo'; font-weight:600; font-size:.95rem; color:rgba(243,236,217,.9); text-shadow:0 1px 6px rgba(0,0,0,.5); }

/* —— collapsed musician callout —— */
.bookcard{ margin-top:8px; background:var(--cream-2); border:1.5px solid rgba(92,58,34,.16); border-radius:14px 16px 15px 13px; box-shadow:var(--shadow-warm); overflow:hidden; }
.bookcard summary{ list-style:none; cursor:pointer; display:flex; align-items:center; gap:14px; padding:18px 18px; }
.bookcard summary::-webkit-details-marker{ display:none; }
.bookcard summary .bt{ flex:1; }
.bookcard summary h3{ font-family:'Anton'; font-weight:400; text-transform:uppercase; color:var(--teal-ink); font-size:1.2rem; margin:0; text-shadow:var(--emboss); }
.bookcard summary p{ margin:3px 0 0; font-size:.88rem; color:#6b665c; }
.bookcard summary .chev{ flex:none; width:30px; height:30px; border-radius:50%; background:var(--gold); color:var(--ink); display:grid; place-items:center; font-size:1.1rem; transition:transform .25s; box-shadow:inset 0 1px 0 rgba(255,255,255,.3); }
.bookcard[open] summary .chev{ transform:rotate(45deg); }
.bookcard .form{ margin:0; padding:2px 18px 20px; }

/* ============================================================
   TAP WALL (feed-driven)
   ============================================================ */
.tapline{ display:flex; align-items:flex-start; gap:14px; padding:14px 0; border-bottom:1px solid rgba(92,58,34,.14); }
.tapmain{ flex:1; min-width:0; }
.tapnm{ font-family:'Archivo'; font-weight:800; font-size:1rem; color:var(--teal-ink); line-height:1.2; text-shadow:var(--emboss); display:flex; align-items:center; gap:7px; flex-wrap:wrap; }
.tapnm .loc{ font-family:'Archivo'; font-weight:800; font-size:.54rem; letter-spacing:.08em; color:var(--oak-deep,#7a4e1e); background:rgba(224,169,49,.2); padding:2px 6px; border-radius:4px; text-shadow:none; }
.tapby{ font-size:.86rem; color:#6b665c; margin-top:2px; }
.tapstyle{ font-size:.78rem; color:#948d7e; margin-top:1px; font-style:italic; }
.tapright{ text-align:right; flex:none; display:flex; flex-direction:column; align-items:flex-end; gap:3px; padding-top:1px; }
.tapabv{ font-family:'Anton'; font-weight:400; color:var(--oak); font-size:1.05rem; }
.tapprice{ font-size:.74rem; color:#6b665c; white-space:nowrap; }
.tapgroup{ margin-bottom:6px; }
.tapgh{ font-family:'Anton'; text-transform:uppercase; color:var(--teal-ink); font-size:1.15rem; margin:22px 0 2px; letter-spacing:.02em; text-shadow:var(--emboss); }
.tapgroup .tapgh:first-child{ margin-top:6px; }

/* tap page header + filters reuse calendar patterns */
.tapwallhead{ background:radial-gradient(120% 100% at 50% -20%, #14454b, var(--teal-ink)); color:var(--cream); padding:26px 22px 24px; text-align:center; position:relative; overflow:hidden; }
.tapwallhead .ht{ position:absolute; inset:0; color:var(--gold); opacity:.07; background-image:radial-gradient(currentColor 1px,transparent 1.4px); background-size:14px 14px; }
.tapwallhead .mark{ height:38px; color:var(--gold); position:relative; }
.tapwallhead h1{ color:var(--cream); font-size:2rem; margin-top:10px; position:relative; text-shadow:var(--deboss); }
.tapwallhead .meta{ position:relative; margin-top:8px; font-family:'Archivo'; font-weight:700; font-size:.72rem; letter-spacing:.08em; text-transform:uppercase; color:rgba(243,236,217,.72); }
.tapwallhead{ z-index:45; min-height:210px; display:flex; flex-direction:column; justify-content:center; }
.tapwallhead .bg{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:50% 45%; z-index:0; }
.tapwallhead .scrim{ position:absolute; inset:0; z-index:1; background:linear-gradient(180deg, rgba(8,10,9,.48) 0%, rgba(8,10,9,.64) 100%); }
.tapwallhead .ht{ z-index:1; }
.tapwallhead h1{ z-index:2; text-shadow:0 2px 10px rgba(0,0,0,.55); }
.tapwallhead .meta{ z-index:2; color:rgba(243,236,217,.92); text-shadow:0 1px 8px rgba(0,0,0,.6); }
.tapfilters{ position:sticky; top:58px; z-index:30; display:flex; gap:8px; overflow-x:auto; padding:12px 16px; background:var(--cream-2); border-bottom:1px solid rgba(92,58,34,.14); -webkit-overflow-scrolling:touch; }
.tapfilters button{ white-space:nowrap; font-family:'Archivo'; font-weight:700; font-size:.72rem; letter-spacing:.04em; text-transform:uppercase; color:var(--teal-ink); border:1.5px solid rgba(92,58,34,.2); background:var(--cream); padding:8px 13px; border-radius:999px; cursor:pointer; display:inline-flex; align-items:center; gap:6px; }
.tapfilters button em{ font-style:normal; font-weight:800; color:var(--oak); font-size:.68rem; }
.tapfilters button.active{ background:var(--teal-ink); color:var(--cream); border-color:var(--teal-ink); }
.tapfilters button.active em{ color:var(--gold); }
.tapwalllist{ padding:4px 20px 8px; }

/* ============================================================
   MENU — smooth scroll · sticky-nav scroll-spy · gentle reveal
   ============================================================ */
html{ scroll-behavior:smooth; }

/* active section pill (matches the calendar/tap filter treatment) */
.menujump a{ transition:background-color .25s ease, color .25s ease, border-color .25s ease; }
.menujump a.active{ background:var(--teal-ink); color:var(--cream); border-color:var(--teal-ink); }

/* menu items rise into view as you scroll — only when JS is on, so a no-JS
   page still shows everything. `.js` is set on <html> by an inline head script. */
html.js .mitem{ opacity:0; transform:translateY(12px); transition:opacity .5s ease, transform .55s cubic-bezier(.2,.7,.2,1); }
html.js .mitem.in{ opacity:1; transform:none; }

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  .menujump a{ transition:none; }
  html.js .mitem, html.js .mitem.in{ opacity:1; transform:none; transition:none; }
}

/* ============================================================
   APP FEEL — animated page transitions + native touch
   ============================================================ */
/* cross-document view transitions: pages crossfade instead of white-flashing */
@view-transition{ navigation: auto; }
::view-transition-old(root), ::view-transition-new(root){ animation-duration:.26s; animation-timing-function:cubic-bezier(.4,0,.2,1); }

/* native touch feel */
*{ -webkit-tap-highlight-color: transparent; }          /* no grey flash on tap */
html{ overscroll-behavior-y: none; }                     /* no rubber-band / pull-to-refresh */
.topbar, .tabbar, .btn, .order, .menujump a, .filters button, .tapfilters button, .calnav button, .bookcard summary{
  -webkit-user-select:none; user-select:none;            /* chrome isn't selectable, like an app */
}

@media (prefers-reduced-motion: reduce){
  ::view-transition-old(root), ::view-transition-new(root){ animation:none; }
}

/* ============================================================
   DESKTOP (≥900px) — same site, room to breathe
   ============================================================ */
@media (min-width: 900px){
  /* the column widens; tab bar retires in favor of top-bar nav */
  .site{ max-width:1080px; padding-bottom:0; }
  .tabbar{ display:none; }

  .topbar{ padding:0 28px; }
  .desknav{ display:flex; align-items:center; gap:26px; margin-left:auto; }
  .desknav a{
    font-family:'Archivo'; font-weight:700; font-size:.78rem; letter-spacing:.09em; text-transform:uppercase;
    color:rgba(243,236,217,.85); text-decoration:none; padding:6px 2px;
    border-bottom:2px solid transparent; transition:color .2s ease, border-color .2s ease;
  }
  .desknav a:hover{ color:var(--cream); }
  .desknav a.active{ color:var(--gold); border-bottom-color:var(--gold); }
  .topbar .order{ margin-left:22px; }

  /* hero: centered over the yard — content column centered, air all around */
  .hero{ min-height:700px; display:flex; align-items:center; justify-content:center; padding:96px 72px; }
  .hero .scrim{ background:linear-gradient(rgba(8,10,9,.14), rgba(8,10,9,.14)),
    linear-gradient(180deg, rgba(8,10,9,.5) 0%, rgba(8,10,9,.4) 48%, rgba(8,10,9,.58) 100%); }
  .hero .inner{ align-items:center; text-align:center; max-width:640px; }
  .hero .mark{ height:58px; }
  .hero .wordmark{ width:300px; }
  .hero .kicker{ margin-top:16px; letter-spacing:.26em; }
  .hero .tagline{ font-size:clamp(2.6rem,3.9vw,3.6rem); line-height:.94; margin-top:16px; }
  .hero .btnrow{ flex-direction:column; align-items:center; justify-content:center; gap:16px; margin-top:34px; }
  .hero .btnpair{ width:auto; gap:14px; }
  .hero .btnpair .btn{ min-width:150px; padding:14px 28px; }
  .hero .btnrow > .btn.ghost{ border:none; box-shadow:none; min-width:0; width:auto; padding:6px 1px;
    border-bottom:2px solid rgba(224,169,49,.75); border-radius:0; font-size:.78rem; text-shadow:0 1px 8px rgba(0,0,0,.75); }
  .hero .btnrow > .btn.ghost:hover{ color:var(--gold); border-bottom-color:var(--gold); }

  /* content sections: comfortable reading column inside the wide site */
  .sec{ max-width:880px; margin-inline:auto; padding:56px 32px; }
  .sec .lead{ max-width:62ch; }
  .sec .card{ max-width:720px; }
  .sec .stagecard{ max-width:640px; }
  .sec .wklist{ max-width:640px; }
  .stagecard .stagename{ font-size:1.1rem; }
  .btnrow{ flex-direction:row; justify-content:flex-start; gap:14px; }
  .btnrow .btn{ width:auto; min-width:300px; }
  .orderbar{ max-width:880px; margin-inline:auto; text-align:center; }
  .orderbar .btn{ width:auto; min-width:340px; }

  /* photos get real height at full bleed */
  .hero-photo{ height:440px !important; }
  .sec .photostrip{ height:320px !important; }
  .overlay-statement{ padding:36px 40px; }
  .overlay-head{ padding:32px 40px; }

  /* visit info: 2×2 grid */
  .addr{ display:grid; grid-template-columns:1fr 1fr; gap:0 44px; }

  /* menu: group header spans, items flow in two columns */
  .mgroup{ max-width:1000px; margin-inline:auto; padding:36px 32px 12px;
    display:grid; grid-template-columns:1fr 1fr; column-gap:48px; align-content:start; }
  .mgroup .gh, .mgroup .note{ grid-column:1 / -1; }
  .saucegrid{ grid-column:1 / -1; grid-template-columns:1fr 1fr; gap:12px 44px; }
  .menuhead{ padding:44px 32px 46px; }
  .menujump{ padding:12px 28px; }

  /* tap wall: two columns per style group */
  #ontap{ max-width:1000px; margin-inline:auto; padding:36px 32px 0; }
  #ontap .tapwalllist{ max-width:none; margin:0; padding:4px 0 8px; }
  .tapwalllist{ max-width:1000px; margin-inline:auto; padding:4px 32px 8px; }
  .tapgroup{ display:grid; grid-template-columns:1fr 1fr; column-gap:48px; }
  .tapgroup .tapgh{ grid-column:1 / -1; }
  .tapwallhead{ padding:44px 32px 40px; }
  .tapfilters{ padding:12px 28px; }

  /* booking form: paired fields */
  .form{ display:grid; grid-template-columns:1fr 1fr; gap:16px 20px; }
  .form .btn{ grid-column:1 / -1; justify-self:center; width:auto; min-width:340px; }
  .form .formnote{ grid-column:1 / -1; text-align:center; }

  /* calendar: keep the grid a comfortable width, centered */
  .calhead{ padding:40px 32px; }
  .calnav, .calgrid, .legend-hint{ max-width:680px; margin-inline:auto; }
  .filters{ max-width:680px; margin-inline:auto; }
  .evlist{ max-width:760px; margin-inline:auto; }

  /* footer breathes */
  .foot{ padding:44px 32px 48px; }
}

/* Order CTAs hidden 2026-07-10 (Ty) — Toast online ordering isn't wired yet, so
   every "Order" control is either a dead link or just a jump to the menu.
   To restore: delete this block (and un-hide the two orderbar buttons in
   taps.html / menu.html). */
.topbar .order{ display:none !important; }