/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Aug 29 2025 | 23:39:09 */
/* ===== BASE ===== */
.contact-section {
  font-family: 'Avenir Next','Montserrat','Nunito Sans',Arial,sans-serif;
  background: #fff;
  color: #00008f;
  padding: 56px 3%;
}

.contact-container {
  width: 100%;
  display: grid;
  grid-template-columns: 60% 40%;
  gap: 1px;
}

.contact-left {
	background: #e8ebfa;
	padding: 30px;
	border-radius: 25px;
	}

.contact-right {
	background: #fff;
	padding: 30px 0;
	
	}

.contact-title {
   font-family: 'Avenir Next','Montserrat','Nunito Sans',Arial,sans-serif;
	font-weight: 700;
  text-transform: uppercase;
  font-size: 2.3rem;
  letter-spacing: 0.0045em;
  margin: 0 0 20px;
	text-align: center;
}

.contact-form {
  
	align-content:center;
}

.contact-gdpr {
  color: #666;
  font-size: .95rem;
  margin-top: 12px;
}


/* ===== COLONNE DROITE (coordonnées) ===== */
.contact-card {
  padding: 10px 0;
  text-align: center;
}



.contact-icon {
  display: inline-block;
  margin-bottom: 0px;
}

.contact-icon .icon {
  width: 80px;
  height: 80px;
  display: block;
  fill: currentColor;
  transition: transform 0.3s ease, filter 0.3s ease;
  
  /* Effet relief */
  filter: drop-shadow(0 2px 4px rgba(0,0,0,0.15));
  padding: 12px;
}

/* Effet au hover : zoom + brillance */
.contact-icon:hover .icon {
  transform: scale(1.15);
  
}

.contact-info {
  margin-top: 4px;
  color: #00008f;
  font-weight: 400;
  text-decoration: none;
  font-size: 1rem;
	}
	.contact-address {
	font-style:normal;
}

.contact-link {
  color: #00008f;
  font-weight: 400;
  text-decoration: none;
  font-size: 1rem;
}

.contact-link:hover {
  text-decoration: underline;
}


/* ===== HORAIRES ===== */

/* Carte horaires — plein large de la colonne, look cohérent */
.card-hours{
  
  background:#fff;
  padding:16px 18px;
  color:#00008f;
  font-family:'Avenir Next','Montserrat','Nunito Sans',Arial,sans-serif;
  margin-top:30px;
}

/* En-tête : icône + titre alignés à gauche */
.hours-header{
  display:flex;
  align-items:center;
  justify-content: center;
  gap:10px;
  margin-bottom:10px;
	
}

.icon-clock{
  width:28px; height:28px; display:block;
  color:#00008f;
}

.contact-hours-title{
  font-family:'Avenir Next','Montserrat','Nunito Sans',Arial,sans-serif;
  font-weight:700;
  text-transform:uppercase;
  font-size:1.35rem;           /* un cran sous tes gros H2, plus élégant ici */
  letter-spacing:.03em;
  margin:0;
  color:#00008f;
}

/* Tableau 2 colonnes : jour / horaires */
.hours-table {
  font-size: 1rem;
  line-height: 1.7;
  color: #00008f;
  font-family: 'Avenir Next','Montserrat','Nunito Sans',Arial,sans-serif;
}

/* Chaque ligne est un flex avec bordure */
.hours-table .row {
  display: flex;
  justify-content: space-between;
  padding: 10px 0;
  border-top: 1px solid #f0f2f7;
}

/* Retirer la bordure sur la première ligne */
.hours-table .row:first-child {
  border-top: none;
}



.hours-table .day {
  font-weight: 600;
  flex: 0 0 30%;   /* largeur fixe/mini pour bien aligner les horaires */
	margin-left: 25%;
}



.hours-table .time {
  
  flex: 1;        /* prend le reste */
  text-align: left;
}




/* ===FORMULAIRE WPFORMS=== */

/* ====== WPForms – colonne gauche (scopé) ====== */
.contact-left .wpforms-form {
  font-family: 'Avenir Next','Montserrat','Nunito Sans',Arial,sans-serif;
  color: #00008f;
}

/* Labels */
.contact-left .wpforms-form .wpforms-field-label,
.contact-left .wpforms-form .wpforms-field-sublabel {
  color: #00008f;
  font-weight: 600;
}

