/* ============================================================================
   Le contact (`contact`) — la feuille du module, à côté de `contact.js`.
   Ce que seul ce module emploie ; ce qui sert à plusieurs pages reste dans
   `site.css`. Chargée par le site public après `site.css`, dans l'ordre des
   modules (`tests/admin/shell.spec.js`) : découpée de `site.css` au lot 6 sans
   changer l'ordre de la cascade, éprouvée contre l'ancienne feuille unique
   (`tools/comparer-styles.mjs`).
   ============================================================================ */
.ct-ok{
  background:#E9EDE2;border-radius:13px;padding:13px 15px;margin-top:12px;
  font-size:13px;color:#4A5A3E;line-height:1.55;
  animation:newsIn .4s cubic-bezier(.2,.8,.3,1) both;
}
.ct-ok span{color:var(--rose);font-size:15px}

/* ---------- Contact ---------- */
.ct-carte{
  display:grid;grid-template-columns:1.6fr 1fr;gap:0;margin-top:24px;
  border-radius:24px;overflow:hidden;border:1px solid rgba(34,34,33,.08);
}
.ct-map{
  background:linear-gradient(150deg,#E4E8DC,#C3CDB6);min-height:340px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;
}
.ct-map svg{width:56px;height:56px;opacity:.8}
.ct-map-cadre{display:block;width:100%;height:100%;min-height:inherit;border:0}
/* Le plan statique (sans accord pour Google) : l'image remplit le panneau, le
   crédit OpenStreetMap reste lisible dessus (licence ODbL), le bouton Google
   en bas. */
.ct-map.ct-map-statique{position:relative;display:block;padding:0;background:var(--creme)}
/* ⚠️ L'image ne donne pas sa hauteur au panneau : elle l'imposait (640 × 420), et
   le plan était plus haut que la carte Google qui le remplace. */
.ct-map-plan{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover}
.ct-map-osm{position:absolute;right:8px;top:8px;font-size:10.5px;color:var(--encre-60);
  background:rgba(253,250,245,.85);padding:3px 8px;border-radius:999px}
.ct-map-osm a{color:inherit;text-decoration:underline}
.ct-map-google{position:absolute;left:12px;right:12px;bottom:12px;display:flex;flex-direction:column;align-items:center;gap:6px}
.ct-map-google .ct-map-note{background:rgba(253,250,245,.88);padding:3px 10px;border-radius:999px;max-width:none}
/* Sur téléphone, le plan est bas : le bouton et sa note passent dessous plutôt
   que de couvrir l'épingle. */
@media(max-width:680px){
  .ct-map.ct-map-statique{min-height:0}
  .ct-map-plan{position:static;height:240px}
  .ct-map-google{position:static;padding:12px 14px 14px;background:var(--creme)}
  .ct-map-google .ct-map-note{background:none;padding:0;text-align:center}
}
.ct-adresse{
  background:var(--blanc);padding:38px 34px;
  display:flex;flex-direction:column;justify-content:center;
}
.ct-adresse h3{font-size:29px;line-height:1.2;margin:10px 0 6px}
.ct-ville{font-size:13.5px;color:var(--encre-60)}
.ct-detail{font-size:13px;color:var(--encre-60);margin:12px 0 20px}

.ct-infos{
  display:grid;grid-template-columns:repeat(3,1fr);
  background:var(--blanc);border:1px solid rgba(34,34,33,.08);border-radius:22px;
  margin-top:16px;overflow:hidden;
}
.ct-info{
  display:flex;align-items:center;gap:14px;padding:20px 24px;text-align:left;
  border-right:1px dashed rgba(196,122,83,.22);
  border-bottom:1px dashed rgba(196,122,83,.22);
  transition:background .2s;
}
.ct-info:nth-child(3n){border-right:none}
.ct-info:nth-last-child(-n+3){border-bottom:none}
a.ct-info:hover{background:var(--creme)}
.ct-ico{
  width:38px;height:38px;border-radius:50%;flex:none;background:var(--accent-soft);color:var(--terracotta-2);
  display:flex;align-items:center;justify-content:center;
}
.ct-ico svg{width:18px;height:18px}
.ct-txt{min-width:0}
.ct-lbl{
  display:block;font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;
  font-weight:600;color:var(--encre-60);margin-bottom:2px;
}
.ct-info b{font-size:14px;font-weight:500;color:var(--encre);word-break:break-word}

.ct-bas{display:grid;grid-template-columns:1.35fr 1fr;gap:24px;margin-top:30px;align-items:stretch}
.ct-form{background:var(--blanc);border:1px solid rgba(34,34,33,.08);border-radius:24px;padding:32px 34px}
.ct-form h3{font-size:28px;margin:10px 0 6px;line-height:1.2}
.ct-form-sous{font-size:13.5px;color:var(--encre-60);margin-bottom:22px}
.ct-duo{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.ct-cote{display:flex;flex-direction:column;gap:18px;height:100%}
.ct-cote .ct-bloc{flex:1;display:flex;flex-direction:column;justify-content:center}
.ct-bloc{background:var(--blanc);border:1px solid rgba(34,34,33,.08);border-radius:24px;padding:28px}
.ct-bloc h4{font-family:var(--font-serif);font-weight:400;font-size:24px;margin:10px 0 8px;line-height:1.2}
.ct-bloc p{font-size:13px;color:var(--encre-60);margin-bottom:16px}
.ct-bloc-accent{background:var(--accent-soft);border-color:rgba(196,122,83,.35)}
.ct-social{display:flex;flex-direction:column;gap:8px}
.ct-social a{
  display:flex;align-items:center;gap:12px;padding:11px 14px;border-radius:14px;
  background:var(--creme);border:1px solid transparent;color:var(--encre);
  font-size:13.5px;transition:.2s;
}
.ct-social a:hover{border-color:var(--terracotta);background:var(--accent-soft);color:var(--terracotta-2)}
.ct-social svg{width:20px;height:20px;color:var(--terracotta-2);flex:none}

@media(max-width:1000px){
  .ct-bas{align-items:start}
  .ct-cote{height:auto}
  .ct-cote .ct-bloc{flex:none}
  .ct-carte{grid-template-columns:1fr}
  .ct-map{min-height:240px}
  .ct-infos{grid-template-columns:repeat(2,1fr)}
  .ct-bas{grid-template-columns:1fr}
}
@media(max-width:680px){
  .ct-infos{grid-template-columns:1fr}
  .ct-info{border-right:none}
  .ct-info:nth-last-child(-n+3){border-bottom:1px dashed rgba(196,122,83,.22)}
  .ct-info:last-child{border-bottom:none}
  .ct-duo{grid-template-columns:1fr}
  .ct-form,.ct-bloc{padding:24px 20px}
  .ct-adresse{padding:28px 22px}
}
