@font-face{font-family:"Big Shoulders Display";font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/big-shoulders-display/big-shoulders-display-698f9960.woff2) format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:"Big Shoulders Display";font-style:normal;font-weight:800;font-display:swap;src:url(/assets/fonts/big-shoulders-display/big-shoulders-display-698f9960.woff2) format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:"Big Shoulders Display";font-style:normal;font-weight:900;font-display:swap;src:url(/assets/fonts/big-shoulders-display/big-shoulders-display-698f9960.woff2) format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}

@font-face{font-family:"Archivo";font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/archivo/archivo-8f704806.woff2) format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:"Archivo";font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/archivo/archivo-8f704806.woff2) format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:"Archivo";font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/archivo/archivo-8f704806.woff2) format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:"Archivo";font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/archivo/archivo-8f704806.woff2) format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:"Archivo";font-style:normal;font-weight:800;font-display:swap;src:url(/assets/fonts/archivo/archivo-8f704806.woff2) format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}

/* Structure shared by every Local site. Themes set tokens (tokens.css) and add their
   signature styling (theme.css). Palette tokens (--brand, --page-bg ...) are generated per
   site from its brand color. The CSP forbids inline styles, so all styling lives here. */
:root {
  --page-bg: #ffffff; --ink: #1b1b1b; --muted: #5d5d5d; --line: #e4e2df; --surface: #ffffff; --band: #f4f3f1;
  /* Form field borders: 3:1 or better against --surface and --page-bg (WCAG 1.4.11). --line is a
     decorative hairline and is far too faint to be the only edge of a field. */
  --field-line: #858580;
  --dark: #111111; --on-dark: #ffffff;
  --font-display: system-ui, sans-serif; --font-body: system-ui, sans-serif; --font-script: cursive; --font-mark: var(--font-display);
  --radius: 0px; --radius-btn: 0px; --radius-img: 0px;
  --wrap: 1180px; --gutter: clamp(16px, 4vw, 48px); --space: clamp(56px, 8vw, 104px);
  --h1: clamp(2.5rem, 6.2vw, 4.75rem); --h2: clamp(1.75rem, 3.4vw, 2.6rem); --h3: 1.25rem; --body: 1.0625rem;
  --display-case: none; --display-weight: 700; --display-leading: 1.04; --display-tracking: -0.01em;
  --brand: #333333; --on-brand: #ffffff; --brand-ink: #333333; --brand-hi: #cccccc; --tint: #f4f4f4; --accent: #ffd23f; --on-accent: #111111;
}
/* base.njk sets .is-dark on <html> for any theme with dark: true (only neon today). The
   brand-derived tokens above (--brand, --brand-ink, --brand-hi ...) already account for light vs
   dark per theme in palette.mjs, but --ink/--muted/--line/--surface/--band had no dark-mode
   value and stayed at their light-theme defaults, so dark-theme text rendered near-invisible on
   --page-bg (axe color-contrast, serious). --surface and --band are set to var(--page-bg) rather
   than a lighter "elevated" tone: brandInk and brandHi in palette.mjs are only proven >=4.6
   against pageBg, not against a lighter surface, so a badge like .truck-today__label (brand-ink
   text on a --surface fill) stayed under 4.5 with any lighter value tried. Referencing the
   variable (not a hardcoded hex) keeps this correct for any future dark theme too, whatever
   literal color its own manifest.background resolves to.
   :where(.is-dark) (not html.is-dark) keeps this block's specificity tied with the plain :root
   above (0,1,0) instead of outranking it, so it only wins here by coming after :root in source
   order: base defaults, then this dark fallback. A theme's own tokens.css is concatenated after
   base.css, so at that same specificity it still outranks this fallback and can restore its own
   --surface/--band (Neon does, so its cta-band and other --surface fills sit apart from the page
   again instead of flattening to it). */
