/* Shared COPD-reference behavior for Asthma, Allergien, Lungenkrebs and Lungenfibrose. */
:root {
  --kls-copd-green: #174c38;
  --kls-copd-gold: #d69a27;
  --kls-copd-icon-bg: #fffdf7cc;
  --kls-copd-icon-border: #cbcabe;
}

/*
 * Forced desktop hero geometry for all five disease pages.
 * The repeated class raises specificity above older page-level !important rules.
 */
@media (min-width: 1051px) {
  html body .asthma-hero.asthma-hero,
  html body .allergy-hero.allergy-hero,
  html body .copd-hero.copd-hero,
  html body .lung-cancer-hero.lung-cancer-hero,
  html body .fibrosis-hero.fibrosis-hero {
    box-sizing: border-box !important;
    width: 100vw !important;
    height: auto !important;
    min-height: 700px !important;
    max-height: none !important;
    aspect-ratio: 1692 / 929 !important;
  }
}

/* Hero geometry and typography copied from the COPD page. */
:is(.asthma-hero, .allergy-hero, .copd-hero, .lung-cancer-hero, .fibrosis-hero) {
  isolation: isolate;
  aspect-ratio: 1692 / 929 !important;
  width: 100vw !important;
  max-width: none !important;
  min-width: 0 !important;
  min-height: 700px !important;
  margin-inline: calc(50% - 50vw) !important;
  padding: 0 !important;
  position: relative;
  overflow: hidden;
}

:is(.asthma-hero__copy, .hero-copy, .lung-cancer-hero__content-copy, .fibrosis-hero__copy) {
  width: 42% !important;
  position: absolute !important;
  top: 18% !important;
  left: 6.9% !important;
}

:is(.asthma-hero__copy, .hero-copy, .lung-cancer-hero__content-copy, .fibrosis-hero__copy) h1 {
  letter-spacing: -.06em !important;
  margin-top: .7vw !important;
  font-family: "Cormorant Garamond", Georgia, serif !important;
  font-size: clamp(5rem, 7.9vw, 8.6rem) !important;
  font-weight: 500 !important;
  line-height: .8 !important;
}

:is(.asthma-hero__actions, .hero-actions, .lung-cancer-actions, .fibrosis-actions) {
  gap: 1.8vw !important;
  margin-top: 2.15vw !important;
  display: flex !important;
}

:is(.asthma-hero__reference, .allergy-hero__artwork, .lung-cancer-hero__reference, .fibrosis-hero__reference, .fibrosis-hero__mobile-art) {
  object-fit: cover !important;
}

/* Treatment cards use the COPD card hover and icon/media movement. */
:is(.therapy-card, .allergy-care-card, .lung-cancer-therapy-card, .fibrosis-care-card) {
  transition: transform .25s, box-shadow .25s !important;
}

:is(.therapy-card, .allergy-care-card, .lung-cancer-therapy-card, .fibrosis-care-card):hover,
:is(.therapy-card, .allergy-care-card, .lung-cancer-therapy-card, .fibrosis-care-card):focus-visible {
  outline: none;
  transform: translateY(-6px) !important;
  box-shadow: 0 14px 24px #1436271f !important;
}

:is(.therapy-card, .allergy-care-card, .lung-cancer-therapy-card, .fibrosis-care-card):hover
  :is(.therapy-card__photo > img, .therapy-card__icon, .allergy-care-card__photo, .allergy-care-card__icon, .lung-cancer-therapy-card__photo, .lung-cancer-therapy-card__icon, .fibrosis-care-card__photo, .fibrosis-care-card__icon),
:is(.therapy-card, .allergy-care-card, .lung-cancer-therapy-card, .fibrosis-care-card):focus-visible
  :is(.therapy-card__photo > img, .therapy-card__icon, .allergy-care-card__photo, .allergy-care-card__icon, .lung-cancer-therapy-card__photo, .lung-cancer-therapy-card__icon, .fibrosis-care-card__photo, .fibrosis-care-card__icon) {
  animation: 1.6s ease-in-out infinite kls-copd-treatment-float !important;
}

