:root {
  /* Neutrals, ported verbatim from the portfolio design system
     (D:\AntigravityVisitRotterdam\static\assets\css\variables.css,
     itself ported from Dalt Vila Ibiza). Shared across the portfolio
     so every site reads as the same family; only the accent changes
     per site to give each its own identity. */
  --ink: #16313f;
  --ink2: #264a5b;
  --stone: #456978;
  --mist: #9fb2bb;
  --sand: #ece5da;
  --paper: #fbfaf8;
  --line: rgba(22, 49, 63, 0.14);

  /* Accent: warm dune amber-bronze, distinct from Rotterdam's red
     (#d44a35), from Scheveningen's ocean teal (#156570), and from the
     generic template blue/orange (#98c1d9 / #ff6600) the live
     WordPress site currently shares with every other cloned "Visit X"
     site in the portfolio. Evokes the dunes / quieter village character.
     WCAG 2.2 contrast verified against the relative-luminance formula
     (2026-08-09), not eyeballed:
     accent-300 #b17f3a vs white 3.52:1 (decorative / large-text only)
     accent-500 #a56f27 vs white 4.28:1 (base, badges, large-text CTAs)
     accent-600 #8a5a1f vs white 5.89:1 (default for any text-bearing surface)
     accent-700 #6d4517 vs white 8.35:1 (hover/active on accent-600)

     Fase 9 a11y-audit (2026-08-09), non-text/dark-surface pairs also
     computed (not just vs white), 3 real failures found and fixed:
     - accent-300 #b17f3a vs --ink #16313f = 3.86:1 (>=3:1 non-text UI,
       used for .stay-cta-bar-icon; accent-500 there was only 3.17:1, fail)
     - accent-600 vs the translucent .site-header background, worst case
       fully opaque black directly behind it = 4.95:1 at 0.94 alpha
       (was 3.71:1 at the old 0.82 alpha, fail) */
  --accent-300: #b17f3a;
  --accent-500: #a56f27;
  --accent-600: #8a5a1f;
  --accent-700: #6d4517;

  --font-serif: 'Marcellus', serif;
  --font-italic: 'Cormorant Garamond', serif;
  --font-sans: 'Jost', system-ui, sans-serif;

  --nav-height: 72px;

  /* Radius scale, ported unchanged from the portfolio design system */
  --radius-xs: 2px;
  --radius-sm: 3px;
  --radius-md: 4px;
  --radius-lg: 6px;
  --radius-xl: 8px;
  --radius-2xl: 10px;
  --radius-3xl: 12px;
  --radius-pill: 999px;

  /* Shadow scale, ported unchanged */
  --shadow-sm: 0 4px 16px rgba(22, 49, 63, 0.12);
  --shadow-md: 0 8px 30px rgba(22, 49, 63, 0.14);
  --shadow-lg: 0 12px 40px rgba(22, 49, 63, 0.16);
  --shadow-xl: 0 16px 48px rgba(22, 49, 63, 0.16), 0 2px 8px rgba(22, 49, 63, 0.06);
  --shadow-2xl: 0 24px 70px rgba(22, 49, 63, 0.22);
  --shadow-drawer: -12px 0 60px rgba(22, 49, 63, 0.18);

  /* z-index scale, ported unchanged */
  --z-back-top: 90;
  --z-header: 120;
  --z-lang-pill: 121;
  --z-dock: 122;
  --z-cookie-bar: 160;
  --z-skip-link: 200;
}