:root:where(.is-dark) {
  --ink: #f2f2f2; --muted: #b7b7c2; --line: #3a3a44; --surface: var(--page-bg); --band: var(--page-bg);
  --field-line: #7a7a88;
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-padding-top: 90px; }
body { margin: 0; padding-bottom: 58px; background: var(--page-bg); color: var(--ink); font-family: var(--font-body); font-size: var(--body); line-height: 1.6; -webkit-font-smoothing: antialiased; }
body.market-agency { padding-bottom: 0; }
img, picture, svg { display: block; max-width: 100%; }
img { height: auto; }
picture img { width: 100%; }
a { color: inherit; text-underline-offset: 3px; }
h1, h2, h3, h4 { margin: 0; font-family: var(--font-display); font-weight: var(--display-weight); line-height: var(--display-leading); letter-spacing: var(--display-tracking); text-transform: var(--display-case); text-wrap: balance; }
h3 { font-size: var(--h3); }
p { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }
figure { margin: 0; }
/* WCAG technique C40: a two-colour indicator (white ring + dark ring) so at least one ring
   always has 3:1 contrast against whatever background sits behind the focused element, brand
   colour included. See also .lang-toggle a:focus-visible below for the inset variant its
   overflow: hidden container needs.
   !important: several themes put a decorative box-shadow or outline on .btn and its variants
   (a brand glow, an offset "sticker" shadow); without !important those non-important theme
   rules would win by specificity or source order and the ring would never show on focus. The
   decorative shadow returns as soon as focus leaves, since :focus-visible stops matching. */
:focus-visible { outline: 2px solid #ffffff !important; outline-offset: 0 !important; box-shadow: 0 0 0 4px #111111 !important; }
main:focus { outline: none; }
.sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.skip { position: absolute; left: 12px; top: -80px; z-index: 200; padding: 10px 16px; background: var(--ink); color: var(--page-bg); text-decoration: none; font-weight: 700; }
.skip:focus { top: 12px; }
.wrap { width: 100%; max-width: var(--wrap); margin: 0 auto; padding: 0 var(--gutter); }
.section { padding: var(--space) 0; }
.section-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 18px; margin-bottom: 30px; }
.section-head h2 { font-size: var(--h2); }
.section-script { font-family: var(--font-script); color: var(--brand-ink); font-size: 2rem; }
.section-more { margin-top: 28px; }
.link-more { font-weight: 700; }

/* Buttons */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 12px 22px; border: 2px solid currentColor; border-radius: var(--radius-btn); background: transparent; color: var(--ink); font: 700 1rem/1.15 var(--font-body); text-align: center; text-decoration: none; cursor: pointer; }
.btn--primary { background: var(--brand); border-color: var(--brand); color: var(--on-brand); }
.btn:disabled { cursor: progress; }

/* Top bars */
.sample-banner { background: var(--dark); color: var(--on-dark); font-size: .875rem; text-align: center; padding: 8px var(--gutter); }
.sample-banner a { font-weight: 700; }
.announce { background: var(--accent); color: var(--on-accent); font-weight: 700; padding: 10px 0; text-align: center; }
/* The ticker (WCAG 2.2.2). Static by default: one centered list that wraps, so a page without
   JavaScript, or with reduced motion, shows every item and never moves. Where scripting is on
   and motion is allowed it is laid out as one looping line from the first paint, so nothing
   shifts when site.js arrives, but it only starts moving under html.js, which site.js sets before
   it adds the pause button. Hover and keyboard focus inside it pause it too. */
.ticker { position: relative; overflow: hidden; background: var(--brand); color: var(--on-brand); font-weight: 800; font-size: .875rem; letter-spacing: .12em; text-transform: uppercase; }
.ticker__track { display: flex; justify-content: center; }
.ticker__list { display: flex; flex-wrap: wrap; justify-content: center; padding: 0 var(--gutter); }
.ticker__list[aria-hidden="true"], .ticker__toggle { display: none; }
.ticker__list li { padding: 12px 0; }
@media (scripting: enabled) and (prefers-reduced-motion: no-preference) {
  .ticker__track { justify-content: flex-start; width: max-content; }
  .ticker__list { flex-wrap: nowrap; padding: 0; }
  .ticker__list[aria-hidden="true"] { display: flex; }
  .ticker__list li { white-space: nowrap; }
  .js .ticker__track { animation: ticker 36s linear infinite; }
  .js .ticker__toggle { display: flex; }
  .ticker:hover .ticker__track, .ticker:focus-within .ticker__track, .ticker.is-paused .ticker__track { animation-play-state: paused; }
}
.ticker__list li::after { content: "\2605"; padding: 0 22px; }
@keyframes ticker { to { transform: translateX(-50%); } }
/* The pause/play button site.js adds: a 44px square at the right end with a drawn icon (two bars,
   or a triangle while paused). The ticker clips anything outside it, so the focus ring is drawn
   inside the button, like .lang-toggle's. */
