/* =========================================================
   Variantes header / footer (template-parts)
   Sobre, sans glow/halo (norme DECOR-01). Le CSS ne fait que
   moduler l'apparence ; le markup reste celui des parts.
   ========================================================= */

/* ---- Header « Transparent » : overlay par-dessus un hero ----
   Au repos (pas scrollé) : fond transparent, texte clair, posé
   par-dessus le contenu. Dès .is-scrolled (posé par theme.js),
   on rend la main aux styles solides de header.css. */
.ms-header--transparent:not(.is-scrolled) {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	width: 100%;
	z-index: 100;
	background: transparent;
	border-bottom-color: transparent;
	box-shadow: none;
}
.ms-header--transparent:not(.is-scrolled) .ms-brand,
.ms-header--transparent:not(.is-scrolled) .ms-brand b,
.ms-header--transparent:not(.is-scrolled) .ms-nav a,
.ms-header--transparent:not(.is-scrolled) .ms-header__tel {
	color: #fff;
}
.ms-header--transparent:not(.is-scrolled) .ms-burger__bar {
	background: #fff;
}

/* ---- Header « Minimal » : pas de menu, focus action ---- */
.ms-header--minimal .ms-header__inner {
	justify-content: space-between;
}
.ms-header--minimal .ms-burger {
	display: none;
}

/* ---- Footer « Minimal » : logo + mentions légales ---- */
.ms-footer--minimal .ms-footer__minimal-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 16px;
	padding: 28px 0;
}
.ms-footer--minimal .ms-footer__legal--minimal {
	display: flex;
	align-items: center;
	gap: 18px;
	flex-wrap: wrap;
	margin: 0;
	border: 0;
	padding: 0;
}
.ms-footer--minimal .ms-footer__brand {
	margin: 0;
}
@media (max-width: 600px) {
	.ms-footer--minimal .ms-footer__minimal-inner {
		flex-direction: column;
		align-items: flex-start;
		text-align: left;
	}
}

/* =========================================================
   Header « Hero overlay (marque) » — .cvh (transparent, sur le hero)
   ========================================================= */
.cvh {
	position: absolute;
	top: 0; left: 0; right: 0;
	width: 100%;
	z-index: 100;
	background: transparent;
}
.cvh__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	padding: 24px 0;
}
.cvh__logo { display: flex; align-items: center; gap: 12px; text-decoration: none; }
.cvh__mark {
	width: 40px; height: 40px; flex: none;
	border-radius: 12px;
	background: var(--wp--preset--color--accent-2);
	color: #fff;
	display: flex; align-items: center; justify-content: center;
}
.cvh__mark svg { width: 22px; height: 22px; }
.cvh__name { display: block; font-family: var(--wp--preset--font-family--display); font-weight: 700; font-size: 20px; line-height: 1.1; color: #fff; }
.cvh__tag { display: none; } /* tagline masquée (blogdescription trop longue pour le header) */
.cvh__nav { display: flex; }
.cvh__menu { display: flex; gap: 34px; margin: 0; padding: 0; list-style: none; }
.cvh__menu a { font-size: 15px; font-weight: 500; color: rgba(255,255,255,.92); text-decoration: none; transition: opacity .18s; }
.cvh__menu a:hover { opacity: .62; }
.cvh__menu .current-menu-item a { opacity: 1; }
.cvh__actions { display: flex; align-items: center; gap: 20px; }
.cvh__tel { display: flex; align-items: center; gap: 8px; font-family: var(--wp--preset--font-family--display); font-weight: 700; font-size: 16px; color: #fff; text-decoration: none; white-space: nowrap; }
.cvh__tel svg { color: var(--wp--preset--color--accent-2); }
.cvh__cta {
	display: inline-flex; align-items: center;
	border-radius: 12px; padding: 13px 22px;
	font-family: var(--wp--preset--font-family--display); font-weight: 700; font-size: 15px;
	background: var(--wp--preset--color--accent-2); color: var(--wp--preset--color--primary-dark);
	text-decoration: none; transition: filter .2s;
}
.cvh__cta:hover { filter: brightness(1.06); }
.cvh__burger { display: none; }
.cvh .ms-burger__bar { background: #fff; }
@media (max-width: 900px) {
	.cvh__nav { display: none; }
	.cvh__tel span { display: none; }
	.cvh__burger { display: inline-flex; }
}

/* =========================================================
   Footer « Couvreur (sombre) » — .cvf (4 colonnes sur fond sombre)
   ========================================================= */
.cvf { background: var(--wp--preset--color--primary-dark); color: rgba(255,255,255,.66); padding: 64px 0 40px; }
.cvf__top { display: flex; justify-content: space-between; gap: 64px; flex-wrap: wrap; }
.cvf__brand { max-width: 340px; }
.cvf__logo-row { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; }
.cvf__mark { width: 34px; height: 34px; flex: none; border-radius: 9px; background: var(--wp--preset--color--accent); color: #fff; display: flex; align-items: center; justify-content: center; }
.cvf__mark svg { width: 20px; height: 20px; }
.cvf__name { font-family: var(--wp--preset--font-family--display); font-weight: 800; font-size: 20px; color: #fff; }
.cvf__desc { font-size: 15px; line-height: 1.55; color: rgba(255,255,255,.66); margin-bottom: 16px; }
.cvf__phone { display: inline-flex; align-items: center; gap: 8px; font-family: var(--wp--preset--font-family--display); font-weight: 700; font-size: 17px; color: #fff; text-decoration: none; }
.cvf__phone svg { color: var(--wp--preset--color--accent-2); }
.cvf__h { font-family: var(--wp--preset--font-family--display); font-weight: 700; font-size: 15px; color: #fff; margin-bottom: 14px; }
.cvf__nav, .cvf__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 14px; }
.cvf__nav a, .cvf__list a, .cvf__list li { font-size: 15px; color: rgba(255,255,255,.66); text-decoration: none; transition: color .18s; }
.cvf__nav a:hover, .cvf__list a:hover { color: #fff; }
.cvf__hours { font-size: 15px; line-height: 1.75; color: rgba(255,255,255,.66); margin-bottom: 16px; }
.cvf__cta { display: inline-flex; border-radius: 10px; padding: 12px 18px; font-family: var(--wp--preset--font-family--display); font-weight: 700; font-size: 14px; background: var(--wp--preset--color--accent-2); color: var(--wp--preset--color--primary-dark); text-decoration: none; }
.cvf__divider { height: 1px; background: rgba(255,255,255,.1); margin: 40px 0; }
.cvf__bottom { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; font-size: 14px; }
.cvf__legal { display: flex; gap: 24px; }
.cvf__legal a { color: rgba(255,255,255,.66); text-decoration: none; }
.cvf__legal a:hover { color: #fff; }
@media (max-width: 780px) { .cvf__top { gap: 32px; } }
