/*
 * Muzard — Confidentialité & cookies : bandeau, préférences, fenêtre contextuelle.
 *
 * Habillage « atelier », version sombre : le bandeau est une plaquette de noyer, taillée comme celles que l'entreprise façonne pour les
 * manches de couteaux : matière veinée, deux goupilles de laiton, filet de laiton incrusté, poinçon d'atelier. Le fond est le marron foncé
 * du site (--mz-walnut, celui de --mz-bg dans les sections sombres), le texte la crème du thème, l'accent la braise. Boutons crème à coin
 * biseauté « lame ». Titres en Fraunces avec un mot en italique braise, étiquettes en DM Mono. Les jetons --mz-* du thème sont utilisés
 * s'ils existent, sinon les valeurs de repli. Seule la matière est une image (assets/horn.webp, 8 Ko, chargée uniquement quand le bandeau
 * s'affiche) ; goupilles, filets, arêtes et poinçon sont dessinés en CSS / SVG, sans requête de plus.
 * Choix par finalité : deux boutons radio « Refusé / Autorisé » dans une glissière creusée dans le bois (fenêtre des préférences).
 * Règle CNIL : « tout refuser » et « tout accepter » partagent exactement le même format (taille, police, couleurs, survol).
 */

.mzc,
.mzc-embed {
	/* couleurs du thème (valeurs de repli = celles de theme.json) */
	--mzc-ink: var(--mz-ink, #17120e);
	--mzc-walnut: var(--mz-walnut, #241a13);
	--mzc-cream: var(--mz-cream, #f4ede1);
	--mzc-ember: var(--mz-ember, #f86000);
	/* bois sombre */
	--mzc-bg: var(--mzc-walnut);
	--mzc-line: rgba(244, 237, 225, 0.16);
	/* laiton des goupilles et des filets */
	--mzc-brass-hi: #fbeab0;
	--mzc-brass: #cf9f3b;
	--mzc-brass-lo: #7a5413;
	/* texte secondaire et braise lisibles sur le bois : contraste mesuré sur les pixels les plus clairs de la plaquette (≥ 4,5:1 pour le petit texte, ≥ 3:1 pour les grands titres) */
	--mzc-soft: #cdbfad;
	--mzc-accent: var(--mzc-ember);
	--mzc-accent-ink: #ff8c42;

	/*
	 * Matière : texture de noyer pré-calculée (horn.webp, 8 Ko, sans couture ; générée par tools/make-horn.py) sur le marron foncé du site.
	 * L'image n'est chargée que lorsque le bandeau (ou une fenêtre, un encart) est affiché. Pas de dégradé superposé : chaque couche plein
	 * écran a un coût de rendu, et la texture porte déjà ses propres reflets (un bruit SVG, lui, était recalculé à chaque affichage).
	 */
	--mzc-surface: url("horn.webp?v=4") 0 0 / 1080px 540px, var(--mzc-bg);
	/* arête polie de la plaquette : reflet en haut, ombre en bas, filet sombre autour, profondeur */
	--mzc-bevel:
		inset 0 1px 0 rgba(255, 236, 205, 0.22),
		inset 0 -2px 0 rgba(0, 0, 0, 0.5),
		inset 0 0 0 1px rgba(0, 0, 0, 0.7),
		inset 0 0 2.4rem rgba(0, 0, 0, 0.4);
	/* goupille de laiton, au centre d'un petit creux sombre cerclé d'un reflet (rayon = demi-côté de la case) */
	--mzc-pin: radial-gradient(circle closest-side at 50% 50%, #fbeab0 0 9%, #e8c065 24%, #c4912f 46%, #8a5f17 58%, #3a2408 61%, rgba(0, 0, 0, 0.55) 63% 84%, rgba(255, 226, 170, 0.28) 86% 92%, transparent 94%);
}

.mzc {
	--mzc-display: var(--mz-display, "Fraunces", "Iowan Old Style", Georgia, serif);
	--mzc-sans: var(--mz-sans, "Instrument Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif);
	--mzc-mono: var(--mz-mono, "DM Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace);
	--mzc-ease: cubic-bezier(0.22, 0.7, 0.18, 1);

	font-family: var(--mzc-sans);
	font-size: 16px;
	line-height: 1.5;
	color: var(--mzc-cream);
	-webkit-font-smoothing: antialiased;
}

.mzc *,
.mzc *::before,
.mzc *::after {
	box-sizing: border-box;
}

.mzc .screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.mzc [hidden] {
	display: none !important;
}

/* --------------------------------------------------------------------------
 * Boutons « lame » : plaques de corne claire à coin biseauté, incrustées dans le bois (même mécanique que les boutons du thème)
 * ----------------------------------------------------------------------- */
.mzc .mzc-btn {
	--c: 10px;
	--btn-bd: var(--mzc-cream);
	--btn-bg: var(--mzc-cream);
	--btn-fg: var(--mzc-ink);
	--btn-hover-bg: var(--mzc-ember);
	--btn-hover-fg: var(--mzc-ink);

	position: relative;
	isolation: isolate;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 0;
	min-height: 3rem;
	margin: 0;
	padding: 0.8rem 0.75rem;
	border: 1px solid var(--btn-bd);
	border-radius: 0;
	background: var(--btn-bg);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7), inset 0 -2px 0 rgba(120, 76, 24, 0.22);
	color: var(--btn-fg);
	font: 500 0.75rem / 1.25 var(--mzc-mono);
	letter-spacing: 0.12em;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
	cursor: pointer;
	clip-path: polygon(0 0, calc(100% - var(--c)) 0, 100% var(--c), 100% 100%, 0 100%);
	transition: color 0.35s var(--mzc-ease);
	-webkit-appearance: none;
	appearance: none;
}

.mzc .mzc-btn::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: var(--btn-hover-bg);
	translate: -101% 0;
	transition: translate 0.5s var(--mzc-ease);
}

.mzc .mzc-btn::after {
	content: "";
	position: absolute;
	top: -1px;
	right: -1px;
	z-index: 1;
	width: var(--c);
	height: var(--c);
	pointer-events: none;
	background: linear-gradient(
		to bottom left,
		transparent calc(50% - 0.75px),
		var(--btn-bd) calc(50% - 0.75px) calc(50% + 0.25px),
		transparent calc(50% + 0.25px)
	);
}

.mzc .mzc-btn:hover,
.mzc .mzc-btn:focus-visible {
	color: var(--btn-hover-fg);
}

.mzc .mzc-btn:hover::before,
.mzc .mzc-btn:focus-visible::before {
	translate: 0 0;
}

.mzc .mzc-btn:focus-visible {
	outline: 2px solid var(--mzc-ember);
	outline-offset: 3px;
	clip-path: none;
}

.mzc .mzc-btn--ghost {
	--btn-bd: rgba(244, 237, 225, 0.6);
	--btn-bg: transparent;
	--btn-fg: var(--mzc-cream);
	--btn-hover-bg: var(--mzc-cream);
	--btn-hover-fg: var(--mzc-ink);

	box-shadow: none;
}

.mzc .mzc-btn--wide {
	grid-column: 1 / -1;
}

/* --------------------------------------------------------------------------
 * Textes communs (sur le bois sombre : crème ; braise éclaircie pour le petit texte)
 * ----------------------------------------------------------------------- */
.mzc .mzc-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 0.75rem;
	margin: 0;
	font: 500 0.6875rem / 1.3 var(--mzc-mono);
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--mzc-accent-ink);
}

.mzc .mzc-eyebrow::before {
	content: "";
	flex: none;
	width: 1.75rem;
	height: 1px;
	background: currentColor;
}

.mzc .mzc-title {
	margin: 0.5rem 0 0;
	padding: 0;
	font-family: var(--mzc-display);
	font-size: clamp(1.7rem, 1.4rem + 0.9vw, 2.15rem);
	font-weight: 340;
	line-height: 1.05;
	letter-spacing: -0.025em;
	color: inherit;
	text-transform: none;
}

.mzc .mzc-title em {
	font-style: italic;
	font-weight: 300;
	color: var(--mzc-accent);
}

.mzc .mzc-text {
	margin: 0;
	font-size: 0.875rem;
	line-height: 1.6;
}

.mzc .mzc-text p {
	margin: 0 0 0.6rem;
	text-wrap: pretty;
}

.mzc .mzc-note {
	margin: 0.75rem 0 0;
	text-wrap: pretty;
	font-size: 0.8125rem;
	line-height: 1.55;
	color: var(--mzc-soft);
}

.mzc a {
	color: inherit;
	text-underline-offset: 3px;
}

.mzc .mzc-links {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem 1.25rem;
	margin: 1.1rem 0 0;
	padding: 0;
}

.mzc .mzc-links > * {
	display: inline-flex;
	width: auto;
	margin: 0;
}

.mzc .mzc-links a,
.mzc .mzc-linkbtn {
	padding: 0;
	border: 0;
	background: none;
	font: 500 0.6875rem / 1.4 var(--mzc-mono);
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--mzc-soft);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 4px;
	cursor: pointer;
	transition: color 0.3s;
}

.mzc .mzc-links a:hover,
.mzc .mzc-linkbtn:hover,
.mzc .mzc-links a:focus-visible,
.mzc .mzc-linkbtn:focus-visible {
	color: var(--mzc-cream);
}

.mzc .mzc-links a:focus-visible,
.mzc .mzc-linkbtn:focus-visible {
	outline: 2px solid var(--mzc-ember);
	outline-offset: 3px;
}

/* --------------------------------------------------------------------------
 * Premier niveau : la plaquette de noyer
 *  - écran large : longue plaquette posée en bas de page, goupilles aux deux bouts, poinçon à gauche, boutons à droite ;
 *  - tablette et mobile : plaquette empilée, goupilles en haut, boutons toujours visibles en bas (le texte défile s'il le faut).
 * ----------------------------------------------------------------------- */
.mzc .mzc-banner {
	--r: 1.75rem;
	--pin-y: 50%;

	position: fixed;
	right: 0;
	bottom: 1.25rem;
	left: 0;
	z-index: 2147483000;
	display: none;
	width: min(70rem, calc(100vw - 2.5rem));
	max-height: calc(100vh - 2.5rem);
	max-height: calc(100dvh - 2.5rem);
	margin: 0 auto;
	overflow: hidden;
	border-radius: var(--r);
	background: var(--mzc-surface);
	box-shadow: var(--mzc-bevel), 0 0 0 1px rgba(255, 236, 205, 0.08), 0 2px 5px rgba(0, 0, 0, 0.45), 0 26px 50px -14px rgba(0, 0, 0, 0.75);
	color: var(--mzc-cream);
}

html.mzc-ask .mzc .mzc-banner {
	display: block;
	animation: mzc-in 0.6s var(--mzc-ease) both;
}

html.mzc-locked .mzc .mzc-banner {
	visibility: hidden;
}

.mzc .mzc-banner.is-leaving {
	animation: mzc-out 0.25s ease-in both;
}

/* filet de laiton incrusté à l'intérieur de la plaquette (fine rainure sombre de part et d'autre) */
.mzc .mzc-banner::before {
	content: "";
	position: absolute;
	inset: 0.5rem;
	z-index: 0;
	border: 1px solid rgba(207, 159, 59, 0.42);
	border-radius: calc(var(--r) - 0.5rem);
	box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.4), inset 0 0 0 1px rgba(0, 0, 0, 0.4);
	pointer-events: none;
}

/* les deux goupilles de laiton */
.mzc .mzc-banner::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 2;
	background-image: var(--mzc-pin), var(--mzc-pin);
	background-repeat: no-repeat;
	background-size: 1.4rem 1.4rem;
	background-position: left 0.8rem top var(--pin-y), right 0.8rem top var(--pin-y);
	filter: drop-shadow(0 1px 1px rgba(0, 0, 0, 0.6));
	pointer-events: none;
}

