/* Fortified Networks, Option 3 ("editorial split-screen"), local tokens.
   Shared brand constants (--font-*, --accent, --cream, --ink, --ease-*) come
   from ../shared/css/base.css. Only Option 3 values live here. */

:root {
  /* ---------- horizontal grid ----------
     One rail governs the whole page. .wrap pads by --rail, and the hero's
     dark column pads by the same value, so every heading, row and paragraph
     on the page starts on the same vertical line at every width. Nothing is
     ever flush to the viewport edge because --rail floors at --gutter. */
  --maxw: 1180px;
  --gutter: clamp(1.25rem, 4vw, 3.25rem);
  --rail: max(var(--gutter), calc((100vw - var(--maxw)) / 2));

  /* ---------- hero split ---------- */
  --o3-hero-panel-w: clamp(320px, 34vw, 440px);
  --o3-hero-ground: #07080f;

  /* Dark-ground text roles, contrast-checked against #07080f:
     nav muted ~9.4:1, nav hover ~19:1, subhead ~11.9:1, accent ~5.2:1 */
  --o3-nav-muted: #a8b0c2;
  --o3-nav-hover: #f7f8fa;
  --o3-heading-ink: #f7f8fa;
  --o3-subhead-ink: #c3c8d4;
  --o3-dark-rule: rgba(255, 255, 255, .16);
  --o3-dark-rule-strong: rgba(255, 255, 255, .34);

  /* Cream-ground text roles, contrast-checked against --cream #ece9e4:
     --ink ~18:1, meta #616775 ~4.68:1, body #3a3f4c ~8.7:1 */
  --o3-meta: #616775;
  --o3-body: #3a3f4c;
  --o3-rule: rgba(1, 3, 20, .16);
  --o3-rule-strong: rgba(1, 3, 20, .42);

  /* ---------- section grounds ----------
     Light, dark, light, light, dark. The two list-heavy light sections sit a
     half step apart (cream-soft vs cream) so they read as separate chapters
     without another hard colour flip. */
  --o3-cap-bg: var(--cream-soft);
  --o3-svc-bg: var(--o3-hero-ground);
  /* The program figure's own ground. Blue-lifted rather than the neutral
     near-black above it, because two adjacent dark sections at the same
     value read as one long stretch: the hue shift plus a hairline is what
     makes the second one land as a new chapter. It also lifts the accent
     the traces are drawn in, which is the point of the section. */
  --o3-prog-bg: #070d1a;
  --o3-diff-bg: var(--cream);
  --o3-tech-bg: var(--cream-soft);
  --o3-close-bg: var(--o3-hero-ground);
  --o3-footer-bg: var(--ink);

  /* ---------- vertical rhythm ----------
     Deliberately unequal. The capabilities chapter (primary) breathes widest,
     the differentiators (tertiary) sit tightest. That variation is the
     hierarchy, as much as the type sizes are. */
  --o3-pad-primary: clamp(4.5rem, 11vh, 8rem);
  --o3-pad-secondary: clamp(4rem, 9.5vh, 7rem);
  --o3-pad-tertiary: clamp(3.25rem, 7vh, 5rem);

  /* Breakpoints, kept as properties for reference. Media queries still need
     literal px, but these document the values js/motion.js mirrors. */
  --o3-bp-desktop: 1000px;
  --o3-bp-tablet: 720px;
}
