/* contact.css – version mobile-friendly sans débordement */

/* ========== RÉINITIALISATION BOX-SIZING ========== */
#contact, #contact * { box-sizing: border-box; }

/* ========== SECTION ========== */
#contact {
  padding: 4rem 1rem;
  background: #F7F5F0;
}

/* Conteneur */
#contact .container {
  max-width:1100px;
  margin:0 auto;
  padding:0 1rem;
}

/* Titre */
#contact .section-title{
  text-align:center;
  font-size:2.2rem;
  font-weight:600;
  margin-bottom:2rem;
  color:#333;
}

/* ===== LAYOUT GLOBAL ===== */
#contact .contact-layout{
  display:flex;
  flex-direction:column;  /* mobile */
  align-items:center;
  gap:2rem;
  width:100%;
}

/* ===== CARTE ===== */
#contact .map-fullwidth{
  width:100%;
  max-width:600px;
  border-radius:8px;
  overflow:hidden;
  box-shadow:0 4px 12px rgba(0,0,0,.05);
  display:flex;
  justify-content:center;
}
#contact .map-fullwidth iframe{
  width:100%;
  height:250px;
  border:0;
}

/* ===== VIGNETTES ===== */
#contact .contact-info{
  width:100%;
  max-width:600px;
  display:grid;
  grid-template-columns:1fr;      /* mobile : 1 colonne */
  gap:1.5rem;
  justify-content:center;
}
#contact .contact-item{
  background:#fff;
  padding:1.8rem;
  border-radius:12px;
  box-shadow:0 4px 12px rgba(0,0,0,.05);
  text-align:center;
  width:100%;
  max-width:340px;
  margin:0 auto;
}
#contact .contact-item h4{
  color:var(--gold);
  margin-bottom:.5rem;
  font-size:1.4rem;
}
#contact .contact-item p{
  color:#555;
  line-height:1.5;
  margin:0;
}

/* ----- Bouton email (2ᵉ vignette) ----- */
#contact .contact-item:nth-child(2) a{
  display:block;            /* prend toute la largeur dispo */
  width:100%;
  overflow-wrap:anywhere;   /* autorise la coupure dans l’adresse */
  background:linear-gradient(135deg,var(--accent-start),var(--accent-end));
  color:#fff;
  padding:.6rem 1.2rem;
  border-radius:8px;
  box-shadow:0 4px 12px rgba(202,169,99,.5);
  text-decoration:none;
  font-weight:600;
  transition:transform .3s, box-shadow .3s;
}
#contact .contact-item:nth-child(2) a:hover{
  transform:translateY(-3px);
  box-shadow:0 6px 16px rgba(202,169,99,.7);
}

/* ===== TABLETTE (≥768 px) ===== */
@media (min-width:768px){
  #contact .map-fullwidth iframe{ height:350px; }
  #contact .contact-info{
    grid-template-columns:repeat(2,minmax(260px,1fr));
  }
}

/* ===== DESKTOP (≥1024 px) ===== */
@media (min-width:1024px){
  #contact .contact-layout{
    flex-direction:row-reverse;  /* carte à droite */
    align-items:flex-start;
  }
  /* carte fixe à droite */
  #contact .map-fullwidth{
    flex:0 0 400px;
    margin-left:2rem;
    max-width:none;
  }
  #contact .map-fullwidth iframe{ height:450px; }
  /* vignettes à gauche */
  #contact .contact-info{
    display:flex;
    flex-direction:column;
    gap:1.5rem;
    margin-right:2rem;
    margin-left:0;
    max-width:none;
  }
  #contact .contact-item{
    max-width:100%;
    margin:0;
  }
}
