/* ==========================================================================
   Garifonda — CSS spécifique à chaque page publique.
   Rempli en Phase 2, page par page, directement à partir du fichier
   mockup correspondant (heros, sections de contenu, galeries,
   dictionnaire, formulaires...). Volontairement vide à l'issue de la
   Phase 1 : voir assets/css/site.css pour le chrome partagé déjà en place
   (header, nav, footer, boutons, tokens).
   ========================================================================== */

/* ================================ ACCUEIL ================================ */
body.page-accueil .hero{position:relative;background:var(--ink);color:var(--white);overflow:hidden;border-bottom:3px solid var(--coral);}
body.page-accueil .hero::after{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.09) 1px, transparent 1px);background-size:14px 14px;pointer-events:none;}
body.page-accueil .hero-grid{display:grid;grid-template-columns:1.35fr .65fr;gap:56px;align-items:center;padding:80px 32px 68px;max-width:1180px;margin:0 auto;position:relative;}
body.page-accueil .hero h1{font-size:clamp(38px,5.4vw,64px);color:var(--white);letter-spacing:-0.01em;}
body.page-accueil .hero p{font-size:18px;max-width:46ch;color:rgba(255,255,255,.82);margin:0 0 30px;}
body.page-accueil .hero .ph{height:360px;border-color:rgba(255,255,255,.35);color:rgba(255,255,255,.75);background:repeating-linear-gradient(135deg, rgba(255,255,255,.07) 0 12px, rgba(255,255,255,.02) 12px 24px), rgba(255,255,255,.05);}

body.page-accueil .stats{background:var(--sand);}
body.page-accueil .stats-grid{display:grid;grid-template-columns:1.3fr 1fr .8fr;max-width:1180px;margin:0 auto;padding:0;}
body.page-accueil .stat:nth-child(1){background:var(--teal);}
body.page-accueil .stat:nth-child(2){background:var(--coral);}
body.page-accueil .stat:nth-child(3){background:var(--gold);}
body.page-accueil .stat{padding:32px 32px;text-align:left;}
body.page-accueil .stat b{display:block;font-family:var(--serif);font-size:34px;color:var(--white);}
body.page-accueil .stat span{font-size:14px;font-weight:600;color:rgba(255,255,255,.85);}

body.page-accueil .mission{display:grid;grid-template-columns:.85fr 1.15fr;gap:56px;align-items:center;}
body.page-accueil .mission .ph{height:400px;}
body.page-accueil .mission blockquote{font-family:var(--serif);font-size:24px;line-height:1.4;margin:0 0 20px;color:var(--ink);}
body.page-accueil .mission p{font-size:16px;color:rgba(28,23,18,.78);}

body.page-accueil .dico{background:var(--sand-deep);}
body.page-accueil .dico .ph{height:320px;}
body.page-accueil .dico-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;}
body.page-accueil .mini-flash-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:24px;}
body.page-accueil .flip-card{height:110px;perspective:1000px;}
body.page-accueil .flip-card-inner{position:relative;width:100%;height:100%;transition:transform .5s;transform-style:preserve-3d;cursor:pointer;}
body.page-accueil .flip-card.flipped .flip-card-inner{transform:rotateY(180deg);}
body.page-accueil .flip-front,body.page-accueil .flip-back{position:absolute;inset:0;backface-visibility:hidden;border-radius:3px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:8px;}
body.page-accueil .flip-front{background:var(--white);border:2px solid var(--teal);}
body.page-accueil .flip-front b{font-size:14px;color:var(--ink);}
body.page-accueil .flip-front small{font-size:9.5px;color:rgba(28,23,18,.4);margin-top:5px;}
body.page-accueil .flip-back{background:var(--teal);color:var(--white);transform:rotateY(180deg);}
body.page-accueil .flip-back b{font-family:var(--serif);font-size:16px;display:block;}

