/* Mefami — page de contact /contact.

   Feuille PROPRE À CETTE PAGE, posée après `styles.css`, sur le modèle de
   verify/verify.css : jetons de thème du site uniquement (variante nocturne
   incluse), décalages en propriétés LOGIQUES pour l'arabe (dir="rtl"). */

.ct [hidden] { display: none !important; }

.ct { padding: 56px 0 88px; }
.ct-shell { max-width: 640px; }
.ct .sec-eyebrow { margin-bottom: 14px; }

.ct-title {
  font-family: var(--font-title);
  font-size: clamp(28px, 4vw, 40px);
  font-weight: 800; letter-spacing: -1px; line-height: 1.14;
  color: var(--ink);
  margin: 0; text-wrap: balance;
}
.ct-lede {
  font-size: 17px; line-height: 1.65; color: var(--ink-soft);
  margin: 18px 0 0;
}

/* ---- Le formulaire -------------------------------------------------------- */
.ct-form {
  margin: 32px 0 0; padding: 26px 24px;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-sm);
}

.ct-champ { margin: 0 0 20px; }
.ct-champ label {
  display: block;
  font-size: 13px; font-weight: 800; letter-spacing: 0.3px;
  color: var(--ink); margin: 0 0 7px;
}
.ct-input {
  width: 100%;
  font-family: inherit; font-size: 15px; line-height: 1.4;
  color: var(--ink);
  background: var(--surface-alt);
  border: 1.5px solid var(--border-strong);
  border-radius: var(--r-md);
  padding: 12px 14px;
}
.ct-input::placeholder { color: var(--ink-muted); }
.ct-textarea { resize: vertical; min-height: 140px; }
.ct-input:focus-visible,
.ct .btn:focus-visible {
  outline: 2px solid var(--primary);
  outline-offset: 2px;
}

.ct-captcha { margin: 4px 0 20px; }

.ct-actions { display: flex; align-items: center; gap: 14px; }

.ct-msg { margin: 14px 0 0; font-size: 13.5px; font-weight: 600; }
.ct-msg.ok { color: var(--success-ink); }
.ct-msg.err { color: var(--alert-ink); }

.ct-direct {
  margin: 22px 0 0;
  font-size: 13.5px; line-height: 1.55; color: var(--ink-soft);
}
.ct-direct a { color: var(--primary-ink); text-decoration: underline; text-underline-offset: 2px; }

.ct-retour { margin: 40px 0 0; }

/* iOS zoome sur tout champ < 16px : on force 16px pour éviter le zoom forcé. */
@media (max-width: 560px) {
  .ct-input { font-size: 16px; }
}
