:root {

  --color-bg:              #090909;
  --color-bg-hero:         #000000;
  --color-surface-1:       #101010;
  --color-surface-2:       #0D0D0D;
  --color-border-card:     rgba(255, 255, 255, 0.05);
  --color-border-tile:     #1A1A1A;
  --color-border-nav-btn:  #4D4D4D;

  --color-text:            #FFFFFF;
  --color-text-muted:      #7B7B7B;
  --color-text-soft:       #F2F2F2;
  --color-text-inverse:    #282828;
  --color-text-inverse-2:  #121212;
  --color-footer-copy:     #F0F1F4;

  --color-accent:          #A2FD5B;
  --color-accent-strong:   #7CB801;
  --color-accent-0:        rgba(162, 253, 91, 0);

  --color-pill-bg:         rgba(255, 255, 255, 0.08);

  --gradient-card:       linear-gradient(180deg, var(--color-surface-1) 0%, var(--color-surface-2) 100%);
  --gradient-card-fade:  linear-gradient(180deg, rgba(13, 13, 13, 0) 0%, #0D0D0D 100%);
  --gradient-btn-light:  linear-gradient(180deg, #B6B0A4 0%, #FFFFFF 100%);
  --gradient-tile:       linear-gradient(180deg, #454545 0%, #232323 100%);
  --gradient-text:       linear-gradient(180deg, #FFFFFF 0%, rgba(255, 255, 255, 0.8) 100%);
  --gradient-hero-fade:  linear-gradient(180deg, #000000 0%, var(--color-bg) 100%);

  --font-sans: "Cabin", "Cabin Cyrillic", "Open Sans", "Segoe UI", Roboto, sans-serif;
  --font-mono: "Geist Mono", "JetBrains Mono", Consolas, monospace;

  --fs-display: clamp(2rem, 1.376rem + 2.56vw, 4rem);
  --fs-h2:      clamp(1.5rem, 1.032rem + 1.92vw, 3rem);
  --fs-h3:      clamp(1.25rem, 1.172rem + 0.32vw, 1.5rem);
  --fs-body-lg: clamp(1rem, 0.961rem + 0.16vw, 1.125rem);
  --fs-btn:     clamp(1.125rem, 1.086rem + 0.16vw, 1.25rem);
  --fs-label:   clamp(0.75rem, 0.672rem + 0.32vw, 1rem);
  --fs-body:    1rem;
  --fs-nav:     0.875rem;

  --lh-display:  clamp(2.375rem, 1.6145rem + 3.12vw, 4.8125rem);
  --lh-h2:       clamp(1.9375rem, 1.333rem + 2.48vw, 3.875rem);
  --lh-h2-tight: clamp(1.8125rem, 1.247rem + 2.32vw, 3.625rem);
  --lh-h3:       clamp(1.5rem, 1.4025rem + 0.4vw, 1.8125rem);
  --lh-body-lg:  clamp(1.5rem, 1.4415rem + 0.24vw, 1.6875rem);
  --lh-btn:      clamp(1.36875rem, 1.3219rem + 0.192vw, 1.51875rem);
  --lh-body:     1.2125;
  --lh-nav:      1.2143;

  --ls-tight:   -0.02em;
  --ls-mono:    0.33px;
  --ls-btn:     0.015em;

  --fw-regular:  400;
  --fw-medium:   500;
  --fw-semibold: 600;

  --radius-btn:    0.75rem;
  --radius-tile:   0.875rem;
  --radius-nav:    1.125rem;
  --radius-card:   2rem;
  --radius-banner: 2.375rem;
  --radius-full:   999px;

  --shadow-tile: 0 1px 3px rgba(0, 0, 0, 0.38),
                 inset 0 -6px 0 #1B1B1B;
  --shadow-pill: inset 0 0.5px 0.5px rgba(255, 255, 255, 0.12),
                 inset 0 1px 3px rgba(255, 255, 255, 0.10),
                 inset 0 2px 8px rgba(255, 255, 255, 0.04),
                 0 0.5px 0.5px rgba(8, 1, 20, 0.03),
                 0 1px 1px -0.5px rgba(8, 1, 20, 0.03),
                 0 2px 2px -1px rgba(8, 1, 20, 0.03);

  --blur-nav: 10px;

  --container-width: 97.5rem;
  --container-pad:   clamp(1.25rem, 0.75rem + 2.05vw, 3.75rem);
  --section-gap:     clamp(4.6875rem, 3.615rem + 4.4vw, 8.125rem);
  --grid-gap:        0.9375rem;
  --card-pad:        1.875rem;

  --hero-pad-top: clamp(6.625rem, 5.962rem + 2.72vw, 8.75rem);
  --hero-fade-h:  clamp(10.0625rem, 6.572rem + 14.32vw, 21.25rem);
  --hero-overlap: clamp(9.4375rem, 4.9135rem + 18.56vw, 23.9375rem);

  --head-gap:    clamp(1.125rem, 1.047rem + 0.32vw, 1.375rem);
  --head-offset: clamp(1.875rem, 1.68rem + 0.8vw, 2.5rem);

  --transition-fast: 0.2s ease;
}