/* Maxie's Henderson (v5)
   Neighborhood restaurant & bar. Warm, lived-in, evening light.
   Linen and oat grounds, warm night-brown for the bar and footer,
   and Maxie's red as the accent: labels, primary buttons, the dinner card,
   the social hour note and the closing band.
   Type: Newsreader for headlines, Montserrat for everything else. */

@font-face { font-family: "Newsreader"; src: url("../fonts/newsreader-normal.woff2") format("woff2"); font-weight: 360 540; font-style: normal; font-display: swap; }
@font-face { font-family: "Newsreader"; src: url("../fonts/newsreader-italic.woff2") format("woff2"); font-weight: 360 540; font-style: italic; font-display: swap; }
@font-face { font-family: "Montserrat"; src: url("../fonts/montserrat-latin-var.woff") format("woff"); font-weight: 100 900; font-display: swap; }

:root {
  /* grounds */
  --linen: #F6F0E7;
  --oat: #ECE1D0;
  --sand: #E3D2B8;
  --night: #261A17;
  --night-2: #33231F;
  /* ink */
  --ink: #2A221D;
  --ink-soft: #62564D;
  --ink-faint: #8E8177;
  --on-night: #F3EADF;
  --on-night-soft: #BFB2A5;
  /* accents */
  --red: #E81E25;
  --red-deep: #C8161C;
  --red-text: #B8141A;     /* red for small text on linen/oat */
  --red-dark: #A51015;
  --red-glow: #FF8F80;     /* red for text on night */
  --rule: #DCCDB9;
  --rule-night: #4C3731;

  --serif: "Newsreader", "Iowan Old Style", Georgia, serif;
  --sans: "Montserrat", "Helvetica Neue", Arial, sans-serif;

  --wrap: 1280px;
  --gutter: clamp(20px, 4.5vw, 64px);
  --header-h: 84px;
  --radius: 6px;
  --ease: cubic-bezier(.22,.61,.36,1);
  --section: clamp(72px, 9vw, 140px);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--header-h) + 16px); }
