/* ══ LA PAGE D'INSCRIPTION — refaite le 17/09 d'après la maquette.
   Balisage : register.php (bloc .insc). Toujours sombre, quel que soit le
   thème de l'application : toutes les couleurs sont écrites ici.

   ⚠ PALETTE DU TABLEAU DE BORD (17/09, demande client) : le bleu nuit de
   la maquette a été remplacé teinte par teinte par les violets du thème
   sombre (assets/css/sombre.css) — fonds #0a0b16/#12142a/#171a33, lignes
   #282d52, remplissage #7c3aed, écriture #a78bfa. Les valeurs sont écrites
   en dur ici, et non prises dans les variables : la page doit garder ses
   couleurs même quand l'application est en thème clair. */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Caveat:wght@600&display=swap');
.insc{position:relative;min-height:100vh;overflow:hidden;isolation:isolate;padding:48px 16px 56px;
  display:flex;justify-content:center;align-items:flex-start;font-family:Inter,system-ui,sans-serif;color:#c3c7e6;
  background:radial-gradient(60% 50% at 80% 10%,#3b1d7a 0%,transparent 60%),
             radial-gradient(50% 40% at 10% 90%,#33176b 0%,transparent 60%),
             linear-gradient(180deg,#07070f 0%,#0d0e1e 60%,#12142a 100%)}
.insc a{color:#a78bfa}
.insc-vague{position:absolute;z-index:-1;border-radius:50%;pointer-events:none}
.insc-vague-d{right:-18%;bottom:-20%;width:55vw;height:70vh;background:radial-gradient(closest-side,#7c3aed,#5b21b6 60%,transparent);opacity:.7}
.insc-vague-g{left:-15%;top:40%;width:40vw;height:40vh;background:radial-gradient(closest-side,#6d28d9,transparent);opacity:.5}
.insc-retour{position:absolute;left:24px;top:18px;font-size:14px;color:#8a90bd !important;text-decoration:none}
.insc-retour:hover{color:#fff !important}

.insc-carte{position:relative;width:100%;max-width:920px;padding:56px 72px 40px;border-radius:28px;text-align:center;
  background:linear-gradient(180deg,#1a1c38e6 0%,#141630e6 100%);border:1px solid #282d52;
  box-shadow:0 40px 90px #03030a99,inset 0 1px 0 #ffffff12;backdrop-filter:blur(6px)}
.insc-marque{display:inline-flex;align-items:center;gap:18px;text-decoration:none}
.insc-marque svg{width:64px;height:64px;border-radius:16px;box-shadow:0 10px 30px #7c3aed55}
.insc-marque span{font:800 52px/1 Inter,sans-serif;letter-spacing:-.03em;color:#fff}
.insc-marque em{font-style:normal;color:#a78bfa}
.insc-devise{margin:14px 0 30px;font:500 13px/1 Inter,sans-serif;letter-spacing:.28em;text-transform:uppercase;color:#8a90bd}
.insc-titre{margin:0 0 16px;font:800 clamp(34px,4.4vw,52px)/1.08 Inter,sans-serif;letter-spacing:-.03em;color:#fff}
.insc-titre em{display:block;font-style:normal;color:#a78bfa}
/* La phrase unique (17/09) : 15 % plus petite que le titre d'origine, le
   mot « gratuitement » en bleu dans la ligne. */
.insc-titre-phrase{max-width:15em;margin-left:auto;margin-right:auto;font-size:clamp(29px,3.74vw,44px);line-height:1.12}
.insc-titre-phrase em{display:inline}
.insc-titre-phrase{max-width:none}
.insc-titre-suite{display:block;margin-top:10px;font:500 clamp(15px,1.45vw,19px)/1.4 Inter,sans-serif;letter-spacing:0;color:#8a90bd}
.insc-sous{margin:0 auto;max-width:34em;font:400 18px/1.55 Inter,sans-serif;color:#c3c7e6}
.insc-offre{margin:12px 0 0;font-size:13.5px;color:#8a90bd}
.insc-offre b{color:#fff}
.insc-recap{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:18px 0 0}
.insc-recap span{padding:7px 12px;border-radius:30px;background:#2a2350;border:1px solid #3a3570;font-size:13px;color:#e6e4ff}
.insc-erreur,.insc-info{margin:20px auto 0;max-width:620px;padding:12px 16px;border-radius:12px;font-size:14.5px;text-align:left}
.insc-erreur{background:#4a1024;border:1px solid #9b2c4b;color:#ffd1dc}
.insc-info{background:#2b1e63;border:1px solid #7c3aed;color:#e6e4ff}

/* Les connexions déléguées (désactivées, annoncées) */
.insc-delegues{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:28px auto 0;max-width:720px}
.insc-delegue{position:relative;display:flex;align-items:center;gap:14px;padding:18px 18px;border-radius:14px;
  border:1px solid #333863;background:#12142a;color:#fff;font:inherit;text-align:left;cursor:not-allowed;opacity:.92}
.insc-delegue svg{flex:none;width:34px;height:34px}
.insc-delegue span{display:grid;line-height:1.2}
.insc-delegue small{font-size:13px;color:#c3c7e6}
.insc-delegue b{font-size:17px;font-weight:700;color:#fff}
.insc-delegue i{position:absolute;top:-9px;right:10px;padding:2px 8px;border-radius:20px;background:#3b2a7d;border:1px solid #5b4bab;
  font:600 10.5px/1.4 Inter,sans-serif;font-style:normal;color:#ddd6fe}
.insc-delegue-vise{border-color:#a78bfa;box-shadow:0 0 0 3px #a78bfa33}
.insc-bientot{margin:10px 0 0;font-size:12.5px;color:#8a90bd}
.insc-ou{position:relative;margin:26px auto;max-width:720px}
.insc-ou::before{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:#282d52}
.insc-ou span{position:relative;padding:0 24px;background:#171a33;font-size:17px;color:#c3c7e6;text-transform:uppercase}

/* Le formulaire */
.insc-form{margin:0 auto;max-width:720px;padding:34px 40px 26px;border-radius:22px;background:#12142ab3;border:1px solid #282d52;display:grid;gap:18px}
.insc-champ{position:relative;display:block;margin:0}
.insc-champ>svg{position:absolute;left:24px;top:50%;width:26px;height:26px;transform:translateY(-50%);color:#c3c7e6;pointer-events:none}
.insc .insc-champ input{display:block;width:100%;height:66px;margin:0;padding:0 56px 0 72px;border-radius:12px;border:1px solid #333863;
  background:#171a33;color:#fff;font:400 18px Inter,sans-serif;box-shadow:none}
.insc .insc-champ input::placeholder{color:#9a9fc8}
.insc .insc-champ input:focus{outline:none;border-color:#a78bfa;box-shadow:0 0 0 3px #a78bfa40}
.insc .insc-champ .oeil{position:absolute;right:16px;top:50%;transform:translateY(-50%);width:38px;height:38px;border:0;background:transparent;
  color:#c3c7e6;display:grid;place-items:center;cursor:pointer;border-radius:8px}
.insc .insc-champ .oeil:hover{color:#fff;background:#ffffff10}
.insc-aide{margin:-8px 0 0;text-align:left;font-size:13px;color:#8a90bd}
.insc-envoyer{display:flex;align-items:center;justify-content:center;gap:14px;height:72px;margin-top:6px;border:0;border-radius:14px;cursor:pointer;
  background:linear-gradient(90deg,#7c3aed,#a855f7);color:#fff;font:700 21px Inter,sans-serif;box-shadow:0 14px 32px #7c3aed55;transition:filter .15s,transform .15s}
.insc-envoyer:hover{filter:brightness(1.08);transform:translateY(-1px)}
.insc-envoyer svg{width:24px;height:24px}
.insc-legal{margin:4px 0 0;font-size:14.5px;line-height:1.55;color:#c3c7e6}
.insc-legal a{color:#c4b5fd !important;text-decoration:underline}
.insc-deja{display:flex;align-items:center;justify-content:center;gap:14px;margin:28px auto 0;max-width:720px;font-size:18px;color:#c3c7e6}
.insc-deja::before,.insc-deja::after{content:"";flex:1;height:1px;background:#282d52}
.insc-deja a{font-weight:700;color:#a78bfa !important;text-decoration:none}
.insc-deja a:hover{text-decoration:underline}
.insc-atouts{list-style:none;margin:30px 0 0;padding:0;display:flex;justify-content:center;flex-wrap:wrap;gap:12px 0}
.insc-atouts li{display:flex;align-items:center;gap:10px;padding:0 20px;font-size:14.5px;color:#c3c7e6;white-space:nowrap}
.insc-atouts li+li{border-left:1px solid #282d52}
.insc-atouts svg{width:24px;height:24px;color:#a78bfa}

/* Les notes manuscrites et les panneaux flottants (décor) */
.insc-note{position:absolute;margin:0;font:600 26px/1.08 'Caveat','Segoe Print','Bradley Hand',cursive;color:#a78bfa;pointer-events:none}
.insc-note svg{display:block}
.insc-note-g{left:-175px;top:200px;transform:rotate(-14deg);text-align:left}   /* hors de la carte depuis que le titre tient sur une ligne (17/09) */
.insc-note-g svg{width:110px;height:20px;margin-top:4px}
.insc-note-d{right:-185px;top:170px;transform:rotate(-12deg);text-align:right}
.insc-note-d svg{width:46px;height:46px;margin:4px 30px 0 auto}
.insc-panneau{position:absolute;z-index:1;border-radius:22px;background:linear-gradient(160deg,#2a1c57cc,#1c1740cc);border:1px solid #3d3273;
  box-shadow:0 30px 60px #03030a80;pointer-events:none}
.insc-panneau-d{right:calc(50% - 640px);top:430px;display:grid;grid-template-columns:repeat(2,58px);gap:14px;padding:18px;transform:rotate(-8deg)}
.insc-panneau-d span{display:grid;place-items:center;width:58px;height:58px;border-radius:14px;background:#141630;border:1px solid #3d3273}
.insc-panneau-d svg{width:32px;height:32px}
.insc-plus{color:#c3c7e6;font-weight:800}
.insc-panneau-g{left:calc(50% - 660px);top:760px;width:240px;height:190px;padding:22px;transform:rotate(-10deg)}
.insc-panneau-g svg{position:absolute;left:18px;right:18px;bottom:16px;width:calc(100% - 36px)}
.insc-pastille{display:inline-block;padding:8px 14px;border-radius:12px;background:linear-gradient(90deg,#7c3aed,#a78bfa);color:#fff;
  font:700 17px Inter,sans-serif;transform:rotate(-6deg);box-shadow:0 10px 20px #7c3aed55}

/* Écrans plus étroits */
@media (max-width:1320px){.insc-panneau{display:none}}
@media (max-width:980px){
  .insc-carte{padding:44px 26px 32px}
  .insc-note{display:none}
}
@media (max-width:720px){
  .insc{padding:44px 12px 36px}
  .insc-marque span{font-size:38px}
  .insc-marque svg{width:48px;height:48px}
  .insc-devise{letter-spacing:.16em;font-size:11px}
  .insc-sous{font-size:16px}
  .insc-delegues{grid-template-columns:1fr}
  .insc-form{padding:22px 16px 18px}
  .insc .insc-champ input{height:58px;font-size:16px;padding-left:60px}
  .insc-champ>svg{left:18px}
  .insc-envoyer{height:62px;font-size:18px}
  .insc-deja{font-size:16px;flex-wrap:wrap}
  .insc-deja::before,.insc-deja::after{display:none}
  .insc-atouts li{padding:0 12px;white-space:normal}
  .insc-atouts li+li{border-left:0}
}
/* == PAGE RÉDUITE DE 30 % (17/09, demande client) ==========================
   Tout se réduit d'un bloc (zoom 0,7) sur ordinateur et tablette : la carte,
   les notes, les panneaux et leurs positions gardent leurs proportions.
   La hauteur minimale compense le zoom pour que le fond couvre toujours
   l'écran. Pas sur téléphone : le texte y serait trop petit, et un champ
   sous 16 px fait zoomer iOS. */
@media (min-width:721px){
  /* 17/09 : encore -15 % (0,7 × 0,85 = 0,595), demande client. */
  .insc{zoom:.595;min-height:calc(100vh / .595)}
}
/* == CARTE ÉTIRÉE VERS LE BAS (17/09, demande client) ======================
   Elle paraissait tassée en haut : plus d'air entre les parties, et la carte
   centrée verticalement dans l'écran (ordinateur et tablette). */
@media (min-width:721px){
  .insc{align-items:center}
  .insc-carte{padding:76px 72px 64px}
  .insc-devise{margin:18px 0 44px}
  .insc-titre-suite{margin-top:16px}
  .insc-offre{margin-top:18px}
  .insc-delegues{margin-top:42px}
  .insc-bientot{margin-top:14px}
  .insc-ou{margin:38px auto}
  .insc-form{padding:44px 44px 34px;gap:24px}
  .insc-aide{margin-top:-12px}
  .insc-envoyer{margin-top:10px}
  .insc-legal{margin-top:8px}
  .insc-deja{margin-top:44px}
  .insc-atouts{margin-top:40px}
  /* La carte étant centrée, les panneaux se calent sur le centre de l'écran. */
  .insc-panneau-d{top:calc(50% - 170px)}
  .insc-panneau-g{top:calc(50% + 150px)}
}

/* == CONNEXION EXTERNE BRANCHÉE (17/09) : le bouton devient un lien actif. == */
a.insc-delegue-actif{cursor:pointer;opacity:1;text-decoration:none;transition:border-color .18s,background .18s,transform .18s}
a.insc-delegue-actif:hover{border-color:#a78bfa;background:#221b46;transform:translateY(-1px);text-decoration:none}
a.insc-delegue-actif:focus-visible{outline:2px solid #a78bfa;outline-offset:2px}

/* == INTÉRIEUR AGRANDI, BLOC INCHANGÉ (17/09, demande client) =============
   Le texte et les champs étaient trop petits dans la fenêtre. On remonte le
   zoom de 0,595 à 0,68 (+14 %) et on REND la même hauteur en rognant les
   espaces intérieurs d'autant : la carte garde sa taille à l'écran, mais
   tout ce qu'elle contient grossit. Apple retiré, la rangée passe à deux
   colonnes — et la ligne « bientôt disponible » disparaît avec lui. */
@media (min-width:721px){
  .insc{zoom:.68;min-height:calc(100vh / .68)}
  /* ⚠ LES LARGEURS SE RÈGLENT AUSSI : au zoom 0,68, les 920 px de la carte
     donneraient 626 px à l'écran contre 547 avant. On les ramène pour que
     la carte occupe EXACTEMENT la même place qu'au zoom 0,595. */
  .insc-carte{padding:52px 56px 44px;max-width:805px}
  .insc-delegues,.insc-ou,.insc-form,.insc-deja{max-width:630px}
  .insc-devise{margin:14px 0 30px}
  .insc-delegues{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:30px}
  .insc-ou{margin:26px auto}
  .insc-form{padding:32px 44px 24px;gap:18px}
  .insc-deja{margin-top:30px}
  .insc-atouts{margin-top:28px}
  /* Les champs eux-mêmes : plus hauts et plus lisibles. */
  .insc .insc-champ input{height:70px;font-size:19px}
  .insc-champ>svg{width:28px;height:28px}
  .insc-envoyer{height:76px;font-size:22px}
  .insc-aide{font-size:14px}
  .insc-legal{font-size:15px}
  .insc-delegue{padding:20px}
  .insc-delegue b{font-size:18px}
  .insc-delegue small{font-size:13.5px}
  /* Les trois réassurances tiennent sur une ligne dans la carte rétrécie. */
  .insc-atouts li{padding:0 13px;font-size:13.5px}
  .insc-atouts svg{width:21px;height:21px}
}
