/* Fenetre « Être rappelé » et boutons d'appel (vitrine, page d'alerte). */
.rp-bouton { display: inline-flex; align-items: center; gap: 8px; padding: 13px 20px; border-radius: 14px; border: 1.5px solid #d9dcf2;
  background: #fff; color: var(--bleu, #000091); font: inherit; font-weight: 800; cursor: pointer; text-decoration: none; transition: transform .2s, box-shadow .2s }
.rp-bouton:hover { transform: translateY(-2px); box-shadow: 0 14px 28px -18px rgba(0,0,145,.6) }
.rp-bouton svg { flex: none }
.rp-modale { position: fixed; inset: 0; z-index: 3100; display: grid; place-items: center; padding: 16px; background: rgba(6,8,30,.72); backdrop-filter: blur(4px); overflow-y: auto }
.rp-modale[hidden], .rp-boite[hidden], .rp-erreur[hidden] { display: none }
.rp-boite { position: relative; width: min(520px, 100%); padding: 26px 24px 20px; border-radius: 24px; background: #fff; color: #14143a;
  box-shadow: 0 40px 90px -30px rgba(0,0,0,.6); font-size: .95rem }
.rp-fermer { position: absolute; right: 12px; top: 10px; width: 36px; height: 36px; border: 0; border-radius: 50%; background: #f2f3fa; font-size: 22px; cursor: pointer; color: #14143a }
.rp-tete { display: flex; gap: 14px; align-items: flex-start; margin-bottom: 16px; padding-right: 30px }
.rp-tete h2 { margin: 0 0 4px; font-size: 1.35rem; line-height: 1.2 }
.rp-tete p { margin: 0; color: #4a4d6b; line-height: 1.45 }
.rp-icone { flex: none; width: 46px; height: 46px; border-radius: 50%; display: grid; place-items: center; color: #fff;
  background: linear-gradient(135deg, #000091, #2626c9); box-shadow: 0 12px 24px -12px rgba(0,0,145,.7) }
.rp-icone--ok { background: linear-gradient(135deg, #18a34a, #13803a); font-size: 24px; font-weight: 900; margin: 0 auto 10px; width: 56px; height: 56px }
.rp-champs { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 12px }
.rp-champs label { display: block; margin: 0; font-weight: 700; font-size: .85rem; color: #3b3e5c }
.rp-champs label input, .rp-champs label select { display: block; width: 100%; box-sizing: border-box; margin: 5px 0 0 }
.rp-champs small { font-weight: 500; color: #8a8daa }
.rp-large { grid-column: 1 / -1 }
.rp-champs input, .rp-champs select { padding: 11px 12px; border: 1.5px solid #dfe3f2; border-radius: 12px; font: inherit; font-weight: 500; background: #fbfcff; color: #14143a }
.rp-champs input:focus, .rp-champs select:focus { outline: none; border-color: #000091; background: #fff }
.rp-piege { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; opacity: 0 }
.rp-accord { display: flex; gap: 10px; align-items: flex-start; margin: 14px 0 0; padding: 12px; border-radius: 12px; background: #f5f7fc; font-size: .82rem; line-height: 1.45; color: #3b3e5c; cursor: pointer }
.rp-accord input { margin-top: 2px; width: 18px; height: 18px; flex: none; accent-color: #000091 }
.rp-erreur { margin: 10px 0 0; padding: 9px 12px; border-radius: 10px; background: #fff1f1; color: #b3000c; font-weight: 600; font-size: .88rem }
.rp-envoyer { display: block; width: 100%; margin-top: 14px; padding: 14px; border: 0; border-radius: 14px; background: linear-gradient(135deg, #000091, #2626c9);
  color: #fff; font: inherit; font-weight: 800; font-size: 1rem; cursor: pointer; box-shadow: 0 16px 30px -16px rgba(0,0,145,.8) }
.rp-envoyer:disabled { opacity: .7; cursor: wait }
.rp-note { margin: 10px 0 0; font-size: .76rem; color: #8a8daa; line-height: 1.45; text-align: center }
.rp-merci { text-align: center }
.rp-merci h2 { margin: 0 0 8px }
.rp-merci p { margin: 0; color: #4a4d6b; line-height: 1.5 }
@media (max-width: 480px) { .rp-champs { grid-template-columns: 1fr } .rp-boite { padding: 22px 18px 16px } }