/* Component rules and breakpoint overrides; legacy selectors are retained. */
:root {
  --black: #000000;
  --white: #ffffff;
  --red: #ed1c24;

  --link-hover: #fe989c;

  --line: color-mix(in srgb, var(--white) 20%, transparent);
  --muted: color-mix(in srgb, var(--white) 60%, transparent);

  --red-surface: color-mix(in srgb, var(--red) 10%, transparent);

  --content-max: 1600px;
  --hero-media-max: 2560px;
  --gutter: 52px;
  --font: 'Tenor Sans', Arial, sans-serif;
  --ease: 220ms ease;
}
@media (max-width: 600px) {
:root {
    --gutter: 12px;
  }
}