@media (max-width:860px){
  body.page-accueil .hero-grid,body.page-accueil .mission,body.page-accueil .prog-grid,body.page-accueil .dico-grid{grid-template-columns:1fr;}
  body.page-accueil .stats-grid{grid-template-columns:1fr;}
  body.page-accueil .stat{padding:26px 32px;}
}
@media (max-width:600px){body.page-accueil .mini-flash-grid{grid-template-columns:1fr 1fr;}}

/* ============================ QUI SOMMES-NOUS ============================ */
body.page-qui-sommes-nous .miguel{display:grid;grid-template-columns:.85fr 1.15fr;gap:48px;align-items:center;}
body.page-qui-sommes-nous .miguel .ph{height:400px;}
body.page-qui-sommes-nous .miguel blockquote{font-family:var(--serif);font-size:22px;line-height:1.4;margin:0 0 18px;color:var(--ink);}
body.page-qui-sommes-nous .miguel .facts{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px;}
body.page-qui-sommes-nous .miguel .fact{background:var(--sand-deep);border-radius:2px;padding:8px 16px;font-size:13px;font-weight:600;color:var(--ink);}

body.page-qui-sommes-nous .engagements{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin-top:32px;}
body.page-qui-sommes-nous .engagement{background:var(--white);border-left:4px solid var(--coral);border-radius:0 3px 3px 0;padding:22px 24px;}
body.page-qui-sommes-nous .engagement h4{font-size:16px;margin:0 0 8px;}
body.page-qui-sommes-nous .engagement p{font-size:14px;color:rgba(28,23,18,.72);margin:0;line-height:1.55;}

body.page-qui-sommes-nous .big-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:32px;}
body.page-qui-sommes-nous .big-stat{border-radius:2px;padding:32px 28px;color:var(--white);}
body.page-qui-sommes-nous .big-stat b{display:block;font-family:var(--serif);font-size:38px;line-height:1;}
body.page-qui-sommes-nous .big-stat span{font-size:14px;opacity:.9;}
body.page-qui-sommes-nous .chip-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:20px;}
body.page-qui-sommes-nous .chip{background:var(--white);border:1px solid var(--line);border-radius:4px;padding:10px 20px;font-size:14px;font-weight:600;display:flex;align-items:center;gap:8px;}

body.page-qui-sommes-nous .bands{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:16px;}
body.page-qui-sommes-nous .band{border-radius:4px;padding:32px;color:var(--white);}
body.page-qui-sommes-nous .band h3{color:var(--white);font-size:20px;margin-bottom:8px;}
body.page-qui-sommes-nous .band p{font-size:14.5px;color:rgba(255,255,255,.85);margin:0 0 18px;}
body.page-qui-sommes-nous .band a{color:var(--white);font-weight:700;text-decoration:none;font-size:14px;}

@media (max-width:860px){
  body.page-qui-sommes-nous .big-stats{grid-template-columns:1fr;}
  body.page-qui-sommes-nous .bands{grid-template-columns:1fr;}
  body.page-qui-sommes-nous .miguel{grid-template-columns:1fr;}
  body.page-qui-sommes-nous .engagements{grid-template-columns:1fr;}
}

/* =============================== CONSTRUCTION ============================= */
/* .page-hero propre à cette page : pas de photo plein cadre, motif pointillé
   (pas le fondu sombre des autres pages intérieures), padding simple. */
body.page-construction .page-hero{background:var(--ink);color:var(--white);position:relative;overflow:hidden;padding:56px 0 48px;border-bottom:3px solid var(--coral);min-height:0;display:block;}
body.page-construction .page-hero::after{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.09) 1px, transparent 1px);background-size:14px 14px;pointer-events:none;}
body.page-construction .page-hero .wrap{position:relative;padding:0 32px;max-width:1180px;margin:0 auto;}
body.page-construction .page-hero h1{max-width:16ch;}

