/* ============================================================
   Outrankco — Design Tokens
   STRICT 6-color brand palette (+ white for text on dark only).
   No variation. No alternates. No hover-hex.
   ============================================================ */

:root {
  /* ---- Strict palette: 6 colors + white ---- */
  /* --c-primary: dark surfaces (header, footer, hero, dark sections). --c-deep: body text on light backgrounds only. */
  --c-primary: #17375E;   /* Brand navy anchor + ALL dark surfaces */
  --c-deep:    #091235;   /* Body text on light backgrounds ONLY (not a background) */
  --c-support: #2B4257;   /* Borders, cards on dark, accent */
  --c-soft:    #2B4257;   /* Muted text on light surfaces (darkened 2026-05-18). On dark surfaces, override below restores #88A9C3. */
  --c-bg:      #F7F9FC;   /* Page background, section breaks */
  --c-accent:  #E8992E;   /* CTA only */
  --c-accent-deep: #C58227;  /* hover/active shade of --c-accent (2026-07-23) */
  --c-white:   #FFFFFF;   /* Text on dark surfaces only (NOT a background) */

  /* ---- Type — Open Sans only ---- */
  --font-family:       "Open Sans", system-ui, -apple-system, sans-serif;

  /* Hierarchy by weight + size + tracking, NOT by family */
  --fw-light:    400;  /* raised 300 -> 400, 2026-07-23 — body copy legibility */
  --fw-regular:  400;
  --fw-semibold: 600;
  --fw-bold:     700;
  --fw-extra:    800;

  /* Tracking tokens — Open Sans needs negative tracking at display sizes */
  --tracking-display:  -0.025em;
  --tracking-heading:  -0.015em;
  --tracking-tight:    -0.005em;
  --tracking-normal:    0;
  --tracking-eyebrow:   0.18em;
  --tracking-label:     0.08em;

  /* Fluid type scale — tightened per feedback (2026-05-14): editorial density */
  --fs-display:   clamp(2.25rem, 3.5vw + 1rem, 3.75rem);    /* hero h1 — cap 60px */
  --fs-h1:        clamp(1.875rem, 2.5vw + 0.75rem, 2.75rem); /* cap 44px */
  --fs-h2:        clamp(1.5rem, 1.5vw + 0.75rem, 2rem);      /* cap 32px */
  --fs-h3:        clamp(1.125rem, 0.75vw + 0.875rem, 1.375rem); /* cap 22px */
  --fs-h4:        clamp(1rem, 0.25vw + 0.95rem, 1.125rem);   /* cap 18px */
  --fs-lead:      clamp(1rem, 0.4vw + 0.9rem, 1.125rem);     /* cap 18px */
  --fs-body:      1rem;        /* 16px */
  --fs-small:     0.875rem;    /* 14px */
  --fs-caption:   0.75rem;     /* 12px */
  --fs-eyebrow:   0.6875rem;   /* 11px */

  /* Layout */
  --container-max: 1240px;
  --container-narrow: 760px;
  --gutter:        clamp(1.5rem, 4vw, 3rem);

  /* Motion */
  --ease-out:     cubic-bezier(0, 0, 0.2, 1);
  --ease-in-out:  cubic-bezier(0.4, 0, 0.2, 1);

  /* Sticky stack heights (announce bar + header) */
  --announce-bar-h: 34px;   /* desktop slim bar */
  --header-h:       76px;   /* desktop header */
}

@media (max-width: 640px) {
  :root { --announce-bar-h: 32px; }
}

/* Dark-surface override: muted text on dark backgrounds needs lighter color for contrast. */
.hero,
.section--dark,
.section--dark-sub,
.site-footer,
.ast-primary-header-bar,
.announce-bar,
.page-hero {
  --c-soft: #88A9C3;
}