.ticker__toggle { position: absolute; top: 0; right: 0; bottom: 0; z-index: 1; align-items: center; justify-content: center; width: 44px; min-height: 44px; padding: 0; border: 0; background: var(--brand); color: var(--on-brand); cursor: pointer; }
.ticker__toggle::before { content: ""; width: 12px; height: 14px; border-left: 4px solid currentColor; border-right: 4px solid currentColor; }
.ticker.is-paused .ticker__toggle::before { width: 0; height: 0; border-top: 8px solid transparent; border-bottom: 8px solid transparent; border-left: 13px solid currentColor; border-right: 0; }
.ticker__toggle:focus-visible { outline: 2px solid #ffffff !important; outline-offset: -4px !important; box-shadow: inset 0 0 0 2px #111111 !important; }

/* Navigation */
.nav { position: relative; z-index: 20; background: var(--page-bg); border-bottom: 1px solid var(--line); }
.nav__inner { display: flex; flex-wrap: wrap; align-items: center; gap: 18px; min-height: 76px; padding-top: 10px; padding-bottom: 10px; }
.nav__brand { margin-right: auto; text-decoration: none; }
.nav__logo { max-height: 56px; width: auto; }
.wordmark { display: inline-flex; flex-direction: column; line-height: 1; font-family: var(--font-mark); }
.wordmark__a { font-size: 1.6rem; font-weight: 800; }
.wordmark__b { margin-top: 4px; font-family: var(--font-body); font-size: .75rem; font-weight: 700; letter-spacing: .24em; text-transform: uppercase; }
.nav__links { display: none; gap: 26px; font-weight: 600; }
.nav__links a, .nav__menu a { text-decoration: none; }
.nav__links a[aria-current="page"], .nav__menu a[aria-current="page"] { text-decoration: underline; text-decoration-thickness: 2px; }
.nav__actions { display: flex; align-items: center; gap: 14px; }
.nav__cta { min-height: 44px; padding: 10px 18px; }
.nav__menu { order: 3; width: 100%; }
.nav__menu summary { cursor: pointer; padding: 8px 0; font-weight: 700; list-style: none; }
.nav__menu summary::-webkit-details-marker { display: none; }
.nav__menu summary::after { content: " +"; }
.nav__menu[open] summary::after { content: " \2212"; }
.nav__menu nav { display: grid; gap: 4px; padding: 6px 0 12px; }
.nav__menu nav a { padding: 8px 0; font-weight: 600; }
.lang-toggle { display: inline-flex; overflow: hidden; border: 2px solid currentColor; border-radius: var(--radius-btn); font-size: .8125rem; font-weight: 800; letter-spacing: .06em; }
.lang-toggle a { min-width: 40px; padding: 8px 10px; text-align: center; text-decoration: none; }
.lang-toggle a[aria-current="true"] { background: var(--ink); color: var(--page-bg); }
/* .lang-toggle clips with overflow: hidden, which would cut off the shared :focus-visible ring
   since it draws outside the link's box. Draw both rings inward instead so they stay inside the
   container. !important for the same reason as the shared rule above: no theme currently puts a
   decorative shadow on .lang-toggle a, but this keeps the ring guaranteed on top regardless. */
.lang-toggle a:focus-visible { outline: 2px solid #ffffff !important; outline-offset: -4px !important; box-shadow: inset 0 0 0 2px #111111 !important; }
@media (min-width: 960px) {
  .nav__links { display: flex; }
  .nav__menu { display: none; }
}

/* Hero */
.hero { padding: clamp(32px, 6vw, 72px) 0; }
.hero__inner { display: grid; gap: 36px; align-items: center; }
.hero__kicker { margin-bottom: 18px; color: var(--brand-ink); font-size: .8125rem; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; }
.hero__title { font-size: var(--h1); }
.hero__script { margin-top: 8px; color: var(--brand-ink); font-family: var(--font-script); font-size: clamp(1.8rem, 4vw, 3rem); }
.hero__lede { max-width: 32em; margin-top: 20px; color: var(--muted); font-size: 1.1875rem; line-height: 1.55; }
.hero__actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 30px; }
.hero__media { position: relative; isolation: isolate; }
.hero__media img { aspect-ratio: 4 / 5; object-fit: cover; border-radius: var(--radius-img); }
.hero__tag { position: absolute; left: -12px; bottom: 28px; z-index: 2; padding: 10px 16px; background: var(--accent); color: var(--on-accent); font-weight: 900; }
.hero__porthole { position: absolute; left: -18px; bottom: 26px; z-index: 2; width: 120px; height: 120px; overflow: hidden; border-radius: 50%; }
.hero__porthole img { width: 100%; height: 100%; aspect-ratio: 1; object-fit: cover; }
.sunburst { position: absolute; inset: 0; z-index: -1; width: 100%; height: 100%; color: var(--brand-ink); opacity: .2; pointer-events: none; }
.hero--text .hero__inner { grid-template-columns: 1fr; }
.hero--text .hero__lede { max-width: 40em; }
@media (min-width: 900px) {
  .hero__inner { grid-template-columns: 1.05fr .95fr; gap: 56px; }
  .hero--text .hero__inner { grid-template-columns: 1fr; }
}
.open-badge, .truck-today { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin: 0 0 22px; padding: 9px 16px; border: 1px solid var(--line); border-radius: 999px; background: var(--surface); color: var(--ink); font-size: .9375rem; font-weight: 700; }
.open-badge__dot { flex: none; width: 10px; height: 10px; border-radius: 50%; background: #8a8a8a; }
.open-badge.is-open .open-badge__dot { background: #1f9d55; }
.truck-today__label { color: var(--brand-ink); }

/* Stat bar */
.statbar { background: var(--dark); color: var(--on-dark); }
.statbar__inner { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
.statbar__item { padding: 22px 0; }
.statbar__item b { display: block; font-family: var(--font-display); font-size: 1.6rem; line-height: 1.1; }
.statbar__item span { font-size: .8125rem; letter-spacing: .12em; text-transform: uppercase; }

/* Page head */
.page-head { padding: clamp(40px, 7vw, 88px) 0 clamp(16px, 3vw, 32px); }
.page-head h1 { font-size: var(--h1); }
.page-head p { max-width: 38em; margin-top: 16px; color: var(--muted); font-size: 1.125rem; }

/* Price list (beauty) */
.prices__list { display: grid; gap: 0 56px; }
.prices__item { display: grid; grid-template-columns: 1fr auto; align-items: baseline; gap: 4px 12px; padding: 18px 0; border-bottom: 1px solid var(--line); }
.prices__name { display: flex; flex-wrap: wrap; align-items: baseline; gap: 10px; }
.prices__name h2, .prices__name h3 { font-size: 1.125rem; }
.prices__meta { color: var(--muted); font-size: .875rem; }
.prices__dots { display: none; }
.prices__price { font-weight: 800; font-variant-numeric: tabular-nums; white-space: nowrap; }
.prices__price small { font-size: .8125rem; font-weight: 600; }
.prices__desc { grid-column: 1 / -1; color: var(--muted); font-size: .9375rem; }
.prices__book { grid-column: 1 / -1; justify-self: start; font-size: .9375rem; font-weight: 700; }
@media (min-width: 900px) { .prices__list { grid-template-columns: 1fr 1fr; } }

/* Gallery */
.gallery__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.gallery__item img { aspect-ratio: 1; object-fit: cover; border-radius: var(--radius-img); }
@media (min-width: 900px) { .gallery__grid { grid-template-columns: repeat(3, 1fr); gap: 16px; } }

/* About */
.about__inner { display: grid; gap: 36px; align-items: center; }
.about__media img { aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--radius-img); }
.about__copy h2 { margin-bottom: 18px; font-size: var(--h2); }
.about__copy p + p { margin-top: 14px; }
@media (min-width: 900px) { .about__inner { grid-template-columns: .9fr 1.1fr; gap: 56px; } }

/* Visit */
.visit__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 28px; }
.visit__grid h2, .visit__grid h3 { margin-bottom: 10px; font-size: 1.125rem; }
.visit p + p { margin-top: 8px; }
.hours { width: 100%; max-width: 360px; border-collapse: collapse; }
.hours th, .hours td { padding: 6px 0; border-bottom: 1px solid var(--line); text-align: left; font-weight: 500; }
.hours th { padding-right: 18px; font-weight: 700; }

/* FAQ */
.faq__list { display: grid; gap: 10px; max-width: 820px; }
.faq__item { border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
.faq__item summary { cursor: pointer; padding: 18px 20px; font-weight: 700; }
.faq__item p { padding: 0 20px 18px; color: var(--muted); }

/* CTA band */
.cta-band { padding: clamp(40px, 6vw, 72px) 0; background: var(--band); }
.cta-band__inner { display: grid; gap: 24px; align-items: center; }
.cta-band h2 { font-size: var(--h2); }
.cta-band p { max-width: 34em; margin-top: 10px; color: var(--muted); }
.cta-band__actions { display: flex; flex-wrap: wrap; gap: 14px; }
@media (min-width: 900px) { .cta-band__inner { grid-template-columns: 1fr auto; } }

/* Thanks and 404 */
.thanks__text { max-width: 36em; font-size: 1.125rem; }
.notfound__links { display: grid; gap: 8px; margin-top: 18px; font-weight: 700; }

/* Footer */
.footer { margin-top: var(--space); padding: 48px 0 96px; background: var(--dark); color: var(--on-dark); }
.footer__inner { display: grid; gap: 22px; }
.footer__name { margin-bottom: 6px; font-family: var(--font-display); font-size: 1.4rem; }
.footer p + p { margin-top: 4px; }
.footer__social { display: flex; flex-wrap: wrap; gap: 18px; font-weight: 700; }
.footer__credit { font-size: .875rem; }
@media (min-width: 768px) { .footer { padding-bottom: 48px; } }

/* WhatsApp button and the phone thumb bar */
.wa-float { position: fixed; right: 24px; bottom: 24px; z-index: 30; display: none; align-items: center; justify-content: center; width: 60px; height: 60px; border-radius: 50%; background: #128c7e; color: #ffffff; box-shadow: 0 10px 24px rgba(0, 0, 0, .25); }
.wa-float svg { width: 32px; height: 32px; }
.thumbbar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 30; display: grid; grid-auto-columns: 1fr; grid-auto-flow: column; background: var(--dark); border-top: 1px solid #333333; }
.thumbbar__item { display: flex; align-items: center; justify-content: center; min-height: 58px; padding: 8px 6px calc(8px + env(safe-area-inset-bottom)); color: var(--on-dark); font-size: .8125rem; font-weight: 800; letter-spacing: .06em; text-align: center; text-decoration: none; text-transform: uppercase; }
.thumbbar__item.is-primary { background: var(--brand); color: var(--on-brand); }
@media (min-width: 768px) {
  body { padding-bottom: 0; }
  .wa-float { display: flex; }
  .thumbbar { display: none; }
}

/* Sample sheet */
.sample-sheet { width: calc(100% - 32px); max-width: 440px; padding: 28px; border: 0; border-radius: 14px; background: var(--surface); color: var(--ink); }
.sample-sheet::backdrop { background: rgba(0, 0, 0, .55); }
.sample-sheet h2 { margin-bottom: 10px; font-size: 1.5rem; }
.sample-sheet__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 20px; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}

/* Menu (trucks) */
.menu__section + .menu__section { margin-top: 40px; }
.menu__section > h2, .menu__section > h3 { margin-bottom: 12px; font-size: 1.5rem; }
.menu__list { display: grid; gap: 0 48px; }
.menu__item { display: flex; justify-content: space-between; gap: 16px; padding: 16px 0; border-bottom: 1px solid var(--line); }
.menu__item h3, .menu__item h4 { font-size: 1.125rem; }
.menu__item p { margin-top: 4px; color: var(--muted); font-size: .9375rem; }
.menu__price { font-weight: 800; font-variant-numeric: tabular-nums; white-space: nowrap; }
@media (min-width: 900px) { .menu__list { grid-template-columns: 1fr 1fr; } }

/* Schedule (trucks) */
.schedule__list { display: grid; gap: 10px; }
.schedule__item { display: grid; grid-template-columns: 120px 1fr; gap: 4px 16px; padding: 16px 18px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
.schedule__day { font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.schedule__place { font-weight: 700; }
.schedule__time { grid-column: 2; color: var(--muted); }
.schedule__map { grid-column: 2; font-size: .9375rem; font-weight: 700; }
.schedule__item.is-today { border-color: var(--brand); box-shadow: inset 4px 0 0 var(--brand); }
.schedule__events { margin-top: 22px; font-weight: 600; }

/* Lead forms */
.lead-form { display: grid; gap: 18px; max-width: 640px; }
.field { display: grid; gap: 6px; }
.field label { font-weight: 700; }
.field input, .field select, .field textarea { width: 100%; min-height: 48px; padding: 10px 12px; border: 2px solid var(--field-line); border-radius: var(--radius); background: var(--surface); color: var(--ink); font: inherit; }
.field input[type="file"] { padding: 10px; }
.field textarea { min-height: 120px; }
.field input:focus, .field select:focus, .field textarea:focus { border-color: var(--ink); }
.field-hint { color: var(--muted); font-size: .875rem; }
.hp { position: absolute !important; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.lead-form__status { min-height: 1.5em; font-weight: 700; }
.lead-form__fallback { color: var(--muted); font-size: .9375rem; }

/* Services grid (services market) */
.svc__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 18px; }
.svc__card { display: flex; flex-direction: column; gap: 8px; padding: 24px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
.svc__card h2, .svc__card h3 { font-size: 1.25rem; }
.svc__card p { color: var(--muted); }
.svc__price { font-weight: 800; }
.svc__link { margin-top: auto; font-weight: 700; }

/* Blog */
.posts { display: grid; gap: 28px; max-width: 820px; }
.posts__item h2 { font-size: 1.5rem; }
.posts__item p { margin-top: 8px; color: var(--muted); }
.post header h1 { font-size: var(--h1); }
.post__meta { margin-top: 12px; color: var(--muted); font-size: .9375rem; }
.post__body { max-width: 720px; margin-top: 32px; }
.post__body > * + * { margin-top: 1em; }
.post__body h2 { margin-top: 1.6em; font-size: 1.75rem; }
.post__body ul, .post__body ol { padding-left: 1.3em; list-style: revert; }

/* Agency holding page */
.samples__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 18px; }
.samples__card { display: flex; flex-direction: column; gap: 8px; height: 100%; padding: 24px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); text-decoration: none; }
.samples__card b { font-size: 1.25rem; }
.samples__label { color: var(--brand-ink); font-weight: 700; }
.included__list { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 10px 32px; }
.included__list li { position: relative; padding-left: 26px; }
.included__list li::before { content: "\2713"; position: absolute; left: 0; color: var(--brand-ink); font-weight: 900; }
.steps__list { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 18px; counter-reset: step; }
.steps__list li { padding: 24px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); counter-increment: step; }
.steps__list li::before { content: counter(step); display: block; margin-bottom: 10px; color: var(--brand-ink); font-family: var(--font-display); font-size: 2rem; line-height: 1; }
.steps__list h3 { margin-bottom: 6px; }

:root {
  --ink: #111111; --muted: #4a4a4a; --line: #d9d9d4; --surface: #ffffff; --band: #f2f2f0; --dark: #111111; --on-dark: #ffffff;
  --field-line: #858580;
  --font-display: "Big Shoulders Display", Impact, "Arial Narrow", sans-serif;
  --font-body: Archivo, system-ui, sans-serif;
  --font-mark: "Big Shoulders Display", Impact, sans-serif;
  --display-case: uppercase; --display-weight: 900; --display-leading: .9; --display-tracking: .005em;
  --h1: clamp(3.2rem, 8.4vw, 7.4rem); --h2: clamp(2.2rem, 4.6vw, 3.6rem); --h3: 1.6rem;
}

:root{--page-bg:#ffffff;--brand:#0f1d33;--on-brand:#ffffff;--brand-ink:#0f1d33;--brand-hi:#6d7f9a;--tint:#edf4ff;--accent:#ffd23f;--on-accent:#111111}
/* Bold: loud and confident. The brand color as a full-height panel, condensed type, dark bars. */
.nav { border-bottom: 0; background: var(--dark); color: var(--on-dark); }
.wordmark__a { font-size: 2.2rem; font-weight: 900; letter-spacing: .04em; text-transform: uppercase; }
.wordmark__b { color: #c4c4c4; letter-spacing: .32em; }
.nav__links { font-size: .875rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.nav .lang-toggle a[aria-current="true"] { background: var(--on-dark); color: var(--dark); }
.btn { font-size: .875rem; letter-spacing: .1em; text-transform: uppercase; }
.hero { padding: 0; }
.hero__inner { max-width: none; gap: 0; padding: 0; }
.hero__copy { display: flex; flex-direction: column; justify-content: flex-end; padding: clamp(36px, 6vw, 64px) var(--gutter); background: var(--brand); color: var(--on-brand); }
.hero__kicker, .hero__lede, .hero__script { color: var(--on-brand); }
.hero .btn--primary { border-color: #ffffff; background: #ffffff; color: #111111; }
.hero .btn--ghost { border-color: #ffffff; color: #ffffff; }
.hero .open-badge, .hero .truck-today { border-color: #ffffff; background: transparent; color: var(--on-brand); }
.hero .truck-today__label { color: var(--on-brand); }
.hero__media img { height: 100%; min-height: 360px; aspect-ratio: auto; }
.hero--text .hero__copy { padding-top: clamp(56px, 9vw, 120px); padding-bottom: clamp(56px, 9vw, 120px); }
@media (min-width: 900px) {
  .hero__inner { grid-template-columns: 1fr 1fr; min-height: 640px; align-items: stretch; }
  .hero--text .hero__inner { grid-template-columns: 1fr; min-height: 0; align-items: center; }
  .hero__copy { padding: 64px 56px; }
  .hero__media, .hero__media picture { height: 100%; }
  .hero__media img { min-height: 640px; }
}
.statbar__inner { max-width: none; padding: 0; }
.statbar__item { padding: 26px var(--gutter); border-right: 1px solid #333333; }
.statbar__item:last-child { border-right: 0; }
.statbar__item b { font-size: 2.4rem; font-weight: 800; text-transform: uppercase; }
.page-head { margin-bottom: 20px; background: var(--band); }
.prices__item, .menu__item { border-top: 3px solid var(--ink); border-bottom: 0; }
.prices__name h2, .prices__name h3, .menu__item h3, .menu__item h4 { font-family: var(--font-display); font-size: 1.9rem; font-weight: 800; text-transform: uppercase; }
.prices__price, .menu__price { color: var(--brand-ink); font-family: var(--font-display); font-size: 1.9rem; }
.svc__card { padding: 18px 0 0; border: 0; border-top: 6px solid var(--brand); background: transparent; }
.svc__card h2, .svc__card h3 { font-size: 1.9rem; font-weight: 800; }
.schedule__item { padding: 16px 0; border: 0; border-top: 3px solid var(--ink); background: transparent; }
.schedule__item.is-today { padding: 16px; background: var(--brand); color: var(--on-brand); box-shadow: none; }
.schedule__item.is-today .schedule__time { color: var(--on-brand); }
.faq__item { border: 0; border-top: 3px solid var(--ink); background: transparent; }
.cta-band { background: var(--dark); color: var(--on-dark); }
.cta-band p { color: #d4d4d4; }
.cta-band .btn--ghost { border-color: #ffffff; color: #ffffff; }
.samples__card, .steps__list li { padding: 18px 0 0; border: 0; border-top: 6px solid var(--brand); background: transparent; }
