/* =============================================================================
   MK IMMOBILIER GROUPE — retouches propres au site immobilier
   -----------------------------------------------------------------------------
   Audit visuel du 11/09/2026. Feuille chargée par inc/header-immo.php seul,
   juste après mk-retouches.css : le site terrassement ne la voit jamais. Tout
   est en plus préfixé .site-immo, par prudence. Les numéros renvoient à ceux
   de l'audit.
   ========================================================================== */


/* --- 1. Héros sombres --------------------------------------------------------
   mk.css impose au héros immobilier un titre marine et un chapeau gris-bleu
   (.site-immo .heros). Sur le héros marine de construction.php, le titre, le
   surtitre et le chapeau disparaissaient. Le diaporama de l'accueil garde son
   chapeau plus clair, réglé dans mk-retouches.css. */
.site-immo .heros.sur-sombre h1 { color: #fff; }
.site-immo .heros.sur-sombre:not(.heros--video) .chapeau { color: #C9D6E0; }
.site-immo .heros.sur-sombre .marqueur { color: var(--sable); }

/* Même cause dans les bandeaux marine des pages intérieures : .site-immo
   .marqueur (marine) est plus spécifique que .marqueur--clair (sable). */
.site-immo .marqueur--clair { color: var(--sable); }


/* --- 4. Opérations : étiquette posée sur les vignettes encore vides ---------- */
.site-immo .operation__vue { position: relative; }
.site-immo .operation__manque {
  position: absolute; top: 16px; left: 16px; max-width: calc(100% - 32px);
  font-size: 13px;
}


/* --- 5. Bande de chiffres (accueil et construction) --------------------------
   Trois ou quatre chiffres selon la page : autant de colonnes que de chiffres,
   et la bande s'aligne sur la gouttière du contenu. */
.site-immo .chiffres { padding-inline: var(--gouttiere); }
/* repeat(auto-fit, minmax(0, 1fr)) donnait le bon rendu, mais sans largeur
   minimale le navigateur créait plus de 1 300 pistes vides de 0 px. Une
   colonne implicite par chiffre donne le même résultat, proprement. */
@media (min-width: 900px) {
  .site-immo .chiffres {
    grid-template-columns: none;
    grid-auto-flow: column;
    grid-auto-columns: minmax(0, 1fr);
  }
}
/* L'étiquette « INFO À DONNER » est en em : dans un chiffre de 52 px, elle
   montait à 37 px et cassait la bande. */
.site-immo .chiffre__val .a-fournir::before { font-size: 11px; vertical-align: middle; }


/* --- 6. Mosaïque de l'accueil -------------------------------------------------
   Neuf photos remplissent la grille de quatre colonnes. Sous 900 px, la grille
   passe à deux colonnes : la première photo prend toute la largeur, sinon la
   neuvième resterait seule sur sa rangée. */
@media (max-width: 899px) {
  .site-immo .bande-photos--mosaique .bande-photos__vue:first-child {
    grid-column: span 2; aspect-ratio: 16 / 9;
  }
}


/* --- 7. Carte d'appel « Être prévenu des disponibilités » --------------------
   Fiche logement : elle complète la rangée quand il reste moins de trois
   autres logements, pour ne pas laisser de colonne vide. */
.site-immo .carte--appel { background: var(--marine); color: var(--blanc); }
.site-immo .carte--appel .carte__corps {
  flex: 1 1 auto; justify-content: center; gap: 12px; padding: 30px 28px 32px;
}
.site-immo .carte--appel .eyebrow { color: var(--sable); }
.site-immo .carte--appel h3 { color: var(--blanc); }
.site-immo .carte--appel p:not(.eyebrow) { color: #C9D6E0; font-size: 15px; line-height: 1.6; }
.site-immo .carte--appel .btn { align-self: flex-start; margin-top: 8px; }


/* --- 8. Qui sommes-nous --------------------------------------------------------
   Les liens de fin des trois colonnes s'alignent au pied des cartes, quelle
   que soit la longueur du texte au-dessus. */
.site-immo .carte__corps:has(> .carte__fin) { flex: 1 1 auto; }
.site-immo .carte__fin { margin-top: auto; padding-top: 12px; }
/* Tableau des sociétés : les lignes sur fond blanc, pas sur le crème de la
   section. */
.site-immo .tableau-guide tbody { background: var(--blanc); }


/* --- 14. Liste à coches dans la prose -------------------------------------------
   « Charges comprises » : la puce carrée de .prose li s'ajoutait à la coche. */
.site-immo .prose .liste-coche li { padding-left: 0; }
.site-immo .prose .liste-coche li::before { content: none; }


/* --- 15. Fiche logement : les trois vignettes restent sur une rangée ------------ */
@media (max-width: 899px) {
  .site-immo .fiche-vignettes { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .site-immo .fiche-vignettes > .photo { height: auto; aspect-ratio: 4 / 3; }
}
