/* ===========================================================
   VerityRadar — Design Tokens (single source of truth).
   Loaded by every page. To reskin the site, edit values in
   :root only. No raw hex/rgba should appear in any rule below
   or in any other stylesheet.
   =========================================================== */
:root {
  /* --- Brand palette (raw hex) --- */
  --c-navy:           #0f0847;
  --c-navy-deep:      #0a0535;
  --c-navy-deeper:    #060329;
  --c-navy-hi:        #1a0f5c;
  --c-white:          #ffffff;
  --c-purple:         #8557e8;
  --c-purple-hi:      #a37dff;
  --c-lime:           #a3e635;
  --c-lime-dim:       #bef264;
  --c-success:        #4ade80;
  --c-danger:         #f87171;

  /* --- Surface tiers (white over dark, by alpha) --- */
  --alpha-1:          rgba(255,255,255,.04);
  --alpha-2:          rgba(255,255,255,.07);
  --alpha-3:          rgba(255,255,255,.10);
  --alpha-4:          rgba(255,255,255,.18);
  --alpha-5:          rgba(255,255,255,.28);

  /* --- Text tiers --- */
  --text-1:           #ffffff;
  --text-2:           rgba(255,255,255,.85);
  --text-3:           rgba(255,255,255,.75);
  --text-4:           rgba(255,255,255,.55);
  --text-5:           rgba(255,255,255,.42);

  /* --- Tinted soft fills --- */
  --accent-soft:      rgba(133,87,232,.18);
  --accent-glow:      rgba(133,87,232,.28);
  --success-soft:     rgba(74,222,128,.10);
  --success-border:   rgba(74,222,128,.32);
  --danger-soft:      rgba(248,113,113,.10);
  --danger-border:    rgba(248,113,113,.32);

  /* --- Backdrops & shadow color --- */
  --backdrop:         rgba(0,0,0,.55);
  --shadow-tone:      rgba(0,0,0,.40);

  /* --- Nav (intentionally light — sits above the dark page body) --- */
  --nav-bg:           #ffffff;
  --nav-bg-soft:      #f4f1f8;
  --nav-bg-hov:       #ede9ef;
  --nav-text:         #0f0847;
  --nav-text-muted:   #6b6193;
  --nav-text-faint:   #a9a2c8;
  --nav-border:       #d4cfe0;
  --nav-border-hov:   #c0bace;
  --nav-shadow-md:    0 20px 50px -10px rgba(15,8,71,.18), 0 4px 12px rgba(15,8,71,.06);
  --nav-shadow-lg:    -8px 0 30px rgba(15,8,71,.12);

  /* --- Semantic tokens (use these in rules) --- */
  --bg:               var(--c-navy);
  --bg-alt:           var(--c-navy-deep);
  --bg-deep:          var(--c-navy-deeper);
  --gradient-hero:    linear-gradient(170deg, var(--c-navy) 0%, var(--c-navy-hi) 100%);

  --surface:          var(--alpha-1);
  --surface-hov:      var(--alpha-2);
  --surface-strong:   var(--alpha-2);

  --heading:          var(--text-1);
  --body:             var(--text-3);
  --muted:            var(--text-4);
  --faint:            var(--text-5);

  --border:           var(--alpha-3);
  --border-soft:      var(--alpha-2);
  --border-strong:    var(--alpha-4);

  --accent:           var(--c-purple);
  --accent-hov:       var(--c-purple-hi);

  --lime:             var(--c-lime);
  --lime-dim:         var(--c-lime-dim);

  --success:          var(--c-success);
  --danger:           var(--c-danger);

  /* --- Sizing --- */
  --radius:           14px;
  --radius-sm:        8px;
  --maxw:             1180px;
  --read-maxw:        760px;

  /* --- Elevation --- */
  --shadow-sm:        0 1px 3px rgba(0,0,0,.18), 0 1px 2px rgba(0,0,0,.14);
  --shadow-md:        0 4px 16px rgba(0,0,0,.28), 0 1px 3px rgba(0,0,0,.18);
  --shadow-lg:        0 12px 40px rgba(0,0,0,.40), 0 4px 12px rgba(0,0,0,.20);
}

/* ===========================================================
   Base reset + body. Pages that want body/typography from
   theme.css get it for free; landing.html overrides as needed.
   =========================================================== */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  color: var(--body);
  background: var(--bg);
  line-height: 1.7;
  font-size: 15px;
  -webkit-font-smoothing: antialiased;
}