/* ─────────────────────────────────────────
   responsive.css — Breakpoints mobiles
   ───────────────────────────────────────── */

/* ── Tablette / petit écran (< 900px) ── */
@media (max-width: 900px) {

  /* Nav : masquer les liens */
  nav { padding: 1.1rem 1.4rem; }
  .nav-links { display: none; }

  /* Mood : réduire les lignes */
  .mood {
    grid-template-rows: 220px 160px;
  }

  /* Schedule : colonne unique, point à gauche */
  .schedule-grid { max-width: 100%; }

  .sched-spine { display: none; }

  .sched-item,
  .sched-item.even {
    grid-template-areas: "dot content" !important;
    grid-template-columns: 36px 1fr !important;
  }

  .sched-item .sched-content,
  .sched-item.even .sched-content {
    text-align: left !important;
  }

  .schedule-separator {
    gap: 2rem; /* plus de marge autour du texte */
  }

  .schedule-separator::before,
  .schedule-separator::after {
    flex: 1; /* traits s'adaptent à l'espace disponible */
  }

  /* Details */
  .details-grid { grid-template-columns: 1fr 1fr; }

  /* Gallery */
  .gallery-grid { grid-template-columns: 1fr 1fr; }
  .gal-item:first-child { grid-row: span 1; }
}


/* ── Mobile (< 580px) ── */
@media (max-width: 580px) {

  /* Hero : titre plus petit */
  .hero-title { font-size: clamp(3.5rem, 16vw, 6rem); }

  /* Mood : 2 colonnes */
  .mood {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 180px 180px 140px;
  }
  .mood-item:first-child {
    grid-column: span 2;
    grid-row: span 1;
  }

  /* Gallery : 1 colonne */
  .gallery-grid { grid-template-columns: 1fr; }

  /* Details : 2 colonnes maintenues */
  .details-grid { grid-template-columns: 1fr 1fr; }
}