.mzc .mzc-banner__body {
	position: relative;
	z-index: 1;
	max-height: calc(100vh - 2.5rem);
	max-height: calc(100dvh - 2.5rem);
	padding: 2rem 4rem;
	overflow: auto;
	overscroll-behavior: contain;
}

.mzc .mzc-banner .mzc-text {
	margin-top: 1rem;
	color: var(--mzc-cream);
}

.mzc .mzc-banner .mzc-text p {
	margin-bottom: 1rem;
}

.mzc .mzc-purposes {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1rem 2rem;
	margin: 0 0 1rem;
	padding: 0;
	list-style: none;
}

.mzc .mzc-purposes li {
	position: relative;
	margin: 0;
	padding: 0.75rem 0 0 1.25rem;
	border-top: 1px solid var(--mzc-line);
	font-size: 0.8125rem;
	line-height: 1.5;
	color: var(--mzc-soft);
}

.mzc .mzc-purposes li::before {
	content: "";
	position: absolute;
	top: calc(0.75rem + 0.5em);
	left: 0;
	width: 0.4rem;
	height: 0.4rem;
	background: var(--mzc-accent);
	transform: rotate(45deg);
}

.mzc .mzc-purposes strong {
	font-weight: 600;
	color: var(--mzc-cream);
}