body { margin: 0; background: var(--linen); color: var(--ink); font: 400 16px/1.7 var(--sans); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
body.nav-open { overflow: hidden; }
img { display: block; max-width: 100%; height: auto; }
h1, h2, h3, p, ul, ol, dl, dd, figure { margin: 0; }
ul, ol { padding: 0; list-style: none; }
a { color: inherit; }
::selection { background: var(--sand); color: var(--ink); }
:focus-visible { outline: 2px solid var(--red); outline-offset: 3px; border-radius: 2px; }
.skip { position: absolute; left: 12px; top: -60px; background: var(--ink); color: var(--linen); padding: 10px 14px; z-index: 300; text-decoration: none; }
.skip:focus { top: 12px; }
.wrap { width: min(var(--wrap), 100% - 2 * var(--gutter)); margin-inline: auto; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- Type ---------- */
.eyebrow { font: 600 12px/1.2 var(--sans); letter-spacing: .16em; text-transform: uppercase; color: var(--red-text); }
.eyebrow--night { color: var(--red-glow); }
.display { font-family: var(--serif); font-weight: 380; font-size: clamp(52px, 7.2vw, 108px); line-height: .96; letter-spacing: -.025em; }
.h2 { font-family: var(--serif); font-weight: 400; font-size: clamp(36px, 4.4vw, 64px); line-height: 1.02; letter-spacing: -.02em; text-wrap: balance; }
.h2-logo { display: inline-block; height: 1.25em; width: auto; vertical-align: -.3em; margin-left: .06em; }
.h2 em, .display em { font-style: italic; font-weight: 360; }
.lede { font-size: 17px; line-height: 1.75; color: var(--ink-soft); max-width: 52ch; }
.serif-note { font-family: var(--serif); font-style: italic; font-size: clamp(21px, 1.8vw, 25px); line-height: 1.4; color: var(--ink); }

/* ---------- Buttons ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 50px; padding: 14px 28px; border-radius: 999px; font: 600 13.5px/1 var(--sans); letter-spacing: .04em; text-decoration: none; border: 1.5px solid transparent; transition: background-color 180ms var(--ease), color 180ms var(--ease), border-color 180ms var(--ease), transform 180ms var(--ease); }
.btn:active { transform: translateY(1px); }
.btn--ink { background: var(--ink); color: var(--linen); }
.btn--ink:hover { background: #000; }
.btn--red { background: var(--red); color: #fff; }
.btn--red:hover { background: var(--red-dark); }
.btn--line { border-color: currentColor; color: var(--ink); }
.btn--line:hover { background: var(--ink); border-color: var(--ink); color: var(--linen); }
.btn--glow { background: var(--on-night); color: var(--night); }
.btn--glow:hover { background: #fff; }
.btn--line-night { border-color: var(--rule-night); color: var(--on-night); }
.btn--line-night:hover { border-color: var(--on-night); }
.btn--line-light { border-color: rgba(255,255,255,.7); color: #fff; }
.btn--line-light:hover { background: #fff; border-color: #fff; color: var(--red-deep); }
.btns { display: flex; flex-wrap: wrap; gap: 12px; }
.btn svg { width: 16px; height: 16px; flex: none; }

.textlink { font-weight: 600; font-size: 14px; letter-spacing: .02em; text-decoration: none; background: linear-gradient(currentColor, currentColor) 0 100% / 100% 1.5px no-repeat; padding-bottom: 3px; transition: background-size 220ms var(--ease); }
.textlink:hover { background-size: 0 1.5px; background-position: 100% 100%; }

/* ---------- Header ---------- */
.header { position: sticky; top: 0; z-index: 100; height: var(--header-h); background: color-mix(in srgb, var(--linen) 94%, transparent); backdrop-filter: saturate(1.2) blur(10px); -webkit-backdrop-filter: saturate(1.2) blur(10px); transition: box-shadow 200ms var(--ease); }
.header.is-scrolled { box-shadow: 0 1px 0 var(--rule); }
.header .wrap { height: 100%; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.logo { display: block; flex: none; }
.logo img { width: 116px; }
.nav { display: flex; align-items: center; gap: 34px; }
.nav a:not(.btn) { font-weight: 600; font-size: 14px; letter-spacing: .02em; text-decoration: none; position: relative; padding-block: 6px; }
.nav a:not(.btn)::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1.5px; background: var(--red); transform: scaleX(0); transform-origin: left; transition: transform 220ms var(--ease); }
.nav a:not(.btn):hover::after, .nav a[aria-current="page"]::after { transform: scaleX(1); }
.nav .tel { font-weight: 500; color: var(--ink-soft); font-variant-numeric: tabular-nums; }
.nav .btn { min-height: 44px; padding: 11px 22px; }

/* mobile panel */
.panel { position: fixed; inset: 0; z-index: 200; background: var(--night); color: var(--on-night); display: flex; flex-direction: column; padding: 0 var(--gutter) 32px; visibility: hidden; opacity: 0; transition: opacity 220ms var(--ease), visibility 0s 220ms; }
.panel.is-open { visibility: visible; opacity: 1; transition: opacity 220ms var(--ease); }
.panel-top { height: var(--header-h); display: flex; align-items: center; justify-content: space-between; }
.panel-top img { width: 116px; }
.panel nav { display: flex; flex-direction: column; margin-top: 24px; }
.panel nav a { font-family: var(--serif); font-size: 44px; line-height: 1.1; letter-spacing: -.02em; text-decoration: none; padding: 12px 0; border-bottom: 1px solid var(--rule-night); }
.panel-foot { margin-top: auto; display: grid; gap: 12px; }
.panel .btn { width: 100%; min-height: 54px; font-size: 14px; }
.panel .btn--red { color: #fff; }
.panel .btn--glow { color: var(--night); }
.panel .btn--line-night { color: var(--on-night); }
.icon-btn { width: 48px; height: 48px; display: grid; place-items: center; background: none; border: 0; color: inherit; cursor: pointer; border-radius: 50%; margin-right: -12px; }
.icon-btn svg { width: 26px; height: 26px; }
.nav .nav-toggle { display: none; }

/* ---------- Home hero ---------- */
.hero { position: relative; display: grid; grid-template-columns: minmax(0, 11fr) minmax(0, 13fr); gap: clamp(32px, 5vw, 80px); align-items: center; padding: clamp(16px, 2vw, 32px) 0 clamp(64px, 7vw, 104px); }
.hero-text { display: grid; gap: 28px; padding-left: max(var(--gutter), calc((100vw - var(--wrap)) / 2)); }
.hero .display .hero-logo { display: block; height: 1.12em; width: auto; margin: .06em 0 .1em -.02em; }
.hero .display .hero-logo--solo { height: auto; width: clamp(260px, 32vw, 460px); margin: 0 0 0 -.02em; }
.hero .display .pre { display: block; font-size: .42em; font-style: italic; letter-spacing: -.01em; line-height: 1.2; color: var(--red-text); margin-bottom: .18em; }
.hero-sub { font-family: var(--serif); font-size: clamp(21px, 1.9vw, 26px); line-height: 1.4; color: var(--ink-soft); max-width: 30ch; }
.hero-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 22px; font-size: 14px; color: var(--ink-soft); padding-top: 26px; border-top: 1px solid var(--rule); }
.status { display: inline-flex; align-items: center; gap: 10px; font-weight: 600; color: var(--ink); }
.status-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--ink-faint); }
.status.is-open .status-dot { background: #E0892F; box-shadow: 0 0 0 4px rgba(224,137,47,.18), 0 0 14px 2px rgba(224,137,47,.55); animation: glow 3.2s ease-in-out infinite; }
@keyframes glow { 50% { box-shadow: 0 0 0 6px rgba(224,137,47,.10), 0 0 20px 4px rgba(224,137,47,.35); } }
.hero-photo { position: relative; height: min(76svh, 720px); min-height: 460px; }
.hero-photo picture, .hero-photo img { width: 100%; height: 100%; }
.hero-photo img { object-fit: cover; border-radius: 220px 0 0 var(--radius); }
.hero-note { position: absolute; left: -36px; bottom: 36px; background: var(--red-deep); color: #fff; padding: 18px 22px 18px 20px; border-radius: var(--radius); display: grid; gap: 4px; max-width: 250px; box-shadow: 0 24px 50px -22px rgba(120,16,20,.55); }
.hero-note strong { font-family: var(--serif); font-weight: 400; font-size: 22px; line-height: 1.15; }
.hero-note span { font-size: 13px; color: #FFE1DC; }

/* ---------- Welcome ---------- */
.welcome { background: var(--oat); padding-block: var(--section); }
.welcome .wrap { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 40px clamp(40px, 6vw, 96px); align-items: center; }
.welcome-text { display: grid; gap: 28px; }
.welcome-photo { margin: 0; aspect-ratio: 4 / 5; border-radius: var(--radius); overflow: hidden; }
.welcome-photo picture, .welcome-photo img { width: 100%; height: 100%; }
.welcome-photo img { object-fit: cover; }
.photo-ph { width: 100%; height: 100%; display: grid; place-content: center; justify-items: center; gap: 8px; text-align: center; background: var(--sand); border: 1.5px dashed #C9B08E; border-radius: var(--radius); color: var(--ink-soft); }
.photo-ph svg { width: 36px; height: 36px; margin-bottom: 6px; color: var(--red-text); }
.photo-ph span { font-family: var(--serif); font-size: 26px; color: var(--ink); }
.photo-ph small { font-size: 13px; }
.welcome-body { display: grid; gap: 36px; }
.welcome-body p.big { font-family: var(--serif); font-weight: 380; font-size: clamp(24px, 2.2vw, 32px); line-height: 1.36; letter-spacing: -.01em; text-wrap: pretty; }
.welcome-body p.big em { color: var(--red-text); }
.welcome-body p.big .welcome-tag { display: block; margin-top: .9em; }
.facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--rule); }
.facts div { padding: 22px 24px 0 0; display: grid; gap: 6px; }
.facts div + div { padding-left: 24px; border-left: 1px solid var(--rule); }
.facts dt { font: 600 12px/1.2 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--ink-faint); }
.facts dd { font-family: var(--serif); font-size: 22px; line-height: 1.25; }

/* ---------- Day: four offerings ---------- */
.day { padding-block: var(--section); }
.section-head { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 20px 64px; align-items: end; margin-bottom: clamp(40px, 5vw, 64px); }
.section-head div > .h2 { margin-top: 16px; }
.section-head .lede { justify-self: end; }
.day-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.slot { --bg: var(--linen); --fg: var(--ink); --soft: var(--ink-soft); --accent: var(--red-text); display: flex; flex-direction: column; background: var(--bg); color: var(--fg); text-decoration: none; border-radius: var(--radius); overflow: hidden; transition: transform 300ms var(--ease), box-shadow 300ms var(--ease); }
.slot:hover, .slot:focus-visible { transform: translateY(-4px); box-shadow: 0 26px 50px -30px rgba(34,28,24,.55); }
.slot--morning { --bg: #FBF7F1; --accent: var(--red-text); box-shadow: inset 0 0 0 1px var(--rule); }
.slot--noon { --bg: var(--sand); --accent: var(--red-text); }
.slot--evening { --bg: var(--red-deep); --fg: #FFFFFF; --soft: #FFDCD7; --accent: #FFE9C9; }
.slot--night { --bg: var(--night); --fg: var(--on-night); --soft: var(--on-night-soft); --accent: var(--red-glow); }
.slot picture { display: block; overflow: hidden; aspect-ratio: 4 / 5; }
.slot img { width: 100%; height: 100%; object-fit: cover; transition: transform 700ms var(--ease); }
.slot:hover img, .slot:focus-visible img { transform: scale(1.04); }
.slot-body { display: grid; gap: 8px; padding: 22px 22px 26px; flex: 1; align-content: start; }
.slot-time { font: 600 12px/1.2 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--accent); }
.slot h3 { font-family: var(--serif); font-weight: 400; font-size: 32px; line-height: 1.05; letter-spacing: -.015em; }
.slot p { font-size: 14.5px; line-height: 1.6; color: var(--soft); }
.slot-go { margin-top: 10px; display: inline-flex; align-items: center; gap: 8px; font-weight: 600; font-size: 13px; color: var(--fg); }
.slot-go svg { width: 16px; height: 16px; transition: transform 220ms var(--ease); }
.slot:hover .slot-go svg { transform: translateX(4px); }

/* ---------- Favorites ---------- */
.favs { padding-block: 0 var(--section); }
.favs-grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(32px, 6vw, 96px); align-items: start; }
.favs-stage { position: sticky; top: calc(var(--header-h) + 24px); aspect-ratio: 4 / 5; border-radius: var(--radius); overflow: hidden; background: var(--oat); }
.favs-stage picture { position: absolute; inset: 0; opacity: 0; transition: opacity 420ms var(--ease); }
.favs-stage picture.is-on { opacity: 1; }
.favs-stage img { width: 100%; height: 100%; object-fit: cover; }
.favs-list { border-top: 1px solid var(--rule); counter-reset: fav; }
.fav { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 24px; padding: 26px 0 28px; border-bottom: 1px solid var(--rule); cursor: default; position: relative; }
.fav::before { content: ""; position: absolute; left: -22px; top: 38px; width: 8px; height: 8px; border-radius: 50%; background: var(--red); transform: scale(0); transition: transform 220ms var(--ease); }
.fav.is-on::before { transform: scale(1); }
.fav .cat { grid-column: 1 / -1; font: 600 11.5px/1.2 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--red-text); }
.fav h3 { transition: color 200ms var(--ease); }
.fav.is-on h3 { color: var(--red-text); }
.fav:focus-visible { outline-offset: 6px; }
.fav h3 { font-family: var(--serif); font-weight: 400; font-size: clamp(24px, 2.2vw, 31px); line-height: 1.12; letter-spacing: -.012em; }
.fav .price { font-family: var(--serif); font-size: 24px; line-height: 1.2; font-variant-numeric: lining-nums; }
.fav p { grid-column: 1 / -1; font-size: 15px; color: var(--ink-soft); max-width: 56ch; }
.fav-thumb { display: none; }
.favs-foot { margin-top: 36px; display: flex; flex-wrap: wrap; gap: 14px 28px; align-items: center; }