body.page-construction .dual-cta{display:grid;grid-template-columns:1fr 1fr;gap:20px;padding:36px 0 0;}
body.page-construction .cta-card{border-radius:2px;padding:28px 30px;display:flex;align-items:center;gap:20px;}
body.page-construction .cta-card .icon-circle{width:56px;height:56px;border-radius:50%;background:rgba(255,255,255,.2);display:flex;align-items:center;justify-content:center;font-size:26px;flex-shrink:0;}
body.page-construction .cta-card h3{color:var(--white);font-size:18px;margin:0 0 6px;}
body.page-construction .cta-card p{color:rgba(255,255,255,.85);font-size:13.5px;margin:0 0 14px;line-height:1.5;}
body.page-construction .cta-card a{display:inline-block;background:var(--white);font-weight:700;font-size:13.5px;padding:9px 18px;border-radius:2px;text-decoration:none;}

body.page-construction .enjeu-grid{display:grid;grid-template-columns:1fr 1fr;gap:0;border:1px solid var(--line);}
body.page-construction .enjeu{padding:36px;}
body.page-construction .enjeu:first-child{border-right:1px solid var(--line);background:var(--sand-deep);}
body.page-construction .enjeu h3{font-size:18px;margin-bottom:10px;}
body.page-construction .enjeu p{font-size:15px;color:rgba(28,23,18,.75);margin:0;}

body.page-construction .etapes{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:32px;}
body.page-construction .etape{background:var(--white);border:1px solid var(--line);padding:22px;}
body.page-construction .etape .n{font-family:var(--serif);font-size:28px;color:var(--coral);margin-bottom:8px;display:block;}
body.page-construction .etape h4{font-size:15px;margin:0 0 6px;}
body.page-construction .etape p{font-size:13.5px;color:rgba(28,23,18,.7);margin:0;}

body.page-construction .temoignages{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:32px;}
body.page-construction .temoin{background:var(--white);border-radius:4px;padding:24px;border:1px solid var(--line);}
body.page-construction .temoin p{font-style:italic;font-size:14.5px;color:rgba(28,23,18,.8);margin:0 0 14px;line-height:1.6;}
body.page-construction .temoin .auteur{font-size:12.5px;font-weight:700;color:var(--coral);}

@media (max-width:860px){
  body.page-construction .enjeu-grid{grid-template-columns:1fr;}
  body.page-construction .enjeu:first-child{border-right:none;border-bottom:1px solid var(--line);}
  body.page-construction .etapes{grid-template-columns:1fr 1fr;}
  body.page-construction .dual-cta{grid-template-columns:1fr;}
  body.page-construction .temoignages{grid-template-columns:1fr;}
}

/* =============================== LES GARÍFUNAS ============================= */
/* Réglages typographiques propres à cette page (section 21 des notes : version
   resserrée, padding et polices réduits) */
body.page-garifunas{line-height:1.6;}
body.page-garifunas h1,body.page-garifunas h2,body.page-garifunas h3{line-height:1.15;}
body.page-garifunas section{padding:72px 0;}
body.page-garifunas .eyebrow{color:var(--coral);margin-bottom:14px;}
body.page-garifunas .article{max-width:740px;}
body.page-garifunas .article p{font-size:16.5px;line-height:1.75;color:rgba(18,46,51,.82);margin:0 0 20px;}

/* Hero plein cadre plus grand que la base (420px, cf. décision Phase 1) */
body.page-garifunas .page-hero{min-height:420px;}
body.page-garifunas .page-hero .wrap{padding:120px 32px 48px;}
body.page-garifunas .page-hero h1{font-size:clamp(32px,4.4vw,48px);max-width:18ch;}
body.page-garifunas .page-hero p{font-size:18px;max-width:58ch;}

body.page-garifunas .map-section{background:var(--white);}
body.page-garifunas .map-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:48px;align-items:center;}
body.page-garifunas .map-frame{border-radius:2px;overflow:hidden;box-shadow:8px 8px 0 rgba(18,46,51,.12);border:1px solid var(--line);}