.mzc .mzc-banner .mzc-note {
	margin: 0;
	font-size: 0.78125rem;
	line-height: 1.5;
}

.mzc .mzc-banner__foot {
	display: flex;
	flex-direction: column;
	gap: 1.25rem;
	min-width: 0;
}

.mzc .mzc-actions {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0.6rem;
	margin-top: 1.25rem;
}

.mzc .mzc-banner__foot .mzc-actions {
	margin-top: 0;
}

.mzc .mzc-banner__foot .mzc-links {
	margin-top: 0;
}

/* Le cookie : repère du bandeau, aligné sur le haut du texte */
.mzc .mzc-cookie {
	display: block;
	align-self: start;
	justify-self: start;
	width: 4.5rem;
	height: 4.5rem;
	transform: rotate(-14deg);
	filter: drop-shadow(0 2px 3px rgba(0, 0, 0, 0.55));
	pointer-events: none;
	user-select: none;
}

@keyframes mzc-in {
	from {
		opacity: 0;
		transform: translateY(18px) rotate(-0.35deg);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

@keyframes mzc-out {
	to {
		opacity: 0;
		transform: translateY(12px);
	}
}

/* Tablette : plaquette empilée, centrée en bas. La zone de texte défile s'il le faut, les boutons restent toujours visibles dessous. */
@media (max-width: 62rem) {
	.mzc .mzc-banner {
		--r: 1.5rem;
		--pin-y: 1.1rem;
		--pad-x: 1.75rem;

		width: min(36rem, calc(100vw - 2.5rem));
	}

	.mzc .mzc-banner__body {
		display: flex;
		flex-direction: column;
		padding: 2.5rem 0 0;
		overflow: hidden;
	}

	.mzc .mzc-banner__main {
		flex: 1 1 auto;
		min-height: 0;
		padding: 0 var(--pad-x) 1rem;
		overflow: auto;
		overscroll-behavior: contain;
		-webkit-mask-image: linear-gradient(to bottom, #000 calc(100% - 1rem), transparent);
		mask-image: linear-gradient(to bottom, #000 calc(100% - 1rem), transparent);
	}

	.mzc .mzc-banner__main:focus-visible {
		outline: 2px solid var(--mzc-ink);
		outline-offset: -2px;
	}

	.mzc .mzc-banner__foot {
		flex: none;
		gap: 1rem;
		padding: 0.5rem var(--pad-x) 1.5rem;
	}

	.mzc .mzc-purposes {
		grid-template-columns: minmax(0, 1fr);
		gap: 0.5rem;
		margin-bottom: 0.75rem;
	}

	.mzc .mzc-purposes li {
		padding-top: 0.5rem;
	}

	.mzc .mzc-purposes li::before {
		top: calc(0.5rem + 0.5em);
	}

	.mzc .mzc-banner .mzc-text {
		margin-top: 0.75rem;
	}

	.mzc .mzc-banner .mzc-text p {
		margin-bottom: 0.75rem;
	}

	.mzc .mzc-cookie {
		position: absolute;
		top: 2.5rem;
		right: 1.75rem;
		width: 3.75rem;
		height: 3.75rem;
	}

	.mzc .mzc-banner__main .mzc-eyebrow,
	.mzc .mzc-banner__main .mzc-title {
		max-width: calc(100% - 4.75rem);
	}
}

/* Mobile : plaquette posée avec un petit jeu sur les bords */
@media (max-width: 36rem) {
	.mzc .mzc-banner {
		--r: 1.25rem;
		--pin-y: 0.95rem;
		--pad-x: 1.15rem;

		bottom: max(0.5rem, env(safe-area-inset-bottom, 0px));
		width: calc(100vw - 1rem);
		max-height: calc(100vh - 1rem);
		max-height: calc(100dvh - 1rem);
	}

	.mzc .mzc-banner::before {
		inset: 0.4rem;
		border-radius: calc(var(--r) - 0.4rem);
	}

	.mzc .mzc-banner::after {
		background-size: 1.2rem 1.2rem;
		background-position: left 0.65rem top var(--pin-y), right 0.65rem top var(--pin-y);
	}

	.mzc .mzc-banner__body {
		max-height: calc(100vh - 1rem);
		max-height: calc(100dvh - 1rem);
		padding-top: 2.15rem;
	}

	.mzc .mzc-banner__foot {
		padding-bottom: 1.15rem;
	}

	.mzc .mzc-cookie {
		top: 2.15rem;
		right: 1.15rem;
		width: 3rem;
		height: 3rem;
	}

	.mzc .mzc-banner__main .mzc-eyebrow,
	.mzc .mzc-banner__main .mzc-title {
		max-width: calc(100% - 3.75rem);
	}

	.mzc .mzc-title {
		font-size: 1.6rem;
	}

	.mzc .mzc-banner .mzc-text {
		font-size: 0.8125rem;
		line-height: 1.5;
	}

	.mzc .mzc-purposes li,
	.mzc .mzc-banner .mzc-note {
		font-size: 0.75rem;
	}

	.mzc .mzc-btn {
		min-height: 2.75rem;
		padding: 0.65rem 0.4rem;
		letter-spacing: 0.1em;
	}

}

/*
 * Écran large : plaquette basse et équilibrée. Trois colonnes (cookie | texte | boutons) et une ligne de pied (rappel à gauche, liens à droite) ;
 * les conteneurs du texte et des boutons sont « transparents » (display: contents) pour que leurs éléments se placent directement dans la grille.
 */
@media (min-width: 62.0625rem) {
	.mzc .mzc-banner__body {
		display: grid;
		grid-template-columns: 3.5rem minmax(0, 1fr) 19.5rem;
		grid-template-rows: auto auto auto auto auto;
		column-gap: 1.75rem;
		align-items: start;
		padding: 1.25rem 3.75rem 1rem;
	}

	.mzc .mzc-banner__main,
	.mzc .mzc-banner .mzc-text {
		display: contents;
	}

	.mzc .mzc-cookie {
		grid-column: 1;
		grid-row: 1 / 3;
		width: 3.5rem;
		height: 3.5rem;
	}

	.mzc .mzc-banner .mzc-eyebrow {
		grid-column: 2;
		grid-row: 1;
	}

	.mzc .mzc-banner .mzc-title {
		grid-column: 2;
		grid-row: 2;
		margin: 0.25rem 0 0;
		font-size: 1.625rem;
	}

	.mzc .mzc-banner .mzc-text p:first-child {
		grid-column: 1 / 3;
		grid-row: 3;
		margin: 0.5rem 0 0;
		font-size: 0.8125rem;
		line-height: 1.5;
	}

	.mzc .mzc-purposes {
		grid-column: 1 / 3;
		grid-row: 4;
		gap: 0 2rem;
		margin: 0.75rem 0 0;
	}

	.mzc .mzc-purposes li {
		padding: 0 0 0 1.25rem;
		border-top: 0;
		font-size: 0.75rem;
		line-height: 1.45;
	}

	.mzc .mzc-purposes li::before {
		top: 0.5em;
	}

	.mzc .mzc-banner .mzc-note {
		grid-column: 1 / 3;
		grid-row: 5;
		margin: 0.75rem 0 0;
		padding-top: 0.625rem;
		border-top: 1px solid var(--mzc-line);
		font-size: 0.71875rem;
		line-height: 1.5;
	}

	/* colonne de droite sur toute la hauteur : boutons, puis liste de liens (une ligne par lien, flèche à droite) */
	.mzc .mzc-banner__foot {
		grid-column: 3;
		grid-row: 1 / 6;
		align-self: stretch;
		gap: 1rem;
	}

	.mzc .mzc-banner__foot .mzc-links {
		flex-direction: column;
		gap: 0;
		margin: 0;
		border-bottom: 1px solid var(--mzc-line);
	}

	.mzc .mzc-banner__foot .mzc-links > * {
		display: flex;
		align-items: center;
		justify-content: space-between;
		width: 100%;
		padding: 0.5rem 0;
		border-top: 1px solid var(--mzc-line);
		text-align: left;
		text-decoration: none;
	}

	.mzc .mzc-banner__foot .mzc-links > *::after {
		content: "→";
		font-family: var(--mzc-sans);
		letter-spacing: 0;
		color: var(--mzc-accent-ink);
		transition: translate 0.25s var(--mzc-ease);
	}

	.mzc .mzc-banner__foot .mzc-links > *:hover::after {
		translate: 0.25rem 0;
	}

	.mzc .mzc-banner .mzc-btn {
		min-height: 2.75rem;
	}
}

/* Écran très bas (téléphone en paysage, zoom à 400 %) : le texte et les boutons défilent ensemble, rien n'est coupé. */
@media (max-width: 62rem) and (max-height: 30rem) {
	.mzc .mzc-banner__body {
		display: block;
		overflow: auto;
	}

	.mzc .mzc-banner__main {
		padding-right: var(--pad-x);
		overflow: visible;
		-webkit-mask-image: none;
		mask-image: none;
	}

	.mzc .mzc-banner__foot {
		padding-top: 0.25rem;
	}

	.mzc .mzc-banner__body > .mzc-banner__main,
	.mzc .mzc-banner__body > .mzc-banner__foot {
		margin-inline: var(--pad-x);
		padding-inline: 0;
	}
}

/* --------------------------------------------------------------------------
 * Second niveau : fenêtre des préférences (corps noyer, en-tête en bois veiné avec ses goupilles)
 * ----------------------------------------------------------------------- */
.mzc .mzc-modal {
	position: fixed;
	inset: 0;
	z-index: 2147483001;
	display: grid;
	place-items: center;
	padding: 1rem;
}

.mzc .mzc-modal__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(10, 7, 4, 0.74);
	-webkit-backdrop-filter: blur(3px);
	backdrop-filter: blur(3px);
	animation: mzc-fade 0.3s ease both;
}

@keyframes mzc-fade {
	from {
		opacity: 0;
	}
}

.mzc .mzc-modal__panel {
	--r: 1.5rem;

	position: relative;
	display: flex;
	flex-direction: column;
	width: min(46rem, 100%);
	max-height: min(92vh, 54rem);
	max-height: min(92dvh, 54rem);
	overflow: hidden;
	border-radius: var(--r);
	background: var(--mzc-bg);
	box-shadow: 0 0 0 1px rgba(244, 237, 225, 0.16), 0 34px 80px -20px rgba(0, 0, 0, 0.85);
	color: var(--mzc-cream);
	animation: mzc-in 0.45s var(--mzc-ease) both;
	outline: none;
}

/* les deux goupilles de l'en-tête (même laiton que le bandeau) */
.mzc .mzc-modal__panel::after {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	z-index: 3;
	height: 2.4rem;
	background-image: var(--mzc-pin), var(--mzc-pin);
	background-repeat: no-repeat;
	background-size: 1.3rem 1.3rem;
	background-position: left 0.75rem top 0.7rem, right 0.75rem top 0.7rem;
	filter: drop-shadow(0 1px 1px rgba(0, 0, 0, 0.6));
	pointer-events: none;
}

.mzc .mzc-modal__head {
	position: relative;
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 1rem;
	padding: 2.4rem 1.75rem 1.4rem;
	background: var(--mzc-surface);
	box-shadow: inset 0 1px 0 rgba(255, 236, 205, 0.2), 0 1px 0 #0d0906, 0 2px 0 var(--mzc-brass), 0 3px 0 #0d0906;
	color: var(--mzc-cream);
}

/* bouton « Fermer » : simple croix dans un carré à filet, sans ornement */
.mzc .mzc-x {
	flex: none;
	display: grid;
	place-items: center;
	width: 2.5rem;
	height: 2.5rem;
	margin: -0.25rem 0 0;
	padding: 0;
	border: 1px solid rgba(244, 237, 225, 0.35);
	border-radius: 0;
	background: rgba(23, 18, 14, 0.35);
	color: var(--mzc-cream);
	font: 300 1.5rem / 1 var(--mzc-sans);
	cursor: pointer;
	transition: background 0.25s, color 0.25s, border-color 0.25s;
}

.mzc .mzc-x:hover,
.mzc .mzc-x:focus-visible {
	border-color: var(--mzc-cream);
	background: var(--mzc-cream);
	color: var(--mzc-ink);
}

.mzc .mzc-x:focus-visible {
	outline: 2px solid var(--mzc-ember);
	outline-offset: 3px;
}

.mzc .mzc-modal__scroll {
	flex: 1;
	min-height: 0;
	overflow: auto;
	padding: 1.5rem 1.75rem 1.25rem;
	overscroll-behavior: contain;
}

.mzc .mzc-modal__intro {
	margin: 0 0 0.9rem;
	font-size: 0.9375rem;
	line-height: 1.6;
	color: var(--mzc-soft);
}

.mzc .mzc-status {
	margin: 0 0 1.25rem;
	padding: 0.65rem 0.9rem;
	border-left: 2px solid var(--mzc-ember);
	background: rgba(244, 237, 225, 0.06);
	font: 500 0.6875rem / 1.5 var(--mzc-mono);
	letter-spacing: 0.06em;
	color: var(--mzc-soft);
}

.mzc .mzc-cats {
	margin: 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid var(--mzc-line);
}

.mzc .mzc-cat {
	padding: 1.25rem 0;
	border-bottom: 1px solid var(--mzc-line);
}

.mzc .mzc-cat__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.25rem;
}

.mzc .mzc-cat__title h3 {
	margin: 0;
	padding: 0;
	font-family: var(--mzc-display);
	font-size: 1.3rem;
	font-weight: 380;
	line-height: 1.15;
	letter-spacing: -0.01em;
	color: var(--mzc-cream);
}

.mzc .mzc-cat__title p {
	margin: 0.25rem 0 0;
	font-size: 0.8125rem;
	line-height: 1.45;
	color: var(--mzc-soft);
}

.mzc .mzc-cat__text {
	margin: 0.8rem 0 0;
	font-size: 0.875rem;
	line-height: 1.6;
	color: var(--mzc-cream);
}

.mzc .mzc-always {
	flex: none;
	padding: 0.3rem 0.65rem;
	border: 1px solid var(--mzc-ember);
	font: 500 0.625rem / 1.2 var(--mzc-mono);
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--mzc-accent-ink);
}

/*
 * Choix par finalité : deux boutons radio « Refusé / Autorisé » (groupe nommé par le titre de la finalité, flèches du clavier comprises).
 * Même langage que les boutons du site : filet crème, mono en capitales, coin biseauté « lame ». La case choisie est remplie de la couleur
 * primaire (braise) et glisse d'une case à l'autre ; le texte marque aussi le choix (l'état ne repose pas que sur la couleur). Les deux
 * choix ont le même aspect : aucun n'est mis en avant. Par défaut « Refusé » (rien d'optionnel n'est activé sans acte positif).
 */
.mzc .mzc-choice {
	position: relative;
	isolation: isolate;
	flex: none;
	display: grid;
	grid-template-columns: repeat(2, minmax(5.5rem, 1fr));
	min-width: 12rem;
	padding: 0.25rem;
	border: 1px solid rgba(244, 237, 225, 0.35);
	background: rgba(23, 18, 14, 0.35);
}

.mzc .mzc-choice__opt {
	position: relative;
	z-index: 1;
	display: grid;
	cursor: pointer;
}

.mzc .mzc-choice__input {
	position: absolute;
	inset: 0;
	z-index: 2;
	width: 100%;
	height: 100%;
	margin: 0;
	opacity: 0;
	cursor: pointer;
}

.mzc .mzc-choice__label {
	display: grid;
	place-items: center;
	min-height: 2.25rem;
	padding: 0.4rem 0.6rem;
	font: 500 0.6875rem / 1.2 var(--mzc-mono);
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--mzc-cream);
	transition: color 0.25s, background 0.25s;
	pointer-events: none;
}

