/* ============================================================
   Bana — surcouche de la rubrique informative (/bana).
   S'ajoute par-dessus site.css. Palette : vert nuit #173404
   (accents/structure) + orange #D85A30 (actions). Aucune couleur
   en dur dans les gabarits — tout passe par ces jetons.
   ============================================================ */
/* Couleurs de marque Bana (charte officielle) :
   vert trajet #1D9E75 · orange arrivée #D85A30 · jaune soleil #FAC775 · vert nuit #173404 */
body.bana{
  --blue:#1D9E75; --blue-600:#178A64; --blue-050:#E4F5EE;
  --orange:#D85A30; --orange-2:#E67A50;
  --bana-night:#173404; --bana-sun:#FAC775;
}
/* En thème sombre, l'accent vert doit rester lisible sur fond sombre. */
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) body.bana{
    --blue:#3FC896; --blue-600:#2FB585; --blue-050:#12291F;
    --orange:#E67A50; --orange-2:#F0916B;
  }
}
:root[data-theme="dark"] body.bana{
  --blue:#3FC896; --blue-600:#2FB585; --blue-050:#12291F;
  --orange:#E67A50; --orange-2:#F0916B;
}

/* ---- Logo Bana dans la nav (bascule clair/sombre) ---- */
.bana-logo{height:34px;width:auto;display:block}
.bana-logo-dark{display:none}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .bana-logo-light{display:none}
  :root:not([data-theme="light"]) .bana-logo-dark{display:block}
}
:root[data-theme="dark"] .bana-logo-light{display:none}
:root[data-theme="dark"] .bana-logo-dark{display:block}

/* ---- Bandeau d'identité « Bana, un service de Le Coursier » ---- */
.bana-id{
  background:var(--blue);color:#fff;font-size:13px;font-weight:700;
  text-align:center;padding:7px 16px;letter-spacing:.01em;
}
.bana-id a{color:#fff;text-decoration:underline;text-underline-offset:2px}

/* ---- Marque Bana dans la nav (nom + mention de rattachement) ---- */
.brand.bana-brand{flex-direction:column;align-items:flex-start;gap:0;line-height:1.05}
.brand.bana-brand .bn{font-family:"Sora",sans-serif;font-weight:800;font-size:20px;color:var(--ink)}
.brand.bana-brand .bs{font-size:11px;font-weight:600;color:var(--muted)}

/* ---- Barre d'action persistante (mobile surtout) ---- */
.bana-cta-bar{
  position:sticky;bottom:0;z-index:55;display:none;gap:8px;
  padding:10px 16px;background:var(--surface);border-top:1px solid var(--line);
  box-shadow:0 -8px 24px -18px rgba(10,37,81,.5);
}
.bana-cta-bar .btn{flex:1;justify-content:center}
@media (max-width:720px){ .bana-cta-bar{display:flex} }

/* ---- Blocs de contenu informatif ---- */
.bana-section{padding:40px 0}
.bana-lead{max-width:760px;color:var(--body);font-size:18px;margin:0 0 8px}
.bana-reassure{
  display:inline-block;margin-top:6px;padding:8px 14px;border-radius:999px;
  background:var(--blue-050);color:var(--blue);font-weight:700;font-size:14px;
}
.bana-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px;margin-top:22px}
.bana-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-sm);padding:20px}
.bana-card h3{font-size:17px;margin-bottom:6px}
.bana-card p{color:var(--body);font-size:15px}
.bana-note{
  border-left:4px solid var(--orange);background:var(--surface-2);
  border-radius:0 var(--radius-sm) var(--radius-sm) 0;padding:16px 18px;margin:18px 0;
}
.bana-note b{color:var(--ink)}
.bana-steps{counter-reset:s;display:grid;gap:14px;margin:18px 0}
.bana-step{position:relative;padding-left:52px}
.bana-step::before{
  counter-increment:s;content:counter(s);position:absolute;left:0;top:0;
  width:36px;height:36px;border-radius:10px;display:grid;place-items:center;
  background:var(--blue);color:#fff;font-family:"Sora",sans-serif;font-weight:800;
}
.bana-step h3{font-size:16px;margin-bottom:2px}
.bana-step p{color:var(--body);font-size:15px}
.bana-btns{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}
.bana-ul{list-style:none;padding:0;margin:14px 0;display:grid;gap:8px}
.bana-ul li{position:relative;padding-left:26px;color:var(--body)}
.bana-ul li::before{content:"";position:absolute;left:4px;top:9px;width:8px;height:8px;border-radius:50%;background:var(--orange)}
.bana-faq{max-width:820px}

/* ---- Hero vert de la rubrique Bana (le site Le Coursier reste bleu) ---- */
body.bana .phero{
  background:
    radial-gradient(900px 420px at 85% -20%, rgba(216,90,48,.30), transparent 62%),
    linear-gradient(158deg, #1D9E75, #17835F);
}
body.bana .phero .eyebrow{color:var(--orange)}
body.bana .phero .bana-lead{color:rgba(240,246,238,.92)}
body.bana .phero .bana-reassure{background:rgba(255,255,255,.14);color:#fff}
body.bana .phero .btn-outline{color:#fff;border-color:rgba(255,255,255,.5);background:rgba(255,255,255,.08)}
body.bana .phero .more{color:#fff}