@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;600&family=Space+Grotesk:wght@400;700&display=swap');
:root {
  --color-paper: oklch(95% 0.012 230); --color-paper-2: oklch(89% 0.025 230); --color-ink: oklch(18% 0.022 235);
  --color-muted: oklch(42% 0.028 235); --color-rule: oklch(72% 0.035 230); --color-accent: oklch(43% 0.08 225);
  --color-accent-deep: oklch(27% 0.06 225); --color-focus: oklch(54% 0.12 225); --color-accent-ink: oklch(96% 0.01 230);
  --font-display: 'Space Grotesk', sans-serif; --font-body: 'IBM Plex Sans', sans-serif;
  --space-xs:.5rem; --space-sm:.75rem; --space-md:1rem; --space-lg:1.5rem; --space-xl:2.5rem; --space-2xl:4rem; --space-3xl:6rem; --space-4xl:9rem;
  --text-xs:.75rem; --text-sm:.875rem; --text-base:1rem; --text-md:1.25rem; --text-lg:1.5625rem; --text-xl:1.953rem; --text-display:clamp(3.25rem,11vw,6rem);
  --ease-out:cubic-bezier(.16,1,.3,1); --ease-in:cubic-bezier(.7,0,.84,0); --ease-in-out:cubic-bezier(.65,0,.35,1); --dur-micro:120ms; --dur-short:220ms; --dur-long:420ms;
  --rule-hair:1px; --rail-width:3.25rem; --radius-card:.25rem; --radius-pill:999px; --page-max:88rem; --page-gutter:clamp(1rem,4vw,3rem); --z-sticky:200; --z-sticky-nav:220; --banner-height:0px;
}