/* ==================================================================
   CIVIS-CI — Styles spécifiques à la page d'accueil
   ================================================================== */

/* === HERO === */
.hero{ background:var(--green-darkest); color:#fff; position:relative; overflow:hidden; }
.hero-bg{
  position:absolute; inset:0;
  background:
    repeating-linear-gradient(135deg, rgba(255,255,255,.04) 0 2px, transparent 2px 16px),
    linear-gradient(180deg, #173d24, #0a2014);
}
.hero-bg::before{
  content:""; position:absolute; inset:0;
  background:
    radial-gradient(circle at 75% 35%, rgba(224,101,30,.25), transparent 45%),
    radial-gradient(circle at 30% 75%, rgba(44,110,63,.4), transparent 50%);
}
/* l'orbe de l'accueil est plus grande que celle des pages internes */
.hero .dots-orb{
  right:-120px; top:50%; transform:translateY(-50%);
  width:680px; height:680px; opacity:.6;
}
.hero-inner{
  position:relative; padding:100px 0 120px;
  display:grid; grid-template-columns: 1.2fr 1fr; gap:48px; align-items:center;
}
.hero h1{
  font-family: system-ui;
  font-size:clamp(54px, 6.5vw, 96px); font-weight:800;
  letter-spacing:-0.035em; line-height:0.98; margin:28px 0 28px;
}
.hero h1 .serif{ font-family:'Newsreader', serif; font-style:italic; font-weight:500; color:#F3C39B; letter-spacing:-0.02em; }
.hero h1 .pop{ color:var(--orange); }
.hero .lead{ font-size:18px; color:rgba(255,255,255,.78); max-width:540px; margin-bottom:36px; line-height:1.55; }
.hero-cta{display:flex; gap:14px; flex-wrap:wrap}
.hero-bottom{
  position:relative; padding:24px 0 32px;
  border-top:1px solid rgba(255,255,255,.15);
  display:grid; grid-template-columns:repeat(4,1fr); gap:24px; align-items:center;
}
.hero-bottom .bt-label{
  font-family:'JetBrains Mono', monospace; font-size:11px; letter-spacing:.14em;
  text-transform:uppercase; color:rgba(255,255,255,.55);
}
.hero-bottom .bt-val{ font-family:'Newsreader', serif; font-size:22px; color:#fff; margin-top:6px; font-weight:500; }
.hero-bottom .bt-val .accent{color:var(--orange); font-weight:600}

/* === TICKER === */
.ticker{ background:var(--orange); color:#fff; overflow:hidden; border-top:1px solid rgba(0,0,0,.1); border-bottom:1px solid rgba(0,0,0,.1); }
.ticker-track{
  display:flex; gap:64px; padding:14px 0; white-space:nowrap;
  animation: marquee 40s linear infinite;
  font-family:'JetBrains Mono', monospace; font-size:13px; letter-spacing:.06em; text-transform:uppercase; font-weight:500;
}
.ticker-track span{display:inline-flex; align-items:center; gap:14px}
.ticker-track .sep{ width:8px; height:8px; border-radius:50%; background:#fff; opacity:.9; }
@keyframes marquee { from{transform:translateX(0)} to{transform:translateX(-50%)} }

/* === SECTIONS DE L'ACCUEIL === */
section{ padding:120px 0; position:relative; }

/* En-tête de section : disposition en grille (titre + bouton alignés) */
.mission .section-head, .news .section-head, .events .section-head, .cta-section .section-head{
  display:grid; grid-template-columns: auto 1fr auto; gap:32px; align-items:end;
  margin-bottom:64px; max-width:none;
}
.mission .section-head h2, .news .section-head h2, .events .section-head h2, .cta-section .section-head h2{
  font-size:clamp(40px, 4.5vw, 64px); max-width:780px; line-height:1.02; grid-column:1 / 3;
}
.mission .section-head .num, .news .section-head .num, .events .section-head .num, .cta-section .section-head .num{
  font-family:'JetBrains Mono', monospace; font-size:13px; color:var(--ink-3);
  letter-spacing:.12em; align-self:start; padding-top:8px; margin-bottom:0;
}

/* === MISSION / VISION / VALEURS === */
.mission{background:var(--cream)}
.mvv-grid{ display:grid; grid-template-columns: repeat(3, 1fr); gap:20px; }
.mvv-card{
  background:#fff; border-radius:24px; padding:36px 32px;
  display:flex; flex-direction:column; gap:18px; min-height:340px;
  border:1px solid var(--rule); transition:transform .25s ease, box-shadow .25s ease;
}
.mvv-card:hover{ transform:translateY(-3px); box-shadow:0 24px 50px -30px rgba(15,45,26,.3); }
.mvv-card .num-pill{
  display:inline-flex; align-items:center; gap:8px;
  font-family:'JetBrains Mono', monospace; font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--green);
}
.mvv-card .num-pill .dot{width:8px; height:8px; border-radius:50%; background:var(--green)}
.mvv-card.b .num-pill, .mvv-card.b .num-pill .dot{color:var(--orange)}
.mvv-card.b .num-pill .dot{background:var(--orange)}
.mvv-card.c .num-pill{color:#A24A48}
.mvv-card.c .num-pill .dot{background:#A24A48}
.mvv-card h3{ font-family:'Newsreader', serif; font-size:34px; font-weight:600; letter-spacing:-0.015em; line-height:1.1; }
.mvv-card p{color:var(--ink-2); font-size:15.5px; line-height:1.65}
.mvv-card .link{ margin-top:auto; font-size:13px; font-weight:700; display:inline-flex; gap:8px; align-items:center; text-transform:uppercase; letter-spacing:.08em; }

/* === CHIFFRES IMPACT === */
.impact{ background:var(--ink); color:#fff; }
.impact-grid{ display:grid; grid-template-columns: 1.1fr 1fr; gap:64px; }
.impact-left h2{ font-size:clamp(40px, 4.5vw, 64px); line-height:1.02; }
.impact-left .lead{ margin-top:24px; font-size:17px; color:rgba(255,255,255,.7); max-width:480px; }
.impact-left .pill-tag{color:#F3C39B}
.impact-left .download{
  margin-top:36px; display:inline-flex; align-items:center; gap:10px;
  padding:14px 22px; border:1.5px solid rgba(255,255,255,.3); border-radius:999px; color:#fff; font-weight:600; font-size:13px;
}
.impact-left .download:hover{background:#fff; color:var(--ink)}
.impact-right{
  display:grid; grid-template-columns: 1fr 1fr; gap:1px;
  background:rgba(255,255,255,.15); border:1px solid rgba(255,255,255,.15); border-radius:24px; overflow:hidden;
}
.stat-cell{ background:var(--ink); padding:32px 28px; display:flex; flex-direction:column; gap:8px; min-height:160px; position:relative; }
.stat-cell .n{
  font-family:'Newsreader', serif; font-size:64px; line-height:1; font-weight:600; color:var(--orange);
  letter-spacing:-0.03em; display:flex; align-items:baseline; gap:6px;
}
.stat-cell .n .u{font-size:22px; color:#F3C39B; font-weight:500}
.stat-cell .l{ color:rgba(255,255,255,.7); font-size:13.5px; line-height:1.5; margin-top:auto; }
.stat-cell .top{ font-family:'JetBrains Mono', monospace; font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:rgba(255,255,255,.5); }

/* === ACTUS === */
.news{background:var(--paper)}
.news-grid{ display:grid; grid-template-columns: 1fr 1fr 1fr; gap:24px; }
.article{
  background:#fff; border-radius:20px; border:1px solid var(--rule); overflow:hidden;
  display:flex; flex-direction:column; transition:transform .25s ease, box-shadow .25s ease;
}
.article:hover{transform:translateY(-3px); box-shadow:0 24px 50px -30px rgba(15,45,26,.3)}
.article-cover{
  aspect-ratio: 4/3;
  background: repeating-linear-gradient(135deg, #cbb78a 0 2px, transparent 2px 14px), linear-gradient(180deg, #b8a373, #8a7a52);
  display:flex; align-items:flex-end; padding:14px; position:relative;
}
.article:nth-child(2) .article-cover{ background: repeating-linear-gradient(135deg, #c5d4b8 0 2px, transparent 2px 14px), linear-gradient(180deg, #95a87f, #5d7048); }
.article:nth-child(3) .article-cover{ background: repeating-linear-gradient(135deg, #e8c3a0 0 2px, transparent 2px 14px), linear-gradient(180deg, #d4a07a, #a06d4d); }
.article-cover .placeholder-label{ font-family:'JetBrains Mono', monospace; font-size:10px; color:#3a3328; background:rgba(255,255,255,.85); padding:5px 9px; border-radius:6px; }
.article-cover .badge{
  position:absolute; top:14px; left:14px; background:#fff; padding:6px 12px; border-radius:999px;
  font-family:'JetBrains Mono', monospace; font-size:10px; letter-spacing:.12em; text-transform:uppercase; color:var(--orange); font-weight:600;
}
.article-body{padding:28px}
.article-date{ font-family:'JetBrains Mono', monospace; font-size:11px; color:var(--ink-3); letter-spacing:.1em; text-transform:uppercase; margin-bottom:14px; }
.article h3{ font-family:'Newsreader', serif; font-size:23px; font-weight:600; letter-spacing:-0.01em; line-height:1.2; margin-bottom:14px; }
.article p{ color:var(--ink-2); font-size:14.5px; line-height:1.6; margin-bottom:20px; }
.article .read{ font-size:13px; font-weight:700; color:var(--ink); display:inline-flex; gap:8px; align-items:center; text-transform:uppercase; letter-spacing:.08em; }
.article .read:hover{color:var(--orange)}

/* === EVENEMENTS === */
.events{background:var(--cream)}
.ev-wrap{ display:grid; grid-template-columns: 1fr 1fr 1fr; gap:20px; }
.ev-card{
  background:#fff; border-radius:20px; padding:28px; border:1px solid var(--rule);
  display:flex; flex-direction:column; gap:18px; min-height:280px; position:relative; overflow:hidden; transition:transform .25s ease;
}
.ev-card:hover{transform:translateY(-3px)}
.ev-card.featured{ background:var(--green-deep); color:#fff; grid-row:span 2; min-height:580px; }
.ev-card .ev-top{ display:flex; align-items:center; justify-content:space-between; margin-bottom:8px; }
.ev-card .ev-format{
  font-family:'JetBrains Mono', monospace; font-size:11px; letter-spacing:.1em; text-transform:uppercase;
  color:var(--green); display:inline-flex; align-items:center; gap:8px;
}
.ev-card .ev-format .dot{width:8px; height:8px; border-radius:50%; background:var(--green)}
.ev-card.featured .ev-format{color:#F3C39B}
.ev-card.featured .ev-format .dot{background:var(--orange)}
.ev-card .ev-date-big{ font-family:'Newsreader', serif; font-size:64px; line-height:1; font-weight:600; letter-spacing:-0.03em; }
.ev-card .ev-date-big .month{ font-size:18px; color:var(--ink-3); margin-left:6px; font-family:'JetBrains Mono', monospace; letter-spacing:.06em; text-transform:uppercase; font-weight:400; }
.ev-card.featured .ev-date-big .month{color:rgba(255,255,255,.6)}
.ev-card.featured h3{ font-family:'Newsreader', serif; font-size:36px; font-weight:600; line-height:1.1; }
.ev-card h4{ font-family:'Newsreader', serif; font-size:21px; font-weight:600; line-height:1.2; }
.ev-card .ev-meta{ font-size:13px; color:var(--ink-2); display:flex; flex-direction:column; gap:4px; }
.ev-card.featured .ev-meta{color:rgba(255,255,255,.75)}
.ev-card.featured p{color:rgba(255,255,255,.85); font-size:15px; line-height:1.6}
.ev-card .ev-cta{ margin-top:auto; font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.1em; display:inline-flex; gap:8px; align-items:center; }

/* === CTA TRIPTYQUE === */
.cta-section{background:var(--paper); padding-bottom:120px}
.cta-grid{ display:grid; grid-template-columns:repeat(3, 1fr); gap:20px; }
.cta-card{ border-radius:24px; padding:42px 36px; min-height:340px; display:flex; flex-direction:column; gap:20px; position:relative; overflow:hidden; }
.cta-card .ic{ width:56px; height:56px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; background:rgba(255,255,255,.15); border:1.5px solid currentColor; }
.cta-card .ic svg{width:26px; height:26px}
.cta-card h3{font-family:'Archivo', sans-serif; font-size:32px; line-height:1.1; font-weight:800; letter-spacing:-0.02em}
.cta-card p{font-size:15px; line-height:1.6; flex:1}
.cta-card .gobtn{ align-self:flex-start; margin-top:8px; }
.cta-donate{background:var(--orange); color:#fff}
.cta-donate p{color:rgba(255,255,255,.88)}
.cta-engage{background:var(--cream); color:var(--ink); border:1px solid var(--rule)}
.cta-engage p{color:var(--ink-2)}
.cta-engage .ic{background:#fff; border-color:var(--green); color:var(--green)}
.cta-report{background:var(--green-deep); color:#fff}
.cta-report p{color:rgba(255,255,255,.82)}

/* === PARTENAIRES === */
.partners{background:var(--cream); padding:80px 0}
.partners h3{ font-family:'Archivo', sans-serif; font-size:14px; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-2); font-weight:600; text-align:center; margin-bottom:40px; }
.partners-grid{ display:grid; grid-template-columns:repeat(6,1fr); gap:24px; align-items:center; }
.partner{
  aspect-ratio: 16/9; background:#fff; border-radius:14px; border:1px solid var(--rule);
  display:flex; align-items:center; justify-content:center; padding:16px; text-align:center;
  font-family:'Newsreader', serif; font-size:13px; font-weight:500; color:var(--ink-2); line-height:1.2; transition:transform .2s ease;
}
.partner:hover{transform:translateY(-2px); border-color:var(--orange)}

/* carrousel auto-défilant des partenaires (mobile uniquement) */
.partners-marquee{ display:none; overflow:hidden; }
.pm-track{ display:flex; gap:14px; width:max-content; animation:pmscroll 24s linear infinite; }
.partners-marquee .partner{ flex:0 0 calc((100vw - 72px - 28px) / 3); }
.partners-marquee:hover .pm-track{ animation-play-state:paused; }
@keyframes pmscroll{ from{transform:translateX(0)} to{transform:translateX(-50%)} }

/* === RESPONSIVE === */
@media (max-width: 1000px){
  .hero-inner, .impact-grid, .ev-wrap, .mvv-grid, .news-grid, .cta-grid{grid-template-columns:1fr}
  .ev-card.featured{grid-row:auto; min-height:0}
  .partners-grid{grid-template-columns:repeat(3,1fr)}
  .hero-bottom{grid-template-columns:1fr 1fr}
  .mission .section-head, .news .section-head, .events .section-head, .cta-section .section-head{grid-template-columns:1fr; gap:16px}
  .mission .section-head h2, .news .section-head h2, .events .section-head h2, .cta-section .section-head h2{grid-column:auto}
}
@media (max-width: 600px){
  .partners-grid{ display:none; }       /* remplacée par le carrousel */
  .partners-marquee{ display:block; }
}