.mzc .mzc-choice__input:not(:checked):hover + .mzc-choice__label {
	background: rgba(244, 237, 225, 0.1);
}

.mzc .mzc-choice__input:checked + .mzc-choice__label {
	color: var(--mzc-ink);
}

.mzc .mzc-choice__input:focus-visible + .mzc-choice__label {
	outline: 2px solid var(--mzc-ember);
	outline-offset: 2px;
}

/* la case braise qui glisse (coin haut-droit biseauté) */
.mzc .mzc-choice__thumb,
.mzc .mzc-choice__input:checked + .mzc-choice__label {
	background: var(--mzc-ember);
}

.mzc .mzc-choice__thumb {
	position: absolute;
	z-index: 0;
	top: 0.25rem;
	bottom: 0.25rem;
	left: 0.25rem;
	width: calc(50% - 0.25rem);
	clip-path: polygon(0 0, calc(100% - 8px) 0, 100% 8px, 100% 100%, 0 100%);
	pointer-events: none;
	transition: translate 0.35s var(--mzc-ease);
}

.mzc .mzc-choice:has(.mzc-choice__opt:last-of-type .mzc-choice__input:checked) .mzc-choice__thumb {
	translate: 100% 0;
}

/* navigateurs sans :has() : pas de glissement, la case choisie porte elle-même la couleur */
@supports selector(:has(*)) {
	.mzc .mzc-choice__input:checked + .mzc-choice__label {
		background: none;
	}
}

