/* ============================================================
   Naxis Technologies — design tokens
   Steel blue #225479 (hue 206) is the only structural accent.
   Copper is annotation ink — numbers, eyebrows, plotted cells.
   Neutrals are faint tints of the brand hue: no warm paper,
   no generic gray. Radii: 8px controls / 12px panels; decor
   plates and pattern stay sharp (0).
   ============================================================ */

:root {
  /* ground + ink (hue 206 held, saturation collapsed) */
  --bg:          #ffffff;
  --bg-tint:     #f5f7f9;
  --bg-dip:      #eef2f5;
  --ink:         #16212b;
  --muted:       #5d6d7b;
  --faint:       #8a97a3;
  --line:        #e1e6eb;
  --line-strong: #c9d2da;

  /* brand — structure & action */
  --brand:       #225479;
  --brand-deep:  #1a4260;
  --brand-wash:  rgba(34, 84, 121, .06);
  --brand-wash-2:rgba(34, 84, 121, .12);

  /* copper — annotation & detail (text-safe ~4.7:1) */
  --copper:      #a85e24;
  --copper-wash: rgba(208, 133, 66, .10);
  --copper-wash-2:rgba(208, 133, 66, .18);

  /* registration grid — drawn in faint brand blue, never gray */
  --grid-fine:   rgba(34, 84, 121, .07);
  --grid-cross:  rgba(34, 84, 121, .26);
  --grid-cell:   rgba(208, 133, 66, .12);

  /* type */
  --font-sans: "InterVariable", "Inter", -apple-system, "Segoe UI",
               Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-mono: ui-monospace, "SF Mono", "Cascadia Mono", Consolas,
               "Liberation Mono", monospace;

  --fs-display: clamp(2.55rem, 6.2vw, 4.35rem);
  --fs-h2:      clamp(1.85rem, 3.6vw, 2.7rem);
  --fs-h3:      clamp(1.18rem, 1.7vw, 1.35rem);
  --fs-lead:    clamp(1.05rem, 1.55vw, 1.22rem);
  --fs-body:    1rem;
  --fs-small:   .875rem;
  --fs-mono:    .78rem;
  --fs-eyebrow: .72rem;

  /* radii — soft UI, sharp decor */
  --r-ctl:   8px;
  --r-panel: 12px;
  --r-plate: 0;

  /* rhythm */
  --container: 1120px;
  --container-wide: 1320px;
  --gutter: clamp(20px, 4.5vw, 44px);
  --sect:   clamp(4.25rem, 10vw, 7.5rem);

  /* decor */
  --plate-shadow: 8px 8px 0 rgba(34, 84, 121, .08);

  --header-h: 64px;
  --header-off: 10px;   /* the glass pane floats this far off the top edge */

  /* the liquid glass material — the app's Direction 02 recipe (paia.css),
     carried to the site. Panes resting on the aurora stay almost clear;
     panes floating over content keep a real blur. The rim catch-light and
     the lit wall are the material; the tint carries legibility. */
  --glass:        rgba(252, 254, 255, .5);
  --glass-strong: rgba(250, 253, 255, .74);
  --glass-line:   rgba(255, 255, 255, .68);
  --glass-edge:   rgba(255, 255, 255, .92);
  --glass-blur:   3px;

  /* the aurora's hues — the app's exact inks at the app's own strength
     (paia.css body::before): steel, sky, copper, violet, teal. The site
     lives ON the aurora now; the graphics keep their own ground. */
  --aur-steel:  rgba(30, 87, 130, .58);
  --aur-sky:    rgba(110, 176, 219, .64);
  --aur-copper: rgba(214, 128, 52, .48);
  --aur-violet: rgba(122, 124, 199, .5);
  --aur-teal:   rgba(64, 150, 162, .32);
}