/* Lattice design-token standard — brand 'neutral'.
   GENERATED from lattice.brands. Do not edit a copy of this file;
   edit the row (admin UI or /api/brands/) and re-fetch. */
:root {
  --color-bg-dark: #0f172a;
  --color-bg-light: #f8fafc;
  --color-danger: #c0392f;
  --color-danger-on-dark: #f2837a;
  --color-success: #1c7a4d;
  --color-success-on-dark: #5fca94;
  --color-text-on-dark: #f8fafc;
  --color-text-on-light: #0f172a;
  --color-warning: #8a5a00;
  --color-warning-on-dark: #e0a94a;
  --container-max: 1400px;
  --font-accent: var(--font-display);
  --font-mono: ui-monospace, "SF Mono", "JetBrains Mono", monospace;
  --neutral-100: #efe9e7;
  --neutral-200: #e0dddc;
  --neutral-300: #d1d5db;
  --neutral-400: #9ca3af;
  --neutral-50: #f7f4f3;
  --neutral-500: #6b7280;
  --neutral-600: #4b5563;
  --neutral-700: #374151;
  --neutral-800: #1f2937;
  --neutral-900: #111827;
  --neutral-950: #0b1120;
  --radius-full: 9999px;
  --radius-lg: 18px;
  --radius-md: 12px;
  --radius-sm: 8px;
  --section-pb: var(--section-py);
  --section-pt: var(--section-py);
  --section-py: clamp(3.5rem, 7vw, 8rem);
  --shadow-lg: 0 2px 4px rgba(0,0,0,.05), 0 18px 44px -10px rgba(0,0,0,.14);
  --shadow-md: 0 1px 2px rgba(0,0,0,.04), 0 8px 24px -6px rgba(0,0,0,.10);
  --shadow-sm: 0 1px 2px rgba(0,0,0,.05);
  --site-max-width: var(--container-max);
  --space-2xl: calc(3rem * var(--space-scale));
  --space-3xl: calc(4rem * var(--space-scale));
  --space-4xl: calc(6rem * var(--space-scale, 1));
  --space-lg: calc(1.5rem * var(--space-scale));
  --space-md: calc(1rem * var(--space-scale));
  --space-scale: 1;
  --space-sm: calc(0.5rem * var(--space-scale));
  --space-xl: calc(2rem * var(--space-scale));
  --space-xs: calc(0.25rem * var(--space-scale));
  --surface-200: #eef2f7;
  --tap-min: 44px;
  --tap-primary: 56px;
  --text-2xl: 1.5rem;
  --text-3xl: clamp(1.875rem, 3.4vw, 2.5rem);
  --text-4xl: clamp(2.25rem, 4.4vw, 3.25rem);
  --text-5xl: clamp(2.75rem, 5.6vw, 4.25rem);
  --text-6xl: clamp(3.25rem, 7vw, 5.5rem);
  --text-base: 1rem;
  --text-display: clamp(2.5rem, 5.6vw, 4.5rem);
  --text-hero: clamp(3rem, 8.5vw, 7rem);
  --text-lg: 1.125rem;
  --text-sm: 0.875rem;
  --text-xl: 1.25rem;
  --text-xs: 0.75rem;
}
@media (max-width: 768px) {
  :root {
    --section-pb: 96px;
    --section-pt: 48px;
  }
}
@media (max-width: 640px) {
  :root {
    --section-pb: 0px;
    --section-pt: 0px;
  }
}