/* ===== Gabarit Contact — habillage maquette-page-contact.html =====
   Tous les sélecteurs sont préfixés .ct- (le fichier est chargé sur tout le site). */

.ct-main { background: var(--fond); padding: clamp(36px, 5vw, 56px) 0 clamp(60px, 8vw, 92px); }

/* fil d'Ariane (surcharge du .fil générique) */
.ct-fil { font-size: 13.5px; color: var(--muted); margin-bottom: 26px; padding: 0; }
.ct-fil a { color: var(--muted); text-decoration: none; transition: color .2s; }
.ct-fil a:hover { color: var(--avmd); }
.ct-fil .sep { color: var(--avmd); font-family: 'Montserrat'; font-weight: 700; margin: 0 7px; }
.ct-fil [aria-current] { color: var(--marque); font-weight: 600; }

/* en-tête de page */
.ct-main h1 { font-size: clamp(30px, 3.6vw, 44px); }
.ct-main .sec-t .chev { font-size: 30px; }
.ct-sub { color: var(--muted); margin-top: 10px; font-size: 17px; }

/* deux colonnes : formulaire | implantations */
.ct-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 26px; margin-top: 36px; }

/* ----- formulaire CF7 habillé : carte blanche, champs de la maquette ----- */
.ct-form { background: var(--paper); border: 1px solid var(--ligne); border-radius: var(--r); padding: clamp(24px, 3vw, 36px); }
.ct-form form.wpcf7-form { display: grid; grid-template-columns: 1fr 1fr; gap: 18px 20px; height: 100%; }
.ct-form form.wpcf7-form > * { grid-column: 1 / -1; min-width: 0; }
.ct-form form.wpcf7-form > .col-sm-6 { grid-column: auto; }
.ct-form .col-sm-6 { display: grid; gap: 18px; align-content: start; }
.ct-form .col-sm-6 p { margin: 0; }
.ct-form .wpcf7-form-control-wrap { display: block; }