body.page-garifunas .timeline{margin-top:20px;}
body.page-garifunas .tl-row{display:grid;grid-template-columns:80px 1fr;gap:18px;padding:14px 0;border-top:1px solid var(--line);}
body.page-garifunas .tl-row:last-child{border-bottom:1px solid var(--line);}
body.page-garifunas .tl-year{font-family:var(--serif);font-size:16px;color:var(--coral);font-weight:700;}
body.page-garifunas .tl-row h3{font-size:15px;margin-bottom:3px;}
body.page-garifunas .tl-row p{margin:0;font-size:13px;color:rgba(18,46,51,.72);line-height:1.55;}

body.page-garifunas .stat-row{display:flex;gap:40px;flex-wrap:wrap;margin-top:28px;}
body.page-garifunas .stat-item b{display:block;font-family:var(--serif);font-size:34px;color:var(--coral);}
body.page-garifunas .stat-item span{font-size:13px;color:rgba(18,46,51,.6);}

body.page-garifunas .diaspora-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:28px;}
body.page-garifunas .diaspora-card{background:var(--sand-deep);border-radius:4px;padding:22px;}
body.page-garifunas .diaspora-card b{display:block;font-family:var(--serif);font-size:15px;margin-bottom:6px;}
body.page-garifunas .diaspora-card span{font-size:13px;color:rgba(18,46,51,.68);line-height:1.5;}
body.page-garifunas .diaspora-list{margin-top:24px;}
body.page-garifunas .diaspora-row{display:flex;align-items:center;gap:14px;padding:9px 0;border-bottom:1px solid var(--line);font-size:14px;}
body.page-garifunas .diaspora-row .pays{width:110px;flex-shrink:0;font-weight:600;}
body.page-garifunas .diaspora-row .bar-bg{flex:1;background:var(--line);border-radius:2px;height:8px;overflow:hidden;}
body.page-garifunas .diaspora-row .bar-fill{height:100%;background:var(--teal);border-radius:2px;}
body.page-garifunas .diaspora-row .pct{width:48px;text-align:right;font-weight:700;color:var(--coral);flex-shrink:0;}

body.page-garifunas .video-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:32px;}
body.page-garifunas .video-card{background:var(--white);border-radius:4px;overflow:hidden;border:1px solid var(--line);}
body.page-garifunas .video-card iframe{width:100%;aspect-ratio:16/9;display:block;border:0;}
body.page-garifunas .video-card .info{padding:16px 18px;}
body.page-garifunas .video-card h4{font-size:15px;margin:0 0 4px;}
body.page-garifunas .video-card span{font-size:13px;color:rgba(18,46,51,.6);}

body.page-garifunas .flag-section{background:var(--ink);color:var(--white);}
body.page-garifunas .flag-colors{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:32px;}
body.page-garifunas .flag-color{border-radius:4px;padding:28px 24px;}
body.page-garifunas .flag-color .swatch{width:100%;height:10px;border-radius:2px;margin-bottom:16px;}
body.page-garifunas .flag-color h3{color:var(--white);font-size:19px;margin-bottom:10px;}
body.page-garifunas .flag-color p{font-size:14px;color:rgba(255,255,255,.82);line-height:1.6;margin:0;}
body.page-garifunas .flag-strip-visual{height:60px;border-radius:3px;overflow:hidden;display:flex;margin:24px 0 8px;box-shadow:4px 4px 0 rgba(0,0,0,.2);}
body.page-garifunas .flag-strip-visual div{flex:1;}

body.page-garifunas .dico{background:var(--sand-deep);}
body.page-garifunas .dico .ph{height:280px;}

