/*
 * HayTech : composants du design système au-dessus de theme.json.
 * Les valeurs viennent des variables WordPress générées depuis brand/tokens.json :
 *   --wp--preset--color--*, --wp--preset--font-size--*, --wp--preset--spacing--*,
 *   --wp--custom--radius--*, --wp--custom--motion--*, --wp--custom--focus-ring.
 */

:root {
	--ht-navy: var(--wp--preset--color--navy-900);
	--ht-ease: var(--wp--custom--motion--easing);
	--ht-fast: var(--wp--custom--motion--fast);
	--ht-base: var(--wp--custom--motion--base);
	--ht-radius-sm: var(--wp--custom--radius--sm);
	--ht-radius-md: var(--wp--custom--radius--md);
	--ht-radius-lg: var(--wp--custom--radius--lg);
	--ht-radius-xl: var(--wp--custom--radius--xl);
	--ht-header-height: 76px;
}

body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
}

html {
	scroll-padding-top: calc(var(--ht-header-height) + 16px);
}

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: none;
	box-shadow: var(--wp--custom--focus-ring);
	border-radius: 4px;
}

a {
	text-underline-offset: 3px;
	text-decoration-thickness: 1px;
	transition: color var(--ht-fast) var(--ht-ease);
}

::selection {
	background: var(--wp--preset--color--teal-100);
	color: var(--ht-navy);
}

.screen-reader-text:focus {
	background: #fff;
	color: var(--ht-navy);
	padding: 12px 16px;
	z-index: 1000;
}

/* ------------------------------------------------------------------ */
/* Typographie                                                         */
/* ------------------------------------------------------------------ */

.is-style-overline {
	font-size: var(--wp--preset--font-size--small);
	font-size: clamp(12px, 0.8rem, 13px);
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	line-height: 1.4;
	color: var(--wp--preset--color--teal-700);
}

.is-style-lead {
	font-size: var(--wp--preset--font-size--lead);
	line-height: 1.6;
	color: var(--wp--preset--color--slate-600);
}

.is-style-badge {
	display: inline-flex;
	align-items: center;
	width: fit-content;
	gap: 6px;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.4;
	padding: 4px 10px;
	border-radius: 999px;
	background: var(--wp--preset--color--teal-50);
	color: var(--wp--preset--color--teal-800);
}

.ht-measure {
	max-width: 60ch;
}

.ht-measure-narrow {
	max-width: 36ch;
}

/* Sur fond sombre (bleu nuit) : titres blancs, textes bleu clair, liens turquoise clair. */
.has-navy-900-background-color {
	color: var(--wp--preset--color--navy-200);
}

.has-navy-900-background-color :is(h1, h2, h3, h4, h5, h6, .wp-block-heading) {
	color: #fff;
}

.has-navy-900-background-color .is-style-overline {
	color: var(--wp--preset--color--teal-400);
}

.has-navy-900-background-color .is-style-lead {
	color: var(--wp--preset--color--navy-200);
}

.has-navy-900-background-color a:where(:not(.wp-element-button)) {
	color: var(--wp--preset--color--teal-400);
}

/* ------------------------------------------------------------------ */
/* Boutons                                                             */
/* ------------------------------------------------------------------ */

.wp-element-button,
.wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	text-decoration: none;
	transition:
		background-color var(--ht-fast) var(--ht-ease),
		color var(--ht-fast) var(--ht-ease),
		border-color var(--ht-fast) var(--ht-ease),
		transform var(--ht-fast) var(--ht-ease);
}

.wp-block-button__link:active {
	transform: translateY(1px);
}

.wp-block-button__link:focus-visible {
	box-shadow: var(--wp--custom--focus-ring);
}

/* Flèche après le libellé : classe « has-arrow » sur le bouton. */
.wp-block-button.has-arrow .wp-block-button__link::after {
	content: "";
	width: 18px;
	height: 18px;
	flex: none;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat;
	transition: transform var(--ht-fast) var(--ht-ease);
}

.wp-block-button.has-arrow .wp-block-button__link:hover::after {
	transform: translateX(3px);
}

.wp-block-button.is-style-secondary .wp-block-button__link {
	background: var(--ht-navy);
	color: #fff;
}

.wp-block-button.is-style-secondary .wp-block-button__link:hover {
	background: var(--wp--preset--color--navy-800);
	color: #fff;
}

.wp-block-button.is-style-outline .wp-block-button__link {
	background: transparent;
	color: var(--ht-navy);
	border: 1.5px solid var(--wp--preset--color--slate-300);
	padding: 14px 22px;
}

.wp-block-button.is-style-outline .wp-block-button__link:hover {
	background: var(--wp--preset--color--navy-50);
	border-color: var(--ht-navy);
}

.wp-block-button.is-style-outline-light .wp-block-button__link {
	background: transparent;
	color: #fff;
	border: 1.5px solid var(--wp--preset--color--navy-700);
}

.wp-block-button.is-style-outline-light .wp-block-button__link:hover {
	border-color: var(--wp--preset--color--teal-400);
	color: #fff;
}

.wp-block-button.is-style-ghost .wp-block-button__link {
	background: transparent;
	color: var(--wp--preset--color--teal-700);
	padding-left: 0;
	padding-right: 0;
}

.wp-block-button.is-style-ghost .wp-block-button__link:hover {
	color: var(--wp--preset--color--teal-800);
	background: transparent;
}

.wp-block-button.ht-btn-sm .wp-block-button__link {
	padding: 10px 16px;
	font-size: 14px;
	border-radius: var(--ht-radius-sm);
}

.wp-block-button.ht-btn-lg .wp-block-button__link {
	padding: 18px 28px;
	font-size: 17px;
}

/* ------------------------------------------------------------------ */
/* En-tête                                                             */
/* ------------------------------------------------------------------ */

.ht-skip-link {
	position: absolute;
	left: 16px;
	top: -100px;
	z-index: 1000;
	background: #fff;
	color: var(--ht-navy);
	padding: 12px 16px;
	border-radius: var(--ht-radius-sm);
	font-weight: 600;
}

.ht-skip-link:focus {
	top: 12px;
}

header.wp-block-template-part {
	position: sticky;
	top: 0;
	z-index: 100;
}

