/*
 * Header, navigation et menu mobile : transcription de « Site Innovative Performance.dc.html »
 * (.hdr, .hdr-in, .logo, .nav, .trig, .cta, .burger, .veil, .mnav, .acc-*), en tokens theme.json.
 * Seules valeurs littérales : les breakpoints (exception ADR-0004, design-system.md §5.6).
 */

/* ---------- Header collant (.hdr) ---------- */
.wp-site-blocks > header.wp-block-template-part:has(> .ip-hdr) {
	position: sticky;
	top: var(--wp-admin--admin-bar--height, 0px);
	z-index: 100;
}

.ip-hdr {
	position: relative;
	height: var(--wp--custom--size--header);
	border-bottom: var(--wp--custom--border--hair) solid var(--wp--preset--color--line);
}

/* Fond translucide flouté porté par un pseudo-élément : un backdrop-filter sur .ip-hdr
   ferait de lui le bloc conteneur du menu mobile (position: fixed). */
.ip-hdr::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: var(--wp--custom--overlay--header);
	-webkit-backdrop-filter: blur(var(--wp--custom--header--blur));
	backdrop-filter: blur(var(--wp--custom--header--blur));
}

/* Voile de page derrière un méga-menu ouvert (.veil). */
.ip-hdr::after {
	content: "";
	position: fixed;
	inset: calc(var(--wp--custom--size--header) + var(--wp-admin--admin-bar--height, 0px)) 0 0 0;
	z-index: -2;
	background: var(--wp--custom--overlay--scrim);
	opacity: 0;
	pointer-events: none;
	transition: opacity var(--wp--custom--motion--menu);
}

.ip-hdr:has(.wp-block-ip-mega-menu.is-open)::after {
	opacity: 1;
	pointer-events: auto;
}

.ip-hdr .ip-hdr__in {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--wp--preset--spacing--50);
	max-width: var(--wp--style--global--wide-size);
	height: var(--wp--custom--size--header);
	margin-inline: auto;
	padding-inline: var(--wp--custom--header--pad);
}

.ip-hdr .ip-hdr__in > * {
	margin-block: 0;
}

/* ---------- Logo (.logo) ---------- */
.ip-logo {
	flex: 0 0 auto;
	margin: 0;
	color: var(--wp--preset--color--ink);
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--logo);
	font-weight: var(--wp--custom--font-weight--bold);
	letter-spacing: var(--wp--custom--letter-spacing--head);
	line-height: var(--wp--custom--line-height--body);
	white-space: nowrap;
}

.ip-logo a,
.ip-logo a:hover {
	color: inherit;
	text-decoration: none;
}

/* ---------- Navigation (.nav) ---------- */
.ip-hdr .ip-nav {
	flex: 1 1 auto;
	justify-content: flex-end;
	gap: var(--wp--custom--header--nav-gap);
}

.ip-hdr .ip-nav .wp-block-navigation__container {
	flex-wrap: nowrap;
	align-items: center;
	justify-content: flex-end;
	gap: var(--wp--custom--header--nav-gap);
}

/* Bouton « Prendre rendez-vous » (.cta), couche marque (ADR-0005). */
.ip-hdr .ip-cta {
	flex: 0 0 auto;
	gap: 0;
}

.ip-hdr .ip-cta .wp-block-button__link,
.ip-mnav .ip-cta .wp-block-button__link {
	padding: var(--wp--custom--header--cta-py) var(--wp--custom--header--cta-px);
	border-radius: var(--wp--preset--border-radius--base);
	background: var(--wp--preset--color--brand);
	color: var(--wp--preset--color--white);
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--sm);
	font-weight: var(--wp--custom--font-weight--medium);
	line-height: var(--wp--custom--line-height--body);
	white-space: nowrap;
}

.ip-hdr .ip-cta .wp-block-button__link:hover,
.ip-mnav .ip-cta .wp-block-button__link:hover {
	background: var(--wp--preset--color--brand-strong);
	color: var(--wp--preset--color--white);
}

@media (min-width: 1024px) and (max-width: 1180px) {
	.ip-hdr .ip-nav .ip-cta {
		display: none;
	}
}

/* ---------- Burger (.burger) : bouton d'ouverture natif ---------- */
.ip-hdr .wp-block-navigation__responsive-container-open {
	align-items: center;
	justify-content: center;
	width: var(--wp--custom--menu--control);
	height: var(--wp--custom--menu--control);
	padding: 0;
	color: var(--wp--preset--color--ink);
}

.ip-hdr .wp-block-navigation__responsive-container-open svg {
	display: none;
}

.ip-hdr .wp-block-navigation__responsive-container-open::before {
	content: "";
	display: block;
	width: var(--wp--custom--menu--burger-width);
	height: var(--wp--custom--menu--burger-thickness);
	background: currentColor;
	box-shadow: 0 calc(-1 * var(--wp--custom--menu--burger-gap)) 0 currentColor, 0 var(--wp--custom--menu--burger-gap) 0 currentColor;
}

/* Bascule desktop / mobile à 1023px (maquette) au lieu de 600px (cœur). */
@media (max-width: 1023px) {
	.ip-hdr .wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: flex;
	}

	.ip-hdr .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
		display: none;
	}
}

@media (min-width: 1024px) {
	.ip-hdr .wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: none;
	}
}

