/* Design tokens */

:root {
  --color-bg: #050505;
  --color-surface: #0f100d;
  --color-surface-hover: #11120f;
  --color-surface-soft: #161511;
  --color-text: #f4efe5;
  --color-muted: #ded7c5;
  --color-line: #2b2924;
  --color-grid: rgba(43, 41, 36, 0.9);
  --color-header-bg: rgba(5, 5, 5, 0.94);
  --color-header-bg-strong: rgba(5, 5, 5, 0.96);
  --color-dialog-backdrop: rgba(16, 15, 13, 0.55);
  --color-rule-subtle: rgba(222, 215, 197, 0.22);
  --color-game-stack-glow: rgba(48, 229, 208, 0.85);
  --color-game-stack-glow-soft: rgba(48, 229, 208, 0.48);
  --shadow-card-hover: 0 18px 42px rgba(0, 0, 0, 0.26);
  --focus-outline: 1px solid var(--color-muted);
  --focus-outline-offset: 4px;
  --accent-alteryx-blue: #2563eb;
  --accent-alteryx-cyan: #06b6d4;
  --accent-alteryx-green: #10b981;
  --accent-alteryx-lime: #84cc16;
  --accent-alteryx-purple: #8b5cf6;
  --accent-alteryx-pink: #ec4899;
  --accent-alteryx-amber: #f59e0b;
  --accent-alteryx-orange: #f97316;
  --accent-alteryx-success: #16a34a;
  --accent-vuse-red: #f61b2e;
  --accent-vuse-yellow: #f7bf22;
  --accent-vuse-orange: #ff7b2b;
  --font-sans: "Inter", "Helvetica Neue", Arial, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-serif: "GFS Didot", Didot, "Bodoni 72", "Times New Roman", serif;
  --font-logo: "Bodoni Moda", "Bodoni 72", Didot, "Times New Roman", serif;
  --font-copy-serif: "Cormorant Garamond", Garamond, "Adobe Garamond Pro", Georgia, "Times New Roman", serif;
  --weight-display: 400;
  --weight-label: 800;
  --tracking-label: 0.16em;
  --tracking-kicker: 0.1em;
  --tracking-case-eyebrow: 0.2em;
  --tracking-case-section-kicker: 0.01em;
  --tracking-case-field-label: 0.18em;
  --tracking-case-field-value: 0.06em;
  --tracking-chip: 0.1em;
  --leading-display-tight: 0.95;
  --leading-title: 1;
  --leading-heading: 0.97;
  --leading-home-section-heading: var(--leading-heading);
  --leading-home-closing-heading: 1.02;
  --leading-home-hero-meta: 1.22;
  --leading-home-hero-statement: 1.42;
  --leading-project-section-heading: 1.18;
  --leading-project-summary: 1.38;
  --leading-project-nav: 1.2;
  --leading-caption: 1.2;
  --leading-system-card: 1.22;
  --leading-system-step: 1.24;
  --leading-artifact-label: 1.1;
  --leading-meta-value: 1.28;
  --leading-card: 1;
  --leading-card-heading: 1.05;
  --leading-label: 14px;
  --leading-nav: 17px;
  --leading-summary: 1.3;
  --leading-body: 1.27;
  --leading-copy: 1.27;
  --type-display: clamp(68px, 9vw, 128px);
  --type-page-title: clamp(48px, 5.4vw, 74px);
  --type-section-heading: clamp(40px, 4.4vw, 64px);
  --type-closing-heading: clamp(34px, 3.3vw, 52px);
  --type-project-heading: clamp(30px, 2.5vw, 38px);
  --type-card-heading: clamp(25px, 2.25vw, 30px);
  --type-project-title: clamp(42px, 4.7vw, 64px);
  --type-project-section-heading: clamp(24px, 2vw, 32px);
  --type-project-summary: clamp(19px, 1.55vw, 22px);
  --type-project-body: clamp(17px, 1.25vw, 20px);
  --type-home-section-heading: var(--type-section-heading);
  --type-home-closing-heading: var(--type-closing-heading);
  --type-home-hero-meta: clamp(16px, 1.3vw, 19px);
  --type-home-hero-statement: clamp(22px, 1.8vw, 25px);
  --type-system-card: clamp(16px, 1.2vw, 19px);
  --type-system-step: clamp(15px, 1.1vw, 17px);
  --type-artifact-label: clamp(15px, 1.05vw, 18px);
  --type-case-nav: 13px;
  --type-case-eyebrow: 11px;
  --type-case-section-kicker: 21px;
  --type-case-field-label: 9px;
  --type-case-field-value: 11px;
  --type-project-nav: 14px;
  --type-project-label: var(--type-case-section-kicker);
  --type-project-meta: var(--type-case-field-label);
  --type-body-large: clamp(21px, 2vw, 24px);
  --type-body: clamp(18px, 1.65vw, 21px);
  --type-link: clamp(24px, 2.3vw, 30px);
  --type-nav: 13px;
  --type-logo: 30px;
  --type-label: 11px;
  --type-caption: var(--type-label);
  --type-button: 13px;
  --type-ui-xs: 10px;
  --type-ui-sm: 12px;
  --type-control-lg: 30px;
  --type-display-xl: var(--type-display);
  --type-display-lg: var(--type-display);
  --type-display-md: var(--type-page-title);
  --type-heading-xl: var(--type-section-heading);
  --type-heading-lg: var(--type-section-heading);
  --type-heading-md: var(--type-page-title);
  --type-heading-sm: var(--type-section-heading);
  --type-heading-xs: var(--type-project-heading);
  --type-title-lg: var(--type-card-heading);
  --type-title-md: var(--type-card-heading);
  --type-title-sm: var(--type-card-heading);
  --type-body-lg: var(--type-body-large);
  --type-body-md: var(--type-body);
  --type-body-sm: var(--type-body);
  --type-link-lg: var(--type-link);
  --type-brand: var(--type-logo);
  --type-meta: var(--type-label);
  --type-small: var(--type-label);
  --type-kicker: var(--type-label);
  --page-grid-max: 1440px;
  --page-grid-margin: clamp(24px, 4.2vw, 64px);
  --page-grid-gap: clamp(16px, 1.6vw, 24px);
  --space-heading-row-gap: 24px;
  --space-heading-content-gap: clamp(72px, 6.4vw, 92px);
  --space-heading-content-gap-mobile: 40px;
  --brand-mark-size: 44px;
  --brand-mark-height: 21px;
  --header-padding-block: 16px;
  --header-padding-inline: clamp(16px, 3vw, 40px);
  --header-height: calc(var(--brand-mark-height) + var(--header-padding-block) * 2 + 1px);
  --border-line: 1px solid var(--color-line);
  --border-ink: 1px solid var(--color-text);
  --z-background: 0;
  --z-header: 10;
  --z-raised: 1;
  --duration-fast: 180ms;
  --duration-hover: 240ms;
  --duration-medium: 320ms;
  --duration-art: 420ms;
  --duration-hero-rule: 560ms;
  --duration-hero-copy: 640ms;
  --duration-slow: 1180ms;
  --duration-grid: 2250ms;
  --delay-hero-rule: 1080ms;
  --delay-hero-copy: 1160ms;
  --reveal-delay: 0ms;
  --ease-standard: ease;
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-grid: cubic-bezier(0.25, 0.25, 0.72, 1);
}