/* Champs : inputs + textarea */
.contact-left .wpforms-form input[type="text"],
.contact-left .wpforms-form input[type="email"],
.contact-left .wpforms-form input[type="tel"],
.contact-left .wpforms-form textarea {
  font-family: 'Avenir Next','Montserrat','Nunito Sans',Arial,sans-serif;
  color: #00008f;
  background: #fff;
  border: 1.5px solid #d7dcfa; /* léger cadre bleuté */
  border-radius: 10px;
  padding: 12px 14px;
  transition: border-color .2s ease, box-shadow .2s ease;
}



/* Focus */
.contact-left .wpforms-form input:focus,
.contact-left .wpforms-form textarea:focus {
  outline: none;
  border-color: #00008f;
  box-shadow: 0 0 0 3px rgba(0, 0, 143, 0.12);
}

/* Compteur de caractères */
.contact-left .wpforms-form .wpforms-field-limit-text {
  font-size: 0.8rem;
font-style: italic;
	margin-top: 6px;
}

/* ====== RGPD – champ avec classe personnalisée "formulaire-consentement" ====== */
/* Ajoute la classe dans WPForms > ton champ consentement > Avancé > Classe CSS */
/* RGPD – style du texte à côté de la case */
div.wpforms-container-full .wpforms-field.wpforms-field-checkbox ul li input+label, div.wpforms-container-full .wpforms-field.wpforms-field-radio ul li input+label, div.wpforms-container-full .wpforms-field.wpforms-field-payment-checkbox ul li input+label, div.wpforms-container-full .wpforms-field.wpforms-field-payment-multiple ul li input+label, div.wpforms-container-full .wpforms-field.wpforms-field-gdpr-checkbox ul li input+label{
 font-family: 'Avenir Next','Montserrat','Nunito Sans',Arial,sans-serif;
	font-style: italic;
  font-size: 0.8rem;
  color: #808080;
  line-height: 1.5;
  font-weight: 400;
}

/* Le lien "politique de confidentialité" dans ce texte */
div.wpforms-container-full .wpforms-field.wpforms-field-gdpr-checkbox.formulaire-consentement ul li input+label a {
  color: #00008f;
  text-decoration: underline;
}


/* Case à cocher RGPD */
.contact-left .wpforms-form .formulaire-consentement input[type="checkbox"]{
  width: 16px; height: 16px;
  margin-right: 8px;
  accent-color: #00008f; /* navigateurs modernes */
}

/* ====== Bouton Envoyer ====== */

div.wpforms-container-full input[type=submit]:not(:hover):not(:active), div.wpforms-container-full button[type=submit]:not(:hover):not(:active), div.wpforms-container-full .wpforms-page-button:not(:hover):not(:active), .wp-core-ui div.wpforms-container-full input[type=submit]:not(:hover):not(:active), .wp-core-ui div.wpforms-container-full button[type=submit]:not(:hover):not(:active), .wp-core-ui div.wpforms-container-full .wpforms-page-button:not(:hover):not(:active) {
    background-color: #00008f;
    color: #fff;
	font-family: 'Avenir Next','Montserrat','Nunito Sans',Arial,sans-serif;
	 
}




.contact-left .wpforms-form .wpforms-submit {
  display: block;          /* pour que le bouton occupe une ligne entière */
  width: 40%;              /* largeur conservée */
  margin: 20px auto 0;     /* auto = centre horizontalement, avec une marge haute */
  font-family: 'Avenir Next','Montserrat','Nunito Sans',Arial,sans-serif;
  background-color: #00008f;
  color: #fff;
  border: none;
  border-radius: 12px;
  padding: 12px 20px;
  font-weight: 700;
  letter-spacing: .02em;
  cursor: pointer;
  box-shadow: 0 6px 18px rgba(0,0,143,0.18);
  transition: transform .15s ease, box-shadow .15s ease, background-color .15s ease;
}


.contact-left .wpforms-form .wpforms-submit:hover {
  background: #000066;              /* bleu plus profond */
  transform: translateY(-2px);      /* effet plus visible */
  box-shadow: 0 12px 28px rgba(0,0,143,0.30); /* ombre plus intense */
}


.contact-left .wpforms-form .wpforms-submit:active {
  transform: translateY(0);
  box-shadow: 0 6px 18px rgba(0,0,143,0.18);
}

/* Messages d’erreur/succès (optionnel, ton bleu) */
.contact-left .wpforms-form .wpforms-error,
.contact-left .wpforms-form .wpforms-field.wpforms-has-error input,
.contact-left .wpforms-form .wpforms-field.wpforms-has-error textarea {
  border-color: #d12b2b !important;
}

