/* Performance & semantics overrides — load after bundle.css */

/* h3 → p: preserve heading typography */
.heading-style-h3 {
  color: var(--primary-color-2) !important;
  font-family: var(--ff-title) !important;
  font-size: var(--fs-title-3) !important;
  font-weight: var(--fw-bold) !important;
  letter-spacing: var(--ls-tight-3) !important;
  line-height: var(--lh-title-3) !important;
}

@media screen and (max-width: 480px) {
  .heading-style-h3 {
    font-size: var(--fs-title-4) !important;
    letter-spacing: var(--ls-tight-4) !important;
    line-height: var(--lh-title-4) !important;
  }
}

.heading-style-h3 > span {
  color: var(--primary-color) !important;
}

.section__form p.heading-style-h3 {
  color: var(--title-color) !important;
  text-align: center !important;
}

#formula p.heading-style-h3 {
  color: var(--ff-title) !important;
}

#promotion p.heading-style-h3 {
  text-align: center !important;
}

#offer p.heading-style-h3 {
  color: var(--title-color) !important;
}

#steps p.heading-style-h3 {
  color: var(--title-color) !important;
}

/* CLS: reserve slider height before Swiper init */
.section__swiper {
  min-height: 280px;
}

@media (max-width: 1200px) {
  .section__swiper {
    min-height: 260px;
  }
}

/* Mobile image height overrides after width/height HTML attrs (≤480px) */
@media (max-width: 480px) {
  .section__image-card img,
  .section__image-card picture img,
  img.section__image-card.section__item,
  .section__image-card > .section__card-image,
  .section__image-card .section__card-image {
    width: 100% !important;
    height: 220px !important;
    max-height: 220px !important;
    min-height: 0 !important;
    aspect-ratio: unset !important;
    object-fit: cover !important;
  }

  #start .section__image,
  #reg .section__image { 
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    aspect-ratio: unset !important;
    object-fit: contain !important;
  }

  .sections__container.start .section__bg-image {
    width: 100% !important;
    height: 420px !important;
    max-height: 420px !important;
    aspect-ratio: unset !important;
    object-fit: cover !important;
  }

  #promotion .section__image-card img,
  #promotion .section__image-card .section__card-image {
    width: auto !important;
    height: auto !important;
    max-height: 104px !important;
    min-height: 0 !important;
    aspect-ratio: unset !important;
    object-fit: contain !important;
  }

  #steps .section__image-card img {
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    aspect-ratio: unset !important;
    object-fit: cover !important;
  }

  #composition .section__top-container + .section__row-container > img {
    width: 225px !important;
    height: auto !important;
    max-height: none !important;
    aspect-ratio: unset !important;
    object-fit: contain !important;
  }

  #formula .section__row-container > img,
  #benefits .section__row-container > img:not(.section__image-card) {
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
    aspect-ratio: unset !important;
    object-fit: contain !important;
  }

  #offer .section__row-container > img {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: unset !important;
    object-fit: contain !important;
  }

  #doctor .section__image-card.flex-row .section__card-image.medium,
  #doctor .section__image-card.flex-row picture img {
    width: 100% !important;
    height: 220px !important;
    max-height: 220px !important;
    aspect-ratio: unset !important;
    object-fit: cover !important;
  }

  #price .section__image-card {
    height: auto !important;
  }

  #review .section__card img[src*="bl11_"],
  #review .section__row-container img[src*="bl11_"] {
    width: 48px !important;
    height: 48px !important;
    max-height: 48px !important;
    aspect-ratio: 1 / 1 !important;
    object-fit: cover !important;
  }

  #review img[src*="stars.svg"] {
    width: 120px !important;
    height: 24px !important;
    max-height: 24px !important;
    aspect-ratio: unset !important;
  }

  #protect .section__card .section__image-card img {
    width: auto !important;
    height: auto !important;
    max-width: 196px !important;
    max-height: 196px !important;
    margin-inline: auto !important;
    object-fit: contain !important;
  }
}

/* Card images between tablet and mobile (≤588px) */
@media (max-width: 588px) {
  #benefits .section__item.section__image-card img,
  #benefits .section__item.section__image-card picture img {
    width: 100% !important;
    height: 220px !important;
    max-height: 220px !important;
    aspect-ratio: unset !important;
    object-fit: cover !important;
  }
}