/* ===========================================================================
 * Fiche modèle (bloc eb/modele-section + modèle single-modele.html)
 * ======================================================================== */

/* ---- Hero : dégradé anthracite → orange profond, nom en très grand ---- */
.eb-mhero {
	position: relative;
	padding-top: calc(var(--eb-header-h) + var(--wp--preset--spacing--60));
	padding-bottom: var(--wp--preset--spacing--60);
	color: var(--eb-ink-on-dark);
	--eb-muted: var(--eb-muted-on-dark);
	--eb-line: var(--eb-line-on-dark);
	background:
		linear-gradient(165deg, rgba(50, 50, 50, 0.96) 0%, rgba(50, 50, 50, 0.9) 42%, color-mix(in srgb, var(--eb-accent) 62%, #1a0c06) 100%),
		var(--wp--preset--color--anthracite) url("../../textures/beton-sombre.jpg") 0 0 / 512px;
}
.eb-mhero__inner { display: grid; gap: var(--wp--preset--spacing--50); }
.eb-fil { display: flex; flex-wrap: wrap; gap: 0.5rem; font-size: var(--wp--preset--font-size--x-small); color: var(--eb-muted); }
.eb-fil a { color: inherit; text-decoration: none; }
.eb-fil a:hover { color: var(--eb-ink-on-dark); }
.eb-fil [aria-current] { color: var(--eb-ink-on-dark); }
.eb-mhero__titres { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: var(--wp--preset--spacing--50); align-items: end; }
.eb-mhero__nom {
	margin: 0;
	font-family: var(--wp--preset--font-family--goldman); font-weight: 700;
	font-size: clamp(3.2rem, 1rem + 9vw, 9.5rem); line-height: 0.92; letter-spacing: -0.02em;
}
.eb-mhero__accroche { margin: 0; font-size: var(--wp--preset--font-size--large); line-height: 1.45; max-width: 30ch; padding-bottom: 0.8rem; }
.eb-mhero__photo { position: relative; margin: var(--wp--preset--spacing--30) 0 0; aspect-ratio: 21 / 9; }
.eb-mhero__photo img { width: 100%; height: 100%; object-fit: cover; border-radius: var(--wp--custom--radius--large); display: block; }
@media (max-width: 781px) {
	.eb-mhero__titres { grid-template-columns: 1fr; gap: var(--wp--preset--spacing--30); }
	.eb-mhero__photo { aspect-ratio: 4 / 3; }
}

/* ---- En bref ---- */
.eb-mbref__grille { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--wp--preset--spacing--60); align-items: center; }
.eb-mbref__grille.is-sans-photo { grid-template-columns: minmax(0, 1fr); max-width: 820px; }
.eb-mbref__photo { margin: 0; aspect-ratio: 4 / 5; border-radius: var(--wp--custom--radius--large); overflow: hidden; background: var(--wp--preset--color--graphite); }
.eb-mbref__photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.eb-mbref__texte > * + * { margin-top: var(--wp--preset--spacing--40); }
.eb-mbref__chiffres { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: var(--wp--preset--spacing--40); margin-top: var(--wp--preset--spacing--50) !important; }
.eb-mbref .eb-stat__num { font-size: clamp(1.4rem, 1rem + 1.1vw, 1.9rem); white-space: nowrap; }
@media (max-width: 781px) {
	.eb-mbref__grille { grid-template-columns: 1fr; }
	.eb-mbref__photo { aspect-ratio: 4 / 3; }
	.eb-mbref__chiffres { grid-template-columns: 1fr; }
}

/* ---- Machine en détail : photo à repères + caractéristiques ---- */
.eb-mdetail__grille { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: var(--wp--preset--spacing--60); align-items: start; }
.eb-mdetail__grille.is-sans-photo { grid-template-columns: minmax(0, 1fr); max-width: 760px; }
.eb-mdetail__visuel { position: relative; position: sticky; top: calc(var(--eb-header-h) + 2rem); }
.eb-mdetail__photo { margin: 0; aspect-ratio: 4 / 3; }
.eb-mdetail__photo img { width: 100%; height: 100%; object-fit: cover; display: block; border-radius: var(--wp--custom--radius--large); }
.eb-mdetail__texte > * + * { margin-top: var(--wp--preset--spacing--40); }

/* Repère : carré encadré de crochets, « + » orange */
.eb-point { position: absolute; z-index: 2; width: 0; height: 0; }
.eb-point.is-open { z-index: 5; }
.eb-point__bouton {
	position: absolute; left: -22px; top: -22px; width: 44px; height: 44px;
	display: grid; place-items: center; cursor: pointer;
	background: color-mix(in srgb, var(--wp--preset--color--anthracite) 55%, transparent);
	backdrop-filter: blur(4px);
	border: 1.5px solid rgba(255, 255, 255, 0.85); border-radius: 8px;
	color: var(--eb-accent);
	transition: transform 0.2s var(--eb-ease), background-color 0.2s;
}
.eb-point__bouton .eb-icon { width: 16px; height: 16px; fill: var(--eb-accent); transition: transform 0.25s var(--eb-ease); }
.eb-point__bouton::after { /* pulsation discrète */
	content: ""; position: absolute; inset: -6px; border-radius: 12px; border: 1px solid color-mix(in srgb, var(--eb-accent) 70%, transparent);
	animation: eb-point-pulse 2.4s ease-out infinite;
}
@keyframes eb-point-pulse { from { opacity: 0.9; transform: scale(0.85); } to { opacity: 0; transform: scale(1.35); } }
.eb-point__bouton:hover { transform: scale(1.06); }
.eb-point.is-open .eb-point__bouton { background: var(--eb-accent); border-color: var(--eb-accent); }
.eb-point.is-open .eb-point__bouton .eb-icon { fill: var(--wp--preset--color--anthracite); transform: rotate(45deg); }
.eb-point.is-open .eb-point__bouton::after { animation: none; opacity: 0; }
.eb-point__carte {
	position: absolute; left: 34px; top: -22px; width: min(300px, 70vw);
	background: color-mix(in srgb, var(--wp--preset--color--graphite) 94%, transparent);
	backdrop-filter: blur(10px);
	border: 1px solid var(--eb-line-on-dark); border-radius: var(--wp--custom--radius--medium);
	padding: 0.9rem; color: var(--eb-ink-on-dark);
	box-shadow: 0 18px 40px rgba(0, 0, 0, 0.35);
	animation: eb-tab-in 0.3s var(--eb-ease);
}
.eb-point.is-gauche .eb-point__carte { left: auto; right: 34px; }
.eb-point__carte img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; border-radius: var(--wp--custom--radius--small); margin-bottom: 0.7rem; display: block; }
.eb-point__titre { margin: 0; font-family: var(--wp--preset--font-family--goldman); font-weight: 700; font-size: 1.05rem; }
.eb-point__texte { margin: 0.4rem 0 0; font-size: var(--wp--preset--font-size--small); color: var(--eb-muted-on-dark); line-height: 1.5; }

