:root {
  --varns-ink-950: #0f100e;
  --varns-charcoal-900: #181814;
  --varns-charcoal-800: #292a24;
  --varns-forest-900: #1f3522;
  --varns-forest-800: #29452b;
  --varns-green-700: #3f6f28;
  --varns-green-600: #568a32;
  --varns-green-500: #73ae59;
  --varns-orange-700: #a83f00;
  --varns-orange-600: #d85d00;
  --varns-orange-500: #f47a0a;
  --varns-earth-700: #6b4426;
  --varns-cream-100: #f4f2ea;
  --varns-cream-50: #faf9f5;
  --varns-white: #ffffff;
  --varns-muted-600: #66685f;
  --varns-muted-500: #77786f;
  --varns-border-200: #d8d5ca;
  --varns-border-dark: rgba(255, 255, 255, 0.14);

  --varns-font-display: "Barlow Condensed", "Bahnschrift Condensed", "Arial Narrow", Impact, sans-serif;
  --varns-font-body: Barlow, "Segoe UI", Arial, sans-serif;

  --varns-text-xs: clamp(0.78rem, 0.76rem + 0.1vw, 0.86rem);
  --varns-text-sm: clamp(0.9rem, 0.87rem + 0.12vw, 1rem);
  --varns-text-body: clamp(1rem, 0.96rem + 0.18vw, 1.13rem);
  --varns-text-lead: clamp(1.12rem, 1.04rem + 0.36vw, 1.36rem);
  --varns-text-h3: clamp(1.42rem, 1.24rem + 0.72vw, 2rem);
  --varns-text-h2: clamp(2.15rem, 1.52rem + 2.7vw, 4.2rem);
  --varns-text-h1: clamp(3rem, 1.62rem + 5.6vw, 6.7rem);

  --varns-container-reading: 48rem;
  --varns-container-standard: 76rem;
  --varns-container-wide: 91rem;
  --varns-gutter: clamp(1rem, 3.2vw, 4.25rem);
  --varns-section-sm: clamp(3.25rem, 5vw, 5.5rem);
  --varns-section-md: clamp(4.25rem, 7vw, 8rem);
  --varns-section-lg: clamp(5.25rem, 9vw, 10rem);
  --varns-gap-sm: clamp(0.75rem, 1.1vw, 1rem);
  --varns-gap-md: clamp(1.25rem, 2vw, 2rem);
  --varns-gap-lg: clamp(2rem, 4vw, 4.5rem);
  --varns-radius-sm: 0.2rem;
  --varns-radius-md: 0.45rem;
  --varns-radius-lg: 0.65rem;
  --varns-shadow-sm: 0 0.35rem 1.2rem rgba(17, 18, 15, 0.1);
  --varns-shadow-md: 0 1rem 2.4rem rgba(17, 18, 15, 0.16);
  --varns-transition-fast: 160ms ease;
  --varns-transition: 260ms ease;
  --varns-header-height: clamp(5.25rem, 8vw, 7.25rem);
}