/* ======================================================================
 * LaunchClass · Design System
 * ----------------------------------------------------------------------
 * Single canonical source for design tokens, reset, base typography.
 * Loaded by every marketing page via /_partials/head.php.
 *
 * Layers:
 *   1. Tokens    (CSS custom properties: colors, layout)
 *   2. Reset     (universal box-sizing + zero default margins/padding)
 *   3. Globals   (html/body defaults, font stack, smoothing)
 *   4. Type      (em normalization — see INVARIANT 25)
 *
 * NOT in this file (intentional — pages may want to override):
 *   - Page-specific layout vars (--bar-h, --nav-h)
 *   - Component CSS (buttons, nav, forms) — those will get their own
 *     stylesheets (or stay inline for now) and load on top of this.
 *
 * Update protocol:
 *   - When a token's value changes, edit this file. Bump cache via
 *     scripts/bump-cache.sh so the ?v=BUILD_VERSION invalidates browsers.
 *   - When a token is added, add it here AND consider whether it's
 *     truly shared. Page-specific tokens stay in the page's inline <style>.
 * ====================================================================== */

/* ── 1. Tokens ─────────────────────────────────────────────────────── */
:root {
  /* Layout */
  --site-max: 1500px;

  /* Backgrounds (darkest → lighter) */
  --bg:       #05060B;
  --bg2:      #080A14;
  --bg3:      #0C1020;
  --bg-cell:  #0A0D1C;

  /* Borders (lightest → most prominent) */
  --border:     #141C36;
  --border2:    #1E2B52;
  --border-hot: #2B3E7A;

  /* Text (most prominent → faintest) */
  --text:        #EEF2FB;
  --text-muted:  #7C88A8;
  --text-dim:    #3F4968;
  --text-faint:  #222B47;

  /* Brand blue (and its variations) */
  --blue:       #4F8EFF;
  --blue-deep:  #2E6FEB;
  --blue-glow:  rgba(79, 142, 255, 0.38);
  --blue-soft:  rgba(79, 142, 255, 0.12);
  --blue-faint: rgba(79, 142, 255, 0.06);

  /* Status colors */
  --green:      #10B981;
  --green-soft: rgba(16, 185, 129, 0.12);
  --green-dim:  rgba(16, 185, 129, 0.12);  /* alias of --green-soft */
  --amber:      #F59E0B;
  --amber-soft: rgba(245, 158, 11, 0.12);
  --red:        #EF4444;

  /* Accent — used for retired-feature highlights, not primary UI */
  --violet:      #A78BFA;
  --violet-soft: rgba(167, 139, 250, 0.12);
}

/* ── 2. Reset ──────────────────────────────────────────────────────── */
*,
*::before,
*::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/* ── 3. Globals ────────────────────────────────────────────────────── */
html {
  scroll-behavior: smooth;
}

html,
body {
  background: var(--bg);
}

body {
  font-family: 'Fira Sans', sans-serif;
  color: var(--text);
  line-height: 1.55;
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  /* Pages can layer their own backgrounds on top (e.g. gradients) — see
   * checkout.html and thank-you.html for examples. */
}

/* ── 4. Type ──────────────────────────────────────────────────────── */
/* INVARIANT 25: no italics anywhere. <em> emphasizes via blue color only. */
em {
  font-style: normal;
}