/* Housers Prestige — poprawki responsywności (mobile) */

/* Zapobiegaj poziomemu przepełnieniu na całej stronie */
html, body {
  max-width: 100%;
  overflow-x: hidden;
}
*, *::before, *::after {
  box-sizing: border-box;
}

/* Obrazy i media nie wychodzą poza kontener */
img, video, svg {
  max-width: 100%;
  height: auto;
}

/* ---- HEADER na telefonie ---- */
@media (max-width: 768px) {
  header[data-dc-tpl="10"] {
    flex-wrap: wrap !important;
    gap: 10px 14px !important;
    padding: 12px 16px !important;
  }
  /* menu (nav) mieści się pod logo, zawija się */
  header[data-dc-tpl="10"] nav {
    gap: 12px 16px !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
    width: 100%;
    order: 3;
  }
  header[data-dc-tpl="10"] nav a {
    font-size: 13px !important;
  }
  /* przycisk "Umów rozmowę" — mniejszy, nie wypycha layoutu */
  header[data-dc-tpl="10"] > a[style*="white-space: nowrap"],
  header[data-dc-tpl="10"] > a:last-child {
    padding: 9px 16px !important;
    font-size: 12px !important;
  }
}

/* Bardzo wąskie ekrany — jeszcze ciaśniej */
@media (max-width: 400px) {
  header[data-dc-tpl="10"] nav {
    gap: 10px 14px !important;
  }
  header[data-dc-tpl="10"] nav a {
    font-size: 12.5px !important;
  }
}

/* ---- Ogólne: kontenery treści nie wychodzą poza ekran ---- */
@media (max-width: 768px) {
  section, header, footer, main, div {
    max-width: 100vw;
  }
  /* elementy z dużym poziomym paddingiem clamp — ogranicz na mobile */
  [style*="clamp"] {
    max-width: 100%;
  }
}