/* =========================
   Page Contact — bloc d'introduction en deux colonnes
   Chargée par contact-devis.html seulement, après footer.css.
   Texte aligné à gauche, coordonnées dans un encadré à droite ; une colonne en mobile.
   Les !important ne font que contrer ceux de responsive-overrides.css (marges h2/p en mobile).
   ========================= */
.contact-intro-section {
  padding-top: 2rem;
  padding-bottom: 1rem;
}

.contact-intro {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 20rem;
  gap: 2.5rem 4rem;
  align-items: start;
  max-width: 68rem;
  margin: 0 auto 2rem auto;
}

.contact-intro-text {
  text-align: left;
}

.contact-intro-text .h3-heading {
  margin: 0 0 1rem 0 !important;
  text-align: left;
  text-wrap: balance;
}

.contact-intro-text p {
  max-width: 40rem;
  margin: 0 0 0.9rem 0 !important;
  font-size: 1.05rem;
  line-height: 1.65;
  color: #222;
  text-align: left;
}

.contact-intro-text p:last-child {
  margin-bottom: 0 !important;
}

.contact-intro-text a {
  color: #d63c13;
  font-weight: 600;
}

/* Encadré de coordonnées : valeurs de .highlight-block (fond gris, liseré orange) */
.contact-direct {
  padding: 1.5rem 1.75rem;
  background: #f8f9fa;
  border-left: 4px solid #FF4B1F;
  border-radius: 10px;
  text-align: left;
}

.contact-direct-title {
  margin: 0 0 0.75rem 0 !important;
  font-size: 1.05rem !important;
  font-weight: 700;
  line-height: 1.35;
  color: #0a0a0a;
}

.contact-direct-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.contact-direct-list li {
  margin: 0 0 0.75rem 0;
}

.contact-direct-list li:last-child {
  margin-bottom: 0;
}

.contact-direct-label {
  display: block;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #555;
}

/* Liens : orange foncé de la charte (contraste AA sur le gris), cible tactile de 44 px */
.contact-direct .contact-direct-list a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: #d63c13;
  font-weight: 600;
  font-size: 1.05rem;
  overflow-wrap: anywhere;
}

.contact-direct .contact-direct-list a:hover {
  color: #b3300d;
}

.contact-intro a:focus-visible {
  outline: 2px solid #192a56;
  outline-offset: 2px;
}

/* Tablette et mobile : une colonne, coordonnées sous le texte */
@media (max-width: 991px) {
  .contact-intro {
    grid-template-columns: minmax(0, 1fr);
    gap: 1.5rem;
    max-width: 40rem;
  }
}

@media (max-width: 767px) {
  .contact-intro-section {
    padding-top: 1.25rem;
  }

  .contact-direct {
    padding: 1.25rem;
  }
}
