/*
 * Design tokens for the paradox-h theme.
 *
 * The original static export referenced an external design-system bundle
 * (romeling-design-system/tokens/colors.css, typography.css, spacing.css)
 * that wasn't part of the upload used to build this theme -- only the
 * variable names were visible in the markup. The values below are a
 * reasonable approximation of the intended look (black/white/greige with
 * a single lab-green accent, a heavy display face and a mono label face).
 *
 * Everything in the theme reads these custom properties and nothing else,
 * so if you get the real token files later, you can drop their values in
 * here (keep the variable names identical) and the whole theme updates
 * without touching any other file.
 */

:root {
  /* --- Color --- */
  --black: #101010;
  --white: #ffffff;
  --accent-green: #baff29;

  /* Warm neutrals. -2 is light (used for text on dark/hover surfaces),
     -4 and -5 get progressively darker (used for muted text on white). */
  --greige-2: #d8d3c9;
  --greige-3: #bdb7ac;
  --greige-4: #9a938a;
  --greige-5: #6f6a62;

  /* --- Type --- */
  --font-display: "Neue Haas Grotesk Display", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-mono: "IBM Plex Mono", "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;

  --fw-regular: 400;
  --fw-bold: 700;
  --fw-heavy: 800;

  --lh-tight: 1.05;
  --lh-base: 1.6;

  --tracking-tight: -0.02em;
  --tracking-label: 0.08em;

  /* --- Spacing (4px base scale) --- */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-8: 48px;
  --space-10: 64px;
  --space-12: 80px;

  /* --- Layout --- */
  --page-max-width: 1440px;
  --page-padding: var(--space-10);
}

@media (max-width: 900px) {
  :root {
    --page-padding: var(--space-5);
  }
}