/* ---------- Bar (night) ---------- */
.bar { background: var(--night); color: var(--on-night); padding-block: var(--section); overflow: hidden; }
.bar .wrap { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(40px, 7vw, 112px); align-items: center; }
.bar-photos { position: relative; aspect-ratio: 1 / 1; }
.bar-photos picture { position: absolute; border-radius: var(--radius); overflow: hidden; }
.bar-photos img { width: 100%; height: 100%; object-fit: cover; }
.bar-photos .p1 { left: 0; top: 0; width: 64%; height: 86%; }
.bar-photos .p2 { right: 0; bottom: 0; width: 46%; height: 58%; box-shadow: 0 0 0 10px var(--night); }
.bar-photos::after { content: ""; position: absolute; left: 30%; top: 40%; width: 60%; height: 60%; background: radial-gradient(closest-side, rgba(232,30,37,.28), transparent); filter: blur(20px); z-index: -1; }
.bar-text { display: grid; gap: 26px; }
.bar .eyebrow { color: var(--red-glow); }
.bar .h2 em { color: var(--red-glow); }
.bar .lede { color: var(--on-night-soft); }
.bar-list { display: grid; border-top: 1px solid var(--rule-night); }
.bar-list li { display: flex; justify-content: space-between; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--rule-night); font-size: 15px; }
.bar-list li span:last-child { color: var(--on-night-soft); text-align: right; }

/* ---------- Gallery ---------- */
.gallery { padding-block: var(--section); }
.gallery .section-head { align-items: end; }
.gallery-ig { justify-self: end; color: var(--red-text); }
.g-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-rows: clamp(150px, 16vw, 240px); grid-auto-flow: dense; gap: 12px; }
.g-item { position: relative; border-radius: var(--radius); overflow: hidden; background: var(--oat); }
.g-wide { grid-column: span 2; }
.g-tall { grid-row: span 2; }
.g-big { grid-column: span 2; grid-row: span 2; }
.g-btn { display: block; width: 100%; height: 100%; padding: 0; border: 0; background: none; cursor: zoom-in; }
.g-btn picture, .g-btn img { width: 100%; height: 100%; }
.g-btn img { object-fit: cover; transition: transform 700ms var(--ease), filter 300ms var(--ease); }
.g-btn:hover img, .g-btn:focus-visible img { transform: scale(1.04); }
.g-btn:focus-visible { outline: 3px solid var(--red); outline-offset: -3px; }
.lightbox { width: min(1100px, 100vw - 32px); max-height: calc(100svh - 32px); padding: 0; border: 0; background: transparent; overflow: visible; }
.lightbox::backdrop { background: rgba(28,19,17,.9); }
.lightbox figure { display: grid; gap: 12px; justify-items: center; }
.lightbox img { max-width: 100%; max-height: calc(100svh - 120px); width: auto; height: auto; border-radius: var(--radius); }
.lightbox figcaption { color: var(--on-night-soft); font-size: 14px; text-align: center; }
.lb-btn { position: fixed; width: 48px; height: 48px; display: grid; place-items: center; border-radius: 50%; border: 0; background: rgba(255,255,255,.12); color: #fff; cursor: pointer; transition: background-color 160ms var(--ease); }
.lb-btn:hover { background: rgba(255,255,255,.24); }
.lb-btn svg { width: 22px; height: 22px; }
.lb-close { top: 16px; right: 16px; }
.lb-prev { left: 16px; top: 50%; transform: translateY(-50%); }
.lb-next { right: 16px; top: 50%; transform: translateY(-50%); }

/* ---------- Visit ---------- */
.visit { padding-block: var(--section); }
.visit-grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(40px, 6vw, 96px); align-items: start; }
.visit-info { display: grid; gap: 30px; }
.info { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 0 20px; border-top: 1px solid var(--rule); }
.info dt, .info dd { padding: 16px 0; border-bottom: 1px solid var(--rule); }
.info dt { font: 600 12px/1.9 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--ink-faint); }
.info dd { font-size: 16px; }
.info a { text-underline-offset: 4px; text-decoration-color: var(--rule); }
.info a:hover { text-decoration-color: currentColor; }
.visit-media { display: grid; gap: 16px; }
.visit-media figure { position: relative; border-radius: var(--radius); overflow: hidden; }
.visit-media figure img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.visit-media figcaption { position: absolute; left: 14px; bottom: 14px; background: color-mix(in srgb, var(--linen) 92%, transparent); padding: 7px 12px; border-radius: 999px; font-size: 12px; color: var(--ink-soft); }
.map { border-radius: var(--radius); overflow: hidden; aspect-ratio: 16 / 7; background: var(--oat); }
.map iframe { width: 100%; height: 100%; border: 0; display: block; filter: sepia(.35) saturate(.8) contrast(.95); }

/* ---------- Page heads (menu, visit) ---------- */
.page-head { padding: clamp(40px, 6vw, 88px) 0 clamp(40px, 5vw, 64px); }
.page-head .wrap { display: grid; grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); gap: 24px 64px; align-items: end; }
.page-head .display { margin-top: 18px; white-space: nowrap; }
@media (max-width: 520px) { .page-head .display { white-space: normal; font-size: clamp(46px, 13vw, 60px); } }
.page-head .lede { justify-self: end; }