@supports not selector(:has(*)) {
	.mzc .mzc-choice__thumb {
		display: none;
	}
}

/* Détail des services */
.mzc .mzc-detail {
	margin-top: 0.9rem;
}

.mzc .mzc-detail summary {
	display: inline-flex;
	align-items: center;
	gap: 0.6rem;
	padding: 0.2rem 0;
	font: 500 0.6875rem / 1.4 var(--mzc-mono);
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--mzc-cream);
	cursor: pointer;
	list-style: none;
}

.mzc .mzc-detail summary::-webkit-details-marker {
	display: none;
}

.mzc .mzc-detail summary::after {
	content: "+";
	display: grid;
	place-items: center;
	width: 1.3rem;
	height: 1.3rem;
	border: 1px solid currentColor;
	font: 400 0.95rem / 1 var(--mzc-sans);
	letter-spacing: 0;
}

.mzc .mzc-detail[open] summary::after {
	content: "−";
}

.mzc .mzc-detail summary:focus-visible {
	outline: 2px solid var(--mzc-ember);
	outline-offset: 3px;
}

.mzc .mzc-services {
	display: grid;
	gap: 0.85rem;
	margin: 0.9rem 0 0;
	padding: 0;
	list-style: none;
}

.mzc .mzc-service {
	padding: 1rem 1.1rem;
	border: 1px solid var(--mzc-line);
	background: rgba(244, 237, 225, 0.05);
}

