/*
 * Habillage 2.1 (retours du chargé de projet, 12/10/2026) : bandeaux d'en-tête en image de fond, pictos,
 * survols, apparitions au scroll, fins de page (cartes + encart devis au « & » de la marque), correctif du collant.
 * Pictos : Lucide (licence ISC), trait 1,5, posés en blocs HTML (classe lcb-ico) dans le contenu : on change
 * un picto en collant un autre SVG Lucide dans le bloc. Les petits pictos de listes sont des masques CSS.
 */
:root {
	--lcb-i-check: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23141517' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
	--lcb-i-pin: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 10c0 4.993-5.539 10.193-7.399 11.799a1 1 0 0 1-1.202 0C9.539 20.193 4 14.993 4 10a8 8 0 0 1 16 0'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E");
	--lcb-i-clock: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpolyline points='12 6 12 12 16 14'/%3E%3C/svg%3E");
	--lcb-i-phone: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z'/%3E%3C/svg%3E");
	--lcb-amp: url("data:image/svg+xml,%3Csvg fill='%23ffffff' fill-opacity='.42' xmlns='http://www.w3.org/2000/svg' viewBox='100 -1466 1228 1496'%3E%3Cpath transform='scale%281,-1%29' d='M622 -30Q502 -30 394.0 6.0Q286 42 214 120Q156 185 129.5 260.0Q103 335 100 422Q100 508 125.0 586.5Q150 665 202 726Q219 746 238.0 762.5Q257 779 276 794Q222 856 195.0 916.5Q168 977 168 1056Q168 1187 239.5 1290.0Q311 1393 434 1436Q485 1454 537.0 1460.0Q589 1466 638 1466Q737 1466 827.0 1435.5Q917 1405 980 1336Q1019 1296 1044.5 1247.0Q1070 1198 1082 1148L812 1094Q800 1136 770 1166Q742 1195 704.0 1203.5Q666 1212 630 1212Q573 1212 530 1192Q485 1171 463.5 1137.0Q442 1103 442 1052Q442 1006 460.0 979.0Q478 952 502 926Q519 908 544.5 884.0Q570 860 598 834L928 528V774H1164V500Q1164 454 1162.0 403.5Q1160 353 1152 320L1328 158L1154 -28L1022 98Q965 49 900.5 20.0Q836 -9 770 -20Q728 -26 693.0 -28.0Q658 -30 622 -30ZM634 228Q657 228 678.0 230.0Q699 232 720 236Q752 242 778.5 253.5Q805 265 826 280L474 604Q453 595 436.5 582.0Q420 569 408 554Q392 532 383.0 503.0Q374 474 374 438Q374 395 387.5 363.5Q401 332 420 306Q453 264 516.0 246.0Q579 228 634 228Z'/%3E%3C/svg%3E");
	--lcb-i-fleche: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='m12 5 7 7-7 7'/%3E%3C/svg%3E");
	--lcb-ombre-survol: 0 28px 50px -30px rgba(20, 21, 23, .45);
}

/* ================================================================ correctif : bloc collant sous l'en-tête
   Spectra pose le collant en position fixed avec un z-index inline de 9999 : en fin de section, le bloc
   remonte avec la page et passait par-dessus l'en-tête collant (z-index 99). */
.spectra-sticky-container.spectra-sticky--active { z-index: 2 !important; }
/* Colonnes empilées (mobile Spectra, 480 px) : pas de collant, le bloc reprend sa place dans le flux. */
@media (max-width: 480px) {
	.lcb-sticky.spectra-sticky-container { position: static !important; inset: auto !important; width: auto !important; }
}

/* ================================================================ bandeaux d'en-tête des pages intérieures
   Même construction que le hero de l'accueil (image en fond Spectra, fondu vers le noir à gauche et en bas
   par le masque de .lcb-hero dans lcb.css), en plus bas. lcb-hero--court : pages utilitaires. */