.admin-bar header.wp-block-template-part {
	top: var(--wp-admin--admin-bar--height, 32px);
}

@media (max-width: 600px) {
	.admin-bar header.wp-block-template-part {
		top: 0;
	}
}

.ht-header {
	background: rgba(255, 255, 255, 0.92);
	-webkit-backdrop-filter: saturate(1.4) blur(8px);
	backdrop-filter: saturate(1.4) blur(8px);
	border-bottom: 1px solid var(--wp--preset--color--slate-200);
	transition: box-shadow var(--ht-base) var(--ht-ease);
}

.ht-header.is-scrolled {
	box-shadow: var(--wp--preset--shadow--sm);
}

.ht-header__inner {
	min-height: var(--ht-header-height);
	gap: 32px;
}

.ht-header .wp-block-navigation {
	margin-left: auto;
	gap: 28px;
}

.ht-header .wp-block-navigation-item__content {
	color: var(--wp--preset--color--slate-700);
	text-decoration: none;
	padding-block: 6px;
}

.ht-header .wp-block-navigation-item__content:hover,
.ht-header .current-menu-item > .wp-block-navigation-item__content,
.ht-header .wp-block-navigation-item__content[aria-current="page"] {
	color: var(--ht-navy);
}

.ht-header .current-menu-item > .wp-block-navigation-item__content,
.ht-header .wp-block-navigation-item__content[aria-current="page"] {
	box-shadow: inset 0 -2px 0 var(--wp--preset--color--teal-500);
}

.ht-header .wp-block-navigation__responsive-container.is-menu-open {
	padding: 24px var(--wp--custom--gutter);
}

.ht-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	gap: 20px;
	font-size: 20px;
	padding-top: 48px;
}

@media (max-width: 599px) {
	.ht-header .ht-header__cta {
		display: none;
	}
}

/* Logo */
.ht-logo {
	display: inline-flex;
	align-items: center;
	line-height: 0;
	flex: none;
}

.ht-logo svg {
	height: var(--ht-logo-height, 36px);
	width: auto;
}

/* ------------------------------------------------------------------ */
/* Icônes                                                              */
/* ------------------------------------------------------------------ */

.ht-icon {
	display: inline-grid;
	place-items: center;
	flex: none;
	width: 48px;
	height: 48px;
	border-radius: var(--ht-radius-md);
	line-height: 0;
}

.ht-icon--soft {
	background: var(--wp--preset--color--teal-50);
	color: var(--wp--preset--color--teal-700);
}

.ht-icon--dark {
	background: var(--wp--preset--color--navy-900);
	color: var(--wp--preset--color--teal-400);
}

.ht-icon--plain {
	width: auto;
	height: auto;
	color: var(--wp--preset--color--teal-700);
}

/* ------------------------------------------------------------------ */
/* Hero                                                                */
/* ------------------------------------------------------------------ */

.ht-hero {
	position: relative;
	overflow: hidden;
	isolation: isolate;
}

/* Courbe de données : le motif de la marque, en fond. */
.is-style-cta::before {
	content: "";
	position: absolute;
	z-index: -1;
	pointer-events: none;
	background: url("../img/courbe.svg") center / contain no-repeat;
}


.ht-hero h1 {
	max-width: 16ch;
	text-wrap: balance;
}

.ht-hero .is-style-lead {
	max-width: 40ch;
}

.ht-page-hero h1 {
	max-width: 22ch;
	text-wrap: balance;
}

.ht-page-hero .is-style-lead {
	max-width: 56ch;
}


.ht-trust {
	gap: 28px 40px;
	font-size: 14px;
	color: var(--wp--preset--color--navy-300);
}

.ht-trust strong {
	display: block;
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 500;
	font-size: 28px;
	line-height: 1.1;
	color: #fff;
}

/* ------------------------------------------------------------------ */
/* Cartes, chiffres, encadrés                                          */
/* ------------------------------------------------------------------ */

.wp-block-group.is-style-card {
	position: relative;
	background: #fff;
	border: 1px solid var(--wp--preset--color--slate-200);
	border-radius: var(--ht-radius-lg);
	padding: 28px;
	transition:
		box-shadow var(--ht-base) var(--ht-ease),
		transform var(--ht-base) var(--ht-ease),
		border-color var(--ht-base) var(--ht-ease);
}

.wp-block-group.is-style-card > * + * {
	margin-block-start: 12px;
}

.wp-block-group.is-style-card > .ht-icon {
	margin-block-end: 8px;
}

.wp-block-group.is-style-card p:not(.is-style-overline) {
	color: var(--wp--preset--color--slate-600);
	font-size: 16px;
}

.wp-block-group.is-style-card .wp-block-list {
	color: var(--wp--preset--color--slate-600);
	font-size: 16px;
}

/* Carte cliquable : le lien « En savoir plus » couvre toute la carte. */
.wp-block-group.is-style-card:has(.ht-card-link) {
	cursor: pointer;
}

.wp-block-group.is-style-card .ht-card-link a::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
}

.wp-block-group.is-style-card:has(.ht-card-link):hover,
.wp-block-group.is-style-card:has(.ht-card-link):focus-within {
	box-shadow: var(--wp--preset--shadow--lg);
	transform: translateY(-3px);
	border-color: var(--wp--preset--color--navy-200);
}

.ht-card-link {
	margin-top: auto !important;
	padding-top: 4px;
	font-weight: 600;
	font-size: 16px;
}

.ht-card-link a {
	text-decoration: none;
	color: var(--wp--preset--color--teal-700);
}

.ht-card-link a:focus-visible {
	box-shadow: none;
}

.ht-card-link a:focus-visible::after {
	box-shadow: var(--wp--custom--focus-ring);
}

.ht-card-link a span {
	display: inline-block;
	transition: transform var(--ht-fast) var(--ht-ease);
}

.is-style-card:hover .ht-card-link a span {
	transform: translateX(3px);
}

/* Les cartes d'une grille s'étirent à la même hauteur, lien en bas. */
.is-layout-grid > .wp-block-group.is-style-card {
	display: flex;
	flex-direction: column;
}

.has-navy-50-background-color .wp-block-group.is-style-card {
	border-color: transparent;
	box-shadow: var(--wp--preset--shadow--sm);
}