.contact-left .wpforms-confirmation-container {
  border-radius: 12px;
  color: #00008f;
  font-weight: 600;
}


/* Mise en page du message de confirmation */
/* Bloc confirmation */
.wf-confirm-block {
  background: #fff;
  padding: 30px;
  border-radius: 20px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.08);
  text-align: center;
  margin: 20px auto;
  
}


div#wpforms-confirmation-752 {
    background: #fff;
    border: none;
    border-radius: 29px;
}

/* Ligne icône + texte */
.wf-confirm {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  margin-bottom: 18px;
}

/* Icône en vert */
.wf-anim-ok {
  width: 110px !important;
  height: 110px !important;
  flex: 0 0 56px;
  color: #02b302; /* vert succès */
}

/* Texte */
.wf-confirm-text {
  font-family:'Avenir Next','Montserrat','Nunito Sans',Arial,sans-serif;
  color:#00008f;
  line-height: 1.6;
  font-size: 1.05rem;
}

/* Animation cercle + check */
.ok { fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }

.ok-circle {
  stroke-dasharray: 62.8;
  stroke-dashoffset: 62.8;
  animation: drawCircle .9s ease-out forwards;
}
.ok-check {
  stroke-dasharray: 24;
  stroke-dashoffset: 24;
  animation: drawCheck .5s ease-out forwards .95s;
}

@keyframes drawCircle { to { stroke-dashoffset: 0; } }
@keyframes drawCheck  { to { stroke-dashoffset: 0; } }

@media (prefers-reduced-motion: reduce){
  .ok-circle,.ok-check { animation:none !important; stroke-dashoffset:0 !important; }
}

/* Bouton CTA */
.wf-confirm-actions {
  margin: 45px 15px 10px 15px !important;
  display: flex;
  justify-content: space-evenly;
	font-size: 1rem !important;
}

.wf-confirm-actions .btn-cta {
  display:inline-block;
  background:#00008f;
  color:#fff;
  text-decoration:none;
  font-family:'Avenir Next','Montserrat','Nunito Sans',Arial,sans-serif;
  font-weight:700;
  letter-spacing:.02em;
  padding:12px;
  border-radius:12px;
  box-shadow:0 6px 18px rgba(0,0,143,.18);
  transition:transform .15s ease, box-shadow .15s ease, background-color .15s ease;
}

/* Largeur harmonisée des deux boutons de confirmation */
.wf-confirm-actions .btn-cta,
.wf-confirm-actions .btn-ghost {
  width: 45%;
  text-align: center;
}




.wf-confirm-actions .btn-cta:hover {
  background:#000066;
  transform:translateY(-2px);
  box-shadow:0 12px 28px rgba(0,0,143,.30);
}
.wf-confirm-actions .btn-cta:active {
  transform:translateY(0);
  box-shadow:0 6px 14px rgba(0,0,143,.22);
}
/* Bouton secondaire (ghost) */
.wf-confirm-actions .btn-ghost {
  display:inline-block;
  background:transparent;
  border: 1.5px solid #00008f;
  color:#00008f;
  text-decoration:none;
  font-family:'Avenir Next','Montserrat','Nunito Sans',Arial,sans-serif;
  font-weight:700;
  letter-spacing:.02em;
  padding:12px 20px;
  border-radius:12px;
  transition:background-color .15s ease, transform .15s ease, box-shadow .15s ease;
}

.wf-confirm-actions .btn-ghost:hover {
  background:#eef1ff; /* bleu clair léger au hover */
  transform:translateY(-1px);
  box-shadow:0 8px 20px rgba(0,0,143,.12);
}

.wf-confirm-actions .btn-ghost:active {
  transform:translateY(0);
  box-shadow:0 4px 12px rgba(0,0,143,.1);
}

/* ===========================
   RESPONSIVE – CONTACT
   =========================== */

/* === ≤ 1024px === */
/* Ajustes typographiques & tailles, on conserve 2 colonnes */
@media (max-width: 1024px) {

  /* Titres / textes (proche de ta page "Expertise") */
  .contact-title {
    font-size: 1.8rem;
    line-height: 1.35;
    margin-top: 2.5%;
    margin-bottom: 3%;
  }

  /* Icônes un peu plus compactes */
  .contact-icon .icon {
    width: 72px;
    height: 72px;
    padding: 10px;
  }

  /* Bouton formulaire légèrement plus compact */
  .contact-left .wpforms-form .wpforms-submit {
    padding: 12px 18px;
    font-size: 1.02rem;
  }

  /* Heures : sous-titre un chouïa plus petit */
  .contact-hours .contact-hours-title {
    font-size: 1.2rem;
  }
}

