/* Palette: edit these semantic colors to restyle the entire site. */
:root {
  color-scheme: dark;
  --canvas: #0b0c0e;
  --hero-canvas: #0b0c0e;
  --surface: #16181b;
  --text: #f1f2f2;
  --muted: #a4a8ac;
  --accent: #50555b;
  --accent-bright: #c7cbce;
  --line: #2d3034;
  --nav-bg: #0b0c0ef2;
  --mesh: #50555b;
  --mesh-deep: #33373b;
  --overlay: #060708e8;
  --hero-text: #f1f2f2;
  --hero-muted: #a4a8ac;
  --hero-line: #45494e;
  --hero-accent: #b4b9bd;
  --transparent: transparent;
  /* Type: system fonts only; sizes respond without a build step. */
  --font: "Helvetica Neue", Helvetica, Arial, sans-serif;
  --mono: "Helvetica Neue", Helvetica, Arial, sans-serif;
  --text-xs: 0.8125rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-lead: clamp(1.125rem, 2vw, 1.375rem);
  --text-h3: clamp(1.375rem, 3vw, 1.875rem);
  --text-h2: clamp(2rem, 4.8vw, 3.75rem);
  --text-title: clamp(2.75rem, 6vw, 5.25rem);
  --text-hero: clamp(3.25rem, 9vw, 7.75rem);
  --weight-light: 500;
  --weight-normal: 400;
  --weight-medium: 500;
  --weight-bold: 600;
  --leading-tight: 1.05;
  --leading-heading: 1.15;
  --leading-body: 1.7;
  --tracking-tight: -0.055em;
  --tracking-label: 0.08em;
  /* Spacing, dimensions, and rules: use these in main.css. */
  --zero: 0;
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;
  --space-9: 6rem;
  --space-10: 8rem;
  --gutter: clamp(1.25rem, 5vw, 4rem);
  --section-space: clamp(3rem, 6vw, 5rem);
  --content-width: 75rem;
  --copy-width: 45rem;
  --hero-copy: 58rem;
  --nav-height: 5rem;
  --control-size: 2.75rem;
  --rule: 1px;
  --focus-width: 2px;
  --focus-offset: 5px;
  --radius: 100vmax;
  --pill: 100vmax;
  --reveal-offset: 20px;
  --drift-x: 1.25rem;
  --drift-y: -0.75rem;
  --duration-fast: 180ms;
  --duration-reveal: 600ms;
  --duration-drift: 16000ms;
  --ease: cubic-bezier(0.2, 0.65, 0.3, 1);
  --hero-height: 50rem;
  --hero-min-height: 42rem;
  --hero-graphic: 49rem;
  --hero-graphic-mobile: 30rem;
  --hero-graphic-offset: -13rem;
  --hero-graphic-top: 5rem;
  --hero-graphic-top-mobile: 9rem;
  --grid-size: 3rem;
  --dialog-width: 68rem;
}
