/* Formulaire, prévisualisation, pages simples */
.page-form{background:linear-gradient(180deg,#eef0fa,var(--bg) 40%)}
.form-card{padding:24px 18px}
.form-head{text-align:center;margin-bottom:20px}
.field{display:block;margin-bottom:16px}
.field>span,.field>legend{display:block;font-weight:700;margin-bottom:6px;font-size:.95rem}
.field em{color:var(--red);font-style:normal}
.field input[type=text],.field input[type=email],.field input[type=tel],.field input[type=password],.field select{width:100%;padding:.8rem .9rem;font:inherit;border:2px solid var(--line);border-radius:12px;background:#fff;color:var(--ink)}
.field input:focus,.field select:focus{border-color:var(--navy);outline:none}
.field.invalid input,.field.invalid select{border-color:var(--red)}
.field__err{display:none;color:#b01c1c;font-size:.88rem;font-weight:600;margin-top:4px}
.field.invalid .field__err{display:block}
.hint{font-size:.85rem;color:var(--muted);margin-top:4px}
.two{display:grid;gap:0 14px}
.check{display:flex;gap:10px;align-items:flex-start;margin:6px 0 18px;font-size:.93rem}
.check input{width:22px;height:22px;margin-top:2px;flex:none;accent-color:var(--red)}
.hp{position:absolute;left:-9999px;opacity:0;height:0;width:0}

/* Recadrage photo */
.photo-box{border:2px dashed #b9bfdc;border-radius:16px;padding:16px;text-align:center;background:#fafbff}
.photo-box.invalid{border-color:var(--red)}
.cropper{position:relative;width:min(100%,300px);margin:0 auto 12px;aspect-ratio:1;border-radius:50%;overflow:hidden;background:#e9ecf8;touch-action:none;cursor:grab;border:4px solid #fff;box-shadow:0 0 0 3px var(--red)}
.cropper canvas{width:100%;height:100%;display:block}
.cropper.empty{cursor:default}
.cropper__ph{position:absolute;inset:0;display:grid;place-items:center;color:var(--muted);font-weight:600;padding:20px;font-size:.95rem}
.cropper:not(.empty) .cropper__ph{display:none}
.zoom{display:none;align-items:center;gap:10px;margin:0 auto 12px;max-width:300px}
.zoom.on{display:flex}
.zoom input{flex:1;accent-color:var(--red)}
.photo-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
input[type=file]{display:none}

/* Prévisualisation */
.preview-wrap{max-width:560px;margin:0 auto}
.poster-canvas{display:block;width:100%;height:auto;border-radius:14px;box-shadow:0 18px 44px rgba(31,42,107,.28);background:#e9ecf8;aspect-ratio:1}
.congrats{text-align:center;margin:22px 0}
.congrats h1{font-size:clamp(1.4rem,5vw,2rem)}
.actions{display:grid;gap:12px;margin-top:8px}
.actions .btn{width:100%}
.spinner{display:inline-block;width:1em;height:1em;border:3px solid rgba(255,255,255,.5);border-top-color:#fff;border-radius:50%;animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.prose{padding:26px 20px}
.prose h2{margin-top:1.4rem;font-size:1.25rem}
@media(min-width:760px){
  .form-card{padding:34px}
  .two{grid-template-columns:1fr 1fr}
  .actions{grid-template-columns:1fr 1fr}
}
