/* Contact : le texte à gauche, le formulaire à droite ; empilés sous 960 px. */
.contact { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: 56px; align-items: start; padding-block: 56px 80px; }
.contact .direct { margin-top: 20px; color: var(--text-2); }
.contact-form { display: grid; gap: 18px; padding: 24px; border: 1px solid var(--line-strong); border-radius: 14px; background: var(--panel); }
.field-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.form-foot { display: flex; align-items: center; flex-wrap: wrap; gap: 12px 18px; }
.form-foot .btn { cursor: pointer; }
.form-note { font-size: 13px; color: var(--text-3); max-width: 36ch; }
.contact-form.sent { justify-items: start; }
.contact-form.sent h2 { font-size: clamp(24px, 2.6vw, 30px); }
.contact-form.sent p { color: var(--text-2); }
@media (max-width: 960px) {
  .contact { grid-template-columns: minmax(0, 1fr); gap: 28px; }
}
@media (max-width: 560px) {
  .contact { padding-block: 40px 56px; }
  .contact-form { padding: 18px; }
  .field-row { grid-template-columns: minmax(0, 1fr); }
}