/* ===================================================== */
/* =============== PAGE CONTACT ========================= */
/* ===================================================== */

h1 {
  margin-bottom: 25px;
  position: relative;
}

h1::after {
  content: "";
  width: 50px;
  height: 3px;
  background: #c2a878;
  position: absolute;
  bottom: -8px;
  left: 0;
}

/* Bloc contact premium */
.contact-item {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 15px;
}

.contact-item .icon {
  font-size: 1.2em;
  margin-top: 3px;
}

.contact-item a:not(.btn-call):not(.btn-mail) {
  color: #2f2f2f;
}

.contact-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 35px;
  margin-top: 50px;
}

/* Boutons */
.contact-buttons {
  margin-top: 25px;
  display: flex;
  gap: 15px;
  flex-wrap: wrap;
}

/* Bloc fond beige */
.alt {
  background-color: #e6dccf;
  border-radius: 14px;
}

/* Ajustement grille contact */
.contact-grid {
  margin-top: 60px;
}



/* ================= MOBILE CONTACT ================= */

@media (max-width: 768px) {

  .contact-buttons {
    flex-direction: column;
    align-items: stretch;
  }

  .btn-call,
  .btn-mail {
    text-align: center;
  }

  .contact-grid {
    margin-top: 40px;
    gap: 25px;
  }

  .alt {
    padding: 25px 15px;
    border-radius: 10px;
  }

.contact-grid {
  gap: 25px;
}

}