/* ============================================================================
   CONTACT.CSS — FORMULAIRE DE CONTACT
   ============================================================================
   5e fichier du CSS découpé du site (voir l'ordre complet en tête de
   base.css). Dépend des variables de base.css : à charger après lui.

   Utilisé par les 3 pages de contact du site (contact.html à la racine,
   a2s-supply/contact.html, cdex/contact.html) : les 3 formulaires
   partagent exactement les mêmes classes, seuls les champs et le texte
   changent d'une page à l'autre (voir le HTML de chaque page).
   ========================================================================== */

.form-grid { display: grid; gap: var(--sp-3); }
.form-row { display: grid; gap: var(--sp-3); grid-template-columns: 1fr 1fr; }
.field { display: grid; gap: 0.4rem; }
.field label { font-weight: 600; font-size: 0.9rem; color: var(--c-navy-900); }
.field input,
.field select,
.field textarea {
  padding: 0.85em 1em;
  border-radius: var(--radius-s);
  border: 1.5px solid var(--c-line);
  background: var(--c-white);
  font-size: 0.95rem;
  transition: border-color var(--transition), box-shadow var(--transition);
}
.field input:focus,
.field select:focus,
.field textarea:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: 0 0 0 4px var(--accent-light);
}
.field textarea { resize: vertical; min-height: 130px; }
.field small { color: var(--c-ink-soft); font-size: 0.8rem; }

.contact-info-card {
  background: var(--c-navy-900);
  color: var(--c-white);
  border-radius: var(--radius-l);
  padding: var(--sp-4);
}
.contact-info-card h3 { color: var(--c-white); }
.contact-line {
  display: flex;
  align-items: flex-start;
  gap: 0.8rem;
  padding-block: var(--sp-2);
  border-bottom: 1px solid rgba(255,255,255,0.12);
}
.contact-line:last-child { border-bottom: none; }
.contact-line svg { width: 22px; height: 22px; color: var(--accent); flex-shrink: 0; margin-top: 2px; }
.contact-line strong { display: block; color: var(--c-white); }
.contact-line span { color: rgba(255,255,255,0.7); font-size: 0.92rem; }

.form-success {
  display: none;
  align-items: center;
  gap: 0.7rem;
  padding: var(--sp-3);
  border-radius: var(--radius-s);
  background: #e5f6ea;
  color: #1e6b3a;
  font-weight: 600;
  margin-top: var(--sp-3);
}
.form-success.is-visible { display: flex; }

/* ----------------------------------------------------------------------
   RESPONSIVE
   ---------------------------------------------------------------------- */
@media (max-width: 1240px) {
  .form-row { grid-template-columns: 1fr; }
}