.has-navy-900-background-color .wp-block-group.is-style-card {
	background: var(--wp--preset--color--navy-800);
	border-color: var(--wp--preset--color--navy-700);
}

.has-navy-900-background-color .wp-block-group.is-style-card p:not(.is-style-overline) {
	color: var(--wp--preset--color--navy-200);
}

.wp-block-group.is-style-stat {
	padding: 28px;
	border-radius: var(--ht-radius-lg);
	background: var(--wp--preset--color--navy-50);
}

.wp-block-group.is-style-stat .ht-stat-value {
	font-family: var(--wp--preset--font-family--heading);
	font-size: clamp(36px, 4vw, 48px);
	font-weight: 500;
	line-height: 1;
	letter-spacing: -0.02em;
	color: var(--ht-navy);
}

.wp-block-group.is-style-stat .ht-stat-value em {
	font-style: normal;
	color: var(--wp--preset--color--teal-600);
}

.wp-block-group.is-style-stat .ht-stat-label {
	margin-top: 10px;
	color: var(--wp--preset--color--slate-600);
	font-size: 15px;
}

.wp-block-group.is-style-callout {
	padding: 28px 32px;
	border-radius: var(--ht-radius-lg);
	background: var(--wp--preset--color--navy-50);
	border-left: 4px solid var(--wp--preset--color--teal-500);
}

/* ------------------------------------------------------------------ */
/* Étapes de la méthode                                                */
/* ------------------------------------------------------------------ */

.ht-steps {
	counter-reset: ht-step;
}

.ht-step {
	position: relative;
	padding-top: 56px;
	counter-increment: ht-step;
}

.ht-step::before {
	content: counter(ht-step);
	position: absolute;
	top: 0;
	left: 0;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: var(--ht-navy);
	color: #fff;
	font: 500 18px/40px var(--wp--preset--font-family--heading);
	text-align: center;
}

.ht-step::after {
	content: "";
	position: absolute;
	top: 19px;
	left: 52px;
	right: -20px;
	height: 2px;
	background: var(--wp--preset--color--slate-200);
}

.ht-step:nth-child(3n)::after,
.ht-step:last-child::after {
	display: none;
}

.ht-step p {
	color: var(--wp--preset--color--slate-600);
	font-size: 16px;
}

.ht-step h3,
.ht-step h4 {
	margin-bottom: 8px;
}

@media (max-width: 1024px) {
	.ht-step::after {
		display: none;
	}
}

/* Version détaillée : liste verticale reliée par un trait. */
.ht-steps--detailed .ht-step {
	padding-top: 0;
	padding-left: 72px;
	padding-bottom: 8px;
}

.ht-steps--detailed .ht-step::before {
	width: 48px;
	height: 48px;
	line-height: 48px;
	font-size: 20px;
}

.ht-steps--detailed .ht-step::after {
	display: block;
	top: 60px;
	left: 23px;
	right: auto;
	bottom: -28px;
	width: 2px;
	height: auto;
}

.ht-steps--detailed .ht-step:last-child::after {
	display: none;
}

/* ------------------------------------------------------------------ */
/* Listes                                                              */
/* ------------------------------------------------------------------ */

.wp-block-list.is-style-checklist {
	list-style: none;
	padding-left: 0;
}

.wp-block-list.is-style-checklist li {
	position: relative;
	padding-left: 34px;
}

.wp-block-list.is-style-checklist li + li {
	margin-top: 12px;
}

.wp-block-list.is-style-checklist li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.2em;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background: var(--wp--preset--color--teal-50) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230F766E' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12 4 4 8-8'/%3E%3C/svg%3E") center / 14px no-repeat;
}

.has-navy-900-background-color .wp-block-list.is-style-checklist li::before {
	background-color: var(--wp--preset--color--navy-800);
}

/* ------------------------------------------------------------------ */
/* Bandeau d'appel à l'action                                          */
/* ------------------------------------------------------------------ */

.wp-block-group.is-style-cta {
	position: relative;
	overflow: hidden;
	isolation: isolate;
	border-radius: var(--ht-radius-xl);
	background: var(--ht-navy);
	color: var(--wp--preset--color--navy-200);
	padding: clamp(32px, 5vw, 56px);
	gap: 32px;
}

.wp-block-group.is-style-cta::before {
	right: 0;
	bottom: 0;
	width: 360px;
	height: 200px;
	opacity: 0.5;
	background-position: right bottom;
}

.wp-block-group.is-style-cta :is(h2, h3) {
	color: #fff;
	margin: 0 0 8px;
}

.wp-block-group.is-style-cta p {
	color: var(--wp--preset--color--navy-200);
}

@media (max-width: 781px) {
	.wp-block-group.is-style-cta {
		flex-direction: column;
		align-items: flex-start !important;
	}
}

/* ------------------------------------------------------------------ */
/* Pied de page                                                        */
/* ------------------------------------------------------------------ */

.ht-footer {
	font-size: 15px;
	color: var(--wp--preset--color--navy-300);
}

.ht-footer p {
	color: var(--wp--preset--color--navy-300);
}

.ht-footer h2 {
	color: #fff;
	font-family: var(--wp--preset--font-family--body);
	font-size: 15px;
	font-weight: 600;
	letter-spacing: 0;
	margin-bottom: 14px;
}

.ht-footer .ht-footer__links {
	list-style: none;
	padding: 0;
	margin: 0;
}

.ht-footer .ht-footer__links li + li {
	margin-top: 8px;
}

.ht-footer a {
	color: var(--wp--preset--color--navy-200);
	text-decoration: none;
}

.ht-footer a:hover {
	color: var(--wp--preset--color--teal-400);
}

.ht-footer__bottom {
	border-top: 1px solid var(--wp--preset--color--navy-800);
	font-size: 13px;
}

.ht-footer__bottom .ht-footer__links {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 20px;
}

.ht-footer__bottom .ht-footer__links li + li {
	margin-top: 0;
}

/* ------------------------------------------------------------------ */
/* Formulaires (Contact Form 7)                                        */
/* ------------------------------------------------------------------ */

.wpcf7-form .ht-field {
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin: 0 0 18px;
}

