/* Exact supplied hero artwork. */
.asthma-page .asthma-hero {
  background-color: #faf6ee !important;
  background-image: url("../img/asthma-hero-background-v27.webp") !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-size: cover !important;
}

.asthma-page .asthma-hero__reference,
.asthma-page .asthma-hero__live-cover,
.asthma-page .asthma-hero__flora { display: none !important; }

.allergy-page .allergy-hero {
  background-color: #faf6ee !important;
  background-image: url("../img/allergien-hero-background-v27.webp") !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-size: cover !important;
}

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

/* Match the calm COPD icon motion without the white/glow flash. */
@keyframes allergy-copd-icon-breathe-v27 {
  0%, 100% { opacity: 1; filter: none; transform: translateY(0) rotate(0deg); }
  50% { opacity: 1; filter: none; transform: translateY(-4px) rotate(-2deg); }
}

.allergy-page .allergy-why-feature > img,
.allergy-page .allergy-why-benefit img,
.allergy-page .allergy-why__photo-badge img,
.allergy-page .allergy-why__heading > div svg {
  background: transparent !important;
  box-shadow: none !important;
  filter: none !important;
  opacity: 1 !important;
  animation: 3.2s ease-in-out var(--delay, 0s) infinite allergy-copd-icon-breathe-v27 !important;
}

.allergy-page .allergy-why-feature > img,
.allergy-page .allergy-why-benefit img { mix-blend-mode: multiply; }

.allergy-page .allergy-why-feature:hover > img,
.allergy-page .allergy-why-feature:focus-visible > img,
.allergy-page .allergy-why-benefit:hover img,
.allergy-page .allergy-why-benefit:focus-visible img,
.allergy-page .allergy-why__photo-badge:hover img,
.allergy-page .allergy-why__photo-badge:focus-visible img {
  background: transparent !important;
  box-shadow: none !important;
  filter: none !important;
  animation-name: allergy-copd-icon-breathe-v27 !important;
}

@media (max-width: 1050px) {
  .asthma-page .asthma-hero,
  .allergy-page .allergy-hero { background-position: 66% center !important; }
}

@media (max-width: 620px) {
  .asthma-page .asthma-hero,
  .allergy-page .allergy-hero { background-position: 69% center !important; }
}

@media (prefers-reduced-motion: reduce) {
  .allergy-page .allergy-why-feature > img,
  .allergy-page .allergy-why-benefit img,
  .allergy-page .allergy-why__photo-badge img,
  .allergy-page .allergy-why__heading > div svg { animation: none !important; }
}