/* ============================================================
   TERANGA EVENTS & RÉCEPTION — RESPONSIVE
   Breakpoints : 992px (tablette large) / 768px (tablette) / 576px (mobile)
   ============================================================ */

/* ---------- ≤ 992px : tablette ---------- */
@media (max-width: 992px) {
  :root {
    --fs-3xl: 2.7rem;
    --fs-2xl: 2.2rem;
    --space-2xl: 4.5rem;
    --space-xl: 3.5rem;
  }

  .grid-4 { grid-template-columns: repeat(2, 1fr); }
  .grid-3 { grid-template-columns: repeat(2, 1fr); }
  .footer-grid { grid-template-columns: 1fr 1fr; }
}

/* ---------- ≤ 768px : tablette portrait / grand mobile ---------- */
@media (max-width: 768px) {
  :root {
    --fs-3xl: 2.2rem;
    --fs-2xl: 1.85rem;
    --fs-xl: 1.6rem;
    --space-xl: 3rem;
  }

  .nav-links {
    position: fixed;
    top: var(--header-height);
    left: 0;
    right: 0;
    background: var(--color-cream);
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    padding: var(--space-sm) var(--space-md);
    border-bottom: 1px solid var(--color-border);
    transform: translateY(-120%);
    opacity: 0;
    pointer-events: none;
    transition: transform var(--transition-base), opacity var(--transition-base);
  }

  .nav-links.is-open {
    transform: translateY(0);
    opacity: 1;
    pointer-events: auto;
  }

  .nav-links a {
    padding: 0.9rem 0;
    border-bottom: 1px solid var(--color-border);
    width: 100%;
  }

  .nav-cta {
    text-align: center;
    margin-top: var(--space-xs);
    border-bottom: none !important;
  }

  .nav-toggle { display: flex; }

  .nav-toggle.is-active span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
  .nav-toggle.is-active span:nth-child(2) { opacity: 0; }
  .nav-toggle.is-active span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }

  .hero { min-height: 78vh; text-align: left; }
  .hero-actions { flex-direction: column; align-items: stretch; }
  .hero-actions .btn { justify-content: center; }
  .hero-stats { gap: var(--space-md); }

  .grid-3, .grid-4 { grid-template-columns: 1fr 1fr; }

  .form-two-cols { grid-template-columns: 1fr; }

  .footer-grid { grid-template-columns: 1fr; gap: var(--space-md); }
  .footer-bottom { flex-direction: column; align-items: flex-start; }
}

/* ---------- ≤ 576px : mobile ---------- */
@media (max-width: 576px) {
  :root {
    --fs-3xl: 1.9rem;
    --fs-2xl: 1.6rem;
    --fs-lg: 1.25rem;
    --space-lg: 2.25rem;
    --space-xl: 2.5rem;
    --header-height: 72px;
  }

  .container { padding: 0 var(--space-sm); }

  section { padding: var(--space-xl) 0; }

  .grid-3, .grid-4, .grid-2 { grid-template-columns: 1fr; }

  .hero-content { max-width: 100%; }

  .reassurance-strip { justify-content: flex-start; gap: var(--space-md); }

  .whatsapp-float {
    width: 54px;
    height: 54px;
    bottom: 16px;
    right: 16px;
  }
  .whatsapp-float svg { width: 26px; height: 26px; }

  .filter-tabs { justify-content: flex-start; overflow-x: auto; flex-wrap: nowrap; padding-bottom: 4px; }
  .filter-tab { flex: 0 0 auto; }
}

/* ---------- Accessibilité : focus visible & réduction de mouvement ---------- */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
  outline: 3px solid var(--color-indigo);
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
  * { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}