/* MAHNIA design tokens — derived from design.md (Vodafone-inspired system).
   Single scarlet accent, ink/canvas two-band rhythm, heavy display type. */

:root {
  /* Colors */
  --color-primary: #e60000;
  --color-on-primary: #ffffff;
  --color-ink: #25282b;
  --color-body: #7e7e7e;
  --color-mute: #bebebe;
  --color-canvas: #ffffff;
  --color-canvas-soft: #f2f2f2;
  --color-on-dark: #ffffff;

  /* Spacing */
  --space-xxs: 2px;
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 12px;
  --space-lg: 16px;
  --space-xl: 20px;
  --space-2xl: 24px;
  --space-3xl: 32px;

  /* Radius */
  --radius-none: 0px;
  --radius-xs: 1px;
  --radius-sm: 6px;
  --radius-card: 6px;
  --radius-pill-md: 32px;
  --radius-pill-lg: 60px;
  --radius-full: 9999px;

  /* Type family — Inter substitutes the proprietary Vodafone display sans */
  --font-display: "Inter", "Helvetica Neue", Arial, sans-serif;
  --font-body: "Inter", "Helvetica Neue", Arial, sans-serif;

  /* Fluid display sizes: clamp(mobile, viewport, desktop) per design.md breakpoints */
  --type-hero: clamp(40px, 7.5vw, 96px);
  --type-display-xl: clamp(44px, 8vw, 90px);
  --type-display-lg: clamp(34px, 5vw, 48px);
  --type-display-md: clamp(30px, 4vw, 40px);
  --type-display-sm: 32px;
  --type-display-xs: 24px;
  --type-eyebrow: 16px;
  --type-body-lg: 22px;
  --type-body-md: 18px;
  --type-body-sm: 16px;
  --type-caption: 14px;
  --type-caption-upper: 12px;

  /* Layout */
  --container-max: 1400px;
  --gutter: var(--space-3xl);
}