/* Palette terre et or : XOF or, XAF vert forêt, histoire terre cuite. */
:root[data-family="franc-cfa"] {
    --paper: #F7F0E3;
    --ink: #2E2825;
    --muted: #706255;
    --deep: #2E2825;
    --accent: #C46328;
    --line: #E2D3BB;
    --serif: "Instrument Serif", Georgia, serif;
}
[data-family="franc-cfa"] .site-header { background: #241E1A; border-bottom-color: #745039; }
[data-family="franc-cfa"] .site-header :is(.brand,nav a,.language) { color: #F5E9D2; }
[data-family="franc-cfa"] .site-header .brand span { color: #D4A017; }
[data-family="franc-cfa"] .site-header nav .nav-change { background: #A94325; color: #FFF8F0; border-color: #A94325; }
[data-family="franc-cfa"] .hero { background: #2E2825; color: #F7F0E3; border-bottom: 6px solid transparent; border-image: linear-gradient(to right,#1F7A3D 0 33.333%,#D4A017 33.333% 66.666%,#C46328 66.666%) 1; }
[data-family="franc-cfa"] .hero p { color: #F5E9D2; }
[data-family="franc-cfa"] .hero > .family-figure .credit,
[data-family="franc-cfa"] .hero > .family-figure .credit a { color: #CBBFAF; }

[data-family="franc-cfa"] .hero .eyebrow { color: #D4A017; }
[data-family="franc-cfa"] .hero h1 { font-weight: 400; max-width: 19ch; }
[data-family="franc-cfa"] .hero:has(> .family-figure) h1 { font-size: clamp(2rem,4.2vw,3.6rem); max-width: 24ch; letter-spacing: -.5px; }
[data-family="franc-cfa"] .hero h1 em { color: #D4A017; }
[data-family="franc-cfa"] .hero-seal { border-color: #D4A01750; color: #D4A017; }
[data-family="franc-cfa"] .hero-seal span { font-size: 60px; }
[data-family="franc-cfa"] .hero-seal small { max-width: 14ch; text-align: center; }
[data-family="franc-cfa"] .chapter-banner { background: #EEE2CC; }
[data-family="franc-cfa"] .cfa-prose { font-family: Georgia,serif; font-size: 18px; line-height: 1.85; }
[data-family="franc-cfa"] .cfa-prose h2 { font-family: var(--serif); font-weight: 400; line-height: 1.15; scroll-margin-top: 100px; }
[data-family="franc-cfa"] .cfa-prose h3 { font-family: var(--serif); font-size: 30px; font-weight: 400; }
[data-family="franc-cfa"] .cfa-prose .lead { font-size: 22px; line-height: 1.65; }
[data-family="franc-cfa"] .cfa-prose figure { margin: 25px 0; border: 1px solid var(--line); padding: 16px; border-radius: 10px; background: #F2E6CF; }
[data-family="franc-cfa"] .cfa-prose figure img { display: block; max-width: 100%; height: auto; margin: auto; object-fit: contain; }

[data-family="franc-cfa"] .cfa-prose figcaption { font: 13px/1.65 var(--sans); padding-top: 12px; color: var(--muted); }

[data-family="franc-cfa"] .cfa-prose .sources { font: 14px/1.8 var(--sans); overflow-wrap: anywhere; }
[data-family="franc-cfa"] .documentary-gallery { grid-template-columns:minmax(0,1fr); gap:32px; }
[data-family="franc-cfa"] .cfa-prose .documentary-flip img { aspect-ratio:auto; }

[data-family="franc-cfa"] .country-xof { --card-deep: #88660C; --card-accent: #D4A017; }
[data-family="franc-cfa"] .country-xaf { --card-deep: #1F7A3D; --card-accent: #1F7A3D; }
[data-family="franc-cfa"] .countries { grid-template-columns: repeat(2,minmax(0,1fr)); }
[data-family="franc-cfa"] .theme-xof .hero { border-image: none; border-bottom-color: #D4A017; }
[data-family="franc-cfa"] .theme-xaf .hero { border-image: none; border-bottom-color: #1F7A3D; }
[data-family="franc-cfa"] :is(.exchange-page,.exchange-promo-dialog) { --ex-navy: #2E2825; --ex-navy-soft: #4A3A34; --ex-gold: #D4A017; --ex-gold-dark: #88660C; --ex-gold-soft: #F4E6B9; }
[data-family="franc-cfa"] .site-footer { background: #2E2825; color: #F5E9D2; }
[data-family="franc-cfa"] .site-footer :is(a,.brand span,.ecosystem) { color: #D4A017; }
[data-family="franc-cfa"] :is(a,button,input,select,summary):focus-visible { outline-color: #D4A017; }
@media (max-width: 740px) {
    
    [data-family="franc-cfa"] :is(.zone-lists,.countries) { grid-template-columns: minmax(0,1fr); }
    [data-family="franc-cfa"] .hero h1 { font-size: clamp(2.2rem,9vw,3rem); }
    
    [data-family="franc-cfa"] .cfa-prose .lead { font-size: 20px; }
}

/* Maquette : conserver les rectos, versos et légendes du site d’origine. */
[data-family="franc-cfa"] .legacy-banknotes { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; margin-top:32px; }
[data-family="franc-cfa"] .legacy-banknotes figure { margin:0; }
[data-family="franc-cfa"] .legacy-banknotes img { width:100%; height:auto; }

/* Carte d’accueil : contours du SVG historique, deux zones distinctes en permanence. */
[data-family="franc-cfa"] .hero-home { display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); gap:3vw; padding:42px 4vw 48px; }
[data-family="franc-cfa"] .hero-home .hero-inner { width:100%; }
[data-family="franc-cfa"] .cfa-hero-map { --xof:#D4A017; --xaf:#1F7A3D; --xaf-text:#55BD75; margin:0; min-width:0; }
[data-family="franc-cfa"] .cfa-map-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:34px; color:#CBBFAF; font:10px/1.5 var(--sans,"DM Sans",Arial,sans-serif); letter-spacing:1.4px; }
[data-family="franc-cfa"] .cfa-map-layout { display:grid; grid-template-columns:minmax(0,1fr) 166px; gap:14px; align-items:center; margin-top:14px; }
[data-family="franc-cfa"] .cfa-map-art { height:430px; margin:0; transform:translateX(28px); }
[data-family="franc-cfa"] .cfa-map-svg { display:block; width:100%; height:100%; overflow:visible; }
[data-family="franc-cfa"] .cfa-map-svg path { fill:#51443C; stroke:#877260; stroke-width:1.8px; stroke-linejoin:round; }
[data-family="franc-cfa"] .cfa-map-svg .xofClass { fill:var(--xof); stroke:#EAD08C; stroke-width:2.5px; }
[data-family="franc-cfa"] .cfa-map-svg .xafClass, [data-family="franc-cfa"] .cfa-map-svg .xafClass path { fill:var(--xaf); stroke:#7BA586; stroke-width:2.5px; }
[data-family="franc-cfa"] .cfa-map-zone { cursor:pointer; }
[data-family="franc-cfa"] .cfa-map-zone:hover path, [data-family="franc-cfa"] .cfa-map-zone:focus-visible path { stroke:#FFF8F0; stroke-width:4px; filter:none; }
[data-family="franc-cfa"] .cfa-map-legend { display:grid; grid-template-columns:minmax(0,1fr); gap:18px; padding:4px 0; }
[data-family="franc-cfa"] .cfa-map-key { padding:10px 8px 8px; border-left:2px solid; font:13px/1.5 var(--sans,"DM Sans",Arial,sans-serif); background:transparent; }
[data-family="franc-cfa"] .cfa-map-key-xof { color:var(--xof); border-color:var(--xof); }
[data-family="franc-cfa"] .cfa-map-key-xof li { color:#F2C94C; }
[data-family="franc-cfa"] .cfa-map-key-xaf { color:var(--xaf-text); border-color:var(--xaf); }
[data-family="franc-cfa"] .cfa-map-region-link { display:block; color:inherit; text-decoration:none; }
[data-family="franc-cfa"] .cfa-map-code { display:block; font-size:20px; font-weight:600; line-height:1.15; }
[data-family="franc-cfa"] .cfa-map-code span { font-size:12px; font-weight:400; }
[data-family="franc-cfa"] .cfa-map-region-name { display:block; font-size:12px; margin-top:4px; }
[data-family="franc-cfa"] .cfa-map-key small { display:block; font-size:10px; opacity:.85; margin-top:1px; }
[data-family="franc-cfa"] .cfa-map-key ol { list-style:none; margin:7px 0 0; padding:0; }
[data-family="franc-cfa"] .cfa-map-key li { margin:0; padding:0; font-weight:500; }
[data-family="franc-cfa"] .cfa-map-region-link:hover { text-decoration:underline; text-underline-offset:3px; }
@keyframes cfa-west { 0%,43%,100% { filter:brightness(1.2) drop-shadow(0 0 9px #D4A01790); } 50%,93% { filter:brightness(.85); } }
@keyframes cfa-central { 0%,43%,100% { filter:brightness(.85); } 50%,93% { filter:brightness(1.2) drop-shadow(0 0 9px #1F7A3D90); } }
@keyframes cfa-key-west { 0%,43%,100% { border-left-color:#D4A017; } 50%,93% { border-left-color:#D4A01770; } }
@keyframes cfa-key-central { 0%,43%,100% { border-left-color:#1F7A3D70; } 50%,93% { border-left-color:#1F7A3D; } }
[data-family="franc-cfa"] .cfa-map-motion .cfa-map-xof { animation:cfa-west 4.8s ease-in-out 1; }
[data-family="franc-cfa"] .cfa-map-motion .cfa-map-xaf { animation:cfa-central 4.8s ease-in-out 1; }
[data-family="franc-cfa"] .cfa-map-motion .cfa-map-key-xof { animation:cfa-key-west 4.8s ease-in-out 1; }
[data-family="franc-cfa"] .cfa-map-motion .cfa-map-key-xaf { animation:cfa-key-central 4.8s ease-in-out 1; }
@media (prefers-reduced-motion:reduce) {
 [data-family="franc-cfa"] .cfa-hero-map :is(.cfa-map-zone,.cfa-map-key) { animation:none; }
}
@media(min-width:741px) and (max-width:1050px) {
 [data-family="franc-cfa"] .hero-home { grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:2vw; padding-inline:3vw; }
 [data-family="franc-cfa"] .cfa-map-layout { grid-template-columns:minmax(0,1fr) 145px; gap:8px; }
 [data-family="franc-cfa"] .cfa-map-key { font-size:12px; }
 [data-family="franc-cfa"] .cfa-map-art { transform:translateX(8px); }
}
@media(max-width:740px) {
 [data-family="franc-cfa"] .hero-home { grid-template-columns:minmax(0,1fr); gap:35px; padding:35px 6vw 30px; }
 [data-family="franc-cfa"] .cfa-map-layout { grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr); gap:10px; }
 [data-family="franc-cfa"] .cfa-map-art { height:370px; transform:none; }
 [data-family="franc-cfa"] .cfa-map-key { font-size:12px; padding:8px; }
 [data-family="franc-cfa"] .cfa-map-region-name { font-size:11px; }
 [data-family="franc-cfa"] .cfa-map-code { font-size:18px; }
}

/* Contrastes du thème sombre ; les textes verts gardent une teinte plus lumineuse. */
[data-family="franc-cfa"] .site-header .brand { color:#D4A017; }
[data-family="franc-cfa"] .site-header .menu-toggle { color:#F5E9D2; border-color:#745039; }
[data-family="franc-cfa"] .theme-xaf .hero .eyebrow { color:#55BD75; }
[data-family="franc-cfa"] .hero .cfa-map-key small { opacity:1; }

/* Navigation plus courte et touche d’orange, avec des textes suffisamment contrastés. */
[data-family="franc-cfa"] .hero-home .hero-link { color:#E58B45; border-bottom-color:#E58B45; font-size:14px; font-weight:600; }
[data-family="franc-cfa"] .hero-home .hero-link:hover { color:#F4A261; border-bottom-color:#F4A261; }
[data-family="franc-cfa"] .site-header nav .nav-change { font-size:14px; font-weight:700; white-space:nowrap; }
[data-family="franc-cfa"] .site-header nav .nav-change:hover { background:#91381F; border-color:#91381F; color:#FFF8F0; }
@media(max-width:740px) {
 [data-family="franc-cfa"] .site-header nav .nav-change { font-size:12px; padding-inline:10px; }
}

/* Repères pays : numéros identiques dans le SVG et dans les listes. */
[data-family="franc-cfa"] .cfa-map-key li { display:grid; grid-template-columns:20px minmax(0,1fr); gap:6px; align-items:start; }
[data-family="franc-cfa"] .cfa-country-number { display:inline-flex; justify-content:center; align-items:center; min-height:18px; border:1px solid currentColor; border-radius:3px; font-size:11px; font-weight:700; line-height:1.4; margin-top:1px; font-variant-numeric:tabular-nums; }
[data-family="franc-cfa"] .cfa-map-marker { color:#F2C94C; }
[data-family="franc-cfa"] .cfa-map-marker-xaf { color:#55BD75; }
[data-family="franc-cfa"] .cfa-marker-badge { fill:#241E1A; stroke:currentColor; stroke-width:5px; }
[data-family="franc-cfa"] .cfa-map-marker text { fill:currentColor; font:700 56px "DM Sans",Arial,sans-serif; }
[data-family="franc-cfa"] .cfa-marker-leader { stroke:currentColor; stroke-width:5px; fill:none; }
[data-family="franc-cfa"] .cfa-marker-anchor { fill:currentColor; }
[data-family="franc-cfa"] .cfa-map-marker:hover .cfa-marker-badge, [data-family="franc-cfa"] .cfa-map-marker:focus-visible .cfa-marker-badge { stroke:#FFF8F0; stroke-width:8px; }
@media(max-width:740px) {
 [data-family="franc-cfa"] .cfa-map-layout { grid-template-columns:minmax(0,1fr); gap:18px; }
 [data-family="franc-cfa"] .cfa-map-art { height:auto; width:100%; aspect-ratio:1820/1930; max-width:420px; margin-inline:auto; }
 [data-family="franc-cfa"] .cfa-map-legend { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
 [data-family="franc-cfa"] .cfa-map-key li { grid-template-columns:18px minmax(0,1fr); gap:5px; }
 [data-family="franc-cfa"] .cfa-country-number { font-size:10px; }
}

/* Survol réciproque et focus clavier : pays, repère et nom restent liés. */
[data-family="franc-cfa"] .cfa-map-key li { display:block; }
[data-family="franc-cfa"] .cfa-country-link { display:grid; grid-template-columns:20px minmax(0,1fr); gap:6px; align-items:start; color:inherit; text-decoration:none; border-radius:3px; }
[data-family="franc-cfa"] .cfa-country-link:hover { color:inherit; }
[data-family="franc-cfa"] .cfa-country-link.is-country-active { color:#FFF8F0; background:transparent; outline:none; }
[data-family="franc-cfa"] .cfa-country-link.is-country-active .cfa-country-name { text-decoration:none; }
[data-family="franc-cfa"] .cfa-country-link:focus-visible { outline:2px solid #FFF8F0; outline-offset:3px; }
[data-family="franc-cfa"] .cfa-map-interacting .cfa-map-zone { animation:none; filter:none; opacity:.7; }
[data-family="franc-cfa"] .cfa-map-interacting .cfa-map-key { animation-play-state:paused; }
[data-family="franc-cfa"] .cfa-map-interacting .cfa-map-zone.is-country-active { opacity:1; filter:none; }
[data-family="franc-cfa"] .cfa-map-svg .cfa-map-zone.is-country-active path { stroke:#FFF8F0; stroke-width:4px; }
[data-family="franc-cfa"] .cfa-map-svg .cfa-map-xof.is-country-active path { fill:#F2C94C; }
[data-family="franc-cfa"] .cfa-map-svg .cfa-map-xaf.is-country-active path { fill:#42A867; }
[data-family="franc-cfa"] .cfa-map-marker.is-country-active .cfa-marker-badge { fill:currentColor; stroke:#FFF8F0; stroke-width:7px; }
[data-family="franc-cfa"] .cfa-map-marker.is-country-active text { fill:#241E1A; }
[data-family="franc-cfa"] .cfa-map-marker.is-country-active .cfa-marker-leader { stroke:#FFF8F0; stroke-width:7px; }
@media(max-width:740px) {
 [data-family="franc-cfa"] .cfa-country-link { grid-template-columns:18px minmax(0,1fr); gap:5px; }
}

[data-family="franc-cfa"] .cfa-map-zone:focus-visible, [data-family="franc-cfa"] .cfa-map-marker:focus-visible { outline:none; }

/* Aucun service WhatsApp non renseigné sur Franc CFA. */
[data-family="franc-cfa"] .contact-pending { display:none; }
[data-family="franc-cfa"] .cfa-billet-sources { font-size:14px; line-height:1.6; color:var(--muted); }

@media(max-width:740px) { [data-family="franc-cfa"] .legacy-banknotes { grid-template-columns:minmax(0,1fr); } }

[data-family="franc-cfa"] .location-actions .contact-map { grid-column:auto; }