/**
 * @file
 * Main hero.
 *
 * Replaces the corresponding Olivero stylesheet.
 *
 * @see core/themes/olivero/css/components/hero.css
 */

.region--hero {
  color: var(--color--gray-45);
  background-color: var(--color--gray-97);
  font-size: clamp(30px, calc(5.35px + 6.57vw), 100px);
}

.hero__inner {
  padding-block: var(--sp2);
  padding-inline: clamp(2rem, calc(0.94rem + 4.51vw), 5rem);

  @media (min-width: 75rem) {
    padding-block: var(--sp5);
  }
}