/* ---------- Menu page ---------- */
.menu-tabs { position: sticky; top: var(--header-h); z-index: 50; background: var(--linen); border-block: 1px solid var(--rule); }
.mtabs { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 8px; padding: 10px 0; }
.mtab { display: grid; gap: 2px; place-items: center; align-content: center; text-align: center; min-height: 64px; padding: 12px 10px; border-radius: var(--radius); text-decoration: none; color: var(--ink-soft); transition: background-color 180ms var(--ease), color 180ms var(--ease); }
.mtab span { font-family: var(--serif); font-size: 26px; line-height: 1.1; color: var(--ink); }
.mtab small { font-size: 12.5px; font-weight: 500; }
.mtab:hover { background: var(--oat); }
.mtab[aria-selected="true"] { background: var(--red-deep); color: #FFE1DC; }
.mtab[aria-selected="true"] span { color: #fff; }
.menu-body { padding-bottom: var(--section); }
.js .mpanel { display: none; }
.js .mpanel.is-on { display: block; animation: fadein 320ms var(--ease); }
@keyframes fadein { from { opacity: 0; transform: translateY(6px); } }
.mpanel { padding-top: clamp(40px, 5vw, 64px); }
.mpanel + .mpanel { border-top: 2px solid var(--red-deep); }
.js .mpanel + .mpanel { border-top: 0; }
.mpanel-lede { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 18px; font-size: 15px; color: var(--ink-soft); }
.mpanel-lede strong { font-family: var(--serif); font-weight: 400; font-size: clamp(40px, 5vw, 64px); line-height: 1; letter-spacing: -.02em; color: var(--ink); }
.mjump { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 26px; }
.mjump a { display: block; padding: 7px 14px; border: 1px solid var(--rule); border-radius: 999px; font-weight: 600; font-size: 13px; text-decoration: none; color: var(--ink-soft); transition: border-color 160ms var(--ease), color 160ms var(--ease); }
.mjump a:hover { border-color: var(--red-deep); color: var(--red-text); }
.features { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 20px; margin-top: 32px; }
.features--one { grid-template-columns: 1fr; }
.feature { border-radius: var(--radius); padding: clamp(24px, 3vw, 40px); display: grid; gap: 14px; align-content: start; }
.feature h3 { font-family: var(--serif); font-weight: 400; font-size: clamp(28px, 2.6vw, 38px); line-height: 1.05; letter-spacing: -.015em; }
.feature--red { background: var(--red-deep); color: #fff; }
.feature--red .eyebrow { color: #FFE1DC; }
.feature--red p { color: #FFECE9; }
.feature--red dl { display: grid; grid-template-columns: auto 1fr; gap: 10px 20px; margin-top: 6px; padding-top: 16px; border-top: 1px solid rgba(255,255,255,.3); font-size: 15px; }
.feature--red dt { font: 600 11.5px/1.9 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: #FFD2CB; }
.feature--night { background: var(--night); color: var(--on-night); }
.deals { display: grid; border-top: 1px solid var(--rule-night); margin-top: 6px; }
.deals li { padding: 12px 0; border-bottom: 1px solid var(--rule-night); font-size: 16px; }
.deals strong { font-family: var(--serif); font-weight: 400; font-size: 22px; color: var(--red-glow); margin-right: 8px; }
.msec { padding-top: clamp(48px, 6vw, 80px); scroll-margin-top: calc(var(--header-h) + 110px); }
.msec-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 24px 48px; align-items: end; padding-bottom: 24px; border-bottom: 2px solid var(--red-deep); }
.msec-head .h2 { font-size: clamp(32px, 3.4vw, 48px); }
.msec-head p { margin-top: 12px; font-size: 15px; color: var(--ink-soft); max-width: 62ch; }
.msec-img { width: clamp(150px, 20vw, 260px); aspect-ratio: 4 / 3; border-radius: var(--radius); overflow: hidden; }
.msec-img img { width: 100%; height: 100%; object-fit: cover; }
.items { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(32px, 5vw, 80px); }
.item { display: grid; gap: 4px; padding: 22px 0; border-bottom: 1px solid var(--rule); align-content: start; }
.item h3, .item h4 { margin: 0; font-family: var(--serif); font-weight: 450; font-size: 22px; line-height: 1.2; letter-spacing: -.005em; }
.item p { font-size: 14.5px; line-height: 1.6; color: var(--ink-soft); }
.item .opt { font-size: 13px; color: var(--ink-faint); font-style: italic; }
.item .tag { display: inline-block; margin-left: 10px; vertical-align: 4px; font: 600 10.5px/1 var(--sans); letter-spacing: .1em; text-transform: uppercase; color: #fff; background: var(--red-deep); border-radius: 999px; padding: 5px 9px; }
.mbox { margin-top: 28px; padding: clamp(22px, 3vw, 34px); background: var(--oat); border-radius: var(--radius); display: grid; gap: 12px; }
.mbox h3, .mbox .mbox-t { margin: 0; font-family: var(--serif); font-weight: 400; font-size: 28px; line-height: 1.1; }
.mbox p { color: var(--ink-soft); }
.mbox .mbox-l { margin: 6px 0 0; font: 600 12px/1.4 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--red-text); }
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chips li { padding: 6px 12px; background: var(--linen); border-radius: 999px; font-size: 13.5px; }
.menu-note { margin-top: clamp(56px, 7vw, 88px); display: grid; gap: 8px; font-size: 13px; line-height: 1.7; color: var(--ink-faint); max-width: 84ch; }
.drinks { background: var(--night); color: var(--on-night); border-radius: var(--radius); display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); overflow: hidden; }
.drinks--text { grid-template-columns: 1fr; }
.drinks-text { padding: clamp(24px, 3vw, 40px); display: grid; gap: 16px; align-content: center; }
.drinks-text p { color: var(--on-night-soft); }
.drinks picture, .drinks img { width: 100%; height: 100%; }
.drinks img { object-fit: cover; min-height: 260px; }

/* ---------- Visit page ---------- */
.v-hero { position: relative; }
.v-hero img { width: 100%; aspect-ratio: 21 / 9; object-fit: cover; border-radius: var(--radius); object-position: 50% 28%; }
.v-hero figcaption { margin-top: 12px; font-size: 13px; color: var(--ink-faint); }
.v-cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(28px, 4vw, 64px); padding-block: clamp(48px, 6vw, 88px); }
.v-col { display: grid; gap: 14px; align-content: start; padding-top: 22px; border-top: 2px solid var(--red-deep); }
.v-col h2 { font-family: var(--serif); font-weight: 400; font-size: 30px; line-height: 1.1; }
.v-col p { color: var(--ink-soft); }
.hours { display: grid; gap: 0; }
.hours div { display: flex; justify-content: space-between; gap: 16px; padding: 10px 0; border-bottom: 1px solid var(--rule); font-size: 15px; }
.hours div span:last-child { font-variant-numeric: tabular-nums; }
.hours div.is-today { font-weight: 600; }
.hours div.is-today span:first-child::after { content: " (today)"; font-weight: 500; color: var(--red-text); }
.v-map { padding-bottom: var(--section); }
.v-map .map { aspect-ratio: 21 / 8; }

/* ---------- Closing band ---------- */
.closing { background: var(--red-deep); color: #fff; padding-block: clamp(64px, 8vw, 112px); text-align: center; }
.closing .eyebrow { color: #FFE1DC; }
.closing .h2 em { color: #FFE9C9; }
.closing .wrap { display: grid; justify-items: center; gap: 26px; }
.closing .h2 { max-width: 18ch; }

/* ---------- Footer ---------- */
.footer { border-top: 4px solid var(--red); background: var(--night); color: var(--on-night-soft); padding: clamp(56px, 7vw, 96px) 0 32px; font-size: 14.5px; }
.footer-top { display: grid; grid-template-columns: minmax(0, 4fr) repeat(3, minmax(0, 2.4fr)); gap: 40px; padding-bottom: 56px; border-bottom: 1px solid var(--rule-night); }
.footer-brand { display: grid; gap: 22px; align-content: start; }
.footer-brand img { width: 150px; }
.footer-brand p { font-family: var(--serif); font-style: italic; font-size: 21px; line-height: 1.35; color: var(--on-night); max-width: 22ch; }
.footer h2 { font: 600 12px/1.2 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--red-glow); margin-bottom: 16px; }
.footer ul { display: grid; gap: 8px; }
.footer a { color: var(--on-night); text-decoration: none; }
.footer a:hover { text-decoration: underline; text-underline-offset: 4px; text-decoration-color: var(--red-glow); }
.footer-bottom { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 12px 32px; padding-top: 28px; font-size: 13px; }

/* ---------- Reveal ---------- */
.js .reveal { opacity: 0; transform: translateY(18px); transition: opacity 700ms var(--ease), transform 700ms var(--ease); }
.js .reveal.is-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; }
  .js .reveal { opacity: 1; transform: none; }
}

/* ---------- Tablet ---------- */
@media (max-width: 1100px) {
  .footer-top { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .footer-brand { grid-column: 1 / -1; }
}

/* ---------- Mobile: hamburger shows at 900px and below ---------- */
@media (max-width: 900px) {
  :root { --header-h: 72px; }
  .nav a:not(.btn) { display: none; }
  .nav { gap: 10px; }
  .nav .btn { min-height: 40px; padding: 9px 16px; font-size: 12.5px; }
  .nav .nav-toggle { display: grid; }
  .logo img, .panel-top img { width: 96px; }

  .hero { grid-template-columns: 1fr; padding-top: 8px; gap: 36px; }
  .hero-photo { order: -1; height: auto; min-height: 0; aspect-ratio: 5 / 4; margin-left: var(--gutter); }
  .hero-photo img { border-radius: 160px 0 0 var(--radius); }
  .hero-note { left: auto; right: var(--gutter); bottom: -28px; padding: 14px 16px; max-width: 220px; }
  .hero-note strong { font-size: 19px; }
  .hero-text { padding-inline: var(--gutter); padding-top: 12px; }

  .welcome .wrap { grid-template-columns: 1fr; }
  .welcome-photo { aspect-ratio: 4 / 3; }
  .facts { grid-template-columns: 1fr; }
  .facts div, .facts div + div { padding: 16px 0; border-left: 0; border-bottom: 1px solid var(--rule); grid-template-columns: 120px 1fr; display: grid; align-items: baseline; }
  .facts dd { font-size: 20px; }

  .section-head, .page-head .wrap { grid-template-columns: 1fr; }
  .section-head .lede, .page-head .lede { justify-self: start; }

  .day-grid { grid-template-columns: 1fr; }
  .slot { display: grid; grid-template-columns: 38% minmax(0, 1fr); }
  .slot picture { aspect-ratio: auto; height: 100%; }
  .slot-body { padding: 18px 18px 20px; }
  .slot h3 { font-size: 27px; }
  .favs-grid { grid-template-columns: 1fr; }
  .favs-stage { display: none; }
  .fav { grid-template-columns: 84px minmax(0, 1fr) auto; column-gap: 16px; }
  .fav::before { display: none; }
  .fav-thumb { display: block; grid-row: 1 / span 3; width: 84px; height: 84px; border-radius: var(--radius); overflow: hidden; }
  .fav-thumb img { width: 100%; height: 100%; object-fit: cover; }
  .fav .cat { grid-column: 2 / -1; }
  .fav p { grid-column: 2 / -1; font-size: 14px; }

  .bar .wrap { grid-template-columns: 1fr; }
  .bar-photos { max-width: 520px; width: 100%; }

  .g-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 42vw; gap: 8px; }
  .gallery-ig { justify-self: start; }
  .lb-prev, .lb-next { top: auto; bottom: 16px; transform: none; }
  .lb-prev { left: calc(50% - 60px); }
  .lb-next { right: calc(50% - 60px); }
  .visit-grid { grid-template-columns: 1fr; }
  .map { aspect-ratio: 4 / 3; }

  .items { grid-template-columns: 1fr; }
  .msec-head { grid-template-columns: 1fr; }
  .msec-img { order: -1; width: 100%; aspect-ratio: 16 / 9; }
  .features { grid-template-columns: 1fr; }
  .drinks { grid-template-columns: 1fr; }
  .drinks img { aspect-ratio: 16 / 10; min-height: 0; }
  .mtabs { gap: 4px; padding: 8px 0; }
  .mtab { padding: 9px 4px; min-height: 48px; }
  .mtab span { font-size: 18px; }
  .mtab small { font-size: 11px; }
  .mtab small { font-size: 11px; line-height: 1.3; }
  .msec { scroll-margin-top: calc(var(--header-h) + 90px); }

  .v-hero img { aspect-ratio: 4 / 3; }
  .v-cols { grid-template-columns: 1fr; }
  .v-map .map { aspect-ratio: 4 / 3; }
}

@media (max-width: 600px) {
  .footer-top { grid-template-columns: 1fr 1fr; }
  .slot-time { letter-spacing: .1em; }
  .info { grid-template-columns: 78px minmax(0, 1fr); gap: 0 14px; }
}
@media (max-width: 400px) {
  .nav .btn { padding: 9px 13px; }
  .logo img, .panel-top img { width: 84px; }
}

/* storefront photo: frame the sign and the windows together */
.v-hero img, .visit-media figure img { object-position: 50% 50%; }
@media (min-width: 901px) { .v-hero img { aspect-ratio: 16 / 10; } }

.bar-list a { color: var(--on-night); text-decoration: underline; text-underline-offset: 3px; }

/* Private events band (home) */
.events { background: var(--red-deep); color: #fff; padding-block: var(--section); }
.events .wrap { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: 40px clamp(40px, 6vw, 96px); align-items: center; }
.events-photo { margin: 0; aspect-ratio: 4 / 3; border-radius: var(--radius); overflow: hidden; }
.events-photo picture, .events-photo img { width: 100%; height: 100%; }
.events-photo img { object-fit: cover; }
.events-text { display: grid; gap: 24px; }
.events .eyebrow { color: #FFE9C9; }
.events .lede { color: #FFDCD7; }
.events-contact { display: grid; gap: 14px; justify-items: start; padding-top: 24px; border-top: 1px solid rgba(255,255,255,.3); }
.events-contact p { font-family: var(--serif); font-size: clamp(22px, 2vw, 28px); line-height: 1.25; }
@media (max-width: 900px) {
  .events .wrap { grid-template-columns: 1fr; }
  .events-photo { aspect-ratio: 4 / 3; }
}

/* ==========================================================================
   Private events page (events.html) + Tripleseat form
   Ported from the coming soon site's css/site.css. The Tripleseat embed
   writes its own stylesheet into the body at parse time, so it lands AFTER
   this file in the cascade. Selectors below are deliberately over-specific
   and use !important on the properties Tripleseat hard-sets.
   ========================================================================== */
.ev-layout { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(36px, 5vw, 80px); align-items: start; padding-bottom: var(--section); }
.ev-info { position: sticky; top: calc(var(--header-h) + 24px); display: grid; gap: 22px; }
.ev-photo { margin: 0; aspect-ratio: 4 / 3; border-radius: var(--radius); overflow: hidden; }
.ev-photo picture, .ev-photo img { width: 100%; height: 100%; }
.ev-photo img { object-fit: cover; }
.ev-info-t { margin: 0 0 4px; font: 600 12px/1.2 var(--sans); letter-spacing: .16em; text-transform: uppercase; color: var(--red-text); }
.events-form .ev-info-t { margin-bottom: 18px; }
.ev-facts { margin: 0; display: grid; gap: 14px; padding-top: 18px; border-top: 1px solid var(--rule); }
.ev-facts div { display: grid; grid-template-columns: 96px 1fr; gap: 12px; align-items: baseline; }
.ev-facts dt { font: 600 11px/1.4 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--ink-faint); }
.ev-facts dd { margin: 0; font-size: 16px; color: var(--ink); }
.ev-facts a { color: var(--ink); text-decoration-color: var(--rule); text-underline-offset: 3px; }
.ev-facts a:hover, .ev-facts a:focus-visible { color: var(--red-text); text-decoration-color: currentColor; }
.events-form { min-width: 0; }

.ts-form {
  background: #fff;
  border-top: 4px solid var(--red);
  border-radius: var(--radius);
  padding: clamp(20px, 3vw, 36px);
  box-shadow: 0 18px 40px -24px rgba(42, 34, 29, .35);
  overflow-x: hidden;
}
/* Reset the third-party wrapper so it fills the card */
.ts-form #tripleseat_embed_form,
.ts-form #tripleseat_dynamic_embed_form,
.ts-form #dynamic_lead_form {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  font-family: var(--sans) !important;
  color: var(--ink) !important;
  box-sizing: border-box;
}
.ts-form #tripleseat_embed_form *,
.ts-form #tripleseat_embed_form *::before,
.ts-form #tripleseat_embed_form *::after { box-sizing: border-box; }
/* Section headings inside the form */
.ts-form #tripleseat_embed_form .tripleseat-dlf-heading,
.ts-form #tripleseat_embed_form h1,
.ts-form #tripleseat_embed_form h2,
.ts-form #tripleseat_embed_form h3 {
  font-family: var(--serif) !important;
  font-weight: 400 !important;
  letter-spacing: -.01em !important;
  text-transform: none !important;
  color: var(--ink) !important;
  font-size: 24px !important;
  line-height: 1.2 !important;
  margin: 28px 0 12px !important;
  padding-bottom: 10px !important;
  border-bottom: 1px solid var(--rule) !important;
}
/* Field groups */
.ts-form #tripleseat_embed_form .tripleseat-dlf-field-group {
  margin-bottom: 16px !important;
  width: 100% !important;
}
/* Labels */
.ts-form #tripleseat_embed_form .tripleseat-dlf-label,
.ts-form #tripleseat_embed_form label {
  display: block !important;
  font-family: var(--sans) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
  color: var(--ink-soft) !important;
  margin-bottom: 6px !important;
  float: none !important;
  width: auto !important;
}
/* Inputs, selects, textareas */
.ts-form #tripleseat_embed_form .tripleseat-dlf-input,
.ts-form #tripleseat_embed_form .tripleseat-dlf-dropdown,
.ts-form #tripleseat_embed_form .tripleseat-dlf-textarea,
.ts-form #tripleseat_embed_form input[type="text"],
.ts-form #tripleseat_embed_form input[type="email"],
.ts-form #tripleseat_embed_form input[type="tel"],
.ts-form #tripleseat_embed_form input[type="number"],
.ts-form #tripleseat_embed_form input[type="date"],
.ts-form #tripleseat_embed_form select,
.ts-form #tripleseat_embed_form textarea {
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  padding: 12px 14px !important;
  font-family: var(--sans) !important;
  font-size: 16px !important; /* 16px stops iOS Safari zooming on focus */
  line-height: 1.4 !important;
  color: var(--ink) !important;
  background: var(--linen) !important;
  border: 1px solid var(--rule) !important;
  border-radius: 4px !important;
  box-shadow: none !important;
  transition: border-color 140ms var(--ease), box-shadow 140ms var(--ease);
}
.ts-form #tripleseat_embed_form textarea { min-height: 120px !important; resize: vertical !important; }
.ts-form #tripleseat_embed_form .tripleseat-dlf-input:focus,
.ts-form #tripleseat_embed_form .tripleseat-dlf-dropdown:focus,
.ts-form #tripleseat_embed_form .tripleseat-dlf-textarea:focus,
.ts-form #tripleseat_embed_form input:focus,
.ts-form #tripleseat_embed_form select:focus,
.ts-form #tripleseat_embed_form textarea:focus {
  outline: none !important;
  background: #fff !important;
  border-color: var(--red) !important;
  box-shadow: 0 0 0 3px rgba(232, 30, 37, .16) !important;
}
/* Multi-column rows the embed uses for name / phone / address */
.ts-form #tripleseat_embed_form .tripleseat-dlf-name-fields,
.ts-form #tripleseat_embed_form .tripleseat-dlf-phone-container,
.ts-form #tripleseat_embed_form .tripleseat-dlf-address-fields {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  width: 100% !important;
}
.ts-form #tripleseat_embed_form .tripleseat-dlf-name-fields > *,
.ts-form #tripleseat_embed_form .tripleseat-dlf-phone-container > *,
.ts-form #tripleseat_embed_form .tripleseat-dlf-address-fields > * {
  flex: 1 1 180px !important;
  min-width: 0 !important;
  margin: 0 !important;
}
/* Submit button: Maxie's red, same shape as the site buttons */
.ts-form #tripleseat_embed_form .tripleseat-dlf-submit,
.ts-form #tripleseat_embed_form input[type="submit"],
.ts-form #tripleseat_embed_form button[type="submit"] {
  display: inline-block !important;
  width: auto !important;
  min-width: 220px !important;
  margin-top: 22px !important;
  padding: 15px 34px !important;
  font-family: var(--sans) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: .02em !important;
  text-transform: none !important;
  color: #fff !important;
  background: var(--red) !important;
  border: none !important;
  border-radius: 999px !important;
  cursor: pointer !important;
  transition: background 140ms var(--ease);
}
.ts-form #tripleseat_embed_form .tripleseat-dlf-submit:hover,
.ts-form #tripleseat_embed_form input[type="submit"]:hover,
.ts-form #tripleseat_embed_form button[type="submit"]:hover {
  background: var(--red-dark) !important;
}
/* Errors and helper text */
.ts-form #tripleseat_embed_form .tripleseat-dlf-error,
.ts-form #tripleseat_embed_form .errorExplanation {
  font-family: var(--sans) !important;
  font-size: 14px !important;
  color: var(--red-dark) !important;
  background: #FCE3E2 !important;
  border: 1px solid var(--red) !important;
  border-radius: 4px !important;
  padding: 10px 12px !important;
  margin: 8px 0 !important;
}
.ts-form #tripleseat_embed_form a { color: var(--red-text) !important; }
/* Keep reCAPTCHA from overflowing the card on small screens */
.ts-form .g-recaptcha,
.ts-form #tripleseat_embed_form .g-recaptcha {
  transform-origin: 0 0;
  max-width: 100%;
}
/* Fallback + attribution */
.ts-form__fallback,
.ts-form__attribution { margin: 16px 0 0; font-size: 14px; color: var(--ink-soft); }
.ts-form__fallback a { color: var(--red-text); }
.ts-form__attribution { margin-top: 10px; font-size: 10px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
.ts-form__attribution a { color: var(--ink-faint); text-decoration: none; }
.ts-form__attribution a:hover,
.ts-form__attribution a:focus-visible { color: var(--red-text); }

@media (max-width: 900px) {
  .ev-layout { grid-template-columns: 1fr; }
  .ev-info { position: static; }
}
@media (max-width: 480px) {
  .ts-form { padding: 18px 12px; }
  .ts-form #tripleseat_embed_form .tripleseat-dlf-submit,
  .ts-form #tripleseat_embed_form input[type="submit"],
  .ts-form #tripleseat_embed_form button[type="submit"] {
    width: 100% !important;
    min-width: 0 !important;
  }
  .ev-facts div { grid-template-columns: 1fr; gap: 2px; }
}

