/* Design tokens — Jurjani Valles brand (from the old jurjanivalles.com,
   simplified): navy + orange, near-black text, light grey surfaces; Montserrat
   headings, Poppins body. One light theme (no dark mode). Change values here,
   never hard-code colors in page or feature CSS. */
:root {
  /* Brand */
  --color-primary: #00274D;        /* navy: dashboard buttons, headings, links (white 15:1) */
  --color-primary-ink: #001A33;    /* hover/pressed */
  --color-accent: #FF9500;         /* orange: the CTA — navy text only (7.5:1), never white */
  --color-accent-ink: #00274D;
  --color-highlight: #FFF4E5;      /* soft orange tint: callouts, "Concept work" pills */
  --color-highlight-ink: #00274D;
  --color-danger: #B42318;
  --color-success: #2F7D4A;
  --color-warning: #B7791F;
  --color-on-dark: #FFFFFF;
  --color-google-bg: #FFFFFF;
  --color-google-ink: #131921;

  /* Surfaces & text */
  --color-focus: #00274D;
  --color-bg: #FFFFFF;
  --color-surface: #FFFFFF;
  --color-surface-2: #F5F5F5;
  --color-text: #131921;
  --color-text-2: #2B3440;
  --color-muted: #5A6472;
  --color-faint: #8A93A0;
  --color-border: #E1E5EA;
  --color-link: #00274D;
  --color-tint: #EEF3F8;
  --color-header: #FFFFFF;
  --color-header-ink: #00274D;
  --color-input: #FFFFFF;
  /* Home hero: soft light gradient (warm cream → pale navy) with an orange glow behind the photo */
  --hero-cream: #FCF9F4;
  --hero-mist: #DFE7F1;
  --hero-glow: rgba(255, 149, 0, 0.38);
  --hero-shade: rgba(0, 39, 77, 0.14);
  --color-danger-text: #B42318;
  --shadow-sm: 0 1px 2px rgba(0, 39, 77, 0.06);
  --shadow-md: 0 2px 8px rgba(0, 39, 77, 0.08);
  --shadow-lg: 0 12px 32px rgba(0, 39, 77, 0.14);
  color-scheme: light;

  /* Type */
  --font-body: 'Poppins', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-display: 'Montserrat', var(--font-body);
  --font: var(--font-body);
  --font-mono: ui-monospace, SFMono-Regular, Menlo, monospace;

  /* Spacing / shape */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 16px;
  --space-4: 24px;
  --space-5: 40px;
  --space-6: 72px;                 /* public page section rhythm */
  --radius: 10px;
  --radius-lg: 14px;
  --radius-full: 999px;
  --tap: 44px;

  /* Layout */
  --topbar-h: 60px;
  --content-max: 560px;
  --content-wide: 1120px;          /* public pages */
}