/* ==========================================================================
   SEM HABITAT DURABLE — En-tête et pied de page du site
   --------------------------------------------------------------------------
   Chargé sur toutes les pages (inc/entete.php).
   Tous les sélecteurs passent par #semhd-entete, #semhd-pied ou #semhd-haut :
   les styles du thème parent et d'Elementor ne peuvent pas les modifier,
   et ces styles ne débordent pas sur le reste de la page.
   ========================================================================== */

/* Police Inter Tight, hébergée dans le thème (licence OFL : assets/fonts) */
@font-face {
	font-family: "Inter Tight";
	font-style: normal;
	font-display: swap;
	font-weight: 100 900;
	src: url(../fonts/inter-tight-latin-wght-normal.woff2) format("woff2-variations"), url(../fonts/inter-tight-latin-wght-normal.woff2) format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: "Inter Tight";
	font-style: normal;
	font-display: swap;
	font-weight: 100 900;
	src: url(../fonts/inter-tight-latin-ext-wght-normal.woff2) format("woff2-variations"), url(../fonts/inter-tight-latin-ext-wght-normal.woff2) format("woff2");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* --------------------------------------------------------------------------
   1. Jetons et remise à zéro
   -------------------------------------------------------------------------- */
#semhd-entete, #semhd-pied, #semhd-haut, .semhd-evitement {
	--rouge: #F7524A;
	--aubergine: #40295D;
	--aubergine-ink: #2B1B40;
	--creme: #FCFCF5;
	--lilas: #E9E3EF;
	--lilas-moyen: #C9BFD3;
	--blanc: #FFFFFF;
	--police: "Inter Tight", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}
#semhd-entete, #semhd-entete *, #semhd-entete *::before, #semhd-entete *::after,
#semhd-pied, #semhd-pied *, #semhd-pied *::before, #semhd-pied *::after {
	box-sizing: border-box;
}
#semhd-entete, #semhd-pied {
	font-family: var(--police);
	font-size: 16px;
	font-weight: 400;
	line-height: 1.5;
	letter-spacing: normal;
	text-transform: none;
	-webkit-font-smoothing: antialiased;
}
#semhd-entete a, #semhd-pied a, #semhd-entete a:hover, #semhd-pied a:hover, #semhd-entete a:focus, #semhd-pied a:focus {
	box-shadow: none;
	text-shadow: none;
	border-bottom: 0;
}
#semhd-entete ul, #semhd-pied ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
#semhd-entete li, #semhd-pied li {
	margin: 0;
	padding: 0;
	list-style: none;
}
#semhd-entete li::before, #semhd-pied li::before {
	content: none;
}
#semhd-entete img, #semhd-pied img {
	max-width: none;
	border: 0;
	box-shadow: none;
}
#semhd-entete svg, #semhd-pied svg, #semhd-haut svg {
	display: inline-block;
	vertical-align: middle;
	fill: none;
}
#semhd-entete button, #semhd-haut {
	font-family: var(--police);
	letter-spacing: normal;
	text-transform: none;
	text-shadow: none;
	box-shadow: none;
	margin: 0;
	line-height: 1;
}
#semhd-entete :focus-visible, #semhd-pied :focus-visible, #semhd-haut:focus-visible {
	outline: 3px solid var(--creme);
	outline-offset: 2px;
	border-radius: 6px;
}
#semhd-entete .nav__menu :focus-visible, #semhd-entete .burger__panel :focus-visible {
	outline-color: var(--aubergine);
}
#semhd-entete .wrap, #semhd-pied .wrap {
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 24px;
}
.semhd-sprite {
	position: absolute;
	width: 0;
	height: 0;
	overflow: hidden;
}

/* Lien d'évitement (visible au clavier uniquement) */
.semhd-evitement {
	position: absolute;
	left: 12px;
	top: -100px;
	z-index: 100;
	padding: 12px 18px;
	border-radius: 10px;
	background: var(--aubergine);
	color: var(--creme);
	font: 600 15px/1 var(--police);
	text-decoration: none;
}
.semhd-evitement:focus {
	top: 12px;
	color: var(--creme);
}
#semhd-contenu {
	outline: none;
}

/* Page sans marge autour de l'en-tête */
body {
	margin: 0;
}

/* Zone d'encoche des iPhone (vide sur ordinateur) */
body::before {
	content: "";
	position: fixed;
	inset: 0 0 auto;
	height: env(safe-area-inset-top, 0px);
	z-index: 60;
	background: #F7524A;
	pointer-events: none;
}

/* --------------------------------------------------------------------------
   2. En-tête
   -------------------------------------------------------------------------- */
