/* Hallmark · studied DNA: Vention product-led clarity + KUKA signal energy + Atlas Copco enterprise structure */

@font-face {
  font-family: "IBM Plex Sans";
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url("assets/fonts/ibm-plex-sans-latin.woff2") format("woff2");
}

:root {
  --color-paper: oklch(99% 0.006 255);
  --color-paper-2: oklch(97% 0.014 245);
  --color-paper-3: oklch(94% 0.024 245);
  --color-ink: oklch(22% 0.032 260);
  --color-ink-2: oklch(33% 0.032 260);
  --color-neutral: oklch(38% 0.025 260);
  --color-muted: oklch(42% 0.022 260);
  --color-rule: oklch(87% 0.025 245);
  --color-rule-2: oklch(75% 0.035 245);
  --color-accent: oklch(53% 0.18 258);
  --color-accent-deep: oklch(43% 0.16 258);
  --color-accent-soft: oklch(95% 0.05 245);
  --color-accent-ink: oklch(99% 0.006 255);
  --color-signal: oklch(76% 0.17 62);
  --color-signal-deep: oklch(50% 0.18 48);
  --color-signal-ink: oklch(24% 0.035 55);
  --color-graphite: oklch(18% 0.028 260);
  --color-graphite-ink: oklch(96% 0.01 255);
  --color-focus: oklch(43% 0.16 258);
  --color-error: oklch(55% 0.19 28);
  --color-success: oklch(50% 0.13 152);
  --color-transparent: oklch(100% 0 0 / 0%);
  --color-shadow: oklch(18% 0.028 260 / 14%);
  --color-image-wash: oklch(63% 0.12 245 / 10%);

  --font-display: "IBM Plex Sans", Arial, sans-serif;
  --font-body: "IBM Plex Sans", Arial, sans-serif;
  --font-mono: "IBM Plex Sans", Arial, sans-serif;

  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;
  --space-28: 7rem;
  --page-gutter: clamp(1rem, 4vw, 4.5rem);
  --section-space: clamp(4.5rem, 8vw, 8rem);

  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-md: clamp(1.0625rem, 1vw, 1.1875rem);
  --text-lg: clamp(1.25rem, 2vw, 1.625rem);
  --text-xl: clamp(1.75rem, 3.2vw, 3rem);
  --text-display: clamp(2.65rem, 5.5vw, 5.75rem);

  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in: cubic-bezier(0.7, 0, 0.84, 0);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-instant: 100ms;
  --dur-short: 180ms;
  --dur-medium: 280ms;
  --dur-long: 640ms;
  --ease-reveal: cubic-bezier(0.22, 1, 0.36, 1);

  --rule-hair: 1px;
  --rule-strong: 2px;
  --radius-xs: 0.25rem;
  --radius-sm: 0.5rem;
  --radius-md: 0.75rem;
  --radius-pill: 999px;
  --shadow-soft: 0 1.25rem 3rem var(--color-shadow);
  --content-wide: 90rem;
  --content-reading: 48rem;
}