/* ============ RZB v7 — Kinetic Editorial (light) ============ */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--text);font-size:var(--t-base);line-height:1.45;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{margin:0;font-family:var(--display);font-weight:400;line-height:.92;letter-spacing:-.01em}
p{margin:0}
.italic{font-style:italic}
:focus-visible{outline:3px solid var(--red);outline-offset:2px}
.skip{position:absolute;left:-999px;background:var(--ink);color:#fff;padding:.7rem 1.2rem;z-index:600}.skip:focus{left:0}
.todo{font-family:var(--mono);font-size:.7em;font-weight:700;color:var(--red);text-transform:uppercase;letter-spacing:.03em}
.kick{font-family:var(--mono);font-size:var(--t-sm);font-weight:700;text-transform:uppercase;letter-spacing:.18em;color:var(--ink);display:inline-block;border:var(--bw) solid var(--ink);padding:.35rem .7rem;margin-bottom:1.4rem}
.h2{font-size:var(--t-xl)}.h2.big{font-size:var(--t-mega)}

/* progress + curseur */
.progress{position:fixed;top:0;left:0;height:4px;width:0;background:var(--red);z-index:500}

/* Preloader */
.pl{position:fixed;inset:0;z-index:700;background:var(--paper);display:grid;place-items:center;overflow:hidden}
.pl-mark{font-family:var(--display);font-size:var(--t-giant);color:var(--ink);line-height:.8}
.pl-num{position:absolute;bottom:6vh;right:var(--pad);font-family:var(--mono);font-weight:700;font-size:clamp(2rem,6vw,4rem);color:var(--red)}
.pl-flood{position:absolute;inset:0;background:var(--navy);transform:translateY(101%)}
.loaded .pl{display:none}

/* Header */
.hd{position:fixed;top:0;left:0;right:0;z-index:400;display:flex;align-items:center;gap:1rem;padding:.7rem var(--pad);border-bottom:var(--bw) solid transparent;transition:background .3s,border-color .3s}
.hd.stick{background:var(--paper);border-color:var(--ink)}
.hd-brand{display:flex;align-items:center;gap:.55rem;font-family:var(--display);font-size:1.15rem}
.hd-brand img{width:42px;height:42px;object-fit:contain}
.hd .btn{margin-left:auto}
.burger{display:none;flex-direction:column;gap:6px;background:none;border:0;margin-left:auto;padding:6px}
.burger span{width:28px;height:var(--bw);background:var(--ink);display:block}

/* Boutons */
.btn{display:inline-flex;align-items:center;gap:.5em;font-family:var(--mono);font-weight:700;text-transform:uppercase;letter-spacing:.04em;font-size:var(--t-sm);padding:.7em 1.2em;border:var(--bw) solid var(--ink);background:var(--paper);color:var(--ink);transition:background .25s var(--ease),color .25s var(--ease),transform .2s}
.btn.invert:hover{background:var(--red);color:#fff;border-color:var(--red)}
.btn.big{font-size:var(--t-base);padding:1em 1.6em}
.btn-block{width:100%;justify-content:center}

/* ============ HERO ============ */
.hero{padding:clamp(6rem,14vh,10rem) var(--pad) var(--pad);border-bottom:var(--bw) solid var(--ink)}
.hero-top{display:flex;gap:.6rem;flex-wrap:wrap;margin-bottom:clamp(1.5rem,4vw,3rem)}
.tag{font-family:var(--mono);font-size:var(--t-sm);text-transform:uppercase;letter-spacing:.08em;border:var(--bw) solid var(--ink);padding:.3rem .7rem}
.hero-h{font-size:var(--t-giant);letter-spacing:-.02em;line-height:.92}
.hero-h .hl{display:block;overflow:hidden}
.hero-h .hw{display:inline-block}
.hw[data-c=abobo]{color:var(--abobo)}.hw[data-c=red]{color:var(--red)}.hw[data-c=ink]{color:var(--ink)}
.hero-bottom{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.5rem,4vw,4rem);align-items:end;margin-top:clamp(2rem,5vw,4rem)}
.hero-img{margin:0;border:var(--bw) solid var(--ink);overflow:hidden;aspect-ratio:16/10}
.hero-img img{width:100%;height:100%;object-fit:cover;transform:scale(1.01)}
.hero-r{display:flex;flex-direction:column;gap:1.4rem;align-items:flex-start}
.hero-lead{font-size:var(--t-md);max-width:34ch}

/* Marquee */
.mq{border-bottom:var(--bw) solid var(--ink);overflow:hidden;white-space:nowrap;background:var(--paper)}
.mq-t{display:inline-flex;align-items:center;gap:1.2rem;padding:.5rem 0;font-family:var(--display);font-size:clamp(2.2rem,7vw,6rem);will-change:transform}
.mq-t em{color:var(--c);font-style:normal;text-transform:uppercase}
.mq-t i{font-style:normal;color:var(--ink);opacity:.4}

/* Manifeste */
.manif{padding:clamp(4rem,10vw,9rem) var(--pad);max-width:24ch;margin-inline:auto}
.manif-t{font-family:var(--display);font-size:var(--t-lg);line-height:1.15;text-align:left}
.manif-t em{font-style:normal;color:var(--c)}
.manif-t .word{transition:opacity .4s}

/* Approche */
.appr{border-top:var(--bw) solid var(--ink)}
.appr-head{padding:clamp(2.5rem,6vw,5rem) var(--pad) clamp(1.5rem,3vw,2.5rem)}
.appr-list{list-style:none;margin:0;padding:0}
.appr-row{display:grid;grid-template-columns:auto 1fr 1.4fr;gap:1rem clamp(1rem,4vw,4rem);align-items:baseline;padding:clamp(1.4rem,3vw,2.6rem) var(--pad);border-top:var(--bw) solid var(--ink);transition:background .3s,color .3s}
.appr-row:last-child{border-bottom:var(--bw) solid var(--ink)}
.appr-row .ar-n{font-family:var(--mono);font-size:var(--t-sm);color:var(--red)}
.appr-row h3{font-size:var(--t-lg)}
.appr-row p{font-size:var(--t-md);color:var(--ink-2);max-width:46ch}
.appr-row:hover{background:var(--navy);color:#fff}.appr-row:hover .ar-n{color:#fff}.appr-row:hover p{color:rgba(255,255,255,.82)}

/* ============ Chapitres communes (flood couleur) ============ */
.chapters{border-top:var(--bw) solid var(--ink)}
.chap-intro{padding:clamp(3rem,7vw,6rem) var(--pad) clamp(1.5rem,3vw,3rem)}
.chap{position:relative;display:grid;grid-template-columns:1.1fr 1fr;grid-template-areas:"media body";gap:0;border-top:var(--bw) solid var(--ink);overflow:hidden;transition:background .6s var(--ease)}
.chap.flood-in{background:color-mix(in srgb,var(--c) 16%,var(--paper))}
.chap:nth-child(even){grid-template-columns:1fr 1.1fr;grid-template-areas:"body media"}
.chap-num{position:absolute;top:.2rem;left:50%;transform:translateX(-50%);font-family:var(--display);font-size:clamp(5rem,16vw,15rem);color:var(--c);opacity:.16;line-height:1;z-index:0;pointer-events:none}
.chap-media{grid-area:media;border-right:var(--bw) solid var(--ink);overflow:hidden;aspect-ratio:1/1;position:relative;z-index:1}
.chap:nth-child(even) .chap-media{border-right:0;border-left:var(--bw) solid var(--ink)}
.chap-media img{width:100%;height:100%;object-fit:cover;will-change:transform}
.chap-media::after{content:"";position:absolute;inset:0;background:var(--c);mix-blend-mode:multiply;opacity:.18;transition:opacity .6s}
.chap:hover .chap-media::after{opacity:0}
.chap-body{grid-area:body;padding:clamp(1.6rem,4vw,4rem);display:flex;flex-direction:column;justify-content:center;gap:.8rem;position:relative;z-index:1}
.chap-place{font-family:var(--mono);font-size:var(--t-sm);text-transform:uppercase;letter-spacing:.08em;color:var(--ink);border-bottom:var(--bw) solid var(--c);padding-bottom:.3rem;align-self:flex-start}
.chap-h{font-size:var(--t-mega)}
.chap-body p{font-size:var(--t-md);max-width:40ch;color:var(--ink-2)}

/* Impact */
.impact{border-top:var(--bw) solid var(--ink);padding:clamp(3rem,7vw,6rem) var(--pad)}
.imp-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border:var(--bw) solid var(--ink);margin-top:1.5rem}
.imp{padding:clamp(1.5rem,3vw,2.6rem);border-right:var(--bw) solid var(--ink)}
.imp:last-child{border-right:0}
.imp-n{display:block;font-family:var(--display);font-size:clamp(4rem,12vw,10rem);line-height:.82;letter-spacing:-.03em}
.imp:nth-child(1) .imp-n{color:var(--abobo)}.imp:nth-child(2) .imp-n{color:var(--bouake)}.imp:nth-child(3) .imp-n{color:var(--root)}
.imp-l{display:block;margin-top:.7rem;font-family:var(--mono);font-size:var(--t-sm);text-transform:uppercase;letter-spacing:.05em;color:var(--ink-2);max-width:20ch}
.imp-note{margin-top:1.5rem;font-family:var(--mono);font-size:var(--t-sm);color:var(--ink-2);max-width:60ch}

/* Cercle / don */
.cercle{border-top:var(--bw) solid var(--ink);display:grid;grid-template-columns:.85fr 1.15fr;gap:0}
.cercle-l{padding:clamp(2.5rem,6vw,5rem) var(--pad);border-right:var(--bw) solid var(--ink)}
.cercle-l h2{margin:.4rem 0 1rem}.cercle-l p{font-size:var(--t-md);color:var(--ink-2)}
.give{padding:clamp(1.8rem,4vw,3.5rem) var(--pad)}
.gfreq{display:inline-flex;border:var(--bw) solid var(--ink);margin-bottom:1.5rem}
.gf{border:0;background:none;font-family:var(--mono);font-weight:700;text-transform:uppercase;font-size:var(--t-sm);padding:.6em 1.2em;border-right:var(--bw) solid var(--ink)}
.gf:last-child{border-right:0}.gf.on{background:var(--ink);color:#fff}
.tiers{display:grid;grid-template-columns:repeat(2,1fr);gap:0;border:var(--bw) solid var(--ink);margin-bottom:1.4rem}
.tier{text-align:left;border:0;border-right:var(--bw) solid var(--ink);border-bottom:var(--bw) solid var(--ink);background:var(--paper);padding:1rem;display:flex;flex-direction:column;gap:.15rem;transition:background .2s,color .2s}
.tier:nth-child(2n){border-right:0}
.tier.wide{grid-column:1/-1;border-bottom:0;border-right:0}
.tier:hover{background:var(--paper-2)}
.tier.on{background:var(--red);color:#fff}
.tier b{font-family:var(--display);font-size:var(--t-md);display:flex;align-items:baseline;gap:.2em}.tier b i{font-family:var(--mono);font-size:.5em;font-style:normal;opacity:.7}
.tier span{font-size:.82rem}
.gsum{font-size:var(--t-md);margin-bottom:1.2rem}.gsum strong{font-family:var(--display);color:var(--red)}.tier.on span,.gf.on{}
.gimp{display:block;color:var(--root);font-weight:800;font-size:var(--t-base);margin-top:.2rem}
.pays{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center;margin-top:1.4rem;font-family:var(--mono);font-size:.72rem;text-transform:uppercase}
.pays ul{display:flex;flex-wrap:wrap;gap:.4rem;list-style:none;padding:0;margin:0}
.pays li{border:var(--bw) solid var(--ink);padding:.25rem .6rem;font-weight:700}
.todo-i{font-size:.62em}

/* Transparence */
.transp{border-top:var(--bw) solid var(--ink);display:grid;grid-template-columns:1fr 1fr;gap:0}
.tr-l{padding:clamp(2.5rem,6vw,5rem) var(--pad);border-right:var(--bw) solid var(--ink)}
.tr-l h2{margin:.4rem 0 1rem}.tr-l p{font-size:var(--t-md);color:var(--ink-2)}
.tr-r{padding:clamp(2rem,5vw,4rem) var(--pad);display:flex;flex-direction:column;gap:1rem;justify-content:center}
.al{position:relative;border:var(--bw) solid var(--ink);padding:1rem 1.1rem;display:grid;grid-template-columns:1fr auto;align-items:center;overflow:hidden}
.al::before{content:"";position:absolute;inset:0 auto 0 0;width:calc(var(--p)*1%);background:var(--c);opacity:.2;transform:scaleX(0);transform-origin:left}
.al.in::before{transform:scaleX(1);transition:transform 1s var(--ease)}
.al span{font-weight:600}.al b{font-family:var(--display)}

/* Footer */
.ft{border-top:var(--bw) solid var(--ink);background:var(--navy);color:#fff;padding:clamp(3rem,7vw,6rem) var(--pad) 0}
.ft-h{font-size:var(--t-mega);max-width:16ch;margin-bottom:2rem}.ft-h em{font-style:normal;color:var(--abobo)}
.ft .btn{border-color:#fff;color:#fff;background:transparent}.ft .btn.invert:hover{background:#fff;color:var(--navy);border-color:#fff}
.ft-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;padding:clamp(2.5rem,6vw,5rem) 0 2rem}
.ft-cols h4{font-family:var(--mono);text-transform:uppercase;font-size:var(--t-sm);letter-spacing:.1em;margin-bottom:.9rem;color:#fff}
.ft-cols a,.ft-cols p{display:block;color:rgba(255,255,255,.72);font-size:var(--t-sm);margin-bottom:.5rem}.ft-cols a:hover{color:#fff}
.ft .todo{color:var(--abobo)}
.ft-mark{overflow:hidden;white-space:nowrap;border-top:var(--bw) solid rgba(255,255,255,.25)}
.ft-mark-t{display:inline-block;font-family:var(--display);font-size:clamp(3rem,9vw,8rem);color:rgba(255,255,255,.12);padding:1rem 0;will-change:transform}
.ft-bot{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;font-family:var(--mono);font-size:.7rem;color:rgba(255,255,255,.55);padding:1.4rem 0;border-top:var(--bw) solid rgba(255,255,255,.25)}

/* reveal */
.no-js .pl{display:none}
.r{opacity:0;transform:translateY(40px)}.r.in{opacity:1;transform:none;transition:opacity .8s var(--ease),transform .8s var(--ease)}
.no-js .r{opacity:1;transform:none}

/* mobile nav */
.mnav{position:fixed;inset:0;background:var(--navy);z-index:380;display:flex;flex-direction:column;justify-content:center;gap:1rem;padding:var(--pad);opacity:0;pointer-events:none;transition:opacity .3s}
.mnav.open{opacity:1;pointer-events:auto}.mnav a{color:#fff;font-family:var(--display);font-size:var(--t-lg)}

@media (max-width:900px){
  .hd .btn{display:none}.burger{display:flex}
  .hero-bottom{grid-template-columns:1fr}
  .chap,.chap:nth-child(even){grid-template-columns:1fr;grid-template-areas:"media" "body"}
  .chap-media,.chap:nth-child(even) .chap-media{border:0;border-bottom:var(--bw) solid var(--ink);aspect-ratio:16/10}
  .cercle,.transp{grid-template-columns:1fr}
  .cercle-l,.tr-l{border-right:0;border-bottom:var(--bw) solid var(--ink)}
  .imp-grid{grid-template-columns:1fr}.imp{border-right:0;border-bottom:var(--bw) solid var(--ink)}.imp:last-child{border-bottom:0}
  .ft-cols{grid-template-columns:1fr 1fr}
}
@media (max-width:560px){.tiers{grid-template-columns:1fr 1fr}.ft-cols{grid-template-columns:1fr}.appr-row{grid-template-columns:auto 1fr}.appr-row p{grid-column:1/-1}}
