[data-component="hero"] {
  --hero-bg: var(--color-page-bg);
  --hero-text: var(--color-text);
  --hero-muted: var(--color-text-muted);
  --hero-accent: var(--color-accent);
  --hero-heading-min: var(--text-hero-min);
  --hero-heading-max: var(--text-hero-max);
  --hero-control-radius: var(--radius-control);
}