/* Tableau de caractéristiques */
.eb-specs { margin: 0; border-top: 1px solid var(--eb-line); }
.eb-specs > div { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 1rem; padding: 0.75rem 0; border-bottom: 1px solid var(--eb-line); }
.eb-specs dt { font-size: var(--wp--preset--font-size--x-small); font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--eb-muted); }
.eb-specs dd { margin: 0; text-align: right; font-size: var(--wp--preset--font-size--small); font-variant-numeric: tabular-nums; }
.eb-mdetail__boutons { display: flex; flex-wrap: wrap; gap: 0.8rem; margin-top: var(--wp--preset--spacing--50) !important; }
.eb-bouton-fiche { display: inline-flex; align-items: center; gap: 0.6rem; cursor: pointer; border: 0; }
.eb-bouton-fiche .eb-icon { width: 16px; height: 16px; fill: currentColor; }
@media (max-width: 900px) {
	.eb-mdetail__grille { grid-template-columns: 1fr; }
	.eb-mdetail__visuel { position: relative; top: 0; }
}

/* ---- Options du modèle ---- */
.eb-moptions__liste { list-style: none; margin: var(--wp--preset--spacing--50) 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 10px; }
.eb-mopt {
	display: grid; grid-template-columns: 40px 1fr auto; gap: 0.9rem; align-items: center;
	padding: 1rem 1.1rem; border-radius: var(--wp--custom--radius--medium);
	background: var(--wp--preset--color--blanc);
}
.eb-mopt .eb-icon { width: 40px; height: 40px; padding: 10px; border-radius: 50%; background: var(--wp--preset--color--beton-clair); fill: var(--wp--preset--color--anthracite); box-sizing: border-box; }
.eb-mopt__nom { font-weight: 600; font-size: var(--wp--preset--font-size--small); line-height: 1.35; }
.eb-mopt__statut { font-size: 0.7rem; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; padding: 0.3rem 0.55rem; border-radius: 999px; background: var(--wp--preset--color--beton-clair); color: var(--eb-muted); white-space: nowrap; }
.eb-mopt.is-incluse .eb-icon { background: var(--eb-accent); }
.eb-mopt.is-incluse .eb-mopt__statut { background: var(--wp--preset--color--anthracite); color: var(--eb-ink-on-dark); }

