/* ============================================================
   Daily Pompano — brand tokens (authoritative source: CLAUDE.md)
   Consumed verbatim by the WP classic theme. Do not rename vars.
   ============================================================ */

:root {
  /* ---- Color (9 named colors) ---- */
  --dp-deep-ink-navy: #10243F;  /* Primary — wordmark, header, footer, structure, section rules */
  --dp-atlantic-teal: #0E7C86;  /* Large display only */
  --dp-teal-ink:      #0C6D76;  /* Links, kickers, category labels (small text) */
  --dp-sand:          #F4EFE6;  /* Warm neutral page background */
  --dp-signal-coral:  #E4572E;  /* Breaking tags, CTA + alert BACKGROUNDS, large display */
  --dp-near-black:    #14161A;  /* Body text */
  --dp-muted-slate:   #4A4F57;  /* Secondary/meta text on Sand or white */
  --dp-caption-slate: #3A3F47;  /* Annotation text on desk gray */
  --dp-warm-gray:     #D6CFC4;  /* Rules and dividers ONLY — never type */

  /* Yes/no & pass/fail state tints (never green/red) */
  --dp-tint-pass: #CFE0DE;  /* desaturated teal */
  --dp-tint-fail: #F7DCD1;  /* desaturated coral */

  /* ---- Type ---- */
  /* Two families only. Full Latin Extended required (Kreyòl Ayisyen). */
  --dp-font-serif: 'Source Serif 4', Georgia, serif;   /* wordmark (Bold), headlines + article body (600/700) */
  --dp-font-ui:    'Inter', system-ui, sans-serif;     /* UI, nav, kickers, bylines, captions, DAILY line */

  /* Type scale — body copy never below 16px */
  --dp-text-caption: 13px;   /* captions, bylines, meta (Inter) */
  --dp-text-kicker:  15px;   /* kickers/category labels (Inter, caps, wide tracking) */
  --dp-text-body:    16px;   /* FLOOR — body copy never smaller */
  --dp-text-body-lg: 19px;   /* article body / lede */
  --dp-text-h3:      24px;
  --dp-text-h2:      32px;
  --dp-text-h1:      44px;   /* headlines: never all-caps */
  --dp-leading-body: 1.65;
  --dp-leading-head: 1.15;

  /* ---- Layout ---- */
  --dp-max-width: 1280px;
  --dp-gutter:    40px;
  --dp-rule-section: 2px solid var(--dp-deep-ink-navy);  /* above section heads */
  --dp-rule-divider: 1px solid var(--dp-warm-gray);      /* between list items */
}

/* ============================================================
   HARD RULES (each was violated and re-fixed — do not regress)

   1. Coral (--dp-signal-coral) is NEVER type below 24px, on any
      ground. Coral as a fill with dark text on it is correct;
      coral as small type is not. Prohibition/negative markers
      use navy, not coral.
   2. Text on coral is ALWAYS Near Black #14161A. Sand on coral
      is 3.22:1 and fails AA. White fails too.
   3. Never apply opacity to a container holding teal or coral
      text — Teal Ink is only 5.29:1 on Sand; dimming pushes it
      under AA. De-emphasise with --dp-muted-slate /
      --dp-caption-slate instead.
   4. Warm Gray #D6CFC4 is NEVER a text or numeral color. For
      de-emphasised numerals: navy at 0.7 opacity.
   5. Minimum 0.62 opacity for dark text on Sand or white —
      prefer solid colors over opacity entirely.
   6. Every text-on-background pairing must meet WCAG AA 4.5:1
      (stated client constraint).
   7. No bright red, no royal blue anywhere. Yes/no, pass/fail
      states use --dp-tint-pass / --dp-tint-fail, never
      green/red.
   8. Body copy never below 16px. Headlines never all-caps.
   9. Logo: assets/pompano-mark.svg is the ONE shared mark file
      (navy on transparent; add filter:invert(1) on dark/teal
      grounds). Swap that file to change the mark everywhere.
   ============================================================ */