/* === ≤ 900px === */
/* On passe en 1 colonne : Formulaire en haut, Coordonnées en dessous "en ligne" */
@media (max-width: 900px) {

  /* 1 seule colonne */
  .contact-container {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  /* Formulaire (top) */
  .contact-left {
    border-radius: 20px;
    padding: 24px;
  }

  /* Coordonnées deviennent une rangée responsive */
  .contact-right {
    padding: 10px 0 0;
    display: flex;
    flex-wrap: wrap;
    gap: 5px 0px;
    justify-content: space-around;
	   align-items: stretch;
  }

  /* Chaque carte s’aligne sur la ligne, 3 colonnes si la place le permet */
  
 .contact-right > .contact-card {
    flex: 0 0 calc(30% - 16px) ;
    min-width: 220px;        /* sécurise la tenue sur petits écrans proches de 900px */
    text-align: center;
    padding: 14px 8px;
  }

	
	 /* Le titre et le bloc horaires prennent une ligne complète */
  .contact-right > .contact-title,
  .contact-right > .card-hours {
    flex: 1 0 100%;          /* pleine largeur */
    width: 100%;
  }
	
	


  /* Icônes coordonnées */
  .contact-icon .icon {
    width: 64px;
    height: 64px;
    padding: 10px;
  }

  /* Liens coordonnées & textes */
  .contact-link,
  .contact-info {
    font-size: 1rem;
  }

  /* Bouton du formulaire : plus large pour le pouce */
  .contact-left .wpforms-form .wpforms-submit {
    width: 60%;
    font-size: 1rem;
  }

  /* Tableau horaires : un peu plus d’air et alignements plus simples */
  
  .hours-table .day { margin-left: 0; flex: 0 0 35%; }
  .hours-table .time { flex: 1; }
	 .hours-table .day {
        flex: 0 0 30%;
        margin-left: 18%;
    }
}

/* === ≤ 650px === */
/* Mobile : tout en colonne, boutons pleine largeur, icônes réduites */
@media (max-width: 650px) {

	.contact-section {
    padding: 5px 1%;
}
	
	
  .contact-left { padding: 20px; }

  /* Les cartes coordonnées se mettent l’une sous l’autre */
  .contact-right {
    gap: 1px;
  }
	
	
  .contact-right .contact-card {
    flex: 1 1 100%;
    min-width: 0;
    padding: 20px 4px;
  }

  .contact-title {
    font-size: 1.3rem;
    line-height: 1.35;
    margin-top: 10px;
    margin-bottom: 14px;
    text-align: center;
  }

  /* Icônes coordonnées + horloge */
  .contact-icon .icon { width: 56px; height: 56px; padding: 1px; }
  .icon-clock { width: 24px; height: 24px; }

  /* Bouton du formulaire en pleine largeur */
  .contact-left .wpforms-form .wpforms-submit {
    width: 100%;
    font-size: 0.98rem;
    padding: 12px 16px;
  }
	
	.contact-left .wpforms-form input[type="text"], .contact-left .wpforms-form input[type="email"], .contact-left .wpforms-form input[type="tel"], .contact-left .wpforms-form textarea  {
    font-size: 0.85rem ;
}

  /* Bloc confirmation : boutons empilés et full width */
  .wf-confirm-actions {
    flex-wrap: wrap;
    gap: 1px;
	 margin: 25px 0 !important;
  }
  .wf-confirm-actions .btn-cta,
  .wf-confirm-actions .btn-ghost {
    width: 100%;
    text-align: center;
  }

	.wf-anim-ok {
    width: 80px !important;
    height: 80px !important
		}
	
	.wf-confirm-text {
    font-size: 0.85rem !important;
}
	
	.contact-gdpr {
   
    font-size: .65rem;
    margin-top: 4px;
		font-weight: 400;
}
	
  /* Horaires : lisibilité sur mobile */
  
	.card-hours { width:100%; }
	.hours-table { font-size: 0.95rem; font-weight: 400; }
  .hours-table .row { padding: 8px 0; }


   .hours-table .day {
        flex: 0 0 30%;
        margin-left: 18%;
    }
	
	}