/* ══ LA PAIRE DE BOUTONS D'INSCRIPTION (17/09, maquette) ════════════════════
   Balisage : ls_duo_boutons() (inc/layout.php). Chargée sur tout le site.
   Deux variantes : cta-duo--nav (barre du site, compacte) et cta-duo--hero
   (en-tête de l'accueil). La bande sous l'en-tête (1re version) est retirée. */
.cta-duo{display:flex;align-items:stretch;gap:12px}
body.mode-site a.cta-duo-btn{display:flex;align-items:center;gap:12px;text-decoration:none;white-space:nowrap;
  transition:transform .18s,box-shadow .18s,filter .18s,border-color .18s}
body.mode-site a.cta-duo-btn:hover{transform:translateY(-1px);text-decoration:none}
.cta-duo-ico{display:grid;place-items:center;flex:none}
.cta-duo-ico svg{width:100%;height:100%}
.cta-duo-txt{display:grid;gap:1px;min-width:0;line-height:1.2;text-align:left}
.cta-duo-txt b{font-family:Inter,sans-serif;font-weight:700;letter-spacing:-.01em}
.cta-duo-txt small{font-family:Inter,sans-serif;font-weight:400}
.cta-duo-fl{flex:none}
body.mode-site a.cta-duo-g{background:#fff;border:1.5px solid #dfe7f5;box-shadow:0 8px 22px #1c487f12;color:#0b1545}
body.mode-site a.cta-duo-g:hover{color:#0b1545;border-color:#b9cff0;box-shadow:0 12px 28px #1c487f22}
.cta-duo-g small,.cta-duo-g .cta-duo-fl{color:#5e6b85}
body.mode-site a.cta-duo-b{background:linear-gradient(100deg,#0a6cf5,#2d8bff);border:1.5px solid transparent;box-shadow:0 10px 24px #0a6cf540;color:#fff}
body.mode-site a.cta-duo-b:hover{color:#fff;filter:brightness(1.06);box-shadow:0 14px 30px #0a6cf55c}
.cta-duo-b small{color:#dbe8ff}

/* ── La barre du site : compacte, sans flèche ─────────────────────────── */
/* ⚠ 18/09 : « Comment ça marche » se pliait sur trois lignes sur toutes les
   pages SAUF l'accueil — la règle qui l'en empêchait vivait dans une
   feuille propre à l'accueil. Posée ici, elle vaut pour tout le site. */
body.mode-site .nav-links > *{white-space:nowrap}
body.mode-site .nav-cta{align-items:center}
body.mode-site .nav-cta a.nav-connexion{padding:0 6px;font:500 14px Inter,sans-serif;color:#46536f;text-decoration:none;white-space:nowrap}
body.mode-site .nav-cta a.nav-connexion:hover{color:#0a6cf5}
.cta-duo--nav{gap:8px}
body.mode-site .cta-duo--nav a.cta-duo-btn{gap:8px;padding:5px 12px 5px 9px;border-radius:10px}
.cta-duo--nav .cta-duo-ico{width:22px;height:22px}
.cta-duo--nav .cta-duo-txt b{font-size:13px}
.cta-duo--nav .cta-duo-txt small{font-size:10.5px}
.cta-duo--nav .cta-duo-fl{display:none}

/* ── L'en-tête de l'accueil ───────────────────────────────────────────── */
body.mode-site .v-hero-duo{margin:0 0 1.2rem}
.cta-duo--hero{flex-wrap:wrap;gap:10px}
body.mode-site .cta-duo--hero a.cta-duo-btn{gap:10px;padding:9px 16px 9px 12px;border-radius:12px}
.cta-duo--hero .cta-duo-ico{width:28px;height:28px}
.cta-duo--hero .cta-duo-txt b{font-size:14.5px}
.cta-duo--hero .cta-duo-txt small{font-size:12px}
.cta-duo--hero .cta-duo-fl{display:none}   /* la colonne est étroite : côte à côte sans flèche */

/* La vidéo à côté du paragraphe (maquette). */
body.mode-site .v-lead-rangee{display:flex;align-items:center;gap:22px;margin:0 0 1.4rem}
body.mode-site .v-lead-rangee .v-lead{margin:0;flex:1;min-width:0}
body.mode-site .v-lead-rangee .v-btn-video{flex:none;align-self:center}

/* ── Écrans moyens et petits ──────────────────────────────────────────── */
@media (max-width:1320px){
  body.mode-site .nav-cta a.nav-connexion{display:none}
}
@media (max-width:1180px){
  .cta-duo--nav .cta-duo-g{display:none!important}
}
@media (max-width:900px){
  .cta-duo--nav .cta-duo-txt small{display:none}
  body.mode-site .cta-duo--nav a.cta-duo-btn{padding:8px 12px}
  body.mode-site .v-lead-rangee{flex-direction:column;align-items:flex-start;gap:14px}
}
@media (max-width:560px){
  .cta-duo--nav .cta-duo-ico{display:none}
  .cta-duo--nav .cta-duo-txt b{font-size:12.5px}
  .cta-duo--hero{flex-direction:column}
  body.mode-site .cta-duo--hero a.cta-duo-btn{white-space:normal}
}
@media (prefers-reduced-motion:reduce){body.mode-site a.cta-duo-btn{transition:none}}