.ct-form input[type="text"],
.ct-form input[type="email"],
.ct-form input[type="tel"],
.ct-form textarea {
  width: 100%; border: 1.5px solid var(--ligne); border-radius: 8px; padding: 12px 14px;
  font: inherit; font-size: 15px; line-height: 1.4; color: var(--ink); background: #fff;
  transition: border-color .2s, box-shadow .2s;
}
.ct-form input:focus, .ct-form textarea:focus { outline: none; border-color: var(--avmd); box-shadow: 0 0 0 3px rgba(79,132,166,.18); }
.ct-form ::placeholder { color: #93A3AF; }
.ct-form textarea { min-height: 216px; resize: vertical; }

/* case RGPD (tag acceptance de CF7) — présentation .rgpd de la maquette */
.ct-form .wpcf7-acceptance .wpcf7-list-item { margin: 0; display: block; }
.ct-form .wpcf7-acceptance label { display: flex; gap: 10px; align-items: flex-start; font-size: 13.5px; color: var(--muted); line-height: 1.55; cursor: pointer; }
.ct-form .wpcf7-acceptance input[type="checkbox"] { width: 17px; height: 17px; margin-top: 2px; flex: none; accent-color: var(--cta); }
.ct-form .wpcf7-acceptance a { color: var(--avmd); font-weight: 600; }

/* bouton envoyer — même dessin que .btn .btn-bleu */
.ct-form input[type="submit"].wpcf7-submit {
  display: inline-block; padding: 13px 26px; border: 0; border-radius: 8px; cursor: pointer;
  font-size: 15px; font-weight: 600; font-family: 'Montserrat'; transition: all .3s;
  background: var(--cta); color: #fff; justify-self: start; width: auto;
}
.ct-form input[type="submit"].wpcf7-submit:hover { background: var(--marque); }
.ct-form .wpcf7-spinner { align-self: center; }

/* messages de validation CF7 */
.ct-form .wpcf7-not-valid-tip { font-size: 12.5px; color: #B4362E; margin-top: 5px; }
.ct-form .wpcf7-response-output { margin: 0; padding: 12px 14px; border-radius: 8px; font-size: 14px; border: 1.5px solid var(--ligne); }
.ct-form .wpcf7 form.sent .wpcf7-response-output { border-color: #3E7A4E; color: #2E5C3A; background: #EDF6EF; }
.ct-form .wpcf7 form.invalid .wpcf7-response-output,
.ct-form .wpcf7 form.failed .wpcf7-response-output { border-color: #B4362E; color: #8E2A24; background: #FBF0EF; }

/* ----- colonne droite — implantations + carte ----- */
.ct-side { display: grid; gap: 20px; grid-template-rows: auto auto 1fr; }
.ct-side .lieu { background: var(--paper); border: 1px solid var(--ligne); border-radius: var(--r); padding: 24px; display: flex; gap: 16px; }
.ct-side .lieu .pic { width: 46px; height: 46px; border-radius: 12px; background: #E8F0F6; color: var(--avmd); display: flex; align-items: center; justify-content: center; flex: none; }
.ct-side .lieu .pic svg { width: 24px; height: 24px; stroke: currentColor; fill: none; stroke-width: 1.7; }
.ct-side .lieu h2 { font-size: 17.5px; }
.ct-side .lieu address { font-style: normal; font-size: 14.5px; color: var(--muted); margin-top: 5px; line-height: 1.55; }
.ct-side .lieu .lien { display: inline-block; margin-top: 9px; font-size: 15px; font-weight: 600; color: var(--marque); text-decoration: none; transition: color .2s; }
.ct-side .lieu .lien:hover { color: var(--avmd); }

/* placeholder de carte — dégradé bleu + pictogramme (pas d'iframe) */
.ct-side .carte { position: relative; border-radius: var(--r); overflow: hidden; min-height: 232px; background: linear-gradient(135deg, #24465F, #2F6C99 55%, #4F84A6); display: flex; align-items: center; justify-content: center; text-align: center; color: #fff; }
.ct-side .carte::before { content: ''; position: absolute; inset: 0; background-image: repeating-linear-gradient(0deg, rgba(255,255,255,.07) 0 1px, transparent 1px 46px), repeating-linear-gradient(90deg, rgba(255,255,255,.07) 0 1px, transparent 1px 46px); }
.ct-side .carte .in { position: relative; padding: 28px; }
.ct-side .carte svg { width: 44px; height: 44px; margin: 0 auto 10px; stroke: #fff; fill: none; stroke-width: 1.6; }
.ct-side .carte b { display: block; font-family: 'Montserrat'; font-weight: 600; font-size: 16px; }
.ct-side .carte span { font-size: 13px; color: rgba(255,255,255,.78); }

/* bande réassurance : 3 chiffres au lieu de 4 */
.ch-row-3 { grid-template-columns: repeat(3, 1fr); }

@media (max-width: 900px) {
  .ct-grid { grid-template-columns: 1fr; }
  .ct-form form.wpcf7-form { grid-template-columns: 1fr; }
  .ct-form form.wpcf7-form > .col-sm-6 { grid-column: 1 / -1; }
  .ch-row-3 { grid-template-columns: 1fr; gap: 20px; }
}

/* Éléments techniques de CF7 : jamais rendus comme cellules de la grille.
   Le fieldset de champs cachés et le honeypot Maspik s'affichaient en
   rectangles vides depuis la MàJ CF7 6.1.6 + Maspik 2.9.1. */
.ct-form .hidden-fields-container { display: none; }
.ct-form .maspik-field { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); margin: -1px; }
.ct-form form.init .wpcf7-response-output,
.ct-form .wpcf7-response-output[aria-hidden="true"],
.ct-form .wpcf7-response-output:empty { display: none; }

/* La carte formulaire s'étire à la hauteur de la colonne de droite (box bleue
   incluse) et c'est la zone de message qui absorbe la hauteur supplémentaire.
   CF7 intercale un div.wpcf7 entre la carte et le <form> : il doit relayer le 100 %. */
.ct-form > .wpcf7 { height: 100%; }
.ct-form .col-sm-6:has(textarea) { align-content: stretch; grid-template-rows: 1fr auto auto; }
.ct-form .col-sm-6 p:has(textarea),
.ct-form .wpcf7-form-control-wrap:has(> textarea) { display: grid; }
.ct-form textarea { height: 100%; }