@keyframes kls-copd-treatment-float {
  50% { transform: translateY(-5px) scale(1.025); }
}

/* COPD "why" icon behavior, including the Lungenkrebs safety journey. */
:is(.why-feature, .allergy-why-feature, .fibrosis-why-feature, .lung-cancer-why-feature) {
  transition: transform .25s, background .25s !important;
}

:is(.why-feature, .allergy-why-feature, .fibrosis-why-feature, .lung-cancer-why-feature):hover,
:is(.why-feature, .allergy-why-feature, .fibrosis-why-feature, .lung-cancer-why-feature):focus-visible {
  z-index: 2;
  background: #ffffff8c !important;
  outline: none;
  transform: translateY(-4px) !important;
}

:is(.why-feature, .allergy-why-feature, .fibrosis-why-feature, .lung-cancer-why-feature):hover img,
:is(.why-feature, .allergy-why-feature, .fibrosis-why-feature, .lung-cancer-why-feature):focus-visible img,
:is(.closing-benefit, .allergy-why-benefit, .fibrosis-why-benefit, .lung-cancer-why-benefit):hover img,
:is(.closing-benefit, .allergy-why-benefit, .fibrosis-why-benefit, .lung-cancer-why-benefit):focus-visible img {
  filter: brightness(1.05) saturate(1.15) !important;
  animation: 1.55s ease-in-out infinite kls-copd-why-breathe !important;
}

@keyframes kls-copd-why-breathe {
  50% { transform: translateY(-4px) rotate(-2deg); }
}

@media (width <= 1050px) {
  :is(.asthma-hero, .allergy-hero, .lung-cancer-hero, .fibrosis-hero) {
    aspect-ratio: auto !important;
    min-height: 0 !important;
    padding: 46px 28px 430px !important;
  }

  :is(.asthma-hero__copy, .hero-copy, .lung-cancer-hero__content-copy, .fibrosis-hero__copy) {
    background: #faf6eef5 !important;
    border-radius: 28px !important;
    width: min(720px, 100%) !important;
    padding: 30px !important;
    position: relative !important;
    top: auto !important;
    left: auto !important;
    box-shadow: 0 15px 42px #25463414 !important;
  }

  :is(.asthma-hero__copy, .hero-copy, .lung-cancer-hero__content-copy, .fibrosis-hero__copy) h1 {
    font-size: clamp(5.6rem, 13vw, 8.4rem) !important;
  }

  :is(.asthma-hero__reference, .allergy-hero__artwork, .lung-cancer-hero__reference) {
    object-fit: cover !important;
    object-position: 72% bottom !important;
    clip-path: inset(48% 0 0) !important;
  }

  :is(.asthma-hero__actions, .hero-actions, .lung-cancer-actions, .fibrosis-actions) {
    flex-wrap: wrap !important;
  }
}