/* ---- Autres modèles (cartes liens) ---- */
.eb-mautres__grid { margin-top: var(--wp--preset--spacing--50) !important; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)) !important; }
a.eb-modele--lien { color: inherit; text-decoration: none; }
.eb-modele__cta span { display: inline-flex; gap: 0.5rem; align-items: center; }
.eb-modele__cta span::after { content: ""; width: 22px; height: 2px; background: var(--eb-accent); transition: width 0.25s var(--eb-ease); }
a.eb-modele--lien:hover .eb-modele__cta span::after { width: 36px; }

/* ---- Fonctionnement et prérequis (motifs) ---- */
.eb-mfonct__grille { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--wp--preset--spacing--30); }
.eb-mfonct__grille > * { margin-block-start: 0 !important; }
.eb-mprerequis__grille { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--wp--preset--spacing--60); }
.eb-mprerequis__grille > * { margin-block-start: 0 !important; }
.eb-mprerequis .eb-iconlist__item p strong { display: block; color: var(--eb-ink-on-dark); margin-bottom: 0.15rem; }
.eb-mprerequis .eb-iconlist__item p { color: var(--eb-muted); }
@media (max-width: 900px) {
	.eb-mfonct__grille { grid-template-columns: 1fr; }
	.eb-mprerequis__grille { grid-template-columns: 1fr; }
}

/* ---- Fiche imprimable (bouton « Imprimer la fiche technique ») ---- */
@media print {
	@page { margin: 14mm; }
	body { background: #fff !important; color: #111 !important; }
	header.wp-block-template-part, footer.wp-block-template-part, .eb-mautres, .eb-cta, .eb-moptions .eb-lede,
	.eb-mdetail__boutons, .eb-point, .eb-fil, .eb-mfonct, .eb-proto { display: none !important; }
	.eb-mhero, .eb-mdetail, .eb-moptions, .eb-mbref, .eb-mprerequis { background: none !important; color: #111 !important; padding: 0 0 8mm !important; }
	.eb-mhero { --eb-muted: #555; }
	.eb-mhero__nom { font-size: 34pt; color: #111; }
	.eb-mhero__photo { aspect-ratio: 21 / 8; }
	.eb-mdetail__grille, .eb-mbref__grille { grid-template-columns: 1fr !important; }
	.eb-mdetail__visuel { display: none; }
	.eb-specs > div { border-color: #ccc; }
	.eb-specs dt { color: #555; }
	.eb-section-title::before { background: #FF5D24 !important; }
	.eb-mprerequis .eb-iconlist__item p strong { color: #111; }
	.eb-mprerequis .eb-iconlist__item p { color: #333; }
	a { color: inherit; text-decoration: none; }
}

/* ---- Aperçu temporaire des fonds du hero (?fond=a|b|c|d), en attente du choix ---- */
.eb-mhero.is-fond-a { background: var(--wp--preset--color--anthracite) url("../../textures/beton-sombre.jpg") 0 0 / 512px; }
.eb-mhero.is-fond-b {
	background: var(--wp--preset--color--beton-clair) url("../../textures/beton-clair-tuile.jpg") 0 0 / 512px;
	color: var(--wp--preset--color--anthracite); --eb-muted: var(--eb-muted-on-light); --eb-line: var(--eb-line-on-light);
}
.eb-mhero.is-fond-b .eb-fil [aria-current], .eb-mhero.is-fond-b .eb-fil a:hover { color: var(--wp--preset--color--anthracite); }
.eb-mhero.is-fond-d { background: var(--eb-accent); color: var(--wp--preset--color--anthracite); --eb-muted: rgba(50, 50, 50, 0.75); }
.eb-mhero.is-fond-d .eb-fil [aria-current] { color: var(--wp--preset--color--anthracite); }
.eb-mhero.is-fond-d .eb-crochets { --eb-bracket: var(--wp--preset--color--anthracite); }
body:has(.eb-mhero.is-fond-b) .eb-header, body:has(.eb-mhero.is-fond-d) .eb-header { background-color: var(--wp--preset--color--anthracite); }
.eb-mhero.is-fond-c { min-height: 88vh; display: flex; align-items: flex-end; isolation: isolate; background: var(--wp--preset--color--anthracite); }
.eb-mhero.is-fond-c .eb-mhero__inner { width: 100%; }
.eb-mhero.is-fond-c .eb-mhero__photo { position: absolute; inset: 0; margin: 0; aspect-ratio: auto; z-index: -2; }
.eb-mhero.is-fond-c .eb-mhero__photo img { border-radius: 0; }
.eb-mhero.is-fond-c .eb-mhero__photo::before, .eb-mhero.is-fond-c .eb-mhero__photo::after { display: none; }
.eb-mhero.is-fond-c::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(30, 30, 30, 0.6) 0%, rgba(30, 30, 30, 0.15) 40%, rgba(30, 30, 30, 0.88) 100%); }