/* Shared chrome for the standalone pages: methodology, about, terms, privacy.
 *
 * These four pages are self-contained HTML with their own <style> block, and
 * every one of them carried a private copy of the design tokens, the reset and
 * the whole page header. The copies had already drifted -- methodology and
 * about set the mobile nav gap to 16px, terms and privacy to 14px -- and a
 * header bug therefore had to be fixed four times, which is exactly how the
 * "Enter" button ended up unreachable on mobile on all four at once.
 *
 * Only rules that were BYTE-IDENTICAL in all four pages live here. Anything
 * that differed stays inline on its page, and since each page links this file
 * BEFORE its own <style>, inline rules still win. Extracting only exact
 * duplicates is what makes this a no-op visually.
 */

:root {
      color-scheme: dark;
      /* 2.0 dark palette — matches TACO/css/app.css :root so the static pages
         read as the same site. Near-black base + sharpened gold. */
      --bg: #0a0a0c;
      --bg-elev: #141418;
      --bg-elev-2: #1c1c22;
      --text: #f4f3f6;
      --text-dim: #8a8996;
      --text-muted: #a3a2ad;
      --accent: #ecb84a;
      --accent-soft: #f8cd66;
      --border: #2a2a32;
      --border-soft: rgb(255 255 255 / 0.08);
      --ease: cubic-bezier(0.4, 0, 0.2, 1);
    }

* { box-sizing: border-box; margin: 0; padding: 0; }

a { color: inherit; text-decoration: none; }

.page-header-mark em {
      font-style: italic;
      color: var(--accent);
    }

.page-header-nav {
      display: flex;
      gap: 28px;
      align-items: center;
    }

.page-header-nav a {
      font-size: 13px;
      color: var(--text-muted);
      transition: color 0.15s var(--ease);
    }

.page-header-nav a:hover { color: var(--accent); }

.page-header-nav a.active { color: var(--accent); }

.page-header-cta:hover { filter: brightness(1.1); }

.page-eyebrow {
      font-family: 'Roboto Mono', monospace;
      font-size: 11px;
      font-weight: 500;
      letter-spacing: 2px;
      text-transform: uppercase;
      color: var(--accent);
      margin-bottom: 20px;
      display: flex;
      align-items: center;
      gap: 12px;
    }

.page-eyebrow::before {
      content: '';
      width: 24px;
      height: 1px;
      background: var(--accent);
    }

.page-title em {
      font-style: italic;
      color: var(--accent);
    }

.page-footer-mark {
      font-family: 'Space Grotesk', system-ui, sans-serif;
      font-weight: 700;
      font-size: 16px;
      color: var(--text-dim);
    }

.page-footer-mark em {
      font-style: italic;
      color: var(--accent);
    }

.page-footer-tag {
      font-family: 'Roboto Mono', monospace;
      font-size: 11px;
      color: var(--text-muted);
      letter-spacing: 1.5px;
      text-transform: uppercase;
    }

.page-footer-links a {
      font-size: 13px;
      color: var(--text-muted);
      transition: color 0.15s var(--ease);
    }

.page-footer-links a:hover { color: var(--accent); }

.site-build-version {
      flex-basis: 100%;
      width: 100%;
      margin-top: 10px;
      font-family: 'Roboto Mono', ui-monospace, monospace;
      font-size: 10px;
      color: var(--text-muted);
      letter-spacing: 0.06em;
    }