.mzc .mzc-service__name {
	margin: 0;
	font-family: var(--mzc-display);
	font-size: 1.05rem;
	font-weight: 400;
	line-height: 1.25;
	color: var(--mzc-cream);
}

.mzc .mzc-service__provider {
	margin: 0.2rem 0 0;
	font: 500 0.6875rem / 1.5 var(--mzc-mono);
	letter-spacing: 0.04em;
	color: var(--mzc-accent-ink);
}

.mzc .mzc-service__addr {
	color: var(--mzc-soft);
}

.mzc .mzc-facts {
	display: grid;
	gap: 0.6rem;
	margin: 0.85rem 0 0;
	padding: 0;
}

.mzc .mzc-facts > div {
	display: grid;
	grid-template-columns: 6.25rem minmax(0, 1fr);
	gap: 0.15rem 1rem;
	margin: 0;
	padding: 0;
}

.mzc .mzc-facts dt {
	margin: 0;
	padding: 0.2rem 0 0;
	font: 500 0.625rem / 1.4 var(--mzc-mono);
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--mzc-soft);
}

.mzc .mzc-facts dd {
	margin: 0;
	padding: 0;
	font-size: 0.8125rem;
	line-height: 1.55;
	color: var(--mzc-cream);
}

@media (max-width: 36rem) {
	.mzc .mzc-facts > div {
		grid-template-columns: minmax(0, 1fr);
	}

	.mzc .mzc-facts dt {
		padding: 0;
	}
}

