/* ==========================================================================
   NEOFLUX — Habillage de façades : compléments du gabarit métier (lot « metiers-C », 16/10/2026)
   Chargé par pages/habillage-facades.php seulement, APRÈS css/interieur.css et css/metier.css.
   Portée : comme le socle — classes « vi- » rangées dans <main class="vi"> ; aucune règle sur
   html, body, l'en-tête, le pied de page ni la barre mobile. Guide : _travail/SOCLE-METIER.md
   ========================================================================== */

/* Mots mis en valeur dans les titres saisis dans l'admin (<span class="…"> → <em>) */
.vi .vi-sec-head .vi-h2 em, .vi .vi-tech-h em { font-style: normal; color: var(--vi-gris); }
.vi .vi-sec-steps .vi-sec-head .vi-h2 em, .vi .vi-sec-dark .vi-sec-head .vi-h2 em { color: #CBD5E1; }
.vi .vi-sol-body h3 em, .vi .vi-st h3 em, .vi-sol-tl em { font-style: normal; }

/* Solutions : accroche de l'admin sous le titre de la carte (« Couverture grand format… ») */
.vi-sol-tl { font-size: .95rem; font-weight: 600; line-height: 1.45; color: var(--vi-ink); }

/* Encadré « Pourquoi » : surtitre de l'admin au-dessus du titre */
.vi-led .vi-eb { margin-bottom: 10px; }

/* Matériaux (« Données techniques ») : surtitre, titre et texte de l'admin */
.vi-tech-head { max-width: 720px; margin-bottom: 16px; }
.vi .vi-tech-head .vi-tech-h { margin-bottom: 0; }
.vi-tech-sub { margin-top: 6px; font-size: .95rem; line-height: 1.55; color: var(--vi-sub); }
/* 5 matériaux : 5 colonnes sur grand écran, 3 de 961 à 1100 px (2 puis 1 en dessous : css/metier.css) */
@media (min-width: 1101px) { .vi-tech-grid.is-5 { --cols: 5; } }
@media (max-width: 1100px) and (min-width: 961px) { .vi-tech-grid.is-5 { --cols: 3; } }

/* Téléphone (≤ 768 px) : aucun texte sous 15 px */
@media (max-width: 768px) {
    .vi-sol-tl, .vi-tech-sub { font-size: 15px; }
}