:root {
  --green:#1a472a;
  --accent:#f39c12;
  --muted:#6b7280;
  --bg:#f7fafc;
  --maxw:1200px;
}

/* Reset & base */
* { box-sizing:border-box; margin:0; padding:0; }
body {
  font-family: Inter, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial;
  margin:0;
  color:#0f172a;
  background:var(--bg);
  -webkit-font-smoothing: antialiased;
  padding-top: 160px; /* pour éviter que le header cache le titre */
}
a { color:var(--accent); text-decoration:none; }
.container { max-width:var(--maxw); margin:0 auto; padding:0 20px; }

/* ----------------------
   HEADER FIXE ET NAVIGATION
---------------------- */
header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1000;
  background: #000;
  padding: 25px 0;
  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}
.nav-inner {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 20px;
}
.logo { display: flex; align-items: center; }
.logo-img { height:55px; width:auto; }
.nav-menu {
  display: flex;
  list-style: none;
  gap: 30px;
  align-items: center;
}
.nav-menu li { position: relative; }
.nav-menu a {
  color: #fff;
  font-weight: 700;
  font-size: 16px;
  padding: 10px 0;
  transition: color 0.3s;
}
/* Hover couleurs menu */
.nav-menu li:nth-child(1) > a:hover { color: #C8102E; }
.nav-menu li:nth-child(2) > a:hover { color: #D4A017; }
.nav-menu li:nth-child(3) > a:hover { color: #009975; }
.nav-menu li:nth-child(4) > a:hover { color: #0033A0; }
.nav-menu li:nth-child(5) > a:hover { color: #C8102E; }
.nav-menu li:nth-child(6) > a:hover { color: #D4A017; }
.nav-menu li:nth-child(7) > a:hover { color: #009975; }
.nav-menu li:nth-child(8) > a:hover { color: #0033A0; }

/* Dropdown */
.dropdown-menu {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  background: #111;
  border-radius: 6px;
  min-width: 200px;
  z-index: 1000;
}
.dropdown-menu li { width: 100%; }
.dropdown-menu a { display:block; padding:10px 20px; color:#fff; }
.dropdown:hover .dropdown-menu { display:block; }

/* Hamburger */
.hamburger { display: none; flex-direction: column; cursor:pointer; border:none; background:none; }
.hamburger span { width:28px; height:3px; background:#fff; margin:5px 0; transition:all 0.3s; }

/* Hamburger animé */
.hamburger.open span:nth-child(1) {
  transform: rotate(45deg) translate(5px, 5px);
}
.hamburger.open span:nth-child(2) {
  opacity: 0;
}
.hamburger.open span:nth-child(3) {
  transform: rotate(-45deg) translate(5px, -5px);
}

/* Language switcher */
.language-switcher { display:flex; align-items:center; gap:10px; }
.language-switcher img { width:28px; border-radius:3px; cursor:pointer; transition: transform 0.2s; }
.language-switcher img:hover { transform: scale(1.1); }

/* ----------------------
   HERO SECTION
---------------------- */
.hero {
  background: linear-gradient(135deg, var(--green), #2d6a4f);
  color:#fff;
  padding:80px 0;
  text-align:center;
}
.hero h1 { font-size:34px; margin:0 0 12px; font-weight:700; }
.hero p { max-width:820px; margin:0 auto 18px; color:rgba(255,255,255,0.9); }

/* ----------------------
   SECTIONS & CARDS
---------------------- */
.section { padding:80px 0 64px 0; background:transparent; }
.card-grid { display:grid; gap:20px; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); }
.card { background:#fff; border-radius:12px; padding:24px; box-shadow:0 8px 30px rgba(12,18,26,0.06); }

/* Quick links grid */
.links-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:40px; }
.link-card { background:#fff; border-radius:20px; overflow:hidden; text-decoration:none; display:block; position:relative; box-shadow:0 4px 20px rgba(0,0,0,0.08); transition:all 0.4s ease; }
.link-card::before { content:''; position:absolute; top:0; left:0; width:100%; height:5px; background: linear-gradient(90deg,#003d82,#0066cc); transform:scaleX(0); transition: transform 0.4s ease; }
.link-card:hover::before { transform: scaleX(1); }
.link-card-image { height:250px; overflow:hidden; }
.link-card-image img { width:100%; height:100%; object-fit:cover; transition: transform 0.4s ease; }
.link-card:hover .link-card-image img { transform: scale(1.1); }
.link-card-content { padding:35px; }
.link-card-content h3 { font-size:1.8rem; color:#003d82; margin-bottom:15px; }
.link-card-content p { font-size:1.05rem; color:#666; line-height:1.6; margin-bottom:20px; }
.link-arrow { display:inline-flex; align-items:center; color:#0066cc; font-weight:600; font-size:1rem; }
.link-arrow::after { content:'→'; margin-left:10px; transition: margin-left 0.3s ease; }
.link-card:hover .link-arrow::after { margin-left:15px; }

/* Mission banner */
.mission-banner { padding:80px 40px; background: linear-gradient(135deg, #003d82 0%, #0066cc 100%); color:#fff; text-align:center; }
.mission-banner h2 { font-size:2.5rem; margin-bottom:25px; font-weight:600; }
.mission-banner p { font-size:1.3rem; max-width:900px; margin:0 auto; line-height:1.8; opacity:0.95; }

/* Stats section */
.stats-section { padding:80px 40px; background:#fff; }
.stats-container { max-width:1200px; margin:0 auto; }
.stats-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:50px; text-align:center; }
.stat-item { padding:30px; transition: transform 0.3s ease; }
.stat-item:hover { transform: translateY(-10px); }
.stat-number { font-size:4rem; font-weight:700; color:#003d82; margin-bottom:15px; display:block; }
.stat-label { font-size:1.1rem; color:#666; text-transform:uppercase; letter-spacing:1px; }

/* CTA section */
.cta-section { padding:100px 40px; background: linear-gradient(135deg, #2d8659 0%, #1a5c3a 100%); text-align:center; color:#fff; }
.cta-section h2 { font-size:3rem; margin-bottom:30px; }
.cta-section p { font-size:1.4rem; margin-bottom:40px; opacity:0.95; max-width:800px; margin-left:auto;margin-right:auto; }

/* ----------------------
   FOOTER ADAPTÉ NOIR
---------------------- */
footer { background-color: #000; color: #fff; padding: 40px 20px; position: relative; }
.footer-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:28px; }
.footer-grid h3, .footer-grid h4 { color: #fff; }
.footer-grid p, .footer-grid li a { color: #ccc; }
.footer-bottom { text-align:center; color:#888; margin-top:30px; font-size:0.9rem; }

/* Engagement cards */
.engagement-grid { display:grid; grid-template-columns:1.2fr 1.2fr 0.6fr; grid-template-rows:200px 200px; gap:20px; max-width:1200px; margin:0 auto; padding:0 20px 50px; }
.engagement-card { padding:30px; border-radius:8px; color:#fff; display:flex; flex-direction:column; justify-content:center; }
.engagement-card h3 { margin:0 0 10px 0; font-size:1.4rem; font-weight:600; }
.engagement-card p { margin:0; font-size:1rem; line-height:1.5; }
.card-green { background-color:#009975; grid-column:1/2; grid-row:1/2; }
.card-blue { background-color:#0033A0; grid-column:2/3; grid-row:1/2; }
.card-yellow { background-color:#D4A017; grid-column:1/2; grid-row:2/3; }
.card-red { background-color:#C8102E; grid-column:2/3; grid-row:2/3; }
.card-black { background-color:#1a1a1a; grid-column:3/4; grid-row:1/3; padding:30px; border-radius:8px; color:#fff; }
.card-black ul { list-style:none; padding-left:0; margin:10px 0 0 0; display:flex; flex-direction:column; gap:10px; }
.card-black li { margin:0; padding-left:18px; position:relative; line-height:1.4; }
.card-black li::before { content:"●"; position:absolute; left:0; color:var(--accent); }

/* Video container */
.video-container { position:relative; padding-bottom:56.25%; height:0; overflow:hidden; border-radius:12px; }
.video-container iframe { position:absolute; top:0; left:0; width:100%; height:100%; border:0; }

/* Responsive */
@media(max-width:1024px) {
  .links-grid { grid-template-columns:repeat(2,1fr); }
  .stats-grid { grid-template-columns:repeat(2,1fr); }
}
@media(max-width:768px) {
  body { padding-top: 130px; }
  .hero h1 { font-size:2.8rem; }
  .hero p { font-size:1.2rem; }
  .links-grid, .stats-grid { grid-template-columns:1fr; gap:30px; }
  .quick-links h2, .mission-banner h2, .cta-section h2 { font-size:2rem; }
  .engagement-grid { grid-template-columns:1fr; grid-template-rows:auto; }
  .card-black ul { gap:8px; }

  /* Menu mobile */
  .nav-menu {
    display: none;
    position: absolute;
    top:100px;
    left:0;
    right:0;
    flex-direction: column;
    padding:20px;
    box-shadow:0 10px 40px rgba(12,18,26,0.08);
    background:#000;
    gap:15px;
    z-index:1000;
  }
  .nav-menu.active {
    display:flex !important;
  }

  .hamburger { display:flex; }

  /* Dropdown mobile */
  .dropdown-menu {
    display:none;
    flex-direction: column;
    padding-left:10px;
  }
  .dropdown-menu.show {
    display:flex !important;
  }
}

/* Correction du scroll des ancres */
:target { scroll-margin-top: 160px; }