/* ============================================================
   RESPONSIVE - Mobile first
   ============================================================ */

/* ── Tablette (≤900px) ──────────────────────────────────────── */
@media (max-width: 900px) {
  .layout-with-sidebar {
    grid-template-columns: 1fr;
  }

  .sidebar-first {
    order: -1; /* sidebar en bas sur mobile → passer en -1 si on veut en haut */
  }

  .footer-top {
    grid-template-columns: 1fr 1fr;
  }

  .header-inner {
    flex-wrap: wrap;
    gap: 0.5rem;
  }
}

/* ── Mobile (≤640px) ────────────────────────────────────────── */
@media (max-width: 640px) {
  /* Nav mobile */
  .nav-toggle { display: flex; }

  .nav-principale nav {
    display: none;
    background: var(--color-mer);
  }

  .nav-principale nav.is-open {
    display: block;
  }

  .nav-principale nav ul {
    flex-direction: column;
  }

  .nav-principale nav > ul > li > a {
    border-bottom: 1px solid rgba(255,255,255,.1);
    padding: 0.75rem 1.2rem;
  }

  .nav-principale nav ul ul {
    position: static;
    box-shadow: none;
    border-top: none;
    background: rgba(0,0,0,.15);
    display: flex;
    flex-direction: column;
  }

  .nav-principale nav > ul > li:hover > ul {
    display: flex;
  }

  /* Hero */
  .region-hero { min-height: 360px; }
  .hero-content h1 { font-size: 1.8rem; }
  .hero-content p { font-size: 1rem; }

  /* Grilles */
  .cards-grid { grid-template-columns: 1fr; }
  .testimonials-grid { grid-template-columns: 1fr; }
  .form-chambre .form-row { grid-template-columns: 1fr; }
  .points-forts { grid-template-columns: 1fr; }
  .equipements-grid { grid-template-columns: repeat(2, 1fr); }
  .galerie-grid { grid-template-columns: repeat(2, 1fr); }

  /* Footer */
  .footer-top { grid-template-columns: 1fr; }
  .footer-bottom {
    flex-direction: column;
    text-align: center;
  }
  .footer-menu ul {
    justify-content: center;
  }
}

/* ── Print ──────────────────────────────────────────────────── */
@media print {
  .site-header,
  .nav-principale,
  .site-footer,
  .region-cards,
  .region-testimonials,
  .galerie-grid { display: none !important; }

  body { font-size: 12pt; color: #000; }
  a::after { content: " (" attr(href) ")"; font-size: 0.8em; }
}

/* ── Contenu centré ─────────────────────────────────────────── */
.layout-main {
  max-width: 960px !important;
  margin: 0 auto !important;
  padding: 2rem 1.5rem !important;
}

/* ── Responsive mobile ──────────────────────────────────────── */
@media (max-width: 768px) {
  .layout-main { padding: 1rem !important; }
  .slider-hero { height: 250px !important; }
  .slider-hero-texte h2 { font-size: 1.2rem !important; }
  .nav-principale nav ul { flex-direction: column; }
  .nav-principale nav ul ul { position: static; display: none; }
  div[style*="grid-template-columns"] {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 480px) {
  .slider-hero { height: 200px !important; }
  .layout-main { padding: 0.5rem !important; }
}