/* ==========================================================================
   Contact + merci — formulaire en verre, coordonnées, état « demande envoyée ».
   Le formulaire (#contactForm, champs, clé Web3Forms) n'est que restylé.
   ========================================================================== */
.contact-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(24px,4vw,56px);align-items:start}
.contact-info{display:grid;gap:10px;position:sticky;top:110px}
.contact-line{
  display:flex;align-items:center;gap:16px;padding:16px 18px;border-radius:var(--radius);
  background:rgba(255,255,255,.03);border:1px solid var(--line);transition:background var(--dur),border-color var(--dur),transform .5s var(--ease-out);
}
.contact-line:hover{background:rgba(255,255,255,.06);border-color:rgba(244,114,182,.35);transform:translateX(4px)}
html[dir="rtl"] .contact-line:hover{transform:translateX(-4px)}
.contact-line svg{flex:none;width:40px;height:40px;padding:10px;border-radius:12px;stroke:#F5E1FF;background:var(--iris-soft);border:1px solid rgba(255,255,255,.12)}
.contact-line span{display:grid;font-size:.78rem;font-family:var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}
.contact-line b{font-family:var(--font-sans);font-size:.98rem;font-weight:560;letter-spacing:0;text-transform:none;color:var(--text);word-break:break-word}
.based-in{margin-top:6px;padding:18px;border-radius:var(--radius);border:1px dashed var(--line-hi);font-size:.88rem;color:var(--dim)}

#contactForm{display:grid;gap:18px;padding:clamp(24px,3.4vw,40px)}
#contactForm label{display:block;margin-bottom:8px;font-size:.84rem;font-weight:500;color:var(--muted)}
#contactForm input:not([type="checkbox"]),#contactForm select,#contactForm textarea{
  width:100%;padding:14px 16px;border-radius:14px;font-size:.96rem;color:var(--text);
  background:rgba(0,0,0,.32);border:1px solid var(--line-hi);
  transition:border-color var(--dur-fast),box-shadow var(--dur-fast),background var(--dur-fast);
}
#contactForm select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23A9A9B6' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;background-size:16px;padding-inline-end:42px}
html[dir="rtl"] #contactForm select{background-position:left 14px center}
#contactForm select option{background:#121218;color:var(--text)}
#contactForm textarea{min-height:150px;resize:vertical}
#contactForm input:focus,#contactForm select:focus,#contactForm textarea:focus{outline:none;border-color:rgba(244,114,182,.65);background:rgba(0,0,0,.45);box-shadow:0 0 0 4px rgba(192,132,252,.14)}
#contactForm input[type="checkbox"]{accent-color:#C084FC;width:18px;height:18px;margin-top:2px;flex:none}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.form-consent{display:flex;gap:12px;align-items:flex-start;font-size:.86rem;color:var(--muted)}
.form-consent a,.form-foot a{color:#F0ABFC;text-decoration:underline;text-underline-offset:3px}
.form-foot{font-size:.82rem;color:var(--dim)}

/* demande envoyée */
.form-done{display:none;padding:clamp(28px,4vw,48px);text-align:center;justify-items:center;gap:16px}
.form-done.show{display:grid}
.fd-check svg{width:84px;height:84px;overflow:visible}
.fd-ring{fill:none;stroke:rgba(255,255,255,.12);stroke-width:2}
.fd-tick{fill:none;stroke:url(#fdIris);stroke-width:4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:60;stroke-dashoffset:60}
.form-done.show .fd-tick{animation:fdTick .8s var(--ease-lux) .15s forwards}
@keyframes fdTick{to{stroke-dashoffset:0}}
.fd-title{font-size:var(--fs-h2)}
.fd-text{color:var(--muted);max-width:46ch}
.fd-text strong{color:var(--text)}
.fd-steps{display:grid;gap:10px;margin:8px 0 10px;text-align:start}
.fd-steps li{display:flex;gap:12px;align-items:center;color:var(--muted);font-size:.94rem}
.fd-steps b{display:grid;place-items:center;flex:none;width:28px;height:28px;border-radius:50%;font-family:var(--font-mono);font-size:.74rem;color:#0B0B10;background:var(--iris)}
.fd-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}

@media (max-width:900px){
  .contact-grid{grid-template-columns:1fr}
  .contact-info{position:static}
}
@media (max-width:520px){.form-row{grid-template-columns:1fr}}