/* Gabarit V10 — la page Contact (/fr/contact, /contact). Se charge APRÈS css/v10.css.
 *
 * Retenue par Simon le 16/10/2026 (piste C2 de /preview/contact-c2/, après le call Simon / Tanguy) :
 *   - le rappel est sur la page, dans une carte claire : js/v10-contact.js y écrit son mode démo à plat
 *     ([data-contact-ici]) — coordonnées, puis le créneau, flouté dessous jusqu'à l'envoi ;
 *   - qui rappelle se lit en tête de la carte : les portraits, « Valérie ou Yohan vous rappelle », la pastille verte ;
 *   - la seconde porte, « Autre demande ? Cliquez ici », est un bouton secondaire sous « Voir mes créneaux »
 *     (posé par js/v10-contact-page.js) ; sur téléphone, une ligne sous l'accroche l'annonce dès le premier écran ;
 *   - à gauche, le titre et les 14 hôpitaux de la home en carrousel sur deux rangées, centrés face à la carte.
 * Mesuré à 1440 × 900 : bouton secondaire à 552 px, jours de rappel à 661 px, tous deux dans le premier écran.
 */
.ct-hero{padding-top:calc(var(--nav-h) + clamp(36px,6vh,72px))}
.ct-hero h1{font-size:clamp(38px,4.6vw,64px);max-width:14ch}
.ct-hero .lead{margin:18px 0 0;max-width:46ch}
.ct-hero .v-hero__grid{align-items:start}
@media (min-width:861px){.ct-hero .v-hero__grid{grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr)}.ct-recit{align-self:center}}
/* la rangée des jours défile en largeur : sans min-width:0, elle élargissait la colonne au-delà de l'écran */
.ct-hero .v-hero__grid > *,.ct-recit > *{min-width:0}

/* la carte */
.ct-carte{border-radius:22px;background:var(--paper-2);color:var(--ink);box-shadow:0 30px 80px rgba(0,0,0,.3)}
.ct-carte[hidden]{display:none}
.ct-carte__tete{display:flex;align-items:center;gap:14px;padding:22px 28px 0}
.ct-carte__tete h2{margin:0 0 5px;font-size:clamp(20px,1.8vw,24px);letter-spacing:-.02em;line-height:1.15;color:var(--ink)}
.ct-duo{display:flex;flex:none;line-height:0}
.ct-duo img{width:46px;height:46px;border-radius:50%;object-fit:cover;border:3px solid var(--paper-2)}
.ct-duo img+img{margin-left:-12px}
.ct-dispo{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-weight:600;color:var(--ink-dim)}
.ct-dispo i{width:7px;height:7px;border-radius:50%;background:#22b07d;box-shadow:0 0 0 3px rgba(34,176,125,.16);flex:none}
.ct-carte:has(.ok.is-on) .ct-dispo{display:none}
.ct-carte [data-contact-ici]{scroll-margin-top:calc(var(--nav-h) + 80px)}

/* le rappel à plat (js/v10-contact.js, mode « sur la page ») */
.ov--ici .book{display:block;width:auto;max-height:none;overflow:visible;background:none;border-radius:0}
.ov--ici .book__form{padding:18px 28px 6px}
.ov--ici .book__form .hint{display:none}
.ov--ici .ok [data-close]{display:none}
.ov--ici .ok.is-on{min-height:320px}
.ov--ici .ok:focus{outline:none}
/* tant que le créneau est verrouillé, la carte n'en montre que les jours, en fondu : elle reste à la hauteur de la colonne de gauche */
.ct-hero .ov--ici .book__slots.is-verrou{max-height:180px;overflow:hidden;-webkit-mask-image:linear-gradient(#000 55%,transparent);mask-image:linear-gradient(#000 55%,transparent)}
.ct-hero .ov--ici .book__slots.is-verrou .book__verrou{top:84px}

/* la seconde porte */
.ct-secondaire{height:46px;margin-top:2px;background:transparent;font-size:14px}
.ct-secondaire:hover{border-color:var(--ink)}
.ct-mobile{display:none}
.ct-mobile button{color:var(--tx);text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(255,255,255,.35)}
.ct-retour{display:block;margin:16px auto 0;font-size:13.5px;color:var(--dim)}
.ct-retour[hidden]{display:none}
.ct-retour u{color:var(--tx);text-underline-offset:3px;text-decoration-color:rgba(255,255,255,.35)}
.ct-libre{background:none;box-shadow:none;padding:22px 28px 26px}
.ct-client{margin:4px 0 0;font-size:13px;line-height:1.5;color:var(--ink-dim)}
.ct-client a{color:var(--ink);font-weight:600}

/* les hôpitaux : le .defiles du kit V10 (css/v10.css), deux rangées en sens opposé, logos en blanc */
.ct-preuve{margin:56px 0 0}
.ct-preuve p{margin:0 0 14px;font-size:14px;color:var(--dim)}
.ct-preuve p b{color:var(--tx);font-weight:600}
.ct-preuve .defiles{gap:18px}
.ct-preuve .defile__piste{gap:56px;padding:0 28px;animation-duration:40s}
.ct-preuve .defile--d .defile__piste{animation-duration:44s}
.ct-preuve .defile__piste li{height:56px}
.ct-preuve .defile__piste img{height:42px;max-width:156px;filter:brightness(0) invert(1);opacity:.66}
.ct-preuve .defile__piste img[src*="-blanc"]{filter:none}
/* mouvement réduit : immobile, chaque rangée garde quatre logos au lieu de déborder de la colonne */
@media (prefers-reduced-motion:reduce){.ct-preuve .defile__piste{flex:1 1 auto;flex-wrap:wrap;justify-content:flex-start;gap:8px 26px;padding:0}.ct-preuve .defile__piste li:nth-child(n+5){display:none}}

/* le bas de la dernière section */
.ct-coord{margin-top:clamp(40px,5vw,64px);padding-top:28px;border-top:1px solid var(--line-d)}
.ct-coord .v-coord{margin:0;display:flex;flex-wrap:wrap;gap:14px 36px}

/* téléphone : le récit, la ligne « Autre demande ? », la carte, puis les hôpitaux */
@media (max-width:860px){
  .ct-recit{display:contents}
  .ct-hero .v-hero__grid{row-gap:0}
  .ct-mobile{display:block;margin:14px 0 22px;font-size:13.5px;color:var(--dim)}
  .ct-preuve{order:4;margin-top:28px}
  .ct-preuve .defile__piste{gap:40px;padding:0 20px}
  .ct-preuve .defile__piste img{height:34px;max-width:128px}
  .ct-carte__tete{align-items:flex-start;padding:20px 20px 0}
  .ct-carte__tete .ct-duo img{width:40px;height:40px}
  .ov--ici .book__form{padding:16px 20px 6px}
  .ct-libre{padding:18px 20px 22px}
}
