/*
Theme Name: LCDM SOLIMAD Child
Description: Child theme GeneratePress pour ONG LCDM SOLIMAD
Template: generatepress
Version: 9.0
*/

/* ══════════════════════════════════════════════════════════
   CSS GLOBAL — s'applique sur TOUTES les pages du site
   (même celles sans template Page Vierge)
══════════════════════════════════════════════════════════ */

:root {
  --red:#BE262D;--red-dk:#971e24;--red-lt:#fdf0f0;
  --green:#7FB982;--green-dk:#4e8a52;--green-lt:#eef6ef;
  --blue:#5CA2DF;--blue-dk:#3278b5;--blue-lt:#edf4fc;
  --border:#E2E6EA;--off:#F7F8FA;--muted:#8a8a8a;
  --serif:'Lora',Georgia,serif;
  --sans:'Nunito',system-ui,sans-serif;
}

/* ── HAMBURGER BUTTON ── */
.hamburger {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 40px; height: 40px;
  cursor: pointer;
  border: none;
  background: transparent;
  padding: 6px;
  border-radius: 8px;
  flex-shrink: 0;
}
.hamburger span {
  display: block;
  width: 22px; height: 2.5px;
  background: #1c1c1c;
  border-radius: 2px;
  transition: all 0.3s;
}
.hamburger.open span:nth-child(1) { transform: translateY(7.5px) rotate(45deg); }
.hamburger.open span:nth-child(2) { opacity: 0; }
.hamburger.open span:nth-child(3) { transform: translateY(-7.5px) rotate(-45deg); }

/* ── MENU MOBILE OVERLAY ── */
.nav-mobile-overlay {
  display: none;
  position: fixed; inset: 0;
  background: rgba(0,0,0,.5);
  z-index: 9998;
}
.nav-mobile-overlay.open { display: block; }

/* ── MENU MOBILE PANEL ── */
.nav-mobile-panel {
  position: fixed;
  top: 0; right: -100%;
  width: min(320px, 85vw);
  height: 100%;
  background: #fff;
  z-index: 9999;
  box-shadow: -4px 0 24px rgba(0,0,0,.18);
  transition: right 0.3s cubic-bezier(.4,0,.2,1);
  overflow-y: auto;
  font-family: var(--sans);
}
.nav-mobile-panel.open { right: 0; }

.nav-mobile-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  border-bottom: 1px solid var(--border);
  position: sticky; top: 0;
  background: #fff;
  z-index: 1;
}
.nav-mobile-close {
  width: 36px; height: 36px;
  border: none;
  background: var(--off);
  border-radius: 8px;
  cursor: pointer;
  font-size: 18px;
  display: flex; align-items: center; justify-content: center;
  color: #1c1c1c;
}
.nav-mobile-links a {
  display: flex;
  align-items: center;
  padding: 13px 20px;
  font-size: 15px;
  font-weight: 700;
  color: #1c1c1c;
  text-decoration: none;
  border-bottom: 1px solid var(--off);
  transition: background .15s;
  font-family: var(--sans);
}
.nav-mobile-links a:hover { background: var(--green-lt); color: var(--green-dk); }
.mob-sub-title {
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: var(--muted);
  padding: 14px 20px 4px;
  display: block;
  font-family: var(--sans);
}
.mob-sub-link {
  padding-left: 36px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #4a4a4a !important;
}
.mob-sub-link::before { content: '› '; color: var(--green); }
.nav-mobile-cta {
  display: block;
  margin: 16px 20px 24px;
  padding: 13px;
  text-align: center;
  background: var(--red);
  color: #fff !important;
  border-radius: 10px;
  font-weight: 900;
  font-size: 15px;
  text-decoration: none;
  font-family: var(--sans);
}

/* ══════════════════════════════════
   RESPONSIVE — MOBILE 768px
══════════════════════════════════ */
@media (max-width: 768px) {

  /* Afficher hamburger, masquer nav desktop */
  .hamburger { display: flex !important; }
  nav, .lcdm-nav, .main-navigation { display: none !important; }

  /* Hero slider */
  .hero-slider { height: 58vh !important; min-height: 280px !important; }
  .slide-title { font-size: clamp(18px,5vw,26px) !important; }
  .slide-text { font-size: 13px !important; }
  .slide-ctas { flex-direction: column !important; gap: 10px !important; }
  .slider-arrow { width: 34px !important; height: 34px !important; }
  .slide-inner { padding: 0 12px !important; }

  /* Hero pages */
  .page-hero { padding: 36px 14px 28px !important; }
  .page-hero h1, .page-hero-inner h1 { font-size: clamp(20px,6vw,30px) !important; }
  .page-hero-content { padding: 32px 14px !important; }

  /* Toutes les grilles 2+ colonnes → 1 colonne */
  .footer-top, .lcdm-footer-top,
  .contact-wrap,
  .medecins-grid,
  .temoignage-featured,
  .article-featured,
  .cta-temoigner,
  .rejoindre-card,
  .founders-grid,
  .video-slide,
  .mission-item { grid-template-columns: 1fr !important; gap: 16px !important; }

  /* Grilles 3-4 col → 2 col */
  .temoignages-grid, .articles-grid,
  .equipes-grid, .related-grid { grid-template-columns: 1fr 1fr !important; gap: 10px !important; }

  /* Stats / impact */
  .impact-grid, .stats-bar { grid-template-columns: 1fr 1fr !important; }
  .kf-bar { flex-wrap: wrap !important; }
  .kf-item { min-width: 50% !important; }

  /* Page wrap */
  .page-wrap { padding-left: 14px !important; padding-right: 14px !important; padding-top: 28px !important; }

  /* Flip cards */
  .regions-grid { grid-template-columns: 1fr !important; }
  .flip-wrap, .flip-wrap.large {
    aspect-ratio: unset !important;
    min-height: 180px !important;
    grid-column: span 1 !important;
  }

  /* Footer */
  .footer-top, .lcdm-footer-top { grid-template-columns: 1fr !important; }
  .footer-bottom, .lcdm-footer-bottom {
    flex-direction: column !important;
    text-align: center !important;
  }

  /* Formulaires */
  .form-row { grid-template-columns: 1fr !important; }
  .form-card, .form-card-container { padding: 20px 14px !important; }
  .contact-wrap { padding: 28px 14px 48px !important; gap: 20px !important; }

  /* Video slider témoignages */
  .video-slide { grid-template-columns: 1fr !important; }
  .video-media { min-height: 190px !important; }

  /* Misc */
  .medecins-section { padding: 28px 14px !important; }
  .medecins-num { font-size: 52px !important; }
  .rejoindre-card { flex-direction: column !important; padding: 24px 14px !important; }
  .section-header { flex-direction: column !important; align-items: flex-start !important; }
  .quick-subjects { gap: 6px; }
  .qs-btn { font-size: 11px; padding: 6px 10px; }
  .af-img { min-height: 160px; }
}

/* ══════════════════════════════════
   RESPONSIVE — TRÈS PETIT 480px
══════════════════════════════════ */
@media (max-width: 480px) {
  .temoignages-grid, .articles-grid,
  .equipes-grid, .founders-grid,
  .related-grid { grid-template-columns: 1fr !important; }
  .page-hero h1 { font-size: 21px !important; }
  .medecins-num { font-size: 44px !important; }
}
