/* ==========================================================================
   FencingLeadz Design Tokens
   Source: Stitch "Fencing Capital Editorial" design system reference
   (teal/sand palette, Manrope + DM Sans type, 8px grid, soft-radius shapes)
   ========================================================================== */
:root {
  /* Brand core */
  --teal-900: #063D35;
  --teal-800: #0B5D50;
  --teal-700: #117365;
  --teal-tint: #E6F0EE;

  --sand-500: #D8B486;
  --sand-400: #E7CEA9;
  --sand-300: #E7CEA9;
  --sand-100: #F7EEDC;
  /* Deeper, richer tones on the same warm-sand hue — for accents that need
     more weight/contrast than sand-500 (badges, icon fills, dividers, text
     on light backgrounds) without introducing an off-brand color. */
  --sand-700: #B87D32;
  --sand-900: #734D1C;

  --ink: #15201E;
  --body: #34403D;
  --muted: #66736F;

  --surface: #FFFFFF;
  --background: #F8F8F4;
  --background-alt: #F1F4F0;
  --border: #DDE5DF;
  --border-tinted: #CBDCD7;

  --error: #BA1A1A;
  --error-bg: #FFDAD6;

  /* Type */
  --font-display: "Manrope", "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-body: "DM Sans", "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;

  /* Radii */
  --radius-sm: 4px;
  --radius-md: 6px;
  --radius-lg: 8px;
  --radius-xl: 12px;
  --radius-full: 9999px;

  /* Spacing (8px grid) */
  --space-2xs: 0.25rem;
  --space-xs: 0.5rem;
  --space-sm: 0.75rem;
  --space-md: 1rem;
  --space-lg: 1.5rem;
  --space-xl: 2.5rem;
  --space-2xl: 4rem;
  --space-3xl: 6rem;

  /* Layout */
  --content-max: 1320px;
  --gutter: 1.5rem;
  --margin: 3rem;

  /* Shadows */
  --shadow-card: 0 4px 16px -2px rgba(11, 93, 80, 0.06), 0 1px 3px rgba(21, 32, 30, 0.04);
  --shadow-overlay: 0 16px 36px -4px rgba(21, 32, 30, 0.08), 0 4px 12px -2px rgba(11, 93, 80, 0.04);

  color-scheme: light;
}

@media (max-width: 767px) {
  :root {
    --gutter: 1rem;
    --margin: 1.25rem;
  }
}