/* AIdoesAI design tokens. Source of truth with tokens.json.
   Import this file. Do not copy hex values into components. */

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

@font-face {
  font-family: "Geist Mono";
  src: url("./fonts/GeistMono-Variable.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

:root {
  color-scheme: light;

  --font-sans: "Geist", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-mono: "Geist Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;

  --color-canvas: #ffffff;
  --color-band: #f6f6f8;
  --color-ink: #121214;
  --color-muted: #5c5c62;
  --color-hairline: #d8d8dc;
  --color-accent: #0e5ad4;
  --color-accent-hover: #0a4bb3;
  --color-cta: #121214;
  --color-cta-text: #ffffff;
  --color-focus: #0e5ad4;
  --color-success: #0f7b3a;
  --color-warning: #b45309;
  --color-danger: #c23030;

  --space-1: 8px;
  --space-2: 16px;
  --space-3: 24px;
  --space-4: 32px;
  --space-5: 48px;
  --space-6: 64px;
  --space-7: 80px;
  --space-8: 96px;
  --space-9: 128px;

  --radius-control: 8px;
  --radius-control-lg: 12px;
  --radius-pill: 980px;
  --radius-card: 0px;

  --width-text: 680px;
  --width-content: 1080px;
  --width-wide: 1200px;
  --nav-height: 48px;

  --duration-fast: 120ms;
  --duration-base: 200ms;
  --duration-slow: 280ms;
  --ease-standard: cubic-bezier(0.25, 0.1, 0.25, 1);

  --text-display: 56px;
  --text-display-leading: 1.05;
  --text-display-tracking: -0.03em;
  --text-title: 40px;
  --text-title-leading: 1.1;
  --text-title-tracking: -0.025em;
  --text-headline: 28px;
  --text-headline-leading: 1.15;
  --text-headline-tracking: -0.02em;
  --text-callout: 21px;
  --text-callout-leading: 1.38;
  --text-callout-tracking: -0.012em;
  --text-body: 17px;
  --text-body-leading: 1.47;
  --text-body-tracking: 0em;
  --text-caption: 12px;
  --text-caption-leading: 1.33;
  --text-caption-tracking: 0.01em;
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
}

[data-theme="dark"] {
  color-scheme: dark;

  --color-canvas: #0c0c0e;
  --color-band: #161618;
  --color-ink: #f5f5f7;
  --color-muted: #a1a1a6;
  --color-hairline: #3a3a3e;
  --color-accent: #5b9cff;
  --color-accent-hover: #7eb0ff;
  --color-cta: #f5f5f7;
  --color-cta-text: #121214;
  --color-focus: #5b9cff;
  --color-success: #3dbe6a;
  --color-warning: #f5a524;
  --color-danger: #ff6b6b;
}

@media (max-width: 734px) {
  :root {
    --text-display: 40px;
    --text-title: 32px;
    --text-headline: 24px;
    --text-callout: 19px;
  }
}