/* ==========================================================================
   KEUR TERANGA — Responsive
   Breakpoints CodeZen : Mobile ≤576px · Tablette 577–992px · Desktop ≥993px
   ========================================================================== */

/* ---------- Tablette (≤992px) ---------- */
@media (max-width: 992px) {
  :root { --space-2xl: 5rem; --space-xl: 3.5rem; }

  .hero .container { grid-template-columns: 1fr; }
  .hero-visual { order: -1; }
  .hero-meta { gap: var(--space-md); }

  .cuisine-grid { grid-template-columns: repeat(2, 1fr); }
  .cuisine-card, .cuisine-card--feature { grid-column: span 1; grid-row: span 1; }

  .ambiance-layout { grid-template-columns: 1fr; }
  .ambiance-visual { order: -1; }

  .testimonials { grid-template-columns: 1fr 1fr; }

  .form-layout { grid-template-columns: 1fr; gap: var(--space-lg); }

  .footer-grid { grid-template-columns: 1fr 1fr; row-gap: var(--space-lg); }

  .nav-links { gap: var(--space-sm); }
}

/* ---------- Menu mobile (≤900px) : navigation transformée ---------- */
@media (max-width: 900px) {
  .nav-toggle { display: inline-flex; }
  .main-nav { gap: 0; }
  .nav-links {
    position: fixed;
    top: 68px;
    left: 0;
    right: 0;
    background: var(--color-navy);
    flex-direction: column;
    align-items: flex-start;
    padding: var(--space-md) var(--container-pad);
    gap: var(--space-sm);
    transform: translateY(-8px);
    opacity: 0;
    pointer-events: none;
    transition: transform var(--transition-mid), opacity var(--transition-mid);
    border-bottom: 1px solid rgba(255,255,255,0.1);
  }
  .nav-links.is-open {
    transform: translateY(0);
    opacity: 1;
    pointer-events: auto;
  }
  .nav-links a { width: 100%; padding-block: 0.5rem; }
  .nav-cta { display: none; }
}

/* ---------- Mobile (≤576px) ---------- */
@media (max-width: 576px) {
  :root {
    --space-2xl: 3.5rem;
    --space-xl: 2.75rem;
    --space-lg: 2rem;
    --container-pad: 1.1rem;
  }

  h1 { line-height: 1.16; }

  .hero-actions .btn, .hero-actions { width: 100%; }
  .hero-actions { flex-direction: column; }
  .hero-meta { flex-direction: column; gap: var(--space-sm); }

  .info-strip .container { flex-direction: column; align-items: flex-start; gap: 0.6rem; }

  .cuisine-grid { grid-template-columns: 1fr; }

  .ambiance-photos { grid-template-columns: 1fr; }
  .ambiance-photos .photo-frame:first-child { grid-column: span 1; }
  .ambiance-tags { gap: 0.5rem; }

  .testimonials { grid-template-columns: 1fr; }

  .event-banner { flex-direction: column; align-items: flex-start; text-align: left; }
  .event-banner .btn { width: 100%; justify-content: center; }

  .menu-item { grid-template-columns: auto 1fr; grid-template-areas: "photo body" "photo price"; }
  .menu-item .photo-frame { width: 64px; grid-area: photo; }
  .menu-item-body { grid-area: body; }
  .menu-item-price { grid-area: price; align-self: end; }

  .field-row { grid-template-columns: 1fr; gap: 0; }

  .footer-grid { grid-template-columns: 1fr; text-align: left; }
  .footer-bottom { flex-direction: column; }

  .whatsapp-float { width: 52px; height: 52px; font-size: 1.4rem; bottom: 1.1rem; right: 1.1rem; }

  .contact-card, .form-card { padding: var(--space-md); }
}

/* ---------- Réduction de mouvement ---------- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}
