/* Rackmason design tokens. Light is the default theme; set data-theme="dark" on a container for dark sections. */
:root {
  --rm-mist: #F7FAF9;
  --rm-white: #FFFFFF;
  --rm-graphite: #141518;
  --rm-steel: #55595F;
  --rm-line: #E2E6E4;
  --rm-deep-teal: #00695F;
  --rm-signal-teal: #00D4B4;
  --rm-moss: #1E7B3C;
  --rm-amber: #A35200;
  --rm-logo-teal: #009684;
  --rm-danger: #B42318;
  --rm-night: #101615;
  --rm-night-surface: #18201F;
  --rm-night-line: #28322F;
  --rm-frost: #F2F5F4;
  --rm-fog: #A4AFAC;
  --rm-background: var(--rm-mist);
  --rm-surface: var(--rm-white);
  --rm-text: var(--rm-graphite);
  --rm-muted: var(--rm-steel);
  --rm-border: var(--rm-line);
  --rm-primary: var(--rm-deep-teal);
  --rm-on-primary: var(--rm-white);
  --rm-accent: var(--rm-deep-teal);
  --rm-highlight: var(--rm-signal-teal);
  --rm-on-highlight: var(--rm-graphite);
  --rm-success: var(--rm-moss);
  --rm-warning: var(--rm-amber);
  --rm-danger: var(--rm-danger);
  --rm-font-heading: 'Schibsted Grotesk', system-ui, sans-serif;
  --rm-font-body: 'Schibsted Grotesk', system-ui, sans-serif;
  --rm-font-technical: 'JetBrains Mono', ui-monospace, monospace;
  --rm-display-size: clamp(2.75rem, 5.5vw, 4.5rem);
  --rm-display-weight: 800;
  --rm-display-line-height: 1;
  --rm-display-tracking: -0.04em;
  --rm-h1-size: clamp(2.25rem, 4vw, 3.25rem);
  --rm-h1-weight: 800;
  --rm-h1-line-height: 1.05;
  --rm-h1-tracking: -0.035em;
  --rm-h2-size: clamp(1.75rem, 2.8vw, 2.25rem);
  --rm-h2-weight: 700;
  --rm-h2-line-height: 1.1;
  --rm-h2-tracking: -0.025em;
  --rm-h3-size: 1.25rem;
  --rm-h3-weight: 700;
  --rm-h3-line-height: 1.25;
  --rm-h3-tracking: -0.01em;
  --rm-body-size: 1.0625rem;
  --rm-body-weight: 400;
  --rm-body-line-height: 1.6;
  --rm-body-tracking: 0;
  --rm-small-size: 0.875rem;
  --rm-small-weight: 400;
  --rm-small-line-height: 1.5;
  --rm-small-tracking: 0;
  --rm-button-size: 0.9375rem;
  --rm-button-weight: 600;
  --rm-button-line-height: 1;
  --rm-button-tracking: 0;
  --rm-label-size: 0.75rem;
  --rm-label-weight: 500;
  --rm-label-line-height: 1;
  --rm-label-tracking: 0.08em;
  --rm-max-width: 1200px;
  --rm-radius-sm: 6px;
  --rm-radius: 10px;
  --rm-radius-lg: 16px;
  --rm-radius-pill: 999px;
  --rm-unit: 8px;
  --rm-shadow-card: 0 1px 2px rgba(20, 21, 24, 0.06), 0 4px 16px rgba(20, 21, 24, 0.04);
  --rm-duration: 200ms;
  --rm-easing: cubic-bezier(0.2, 0, 0, 1);
}

[data-theme="dark"] {
  --rm-background: var(--rm-night);
  --rm-surface: var(--rm-night-surface);
  --rm-text: var(--rm-frost);
  --rm-muted: var(--rm-fog);
  --rm-border: var(--rm-night-line);
  --rm-primary: var(--rm-signal-teal);
  --rm-on-primary: var(--rm-night);
  --rm-accent: var(--rm-signal-teal);
  --rm-highlight: var(--rm-signal-teal);
  --rm-on-highlight: var(--rm-night);
}
