/* Allergien hero: supplied image and more breathing room below the menu. */
.allergy-hero {
  background: #f7f2e9 url("../img/allergy-hero-new.webp") right center / cover no-repeat !important;
  min-height: calc(clamp(700px, 42.9vw, 821px) + 150px) !important;
  aspect-ratio: auto !important;
}

.allergy-hero__artwork {
  display: none !important;
}

.allergy-hero .hero-copy {
  top: 15% !important;
}

/* Supplied symptom artwork, in the requested card order. */
.symptom-grid .symptom-card .symptom-icon-wrap {
  width: clamp(92px, 7.2vw, 138px) !important;
  height: clamp(92px, 7.2vw, 138px) !important;
  min-width: 0 !important;
  min-height: 0 !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: contain !important;
}

.symptom-grid .symptom-card .symptom-icon-wrap svg {
  display: none !important;
}

.symptom-grid .symptom-card:nth-child(1) .symptom-icon-wrap {
  background-image: url("../img/allergy-symptom-niesen.webp") !important;
}

.symptom-grid .symptom-card:nth-child(2) .symptom-icon-wrap {
  background-image: url("../img/allergy-symptom-laufende-nase.webp") !important;
}

.symptom-grid .symptom-card:nth-child(3) .symptom-icon-wrap {
  background-image: url("../img/allergy-symptom-juckende-augen.webp") !important;
}

.symptom-grid .symptom-card:nth-child(4) .symptom-icon-wrap {
  background-image: url("../img/allergy-symptom-husten-atemnot.webp") !important;
}

.symptom-grid .symptom-card:nth-child(5) .symptom-icon-wrap {
  background-image: url("../img/allergy-symptom-engegefuehl.webp") !important;
}

/* Symptome: balanced 3 + 2 card rows with centered artwork. */
.symptom-grid {
  align-items: stretch !important;
}

.symptom-grid .symptom-card,
.symptom-grid .symptom-card:nth-child(4),
.symptom-grid .symptom-card:nth-child(5) {
  height: clamp(176px, 10.6vw, 204px) !important;
  min-height: 176px !important;
  padding: 14px 12px 22px !important;
  background: #faf8f2 !important;
  box-sizing: border-box !important;
}

.symptom-grid .symptom-card .symptom-icon-wrap {
  position: absolute !important;
  top: 44% !important;
  left: 50% !important;
  margin: 0 !important;
  animation: none !important;
  transform: translate(-50%, -50%) !important;
  mix-blend-mode: multiply;
}

.symptom-grid .symptom-card .symptom-label {
  position: absolute !important;
  right: 12px !important;
  bottom: 18px !important;
  left: 12px !important;
  margin: 0 !important;
}

@media (min-width: 1051px) {
  .about-allergies {
    min-height: clamp(560px, 38vw, 730px) !important;
    aspect-ratio: auto !important;
  }
}

@media (max-width: 1050px) {
  .allergy-hero {
    padding-top: 105px !important;
    padding-bottom: 560px !important;
    min-height: 0 !important;
    background-position: 72% bottom !important;
  }

  .allergy-hero .hero-copy {
    top: auto !important;
  }
}

@media (max-width: 620px) {
  .allergy-hero {
    padding-top: 88px !important;
    padding-bottom: 440px !important;
  }

  .symptom-grid .symptom-card .symptom-icon-wrap {
    width: 112px !important;
    height: 112px !important;
  }

  .symptom-grid .symptom-card,
  .symptom-grid .symptom-card:nth-child(4),
  .symptom-grid .symptom-card:nth-child(5) {
    height: 180px !important;
    min-height: 180px !important;
  }
}
.allergy-care-card__icon {
  animation: none !important;
  filter: none !important;
  opacity: 1 !important;
  transform: none !important;
}
.allergy-care-card:hover .allergy-care-card__icon,
.allergy-care-card:focus-visible .allergy-care-card__icon {
  filter: none !important;
  opacity: 1 !important;
  transform: none !important;
}

/* Behandlung & Therapie: mask the duplicate content baked into the
   section artwork, without creating visible beige boxes. */
.allergy-care__therapy-heading::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  z-index: 0 !important;
  inset: -18px -52px -22px -22px !important;
  border-radius: 0 !important;
  background: radial-gradient(
    ellipse at 32% 50%,
    rgba(250, 248, 242, 1) 0 72%,
    rgba(250, 248, 242, 0.98) 82%,
    rgba(250, 248, 242, 0) 100%
  ) !important;
  pointer-events: none !important;
}

.allergy-care__cards-cover {
  display: block !important;
  background: rgba(250, 248, 242, 0.985) !important;
  border: 0 !important;
  border-radius: 0 !important;
  inset: 50.5% 2.2% 0.8% 2.2% !important;
  pointer-events: none !important;
}

.allergy-care-card {
  background: transparent !important;
  box-shadow: none !important;
}

.allergy-care-card:hover,
.allergy-care-card:focus-visible {
  background: transparent !important;
  box-shadow: none !important;
}

@media (max-width: 1050px) {
  .allergy-care__therapy-heading::before,
  .allergy-care__cards-cover {
    display: none !important;
  }
}

/* More breathing room below the Warum KLS subtitle. */
.allergy-why__heading > span {
  margin-bottom: clamp(28px, 2.4vw, 46px) !important;
}

@media (min-width: 1051px) {
  .allergy-why__photo,
  .allergy-why__features {
    top: 22.5% !important;
  }

  .allergy-why__photo {
    height: 38.35% !important;
  }

  .allergy-why__features {
    height: 37.3% !important;
  }
}