@media (max-width:860px){
  body.page-garifunas .map-grid{grid-template-columns:1fr;}
  body.page-garifunas .diaspora-cards{grid-template-columns:1fr;}
  body.page-garifunas .video-grid,body.page-garifunas .flag-colors{grid-template-columns:1fr;}
}

/* ============================= TRIUNFO DE LA CRUZ ========================== */
body.page-triunfo .page-hero{min-height:440px;}
body.page-triunfo .page-hero .wrap{padding-top:120px;padding-bottom:48px;}

body.page-triunfo .dream-banner{position:relative;min-height:420px;display:flex;align-items:center;overflow:hidden;background:linear-gradient(135deg, #0D2226 0%, #1E8A96 55%, #E8A23D 100%);}
body.page-triunfo .dream-banner::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 75% 30%, rgba(242,183,5,.35), transparent 55%),radial-gradient(ellipse at 20% 80%, rgba(18,46,51,.6), transparent 60%);}
body.page-triunfo .dream-banner .ph-overlay{position:absolute;inset:0;opacity:.14;background:repeating-linear-gradient(135deg, #fff 0 2px, transparent 2px 40px);}
body.page-triunfo .dream-content{position:relative;max-width:620px;padding:0 32px;color:var(--white);}
body.page-triunfo .dream-content .eyebrow{color:var(--gold);}
body.page-triunfo .dream-content h2{color:var(--white);font-size:clamp(28px,4vw,42px);line-height:1.15;margin-bottom:16px;}
body.page-triunfo .dream-content p{font-size:17px;color:rgba(255,255,255,.9);line-height:1.6;margin-bottom:28px;font-style:italic;}
body.page-triunfo .dream-content .btn-primary{background:var(--white);color:var(--ink);}

/* ================================ DICTIONNAIRE ============================ */
body.page-dictionnaire section{padding:60px 0;}

body.page-dictionnaire .mot-du-jour{background:linear-gradient(120deg, var(--teal), var(--coral));border-radius:2px;padding:36px 40px;color:var(--white);display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:40px;flex-wrap:wrap;}
body.page-dictionnaire .mot-du-jour .label{font-size:12px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;opacity:.85;margin-bottom:8px;}
body.page-dictionnaire .mot-du-jour .mot{font-family:var(--serif);font-size:38px;font-weight:700;}
body.page-dictionnaire .mot-du-jour .trad{font-size:16px;opacity:.92;margin-top:4px;}
body.page-dictionnaire .mot-du-jour .emoji-big{font-size:52px;}

body.page-dictionnaire .dico-note{background:var(--sand-deep);border-left:4px solid var(--gold);border-radius:0 3px 3px 0;padding:18px 22px;font-size:14.5px;color:rgba(28,23,18,.8);margin-bottom:40px;}
body.page-dictionnaire .dico-note p{margin:0 0 8px;}
body.page-dictionnaire .dico-note p:last-child{margin-bottom:0;}

body.page-dictionnaire .filters{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:8px;}
body.page-dictionnaire .filter-btn{padding:9px 16px;border-radius:2px;border:1.5px solid var(--line);background:var(--white);font-size:13.5px;font-weight:600;cursor:pointer;color:var(--ink);}
body.page-dictionnaire .filter-btn.active{background:var(--ink);border-color:var(--ink);color:#fff;}
body.page-dictionnaire .filter-count{margin-bottom:32px;font-size:13.5px;color:rgba(28,23,18,.55);}

body.page-dictionnaire .dico-cat{margin-bottom:44px;}
body.page-dictionnaire .dico-cat-head{display:flex;align-items:center;gap:10px;margin-bottom:16px;}
body.page-dictionnaire .dico-cat-head .tag{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:16px;color:var(--white);flex-shrink:0;}
body.page-dictionnaire .dico-cat-head h3{font-size:16px;margin:0;}
body.page-dictionnaire .dico-cat-head span{font-size:12.5px;color:rgba(28,23,18,.5);}
body.page-dictionnaire .flash-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:14px;}
body.page-dictionnaire .flip-card{height:130px;perspective:1000px;}
body.page-dictionnaire .flip-card-inner{position:relative;width:100%;height:100%;transition:transform .5s;transform-style:preserve-3d;cursor:pointer;}
body.page-dictionnaire .flip-card.flipped .flip-card-inner{transform:rotateY(180deg);}
body.page-dictionnaire .flip-front,body.page-dictionnaire .flip-back{position:absolute;inset:0;backface-visibility:hidden;border-radius:3px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:10px;}
body.page-dictionnaire .flip-front{background:var(--white);border:2px solid var(--cc);}
body.page-dictionnaire .flip-front b{font-size:15px;color:var(--ink);line-height:1.25;}
body.page-dictionnaire .flip-front small{font-size:10.5px;color:rgba(28,23,18,.4);margin-top:6px;}
body.page-dictionnaire .flip-back{background:var(--cc);color:var(--white);transform:rotateY(180deg);}
body.page-dictionnaire .flip-back b{font-family:var(--serif);font-size:17px;line-height:1.25;display:block;}
body.page-dictionnaire .flip-back .es-line{font-size:11.5px;opacity:.85;margin-top:6px;font-style:italic;}

body.page-dictionnaire .contrib-box{background:linear-gradient(120deg, var(--ink), var(--teal));border-radius:2px;padding:44px 40px;color:var(--white);text-align:center;margin-top:56px;}
body.page-dictionnaire .contrib-box h2{color:var(--white);font-size:26px;margin-bottom:10px;}
body.page-dictionnaire .contrib-box p{color:rgba(255,255,255,.85);max-width:52ch;margin:0 auto 24px;font-size:15.5px;}
body.page-dictionnaire .contrib-form{max-width:520px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:14px;text-align:left;}
body.page-dictionnaire .contrib-form .full{grid-column:1 / -1;}
body.page-dictionnaire .contrib-form label{display:block;font-size:12.5px;font-weight:700;margin-bottom:6px;color:rgba(255,255,255,.85);}
body.page-dictionnaire .contrib-form input,body.page-dictionnaire .contrib-form textarea{width:100%;padding:11px 13px;border:none;border-radius:3px;font-family:var(--sans);font-size:14.5px;box-sizing:border-box;}
body.page-dictionnaire .contrib-form .btn{grid-column:1 / -1;justify-self:center;margin-top:6px;border:none;cursor:pointer;}
body.page-dictionnaire .contrib-note{font-size:12.5px;color:rgba(255,255,255,.6);margin-top:14px;}
body.page-dictionnaire .contrib-success{background:rgba(47,143,70,.15);border:1px solid var(--leaf);border-radius:3px;padding:16px 20px;color:var(--white);max-width:520px;margin:0 auto;}
body.page-dictionnaire .contrib-error{background:rgba(212,44,74,.15);border:1px solid var(--pink);border-radius:3px;padding:16px 20px;color:var(--white);max-width:520px;margin:0 auto 20px;}

@media (max-width:600px){body.page-dictionnaire .contrib-form{grid-template-columns:1fr;}}

/* =================================== GALERIE =============================== */
body.page-galerie .filters{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:36px;}
body.page-galerie .filter-btn{padding:9px 18px;border-radius:2px;border:1.5px solid var(--line);background:var(--white);font-size:14px;font-weight:600;cursor:pointer;color:var(--ink);}
body.page-galerie .filter-btn.active{background:var(--ink);color:var(--white);border-color:var(--ink);}
body.page-galerie .coup-de-coeur{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:56px;}
body.page-galerie .coup-de-coeur .ph{height:170px;}
body.page-galerie .grande-galerie{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
body.page-galerie .grande-galerie .ph{height:150px;}

@media (max-width:860px){
  body.page-galerie .coup-de-coeur,body.page-galerie .grande-galerie{grid-template-columns:1fr 1fr;}
}
