/**
 * Wireframe design tokens — grayscale only.
 */
:root {
  --color-bg: #ffffff;
  --color-surface: #ffffff;
  --color-surface-alt: #f7f7f7;
  --color-border: #e8e8e8;
  --color-border-dark: #c8c8c8;
  --color-text: #1a1a1a;
  --color-text-muted: #888888;
  --color-text-inverse: #ffffff;
  --color-accent: #1a1a1a;
  --color-accent-hover: #444444;
  --color-placeholder: #ececec;
  --color-focus: #2563eb;

  --font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  /* Type scale (base 16px): xs 12 · sm 14 · base 16 · lg 18 · xl 22 · 2xl 28 · 3xl 36 */
  --font-size-xs: 0.75rem;
  --font-size-sm: 0.875rem;
  --font-size-base: 1rem;
  --font-size-lg: 1.125rem;
  --font-size-xl: 1.375rem;
  --font-size-2xl: 1.75rem;
  --font-size-3xl: 2.25rem;
  /* Fluid type (mobile-first, rem + vw) */
  --font-size-display: clamp(1.75rem, 1.25rem + 2.5vw, 2.75rem);
  --font-size-section: clamp(1.25rem, 1.0625rem + 0.75vw, 1.375rem);
  --font-size-contact: clamp(1.125rem, 1rem + 0.5vw, 1.25rem);
  --font-size-usp: clamp(0.875rem, 0.8125rem + 0.2vw, 1rem);

  --line-height-tight: 1.15;
  --line-height-base: 1.6;
  --line-height-loose: 1.8;

  --space-xs: 0.25rem;
  --space-sm: 0.5rem;
  --space-md: 1rem;
  --space-lg: 1.5rem;
  --space-xl: 2.5rem;
  --space-2xl: 4rem;
  --space-3xl: 6rem;
  --space-4xl: 8rem;

  --container-max: 82rem;
  --container-padding: 1.25rem;
  --container-narrow: 40rem;
  --hero-content-max: 38rem;
  --header-height: 4.5rem;
  --hero-min-height: clamp(18rem, 58vh, 26rem);
  --radius-sm: 0;
  --radius-md: 0;
  --shadow-sm: none;
  --transition: 0.25s ease;
}