@media (width <= 600px) {
  :is(.asthma-hero, .allergy-hero, .lung-cancer-hero, .fibrosis-hero) {
    padding: 24px 16px 340px !important;
  }

  :is(.asthma-hero__copy, .hero-copy, .lung-cancer-hero__content-copy, .fibrosis-hero__copy) {
    padding: 24px 20px !important;
  }

  :is(.asthma-hero__copy, .hero-copy, .lung-cancer-hero__content-copy, .fibrosis-hero__copy) h1 {
    font-size: 5.3rem !important;
  }

  .lung-cancer-hero__content-copy h1,
  .fibrosis-hero__copy h1 {
    overflow-wrap: anywhere;
  }

  :is(.asthma-hero__actions, .hero-actions, .lung-cancer-actions, .fibrosis-actions) {
    gap: 12px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  :is(.asthma-hero, .allergy-hero, .lung-cancer-hero, .fibrosis-hero, .allergy-care, .fibrosis-care, .therapy-section, .lung-cancer-therapy, .why-kls-section, .allergy-why, .lung-cancer-why, .fibrosis-why) *,
  :is(.asthma-hero, .allergy-hero, .lung-cancer-hero, .fibrosis-hero, .allergy-care, .fibrosis-care, .therapy-section, .lung-cancer-therapy, .why-kls-section, .allergy-why, .lung-cancer-why, .fibrosis-why) *::before,
  :is(.asthma-hero, .allergy-hero, .lung-cancer-hero, .fibrosis-hero, .allergy-care, .fibrosis-care, .therapy-section, .lung-cancer-therapy, .why-kls-section, .allergy-why, .lung-cancer-why, .fibrosis-why) *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}

/* Shared third-section divider for Asthma and Lungenkrebs. */




@media (width <= 700px) {
  
}

/* Supplied Lungenfibrose symptom artwork, mapped by card label. */
.fibrosis-page #fibrose-gewichtsverlust > img {
  content: url("../img/lungenfibrose-symptoms/gewichtsverlust.webp") !important;
}

.fibrosis-page #fibrose-sauerstoffmangel > img {
  content: url("../img/lungenfibrose-symptoms/sauerstoffmangel.webp") !important;
}

.fibrosis-page #fibrose-trockener-husten > img {
  content: url("../img/lungenfibrose-symptoms/trockener-husten.webp") !important;
}

.fibrosis-page #fibrose-leistungsabnahme > img {
  content: url("../img/lungenfibrose-symptoms/leistungsabnahme.webp") !important;
}

.fibrosis-page #fibrose-atemnot > img {
  content: url("../img/lungenfibrose-symptoms/atemnot.webp") !important;
}

/* Keep both hero text groups unboxed at every breakpoint. */
.fibrosis-page .fibrosis-hero__copy,
.lung-cancer-page .lung-cancer-hero__content-copy {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* One supplied background across the final Lungenfibrose content block. */
.fibrosis-page .fibrosis-why {
  background: #fbf8f1 url("../img/lungenfibrose-final-sections-background.webp") center top / cover no-repeat !important;
}

/* The consultation and walking photos are already part of that background. */
.fibrosis-page .fibrosis-why__doctor,
.fibrosis-page .fibrosis-why__cta > img,
.fibrosis-page .fibrosis-why__corner {
  display: none !important;
}

.fibrosis-page .fibrosis-why__top-grid {
  grid-template-columns: minmax(0, 1fr) !important;
}

.fibrosis-page .fibrosis-why__features,
.fibrosis-page .fibrosis-why__cta,
.fibrosis-page .fibrosis-why__benefits {
  width: min(780px, 52%) !important;
  margin-left: auto !important;
  margin-right: 0 !important;
}

.fibrosis-page .fibrosis-why__cta {
  grid-template-columns: minmax(0, 1fr) minmax(220px, .75fr) !important;
}

.fibrosis-page .fibrosis-why__learn-more {
  display: none !important;
}

@media (width <= 1180px) {
  .fibrosis-page .fibrosis-why__features,
  .fibrosis-page .fibrosis-why__cta,
  .fibrosis-page .fibrosis-why__benefits {
    width: 100% !important;
    margin-right: auto !important;
  }
}

@media (width <= 700px) {
  .fibrosis-page .fibrosis-why {
    background-position: center top !important;
  }

  .fibrosis-page .fibrosis-why__cta {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* Allergien: keep every icon in the final two sections completely static. */
:is(.allergy-care, .allergy-why) :is(
  .allergy-care-card__icon,
  .allergy-why__heading > div svg,
  .allergy-why__photo-badge img,
  .allergy-why-feature > img,
  .allergy-why__cta > a svg,
  .allergy-why-benefit img
) {
  animation: none !important;
  transition: none !important;
  transform: none !important;
  filter: none !important;
  box-shadow: none !important;
  opacity: 1 !important;
  will-change: auto !important;
}