/* ═══════════════════════════════════════════ CONTACT — styles de page ═════
   Ne contient que ce qui n'existe pas dans base.css.
   ═════════════════════════════════════════════════════════════════════════ */

/* ── L'adresse — seul dispositif de contact du site, il n'y a pas de
      formulaire. Le bloc est traité comme une plaque : filet fort au-dessus,
      l'adresse en display, la note en dessous. ────────────────────────────── */
.adresse {
  margin-top: var(--e-5);
  padding-top: var(--e-4);
  /* dernier bloc de <main> : il lui faut sa propre respiration avant le pied
     nocturne, sinon la note vient buter contre le fond sombre. */
  padding-bottom: var(--e-5);
  border-top: var(--filet-e-fort) solid var(--texte-fort);
}

.adresse__surtitre { margin-bottom: var(--e-3); }

.adresse__mail {
  font-family: var(--display);
  font-weight: var(--poids-display);
  font-size: clamp(19px, 5.2vw, 56px);
  line-height: var(--lh-titre);
  letter-spacing: var(--ls-titre);
  color: var(--texte-fort);
  word-break: break-word;
}

.adresse__mail a {
  color: inherit;
  background-image: linear-gradient(var(--accent), var(--accent));
  background-repeat: no-repeat;
  background-position: 0 100%;
  background-size: 0 var(--filet-e-fort);
  padding-bottom: .08em;
  transition: background-size var(--d-souligne) var(--courbe),
              color var(--d-souligne) var(--courbe);
}

.adresse__mail a:hover,
.adresse__mail a:focus-visible {
  background-size: 100% var(--filet-e-fort);
  color: var(--accent);
}

.adresse .filet { margin: var(--e-4) 0 var(--e-3); }

.adresse__note { max-width: var(--mesure); }

@media (prefers-reduced-motion: reduce) {
  .adresse__mail a { transition: none; }
}