/* 404 page: gradient band with decorative globe line-art + USPs/CTA below. */

.error-404__top {
  position: relative;
  overflow: hidden;
  padding-block: var(--space-8);
  text-align: center;
  color: var(--color-on-band);
  background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-secondary) 100%);
}

.error-404__globe {
  position: absolute;
  top: -80px;
  width: 500px;
  height: 500px;
  opacity: 0.8;
  pointer-events: none;
  display: none;
}

.error-404__globe--left {
  left: -160px;
}

.error-404__globe--right {
  right: -160px;
}

@media (min-width: 1025px) {
  .error-404__globe {
    display: block;
  }
}

.error-404__eyebrow {
  position: relative;
  font-size: var(--text-lg);
  color: rgba(255, 255, 255, 0.85);
  margin: 0 0 var(--space-3);
}

.error-404__heading {
  position: relative;
  font-size: var(--text-h1);
  margin: 0;
  color: var(--color-on-band); /* white on the band — overrides the global h1 color */
}

.error-404__bottom .feature-strip {
  margin-bottom: var(--space-6);
}

.error-404__button {
  display: flex;
  justify-content: center;
}