/* =============================================================================
   offre-lancement.css : compléments de la page /offre-lancement (app/Views/offer/launch.php).

   S'ajoute à home.css (classes « home-* ») : on n'ajoute ici que ce qui n'existe pas encore,
   le compteur de places et le tableau Compte gratuit / Pionnier. Toutes les classes commencent
   par « offre- ». Écrit à la main, hors compilation Tailwind ; variables de la charte seulement,
   donc le mode sombre fonctionne sans rien ajouter.
   ============================================================================= */

/* ---------- Compteur de places Pionnier ---------- */
.offre-compteur{display:inline-flex; flex-wrap:wrap; align-items:baseline; gap:.35rem .6rem; margin-top:1.4rem; padding:.7rem 1.1rem; background:var(--card-bg); border:1px solid var(--border); border-left:3px solid var(--orange); border-radius:var(--rayon-bouton)}
.offre-compteur strong{font-size:1.6rem; line-height:1; color:var(--titre-bleu)}
.offre-compteur span{color:var(--muted); font-size:.95rem}

/* ---------- Tableau comparatif (défile en largeur sur petit écran, sans casser la page) ---------- */
.offre-tableau-cadre{overflow-x:auto; border:1px solid var(--border); border-radius:var(--rayon-bouton); background:var(--card-bg)}
.offre-tableau{width:100%; min-width:30rem; border-collapse:collapse; font-size:.95rem}
.offre-tableau th,
.offre-tableau td{padding:.85rem 1rem; text-align:left; vertical-align:top; border-bottom:1px solid var(--border)}
.offre-tableau tbody tr:last-child th,
.offre-tableau tbody tr:last-child td{border-bottom:0}
.offre-tableau thead th{font-size:.8rem; text-transform:uppercase; letter-spacing:.04em; color:var(--muted)}
.offre-tableau thead th.offre-colonne-pionnier{color:var(--titre-bleu); background:var(--accent-soft); border-bottom:2px solid var(--orange)}
.offre-tableau tbody th{font-weight:600; color:var(--fg)}
.offre-tableau td.offre-colonne-pionnier{background:var(--accent-soft); font-weight:600; color:var(--titre-bleu)}
.offre-note{margin-top:.9rem; font-size:.85rem; color:var(--muted)}

/* ---------- Mention « une carte = un profil » (argument validé le 12/11/2026) ---------- */
.offre-encart{margin-top:1.6rem; padding:1rem 1.2rem; background:var(--bg); border:1px solid var(--border); border-left:3px solid var(--accent); border-radius:var(--rayon-bouton)}
.offre-encart strong{color:var(--titre-bleu)}

/* ---------- Boutons côte à côte, empilés sur mobile ---------- */
.offre-actions{display:flex; flex-wrap:wrap; gap:.8rem; margin-top:1.6rem}