/* Rouze design tokens — palette + type extracted from live prod CSS.
   Referenced by v4 landing, pricing, terms, refunds. */
:root {
  --navy: #0A0C10;
  --navy-light: #12151C;
  --navy-mid: #1A1E2A;
  --orange: #FF6B35;
  --orange-glow: rgba(255, 107, 53, 0.15);
  --orange-soft: rgba(255, 107, 53, 0.85);
  --purple: #7C3AED;
  --purple-soft: rgba(124, 58, 237, 0.35);
  --green: #34D399;
  --text-primary: #F5F5F5;
  --text-secondary: #C0C5CE;
  --text-muted: #8891A0;
  --border: rgba(255, 255, 255, 0.06);
  --border-strong: rgba(255, 255, 255, 0.12);

  --font-display: 'Bebas Neue', sans-serif;
  --font-body: 'DM Sans', system-ui, -apple-system, sans-serif;
  --font-mono: 'DM Mono', ui-monospace, monospace;

  --wrap: 1200px;
  --wrap-narrow: 900px;
}

* { margin: 0; padding: 0; box-sizing: border-box; }
html { color-scheme: dark; }
body { background: var(--navy); color: var(--text-primary); font-family: var(--font-body); -webkit-font-smoothing: antialiased; }
a { color: var(--orange); text-decoration: none; }
a:focus-visible { outline: 2px solid var(--orange); outline-offset: 2px; border-radius: 2px; }
button:focus-visible { outline: 2px solid var(--orange); outline-offset: 2px; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
}