/* =====================================================================
   Styles du composant SectionContact.
   ===================================================================== */
.section-contact{background:var(--papier);border-top:1px solid var(--trait)}
.contact-grille{
  display:grid;grid-template-columns:1fr 1fr;gap:50px;
  align-items:center;margin-top:20px;
}
/* Plus d'espace entre deux coordonnées différentes (gap) qu'entre une
   étiquette et sa propre valeur (margin-bottom du strong) — sans quoi
   l'interligne naturel du texte fait paraître l'inverse. */
.contact-coordonnees{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:22px}
.contact-coordonnees strong{
  display:block;font-size:12.5px;text-transform:uppercase;letter-spacing:.05em;
  color:var(--accent-fonce);line-height:1;margin-bottom:5px;
}
.contact-coordonnees a{color:var(--encre);text-decoration:none}
.contact-coordonnees a:hover{color:var(--accent);text-decoration:underline}
.contact-reservation{text-align:center;background:var(--fond);border:1px solid var(--trait);border-radius:8px;padding:34px 24px}
.contact-reservation p{margin:0 0 18px}

@media (max-width:720px){
  .contact-grille{grid-template-columns:1fr}
}