/* Liliane Keeler — compléments front (non couverts par theme.json)
   Mise en page d'après la maquette « Proposition » de Codex (14 sept. 2026) :
   ~/Documents/ChatGPT/Liliane Keeler/maquette-comparative-liliane-keeler.html
   Les valeurs (tailles, marges, courbes) reprennent celles de la maquette. */

/* ============================================================
   0. VARIABLES
   ============================================================ */
:root {
	--lk-noir: #17171A;
	--lk-papier: #FAF9F6;
	--lk-ligne: #DDD9D1;
	--lk-muet: #69665E;
	--lk-accent: #5C4632;
	--lk-note: #EEEBE5;
	--lk-cadre: 12px;
	--lk-entete-h: 64px;
	--lk-gouttiere: 6.5%;
	--lk-texte-max: 1240px; /* largeur max du texte courant des Projets et des Interventions */
	--lk-serif: var(--wp--preset--font-family--source-serif-4);
	--lk-sans: var(--wp--preset--font-family--source-sans-3);
	--lk-courbe: cubic-bezier(0.16, 1, 0.3, 1);
}
@media (max-width: 620px) {
	:root { --lk-cadre: 9px; --lk-entete-h: 58px; --lk-gouttiere: 6%; }
}

/* ============================================================
   1. CADRE NOIR + EN-TÊTE
   Les côtés gauche/droit/bas viennent du padding de <body> ;
   le côté haut EST l'en-tête (bandeau noir collant).
   ============================================================ */
html { background: var(--lk-noir); }
body {
	background: var(--lk-noir);
	padding: 0 var(--lk-cadre) var(--lk-cadre);
	box-sizing: border-box;
}
.wp-site-blocks { background: var(--lk-papier); }
:where(.wp-site-blocks) > * { margin-block-start: 0; }

.wp-site-blocks > header.wp-block-template-part {
	position: sticky;
	top: 0;
	z-index: 100;
	margin-inline: calc(var(--lk-cadre) * -1);
}
.lk-header {
	background: var(--lk-noir);
	color: var(--lk-papier);
	height: var(--lk-entete-h);
	align-items: center;
	padding: 0 var(--lk-cadre) !important;
	border: 0 !important;
}
.lk-header .lk-logo { display: flex; color: var(--lk-papier); line-height: 0; }
.lk-header .lk-logo svg { width: auto; height: 54px; }
/* Accueil : pas de logo-signature dans l'en-tête (corrections client, 17 sept. 2026).
   Le nav reste calé à droite comme avant (avant : poussé par le logo via
   space-between ; sans logo, il faut le pousser explicitement). */
.home .lk-header .lk-logo { display: none; }
.home .lk-header .wp-block-navigation.lk-nav { margin-left: auto; }

/* Bouton « Menu » : libellé + deux traits (la maquette n'a pas de burger 3 traits).
   Sélecteur renforcé : le style natif double la classe du bouton (spécificité 0,2,0). */
.lk-header .wp-block-navigation .wp-block-navigation__responsive-container-open {
	display: flex;
	align-items: center;
	gap: 17px;
	color: var(--lk-papier);
	font-family: var(--lk-sans);
	font-size: 13px;
	font-weight: 400;
	padding: 12px 4px 12px 16px;
}
.lk-header .wp-block-navigation__responsive-container-open svg { display: none; }
.lk-header .wp-block-navigation__responsive-container-open::before { content: var(--lk-t-menu, "Menu"); }
.lk-header .wp-block-navigation__responsive-container-open::after {
	content: "";
	width: 24px;
	height: 9px;
	border-top: 1px solid currentColor;
	border-bottom: 1px solid currentColor;
	box-sizing: border-box;
}

/* ============================================================
   2. MENU (overlay natif WordPress, habillé façon maquette)
   Structure réelle : .is-menu-open > .responsive-close > .responsive-dialog
   (div role=dialog, PAS <dialog>) > .responsive-container-content > ul
   ============================================================ */
/* Bande verticale (pas de plein écran opaque) : demande cliente du 17 sept.
   puis précision du 22 sept. 2026 — la bande elle-même est noire à 100%
   (lisibilité du texte), le reste de l'écran passe à 50% noir en transparence.
   Le conteneur externe (JS) reste plein écran et porte le voile à 50% ; le
   dialogue interne (vrai élément, pas un pseudo-élément — un ::before en
   position fixed imbriqué dans .is-menu-open ne se calait pas sur le
   viewport de façon fiable) devient la bande opaque ancrée à droite. */
