/* SandFly Exuma Pest Control — Design Tokens
   Import this file, then components.css, to render any component. */

:root {
  /* ---- Color ---- */
  --ink:        #0A1B24; /* near-black deep sea — body text, dark sections */
  --deep:       #0E3A4C; /* deep ocean blue — primary brand */
  --sea:        #17788F; /* mid teal-blue — links, secondary accents */
  --accent:     #F26A21; /* hot orange — CTAs, checks, icons ONLY */
  --accent-dk:  #D45512; /* accent hover/active */
  --sand:       #F5EFE4; /* warm off-white — alternating section bg */
  --paper:      #FFFFFF;
  --muted:      #5A6A72; /* secondary text on paper/sand */
  --muted-on-ink: #9FB2BA; /* secondary text on ink */
  --line:       #D9D2C6; /* hairline borders on paper/sand */
  --line-on-ink: #24404C; /* hairline borders on ink */

  /* ---- Type ---- */
  --font-heading: "Archivo Condensed", "Arial Narrow", sans-serif;
  --font-body: "Inter", -apple-system, sans-serif;

  --fs-display: clamp(2.75rem, 2rem + 3.5vw, 5rem);
  --fs-h1:      clamp(2.25rem, 1.7rem + 2.5vw, 3.75rem);
  --fs-h2:      clamp(1.75rem, 1.4rem + 1.6vw, 2.75rem);
  --fs-h3:      clamp(1.25rem, 1.1rem + 0.7vw, 1.75rem);
  --fs-body:    1rem;
  --fs-body-lg: 1.125rem;
  --fs-small:   0.875rem;
  --fs-eyebrow: 0.8125rem;

  --lh-heading: 1.05;
  --lh-body: 1.65;
  --ls-heading: -0.01em;
  --ls-eyebrow: 0.14em;

  /* ---- Spacing scale ---- */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-6: 24px;
  --sp-8: 32px;
  --sp-12: 48px;
  --sp-16: 64px;
  --sp-24: 96px;
  --sp-32: 128px;

  /* ---- Structure ---- */
  --radius: 2px;
  --border: 1px solid var(--line);
  --border-on-ink: 1px solid var(--line-on-ink);
  --max-width: 1200px;

  /* ---- Focus ---- */
  --focus-ring: 3px solid var(--accent);
  --focus-offset: 2px;
}