/* Hauteur : attribut minHeight du bloc (600 px, 440 px en version courte). Contenu calé en bas, comme l'accueil. */
.lcb-hero--page.wp-block-spectra-container { display: flex; flex-direction: column; justify-content: flex-end; }
.lcb-hero--page h1 { max-width: 20ch; }
/* Voile renforcé (12/10/2026, contraste mesuré texte / photo sous chaque ligne de texte, 5e centile :
   avant 1,0 à 3,1 sur la plupart des bandeaux, après 5,2 au minimum, 4,5 exigé). Le masque règle
   l'opacité de la photo (::after de Spectra) au-dessus du fond noir : quasi noire sous le texte à gauche
   et en bas, la photo ne remonte qu'à droite. */
.lcb-hero.wp-block-spectra-container::after {
	-webkit-mask-image: linear-gradient(100deg, rgba(0, 0, 0, .04) 0%, rgba(0, 0, 0, .12) 45%, rgba(0, 0, 0, .45) 72%, rgba(0, 0, 0, .85) 100%), linear-gradient(0deg, rgba(0, 0, 0, .05) 0%, rgba(0, 0, 0, .45) 35%, #000 70%);
	mask-image: linear-gradient(100deg, rgba(0, 0, 0, .04) 0%, rgba(0, 0, 0, .12) 45%, rgba(0, 0, 0, .45) 72%, rgba(0, 0, 0, .85) 100%), linear-gradient(0deg, rgba(0, 0, 0, .05) 0%, rgba(0, 0, 0, .45) 35%, #000 70%);
}
@media (max-width: 782px) {
	/* Mobile : le texte couvre toute la largeur, voile quasi uniforme. Hauteur selon le contenu et texte
	   calé en haut : le H1 tombe au même endroit sur toutes les pages (la hauteur minimale de 600 px de
	   l'attribut repoussait le titre de Qui sommes-nous, sans sur-titre ni boutons, 250 px plus bas). */
	.lcb-hero--page.wp-block-spectra-container { min-height: 0 !important; justify-content: flex-start; }
	.lcb-hero.wp-block-spectra-container::after {
		-webkit-mask-image: linear-gradient(0deg, rgba(0, 0, 0, .08) 0%, rgba(0, 0, 0, .24) 50%, rgba(0, 0, 0, .34) 100%);
		mask-image: linear-gradient(0deg, rgba(0, 0, 0, .08) 0%, rgba(0, 0, 0, .24) 50%, rgba(0, 0, 0, .34) 100%);
	}
}
.lcb-hero--page .lcb-label { color: var(--lcb-texte-sombre); }


/* Tuiles photo de l'accueil : voile renforcé aussi (texte toujours visible sous 1100 px, au survol au-dessus).
   Mesuré au pire cas (photo à pleine opacité, texte déplié) : 4,6 au minimum, contre 1,6 à 3,1 avant. */
.lcb-tile.wp-block-spectra-container::after {
	-webkit-mask-image: linear-gradient(to top, rgba(0, 0, 0, .05) 0%, rgba(0, 0, 0, .26) 50%, rgba(0, 0, 0, .4) 100%);
	mask-image: linear-gradient(to top, rgba(0, 0, 0, .05) 0%, rgba(0, 0, 0, .26) 50%, rgba(0, 0, 0, .4) 100%);
}

/* ================================================================ pictos */
.lcb-ico {
	display: inline-flex; align-items: center; justify-content: center; flex: none; align-self: flex-start;
	width: 52px; height: 52px; line-height: 0; background: var(--mx-accent); color: var(--mx-titre);
	transition: transform .5s var(--mx-ease), background-color .3s ease, color .3s ease, box-shadow .3s ease;
}
.lcb-ico__svg { display: block; width: 26px; height: 26px; overflow: visible; }
/* Fond sombre : pastille au trait, picto jaune. */
.mx-sombre .lcb-ico { background: transparent; color: var(--mx-accent); box-shadow: inset 0 0 0 1px var(--lcb-ligne-sombre); }
/* Tuiles photo de l'accueil : pastille jaune pleine, lisible sur l'image. */
/* Picto à la place du numéro (13/10/2026) : en haut de la tuile, le texte reste calé en bas. */
.mx-sombre .lcb-tile .lcb-ico { background: var(--mx-accent); color: var(--mx-titre); box-shadow: none; margin: 0 0 auto; }
/* Guillemets des avis. */
.lcb-ico--quote { width: auto; height: auto; background: none; color: var(--mx-accent); }
.lcb-ico--quote .lcb-ico__svg { width: 32px; height: 32px; }
.lcb-engagement .lcb-ico { margin: 0 0 6px; }

/* Liste à puces de l'accueil (« Pourquoi choisir… ») : coche sur carré jaune au lieu du carré seul. */
:is(.entry-content, [class*="astra-advanced-hook-"]) ul.lcb-list { gap: 14px; }
:is(.entry-content, [class*="astra-advanced-hook-"]) ul.lcb-list li { padding-left: 36px; }
:is(.entry-content, [class*="astra-advanced-hook-"]) ul.lcb-list li::after { top: .15em; width: 22px; height: 22px; background: var(--mx-accent) var(--lcb-i-check) center / 14px no-repeat; }

/* Coordonnées du showroom : adresse, horaires, téléphone. */
:is(.entry-content, [class*="astra-advanced-hook-"]) ul.lcb-infos li { position: relative; padding-left: 30px; }
:is(.entry-content, [class*="astra-advanced-hook-"]) ul.lcb-infos li::after {
	content: ""; position: absolute; left: 0; top: .2em; width: 18px; height: 18px; background: currentColor;
	-webkit-mask: var(--lcb-i-pin) center / contain no-repeat; mask: var(--lcb-i-pin) center / contain no-repeat;
}
:is(.entry-content, [class*="astra-advanced-hook-"]) ul.lcb-infos li:nth-child(2)::after { -webkit-mask-image: var(--lcb-i-clock); mask-image: var(--lcb-i-clock); }
:is(.entry-content, [class*="astra-advanced-hook-"]) ul.lcb-infos li:nth-child(3)::after { content: none; }
:is(.entry-content, [class*="astra-advanced-hook-"]) ul.lcb-infos li:nth-child(4)::after { -webkit-mask-image: var(--lcb-i-phone); mask-image: var(--lcb-i-phone); }

/* ================================================================ fin de page : cartes « autres métiers » + encart devis
   Cartes photo (image en fond Spectra, fondue vers le noir en bas comme les tuiles de l'accueil), picto en haut,
   libellé et flèche en bas. Encart jaune : titre, rappel, bouton sombre, téléphone ([client_tel]), « & » de la
   marque en filigrane blanc (élément HTML dédié : Spectra peint le fond des containers dans un ::before qui
   recouvre tout background-image posé sur le container lui-même). */
.lcb-suite-carte.wp-block-spectra-container {
	position: relative; min-height: 260px; overflow: hidden; justify-content: flex-end !important;
	box-shadow: none !important; color: #fff; text-decoration: none !important;
}
.lcb-suite--2 .lcb-suite-carte.wp-block-spectra-container { min-height: 300px; }
.lcb-suite-carte.wp-block-spectra-container::after {
	-webkit-mask-image: linear-gradient(to top, rgba(0, 0, 0, .08) 0%, rgba(0, 0, 0, .55) 55%, rgba(0, 0, 0, .85) 100%);
	mask-image: linear-gradient(to top, rgba(0, 0, 0, .08) 0%, rgba(0, 0, 0, .55) 55%, rgba(0, 0, 0, .85) 100%);
	opacity: .8; transition: transform 1.4s var(--mx-ease), opacity .8s ease;
}
.lcb-suite-t { display: flex; align-items: center; justify-content: space-between; gap: 20px; width: 100%; margin: 0 !important; font-weight: 700; letter-spacing: -0.02em; line-height: 1.25 !important; }
.lcb-suite-t::after {
	content: ""; flex: none; width: 28px; height: 28px; background: currentColor;
	-webkit-mask: var(--lcb-i-fleche) center / contain no-repeat; mask: var(--lcb-i-fleche) center / contain no-repeat;
	transition: transform .5s var(--mx-ease);
}
.lcb-suite-carte:focus-visible { outline: 2px solid var(--mx-accent); outline-offset: 3px; }

.lcb-cta.wp-block-spectra-container { position: relative; overflow: hidden; box-shadow: none !important; }
.lcb-cta.wp-block-spectra-container > :not(.lcb-cta-amp) { position: relative; z-index: 1; }
.lcb-cta-amp {
	position: absolute; z-index: 0; top: -38%; right: -2%; height: 200%; aspect-ratio: 1228 / 1496;
	background: var(--lcb-amp) center / contain no-repeat; pointer-events: none;
}
.lcb-cta h2 { margin: 0 !important; }
.lcb-cta-actions.wp-block-spectra-container { align-items: flex-end; }
.lcb-cta-actions .wp-block-spectra-buttons { justify-content: flex-end !important; }
.lcb-cta-actions .wp-block-spectra-button { padding: 20px 30px !important; }
.lcb-cta-tel { display: flex; align-items: center; gap: 10px; margin: 0 !important; font-size: 22px; font-weight: 800; letter-spacing: -0.01em; }
.lcb-cta-tel::after {
	content: ""; order: -1; flex: none; width: 22px; height: 22px; background: currentColor;
	-webkit-mask: var(--lcb-i-phone) center / contain no-repeat; mask: var(--lcb-i-phone) center / contain no-repeat;
}
:is(.entry-content, [class*="astra-advanced-hook-"]) .lcb-cta .lcb-cta-tel a {
	color: var(--mx-appoint) !important; text-decoration: none !important;
	background: linear-gradient(currentColor, currentColor) 0 100% / 0 2px no-repeat; transition: background-size .35s var(--mx-ease);
}
:is(.entry-content, [class*="astra-advanced-hook-"]) .lcb-cta .lcb-cta-tel a:hover { background-size: 100% 2px; }
@media (max-width: 480px) {
	.lcb-suite-carte.wp-block-spectra-container, .lcb-suite--2 .lcb-suite-carte.wp-block-spectra-container { min-height: 200px; }
	.lcb-cta-actions.wp-block-spectra-container { align-items: flex-start; }
	.lcb-cta-actions .wp-block-spectra-buttons { justify-content: flex-start !important; }
	.lcb-cta-amp { top: auto; bottom: -30%; right: -22%; height: 110%; }
}

/* ================================================================ survols */
@media (hover: hover) {
	/* Boutons : léger soulèvement. */
	.wp-block-spectra-button { transition: background-color .25s ease, color .25s ease, border-color .25s ease, transform .35s var(--mx-ease), box-shadow .35s var(--mx-ease) !important; }
	.wp-block-spectra-button:hover { transform: translateY(-2px); box-shadow: 0 14px 24px -16px rgba(0, 0, 0, .6); }
	#masthead .ast-custom-button { transition: background-color .25s ease, color .25s ease, transform .35s var(--mx-ease) !important; }
	#masthead .ast-custom-button:hover { transform: translateY(-2px); }

	/* Cartes de contenu (fond clair) : soulèvement et ombre, picto inversé. Pas d'ombre inset : Spectra peint le
	   fond des containers dans un ::before qui la recouvre. */
	.m-card.wp-block-spectra-container:not([class*="lcb-"]), .lcb-style.wp-block-spectra-container { transition: transform .5s var(--mx-ease), box-shadow .5s var(--mx-ease) !important; }
	.m-card.wp-block-spectra-container:not([class*="lcb-"]):hover { transform: translateY(-4px); box-shadow: var(--lcb-ombre-survol) !important; }
	.m-card.wp-block-spectra-container:not([class*="lcb-"]):hover .lcb-ico { background: var(--mx-titre); color: var(--mx-accent); }
	.lcb-style.wp-block-spectra-container:hover { transform: translateY(-4px); box-shadow: var(--lcb-ombre-survol) !important; }

	/* Engagements (cartes à filets) : le picto monte et s'inverse. */
	.lcb-engagement.wp-block-spectra-container:hover .lcb-ico { transform: translateY(-3px); background: var(--mx-titre); color: var(--mx-accent); }

	/* Tuiles savoir-faire et étapes. */
	.lcb-tile.wp-block-spectra-container:hover .lcb-ico { transform: translateY(-3px); }
	.lcb-step .lcb-step-n { transition: transform .5s var(--mx-ease), color .3s ease; }
	.lcb-step.wp-block-spectra-container:hover .lcb-step-n { transform: translateX(8px); }

	/* Cartes de fin de page : zoom de la photo, flèche qui avance. */
	.lcb-suite-carte.wp-block-spectra-container:hover::after { transform: scale(1.05); opacity: .95; }
	.lcb-suite-carte.wp-block-spectra-container:hover .lcb-suite-t::after { transform: translateX(8px); }

	/* Avis : les guillemets montent. */
	.lcb-quote.wp-block-spectra-container:hover .lcb-ico--quote { transform: translateY(-4px); }

	/* Photos de contenu : zoom lent dans leur cadre. */
	:is(.entry-content, [class*="astra-advanced-hook-"]) .spectra-is-root-container:not(.lcb-hero) .wp-block-image { overflow: hidden; }
	:is(.entry-content, [class*="astra-advanced-hook-"]) .spectra-is-root-container:not(.lcb-hero) .wp-block-image img { transition: transform 1.4s var(--mx-ease); }
	:is(.entry-content, [class*="astra-advanced-hook-"]) .spectra-is-root-container:not(.lcb-hero) .wp-block-image:hover img { transform: scale(1.04); }

	/* FAQ : bordure foncée au survol. */
	:is(.entry-content, [class*="astra-advanced-hook-"]) .wp-block-spectra-accordion-child-item { transition: border-color .3s ease, box-shadow .3s ease; }
	:is(.entry-content, [class*="astra-advanced-hook-"]) .wp-block-spectra-accordion-child-item:hover { border-color: var(--mx-titre) !important; }

	/* Vignettes de réalisations : zoom de la photo (lcb.css), flèche qui avance. */
	.lcb-vig:hover .lcb-vig__cap::after { transform: translateX(6px); }
	.lcb-rea-galerie__item { overflow: hidden; }
	.lcb-rea-galerie__item img { transition: transform 1.2s var(--mx-ease); }
	.lcb-rea-galerie__item:hover img { transform: scale(1.04); }
}
/* FAQ : question ouverte signalée par un filet jaune (pas seulement au survol). */
:is(.entry-content, [class*="astra-advanced-hook-"]) .wp-block-spectra-accordion-child-item:has(.is-active) { box-shadow: inset 3px 0 0 var(--mx-accent); }

/* Focus clavier visible partout (jaune, décalé). */
:is(.entry-content, .site-footer, #masthead, [class*="astra-advanced-hook-"]) a:focus-visible,
.wp-block-spectra-button:focus-visible, .lcb-vig:focus-visible { outline: 2px solid var(--mx-accent); outline-offset: 3px; }

/* ================================================================ apparitions au scroll (assets/js/reveal.js)
   Classes posées par le script, seulement sur les éléments sous la ligne de flottaison au chargement :
   rien ne disparaît sans JS, rien ne clignote au-dessus de la ligne de flottaison. */
.lcb-rv { opacity: 0; transform: translateY(28px); transition: opacity .9s var(--mx-ease), transform .9s var(--mx-ease); transition-delay: calc(var(--lcb-rv-i, 0) * 90ms); }
.lcb-rv.is-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
	.lcb-rv { opacity: 1; transform: none; transition: none; }
	.lcb-ico, .lcb-vig__cap::after, .wp-block-spectra-button { transition: none !important; }
}