/* --- Tripleseat components the coming soon stylesheet did not cover ------ */
/* Spam-trap field: Tripleseat hides it; make sure the label rules above never reveal it */
/* Hide only the trap's own wrapper. Tripleseat puts the reCAPTCHA in the SAME field group,
   so never hide .tripleseat-dlf-field-group here or the "not a robot" box disappears. */
.ts-form #tripleseat_embed_form div:has(> input[name$="[website]"]),
.ts-form #tripleseat_embed_form div:has(> input[name="website"]),
.ts-form #tripleseat_embed_form label[for="website"] { display: none !important; }
/* Make sure the reCAPTCHA row always shows */
.ts-form #tripleseat_embed_form .tripleseat-dlf-field-group:has(.g-recaptcha),
.ts-form #tripleseat_embed_form .tripleseat-dlf-captcha-container { display: block !important; }
.ts-form #tripleseat_embed_form .g-recaptcha { min-height: 78px; }
/* reCAPTCHA is a fixed 304px box; shrink it on the narrowest phones so it isn't clipped */
@media (max-width: 359px) {
  .ts-form #tripleseat_embed_form .g-recaptcha { transform: scale(.84); transform-origin: 0 0; min-height: 66px; height: 66px; }
}
/* Time and select inputs */
.ts-form #tripleseat_embed_form input[type="time"] {
  width: 100% !important; padding: 12px 14px !important; font: 16px/1.4 var(--sans) !important;
  color: var(--ink) !important; background: var(--linen) !important; border: 1px solid var(--rule) !important; border-radius: 4px !important;
}
.ts-form #tripleseat_embed_form select,
.ts-form #tripleseat_embed_form .tripleseat-dlf-dropdown {
  appearance: none !important; -webkit-appearance: none !important; padding-right: 40px !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2362564D' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important; background-position: right 14px center !important; background-size: 16px !important;
}
/* Date and time pickers: input with an icon button on the right */
.ts-form #tripleseat_embed_form .tripleseat-dlf-date-wrapper,
.ts-form #tripleseat_embed_form .tripleseat-dlf-time-wrapper { position: relative !important; width: 100% !important; }
.ts-form #tripleseat_embed_form .tripleseat-dlf-date-wrapper input,
.ts-form #tripleseat_embed_form .tripleseat-dlf-time-wrapper input { padding-right: 44px !important; }
.ts-form #tripleseat_embed_form .tripleseat-dlf-date-picker-toggle,
.ts-form #tripleseat_embed_form .tripleseat-dlf-time-icon {
  position: absolute !important; right: 12px !important; top: 50% !important; transform: translateY(-50%) !important;
  margin: 0 !important; padding: 4px !important; background: none !important; border: 0 !important;
  color: var(--ink-soft) !important; cursor: pointer !important; line-height: 1 !important;
}
.ts-form #tripleseat_embed_form .tripleseat-dlf-date-picker-toggle:hover { color: var(--red-text) !important; }
/* Checkboxes (email opt-in) */
.ts-form #tripleseat_embed_form .tripleseat-dlf-checkbox-wrapper { display: flex !important; align-items: flex-start !important; gap: 10px !important; }
.ts-form #tripleseat_embed_form .tripleseat-dlf-checkbox,
.ts-form #tripleseat_embed_form input[type="checkbox"] {
  width: 18px !important; height: 18px !important; margin: 2px 0 0 !important; flex: 0 0 auto !important; accent-color: var(--red) !important;
}
.ts-form #tripleseat_embed_form .tripleseat-dlf-checkbox-label,
.ts-form #tripleseat_embed_form .tripleseat-dlf-checkbox-wrapper label {
  display: inline !important; margin: 0 !important; font-size: 15px !important; font-weight: 400 !important;
  letter-spacing: 0 !important; text-transform: none !important; color: var(--ink) !important; line-height: 1.45 !important;
}
/* Multi-event requests: each event in its own block, plus add/remove buttons */
.ts-form #tripleseat_embed_form .tripleseat-dlf-event-block {
  position: relative !important; margin: 0 0 18px !important; padding: 18px !important;
  background: var(--linen) !important; border: 1px solid var(--rule) !important; border-radius: var(--radius) !important;
}
.ts-form #tripleseat_embed_form .tripleseat-dlf-event-block input,
.ts-form #tripleseat_embed_form .tripleseat-dlf-event-block select,
.ts-form #tripleseat_embed_form .tripleseat-dlf-event-block textarea { background-color: #fff !important; }
.ts-form #tripleseat_embed_form [class*="tripleseat-dlf-multi-event"] button,
.ts-form #tripleseat_embed_form button[class*="tripleseat-dlf-multi-event"],
.ts-form #tripleseat_embed_form a[class*="tripleseat-dlf-multi-event"] {
  display: inline-flex !important; align-items: center !important; gap: 8px !important; padding: 10px 20px !important;
  font: 600 13px/1.2 var(--sans) !important; letter-spacing: .02em !important; text-transform: none !important;
  color: var(--ink) !important; background: transparent !important; border: 1px solid var(--ink) !important;
  border-radius: 999px !important; cursor: pointer !important; text-decoration: none !important;
}
.ts-form #tripleseat_embed_form [class*="tripleseat-dlf-multi-event"] button:hover,
.ts-form #tripleseat_embed_form button[class*="tripleseat-dlf-multi-event"]:hover,
.ts-form #tripleseat_embed_form a[class*="tripleseat-dlf-multi-event"]:hover { color: var(--linen) !important; background: var(--ink) !important; }
.ts-form #tripleseat_embed_form .tripleseat-dlf-remove-event-btn {
  position: absolute !important; top: 10px !important; right: 10px !important; padding: 4px 8px !important;
  font: 600 12px/1 var(--sans) !important; color: var(--ink-soft) !important; background: none !important;
  border: 0 !important; cursor: pointer !important;
}
.ts-form #tripleseat_embed_form .tripleseat-dlf-remove-event-btn:hover { color: var(--red-text) !important; }
/* Field-level errors */
.ts-form #tripleseat_embed_form .tripleseat-dlf-error-border,
.ts-form #tripleseat_embed_form .tripleseat-dlf-error-field { border-color: var(--red) !important; }
/* jQuery UI calendar (rendered at the end of <body>, outside .ts-form) */
#ui-datepicker-div {
  z-index: 1000 !important; padding: 12px !important; background: #fff !important; border: 1px solid var(--rule) !important;
  border-radius: var(--radius) !important; box-shadow: 0 18px 40px -20px rgba(42, 34, 29, .4) !important; font: 14px/1.3 var(--sans) !important;
}
#ui-datepicker-div .ui-datepicker-header { display: flex; align-items: center; justify-content: space-between; padding: 4px 4px 10px; border: 0; background: none; }
#ui-datepicker-div .ui-datepicker-title { order: 2; font: 400 18px/1.2 var(--serif); color: var(--ink); }
#ui-datepicker-div .ui-datepicker-prev { order: 1; } #ui-datepicker-div .ui-datepicker-next { order: 3; }
#ui-datepicker-div .ui-datepicker-prev, #ui-datepicker-div .ui-datepicker-next { cursor: pointer; color: var(--red-text); font-weight: 600; text-decoration: none; }
#ui-datepicker-div table { border-collapse: collapse; }
#ui-datepicker-div th { padding: 6px; font: 600 11px/1 var(--sans); letter-spacing: .08em; text-transform: uppercase; color: var(--ink-faint); }
#ui-datepicker-div td a { display: block; width: 34px; height: 34px; line-height: 34px; text-align: center; border-radius: 50%; color: var(--ink); text-decoration: none; }
#ui-datepicker-div td a:hover { background: var(--linen); }
#ui-datepicker-div .ui-state-highlight { box-shadow: inset 0 0 0 1px var(--red); }
#ui-datepicker-div .ui-state-active { background: var(--red); color: #fff; }
#ui-datepicker-div .ui-datepicker-unselectable span { display: block; width: 34px; text-align: center; color: var(--rule); }
.ts-form #tripleseat_embed_form .tripleseat-dlf-name-fields,
.ts-form #tripleseat_embed_form .tripleseat-dlf-phone-container,
.ts-form #tripleseat_embed_form .tripleseat-dlf-address-fields { margin-bottom: 16px !important; }

