/* ===== Eurotour responsive layer: fluid layout for any screen (320px → 4K) ===== */
html { overflow-x: clip; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { overflow-x: clip; min-width: 0 !important; }
.app { min-width: 0 !important; width: 100%; max-width: 100vw; overflow-x: clip; }
img, svg, video, iframe { max-width: 100%; }
img { height: auto; }
.container { width: min(1340px, calc(100% - 40px)) !important; max-width: 100% !important; }
@media (max-width: 767px) { .container { width: calc(100% - 24px) !important; } }
@media (max-width: 359px) { .container { width: calc(100% - 16px) !important; } }

/* fluid headings — no giant text on 4K, no cut text on 320 */
h1, .front-sec__title { font-size: clamp(26px, 2.2vw + 14px, 52px) !important; line-height: 1.12 !important; overflow-wrap: anywhere; }
h2, .sec-title, .main-form__title:not(.air-open-btn) { font-size: clamp(22px, 1.4vw + 14px, 40px) !important; line-height: 1.15 !important; overflow-wrap: anywhere; }
h3 { font-size: clamp(17px, .6vw + 13px, 24px) !important; }
p, li { overflow-wrap: anywhere; }

/* ultra-wide: cap content width so it doesn't stretch across the whole monitor */
@media (min-width: 1700px) {
  .container { width: min(1400px, calc(100% - 80px)) !important; }
}
/* small tablets & big phones (600–1024): 2-column cards, comfortable paddings */
@media (min-width: 600px) and (max-width: 1099px) {
  .direction-sec__direction, .direction-sec__extra-inner { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
  .direction-sec__sale { display: none !important; }
  .advantages-sec__icon-container { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
}
/* very narrow phones (≤ 359): compact everything */
@media (max-width: 359px) {
  body { font-size: 14px; }
  .search__time, .et-cls { flex-wrap: wrap; }
  .et-cls__opt, .search__time-opt { padding-left: 8px; padding-right: 8px; }
  .et-ccard, .direction-element { padding-left: 12px !important; padding-right: 12px !important; }
  .direction-element__price, .et-card-trip { font-size: 14px !important; }
  .et-mcta__btn--book { min-width: 0; }
  .et-ccard__value { font-size: 15px !important; }
  .header__mobile-wrapper, .header__mobile-nav, .header__mob-nav-ul, .header__mob-nav-ul li, .header__mob-nav-ul a { width: 100% !important; max-width: 100%; }
}
/* the mobile menu must never define page width */
.header__mobile-wrapper, .header__mobile-nav, .header__mob-nav-ul { max-width: 100%; }
/* long tables / lists inside text */
table { display: block; max-width: 100%; overflow-x: auto; }
/* landscape phones: shorter hero */
@media (max-height: 480px) and (orientation: landscape) {
  .front-sec { min-height: 0 !important; }
  .front-sec__bg { min-height: 0 !important; }
}
/* prevent iOS zoom on inputs */
@media (max-width: 767px) { input, select, textarea { font-size: max(16px, 1em); } }
/* hero: always a vertical stack */
.front-sec__banner-sec-wrapepr { display: flex !important; flex-direction: column !important; flex-wrap: nowrap !important; align-items: flex-start; gap: 12px; }
.front-sec__banner-sec-wrapepr > * { width: 100% !important; max-width: 820px; flex: 0 0 auto !important; }
.front-sec__title { width: 100% !important; max-width: 820px !important; }
.et-hero-stats { display: flex; flex-wrap: wrap; gap: 14px 24px; }
@media (max-width: 767px) { .front-sec__advantages-row { display: grid !important; grid-template-columns: 1fr; gap: 10px; } }

/* Offer/legal popup: compact readable text without visual gaps on mobile */
.et-legal__wrap {
  width: min(620px, calc(100vw - 28px)) !important;
  padding: clamp(22px, 5vw, 32px) clamp(18px, 5vw, 30px) !important;
  box-sizing: border-box !important;
}
.et-legal__title {
  margin-bottom: 14px !important;
  line-height: 1.2 !important;
}
.et-legal p,
.et-legal li {
  text-align: left !important;
  line-height: 1.52 !important;
  word-spacing: normal !important;
  letter-spacing: normal !important;
  hyphens: none !important;
}
.et-legal p {
  margin-bottom: 16px !important;
}
.et-legal ul {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: grid !important;
  gap: 10px !important;
}
.et-legal li {
  position: relative !important;
  margin: 0 !important;
  padding-left: 18px !important;
}
.et-legal li::before {
  content: "";
  position: absolute;
  left: 0;
  top: .72em;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #6e137d;
}
@media (max-width: 480px) {
  .et-legal__wrap {
    width: calc(100vw - 22px) !important;
    max-height: calc(100dvh - 42px) !important;
    border-radius: 24px !important;
  }
  .et-legal p,
  .et-legal li {
    font-size: 14px !important;
    line-height: 1.48 !important;
  }
}