.mzc .mzc-cookies {
	display: grid;
	gap: 0.3rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.mzc .mzc-cookies li {
	display: flex;
	flex-wrap: wrap;
	gap: 0.15rem 0.75rem;
}

.mzc .mzc-cookies code {
	padding: 0.05rem 0.35rem;
	background: rgba(244, 237, 225, 0.09);
	font: 400 0.75rem / 1.5 var(--mzc-mono);
	overflow-wrap: anywhere;
}

.mzc .mzc-cookies span {
	color: var(--mzc-soft);
}

.mzc .mzc-service__more {
	margin: 0.8rem 0 0;
}

.mzc .mzc-modal__panel .mzc-link,
.mzc .mzc-modal__panel .mzc-modal__links a {
	font: 500 0.6875rem / 1.4 var(--mzc-mono);
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--mzc-cream);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 4px;
}

.mzc .mzc-modal__panel .mzc-link:hover,
.mzc .mzc-modal__panel .mzc-modal__links a:hover {
	color: var(--mzc-accent-ink);
}

.mzc .mzc-companies {
	margin-top: 1.5rem;
	padding: 1.1rem 1.25rem;
	border: 1px solid var(--mzc-line);
}

.mzc .mzc-companies h3 {
	margin: 0 0 0.4rem;
	font-family: var(--mzc-display);
	font-size: 1.15rem;
	font-weight: 380;
	color: var(--mzc-cream);
}

.mzc .mzc-companies p {
	margin: 0 0 0.5rem;
	font-size: 0.8125rem;
	color: var(--mzc-soft);
}

.mzc .mzc-companies ul {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem 1.25rem;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 0.875rem;
}

.mzc .mzc-companies li {
	position: relative;
	padding-left: 0.9rem;
}

.mzc .mzc-companies li::before {
	content: "";
	position: absolute;
	top: 0.55em;
	left: 0;
	width: 0.35rem;
	height: 0.35rem;
	background: var(--mzc-ember);
	transform: rotate(45deg);
}

.mzc .mzc-modal__links {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem 1.5rem;
	margin: 1.25rem 0 0;
}

.mzc .mzc-modal__foot {
	display: grid;
	grid-template-columns: 1fr 1.35fr 1fr;
	gap: 0.6rem;
	padding: 1rem 1.75rem calc(1.15rem + env(safe-area-inset-bottom, 0px));
	border-top: 1px solid var(--mzc-line);
	background: var(--mzc-ink);
}

/* refuser | enregistrer | accepter : « refuser » et « accepter » aux extrémités, au même format */
.mzc .mzc-modal__foot [data-mzc-action="refuse"] {
	order: 1;
}

.mzc .mzc-modal__foot [data-mzc-action="save"] {
	order: 2;
}

.mzc .mzc-modal__foot [data-mzc-action="accept"] {
	order: 3;
}

@media (max-width: 36rem) {
	.mzc .mzc-modal {
		padding: 0;
		place-items: end center;
	}

	.mzc .mzc-modal__panel {
		--r: 1.25rem;

		width: 100%;
		max-height: 94vh;
		max-height: 94dvh;
		border-bottom-right-radius: 0;
		border-bottom-left-radius: 0;
	}

	.mzc .mzc-modal__head,
	.mzc .mzc-modal__scroll,
	.mzc .mzc-modal__foot {
		padding-right: 1.25rem;
		padding-left: 1.25rem;
	}

	.mzc .mzc-modal__foot {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.mzc .mzc-modal__foot [data-mzc-action="save"] {
		order: 3;
		grid-column: 1 / -1;
	}

	.mzc .mzc-modal__foot [data-mzc-action="accept"] {
		order: 2;
	}

	/* le choix passe sous le titre, sur toute la largeur : deux grandes cases faciles à toucher */
	.mzc .mzc-cat__head {
		flex-direction: column;
		align-items: stretch;
		gap: 0.9rem;
	}

	.mzc .mzc-choice {
		min-width: 0;
	}

	.mzc .mzc-always {
		align-self: flex-start;
	}
}

/* --------------------------------------------------------------------------
 * Fenêtre contextuelle (vidéo, carte) : même plaquette de noyer que le bandeau
 * ----------------------------------------------------------------------- */
.mzc .mzc-modal--ctx .mzc-modal__panel {
	--r: 1.5rem;

	width: min(30rem, 100%);
	max-height: 92vh;
	max-height: 92dvh;
	overflow: auto;
	padding: 2.5rem 1.75rem 1.5rem;
	background: var(--mzc-surface);
	box-shadow: var(--mzc-bevel), 0 0 0 1px rgba(255, 236, 205, 0.1), 0 2px 5px rgba(0, 0, 0, 0.45), 0 34px 80px -20px rgba(0, 0, 0, 0.85);
	color: var(--mzc-cream);
}

.mzc .mzc-modal--ctx .mzc-modal__panel > * {
	position: relative;
	z-index: 1;
}

.mzc .mzc-modal--ctx .mzc-text {
	margin-top: 0.8rem;
	color: var(--mzc-cream);
}

.mzc .mzc-modal--ctx .mzc-actions {
	margin-top: 1.1rem;
}

.mzc .mzc-modal--ctx .mzc-btn {
	padding-inline: 0.5rem;
	letter-spacing: 0.1em;
}

/* --------------------------------------------------------------------------
 * Encart d'un contenu externe masqué (iframe, vidéo) tant que le visiteur n'a rien autorisé
 * ----------------------------------------------------------------------- */
.mzc-embed {
	--btn-bd: var(--mzc-cream);
	--btn-bg: var(--mzc-cream);
	--btn-fg: var(--mzc-ink);
	--btn-hover-bg: var(--mzc-ember);
	--btn-hover-fg: var(--mzc-ink);

	position: relative;
	display: grid;
	align-content: center;
	justify-items: start;
	gap: 0.6rem;
	width: 100%;
	min-height: 12rem;
	padding: clamp(2.25rem, 5vw, 2.5rem) clamp(1.25rem, 4vw, 2rem) clamp(1.25rem, 4vw, 2rem);
	border-radius: 1.25rem;
	background: var(--mzc-surface);
	box-shadow: var(--mzc-bevel), 0 12px 28px -12px rgba(10, 6, 3, 0.6);
	color: var(--mzc-cream);
	font-family: var(--mz-sans, system-ui, sans-serif);
}

.mzc-embed::after {
	content: "";
	position: absolute;
	inset: 0;
	background-image: var(--mzc-pin), var(--mzc-pin);
	background-repeat: no-repeat;
	background-size: 1.2rem 1.2rem;
	background-position: left 0.65rem top 0.65rem, right 0.65rem top 0.65rem;
	filter: drop-shadow(0 1px 1px rgba(0, 0, 0, 0.6));
	pointer-events: none;
}

.mzc-embed__title {
	margin: 0;
	font-family: var(--mz-display, Georgia, serif);
	font-size: 1.35rem;
	font-weight: 340;
	line-height: 1.15;
}

.mzc-embed__text {
	max-width: 34rem;
	margin: 0;
	font-size: 0.875rem;
	line-height: 1.55;
	color: var(--mzc-soft);
}

.mzc-embed .mzc-btn {
	--c: 10px;

	position: relative;
	isolation: isolate;
	display: inline-flex;
	align-items: center;
	min-height: 2.9rem;
	margin-top: 0.4rem;
	padding: 0.75rem 1.25rem;
	border: 1px solid var(--btn-bd);
	border-radius: 0;
	background: var(--btn-bg);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7), inset 0 -2px 0 rgba(120, 76, 24, 0.22);
	color: var(--btn-fg);
	font: 500 0.75rem / 1.25 var(--mz-mono, ui-monospace, monospace);
	letter-spacing: 0.14em;
	text-transform: uppercase;
	cursor: pointer;
	clip-path: polygon(0 0, calc(100% - var(--c)) 0, 100% var(--c), 100% 100%, 0 100%);
	transition: color 0.35s, background 0.35s;
}

