:root {
  --tradir-hero-background:
    radial-gradient(circle at 14% 5%, rgba(32, 107, 196, .10), transparent 29%),
    radial-gradient(circle at 90% 16%, rgba(15, 118, 110, .08), transparent 26%),
    linear-gradient(180deg, #fbfdff 0%, #fff 74%);
  --tradir-hero-art-width: 340px;
  --tradir-hero-art-height: 280px;
  --tradir-hero-art-right: -45px;
  --tradir-hero-art-top: -28px;
  --tradir-hero-art-opacity: .09;
}

.public-hero-surface {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: var(--tradir-hero-background);
}

.public-hero-surface::after {
  content: "";
  position: absolute;
  z-index: 0;
  width: var(--tradir-hero-art-width);
  height: var(--tradir-hero-art-height);
  right: var(--tradir-hero-art-right);
  top: var(--tradir-hero-art-top);
  background-image: url("/assets/img/kiwi-hero.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  opacity: var(--tradir-hero-art-opacity);
  pointer-events: none;
}

.public-hero-surface > .tradir-container {
  position: relative;
  z-index: 1;
}

.catalog-hero {
  --tradir-hero-art-width: 260px;
  --tradir-hero-art-height: 215px;
  --tradir-hero-art-right: -35px;
  --tradir-hero-art-top: -12px;
}

.maintenance-page {
  min-height: calc(100vh - 74px);
  padding: 72px 0;
}

.maintenance-wrap {
  max-width: 610px;
}

.maintenance-card {
  padding: 38px 40px;
  text-align: center;
}

.maintenance-brand {
  justify-content: center;
  margin-bottom: 24px;
}

.maintenance-card h1 {
  margin: 0 0 10px;
  font-size: 32px;
  letter-spacing: -.035em;
}

.maintenance-card p {
  max-width: 440px;
  margin: 0 auto;
  color: var(--tradir-muted);
  font-size: 15px;
  line-height: 1.6;
}

@media (max-width: 720px) {
  .public-hero-surface {
    --tradir-hero-art-width: 190px;
    --tradir-hero-art-height: 160px;
    --tradir-hero-art-right: -55px;
    --tradir-hero-art-top: 5px;
    --tradir-hero-art-opacity: .075;
  }

  .maintenance-page {
    min-height: calc(100vh - 64px);
    padding: 45px 0;
  }

  .maintenance-card {
    padding: 30px 22px;
  }
}