.wpcf7-form .ht-field-row {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0 20px;
}

@media (max-width: 640px) {
	.wpcf7-form .ht-field-row {
		grid-template-columns: 1fr;
	}
}

.wpcf7-form label {
	font-size: 14px;
	font-weight: 600;
	color: var(--ht-navy);
}

.wpcf7-form .ht-optional {
	font-weight: 400;
	color: var(--wp--preset--color--slate-500);
}

.wpcf7-form :is(input[type="text"], input[type="email"], input[type="tel"], input[type="url"], select, textarea) {
	width: 100%;
	font: 400 16px/1.4 var(--wp--preset--font-family--body);
	color: var(--wp--preset--color--slate-800);
	padding: 12px 14px;
	border: 1.5px solid var(--wp--preset--color--slate-300);
	border-radius: var(--ht-radius-md);
	background: #fff;
	transition: border-color var(--ht-fast), box-shadow var(--ht-fast);
}

.wpcf7-form :is(input, select, textarea)::placeholder {
	color: var(--wp--preset--color--slate-400);
}

.wpcf7-form :is(input, select, textarea):hover {
	border-color: var(--wp--preset--color--slate-400);
}

.wpcf7-form :is(input, select, textarea):focus {
	outline: none;
	border-color: var(--wp--preset--color--teal-700);
	box-shadow: 0 0 0 3px var(--wp--preset--color--teal-100);
}

.wpcf7-form textarea {
	min-height: 140px;
	resize: vertical;
}

.wpcf7-form .wpcf7-not-valid {
	border-color: var(--wp--preset--color--error) !important;
}

.wpcf7-not-valid-tip {
	font-size: 13px;
	font-weight: 500;
	color: var(--wp--preset--color--error);
	margin-top: 4px;
}

.wpcf7-form .wpcf7-acceptance label {
	display: flex;
	gap: 10px;
	align-items: flex-start;
	font-size: 15px;
	font-weight: 400;
	color: var(--wp--preset--color--slate-700);
}

.wpcf7-form .wpcf7-list-item {
	margin: 0;
}

.wpcf7-form input[type="checkbox"] {
	width: 18px;
	height: 18px;
	margin-top: 3px;
	accent-color: var(--wp--preset--color--teal-700);
}

.wpcf7-form .wpcf7-submit {
	margin-top: 8px;
	font: 600 16px/1 var(--wp--preset--font-family--body);
	padding: 14px 22px;
	border-radius: var(--ht-radius-md);
	border: 0;
	background: var(--wp--preset--color--teal-500);
	color: var(--ht-navy);
	cursor: pointer;
	transition: background-color var(--ht-fast) var(--ht-ease);
}

.wpcf7-form .wpcf7-submit:hover {
	background: var(--wp--preset--color--teal-400);
}

.wpcf7-form .wpcf7-submit:disabled {
	opacity: 0.45;
	cursor: not-allowed;
}

.wpcf7 form .wpcf7-response-output {
	margin: 20px 0 0;
	padding: 14px 16px;
	border-radius: var(--ht-radius-md);
	border: 1px solid var(--wp--preset--color--navy-200);
	background: var(--wp--preset--color--navy-50);
	color: var(--ht-navy);
	font-size: 15px;
}

.wpcf7 form.sent .wpcf7-response-output {
	background: #f0fdf4;
	border-color: #bbf7d0;
	color: #14532d;
}

.wpcf7 form:is(.invalid, .unaccepted, .failed, .spam, .aborted) .wpcf7-response-output {
	background: #fef2f2;
	border-color: #fecaca;
	color: #7f1d1d;
}

.wpcf7-spinner {
	vertical-align: middle;
}

/* ------------------------------------------------------------------ */
/* Contenu éditorial (pages simples, articles)                         */
/* ------------------------------------------------------------------ */

.ht-prose {
	max-width: var(--wp--custom--narrow);
}

.ht-prose :is(h2, h3) {
	margin-top: 2em;
}

/* ------------------------------------------------------------------ */
/* Apparition douce au défilement (désactivée si l'utilisateur le demande) */
/* ------------------------------------------------------------------ */

@media (prefers-reduced-motion: no-preference) {
	.js .ht-reveal > * > * {
		opacity: 0;
		transform: translateY(24px);
		transition:
			opacity 700ms var(--ht-ease),
			transform 700ms var(--ht-ease);
	}

	.js .ht-reveal.is-visible > * > * {
		opacity: 1;
		transform: none;
	}

	/* Cartes et étapes d'une grille : apparition en cascade. */
	.js .ht-reveal .is-layout-grid > * {
		opacity: 0;
		transform: translateY(28px) scale(0.98);
		transition:
			opacity 700ms var(--ht-ease),
			transform 700ms var(--ht-ease),
			box-shadow var(--ht-base) var(--ht-ease),
			border-color var(--ht-base) var(--ht-ease);
	}

	.js .ht-reveal.is-visible .is-layout-grid > * {
		opacity: 1;
		transform: none;
	}

	.js .ht-reveal.is-visible .is-layout-grid > :nth-child(2) { transition-delay: 90ms; }
	.js .ht-reveal.is-visible .is-layout-grid > :nth-child(3) { transition-delay: 180ms; }
	.js .ht-reveal.is-visible .is-layout-grid > :nth-child(4) { transition-delay: 270ms; }
	.js .ht-reveal.is-visible .is-layout-grid > :nth-child(5) { transition-delay: 360ms; }
	.js .ht-reveal.is-visible .is-layout-grid > :nth-child(6) { transition-delay: 450ms; }
	.js .ht-reveal.is-visible .is-layout-grid > :nth-child(7) { transition-delay: 540ms; }
	.js .ht-reveal.is-visible .is-layout-grid > :nth-child(8) { transition-delay: 630ms; }

	/* Une fois apparues, les cartes réagissent au survol sans délai. */
	.js .ht-reveal.is-done .is-layout-grid > * {
		transition-delay: 0ms !important;
	}

	/* Traits entre les étapes : ils se dessinent de gauche à droite. */
	.js .ht-reveal .ht-step::after {
		transform: scaleX(0);
		transform-origin: left;
		transition: transform 900ms var(--ht-ease);
	}

	.js .ht-reveal .ht-steps--detailed .ht-step::after {
		transform: scaleY(0);
		transform-origin: top;
	}

	.js .ht-reveal.is-visible .ht-step::after {
		transform: none;
	}

	.js .ht-reveal.is-visible .ht-step:nth-child(2)::after { transition-delay: 250ms; }
	.js .ht-reveal.is-visible .ht-step:nth-child(3)::after { transition-delay: 500ms; }
	.js .ht-reveal.is-visible .ht-step:nth-child(4)::after { transition-delay: 750ms; }
	.js .ht-reveal.is-visible .ht-step:nth-child(5)::after { transition-delay: 1000ms; }
}

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

