.maintenance-schedule-page {
  background-color: var(--color-surface-subtle);
}

.maintenance-schedule-page__hero {
  min-height: 35rem;
  padding-bottom: 2.75rem;
  background-color: #2b1d0b;
}

@media (min-width: 600px) {
  .maintenance-schedule-page__hero {
    min-height: 35.5rem;
    padding-bottom: 3.25rem;
  }
}

@media (min-width: 900px) {
  .maintenance-schedule-page__hero {
    min-height: 34.75rem;
    padding-bottom: 3.75rem;
  }
}

.maintenance-schedule-page__hero .gradient-hero__image {
  object-position: 67% center;
}

@media (min-width: 600px) {
  .maintenance-schedule-page__hero .gradient-hero__image {
    object-position: 58% center;
  }
}

@media (min-width: 900px) {
  .maintenance-schedule-page__hero .gradient-hero__image {
    object-position: center;
  }
}

.maintenance-schedule-page__hero .gradient-hero__scrim {
  background-image: linear-gradient(
    180deg,
    rgb(25 16 5 / 18%) 0%,
    rgb(27 18 7 / 58%) 100%
  );
}

.maintenance-schedule-page__hero .gradient-hero__scrim::before {
  background-image: linear-gradient(
    90deg,
    rgb(25 17 7 / 94%) 0%,
    rgb(51 31 8 / 78%) 38%,
    rgb(84 49 8 / 28%) 66%,
    transparent 88%
  );
  opacity: 1;
}

@media (min-width: 900px) {
  .maintenance-schedule-page__hero .gradient-hero__scrim {
    background-image: linear-gradient(
      180deg,
      rgb(25 16 5 / 6%) 0%,
      rgb(27 18 7 / 22%) 100%
    );
  }
}

@media (min-width: 900px) {
  .maintenance-schedule-page__hero .gradient-hero__scrim::before {
    background-image: linear-gradient(
      90deg,
      rgb(25 17 7 / 42%) 0%,
      rgb(51 31 8 / 24%) 42%,
      transparent 78%
    );
  }
}

.maintenance-schedule-page__hero .gradient-hero__inner {
  width: min(100%, 88rem);
  padding-inline: clamp(1rem, 4vw, 3rem);
}

@media (min-width: 900px) {
  .maintenance-schedule-page__hero .gradient-hero__inner {
    align-items: start;
    grid-template-columns: 8.5rem minmax(0, 1fr);
    gap: 2rem;
  }
}

.maintenance-schedule-page__hero .gradient-hero__content {
  max-width: 48rem;
}

.maintenance-schedule-page__hero .gradient-hero__title {
  max-width: 16ch;
  font-weight: 600;
}

@media (min-width: 900px) {
  .maintenance-schedule-page__hero .gradient-hero__title {
    font-size: clamp(3rem, 3.25vw, 3.25rem);
    letter-spacing: -0.03em;
  }
}

.maintenance-schedule-page__hero .gradient-hero__body {
  max-width: 44rem;
}

@media (min-width: 900px) {
  .maintenance-schedule-page__hero .gradient-hero__body {
    font-size: 1.375rem;
    line-height: 1.36;
  }
}

.maintenance-schedule-page__hero .gradient-hero__cta {
  min-width: 12rem;
}

.maintenance-schedule-page .action-showcase {
  background-color: var(--color-surface-subtle);
}