#semhd-entete {
	position: sticky;
	top: env(safe-area-inset-top, 0px);
	z-index: 50;
	margin: 0;
	background: var(--rouge);
	color: var(--blanc);
}
body.admin-bar #semhd-entete {
	top: 32px;
}
@media (max-width: 782px) {
	body.admin-bar #semhd-entete { top: 46px; }
}
@media (max-width: 600px) {
	body.admin-bar #semhd-entete { top: 0; }
}
#semhd-entete .header__in {
	display: flex;
	align-items: center;
	gap: 12px;
	min-height: 92px;
	max-width: 1200px;
}
#semhd-entete .logo {
	flex: none;
	display: block;
	line-height: 0;
}
#semhd-entete .logo img {
	height: 56px;
	width: auto;
}
#semhd-entete .nav {
	display: flex;
	align-items: center;
	gap: 4px;
	margin: 0 0 0 auto;
	padding: 0;
	list-style: none;
}
#semhd-entete .nav__item {
	position: relative;
}
#semhd-entete .nav__btn, #semhd-entete .nav__lien {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font: 500 16px/1 var(--police);
	color: var(--blanc);
	background: none;
	border: 0;
	padding: 14px 6px;
	cursor: pointer;
	text-decoration: none;
	white-space: nowrap;
	border-radius: 10px;
}
#semhd-entete .nav__btn svg {
	flex: none;
	width: 18px;
	height: 18px;
	transition: transform .2s;
}
#semhd-entete .nav__btn:hover, #semhd-entete .nav__lien:hover,
#semhd-entete .nav__btn:focus, #semhd-entete .nav__lien:focus {
	background: rgba(255, 255, 255, .14);
	color: var(--blanc);
}
#semhd-entete .nav__menu {
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	padding-top: 10px;
	min-width: 280px;
	z-index: 10;
}
#semhd-entete .nav__menu-in {
	background: var(--creme);
	color: var(--aubergine);
	border-radius: 16px;
	padding: 10px;
	box-shadow: 0 18px 40px rgba(43, 27, 64, .22);
	display: grid;
	gap: 2px;
}
#semhd-entete .nav__menu a {
	display: block;
	padding: 11px 12px;
	border-radius: 10px;
	text-decoration: none;
	font-weight: 500;
	font-size: 16px;
	color: var(--aubergine);
}
#semhd-entete .nav__menu a:hover {
	background: var(--lilas);
	color: var(--aubergine);
}
#semhd-entete .nav__item:hover .nav__menu,
#semhd-entete .nav__item:focus-within .nav__menu,
#semhd-entete .nav__btn[aria-expanded="true"] + .nav__menu {
	display: block;
}
#semhd-entete .nav__item:hover .nav__btn svg,
#semhd-entete .nav__btn[aria-expanded="true"] svg {
	transform: rotate(180deg);
}
#semhd-entete .nav__sep {
	width: 1px;
	height: 42px;
	background: rgba(255, 255, 255, .75);
	margin: 0 4px;
	flex: none;
}
#semhd-entete .header__contact {
	color: var(--blanc);
	font: 500 16px/1 var(--police);
	text-decoration: none;
	padding: 14px 8px;
	white-space: nowrap;
	border-radius: 10px;
}
#semhd-entete .header__contact:hover, #semhd-entete .header__contact:focus {
	background: rgba(255, 255, 255, .14);
	color: var(--blanc);
	text-decoration: none;
}
#semhd-entete .header__cta {
	flex: none;
	background: var(--creme);
	color: var(--aubergine);
	font: 500 16px/1 var(--police);
	padding: 14px 20px;
	border-radius: 999px;
	text-decoration: none;
	white-space: nowrap;
}
#semhd-entete .header__cta:hover, #semhd-entete .header__cta:focus {
	background: var(--aubergine);
	color: var(--creme);
}

/* Menu mobile */
#semhd-entete .burger {
	display: none;
	margin-left: auto;
}
#semhd-entete .burger summary {
	list-style: none;
	cursor: pointer;
	min-height: 44px;
	min-width: 44px;
	display: grid;
	place-items: center;
	border-radius: 12px;
	color: var(--blanc);
}
#semhd-entete .burger summary::-webkit-details-marker {
	display: none;
}
#semhd-entete .burger summary::marker {
	content: "";
}
#semhd-entete .burger__panel {
	position: absolute;
	left: 0;
	right: 0;
	top: 100%;
	background: var(--creme);
	color: var(--aubergine);
	padding: 8px 24px 24px;
	display: grid;
	max-height: calc(100vh - 100px);
	overflow: auto;
	box-shadow: 0 18px 30px rgba(43, 27, 64, .2);
}
#semhd-entete .burger__panel details {
	border-bottom: 1px solid var(--lilas);
}
#semhd-entete .burger__panel summary {
	color: var(--aubergine);
	font-weight: 700;
	padding: 16px 0;
	display: flex;
	justify-content: space-between;
	align-items: center;
	min-height: 0;
	place-items: initial;
}
#semhd-entete .burger__panel summary svg {
	flex: none;
}
#semhd-entete .burger__panel details a {
	display: block;
	padding: 10px 0 10px 12px;
	text-decoration: none;
	color: var(--aubergine);
}
#semhd-entete .burger__panel > a {
	padding: 16px 0;
	font-weight: 700;
	text-decoration: none;
	color: var(--aubergine);
	border-bottom: 1px solid var(--lilas);
}
#semhd-entete .burger__panel .btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-top: 16px;
	min-height: 48px;
	padding: 12px 22px;
	border-radius: 999px;
	border-bottom: 0;
	font: 700 16px/1.2 var(--police);
	background: var(--rouge);
	color: var(--creme);
	text-decoration: none;
}