/* ================================================================== */
/* Effets modernes : halos, dégradés, bandeau défilant, illustrations  */
/* ================================================================== */

/* Fonds bleu nuit lumineux : deux halos colorés et une trame de points estompée. */
.ht-dark-glow {
	position: relative;
	overflow: hidden;
	isolation: isolate;
	background-image:
		radial-gradient(600px 400px at 85% 20%, rgba(20, 184, 166, 0.28), transparent 70%),
		radial-gradient(700px 500px at 10% 110%, rgba(74, 119, 180, 0.35), transparent 70%),
		linear-gradient(180deg, #0F2747 0%, #0C1F3A 100%) !important;
	/* Sans répétition : sinon le bord d'un halo réapparaît en haut de la section. */
	background-repeat: no-repeat !important;
}

.ht-dark-glow::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	background-image: radial-gradient(rgba(255, 255, 255, 0.09) 1px, transparent 1.2px);
	background-size: 24px 24px;
	-webkit-mask-image: radial-gradient(ellipse 80% 70% at 70% 30%, #000 20%, transparent 75%);
	mask-image: radial-gradient(ellipse 80% 70% at 70% 30%, #000 20%, transparent 75%);
}

@media (prefers-reduced-motion: no-preference) {
	.ht-dark-glow {
		background-size: 140% 140%, 140% 140%, 100% 100%;
		animation: ht-aurora 18s ease-in-out infinite alternate;
	}
}

@keyframes ht-aurora {
	from { background-position: 0% 0%, 0% 0%, 0 0; }
	to { background-position: 30% 20%, -20% -10%, 0 0; }
}

.ht-page-hero.ht-dark-glow .is-style-lead {
	color: var(--wp--preset--color--navy-200);
}

.ht-page-hero__visual .ht-illu {
	max-width: 380px;
	margin-inline: auto;
}

/* Texte en dégradé turquoise. */
.ht-gradient-text {
	background: linear-gradient(95deg, #5EEAD4 0%, #2DD4BF 40%, #A3BCE0 100%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	-webkit-text-fill-color: transparent;
}

/* Badge « en direct » avec point pulsant. */
.ht-badge-live {
	background: rgba(45, 212, 191, 0.12);
	color: var(--wp--preset--color--teal-300, #5EEAD4);
	border: 1px solid rgba(45, 212, 191, 0.3);
	letter-spacing: 0.04em;
}

.has-navy-900-background-color .ht-badge-live {
	color: #5EEAD4;
}

.ht-badge-live::before {
	content: "";
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #2DD4BF;
	box-shadow: 0 0 0 0 rgba(45, 212, 191, 0.6);
	animation: ht-live 2s ease-out infinite;
}

@keyframes ht-live {
	0% { box-shadow: 0 0 0 0 rgba(45, 212, 191, 0.6); }
	80%, 100% { box-shadow: 0 0 0 10px rgba(45, 212, 191, 0); }
}

/* Hero : titre plus large, illustration à droite. */
.ht-hero h1 {
	max-width: 18ch;
}

.ht-hero__visual .ht-illu {
	max-width: 560px;
	margin-left: auto;
	filter: drop-shadow(0 30px 60px rgba(0, 0, 0, 0.35));
}

@media (max-width: 781px) {
	.ht-hero__visual .ht-illu {
		max-width: 420px;
		margin: 24px auto 0;
	}
}

/* Bouton avec reflet qui traverse au survol. */
.wp-block-button.ht-btn-shine .wp-block-button__link {
	position: relative;
	overflow: hidden;
	box-shadow: 0 10px 30px -10px rgba(20, 184, 166, 0.7);
}

.wp-block-button.ht-btn-shine .wp-block-button__link::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(110deg, transparent 30%, rgba(255, 255, 255, 0.45) 50%, transparent 70%);
	transform: translateX(-120%);
	transition: transform 700ms var(--ht-ease);
}

.wp-block-button.ht-btn-shine .wp-block-button__link:hover::before {
	transform: translateX(120%);
}

.wp-block-button__link:hover {
	transform: translateY(-1px);
}

/* Bandeau défilant des expertises. */
.ht-marquee {
	position: relative;
	overflow: hidden;
	background: #0C1F3A;
	border-top: 1px solid rgba(255, 255, 255, 0.08);
	border-bottom: 1px solid rgba(255, 255, 255, 0.08);
	padding: 18px 0;
	margin-top: 0 !important;
}

/* Fondu des bords vers le bleu nuit (et non vers le blanc de la page). */
.ht-marquee::before,
.ht-marquee::after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	width: 12%;
	z-index: 1;
	pointer-events: none;
}

.ht-marquee::before {
	left: 0;
	background: linear-gradient(90deg, #0C1F3A, transparent);
}

.ht-marquee::after {
	right: 0;
	background: linear-gradient(270deg, #0C1F3A, transparent);
}

.ht-marquee__track {
	display: flex;
	width: max-content;
	animation: ht-marquee 38s linear infinite;
}

.ht-marquee:hover .ht-marquee__track {
	animation-play-state: paused;
}

.ht-marquee ul {
	display: flex;
	gap: 48px;
	margin: 0;
	padding: 0 24px;
	list-style: none;
}

.ht-marquee li {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	white-space: nowrap;
	font-family: var(--wp--preset--font-family--heading);
	font-size: 18px;
	color: var(--wp--preset--color--navy-200);
}

.ht-marquee li svg {
	color: #2DD4BF;
}

@keyframes ht-marquee {
	to { transform: translateX(-50%); }
}

/* Cartes : halo qui suit la souris et bordure en dégradé au survol. */
.wp-block-group.is-style-card {
	overflow: hidden;
	isolation: isolate;
}

.wp-block-group.is-style-card::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	opacity: 0;
	transition: opacity var(--ht-base) var(--ht-ease);
	background: radial-gradient(360px circle at var(--mx, 50%) var(--my, 0%), rgba(20, 184, 166, 0.12), transparent 60%);
}

.wp-block-group.is-style-card:hover::before {
	opacity: 1;
}

.wp-block-group.is-style-card:hover {
	border-color: rgba(20, 184, 166, 0.45);
	box-shadow: var(--wp--preset--shadow--lg);
	transform: translateY(-4px);
}

.has-navy-900-background-color .wp-block-group.is-style-card::before {
	background: radial-gradient(360px circle at var(--mx, 50%) var(--my, 0%), rgba(45, 212, 191, 0.18), transparent 60%);
}

.has-navy-900-background-color .wp-block-group.is-style-card {
	background: rgba(255, 255, 255, 0.04);
	border-color: rgba(255, 255, 255, 0.1);
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
}

.has-navy-900-background-color .wp-block-group.is-style-card:hover {
	border-color: rgba(45, 212, 191, 0.5);
}

/* Pastilles d'icône en dégradé, qui s'animent au survol de la carte. */
.ht-icon--soft {
	background: linear-gradient(135deg, var(--wp--preset--color--teal-50), var(--wp--preset--color--teal-100));
	transition: transform var(--ht-base) var(--ht-ease), background var(--ht-base) var(--ht-ease), color var(--ht-base);
}

.ht-icon--dark {
	background: linear-gradient(135deg, rgba(45, 212, 191, 0.25), rgba(45, 212, 191, 0.05));
	border: 1px solid rgba(45, 212, 191, 0.3);
}

.is-style-card:hover .ht-icon {
	transform: translateY(-2px) rotate(-6deg) scale(1.06);
}

.is-style-card:hover .ht-icon--soft {
	background: linear-gradient(135deg, #14B8A6, #0F766E);
	color: #fff;
}

/* Trame de points discrète dans un coin des sections claires. */
.ht-deco-dots {
	position: relative;
	isolation: isolate;
}

.ht-deco-dots::before {
	content: "";
	position: absolute;
	top: 40px;
	right: 0;
	width: 280px;
	height: 280px;
	z-index: -1;
	background-image: radial-gradient(var(--wp--preset--color--navy-200) 1.2px, transparent 1.4px);
	background-size: 18px 18px;
	-webkit-mask-image: radial-gradient(circle at 70% 30%, #000, transparent 70%);
	mask-image: radial-gradient(circle at 70% 30%, #000, transparent 70%);
	opacity: 0.8;
}

/* Sections bleu très clair : halo turquoise doux. */
.has-navy-50-background-color.alignfull {
	background-image: radial-gradient(800px 400px at 100% 0%, rgba(20, 184, 166, 0.08), transparent 70%);
}

/* Bandeau d'appel à l'action : dégradé animé et halo. */
.wp-block-group.is-style-cta {
	background: linear-gradient(120deg, #0F2747 0%, #134E4A 50%, #1B365D 100%);
	background-size: 200% 200%;
	box-shadow: 0 30px 60px -30px rgba(15, 39, 71, 0.6);
}

.wp-block-group.is-style-cta::after {
	content: "";
	position: absolute;
	width: 420px;
	height: 420px;
	left: -120px;
	top: -220px;
	z-index: -1;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(45, 212, 191, 0.35), transparent 65%);
}

@media (prefers-reduced-motion: no-preference) {
	.wp-block-group.is-style-cta {
		animation: ht-gradient-shift 12s ease-in-out infinite alternate;
	}
}

@keyframes ht-gradient-shift {
	from { background-position: 0% 50%; }
	to { background-position: 100% 50%; }
}

/* Chiffres clés : barre de progression de lecture. */
.ht-progress {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	height: 3px;
	z-index: 1000;
	background: linear-gradient(90deg, #14B8A6, #5EEAD4, #F59E0B);
	transform-origin: left;
	transform: scaleX(var(--progress, 0));
	pointer-events: none;
}

.admin-bar .ht-progress {
	top: var(--wp-admin--admin-bar--height, 32px);
}

/* ------------------------------------------------------------------ */
/* Illustrations animées (SVG en ligne, classes a-*)                    */
/* ------------------------------------------------------------------ */

.ht-illu {
	line-height: 0;
}

.ht-illu svg {
	width: 100%;
	height: auto;
	overflow: visible;
}

@media (prefers-reduced-motion: no-preference) {
	.ht-illu .a-float {
		animation: ht-float 7s ease-in-out infinite;
		animation-delay: var(--float-delay, 0s);
	}

	.ht-illu .a-draw {
		stroke-dasharray: 1;
		stroke-dashoffset: 1;
		animation: ht-draw var(--dur, 1.8s) var(--ht-ease) forwards;
		animation-delay: var(--d, 0.2s);
	}

	.ht-illu .a-fade {
		opacity: 0;
		animation: ht-fade 1.2s ease forwards 1s;
	}

	.ht-illu .a-grow {
		transform-box: fill-box;
		transform-origin: bottom;
		transform: scaleY(0);
		animation: ht-grow 900ms var(--ht-ease) forwards;
		animation-delay: var(--d, 0s);
	}

	.ht-illu .a-grow-x {
		transform-box: fill-box;
		transform-origin: left;
		transform: scaleX(0);
		animation: ht-grow-x 1.4s var(--ht-ease) forwards;
		animation-delay: var(--d, 0s);
	}

	.ht-illu .a-pop {
		transform-box: fill-box;
		transform-origin: center;
		opacity: 0;
		transform: scale(0.6);
		animation: ht-pop 600ms cubic-bezier(.34, 1.56, .64, 1) forwards;
		animation-delay: var(--d, 0s);
	}

	.ht-illu .a-pulse {
		transform-box: fill-box;
		transform-origin: center;
		animation: ht-pulse 2.4s ease-out infinite;
		animation-delay: var(--d, 0s);
	}

	.ht-illu .a-flow {
		stroke-dasharray: 6 8;
		animation: ht-flow 1.2s linear infinite;
	}

	.ht-illu .a-travel {
		offset-rotate: 0deg;
		animation: ht-travel var(--dur, 3s) ease-in-out infinite;
	}

	.ht-illu .a-spin {
		transform-box: fill-box;
		transform-origin: center;
		animation: ht-spin 12s linear infinite;
	}

	.ht-illu .a-orbit {
		animation: ht-spin 60s linear infinite;
	}

	.ht-illu .a-blink {
		animation: ht-blink 1.2s ease-in-out infinite;
		animation-delay: var(--d, 0s);
	}

	/* Hors écran, les animations attendent que l'illustration soit visible. */
	.js .ht-illu:not(.is-visible) * {
		animation-play-state: paused !important;
	}
}

@keyframes ht-float {
	0%, 100% { transform: translateY(0); }
	50% { transform: translateY(-10px); }
}

@keyframes ht-draw {
	to { stroke-dashoffset: 0; }
}

@keyframes ht-fade {
	to { opacity: 1; }
}

@keyframes ht-grow {
	to { transform: scaleY(1); }
}

@keyframes ht-grow-x {
	to { transform: scaleX(1); }
}

@keyframes ht-pop {
	to { opacity: 1; transform: scale(1); }
}

@keyframes ht-pulse {
	0% { transform: scale(1); opacity: 0.8; }
	100% { transform: scale(1.8); opacity: 0; }
}

@keyframes ht-flow {
	to { stroke-dashoffset: -28; }
}

@keyframes ht-travel {
	from { offset-distance: 0%; }
	to { offset-distance: 100%; }
}

@keyframes ht-spin {
	to { transform: rotate(360deg); }
}

@keyframes ht-blink {
	0%, 100% { opacity: 0.3; }
	50% { opacity: 1; }
}

/* Formulaire : les champs gardent leur largeur dans leur colonne. */
.wpcf7-form *,
.wpcf7-form *::before,
.wpcf7-form *::after {
	box-sizing: border-box;
}

.wpcf7-form .wpcf7-form-control-wrap {
	display: block;
}

/* ------------------------------------------------------------------ */
/* Menu mobile plein écran                                             */
/* ------------------------------------------------------------------ */

/*
 * Un parent avec backdrop-filter devient le repère des éléments en position fixe :
 * le menu ouvert serait enfermé dans la hauteur de l'en-tête (et défilerait). On retire le flou pendant l'ouverture.
 */
.ht-header:has(.wp-block-navigation__responsive-container.is-menu-open) {
	-webkit-backdrop-filter: none;
	backdrop-filter: none;
	background: #fff;
}

.ht-header .wp-block-navigation__responsive-container.is-menu-open {
	position: fixed;
	inset: 0;
	height: 100dvh;
	overflow: hidden;
	background: #fff !important;
	animation: ht-menu-in 250ms var(--ht-ease);
}

.admin-bar .ht-header .wp-block-navigation__responsive-container.is-menu-open {
	top: var(--wp-admin--admin-bar--height, 46px);
	height: calc(100dvh - var(--wp-admin--admin-bar--height, 46px));
}

.ht-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
	font-family: var(--wp--preset--font-family--heading);
	font-size: 28px;
	font-weight: 500;
	color: var(--ht-navy);
	padding: 6px 0;
}

.ht-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content[aria-current="page"] {
	box-shadow: none;
	color: var(--wp--preset--color--teal-700);
}

.ht-header .wp-block-navigation__responsive-container-open,
.ht-header .wp-block-navigation__responsive-container-close {
	width: 44px;
	height: 44px;
	align-items: center;
	justify-content: center;
	border-radius: var(--ht-radius-md);
	color: var(--ht-navy);
}

.ht-header .wp-block-navigation__responsive-container-close {
	top: 16px;
	right: 12px;
}

.ht-header .wp-block-navigation__responsive-container-open:hover,
.ht-header .wp-block-navigation__responsive-container-close:hover {
	background: var(--wp--preset--color--navy-50);
}

@keyframes ht-menu-in {
	from { opacity: 0; transform: translateY(-8px); }
	to { opacity: 1; transform: none; }
}

.ht-header .is-menu-open .wp-block-navigation__responsive-container-content,
.ht-header .is-menu-open .wp-block-navigation__container {
	align-items: flex-start !important;
	justify-content: flex-start !important;
	width: 100%;
}

.ht-header .is-menu-open .wp-block-navigation__responsive-container-content {
	padding-top: 72px !important;
}

.ht-header .is-menu-open .wp-block-navigation__container {
	gap: 12px;
}

.ht-header .is-menu-open .wp-block-navigation-item {
	width: 100%;
	border-bottom: 1px solid var(--wp--preset--color--slate-200);
	padding-bottom: 12px;
}

.ht-header .is-menu-open .wp-block-navigation__container {
	gap: 0 !important;
}

.ht-header .is-menu-open .wp-block-navigation-item {
	display: flex;
	justify-content: flex-start !important;
	align-items: flex-start !important;
	padding: 14px 0;
}

.ht-header .is-menu-open .wp-block-navigation-item__content {
	text-align: left;
	width: 100%;
}

/* Sélecteur de devise (haytech/currency-switcher) et prix convertibles (haytech/price). */
.ht-currency {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px 16px;
	margin-top: var(--wp--preset--spacing--6);
}

.ht-currency__switch {
	display: inline-flex;
	padding: 4px;
	gap: 4px;
	background: var(--wp--preset--color--navy-50);
	border: 1px solid var(--wp--preset--color--slate-200);
	border-radius: 999px;
}

.ht-currency__btn {
	min-width: 48px;
	padding: 8px 16px;
	border: 0;
	border-radius: 999px;
	background: transparent;
	color: var(--wp--preset--color--slate-700);
	font-family: var(--wp--preset--font-family--heading);
	font-size: 15px;
	font-weight: 600;
	cursor: pointer;
	transition: background-color var(--ht-fast) var(--ht-ease), color var(--ht-fast) var(--ht-ease), box-shadow var(--ht-fast) var(--ht-ease);
}

.ht-currency__btn:hover {
	color: var(--ht-navy);
}

.ht-currency__btn.is-active {
	background: var(--wp--preset--color--teal-500);
	color: var(--ht-navy);
	box-shadow: var(--wp--preset--shadow--sm);
}

.ht-currency__btn:focus-visible {
	outline: var(--wp--custom--focus-ring, 2px solid var(--wp--preset--color--teal-500));
	outline-offset: 2px;
}

.ht-currency__note {
	margin: 0;
	font-size: 14px;
	color: var(--wp--preset--color--slate-500);
}

.ht-price {
	font-variant-numeric: tabular-nums;
}

.ht-price-line {
	align-items: baseline;
}

.ht-price-line > p {
	margin: 0;
}

.ht-price--large .ht-price__amount {
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--heading-3, 28px);
	font-weight: 600;
	color: var(--ht-navy);
}

.ht-price--large .ht-price__suffix {
	margin-left: 4px;
	color: var(--wp--preset--color--slate-500);
}

/* Sous-menu de l'en-tête (« Nos produits ») : carte déroulante au survol / clic, pile simple dans le menu mobile. */
.ht-header .wp-block-navigation-submenu__toggle {
	color: var(--wp--preset--color--slate-700);
}

.ht-header .wp-block-navigation-item.has-child:hover > .wp-block-navigation-item__content,
.ht-header .wp-block-navigation-item.has-child:hover > .wp-block-navigation-submenu__toggle {
	color: var(--ht-navy);
}

.ht-header .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__submenu-container {
	min-width: 240px !important;
	padding: 8px !important;
	margin-top: 10px;
	background: #fff !important;
	border: 1px solid var(--wp--preset--color--slate-200) !important;
	border-radius: var(--ht-radius-lg);
	box-shadow: var(--wp--preset--shadow--md, 0 12px 32px rgba(15, 39, 71, .12));
}

/* Pont invisible entre le lien et la carte, pour ne pas perdre le survol. */
.ht-header .wp-block-navigation__responsive-container:not(.is-menu-open) .wp-block-navigation__submenu-container::before {
	content: "";
	position: absolute;
	inset: -12px 0 auto 0;
	height: 12px;
}

.ht-header .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	display: block;
	padding: 10px 14px !important;
	border-radius: var(--ht-radius-md);
	white-space: nowrap;
}

.ht-header .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover,
.ht-header .wp-block-navigation__submenu-container .wp-block-navigation-item__content[aria-current="page"] {
	background: var(--wp--preset--color--navy-50);
	color: var(--ht-navy);
	box-shadow: none;
}

.ht-header .is-menu-open .wp-block-navigation-item.has-child {
	flex-direction: column;
}

.ht-header .is-menu-open .wp-block-navigation__submenu-container {
	padding: 4px 0 0 16px !important;
	gap: 0 !important;
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
}

.ht-header .is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item {
	border-bottom: 0;
	padding: 4px 0;
}

.ht-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	background: transparent;
	font-size: 20px;
	color: var(--wp--preset--color--slate-700);
	padding: 4px 0 !important;
}

/* ================================================================== */
/* Responsive : tablette et petits écrans                              */
/* Points de rupture du design système : 640 / 1024 / 1280 px.         */
/* ================================================================== */

/*
 * Menu ☰ jusqu'à 1023 px (WordPress ne le propose que sous 600 px) :
 * le menu complet ne tient pas à côté du logo et du bouton sur une tablette.
 */
@media (max-width: 1023px) {
	.ht-header .wp-block-navigation__responsive-container-open {
		display: flex !important;
	}

	.ht-header .wp-block-navigation__responsive-container:not(.is-menu-open) {
		display: none !important;
	}

	.ht-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
		display: flex !important;
	}

	/* Ordre : logo … bouton d'action, puis ☰ tout à droite. */
	.ht-header__inner {
		gap: 12px;
	}

	.ht-header .ht-header__cta {
		margin-left: auto;
	}

	.ht-header .wp-block-navigation {
		order: 3;
		margin-left: 0;
	}
}

@media (max-width: 599px) {
	.ht-header .wp-block-navigation {
		margin-left: auto;
	}
}

/* Grilles de cartes : nombre de colonnes maîtrisé (pas de carte orpheline). */
.is-layout-grid.ht-cols-4 {
	grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}

.is-layout-grid.ht-cols-3 {
	grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

.is-layout-grid.ht-cols-2 {
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

@media (max-width: 1099px) {
	.is-layout-grid.ht-cols-4 {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}
}

@media (max-width: 1023px) {
	.is-layout-grid.ht-cols-3 {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}
}

@media (max-width: 781px) {
	.is-layout-grid.ht-cols-2 {
		grid-template-columns: 1fr !important;
	}
}

@media (max-width: 639px) {
	.is-layout-grid.ht-cols-4,
	.is-layout-grid.ht-cols-3 {
		grid-template-columns: 1fr !important;
	}
}

/* Étapes sur 2 colonnes : trait uniquement entre la 1re et la 2e de chaque ligne. */
@media (min-width: 640px) and (max-width: 1023px) {
	.ht-steps:not(.ht-steps--detailed) .ht-step::after {
		display: block;
	}

	.ht-steps:not(.ht-steps--detailed) .ht-step:nth-child(2n)::after {
		display: none;
	}
}

/* Hero : texte et illustration empilés sous 1100 px, pour garder un titre lisible. */
@media (max-width: 1099px) {
	.ht-hero__cols {
		flex-wrap: wrap !important;
	}

	.ht-hero__cols > .wp-block-column {
		flex-basis: 100% !important;
	}

	.ht-hero__visual .ht-illu {
		max-width: 480px;
		margin: 16px auto 0;
	}
}

/* Colonnes empilées : les illustrations gardent une taille raisonnable. */
@media (max-width: 781px) {
	.wp-block-column .ht-illu {
		max-width: 420px;
		margin-inline: auto;
	}

	.ht-page-hero__visual .ht-illu {
		max-width: 300px;
	}

	.ht-trust {
		gap: 20px 32px;
	}
}

/* Méthode détaillée : l'encadré n'est plus collant quand les colonnes sont empilées. */
@media (max-width: 781px) {
	.is-style-callout {
		position: static !important;
	}
}
