/* =========================================================================
   Insurance Phantom — Design Tokens
   Drop-in CSS custom properties for the Astro theme.
   Owner: Zee. The accent is a single, fixed brand teal — do not introduce a
   second accent. Light/dark is handled by recoloring the mark via `color`,
   not by adding a new accent.
   ========================================================================= */
:root {
  /* --- surfaces --- */
  --ip-bg:         #F7F6F1;
  --ip-bg-deep:    #EEEAE0;
  --ip-surface:    #FFFFFF;
  --ip-surface-2:  #EEEAE0;
  --ip-border:     #C8B994;

  /* --- text --- */
  --ip-text:       #0E2A3E;
  --ip-text-muted: #526675;
  --ip-text-faint: #7A8993;

  /* --- accent (single) --- */
  --ip-accent:     #796744;
  --ip-accent-rgb: 121, 103, 68;
  --ip-on-accent:  #FFFFFF;

  /* --- state --- */
  --ip-focus:      #796744;
  --ip-focus-ring: 0 0 0 3px rgba(121, 103, 68, 0.45);
  --ip-link:       #0E2A3E;

  /* --- gradients --- */
  --ip-grad-bg:    linear-gradient(180deg, #F7F6F1 0%, #EEEAE0 100%);
  --ip-grad-glow:  radial-gradient(circle at 50% 30%, rgba(121,103,68,0.15), rgba(121,103,68,0) 60%);

  /* --- type --- */
  --ip-font-display: 'Space Grotesk', 'SF Pro Display', system-ui, -apple-system, sans-serif;
  --ip-font-body:    'Inter',        'SF Pro Text',    system-ui, -apple-system, sans-serif;
  --ip-font-mono:    'JetBrains Mono','SF Mono',        ui-monospace, monospace;

  /* --- shape & motion --- */
  --ip-radius:      14px;
  --ip-radius-pill: 999px;
  --ip-ease:        cubic-bezier(0.22, 0.61, 0.36, 1);
  --ip-dur:         220ms;   /* keep <= 300ms; brand rule: minimal motion */
}

/* Respect user preference: motion off entirely. */
@media (prefers-reduced-motion: reduce) {
  :root { --ip-dur: 0ms; }
}

/* ---- Brand mark recoloring ----------------------------------------------
   brand-mark.svg / logo-*.svg use fill="currentColor" for the figure.
   Set the inherited color to recolor the silhouette; the teal accent stays fixed.
   .ip-on-dark  -> figure visible against the Void background
   .ip-on-light -> figure visible against a light surface (rare; legal pages) */
.ip-mark { color: #3C4A66; }
.ip-mark.ip-on-light { color: #1B2330; }
.ip-mark a:focus-visible, .ip-mark:focus-visible { outline: var(--ip-focus-ring); }