/* Barre de progression de lecture */
#semhd-entete .header__prog {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 4px;
	pointer-events: none;
}
#semhd-entete .header__prog::before {
	content: "";
	position: absolute;
	inset: 0;
	background: var(--creme);
	transform: scaleX(var(--prog, 0));
	transform-origin: left;
	will-change: transform;
}

@media (max-width: 1400px) and (min-width: 1241px) {
	#semhd-entete .header__in { gap: 8px; }
	#semhd-entete .logo img { height: 50px; }
	#semhd-entete .nav__btn, #semhd-entete .nav__lien { font-size: 15px; padding: 12px 5px; gap: 2px; }
	#semhd-entete .nav__sep { margin: 0 2px; }
	#semhd-entete .header__contact { font-size: 15px; padding: 12px 5px; }
	#semhd-entete .header__cta { font-size: 15px; padding: 12px 16px; }
}
@media (max-width: 1200px) {
	#semhd-entete .nav, #semhd-entete .nav__sep, #semhd-entete .header__contact, #semhd-entete .header__cta { display: none; }
	#semhd-entete .burger { display: block; }
	#semhd-entete .header__in { min-height: 76px; }
	#semhd-entete .logo img { height: 46px; }
}

/* --------------------------------------------------------------------------
   3. Pied de page
   -------------------------------------------------------------------------- */
#semhd-pied {
	background: var(--aubergine);
	color: var(--creme);
	margin: 0;
	padding: 64px 0 32px;
	font-size: 16px;
}
#semhd-pied .footer__grid {
	display: grid;
	grid-template-columns: 1.4fr 1fr 1fr 1fr;
	gap: 40px;
}
#semhd-pied .footer__logo {
	display: inline-block;
	line-height: 0;
}
#semhd-pied .footer__logo img {
	height: 64px;
	width: auto;
}
#semhd-pied h3 {
	margin: 0 0 16px;
	padding: 0;
	font: 700 17px/1.3 var(--police);
	letter-spacing: normal;
	text-transform: none;
	color: var(--creme);
}
#semhd-pied ul {
	display: grid;
	gap: 10px;
}
#semhd-pied a {
	text-decoration: none;
	color: var(--creme);
}
#semhd-pied a:hover {
	text-decoration: underline;
	color: var(--creme);
}
#semhd-pied .footer__contact {
	margin-top: 20px;
	display: grid;
	gap: 6px;
	font-size: 15px;
}
#semhd-pied .footer__contact b {
	font-weight: 600;
	color: var(--lilas-moyen);
	font-size: 13px;
}
#semhd-pied .reseaux {
	display: flex;
	gap: 10px;
	margin-top: 14px;
}
#semhd-pied .reseaux a {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: rgba(252, 252, 245, .12);
	display: grid;
	place-items: center;
	text-decoration: none;
}
#semhd-pied .reseaux a:hover {
	background: var(--rouge);
}
#semhd-pied .footer__bas {
	margin-top: 48px;
	padding-top: 24px;
	border-top: 1px solid rgba(233, 227, 239, .22);
	display: flex;
	justify-content: space-between;
	gap: 16px;
	flex-wrap: wrap;
	font-size: 14px;
	color: var(--lilas);
}
#semhd-pied .footer__legal {
	display: flex;
	gap: 20px;
	flex-wrap: wrap;
}
@media (max-width: 1060px) {
	#semhd-pied .footer__grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 720px) {
	#semhd-pied .footer__grid { grid-template-columns: 1fr; }
}

/* --------------------------------------------------------------------------
   4. Bouton « Remonter en haut » (mobile)
   -------------------------------------------------------------------------- */
#semhd-haut {
	display: none;
}
@media (max-width: 720px) {
	#semhd-haut {
		display: grid;
		place-items: center;
		position: fixed;
		right: 16px;
		bottom: calc(16px + env(safe-area-inset-bottom, 0px));
		z-index: 55;
		width: 46px;
		height: 46px;
		padding: 0;
		border-radius: 50%;
		border: 0;
		background: var(--aubergine);
		color: var(--creme);
		box-shadow: 0 8px 20px rgba(43, 27, 64, .3);
		cursor: pointer;
		opacity: 0;
		transform: translateY(12px);
		pointer-events: none;
		transition: opacity .25s, transform .25s;
	}
	#semhd-haut.haut--vu {
		opacity: 1;
		transform: none;
		pointer-events: auto;
	}
	#semhd-haut:hover, #semhd-haut:active {
		background: var(--rouge);
		color: var(--creme);
	}
}

@media (prefers-reduced-motion: reduce) {
	#semhd-entete *, #semhd-haut {
		transition: none !important;
	}
}
