/* =====================================================
   Une Voix Pour Elles — Responsive (media queries)
   Breakpoints : 768px (tablette) | 480px (mobile)
   ===================================================== */

/* ─── Tablette (≤ 768px) ─── */
@media (max-width: 768px) {

  /* Typo */
  :root {
    --spacing-lg: 3rem;
    --spacing-xl: 4rem;
  }

  /* Header & navigation */
  .menu-toggle {
    display: flex;
  }

  .site-nav {
    position: relative;
  }

  .nav-menu {
    display: none;
    position: absolute;
    top: calc(100% + 0.5rem);
    right: 0;
    width: 240px;
    flex-direction: column;
    background: var(--color-white);
    border: 1px solid var(--color-beige);
    border-radius: var(--radius);
    box-shadow: var(--shadow-md);
    padding: 0.75rem;
    z-index: 200;
  }

  .nav-menu.is-open {
    display: flex;
  }

  .nav-menu a {
    padding: 0.65rem 1rem;
    width: 100%;
    border-radius: var(--radius-sm);
  }

  .nav-menu a.btn-nav,
  .nav-menu li.btn-nav > a {
    text-align: center;
    margin-top: 0.25rem;
  }

  /* Hero */
  .hero {
    padding: 3rem 0;
  }
  .hero-decoration {
    display: none;
  }

  /* Grilles → 1 colonne */
  .piliers-grid,
  .ateliers-grid,
  .posts-grid,
  .valeurs-grid,
  .equipe-grid,
  .niveau-grid,
  .approche-grid {
    grid-template-columns: 1fr;
    gap: 1.25rem;
  }

  /* About flex */
  .about-flex {
    grid-template-columns: 1fr;
    gap: 2rem;
    text-align: center;
  }
  .about-visual { order: -1; }
  .about-text .btn-secondary { margin: 0 auto; }

  /* Mission flex */
  .mission-flex {
    grid-template-columns: 1fr;
    gap: 2rem;
    text-align: center;
  }
  .mission-visual { order: -1; }

  /* Intro flex (ateliers) */
  .intro-flex {
    grid-template-columns: 1fr;
    gap: 2rem;
    text-align: center;
  }
  .intro-visual { order: -1; }

  /* Atelier détail */
  .atelier-detail-body {
    grid-template-columns: 1fr;
  }
  .atelier-detail-header {
    flex-direction: column;
    gap: 0.75rem;
  }

  /* Contact */
  .contact-flex {
    grid-template-columns: 1fr;
    gap: 2.5rem;
  }

  /* Footer */
  .footer-inner {
    grid-template-columns: 1fr;
    gap: 2rem;
  }
  .footer-bottom-inner {
    flex-direction: column;
    text-align: center;
  }

  /* Formulaire */
  .form-row {
    flex-direction: column;
    gap: 0;
  }
  .nf-form-cont .nf-row {
    flex-direction: column;
    gap: 0;
  }
  .nf-form-cont .nf-row > .nf-cell {
    flex: 1 1 100%;
  }
  .nf-form-cont input[type="button"].ninja-forms-field,
  .nf-form-cont input[type="submit"].ninja-forms-field {
    width: 100%;
  }

  /* Navigation entre articles */
  .nav-links {
    flex-direction: column;
    gap: 1rem;
  }
  .nav-previous, .nav-next { max-width: 100%; }

  /* Témoignage */
  .temoignage-card { padding: 2rem; }

  /* Ateliers → cards */
  .ateliers-grid .atelier-card { flex-direction: column; }

  /* CTA actions */
  .cta-actions, .hero-actions {
    flex-direction: column;
    align-items: center;
  }
  .btn-large {
    width: 100%;
    max-width: 320px;
    text-align: center;
    padding: 0.75rem 1.25rem;
    font-size: 0.95rem;
  }
}

/* ─── Mobile (≤ 480px) ─── */
@media (max-width: 480px) {

  :root {
    --spacing-lg: 2.5rem;
    --spacing-xl: 3.5rem;
  }

  /* Header réduit */
  .header-inner {
    padding-top: 0.65rem;
    padding-bottom: 0.65rem;
  }

  .logo-svg { width: 160px; }
  .site-branding .custom-logo { max-height: 48px; max-width: 200px; }

  /* Hero */
  .hero {
    padding: 2.5rem 0;
    text-align: center;
  }
  .page-hero {
    padding: 2rem 0;
  }

  /* Sections */
  .section { padding-top: 2.5rem; padding-bottom: 2.5rem; }

  /* Bandeau citation */
  .citation-content {
    border-left: none;
    padding-left: 0;
    text-align: center;
  }
  .citation-icone { justify-content: center; }

  /* Cards */
  .card { padding: 1.5rem; }
  .atelier-detail { padding: 1.25rem; }
  .temoignage-card { padding: 1.5rem; }

  /* Contact */
  .contact-info-inner { padding: 1.5rem; }

  /* Atelier détail header */
  .atelier-detail-header { align-items: center; text-align: center; }

  /* Formulaire */
  .btn-submit { width: 100%; }

  /* Footer */
  .footer-inner { padding: 2rem 1.5rem; }

  /* Posts grid */
  .posts-grid { gap: 1rem; }

  /* Section CTA */
  .section-cta { padding: 3rem 0; }

  /* No results */
  .no-results { padding: 3rem 0; }

  /* 404 */
  .page-404 .section { padding: 3rem 0; }

  /* Navigation hamburger plein largeur */
  .nav-menu {
    width: calc(100vw - 3rem);
    right: 0;
  }

  /* Boutons */
  .btn-primary,
  .btn-secondary {
    width: 100%;
    max-width: 280px;
    text-align: center;
  }

  /* Section subtitle */
  .section-subtitle { font-size: 1rem; }

  /* Équipe */
  .equipe-card { padding: 1.25rem; }

  /* Pagination */
  .page-numbers { flex-wrap: wrap; justify-content: center; }

  /* Single */
  .entry-thumbnail { padding: 0 1rem; margin-bottom: 0; }
  .single-content-wrapper { padding: 0 0.5rem; }
}

/* ─── Impression ─── */
@media print {
  .site-header,
  .site-footer,
  .hero-decoration,
  .btn-primary,
  .btn-secondary,
  .menu-toggle,
  .skip-link { display: none !important; }

  body { font-size: 12pt; color: #000; }
  a { color: inherit; text-decoration: underline; }
  .section { padding: 1rem 0; }
}

/* ─── Préférences de mouvement réduit ─── */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }

  .fade-in-up,
  .fade-in-left,
  .fade-in-right {
    opacity: 1;
    transform: none;
    transition: none;
  }
}

/* ─── Mode sombre (optionnel, non intrusif) ─── */
@media (prefers-color-scheme: dark) {
  /* Pas de mode sombre forcé pour ce thème — la palette rose est
     volontairement douce et lumineuse. Les utilisateurs peuvent
     utiliser une extension navigateur si souhaité. */
}