/* Home: the header logo stays hidden until the hero logo scrolls under the header */
.js .header[data-logo-reveal] .logo { opacity: 0; visibility: hidden; transform: translateY(-4px); transition: opacity 250ms var(--ease), transform 250ms var(--ease), visibility 0s 250ms; }
.js .header[data-logo-reveal].logo-on .logo { opacity: 1; visibility: visible; transform: none; transition: opacity 250ms var(--ease), transform 250ms var(--ease); }
@media (max-width: 900px) { .hero .display .hero-logo--solo { width: min(72vw, 320px); } }

/* Mobile (hamburger, <=900px): the header Reservations button lives in the menu panel instead */
@media (max-width: 900px) { .nav > .btn { display: none; } }

/* Social icons, same icons and formatting as maxieslv.com, Henderson colors */
:root { --icon-google: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20488%20512'%20fill='currentColor'%3E%3Cpath%20d='M488%20261.8C488%20403.3%20391.1%20504%20248%20504%20110.8%20504%200%20393.2%200%20256S110.8%208%20248%208c66.8%200%20123%2024.5%20166.3%2064.9l-67.5%2064.9C258.5%2052.6%2094.3%20116.6%2094.3%20256c0%2086.5%2069.1%20156.6%20153.7%20156.6%2098.2%200%20135-70.4%20140.8-106.9H248v-85.3h236.1c2.3%2012.7%203.9%2024.9%203.9%2041.4z'/%3E%3C/svg%3E"); --icon-instagram: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='96.1%2095.8%20448.3%20448.1'%20fill='currentColor'%3E%3Cpath%20d='M320.3%20205C256.8%20204.8%20205.2%20256.2%20205%20319.7C204.8%20383.2%20256.2%20434.8%20319.7%20435C383.2%20435.2%20434.8%20383.8%20435%20320.3C435.2%20256.8%20383.8%20205.2%20320.3%20205zM319.7%20245.4C360.9%20245.2%20394.4%20278.5%20394.6%20319.7C394.8%20360.9%20361.5%20394.4%20320.3%20394.6C279.1%20394.8%20245.6%20361.5%20245.4%20320.3C245.2%20279.1%20278.5%20245.6%20319.7%20245.4zM413.1%20200.3C413.1%20185.5%20425.1%20173.5%20439.9%20173.5C454.7%20173.5%20466.7%20185.5%20466.7%20200.3C466.7%20215.1%20454.7%20227.1%20439.9%20227.1C425.1%20227.1%20413.1%20215.1%20413.1%20200.3zM542.8%20227.5C541.1%20191.6%20532.9%20159.8%20506.6%20133.6C480.4%20107.4%20448.6%2099.2%20412.7%2097.4C375.7%2095.3%20264.8%2095.3%20227.8%2097.4C192%2099.1%20160.2%20107.3%20133.9%20133.5C107.6%20159.7%2099.5%20191.5%2097.7%20227.4C95.6%20264.4%2095.6%20375.3%2097.7%20412.3C99.4%20448.2%20107.6%20480%20133.9%20506.2C160.2%20532.4%20191.9%20540.6%20227.8%20542.4C264.8%20544.5%20375.7%20544.5%20412.7%20542.4C448.6%20540.7%20480.4%20532.5%20506.6%20506.2C532.8%20480%20541%20448.2%20542.8%20412.3C544.9%20375.3%20544.9%20264.5%20542.8%20227.5zM495%20452C487.2%20471.6%20472.1%20486.7%20452.4%20494.6C422.9%20506.3%20352.9%20503.6%20320.3%20503.6C287.7%20503.6%20217.6%20506.2%20188.2%20494.6C168.6%20486.8%20153.5%20471.7%20145.6%20452C133.9%20422.5%20136.6%20352.5%20136.6%20319.9C136.6%20287.3%20134%20217.2%20145.6%20187.8C153.4%20168.2%20168.5%20153.1%20188.2%20145.2C217.7%20133.5%20287.7%20136.2%20320.3%20136.2C352.9%20136.2%20423%20133.6%20452.4%20145.2C472%20153%20487.1%20168.1%20495%20187.8C506.7%20217.3%20504%20287.3%20504%20319.9C504%20352.5%20506.7%20422.6%20495%20452z'/%3E%3C/svg%3E"); --icon-facebook: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='64%2064%20512%20510.1'%20fill='currentColor'%3E%3Cpath%20d='M576%20320C576%20178.6%20461.4%2064%20320%2064C178.6%2064%2064%20178.6%2064%20320C64%20440%20146.7%20540.8%20258.2%20568.5L258.2%20398.2L205.4%20398.2L205.4%20320L258.2%20320L258.2%20286.3C258.2%20199.2%20297.6%20158.8%20383.2%20158.8C399.4%20158.8%20427.4%20162%20438.9%20165.2L438.9%20236C432.9%20235.4%20422.4%20235%20409.3%20235C367.3%20235%20351.1%20250.9%20351.1%20292.2L351.1%20320L434.7%20320L420.3%20398.2L351%20398.2L351%20574.1C477.8%20558.8%20576%20450.9%20576%20320z'/%3E%3C/svg%3E"); }
.icon { display: inline-block; flex: 0 0 auto; width: 20px; height: 20px; background-color: currentColor; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-position: center; mask-position: center; -webkit-mask-size: contain; mask-size: contain; }
.icon-instagram { -webkit-mask-image: var(--icon-instagram); mask-image: var(--icon-instagram); }
.icon-facebook { -webkit-mask-image: var(--icon-facebook); mask-image: var(--icon-facebook); }
.icon-google { -webkit-mask-image: var(--icon-google); mask-image: var(--icon-google); transform: scale(.88); }
.social-links { display: flex; align-items: center; gap: 4px; margin: 8px 0 0 -7px; }
.social-link { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 999px; color: var(--red); opacity: .78; transition: opacity .15s ease, color .15s ease; }
.social-link:hover, .social-link:focus-visible { opacity: 1; text-decoration: none; }
.footer .social-links { margin-top: 0; }
.footer .social-link, .bar .social-link { color: var(--on-night); opacity: .82; }
.footer .social-link:hover, .footer .social-link:focus-visible, .bar .social-link:hover, .bar .social-link:focus-visible { opacity: 1; }
.gallery-ig.social-links { margin: 0 -7px 0 0; }
.contact-social { gap: 20px; margin-left: 0; }
.contact-social .icon { width: 32px; height: 32px; }

/* Menu panels: no title line above the first section */
.mpanel > .msec:first-child, .mpanel > .sr-only:first-child + .msec { padding-top: 0; }
/* Hours lists: label on its own line, hours below */
.hours-list { display: grid; gap: 14px; list-style: none; margin: 0; padding: 0; }
.hours-list li { display: grid; gap: 2px; }
.hours-list br { display: none; }
.hours-list strong { font-weight: 600; color: var(--ink); }
.footer .hours-list strong { color: var(--on-night); }
.hours-list--lede { justify-self: end; font-size: 17px; line-height: 1.5; color: var(--ink-soft); min-width: 0; }
@media (max-width: 900px) { .hours-list--lede { justify-self: start; } }

/* Mobile (hamburger, 900px and below): footer columns stacked full width */
@media (max-width: 900px) {
  .footer-top { grid-template-columns: 1fr; gap: 32px; }
  .footer-brand { grid-column: auto; }
}
.nowrap { white-space: nowrap; }

/* Home "Brunch, Dinner and Drinks" hours: inline on desktop, stacked like the footer on mobile */
@media (max-width: 900px) {
  .day-hours { display: grid; gap: 14px; line-height: 1.5; }
  .day-hours br, .day-hours .dh-colon { display: none; }
  .day-hours .dh { display: grid; gap: 2px; }
  .day-hours .dh strong { font-weight: 600; color: var(--ink); }
  .day-hours .dh-t { display: block; }
  .day-hours .dh-cap::first-letter { text-transform: uppercase; }
}

/* Hero: tagline and button centered under the logo */
.hero-text { justify-self: start; justify-items: center; text-align: center; }
.hero-text .display { justify-self: stretch; }
.hero .display .hero-logo--solo { margin-inline: auto; }
@media (max-width: 900px) { .hero-text { justify-self: stretch; } }

/* Mobile (hamburger, 900px and below): eyebrow labels at a readable size */
@media (max-width: 900px) { .eyebrow { font-size: 14px; } }


/* Hero: buttons stacked, same width (View the Menu, Reservations, Order Online when live) */
.hero .btns.hero-btns { flex-direction: column; align-items: stretch; width: min(100%, 300px); }
