/* Fenêtres (assets/js/fenetre.js) et pages qui s'y ouvrent : mentions légales, confidentialité, conditions, contact, connexion, inscription.
   Même pop-in que la fiche d'une carte (feuille qui monte et couvre la page sauf le haut, voir .popin dans pages.css) et mêmes variables : sur chaque site,
   elle prend les couleurs et les polices du thème. */
.fenetre-ouverte{overflow:hidden}
.fenetre{position:fixed;inset:60px 0 0 0;margin:0 auto;width:min(980px,100%);max-width:none;height:calc(100% - 60px);max-height:none;padding:0;border:0;border-radius:20px 20px 0 0;overflow:auto;
  background:var(--papier);color:var(--encre);font:400 16px/1.6 var(--texte);box-shadow:0 -12px 40px rgba(0,20,60,.3);overscroll-behavior:contain;outline:none}
.fenetre::backdrop{background:rgba(0,20,60,.45);animation:fenetre-fond .3s ease-out}
.fenetre[open]{animation:fenetre-monte .4s cubic-bezier(.22,1,.36,1)}
@keyframes fenetre-fond{from{opacity:0}to{opacity:1}}
@keyframes fenetre-monte{from{transform:translateY(100%)}to{transform:none}}
@media (prefers-reduced-motion:reduce){.fenetre[open],.fenetre::backdrop{animation:none}}
.fenetre__fermer{position:sticky;top:10px;float:right;z-index:2;margin:10px 12px 0 0;width:38px;height:38px;border-radius:50%;border:1px solid var(--brume);background:var(--surface);color:var(--encre);font:600 22px/1 var(--titre);cursor:pointer}
.fenetre__fermer:focus-visible{outline:3px solid var(--orange);outline-offset:2px}
.fenetre__contenu{padding-top:16px}
.fenetre__attente{padding:40px 18px;text-align:center;color:var(--doux)}
.fenetre .fen-carte{border:0;border-radius:0;box-shadow:none;margin:0 auto;background:transparent}
.fenetre .acces{padding-top:8px}
/* Contenu commun : une carte, la même partout (fenêtre ou page entière) */
.fen-carte{max-width:720px;margin:28px auto;padding:30px 28px 34px;background:var(--surface);color:var(--encre);border:1px solid var(--brume);border-radius:16px;font:400 16px/1.6 var(--texte)}
.fen-carte h1{margin:0 0 16px;font:800 clamp(24px,4vw,30px)/1.15 var(--titre);color:var(--marque);letter-spacing:-.01em}
.fen-carte h1::after{content:"";display:block;width:56px;height:4px;margin-top:12px;border-radius:2px;background:var(--orange)}
.fen-carte h2{margin:26px 0 6px;font:700 16px/1.3 var(--titre);color:var(--marque)}
.fen-carte p{margin:0 0 12px}
.fen-carte a{color:var(--marque);text-decoration:underline;text-underline-offset:3px}
.fen-doux{color:var(--doux);font-size:14px}
.fen-form{display:grid;gap:16px;margin-top:18px}
.fen-champ{display:grid;gap:6px}
.fen-champ>span{font:600 14px var(--titre)}
.fen-champ small{color:var(--doux);font-size:13px}
.fen-champ :is(input,select,textarea){width:100%;padding:11px 12px;border:1px solid var(--brume);border-radius:10px;background:var(--papier);color:var(--encre);font:400 16px/1.4 var(--texte)}
.fen-champ textarea{resize:vertical;min-height:130px}
.fen-champ :is(input,select,textarea):focus-visible{outline:3px solid var(--orange);outline-offset:1px}
.fen-btn{justify-self:start;padding:12px 22px;border:2px solid var(--marque);border-radius:10px;background:transparent;color:var(--marque);font:700 16px var(--titre);cursor:pointer}
.fen-btn--principal{background:var(--orange-fort,var(--orange));border-color:var(--orange-fort,var(--orange));color:#fff}
.fen-btn:hover{filter:brightness(1.08)}
.fen-btn:disabled{opacity:.6;cursor:progress}
.fen-btn:focus-visible{outline:3px solid var(--orange);outline-offset:2px}
.encadre-fen{margin:0 0 12px;padding:12px 14px;border-radius:10px;border:1px solid var(--brume);background:var(--papier)}
.encadre-fen--erreur{border-color:#C2410C;color:#9A3412}
:root[data-theme="dark"] .encadre-fen--erreur{color:#FDBA8C}
.encadre-fen--ok{border-color:#2F8F6B}
.fen-erreur{margin:0 18px 12px;color:#C2410C}
.fen-piege{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.fen-carte .bascule{display:inline-flex;border:1px solid var(--brume);border-radius:10px;overflow:hidden}
.fen-carte .bascule button{padding:8px 16px;border:0;background:transparent;color:var(--encre);font:600 14px var(--titre);cursor:pointer}
.fen-carte .bascule button[aria-pressed="true"]{background:var(--marque);color:var(--surface)}