/* ---------- Menu mobile (.mnav) : overlay natif personnalisé ---------- */
.ip-hdr .wp-block-navigation__responsive-container.is-menu-open {
	padding: 0;
	background: var(--wp--preset--color--paper);
	color: var(--wp--preset--color--ink);
}

.ip-hdr .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-close,
.ip-hdr .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog,
.ip-hdr .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content,
.ip-hdr .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__overlay-container {
	display: block;
	width: 100%;
	max-width: none;
	height: 100%;
	margin: 0;
	padding: 0;
}

.ip-hdr .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	display: none;
}

.ip-hdr .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__overlay-container {
	display: none;
}

.ip-mnav {
	display: flex;
	flex-direction: column;
	height: 100%;
	margin: 0;
	background: var(--wp--preset--color--paper);
}

.ip-mnav > * {
	margin-block: 0;
}

.ip-mnav__top {
	display: flex;
	flex: 0 0 var(--wp--custom--size--header);
	align-items: center;
	justify-content: space-between;
	height: var(--wp--custom--size--header);
	padding: 0 var(--wp--preset--spacing--gutter);
	border-bottom: var(--wp--custom--border--hair) solid var(--wp--preset--color--line);
}

.ip-mnav__top > * {
	margin-block: 0;
}

.ip-mnav__body {
	flex: 1;
	overflow-y: auto;
	padding: var(--wp--preset--spacing--40) var(--wp--preset--spacing--gutter) var(--wp--preset--spacing--70);
}

.ip-mnav__foot {
	flex: 0 0 auto;
	padding: var(--wp--preset--spacing--40) var(--wp--preset--spacing--gutter);
	border-top: var(--wp--custom--border--hair) solid var(--wp--preset--color--line);
}

.ip-mnav__foot .ip-cta,
.ip-mnav__foot .ip-cta .wp-block-button {
	display: block;
	width: 100%;
}

.ip-mnav__foot .ip-cta .wp-block-button__link {
	display: block;
	width: 100%;
	padding: var(--wp--preset--spacing--40) var(--wp--preset--spacing--50);
	text-align: center;
}

/* Bouton fermer (.close-x) : bouton natif, glyphe « × » de la maquette. */
.ip-mnav .wp-block-navigation-overlay-close {
	display: flex;
	align-items: center;
	justify-content: center;
	width: var(--wp--custom--menu--control);
	height: var(--wp--custom--menu--control);
	padding: 0;
	border: 0;
	background: none;
	color: var(--wp--preset--color--ink);
	font-family: var(--wp--preset--font-family--text);
	font-size: var(--wp--custom--menu--close-glyph);
	line-height: 1;
	cursor: pointer;
}

.ip-mnav .wp-block-navigation-overlay-close svg {
	display: none;
}

.ip-mnav .wp-block-navigation-overlay-close::before {
	content: "×";
}

/* Accordéons (.acc-head / .acc-body) : core/accordion. */
.ip-mnav .wp-block-accordion,
.ip-mnav .wp-block-accordion-item {
	margin: 0;
}

.ip-mnav .wp-block-accordion-heading {
	margin: 0;
	font-size: inherit;
}

.ip-mnav .wp-block-accordion-heading__toggle {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--wp--preset--spacing--40);
	width: 100%;
	padding: var(--wp--preset--spacing--40) 0;
	border: 0;
	border-bottom: var(--wp--custom--border--hair) solid var(--wp--preset--color--line);
	background: none;
	color: var(--wp--preset--color--ink);
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--h-3);
	font-weight: var(--wp--custom--font-weight--medium);
	letter-spacing: normal;
	line-height: var(--wp--custom--line-height--body);
	text-align: left;
	text-decoration: none;
}

.ip-mnav .wp-block-accordion-heading__toggle:hover,
.ip-mnav .wp-block-accordion-heading__toggle:hover .wp-block-accordion-heading__toggle-title {
	text-decoration: none;
}

.ip-mnav .wp-block-accordion-heading__toggle-icon {
	flex: 0 0 auto;
	width: var(--wp--custom--menu--chevron);
	height: var(--wp--custom--menu--chevron);
	overflow: hidden;
	background: currentColor;
	font-size: 0;
	-webkit-mask: url("../icons/chevron.svg") center / contain no-repeat;
	mask: url("../icons/chevron.svg") center / contain no-repeat;
	transform: none;
	transition: transform var(--wp--custom--motion--menu);
}

.ip-mnav .wp-block-accordion-heading__toggle[aria-expanded="true"] .wp-block-accordion-heading__toggle-icon {
	transform: rotate(180deg);
}

.ip-mnav .wp-block-accordion-panel {
	padding: var(--wp--preset--spacing--30) 0 var(--wp--preset--spacing--50);
}

.ip-mnav .wp-block-accordion-panel > *,
.ip-mnav .wp-block-accordion-item > *,
.ip-mnav .wp-block-accordion > *,
.ip-mnav .ip-mnav__body > * {
	margin-block: 0;
}

.ip-mnav .ip-mega {
	display: block;
	max-width: none;
	padding: 0;
}

.ip-mnav .ip-mega__cols {
	display: block;
}

.ip-mnav .wp-block-group.ip-mega .ip-mega__col + .ip-mega__col {
	margin-top: var(--wp--preset--spacing--50);
}

.ip-mnav .ip-mega__vis {
	display: none;
}

@media (prefers-reduced-motion: reduce) {
	.ip-hdr::after,
	.ip-mnav .wp-block-accordion-heading__toggle-icon {
		transition: none;
	}
}
