/* ─── MOBILE BREAKPOINT (≤768px) ────────────────────────────── */
@media (max-width: 768px) {
  /* Nav */
  nav { padding: 13px 16px; }
  .nav-links { display: none !important; }
  .ham { display: flex; }
  .lang-sw { margin-left: 0; margin-right: 8px; }
  .lang-btn { padding: 3px 7px; font-size: .6rem; }

  /* Hero */
  .hero-txt { padding: 0 18px 48px; }
  .badge2   { display: none; }
  .btns     { flex-direction: column; gap: 9px; }
  .btns .btn { max-width: 260px; text-align: center; }

  /* About */
  .about { grid-template-columns: 1fr; }
  .about-img { height: 240px; position: relative; min-height: 240px; }
  .about-img img { position: absolute; }
  .about-txt { padding: 38px 18px; }

  /* Gallery */
  .gal-sec  { padding: 48px 0; }
  .gal-wrap { padding: 0 34px; }
  .gi       { flex: 0 0 150px; height: 112px; }
  .gal-arrow { width: 32px; height: 32px; font-size: .9rem; }
  .gal-filters { gap: 4px; }
  .gf { padding: 6px 10px; font-size: .66rem; }

  /* Lightbox */
  .lb-main { padding: 0 46px; }

  /* Activities */
  .act-sec   { padding: 56px 18px; }
  .act-inner { grid-template-columns: 1fr; gap: 32px; }
  .act-img img { height: 240px; }

  /* Amenities */
  .amen       { padding: 56px 18px; }
  .amen-inner { grid-template-columns: 1fr; gap: 32px; }
  .amen-img   { height: 240px; }

  /* Booking */
  .bk-sec      { padding: 56px 16px; }
  .cal-months  { grid-template-columns: 1fr; }
  .fgrid       { grid-template-columns: 1fr; }
  .sauna-extra { grid-template-columns: 1fr; }
  .conf-grid   { grid-template-columns: 1fr; }

  /* Contact */
  .contact-sec { padding: 56px 18px; }
  .cc-grid     { grid-template-columns: 1fr 1fr; }

  /* Footer */
  .fi    { grid-template-columns: 1fr; gap: 26px; }
  .strip { gap: 16px; padding: 16px 12px; }
  .sdiv  { display: none; }
}

/* ─── SAFARI FLEX GAP FALLBACK ───────────────────────────────── */
@supports not (gap: 1em) {
  .nav-links li + li          { margin-left: 20px; }
  .strip > *:not(:first-child){ margin-left: 44px; }
  .gal-filters .gf + .gf     { margin-left: 6px; }
  .btns .btn + .btn           { margin-left: 12px; }
  .act-list .act-item + .act-item { margin-top: 12px; }
  .cio > *:not(:first-child)  { margin-left: 24px; }
  .tog-row > *:not(:first-child){ margin-left: 11px; }
  .dates-row > *:not(:first-child){ margin-left: 20px; }
  .fbot > *:not(:first-child) { margin-left: 20px; }
}
