/* Choix de formule — la pop-up qui s'ouvre sur « Prendre ma place ».
   Deux questions : pour soi ou pour son équipe, puis live ou à son rythme.
   Rien d'inventé ici : tokens, radius et boutons viennent de webflow.css
   et de design-system/TYPE-SCALE.md. Les titres sont en SwissNow 600
   (VCNudge reste réservé au H1 des pages). */

[data-cf-root][hidden]{display:none}

.cf_overlay{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;
  padding:24px;background-color:#121117a6;overflow-y:auto;
  font-family:Swissnow,Arial,sans-serif;color:var(--colors--black,#121117)}

.cf_dialog{position:relative;width:100%;max-width:760px;background-color:#fff;border-radius:6px;
  padding:44px 44px 36px;box-shadow:0 40px 80px -40px #12111799;margin:auto}

.cf_close{position:absolute;top:16px;right:16px;width:36px;height:36px;padding:0;line-height:1;
  font-size:20px;color:var(--colors--black,#121117);background-color:#0000;border:1px solid #0000;
  border-radius:4px;cursor:pointer;transition:background-color .2s}
.cf_close:hover{background-color:#1211170d}

.cf_step[hidden]{display:none}

.cf_label{letter-spacing:.4px;text-transform:uppercase;font-family:Abcfavoritmono Book,Arial,sans-serif;
  font-size:12px;font-weight:400;line-height:16px;color:#5a5961;margin:0}
.cf_titre{font-family:Swissnow,Arial,sans-serif;font-size:28px;line-height:34px;font-weight:600;
  letter-spacing:-.2px;margin:10px 0 0}
.cf_chapo{font-size:16px;line-height:23px;color:#5a5961;margin:12px 0 0;max-width:52ch}

/* ---------- étape 1 : deux grands choix ---------- */
.cf_choix-liste{display:grid;grid-row-gap:12px;margin-top:28px}
.cf_choix{display:flex;align-items:center;justify-content:space-between;grid-column-gap:20px;width:100%;
  text-align:left;background-color:#fff;border:1px solid #12111726;border-radius:6px;padding:22px 24px;
  cursor:pointer;transition:border-color .2s,background-color .2s}
.cf_choix:hover{border-color:var(--colors--black,#121117);background-color:#12111708}
.cf_choix-titre{display:block;font-size:20px;line-height:26px;font-weight:600;margin:0}
.cf_choix-detail{display:block;font-size:15px;line-height:21px;color:#5a5961;margin:6px 0 0}
.cf_choix-fleche{flex:none;font-size:18px;line-height:1;color:#5a5961}

/* ---------- étape 2 : les deux formules ---------- */
.cf_formules{display:grid;grid-template-columns:1fr 1fr;grid-column-gap:16px;grid-row-gap:16px;margin-top:26px}
.cf_formule{display:flex;flex-direction:column;border:1px solid #12111726;border-radius:6px;padding:26px 24px 24px}
.cf_formule.is-live{border-color:var(--colors--black,#121117)}
.cf_formule-titre{font-size:22px;line-height:28px;font-weight:600;margin:8px 0 0}
.cf_prix{font-size:32px;line-height:38px;font-weight:600;letter-spacing:-.4px;margin:14px 0 0}
.cf_prix span{font-size:14px;font-weight:400;color:#5a5961;letter-spacing:0}
.cf_dispo{font-size:15px;line-height:21px;color:#5a5961;margin:6px 0 0}
.cf_liste{list-style:none;margin:18px 0 0;padding:0;display:grid;grid-row-gap:8px}
.cf_liste li{background-image:url(/assets/img/681df0312c8ff9f92b4c08b9_Check.svg);background-position:0 3px;
  background-repeat:no-repeat;padding-left:25px;font-size:15px;line-height:21px}
.cf_formule .cf_cta{margin-top:auto;padding-top:22px}
.cf_cta a{display:block;text-align:center;text-decoration:none;letter-spacing:-.2px;border-radius:4px;
  padding:15px 22px;line-height:1em;border:1px solid var(--colors--black,#121117);transition:background-color .2s,color .2s}
.cf_cta a.is-plein{background-color:var(--colors--black,#121117);color:var(--colors--off-white,#f8f9ec)}
.cf_cta a.is-plein:hover{background-color:#0000;color:var(--colors--black,#121117)}
.cf_cta a.is-contour{background-color:#0000;color:var(--colors--black,#121117)}
.cf_cta a.is-contour:hover{background-color:var(--colors--black,#121117);color:var(--colors--off-white,#f8f9ec)}

/* ---------- étape entreprise ---------- */
.cf_bloc-entreprise .cf_liste{margin-top:22px}
.cf_bloc-entreprise .cf_cta{margin-top:26px;display:flex;grid-column-gap:12px;flex-wrap:wrap}
.cf_bloc-entreprise .cf_cta a{flex:1;min-width:200px}

/* ---------- pied de la pop-up ---------- */
.cf_pied{display:flex;align-items:center;justify-content:space-between;grid-column-gap:16px;flex-wrap:wrap;
  margin-top:24px;padding-top:18px;border-top:1px solid #12111714}
.cf_note{font-size:14px;line-height:20px;color:#5a5961;margin:0}
.cf_lien{background:none;border:0;padding:0;font:inherit;font-size:14px;line-height:20px;
  color:var(--colors--black,#121117);text-decoration:underline;cursor:pointer}

.cf_overlay :focus-visible{outline:2px solid var(--colors--black,#121117);outline-offset:2px}

@media screen and (max-width:767px){
  .cf_overlay{padding:0;align-items:flex-end}
  .cf_dialog{max-width:none;border-radius:6px 6px 0 0;padding:36px 22px 26px;margin:auto 0 0}
  .cf_titre{font-size:24px;line-height:30px}
  .cf_formules{grid-template-columns:1fr;margin-top:20px}
  .cf_formule{padding:20px 18px 18px}
  .cf_formule-titre{font-size:20px;line-height:26px}
  .cf_prix{font-size:28px;line-height:34px;margin-top:10px}
  .cf_liste{margin-top:14px;grid-row-gap:6px}
  .cf_liste li{font-size:14px;line-height:20px}
  /* Sur un écran de 390, deux cartes complètes repoussent la seconde hors de vue :
     on garde les trois lignes qui distinguent vraiment les formules. */
  .cf_formule .cf_liste li:nth-child(n+4){display:none}
  .cf_formule .cf_cta{padding-top:16px}
  .cf_choix{padding:18px 20px}
  .cf_pied{flex-direction:column;align-items:flex-start;grid-row-gap:10px}
}