/* =========================================================
   Keur Mame Coumba — Responsive
   Adaptations tablette & mobile
   ========================================================= */

/* ---------- Tablette & mobile : menu en tiroir (≤ 980px) ---------- */
@media (max-width: 980px) {
  /* Grilles hero + colonnes */
  .cards--features,
  .cards--3 { grid-template-columns: repeat(2, 1fr); }
  .activities { grid-template-columns: repeat(2, 1fr); }
  .footer__inner { grid-template-columns: 1fr 1fr; }
  .hero__inner { grid-template-columns: 1fr; text-align: center; }
  .hero__subtitle { margin-left: auto; margin-right: auto; }
  .hero__cta, .hero__stats { justify-content: center; }
  .hero__media { max-width: 460px; margin: 0 auto; order: -1; }
  .badge--pill { margin-inline: auto; }

  /* Header : marque rétrécissable + hamburger */
  .header__inner { gap: .5rem; }
  .brand { min-width: 0; flex-shrink: 1; gap: .55rem; }
  .brand__slogan { display: none; }
  .brand__text { min-width: 0; }
  .brand__name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .header__actions { gap: .4rem; flex-shrink: 0; }
  .header__cta { display: none; }
  .hamburger { display: block; }

  /* Tiroir de navigation */
  .nav {
    position: fixed; top: 0; right: 0; height: 100dvh; width: min(80vw, 320px);
    background: var(--surface); z-index: 1000; padding: calc(var(--header-h) + 1.5rem) 1.5rem 2rem;
    transform: translateX(100%); transition: transform var(--t); box-shadow: -12px 0 40px rgba(0,0,0,.18);
    overflow-y: auto;
  }
  .nav.is-open { transform: translateX(0); }
  .nav__list { flex-direction: column; align-items: stretch; gap: .3rem; }
  .nav__link { display: block; padding: .9rem 1rem; font-size: 1.1rem; }
}

/* ---------- Mobile (≤ 760px) ---------- */
@media (max-width: 760px) {
  :root { --header-h: 66px; }

  .brand__logo { height: 42px; }
  .brand__name { font-size: .9rem; }

  /* Grilles en pile */
  .cards--features,
  .cards--3,
  .cards--2,
  .cards--pricing,
  .split,
  .contact,
  .events,
  .form__row { grid-template-columns: 1fr; }
  .activities { grid-template-columns: repeat(2, 1fr); }

  .split--reverse .split__media { order: 0; }
  .price-card--featured { order: -1; }

  .hours-card { flex-direction: column; text-align: center; }
  .hours-list li { font-size: .98rem; }

  .discount-badge { width: 128px; height: 128px; }
  .discount-badge__pct { font-size: 1.8rem; }

  .contact__map, .contact__map iframe { min-height: 300px; }

  .footer__inner { grid-template-columns: 1fr; text-align: center; }
  .footer__brand img { margin-inline: auto; }
  .footer__col ul { justify-items: center; }

  .fab-whatsapp { width: 52px; height: 52px; bottom: 16px; right: 16px; }
  .back-top { right: 78px; bottom: 18px; width: 44px; height: 44px; }

  .lightbox__nav { width: 44px; height: 44px; font-size: 1.8rem; }
  .lightbox__prev { left: 6px; }
  .lightbox__next { right: 6px; }

  .announce p { padding: .55rem 2.4rem; font-size: .84rem; }
}

/* ---------- Petit mobile (≤ 420px) ---------- */
@media (max-width: 420px) {
  .cards--features { grid-template-columns: 1fr; }
  .activities { grid-template-columns: 1fr; }
  .hero__stats { gap: 1.2rem; }
  .hero__title { font-size: clamp(1.9rem, 8vw, 2.4rem); }
  .btn--lg { width: 100%; }
  .hero__cta .btn { width: 100%; }
  .contact__buttons .btn { flex: 1 1 100%; }
}
