/* ── Page régions (r/index.php) — Bootstrap 5 ──
   Adapté de lib/randozone/tailwind/css/regions.css.
   Variables : rz-bs5.css (--rz-ink, --rz-blue, --rz-border, --rz-surface, --rz-inksoft, --rz-primary).
   Shared (rz-bs5.css) : .eyebrow, .stat-chip, .callout.info, .rz-more, .rz-ico. */

/* ═══ Structure ═══ */
.rg-stack { display:flex; flex-direction:column; gap:3rem }
@media (min-width:768px){ .rg-stack{ gap:4rem } }

/* ═══ En-têtes de section ═══ */
.rg-sechead { display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:1rem; margin-bottom:1.5rem }
.rg-h2 { font-family:'Work Sans',system-ui,sans-serif; font-weight:600; letter-spacing:-.02em;
  color:var(--rz-ink); margin:.375rem 0 0; font-size:1.45rem }
@media (min-width:768px){ .rg-h2{ font-size:2rem } }

/* ═══ Layout carte + liste ═══ */
.rg-cols { display:grid; grid-template-columns:1fr; gap:2rem; align-items:start }
@media (min-width:1024px){ .rg-cols{ grid-template-columns:minmax(0,.92fr) minmax(0,1fr); gap:2.5rem } }

/* ═══ Panneau carte SVG ═══ */
.map-panel { position:relative; border-radius:16px; border:1px solid var(--rz-border); background:var(--rz-surface);
  box-shadow:0 20px 50px -30px rgba(20,40,80,.35); overflow:hidden; padding:.5rem }
.map-panel.rg-sticky { position:sticky; top:1.5rem }
.map-panel .svg-content { width:100%; height:auto; display:block }
.map-legend { display:flex; align-items:center; gap:.45rem; margin-top:.4rem; padding:.2rem .4rem;
  font-family:monospace; font-size:.62rem; letter-spacing:.04em; text-transform:uppercase; color:var(--rz-inksoft) }
.map-legend .d { width:9px; height:9px; border-radius:50%; flex-shrink:0; border:2px solid var(--rz-blue) }

/* ═══ Régions SVG (hover + active) ═══ */
.map-panel .land { cursor:pointer; fill:color-mix(in oklch,var(--rz-blue) 16%,white);
  stroke:#fff; stroke-width:1.5; transition:fill .15s }
.map-panel .land:hover,
.map-panel .land.is-active { fill:color-mix(in oklch,var(--rz-blue) 45%,white) }
.map-panel text { pointer-events:none; font-size:22px !important; fill:oklch(0.38 0.13 235) }

/* ═══ Liste des régions ═══ */
.reg-list { display:grid; grid-template-columns:1fr; gap:.6rem }
@media (min-width:640px){ .reg-list{ grid-template-columns:repeat(2,1fr) } }

.reg-row { display:flex; align-items:center; gap:.85rem; padding:.8rem .95rem; border-radius:14px;
  border:1px solid var(--rz-border); background:var(--rz-surface); text-decoration:none;
  transition:border-color .16s, box-shadow .18s, transform .16s }
.reg-row:hover, .reg-row.is-active { border-color:color-mix(in oklch,var(--rz-blue) 55%,white);
  box-shadow:0 16px 32px -24px rgba(20,40,80,.6); transform:translateX(2px) }
.reg-row .tick { width:4px; align-self:stretch; min-height:34px; border-radius:999px;
  background:var(--rz-blue); opacity:.45; flex-shrink:0; transition:opacity .16s }
.reg-row:hover .tick, .reg-row.is-active .tick { opacity:1 }
.reg-row .bd { min-width:0 }
.reg-row .nm { display:block; font-family:'Work Sans',system-ui,sans-serif; font-weight:600;
  font-size:1rem; letter-spacing:-.01em; line-height:1.15; color:var(--rz-ink) }
.reg-row:hover .nm, .reg-row.is-active .nm { color:var(--rz-primary) }
.reg-row .ds { display:block; font-size:.76rem; color:var(--rz-inksoft); margin-top:.14rem; line-height:1.35 }
.reg-row .arr { margin-left:auto; color:var(--rz-inksoft); flex-shrink:0; transition:transform .16s, color .16s }
.reg-row:hover .arr, .reg-row.is-active .arr { color:var(--rz-blue); transform:translateX(3px) }

/* ═══ Cartes outre-mer ═══ */
.om-grid { display:grid; grid-template-columns:1fr; gap:1rem }
@media (min-width:640px){ .om-grid{ grid-template-columns:repeat(2,1fr) } }
@media (min-width:1024px){ .om-grid{ grid-template-columns:repeat(4,1fr) } }

.om-card { display:flex; flex-direction:column; gap:.5rem; background:var(--rz-surface); border:1px solid var(--rz-border);
  border-radius:16px; padding:1.15rem 1.2rem; text-decoration:none;
  transition:border-color .16s, box-shadow .18s, transform .18s }
.om-card:hover { border-color:color-mix(in oklch,var(--rz-blue) 55%,white);
  box-shadow:0 18px 36px -24px rgba(20,40,80,.6); transform:translateY(-3px) }
.om-card .ic { width:38px; height:38px; border-radius:11px; display:grid; place-items:center;
  color:var(--rz-primary); background:color-mix(in oklch,var(--rz-blue) 10%,white);
  border:1px solid color-mix(in oklch,var(--rz-blue) 22%,white) }
.om-card .ic .rz-ico { width:20px; height:20px }
.om-card .nm { font-family:'Work Sans',system-ui,sans-serif; font-weight:600;
  font-size:1.12rem; letter-spacing:-.01em; color:var(--rz-ink) }
.om-card:hover .nm { color:var(--rz-blue) }
.om-card .ds { font-size:.8rem; color:var(--rz-inksoft); line-height:1.45 }
.om-card .go { margin-top:auto; display:inline-flex; align-items:center; gap:.4rem; font-size:.74rem;
  font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--rz-primary) }
.om-card .go .rz-ico { transition:transform .16s }
.om-card:hover .go .rz-ico { transform:translateX(3px) }

/* ═══ Hero 3 (rz-hero-split) — overrides pour le contexte régions ═══ */
.rz-hero-split .hv-title .lt { color: var(--rz-primary); }