.mzc-embed .mzc-btn:hover,
.mzc-embed .mzc-btn:focus-visible {
	background: var(--btn-hover-bg);
	color: var(--btn-hover-fg);
}

.mzc-embed .mzc-btn:focus-visible {
	outline: 2px solid var(--mzc-ember);
	outline-offset: 3px;
	clip-path: none;
}

/* --------------------------------------------------------------------------
 * Bouton flottant de repli (pages sans lien « Gérer mes cookies » dans le pied de page)
 * ----------------------------------------------------------------------- */
.mzc .mzc-fab {
	position: fixed;
	bottom: max(0.875rem, env(safe-area-inset-bottom));
	left: max(0.875rem, env(safe-area-inset-left));
	z-index: 2147482990;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.75rem;
	height: 2.75rem;
	margin: 0;
	padding: 0;
	border: 1px solid var(--mzc-brass-lo);
	border-radius: 50%;
	background: radial-gradient(circle at 35% 28%, var(--mzc-brass-hi), var(--mzc-brass) 55%, #a87a22);
	box-shadow: inset 0 0 0 2px rgba(76, 48, 10, 0.28), 0 6px 14px -4px rgba(10, 6, 3, 0.6);
	color: var(--mzc-ink);
	cursor: pointer;
	transition: background 0.3s var(--mzc-ease), transform 0.3s var(--mzc-ease);
	-webkit-appearance: none;
	appearance: none;
}

.mzc .mzc-fab:hover {
	background: var(--mzc-ember);
	transform: translateY(-2px);
}

.mzc .mzc-fab:focus-visible {
	outline: 2px solid var(--mzc-ink);
	outline-offset: 3px;
}

@media (max-width: 599px) {
	.mzc .mzc-fab {
		bottom: max(0.5rem, env(safe-area-inset-bottom));
		left: max(0.5rem, env(safe-area-inset-left));
		width: 2.5rem;
		height: 2.5rem;
	}
}

html.mzc-ask .mzc .mzc-fab,
html.mzc-locked .mzc .mzc-fab {
	display: none;
}

/* Le choix peut être modifié depuis n'importe quel lien « Gérer mes cookies » */
[data-mzc-open] {
	cursor: pointer;
}

html.mzc-locked {
	overflow: hidden;
}

@media (prefers-reduced-motion: reduce) {
	.mzc *,
	.mzc *::before,
	.mzc *::after {
		animation-duration: 0.01ms !important;
		animation-delay: 0s !important;
		transition-duration: 0.01ms !important;
	}
}

@media (forced-colors: active) {
	.mzc .mzc-btn,
	.mzc .mzc-choice,
	.mzc .mzc-x {
		border: 1px solid ButtonText;
	}

	/* en contraste forcé les fonds disparaissent : la case choisie prend la couleur de sélection du système */
	.mzc .mzc-choice__thumb {
		display: none;
	}

	.mzc .mzc-choice__input:checked + .mzc-choice__label {
		background: Highlight;
		color: HighlightText;
		forced-color-adjust: none;
	}

	.mzc .mzc-banner,
	.mzc .mzc-modal__panel,
	.mzc-embed {
		border: 1px solid CanvasText;
	}

	.mzc .mzc-cookie {
		display: none;
	}
}

@media print {
	.mzc {
		display: none !important;
	}
}