.wp-block-navigation__responsive-container.is-menu-open {
	position: fixed !important;
	inset: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	max-height: none !important;
	background: rgba(23, 23, 26, 0.5) !important;
	color: var(--lk-papier) !important;
	display: block !important;
	animation: lk-menu-in 0.4s ease both;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-close {
	display: block !important;
	width: 100% !important;
	height: 100% !important;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog {
	position: fixed !important;
	top: 0 !important;
	right: 0 !important;
	bottom: 0 !important;
	left: auto !important;
	display: block !important;
	width: min(420px, 88vw) !important;
	max-width: none !important;
	height: 100% !important;
	margin: 0 !important;
	padding: calc(var(--lk-entete-h) + 28px) var(--lk-gouttiere) 35px !important;
	box-sizing: border-box !important;
	background: var(--lk-noir) !important;
	overflow-y: auto !important;
}
/* Bouton de fermeture : à la place du bouton « Menu », dans le bandeau. */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
	position: absolute !important;
	top: 0;
	right: var(--lk-cadre);
	height: var(--lk-entete-h);
	display: flex;
	align-items: center;
	gap: 17px;
	color: var(--lk-papier);
	font-family: var(--lk-sans);
	font-size: 13px;
	padding: 12px 4px 12px 16px;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close svg { display: none; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close::before { content: var(--lk-t-fermer, "Fermer"); }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close::after {
	content: "×";
	font-size: 26px;
	line-height: 1;
	font-weight: 300;
}
/* Kicker au-dessus des liens. */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content::before {
	content: var(--lk-t-kicker, "Liliane Keeler / Artiste multidisciplinaire");
	display: block;
	font-family: var(--lk-sans);
	font-size: 11px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: #BCBAB1;
	margin-bottom: 30px;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	display: grid !important;
	grid-template-columns: 1fr auto;
	gap: 4px 15px !important;
	align-items: baseline;
	width: 100%;
	counter-reset: lk-menu;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
	width: 100%;
	margin: 0 !important;
}
/* Liens principaux : serif, grands, numérotés 01-06, entrée décalée. */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item:not(.lk-nav-bas) {
	grid-column: 1 / -1;
	counter-increment: lk-menu;
	animation: lk-text-in 0.55s both;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item:not(.lk-nav-bas) a {
	display: flex;
	align-items: baseline;
	gap: 16px;
	font-family: var(--lk-serif);
	font-size: clamp(22px, 3.6vw, 30px);
	font-weight: 400;
	line-height: 1.3;
	letter-spacing: -0.03em;
	color: var(--lk-papier);
	padding: 5px 0;
	text-decoration: none;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item:not(.lk-nav-bas) a::before {
	content: "0" counter(lk-menu);
	font-family: var(--lk-sans);
	font-size: 11px;
	letter-spacing: 0;
	color: #BCBAB1;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item:not(.lk-nav-bas) a:hover { color: #C5B6A1; }
/* Focus clavier : discret, dans les tons du site (au lieu du contour orange
   natif du navigateur) — visible seulement au clavier, pas au clic/tactile. */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item a:focus-visible {
	outline: 1px solid rgba(250, 249, 246, 0.4);
	outline-offset: 6px;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item:nth-child(1) { animation-delay: 0s; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item:nth-child(2) { animation-delay: 0.045s; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item:nth-child(3) { animation-delay: 0.09s; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item:nth-child(4) { animation-delay: 0.135s; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item:nth-child(5) { animation-delay: 0.18s; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item:nth-child(6) { animation-delay: 0.225s; }
/* Rangée du bas : FR / EN à gauche, courriel à droite, filet au-dessus. */
.wp-block-navigation__responsive-container.is-menu-open .lk-nav-bas {
	margin-top: 26px !important;
	padding-top: 20px;
	border-top: 1px solid #5C5B54;
}
.wp-block-navigation__responsive-container.is-menu-open .lk-nav-bas a {
	font-family: var(--lk-sans);
	font-size: 13px;
	color: var(--lk-papier);
	text-decoration: none;
}
.wp-block-navigation__responsive-container.is-menu-open .lk-nav-courriel { text-align: right; }
@media (max-width: 620px) {
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item:not(.lk-nav-bas) a { font-size: 24px; gap: 12px; padding: 8px 0; }
	.wp-block-navigation__responsive-container.is-menu-open .lk-nav-bas a { font-size: 12px; }
	/* Menu mobile : on retire le kicker "Liliane Keeler / Artiste multidisciplinaire"
	   (corrections client, 17 sept. 2026) — le logo suffit à identifier le site. */
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content::before { content: none; margin-bottom: 0; }
}

/* Tout le site, desktop (≥1024px) : menu complet à l'horizontale dans le
   bandeau, pas de bouton "Menu" / pas de panneau. Seuls le mobile et la
   tablette (<1024px) gardent le hamburger + la bande verticale (précision
   cliente du 22 sept. 2026 — le 17 sept. ne demandait ce traitement que
   pour l'accueil ; c'est maintenant le comportement de toutes les pages).
   On force l'affichage du contenu du bloc navigation (normalement caché,
   réservé au panneau) directement dans le bandeau, en ligne. Sur l'accueil,
   le logo reste masqué (règle .home dédiée plus haut) ; sur les autres
   pages il reste visible à gauche, le nav prenant sa place habituelle à
   droite (pas besoin de le pousser, space-between s'en charge déjà). */
@media (min-width: 1024px) {
	.lk-header .wp-block-navigation__responsive-container-open { display: none !important; }
	.lk-header .wp-block-navigation__responsive-container {
		position: static !important;
		inset: auto !important;
		width: auto !important;
		height: auto !important;
		max-width: none !important;
		background: transparent !important;
		display: block !important;
		animation: none !important;
	}
	.lk-header .wp-block-navigation__responsive-close,
	.lk-header .wp-block-navigation__responsive-dialog,
	.lk-header .wp-block-navigation__responsive-container-content {
		position: static !important;
		display: block !important;
		width: auto !important;
		height: auto !important;
		max-width: none !important;
		padding: 0 !important;
		margin: 0 !important;
		background: transparent !important;
		overflow: visible !important;
	}
	.lk-header .wp-block-navigation__responsive-container-close { display: none !important; }
	.lk-header .wp-block-navigation__responsive-container-content::before { content: none !important; }
	.lk-header .wp-block-navigation__container {
		display: flex !important;
		flex-direction: row !important;
		align-items: center !important;
		gap: 28px !important;
		width: 100% !important;
		counter-reset: none !important;
	}
	.lk-header .wp-block-navigation-item {
		width: auto !important;
		grid-column: auto !important;
		animation: none !important;
	}
	/* Police du menu complet +1pt (≈ +1.33px) par rapport aux 13px d'origine
	   (demande cliente du 22 sept. 2026). */
	.lk-header .wp-block-navigation-item:not(.lk-nav-bas) a {
		display: inline-flex !important;
		font-family: var(--lk-sans) !important;
		font-size: 14px !important;
		font-weight: 400 !important;
		letter-spacing: 0 !important;
		color: var(--lk-papier) !important;
		padding: 0 !important;
	}
	.lk-header .wp-block-navigation-item:not(.lk-nav-bas) a::before { content: none !important; }
	.lk-header .wp-block-navigation-item:not(.lk-nav-bas) a:hover { color: #C5B6A1 !important; }
	/* FR/EN poussé complètement à droite ; le courriel (aussi en bas de
	   panneau sur mobile/tablette) ne fait pas partie du menu complet. */
	.lk-header .lk-nav-courriel { display: none !important; }
	.lk-header .lk-nav-bas {
		margin: 0 0 0 auto !important;
		padding: 0 !important;
		border: 0 !important;
	}
	.lk-header .lk-nav-bas a { font-size: 14px !important; }
}

/* ============================================================
   3. UTILITAIRES DE MISE EN PAGE
   ============================================================ */
/* WordPress pose `margin-block-start: 24px` sur chaque enfant d'un groupe sauf
   le premier (:root :where(.is-layout-flow) > *). Dans une grille ou des
   colonnes CSS, ce décalage casse l'alignement de tout ce qui n'est pas le
   premier enfant. On l'annule dans tous les conteneurs en grille du thème. */
:root .lk-vedettes > *,
:root .lk-note > *,
:root .lk-footer-colonnes > *,
:root .lk-cv-grille > *,
:root .lk-video-grille > *,
:root .lk-demarche-ouverture > *,
:root .lk-bio-grille > *,
:root .lk-contact-grille > *,
:root .lk-projet-row > *,
:root .lk-intervention-legende > *,
:root .lk-projets-menu-liste .wp-block-post-template > *,
:root .lk-interventions-liste .wp-block-post-template > *,
:root .lk-intervention-carte > * { margin-block-start: 0; }

.lk-label {
	font-family: var(--lk-sans);
	font-size: 11px;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: var(--lk-muet);
	margin: 0;
}
.lk-label p, .lk-label .wp-block-lilianekeeler-meta { font: inherit; color: inherit; margin: 0; }
.lk-lien-texte { margin: 0; }
.lk-lien-texte a, .wp-block-read-more.lk-lien-texte {
	display: inline-flex;
	align-items: center;
	justify-content: space-between;
	gap: 28px;
	padding: 10px 0;
	font-family: var(--lk-sans);
	font-size: 14px;
	color: inherit;
	text-decoration: none;
	border-bottom: 1px solid currentColor;
}
.lk-lien-texte a span, .wp-block-read-more.lk-lien-texte::after { transition: transform 0.3s; }
.wp-block-read-more.lk-lien-texte::after { content: "↗"; }
.wp-block-read-more.lk-lien-texte:hover::after { transform: translate(3px, 3px); }
.lk-lien-texte a:hover span { transform: translate(3px, 3px); }
/* Lien étiré : rend toute la carte cliquable (position:relative sur la carte). */
.lk-lien-etire::after { content: ""; position: absolute; inset: 0; }

/* ============================================================
   4. ACCUEIL — HERO
   Page tout en noir, texte à gauche / Marchette mosaïquée (détail) à
   droite, en plus grand format — corrections client des 17 et 22 sept.
   2026 (le 22 remplace la disposition centrée du 17 par un côte à côte,
   et agrandit l'image). Les blocs Projet / Interventions / Démarche
   restent retirés : la page d'accueil se limite à ce bloc unique.
   ============================================================ */
.lk-main-accueil > .lk-hero { margin-top: 0; }
.lk-hero {
	display: grid;
	grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
	align-items: center;
	gap: 6%;
	padding: 70px 6%;
	box-sizing: border-box;
	background: var(--lk-papier);
	color: var(--lk-noir);
	min-height: calc(100vh - var(--lk-entete-h));
}
/* Nom en caractères Romains (police du site), plus la signature manuscrite
   (demande cliente du 30 sept. 2026, remplace le SVG du 22 sept.). */
.lk-hero .lk-hero-titre {
	margin: 0;
	font-family: var(--lk-serif);
	font-size: clamp(34px, 4.2vw, 50px);
	font-weight: 400;
	line-height: 1.05;
	letter-spacing: -0.03em;
	color: var(--lk-noir);
	animation: lk-text-in 0.8s 0.1s both;
}
.lk-visually-hidden {
	position: absolute;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}
.lk-hero .lk-hero-soustitre {
	margin: 10px 0 0;
	font-family: var(--lk-sans);
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--lk-muet);
	animation: lk-text-in 0.8s 0.18s both;
}
.lk-hero .lk-hero-phrase {
	margin: 26px 0 0;
	max-width: 34ch;
	font-family: var(--lk-serif);
	font-style: normal;
	font-size: clamp(17px, 1.6vw, 20px);
	line-height: 1.5;
	color: var(--lk-noir);
	animation: lk-text-in 0.8s 0.24s both;
}
.lk-hero-vedette-bloc { animation: lk-text-in 0.9s 0.3s both; }
.lk-hero .lk-hero-vedette { margin: 0; }
.lk-hero .lk-hero-vedette a { display: block; }
.lk-hero .lk-hero-vedette img {
	width: 100%;
	height: auto;
	display: block;
	animation: lk-image-in 1.4s var(--lk-courbe) both;
}
.lk-hero .lk-hero-legende {
	margin: 16px 0 0;
	font-family: var(--lk-sans);
	font-size: 13px;
	line-height: 1.5;
	color: var(--lk-muet);
}
.lk-hero .lk-hero-legende em { font-style: italic; }
.lk-hero .lk-hero-legende a { color: var(--lk-noir); text-decoration: underline; text-underline-offset: 3px; }
.lk-hero .lk-hero-legende a:hover { color: var(--lk-accent); }
@media (max-width: 900px) {
	.lk-hero { grid-template-columns: 1fr; gap: 42px; padding: 60px 7% 70px; min-height: 0; }
	.lk-hero .lk-hero-signature { width: clamp(200px, 58vw, 280px); }
	.lk-hero .lk-hero-phrase { max-width: none; }
}

/* ============================================================
   5. ACCUEIL — VEDETTES (projet + interventions, côte à côte)
   ============================================================ */
.lk-vedettes {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 36px;
	padding: 55px var(--lk-gouttiere) 65px;
	background: var(--lk-papier);
}
.lk-vedette { position: relative; display: flex; flex-direction: column; min-width: 0; margin: 0; }
.lk-vedette .wp-block-post-template { display: flex; flex-direction: column; flex: 1; margin: 0; padding: 0; list-style: none; }
.lk-vedette .wp-block-post-template > li { display: flex; flex-direction: column; flex: 1; }
.lk-vedette .lk-vedette-media { margin: 0; overflow: hidden; background: #E3E1DA; aspect-ratio: 1.22; }
.lk-vedette .lk-vedette-media a { display: block; height: 100%; }
.lk-vedette .lk-vedette-media img {
	width: 100%; height: 100%; object-fit: cover; display: block;
	transition: transform 0.8s var(--lk-courbe);
}
.lk-vedette:hover .lk-vedette-media img { transform: scale(1.025); }
.lk-vedette .lk-vedette-legende { display: flex; flex-direction: column; align-items: flex-start; flex: 1; padding-top: 23px; }
.lk-vedette .lk-vedette-titre {
	font-family: var(--lk-serif);
	font-size: clamp(29px, 3.8vw, 40px);
	font-weight: 400;
	line-height: 1.12;
	letter-spacing: -0.035em;
	margin: 11px 0 14px;
}
.lk-vedette .lk-vedette-titre a { color: inherit; text-decoration: none; }
.lk-vedette .lk-vedette-texte { font-size: 17px; line-height: 1.5; max-width: 35ch; margin: 0 0 24px; }
.lk-vedette .lk-vedette-texte p { margin: 0; }
.lk-vedette .lk-vedette-texte .wp-block-post-excerpt__more-text { display: none; }
.lk-vedette .lk-lien-texte { margin-top: auto; min-width: 110px; }
.lk-vedette .lk-lien-texte a, .lk-vedette .wp-block-read-more { margin-top: auto; min-width: 110px; }
@media (max-width: 620px) {
	.lk-vedettes { grid-template-columns: 1fr; gap: 38px; padding: 35px 6% 45px; }
	.lk-vedette .lk-vedette-media { aspect-ratio: 1.3; }
	.lk-vedette .lk-vedette-titre { font-size: 32px; }
	.lk-vedette .lk-vedette-legende { padding-top: 18px; }
	.lk-vedette .lk-vedette-texte { font-size: 16px; margin-bottom: 16px; }
}

/* Révélation au défilement (masque bas → haut + léger dézoom).
   Le clip-path est sur l'IMAGE, pas sur le conteneur observé (.lk-mask) : un
   élément qui se découpe lui-même a un rectangle d'intersection vide et
   l'IntersectionObserver ne se déclenche jamais. */
.lk-mask .lk-vedette-media {
	clip-path: inset(100% 0 0 0);
	transition: clip-path 0.95s var(--lk-courbe);
	will-change: clip-path;
}
.lk-mask.lk-revealed .lk-vedette-media { clip-path: inset(0 0 0 0); }
.lk-mask.lk-revealed .lk-vedette-media img { animation: lk-image-in 1.1s var(--lk-courbe) both; }
.lk-mask .lk-vedette-legende {
	opacity: 0;
	transform: translateY(12px);
	transition: opacity 0.6s 0.18s, transform 0.6s 0.18s;
}
.lk-mask.lk-revealed .lk-vedette-legende { opacity: 1; transform: none; }
.lk-mask-delai .lk-vedette-media { transition-delay: 0.1s; }

/* ============================================================
   6. ACCUEIL — NOTE « La démarche »
   ============================================================ */
.lk-note {
	background: var(--lk-note);
	padding: 58px 8%;
	display: grid;
	grid-template-columns: 1fr 2fr;
	gap: 40px;
	align-items: start;
}
.lk-note .lk-note-citation {
	font-family: var(--lk-serif);
	font-size: clamp(26px, 3.8vw, 39px);
	line-height: 1.25;
	letter-spacing: -0.025em;
	margin: 0 0 24px;
}
@media (max-width: 620px) {
	.lk-note { display: block; padding: 34px 7%; }
	.lk-note > .lk-label { margin-bottom: 22px; }
}

/* ============================================================
   7. PAGES INTÉRIEURES — EN-TÊTE COMMUN
   ============================================================ */
.lk-page-entete { padding: 60px var(--lk-gouttiere) 42px; }
.lk-page-entete .lk-page-titre {
	font-family: var(--lk-serif);
	font-size: clamp(34px, 4.2vw, 50px); /* même gabarit que le nom sur l'Accueil (corrections 5 oct.) */
	font-weight: 400;
	line-height: 1.07;
	letter-spacing: -0.035em;
	margin: 14px 0 18px;
}
.lk-page-entete .lk-page-sous-titre { max-width: none; color: var(--lk-muet); font-size: 17px; margin: 0; }
/* Sous-titre sur une seule ligne dès que l'écran le permet (demande cliente, 19 oct. 2026). */
@media (min-width: 760px) { .lk-page-entete .lk-page-sous-titre { white-space: nowrap; } }
.lk-page-corps { padding: 0 var(--lk-gouttiere) 70px; }
@media (max-width: 620px) {
	.lk-page-entete { padding: 38px 6% 25px; }
	.lk-page-entete .lk-page-titre { font-size: 34px; }
	.lk-page-entete .lk-page-sous-titre { font-size: 16px; }
}

/* Apparition douce des blocs de texte (.lk-reveal-texte → .lk-revealed). */
.lk-reveal-texte {
	opacity: 0;
	transform: translateY(12px);
	transition: opacity 0.65s, transform 0.65s var(--lk-courbe);
}
.lk-reveal-texte.lk-revealed { opacity: 1; transform: none; }

/* ============================================================
   8. PROJETS — liste chronologique
   ============================================================ */
.lk-projets-liste { padding: 0 var(--lk-gouttiere) 70px; margin: 0; }
.lk-projets-liste .wp-block-post-template { display: block; margin: 0; padding: 0; list-style: none; }
.lk-projet-row {
	display: grid;
	grid-template-columns: 52px minmax(110px, 32%) 1fr;
	gap: 24px;
	align-items: center;
	padding: 26px 0;
	border-top: 1px solid var(--lk-ligne);
}
.lk-projet-row .lk-projet-annee { font-size: 14px; color: var(--lk-accent); align-self: start; padding-top: 4px; }
.lk-projet-row .lk-projet-vignette { margin: 0; aspect-ratio: 1.42; overflow: hidden; background: var(--lk-ligne); }
.lk-projet-row .lk-projet-vignette a { display: block; height: 100%; }
.lk-projet-row .lk-projet-vignette img {
	width: 100%; height: 100%; display: block; object-fit: cover;
	transition: transform 0.7s var(--lk-courbe);
}
.lk-projet-row .lk-projet-titre {
	font-family: var(--lk-serif);
	font-size: clamp(21px, 2.8vw, 30px);
	font-weight: 400;
	line-height: 1.12;
	letter-spacing: -0.035em;
	margin: 0;
}
.lk-projet-row .lk-projet-titre a { color: inherit; text-decoration: none; }
.lk-projet-row:hover img { transform: scale(1.04); }
.lk-projet-row:hover .lk-projet-titre a { color: var(--lk-accent); }
@media (max-width: 620px) {
	.lk-projets-liste { padding: 0 6% 40px; }
	.lk-projet-row { grid-template-columns: 42px 1fr; gap: 10px; padding: 20px 0; }
	.lk-projet-row .lk-projet-vignette { grid-column: 2; aspect-ratio: 1.5; }
	.lk-projet-row .lk-projet-titre { grid-column: 2; grid-row: 2; font-size: 24px; }
}

/* ============================================================
   9. INTERVENTIONS URBAINES — grille + visionneuse
   ============================================================ */
.lk-interventions-liste { padding: 0 var(--lk-gouttiere) 65px; margin: 0; }
.lk-interventions-liste .wp-block-post-template {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 30px 22px;
	align-items: start;
	margin: 0; padding: 0; list-style: none;
}
.lk-intervention-carte { min-width: 0; }
.lk-intervention-carte .lk-intervention-media { margin: 0; overflow: hidden; cursor: zoom-in; }
.lk-intervention-carte .lk-intervention-media img {
	width: 100%; height: 260px; object-fit: cover; display: block;
	transition: transform 0.7s var(--lk-courbe);
}
.lk-intervention-carte:hover .lk-intervention-media img { transform: scale(1.025); }
/* Case grise tant qu'aucune photo n'est ajoutée à la fiche. */
.lk-intervention-carte:not(:has(.lk-intervention-media)) { position: relative; padding-top: 260px; }
.lk-intervention-carte:not(:has(.lk-intervention-media))::before {
	content: var(--lk-t-photo, "Photo à venir");
	position: absolute; top: 0; left: 0; right: 0; height: 260px;
	display: flex; align-items: center; justify-content: center;
	background: #E3E1DA; color: #68645D; font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase;
	border: 1px dashed #B7B2A7; box-sizing: border-box;
}
.lk-intervention-legende { padding-top: 12px; }
/* Ligne principale : lieu · année, en serif. */
/* font-size:0 sur le conteneur avale l'espace HTML entre les deux méta, pour que
   « · année » reste soudé au dernier mot du lieu (taille rétablie sur les enfants). */
.lk-intervention-meta { display: block !important; font-size: 0; line-height: 1.2; color: var(--lk-noir); }
.lk-intervention-meta > * { font-family: var(--lk-serif); font-size: clamp(20px, 2vw, 24px); letter-spacing: -0.02em; }
/* Le numéro, discret, sous le lieu (titre de la fiche : « Mosaïque nº 3 »). */
.lk-intervention-legende .lk-intervention-titre {
	font-family: var(--lk-sans); font-size: 12px; font-weight: 500; letter-spacing: 0.06em; text-transform: uppercase;
	color: var(--lk-muet); margin: 6px 0 0;
}
/* « Lieu · année » : le point et l'année restent soudés au dernier mot du lieu. */
.lk-intervention-meta .wp-block-lilianekeeler-meta + .wp-block-lilianekeeler-meta::before { content: "\00a0·\00a0"; }
@media (max-width: 620px) {
	.lk-interventions-liste .wp-block-post-template { grid-template-columns: 1fr 1fr; gap: 25px 15px; }
	.lk-intervention-carte .lk-intervention-media img,
	.lk-intervention-carte:not(:has(.lk-intervention-media))::before { height: 190px; }
	.lk-intervention-carte:not(:has(.lk-intervention-media)) { padding-top: 190px; }
	.lk-intervention-legende { display: block; }
	/* Colonnes étroites : l'année passe sous le lieu, sans point médian. */
	.lk-intervention-meta > * + * { display: block; }
	.lk-intervention-meta .wp-block-lilianekeeler-meta + .wp-block-lilianekeeler-meta::before { content: none; }
}

/* Texte de présentation au-dessus de la grille. */
.lk-interventions-texte { padding: 0 var(--lk-gouttiere) 56px; }
.lk-interventions-texte > * { max-width: var(--lk-texte-max); }
.lk-interventions-texte .lk-lecture { max-width: none; }
.lk-interventions-texte .lk-lecture p { text-align: justify; hyphens: manual; font-size: clamp(17px, 1.15vw, 19px); }
.lk-interventions-texte .lk-projet-mention { font-size: 14px; color: var(--lk-muet); }
/* Note sous la légende (Réparée, Remplacée par #13, En hommage à…). */
.lk-intervention-note { margin: 4px 0 0; font-size: 12px; color: var(--lk-muet); }
.lk-intervention-note p { margin: 0; }
.lk-intervention-note .wp-block-post-excerpt__more-text { display: none; }
/* URL de la vidéo : portée par le bloc méta, lue par site.js, jamais affichée. */
.lk-intervention-video, .lk-intervention-extras, .lk-cadrage { display: none !important; }
/* Pastille « lecture » sur l'affiche des fiches vidéo (classe posée par site.js). */
.lk-intervention-carte.has-video .lk-intervention-media { position: relative; }
.lk-intervention-carte.has-video .lk-intervention-media::after {
	content: "▶"; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
	width: 43px; height: 43px; border-radius: 50%; display: grid; place-items: center;
	background: rgba(250, 249, 246, 0.93); color: var(--lk-noir); font-size: 16px; padding-left: 3px; box-sizing: border-box;
	pointer-events: none;
}
.lk-zoom video { display: block; max-width: 100%; width: auto; max-height: 660px; height: auto; margin: auto; background: #000; }
/* Une seule vue à la fois : hidden doit l'emporter sur display:block. */
.lk-zoom img[hidden], .lk-zoom video[hidden] { display: none; }
/* Sélecteur de vues (Avant / Après / Processus) sous la légende. */
.lk-zoom-vues { display: flex; justify-content: center; gap: 8px; margin-top: 14px; flex-wrap: wrap; }
.lk-zoom-vues[hidden] { display: none; }
.lk-zoom-vues button { padding: 7px 12px; min-height: 0; font-size: 13px; }
.lk-zoom-vues button[aria-pressed="true"] { background: var(--lk-papier); color: var(--lk-noir); border-color: var(--lk-papier); }

/* Visionneuse (construite par site.js) : fond sombre, image à sa résolution
   native, légende, précédente / suivante. */
.lk-zoom {
	position: fixed; inset: 0; z-index: 200;
	background: var(--lk-noir); color: var(--lk-papier);
	padding: 12px 4% 35px;
	overflow-y: auto;
	box-sizing: border-box;
	font-family: var(--lk-sans);
}
.lk-zoom[hidden] { display: none; }
.lk-zoom-barre { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 20px; font-size: 14px; min-height: 44px; }
.lk-zoom button {
	background: none; border: 1px solid #787870; color: inherit;
	padding: 10px 15px; min-height: 44px; font: inherit; font-size: 14px; cursor: pointer;
}
.lk-zoom button:hover { border-color: var(--lk-papier); }
.lk-zoom figure { background: #202021; padding: 16px; margin: 0; }
.lk-zoom img { display: block; max-width: 100%; width: auto; max-height: 660px; height: auto; margin: auto; }
.lk-zoom figcaption { font-size: 14px; text-align: center; margin: 18px 0 2px; color: #D1CFC8; }
.lk-zoom-controles { display: flex; justify-content: center; gap: 22px; align-items: center; margin-top: 22px; font-size: 13px; }
@media (max-width: 620px) {
	.lk-zoom { padding-inline: 3%; }
	.lk-zoom-barre { font-size: 12px; }
	.lk-zoom figure { padding: 8px; }
	.lk-zoom-controles { gap: 10px; }
	.lk-zoom-controles button { padding: 10px; }
}

/* ============================================================
   10. DÉMARCHE ARTISTIQUE
   ============================================================ */
.lk-demarche { padding: 0 var(--lk-gouttiere) 72px; }
/* Colonne image réduite (0.68fr au lieu de 1fr) pour que le texte se
   rapproche de l'image plutôt que de laisser un grand vide (retour client
   du 22 sept. 2026 après la réduction de l'image). */
.lk-demarche-ouverture { display: grid; grid-template-columns: 0.68fr 1.3fr; gap: 6%; align-items: start; }
.lk-demarche-image { margin: 0; }
.lk-demarche-image img { width: 100%; height: auto; display: block; }
.lk-demarche-image .wp-element-caption { margin: 10px 0 0; font-size: 13px; color: var(--lk-muet); text-align: left; }
.lk-lecture p { font-size: 17px; line-height: 1.7; margin: 0 0 22px; }
.lk-lecture p:last-child { margin-bottom: 0; }
.lk-citation {
	font-family: var(--lk-serif);
	font-size: clamp(27px, 4.8vw, 50px);
	font-weight: 400;
	line-height: 1.2;
	letter-spacing: -0.035em;
	margin: 60px 0;
	padding: 45px 8%;
	border: 0;
	border-block: 1px solid var(--lk-ligne);
	color: var(--lk-accent);
	font-style: normal;
}
.lk-citation p { margin: 0; font-size: inherit; line-height: inherit; }
.lk-citation em { font-style: italic; }
/* Même grille que .lk-demarche-ouverture (colonne fantôme + texte en colonne
   2) pour que ce bloc fasse exactement la même largeur que le paragraphe du
   haut, au lieu d'un max-width en ch qui ne correspondait à rien de précis
   (retour client du 22 sept. 2026). */
.lk-lecture-suite {
	display: grid;
	grid-template-columns: 0.68fr 1.3fr;
	gap: 0 6%;
	max-width: none;
	margin-left: 0;
}
.lk-lecture-suite > * { grid-column: 2; }
@media (max-width: 620px) {
	.lk-demarche-ouverture { grid-template-columns: 1fr; gap: 28px; }
	.lk-demarche-image { aspect-ratio: 1.3; max-width: 85%; }
	.lk-lecture-suite { grid-template-columns: 1fr; }
	.lk-lecture-suite > * { grid-column: 1; }
	.lk-lecture p { font-size: 17px; }
	.lk-citation { padding: 30px 0; margin: 35px 0; font-size: 31px; }
}

/* Vidéos : lecteurs intégrés, habillés en cartes. */
.lk-videos { border-top: 1px solid var(--lk-ligne); margin-top: 55px; padding-top: 35px; }
.lk-videos .lk-videos-titre { font-family: var(--lk-serif); font-size: clamp(26px, 3vw, 30px); font-weight: 400; line-height: 1.1; letter-spacing: -0.035em; margin: 0 0 26px; }
.lk-video-grille { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 26px; }
.lk-video-carte { min-width: 0; }
.lk-video-carte .wp-block-embed { margin: 0; background: var(--lk-noir); }
.lk-video-carte .lk-video-titre { font-family: var(--lk-serif); font-size: 24px; font-weight: 400; line-height: 1.2; letter-spacing: -0.02em; margin: 16px 0 8px; }
.lk-video-carte .lk-video-meta { font-size: 12px; color: var(--lk-muet); margin: 0 0 12px; }
.lk-video-carte .lk-video-desc { font-size: 15px; line-height: 1.55; color: #4A4943; margin: 0; }
@media (max-width: 620px) {
	.lk-video-grille { grid-template-columns: 1fr; gap: 32px; }
	.lk-videos .lk-videos-titre { font-size: 26px; }
	.lk-video-carte .wp-block-embed { max-width: 450px; }
}

/* ============================================================
   11. BIO + CV
   ============================================================ */
.lk-bio-grille { padding: 0 var(--lk-gouttiere) 50px; display: grid; grid-template-columns: 0.8fr 1.2fr; gap: 8%; align-items: start; }
.lk-bio-portrait { margin: 5px 0 0; }
.lk-bio-portrait img { width: 100%; max-width: 320px; height: auto; display: block; }
.lk-cv-section { padding: 20px var(--lk-gouttiere) 70px; border-top: 1px solid var(--lk-ligne); }
.lk-cv-entete { display: flex; align-items: baseline; justify-content: space-between; gap: 28px; padding-top: 40px; margin-bottom: 30px; }
.lk-cv-entete .lk-cv-titre-section { font-family: var(--lk-serif); font-size: 38px; font-weight: 400; letter-spacing: -0.035em; margin: 0; }
.lk-cv-telecharger {
	background: none; border: 0; border-bottom: 1px solid currentColor;
	color: var(--lk-accent); padding: 0 0 4px; font-size: 14px; white-space: nowrap; text-decoration: none;
}
.lk-cv-telecharger:hover { color: var(--lk-noir); }
.lk-cv-telecharger-p { margin: 0; }
/* Colonnes CSS plutôt qu'une grille : 15 blocs de hauteurs très inégales ;
   break-inside:avoid empêche qu'un bloc soit coupé entre les deux colonnes. */
.lk-cv-grille { columns: 2; column-gap: 48px; margin: 0; }
.lk-cv-bloc { break-inside: avoid; border-top: 1px solid var(--lk-ligne); padding: 20px 0 24px; }
.lk-cv-titre {
	font-family: var(--lk-sans); font-size: 14px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase;
	color: var(--lk-noir); margin: 0 0 12px;
}
.lk-cv-entree { font-size: 15px; line-height: 1.52; margin: 0 0 8px; }
.lk-cv-entree:last-child { margin-bottom: 0; }
.lk-cv-meta { color: var(--lk-muet); }
@media (max-width: 620px) {
	.lk-bio-grille { grid-template-columns: 1fr; gap: 28px; }
	.lk-bio-portrait img { max-width: 230px; }
	.lk-cv-entete { display: block; padding-top: 30px; margin-bottom: 24px; }
	.lk-cv-entete .lk-cv-titre-section { font-size: 32px; margin-bottom: 14px; }
	.lk-cv-grille { columns: 1; }
	.lk-cv-bloc { padding: 18px 0; }
}

/* ============================================================
   11b. PAGE PROJET (single-projet.html)
   Colonne de lecture centrée (62ch) ; les œuvres s'affichent dans une
   colonne plus large (960px), les portraits sont limités en hauteur.
   ============================================================ */
.lk-projet-corps { padding: 0 var(--lk-gouttiere) 40px; }
.lk-projet-corps .wp-block-post-content { max-width: var(--lk-texte-max); margin: 0 auto; }
.lk-projet-corps p { max-width: none; margin: 0 0 22px; font-size: clamp(17px, 1.15vw, 19px); line-height: 1.7; text-align: justify; hyphens: manual; }
.lk-projet-corps .lk-projet-mention { font-size: 14px; color: var(--lk-muet); }
.lk-projet-corps .lk-projet-volet {
	font-family: var(--lk-serif); font-size: clamp(24px, 3vw, 30px); font-weight: 400; line-height: 1.1;
	letter-spacing: -0.035em; margin: 64px 0 22px; padding-top: 32px; border-top: 1px solid var(--lk-ligne);
}
/* Œuvre seule : pleine colonne ; portrait : hauteur bornée, centrée. */
.lk-projet-corps .lk-oeuvre { margin: 36px auto 44px; max-width: 960px; }
.lk-projet-corps .lk-oeuvre img { width: 100%; height: auto; display: block; }
.lk-projet-corps .lk-oeuvre-portrait img { width: auto; max-width: 100%; max-height: 82vh; margin: 0 auto; }
.lk-projet-corps .wp-element-caption {
	margin: 12px 0 0; font-size: 13px; line-height: 1.5; color: var(--lk-muet); text-align: left;
}
.lk-projet-corps .lk-oeuvre-portrait .wp-element-caption { text-align: center; }
/* Ajustements de taille demandés par la cliente (30 sept. 2026). */
.lk-projet-corps .lk-oeuvre-portrait.lk-oeuvre-grand img { max-height: 95vh; }
.lk-projet-corps .lk-oeuvre-portrait.lk-oeuvre-petit img { max-height: 54vh; }
.lk-projet-corps .lk-serie.lk-serie-reduite { max-width: 76%; margin-left: auto; margin-right: auto; }
/* Série uniforme : toutes les vignettes à la même taille (3 colonnes), séries de 2 centrées. */
.lk-projet-corps .lk-serie.lk-serie-uniforme { grid-template-columns: repeat(auto-fit, calc((100% - 44px) / 3)); justify-content: center; }
/* Séries : œuvres en grille, alignées en haut, légendes sous chacune. */
.lk-projet-corps .lk-serie { display: grid; gap: 28px 22px; align-items: start; margin: 36px 0 20px; }
.lk-projet-corps .lk-serie-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.lk-projet-corps .lk-serie-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.lk-projet-corps .lk-serie-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
:root .lk-projet-corps .lk-serie > * { margin: 0; }
.lk-projet-corps .lk-serie img { width: 100%; height: auto; display: block; }
/* Les quatre impressions d'Histoire d'une chute (Détresse, Radiographie, Cicatrices, Renaître) : même hauteur,
   cadrage identique : les quatre photos ont été recadrées pour que la toile ait la même taille et la même place (demande cliente, 27 oct. 2026). */
.lk-projet-corps .lk-impressions img { aspect-ratio: 817 / 1500; object-fit: cover; }
.lk-projet-corps .lk-serie-legende { font-size: 13px; color: var(--lk-muet); max-width: none; margin: 0 0 44px; }
/* Logo du CALQ (version noire, fournie par la cliente, 22 oct. 2026) : à gauche, petit sous la mention
   de soutien, plus grand après les images Lignes de résilience. */
.lk-projet-corps .lk-calq { margin: 18px 0 0; max-width: none; text-align: left; }
.lk-projet-corps .lk-calq img { display: block; width: 118px; height: auto; margin: 0; }
.lk-projet-corps .lk-calq-grand { margin: 56px 0 0; }
.lk-projet-corps .lk-calq-grand img { width: 230px; }
@media (max-width: 620px) {
	.lk-projet-corps .lk-calq img { width: 96px; }
	.lk-projet-corps .lk-calq-grand img { width: 180px; }
}
.lk-projet-corps .lk-projet-credit {
	margin: 56px 0 0; padding-top: 20px; border-top: 1px solid var(--lk-ligne);
	font-size: 13px; color: var(--lk-muet);
}
@media (max-width: 620px) {
	.lk-projet-corps .lk-projet-volet { margin-top: 44px; }
	.lk-projet-corps .lk-serie-2 { grid-template-columns: 1fr; }
	.lk-projet-corps .lk-serie-3, .lk-projet-corps .lk-serie-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 14px; }
	.lk-projet-corps .lk-oeuvre-portrait img { max-height: 70vh; }
	.lk-projet-corps .lk-oeuvre-portrait.lk-oeuvre-grand img { max-height: 76vh; }
	.lk-projet-corps .lk-oeuvre-portrait.lk-oeuvre-petit img { max-height: 50vh; }
	.lk-projet-corps .lk-serie.lk-serie-reduite { max-width: 100%; }
	.lk-projet-corps .lk-serie.lk-serie-uniforme { grid-template-columns: repeat(2, minmax(0, 1fr)); justify-content: stretch; }
}

/* Vignettes carrées cliquables (agrandissement dans une visionneuse plein
   écran — voir .lk-zoom plus bas, réutilisée pour les œuvres). Activé
   groupe par groupe via .lk-vignettes sur le conteneur .lk-serie, le temps
   du déploiement page par page (corrections client, 17 sept. 2026). */
.lk-serie.lk-vignettes .wp-block-image { cursor: pointer; margin: 0; position: relative; }
.lk-serie.lk-vignettes .wp-block-image img { aspect-ratio: 1 / 1; object-fit: cover; transition: filter 0.25s; }
.lk-serie.lk-vignettes .wp-block-image:hover img,
.lk-serie.lk-vignettes .wp-block-image:focus-visible img { filter: brightness(0.7); }
/* Loupe superposee au survol/focus, indique l'agrandissement (demande cliente
   du 30 sept. 2026, remplace l'ancien effet d'eclaircissement). */
.lk-serie.lk-vignettes .wp-block-image::after {
	content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Ccircle cx='16' cy='16' r='15' fill='rgba(23,23,26,0.55)'/%3E%3Ccircle cx='13' cy='13' r='5' fill='none' stroke='white' stroke-width='2'/%3E%3Cline x1='17' y1='17' x2='22' y2='22' stroke='white' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
	position: absolute;
	top: 50%;
	left: 50%;
	width: 40px;
	height: 40px;
	transform: translate(-50%, -50%);
	opacity: 0;
	transition: opacity 0.25s;
	pointer-events: none;
}
.lk-serie.lk-vignettes .wp-block-image:hover::after,
.lk-serie.lk-vignettes .wp-block-image:focus-visible::after { opacity: 1; }

/* Menu des projets en bas de page : photo, année, titre ; projet courant marqué. */
.lk-projets-menu { padding: 56px var(--lk-gouttiere) 70px; border-top: 1px solid var(--lk-ligne); background: var(--lk-note); }
.lk-projets-menu-entete { margin-bottom: 30px; }
.lk-projets-menu-titre {
	font-family: var(--lk-serif); font-size: clamp(30px, 4vw, 40px); font-weight: 400; line-height: 1.1;
	letter-spacing: -0.035em; margin: 10px 0 0;
}
.lk-projets-menu-liste { margin: 0; }
.lk-projets-menu-liste .wp-block-post-template {
	display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px 22px;
	margin: 0; padding: 0; list-style: none;
}
.lk-projet-carte { position: relative; min-width: 0; }
.lk-projet-carte .lk-projet-carte-media { margin: 0; aspect-ratio: 1.42; overflow: hidden; background: var(--lk-ligne); }
.lk-projet-carte .lk-projet-carte-media a { display: block; height: 100%; }
.lk-projet-carte .lk-projet-carte-media img {
	width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.7s var(--lk-courbe);
}
.lk-projet-carte:hover .lk-projet-carte-media img { transform: scale(1.04); }
.lk-projet-carte .lk-projet-carte-annee { display: block; margin-top: 14px; font-size: 13px; color: var(--lk-accent); }
.lk-projet-carte .lk-projet-carte-titre {
	font-family: var(--lk-serif); font-size: clamp(22px, 2.4vw, 27px); font-weight: 400; line-height: 1.15;
	letter-spacing: -0.03em; margin: 4px 0 0;
}
.lk-projet-carte .lk-projet-carte-titre a { color: inherit; text-decoration: none; }
.lk-projet-carte:hover .lk-projet-carte-titre a { color: var(--lk-accent); }
/* Projet courant : image atténuée + trait sous le titre. */
.lk-projet-carte.is-current .lk-projet-carte-media img { opacity: 0.55; }
.lk-projet-carte.is-current .lk-projet-carte-titre a { text-decoration: underline; text-underline-offset: 6px; text-decoration-thickness: 1px; }
.lk-projet-carte.is-current::after {
	content: "Vous êtes ici"; position: absolute; top: 10px; left: 10px;
	font-family: var(--lk-sans); font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase;
	background: var(--lk-papier); color: var(--lk-noir); padding: 5px 8px;
}
@media (max-width: 620px) {
	.lk-projets-menu { padding: 40px 6% 50px; }
	.lk-projets-menu-liste .wp-block-post-template { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 14px; }
	.lk-projet-carte .lk-projet-carte-titre { font-size: 19px; hyphens: auto; }
}

/* ============================================================
   12. CONTACT
   ============================================================ */
.lk-contact-grille { padding: 0 var(--lk-gouttiere) 70px; display: grid; grid-template-columns: 1fr 1fr; gap: 8%; align-items: start; }
.lk-contact-courriel { margin: 0; font-size: 18px; overflow-wrap: anywhere; }
.lk-contact-courriel a { text-underline-offset: 5px; }
.lk-contact-reseaux { margin: 22px 0 0; font-size: 15px; line-height: 1.8; }
.lk-contact-reseaux a { text-decoration: none; }
.lk-contact-reseaux a:hover { text-decoration: underline; }
.lk-contact-form { display: grid; gap: 20px; }
.lk-form-field { display: grid; gap: 7px; }
.lk-form-field label { font-size: 14px; }
.lk-form-optional { color: var(--lk-muet); font-weight: 400; }
.lk-form-field input, .lk-form-field textarea {
	width: 100%;
	border: 1px solid #B7B2A7;
	border-radius: 0;
	background: var(--lk-papier);
	color: var(--lk-noir);
	font-family: inherit; font-size: 16px; padding: 12px;
	box-sizing: border-box;
}
.lk-form-field textarea { min-height: 110px; resize: vertical; }
.lk-form-submit {
	justify-self: start; width: auto;
	background: var(--lk-noir); color: var(--lk-papier);
	padding: 12px 22px; border: 0; font-family: inherit; font-size: 15px; cursor: pointer;
}
.lk-form-submit:hover { background: var(--lk-accent); }
.lk-form-mention { font-size: 13px; color: var(--lk-muet); max-width: 400px; line-height: 1.5; }
.lk-form-notice { padding: 14px 18px; margin-bottom: 4px; font-size: 15px; }
.lk-form-notice--ok { background: #EEF3EA; color: #3C5C2C; }
.lk-form-notice--erreur { background: #F6E9E4; color: #7A3220; }
@media (max-width: 620px) {
	.lk-contact-grille { grid-template-columns: 1fr; gap: 28px; }
}

/* ============================================================
   13. CONFIDENTIALITÉ
   ============================================================ */
.lk-confidentialite-texte { display: flex; flex-direction: column; gap: 32px; max-width: 720px; }
.lk-confidentialite-texte h3 { margin: 0 0 10px 0; }
.lk-confidentialite-texte p { margin: 0; }

/* ============================================================
   14. PIED DE PAGE — Coordonnées / Menu / Suivez-moi
   ============================================================ */
.lk-footer { background: var(--lk-papier); padding: 40px var(--lk-gouttiere) 25px; border-top: 1px solid var(--lk-ligne); }
.lk-footer-colonnes { display: grid; grid-template-columns: 1.3fr 1fr 0.7fr; gap: 30px; font-size: 14px; }
.lk-footer-bloc { display: flex; flex-direction: column; align-items: flex-start; gap: 5px; min-width: 0; }
.lk-footer-bloc p { margin: 0; }
.lk-footer-bloc a { text-decoration: none; overflow-wrap: anywhere; }
.lk-footer-bloc a:hover { text-decoration: underline; }
.lk-footer-titre {
	font-family: var(--lk-sans); font-size: 11px; font-weight: 500; letter-spacing: 0.12em; text-transform: uppercase;
	color: var(--lk-muet); margin: 0 0 12px;
}
.lk-footer .lk-social { font-size: 12px; }
.lk-footer-bas {
	margin-top: 35px; padding-top: 18px; border-top: 1px solid var(--lk-ligne);
	display: flex; justify-content: space-between; gap: 18px; font-size: 11px; color: var(--lk-muet);
}
.lk-footer-bas p { margin: 0; }
.lk-footer-bas a { color: inherit; }
@media (max-width: 620px) {
	.lk-footer { padding: 30px 6% 23px; }
	.lk-footer-colonnes { grid-template-columns: 1fr; gap: 28px; font-size: 13px; }
	.lk-footer .lk-social { flex-direction: row; flex-wrap: wrap; gap: 22px; }
	.lk-footer .lk-social .lk-footer-titre { width: 100%; margin-bottom: 0; }
}

/* ============================================================
   15. POP-UP DE CONSENTEMENT COOKIES
   ============================================================ */
#lk-cookie-banner {
	position: fixed; left: 24px; right: 24px; bottom: 24px;
	max-width: 560px; margin: 0 auto;
	background: var(--lk-papier);
	border: 1px solid var(--lk-ligne);
	box-shadow: 0 8px 32px rgba(23, 23, 26, 0.12);
	padding: 24px 28px;
	z-index: 9999;
	font-size: 15px; line-height: 1.5;
}
#lk-cookie-banner[hidden] { display: none; }
#lk-cookie-banner p { margin: 0 0 16px; }
#lk-cookie-banner a { color: var(--lk-accent); text-decoration: underline; }
#lk-cookie-banner .lk-cookie-actions { display: flex; gap: 12px; }
#lk-cookie-banner button {
	font-family: inherit; font-size: 15px; padding: 10px 20px;
	border: 1px solid var(--lk-noir); background: transparent; cursor: pointer;
}
#lk-cookie-banner button.lk-cookie-accept { background: var(--lk-noir); border-color: var(--lk-noir); color: var(--lk-papier); }

/* ============================================================
   16. ANIMATIONS + RÉDUCTION DE MOUVEMENT
   ============================================================ */
@keyframes lk-image-in { from { transform: scale(1.045); } to { transform: scale(1); } }
@keyframes lk-text-in { from { opacity: 0; transform: translateY(13px); } to { opacity: 1; transform: translateY(0); } }
@keyframes lk-menu-in { from { opacity: 0; transform: translateY(-7px); } to { opacity: 1; transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) {
	.lk-hero .lk-hero-titre, .lk-hero .lk-hero-soustitre, .lk-hero .lk-hero-phrase,
	.lk-hero .lk-hero-vedette-bloc, .lk-hero .lk-hero-vedette img,
	.wp-block-navigation__responsive-container.is-menu-open,
	.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item,
	.lk-mask.lk-revealed .lk-vedette-media img { animation: none !important; }
	.lk-mask .lk-vedette-media, .lk-mask .lk-vedette-legende, .lk-reveal-texte {
		clip-path: none !important; opacity: 1 !important; transform: none !important; transition: none !important;
	}
}

/* Sélecteur de langue : la langue active est en gris (demande cliente du 30 sept. 2026). */
.lk-header .lk-lang-actif,
.wp-block-navigation__responsive-container.is-menu-open .lk-lang-actif { color: #8A877E; }
.lk-header .lk-nav-bas a.lk-lang-actif,
.wp-block-navigation__responsive-container.is-menu-open .lk-nav-bas a.lk-lang-actif { color: #8A877E; }
.lk-nav-bas.lk-lang-switch,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item.lk-nav-bas.lk-lang-switch {
	display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center; gap: 0.5em;
}

/* Menu ouvert + barre d'administration WordPress (visiteur connecté) : le voile
   et la bande démarrent sous la barre, sinon le bouton « Fermer » est caché
   derrière elle. Sans effet pour les visiteurs non connectés. */
.admin-bar .wp-block-navigation__responsive-container.is-menu-open {
	top: var(--wp-admin--admin-bar--height, 32px) !important;
	height: calc(100% - var(--wp-admin--admin-bar--height, 32px)) !important;
}
.admin-bar .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog {
	top: var(--wp-admin--admin-bar--height, 32px) !important;
	height: calc(100% - var(--wp-admin--admin-bar--height, 32px)) !important;
}


/* ============================================================
   CORRECTIONS CLIENTE DU 5 OCTOBRE 2026
   ============================================================ */
/* Titre du projet en italique ; année d'exposition en gras, plus grande. */
.lk-projet .lk-page-entete .lk-page-titre { font-style: italic; }
.lk-projet .lk-page-entete .lk-label { font-size: 19px; font-weight: 700; letter-spacing: 0.06em; color: var(--lk-accent); }
/* Les mentions (soutien, lieux d'exposition) et crédits restent à gauche, plus petits. */
.lk-projet-corps .lk-projet-mention, .lk-projet-corps .lk-projet-credit { text-align: left; }
.lk-projet-corps .lk-serie.lk-serie-2 { max-width: 960px; margin-left: auto; margin-right: auto; }
/* Passages : une saison par ligne (3 ou 4 œuvres de même taille). */
.lk-projet-corps .lk-serie.lk-saison-3 { max-width: 75%; margin-left: auto; margin-right: auto; }
.lk-projet-corps .lk-serie.lk-saison { margin-top: 18px; margin-bottom: 18px; }
@media (max-width: 620px) {
	.lk-projet-corps .lk-serie.lk-saison-3 { max-width: 100%; }
}
/* Cadrage de la vignette : le sujet est à droite. */
.lk-serie.lk-vignettes .wp-block-image.lk-cadre-droite img { object-position: 100% 50%; }
/* Visionneuse : deux vues côte à côte (#15 avant / après). */
.lk-zoom .lk-zoom-paire { display: flex; gap: 14px; justify-content: center; align-items: flex-start; }
.lk-zoom .lk-zoom-paire[hidden] { display: none; }
.lk-zoom .lk-zoom-paire figure { flex: 0 1 auto; min-width: 0; padding: 0; background: none; }
.lk-zoom .lk-zoom-paire img { max-height: 560px; max-width: 100%; }
.lk-zoom .lk-zoom-paire figcaption { margin: 10px 0 0; font-size: 13px; }
@media (max-width: 620px) {
	.lk-zoom .lk-zoom-paire { gap: 8px; }
	.lk-zoom .lk-zoom-paire figure { flex: 1 1 0; }
	.lk-zoom .lk-zoom-paire img { max-height: 50vh; width: 100%; object-fit: contain; }
}
/* Grands écrans : l'en-tête d'un projet s'aligne sur la colonne de texte centrée. */
.lk-projet .lk-page-entete { padding-left: max(var(--lk-gouttiere), calc((100% - var(--lk-texte-max)) / 2)); padding-right: max(var(--lk-gouttiere), calc((100% - var(--lk-texte-max)) / 2)); }
@media (max-width: 620px) {
	.lk-projet-corps p, .lk-interventions-texte .lk-lecture p { text-align: left; }
}

/* Éclatement et enchantement : toutes les œuvres à la même dimension (les 2 Enchantement = 2 cellules de la grille à 4). */
.lk-projet-corps .lk-serie.lk-serie-meme-taille { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: calc(50% - 11px); margin-left: 0; margin-right: auto; }
@media (max-width: 620px) { .lk-projet-corps .lk-serie.lk-serie-meme-taille { max-width: 100%; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 14px; } }
/* Histoire d'une chute : Lignes de résilience I et II strictement de même format. */
.lk-projet-corps .lk-serie.lk-serie-reduite img { aspect-ratio: 3 / 4; object-fit: cover; }
