@font-face {
  font-family: "Geist";
  src: url("../fonts/Geist-Regular.woff2") format("woff2");
  font-display: swap;
  font-style: normal;
  font-weight: 400;
}

@font-face {
  font-family: "Geist";
  src: url("../fonts/Geist-SemiBold.woff2") format("woff2");
  font-display: swap;
  font-style: normal;
  font-weight: 600;
}

@font-face {
  font-family: "Geist Fallback";
  src: local("Arial");
  size-adjust: 100%;
  ascent-override: 92%;
}

:root {
  --background: 0 0% 100%;
  --foreground: 0 0% 7%;
  --card: 0 0% 98%;
  --muted: 0 0% 96%;
  --section-alt: 0 0% 96.5%;
  --muted-foreground: 0 0% 42%;
  --border: 0 0% 90%;
  --border-strong: 0 0% 56%;
  --grid-line: 0 0% 94%;
  --dot: 220 13% 91%;
  --surface-deep: 30 8% 9%;
  --surface-deep-border: 30 6% 20%;
  --muted-warm: 35 12% 70%;
  --state-negative: 0 72% 51%;
  --state-negative-text: 0 72% 42%;
  --state-negative-on-dark: 0 85% 70%;
  --accent-rating: 44 97% 50%;
  --accent-rating-stroke: 38 92% 33%;

  --brand-plum: 328 62% 35%;
  --accent-conversion: 328 62% 32%;
  --cta-accent: var(--accent-conversion);
  --accent-hover: 328 66% 26%;
  --on-accent: 0 0% 100%;
  --accent-glow: 328 62% 32% / 0.15;
  --accent-on-dark: 318 60% 74%;
  --accent-on-dark-hover: 318 60% 82%;
  --on-accent-dark: 328 84% 10%;
  --accent-glow-dark: 318 60% 74% / 0.18;

  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: clamp(1rem, 0.978rem + 0.094vw, 1.0625rem);
  --text-lg: clamp(1.125rem, 1.081rem + 0.188vw, 1.25rem);
  --text-xl: clamp(1.25rem, 1.162rem + 0.376vw, 1.5rem);
  --text-2xl: clamp(1.5rem, 1.368rem + 0.563vw, 1.875rem);
  --text-3xl: clamp(1.5rem, 1.236rem + 1.127vw, 2.25rem);
  --text-display: clamp(2.25rem, 1.722rem + 2.254vw, 3.75rem);
  --text-h1: clamp(2rem, 1.648rem + 1.502vw, 3rem);
  --text-stat: clamp(2rem, 1.56rem + 1.878vw, 3.25rem);
  --measure-headline: 48rem;
  --measure-lede: 36rem;
  --measure-prose: 68ch;

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-14: 56px;
  --space-16: 64px;
  --space-20: 80px;
  --space-24: 96px;
  --space-32: 128px;
  --section-y: clamp(4rem, 3.296rem + 3.005vw, 6rem);
  --section-y-lg: clamp(5rem, 3.944rem + 4.507vw, 8rem);
  --panel-gutter: clamp(1rem, 0.824rem + 0.751vw, 1.5rem);
  --head-gap: clamp(2.5rem, 2.236rem + 1.127vw, 3.5rem);

  --container: 1200px;
  --container-intro: 1152px;
  --container-faq: 896px;

  --radius-panel: 24px;
  --radius-card: 16px;
  --radius-tile: 12px;
  --radius-pill: 9999px;

  --shadow-header: 0 1px 2px hsl(30 8% 9% / 0.06), 0 4px 12px hsl(30 8% 9% / 0.04);
  --shadow-card-hover: 0 4px 16px hsl(0 0% 7% / 0.06);
  --shadow-feature-hover: 0 25px 60px -15px hsl(30 8% 9% / 0.45);
  --shadow-dropdown: 0 12px 32px -8px hsl(0 0% 7% / 0.14);
  --shadow-modal: 0 12px 40px hsl(0 0% 7% / 0.18);

  --z-base: 0;
  --z-raised: 1;
  --z-sticky: 20;
  --z-header: 40;
  --z-dropdown: 50;
  --z-menu: 60;
  --z-consent: 70;
  --z-toast: 80;
  --z-skip: 90;

  --bp-sm: 640px;
  --bp-md: 768px;
  --bp-lg: 1024px;
  --bp-nav: 1200px;
  --bp-xl: 1440px;

  --dur-press: 120ms;
  --dur-fast: 160ms;
  --dur-base: 200ms;
  --dur-sheet: 280ms;
  --dur-exit: 160ms;
  --dur-word: 2800ms;
  --dur-word-swap: 320ms;
  --dur-marquee-logos: 40s;
  --dur-marquee-quotes: 60s;

  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
  --ease-drawer: cubic-bezier(0.32, 0.72, 0, 1);
  --ease-linear: linear;
}

[data-surface="dark"], [data-surface="deep"] {
  --background: 0 0% 7%;
  --foreground: 0 0% 100%;
  --card: 0 0% 11%;
  --muted: 0 0% 14%;
  --muted-foreground: 35 12% 70%;
  --border: 30 6% 20%;
  --border-strong: 0 0% 46%;
  --accent-conversion: var(--accent-on-dark);
  --accent-hover: var(--accent-on-dark-hover);
  --on-accent: var(--on-accent-dark);
  --accent-glow: var(--accent-glow-dark);
  --state-negative: 0 85% 70%;
  --state-negative-text: 0 85% 70%;
}

[data-surface="deep"] { --background: 30 8% 9%; }

:root {
  font-family: "Geist", "Geist Fallback", system-ui, sans-serif;
}

body {
  background: hsl(var(--background));
  color: hsl(var(--foreground));
}

:focus-visible {
  outline: 2px solid hsl(var(--accent-conversion));
  outline-offset: 3px;
  box-shadow: 0 0 0 2px hsl(var(--background));
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-press: 0ms;
    --dur-fast: 0ms;
    --dur-base: 0ms;
    --dur-sheet: 0ms;
    --dur-exit: 0ms;
    --dur-word: 0ms;
    --dur-word-swap: 0ms;
    --dur-marquee-logos: 0ms;
    --dur-marquee-quotes: 0ms;
  }
}
