/*
  Design tokens — Connecture visual system (redesign).
  Editorial, dark-navy, technological. Single source of truth for
  color, type, spacing, radius and motion. Change values here, not
  in individual components.
*/
:root{
  color-scheme: dark;

  /* ===== backgrounds ===== */
  --ink: #020617;                     /* main background */
  --surface: #071226;                 /* elevated background / cards */
  --paper: color-mix(in srgb, var(--ink) 78%, var(--surface) 22%);   /* base section, between ink and surface */
  --paper-2: color-mix(in srgb, var(--ink) 58%, var(--surface) 42%); /* alt section, closer to surface */
  --line: rgba(245,247,250,0.09);     /* border on base/alt sections */
  --line-dark: rgba(245,247,250,0.13);/* border on deep-ink sections */

  /* background-pattern veil — ONE value for every large wrapper (nav, hero,
     section, cta, footer) and ONE for cards, so the tiled pattern reads as a
     single continuous image everywhere instead of patches of differing
     intensity. Tune these two, not the individual sections. */
  --veil: 55%;
  --veil-card: 30%;

  /* ===== text ===== */
  --text: #F5F7FA;                    /* primary text */
  --ink-soft: #94A3B8;                /* secondary text, everywhere */
  --paper-soft: #94A3B8;

  /* ===== accents =====
     Primary = cyan (apple-green-leaning teal): headings emphasis, primary
     buttons, links, labels, borders, selected states — the connective color.
     Secondary = blue and violet: the established Connecture identity,
     carried through thesis dualities, glows and supporting UI.
     Micro = a sparing green, hover-only, never a fill, never adjacent
     elements at once. */
  --turquoise: #5EEAD4;
  --turquoise-dim: color-mix(in srgb, var(--turquoise) 32%, var(--ink));
  --turquoise-tint: color-mix(in srgb, var(--turquoise) 55%, white);

  --violet: #8B5CF6;
  --violet-dim: color-mix(in srgb, var(--violet) 32%, var(--ink));
  --violet-tint: color-mix(in srgb, var(--violet) 55%, white);

  --blue: #3282FF;
  --blue-dim: color-mix(in srgb, var(--blue) 32%, var(--ink));

  --micro: #A3FF5F; /* hover-only accent — see components.css usage notes */

  /* ===== type ===== */
  --font-display: 'Saira Condensed', 'Archivo Narrow', system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-body: 'Inter', system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: ui-monospace, Menlo, "SFMono-Regular", monospace;

  /* ===== radius ===== */
  --radius: 8px;
  --radius-pill: 999px;

  /* ===== motion ===== */
  --ease: cubic-bezier(.16,.8,.24,1);
  --duration-fast: 160ms;
  --duration-hover: 240ms; /* card lift, button/arrow hover — snappier than --duration */
  --duration: 420ms;
  --duration-slow: 900ms;
  --reveal-distance: 22px;
  --reveal-distance-x: 26px; /* horizontal entrance for images (reveal-image) */
  --hero-img-shift: 52px; /* desktop slide-in distance for hero images, see layout.css */
  --hero-img-duration: 700ms;

  /* ===== layout ===== */
  --container: 1440px;
  --side: 72px;
  --side-mobile: 20px;
  --section-y: 88px;
  --section-y-mobile: 40px;
}

@media (prefers-reduced-motion: reduce){
  :root{ --duration-fast: 0ms; --duration-hover: 0ms; --duration: 0ms; --duration-slow: 0ms; --reveal-distance: 0px; --reveal-distance-x: 0px; --hero-img-shift: 0px; --hero-img-duration: 0ms; }
}