/* =========================================================
   Formes de composition
   Un vocabulaire réduit — disque, anneau, losange, arc, barre —
   posé en couche de fond pour donner de la structure et de la
   profondeur aux slides. Les formes débordent volontiers du cadre :
   c'est ce qui donne l'échelle.

   Règle : purement décoratif, jamais porteur d'information, jamais
   sous un bloc de texte à contraste serré.
   ========================================================= */

.shapes {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
}

.shape { position: absolute; }

.shape--disc    { border-radius: 50%; background: var(--gold-a08); }
.shape--ring    { border-radius: 50%; border: 2px solid var(--gold-a24); }
.shape--ring-thick { border-radius: 50%; border: 14px solid var(--gold-a08); }
.shape--diamond { rotate: 45deg; background: var(--gold-a14); }
.shape--diamond-line { rotate: 45deg; border: 2px solid var(--gold-a24); }
.shape--bar     { background: var(--gold-a14); border-radius: 999px; }
.shape--terra   { background: rgba(181, 83, 42, 0.14); }
.shape--terra-ring { border-radius: 50%; border: 2px solid rgba(181, 83, 42, 0.30); }

/* Quart de cercle plein — la forme la plus « africaine contemporaine »
   du vocabulaire, directement issue du motif de charte. */
.shape--quarter {
  background: var(--gold-a14);
  border-radius: 100% 0 0 0;
}
.shape--quarter-terra {
  background: rgba(181, 83, 42, 0.16);
  border-radius: 0 100% 0 0;
}

.slide--dark .shape--disc    { background: rgba(212, 162, 68, 0.07); }
.slide--dark .shape--ring    { border-color: rgba(212, 162, 68, 0.22); }
.slide--dark .shape--ring-thick { border-color: rgba(212, 162, 68, 0.07); }
.slide--dark .shape--diamond { background: rgba(212, 162, 68, 0.10); }
.slide--dark .shape--diamond-line { border-color: rgba(212, 162, 68, 0.22); }
.slide--dark .shape--bar     { background: rgba(212, 162, 68, 0.14); }
.slide--dark .shape--quarter { background: rgba(212, 162, 68, 0.055); }

/* ---------------------------------------------------------
   Placements par slide
   --------------------------------------------------------- */

/* Slide 2 · les trois visages — un mur d'arcs qui ferme l'horizon */
.slide-personas .shape-a { top: -160px; right: -120px; width: 460px; height: 460px; }
.slide-personas .shape-b { bottom: -220px; left: -140px; width: 420px; height: 420px; }
.slide-personas .shape-c { top: 120px; left: 46%; width: 26px; height: 26px; }

/* Slide 3 · la révélation — deux anneaux concentriques autour du mot */
.slide-or .shape-a { top: 238px; left: 50%; width: 1000px; height: 1000px; margin: -500px 0 0 -500px; }
.slide-or .shape-b { top: 238px; left: 50%; width: 660px; height: 660px; margin: -330px 0 0 -330px; }
.slide-or .shape-c { bottom: -180px; right: -120px; width: 420px; height: 420px; }

/* Slide 4 · la trajectoire — une diagonale qui monte */
.slide-fems .shape-a { top: -140px; right: 8%; width: 340px; height: 340px; }
.slide-fems .shape-b { bottom: -100px; right: -60px; width: 300px; height: 300px; }

/* Slide 5 · le marché — l'océan, une masse en bas à droite */
.slide-modele .shape-a { bottom: -280px; right: -180px; width: 700px; height: 700px; }
.slide-modele .shape-b { top: -130px; right: 6%; width: 240px; height: 240px; }

/* Slide 6 · la preuve — géométrie ferme, angles marqués */
.slide-traction .shape-a { top: -110px; right: -120px; width: 520px; height: 520px; }
.slide-traction .shape-b { bottom: -140px; left: -100px; width: 340px; height: 340px; }
.slide-traction .shape-c { top: 44%; right: 46%; width: 22px; height: 22px; }

/* Slide 7 · l'équipe — une masse douce derrière les visages */
.slide-equipe .shape-a { top: -240px; right: -160px; width: 560px; height: 560px; }
.slide-equipe .shape-b { bottom: -60px; left: -70px; width: 150px; height: 150px; }

/* Slide 8 · les trois piliers — trois arcs, un par colonne */
.slide-impact .shape-a { top: -200px; left: -120px; width: 400px; height: 400px; }
.slide-impact .shape-b { bottom: -240px; right: -140px; width: 480px; height: 480px; }

/* Slide 9 · l'ambition — les ondes sont sur la carte, cf. slide-layouts.css */
.slide-ambition .shape-c { bottom: -160px; right: -80px; width: 360px; height: 360px; }

/* Slide 10 · l'appel — la lumière monte du bas.
   Halo dégradé et non disque plein : un disque laissait un bord net,
   qui se lisait comme une découpe au lieu d'une lumière. */
.slide-appel .shape-a {
  bottom: -460px; left: 50%; width: 1280px; height: 1280px; margin-left: -640px;
  border-radius: 50%;
  background: radial-gradient(closest-side,
    rgba(212, 162, 68, 0.16) 0%,
    rgba(212, 162, 68, 0.07) 52%,
    rgba(212, 162, 68, 0) 100%);
}
.slide-appel .shape-b { top: -140px; left: -120px; width: 340px; height: 340px; }