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

.page-title{ text-align:center; padding:28px 0 10px; }
.page-title h1{ font-size:2rem; color:#034ca7; }
.page-title .subtitle{ color:#555; }

.contact-section{ padding:40px 16px 60px; }
.contact-grid{
  display:grid;
  grid-template-columns: 1fr 1.3fr;
  gap:24px;
}
@media (max-width: 900px){
  .contact-grid{ grid-template-columns: 1fr; }
}

/* Card left */
.contact-card{
  background:#fff; border-radius:12px; padding:22px;
  box-shadow:0 8px 24px rgba(0,0,0,.06);
}
.contact-card h2{ margin:0 0 10px; color:#034ca7; }
.contact-list{ display:grid; gap:10px; margin:10px 0 6px; }
.contact-list li{ display:flex; align-items:center; gap:10px; }
.contact-list i{ color:#034ca7; }
.contact-card a{ color:#034ca7; }
.mini-note{ color:#444; font-size:.95rem; margin-top:8px; }

/* Form right */
.contact-form{
  background:#fff; border-radius:12px; padding:22px;
  box-shadow:0 8px 24px rgba(0,0,0,.06);
}
.contact-form .hp{ display:none !important; }
.contact-form .row{ display:flex; gap:14px; margin-bottom:12px; }
.contact-form .row.two > *{ flex:1; }
.contact-form input,
.contact-form textarea{
  width:100%; border:1px solid #d5d9e0; border-radius:10px;
  padding:12px 14px; font-size:1rem;
}
.contact-form textarea{ resize:vertical; min-height:130px; }
.contact-form input:focus,
.contact-form textarea:focus{
  outline:3px solid rgba(3,76,167,.2);
  border-color:#034ca7;
}
.btn-group{ display:flex; gap:12px; flex-wrap:wrap; justify-content:flex-start; margin-top:6px; }
.btn-primary, .btn-outline{
  padding:12px 18px; border-radius:10px; font-weight:700; display:inline-flex; align-items:center; gap:10px;
  transition:.2s;
}
.btn-primary{ background:#ff6a00; color:#fff; border:none; }
.btn-primary:hover{ background:#e65c00; }
.btn-outline{ border:2px solid #034ca7; color:#034ca7; background:#fff; }
.btn-outline:hover{ background:#034ca7; color:#fff; }

/* Centre les 2 boutons + espace */
.contact-cta { justify-content: center; gap: 14px; }

/* Icône WhatsApp inline */
.wa-icon { display:inline-flex; align-items:center; justify-content:center; }
.wa-icon svg { display:block; }

/* Image sous les boutons */
.wa-image { text-align:center; margin-top: 10px; }
.wa-image img { height: 40px; width:auto; display:inline-block; }

/* Harmonise le bouton WhatsApp */
.btn-outline { border:2px solid #034ca7; color:#034ca7; }
.btn-outline:hover { background:#034ca7; color:#fff; }

/* Image dans la carte gauche */
.contact-photo{ margin-top:12px; }
.contact-photo img{
  width:100%;
  display:block;
  border-radius:12px;
  object-fit:cover;
  aspect-ratio:16/9;
  box-shadow:0 8px 20px rgba(0,0,0,.08);
}

/* --- Boutons contact : même taille + centrés --- */
:root{
    /* largeur fixe identique pour les 2 boutons (change la valeur si tu veux) */
    --contact-btn-w: 220px;
  }
  
  .contact-form .btn-group{
    display: flex;
    justify-content: center;   /* centrage horizontal */
    align-items: center;
    gap: 14px;
  }
  
  .contact-form .btn-primary,
  .contact-form .btn-outline{
    width: var(--contact-btn-w);   /* même largeur */
    height: 48px;                  /* même hauteur */
    padding: 0 22px;               /* on laisse le texte respirer */
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;                      /* espace avec l’icône */
    border-radius: 10px;
    font-weight: 700;
    white-space: nowrap;
    box-sizing: border-box;
  }
  
  .contact-form .btn-outline{ border-width: 2px; }
  .contact-form .btn-primary i,
  .contact-form .btn-outline i{ margin-right: 6px; }
  
  /* Mobile : boutons pleine largeur l’un sous l’autre */
  @media (max-width: 540px){
    .contact-form .btn-primary,
    .contact-form .btn-outline{
      width: 100%;
      min-width: 0;
    }
    .contact-form .btn-group{ gap: 10px; }
  }