/* iQQuip mobile layout hotfix v1 — 13 August 2026
   Scope: mobile product cards, products hero headings and language-selector visibility only. */

@media (max-width: 700px) {
  html, body {
    max-width: 100%;
    overflow-x: hidden;
  }

  /* Keep the EN / DE / NL selector visible beside the mobile menu. */
  .site-header > .language-switcher {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    flex: 0 0 auto !important;
  }

  /* Long translated product headings must stay inside the viewport. */
  .page-hero,
  .page-hero-copy {
    min-width: 0 !important;
    width: 100%;
  }
  .page-hero h1 {
    max-width: 100% !important;
    font-size: clamp(36px, 9.8vw, 42px) !important;
    line-height: 1.02 !important;
    letter-spacing: -0.045em !important;
    word-break: normal !important;
    overflow-wrap: break-word !important;
    -webkit-hyphens: auto;
    hyphens: auto;
  }
  .page-hero-intro {
    max-width: 100% !important;
  }

  /* Products overview cards: image, facts and link now occupy their own
     vertical areas instead of sharing an absolute-positioned layer. */
  .choice-card {
    min-height: 0 !important;
    height: auto !important;
    padding: 58px 24px 48px !important;
    overflow: hidden !important;
  }
  .choice-card h2 {
    max-width: 100%;
    font-size: clamp(40px, 11vw, 50px) !important;
    line-height: 1.02 !important;
  }
  .choice-product-image.one,
  .choice-product-image.wall {
    position: relative !important;
    inset: auto !important;
    display: block !important;
    width: min(100%, 300px) !important;
    max-width: 300px !important;
    height: 360px !important;
    margin: 18px auto 8px !important;
    object-fit: contain !important;
    object-position: center !important;
    transform: none !important;
  }
  .choice-card ul {
    position: static !important;
    left: auto !important;
    bottom: auto !important;
    width: 100% !important;
    max-width: none !important;
    margin: 16px 0 0 !important;
    padding-left: 18px !important;
  }
  .choice-card .text-link {
    position: static !important;
    left: auto !important;
    bottom: auto !important;
    margin-top: 26px !important;
  }

  /* Homepage product cards: keep the complete PRO ONE / PRO WALL image
     separate from headings and links on narrow screens. */
  .products .product-cards article {
    min-height: 0 !important;
    height: auto !important;
    padding: 36px 24px 34px !important;
  }
  .products .product-card-image.one,
  .products .product-card-image.wall {
    position: relative !important;
    inset: auto !important;
    display: block !important;
    width: min(100%, 270px) !important;
    max-width: 270px !important;
    height: 330px !important;
    margin: 18px auto 4px !important;
    object-fit: contain !important;
    object-position: center !important;
    transform: none !important;
  }
  .products .product-cards a {
    position: static !important;
    left: auto !important;
    bottom: auto !important;
    margin-top: 18px !important;
  }
}

@media (max-width: 430px) {
  .page-hero h1 {
    font-size: clamp(34px, 9.3vw, 39px) !important;
    line-height: 1.03 !important;
  }
  .choice-product-image.one,
  .choice-product-image.wall {
    width: min(100%, 270px) !important;
    height: 330px !important;
  }
  .products .product-card-image.one,
  .products .product-card-image.wall {
    width: min(100%, 245px) !important;
    height: 300px !important;
  }
}
