:root {
  --red: #e50914;
  --red-2: #ff2b35;
  --red-deep: #9d0008;

  --bg: #0b0b0b;
  --alt: #050505;
  --surface: #151515;
  --surface-2: #1d1d1d;
  --ink: #f7f7f5;
  --ink-soft: #d0d0d0;
  --ink-mute: #9e9e9e;
  --line: #2a2a2a;
  --line-2: #3d3d3d;
  --accent-text: #ff4d55;
  --band-bg: #f7f7f5;
  --band-ink: #0b0b0b;
  --grid-line: rgba(255, 255, 255, .05);
  --bar-bg: rgba(8, 8, 8, .86);
  --footer-bg: #050505;

  --display: Inter, system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
  --sans: Inter, system-ui, -apple-system, "Segoe UI", Arial, sans-serif;

  --max: 1240px;
  --bar-h: 74px;
  --gutter: max(24px, calc((100vw - var(--max)) / 2));
  --ease: cubic-bezier(.22, 1, .36, 1);
  --ease-io: cubic-bezier(.65, 0, .35, 1);

  --fs-hero: clamp(46px, 7.2vw, 104px);
  --fs-h2: clamp(34px, 5vw, 62px);
  --fs-h3: clamp(20px, 2vw, 26px);
  --fs-body: 16px;
  --fs-lead: clamp(16px, 1.35vw, 19px);
}

@media (max-width: 860px) {
  :root {
    --bar-h: 62px;
    --gutter: 20px;
  }
}