/*
Theme Name: Geometry
Description: A theme by Geometry - Brussels - Visit us at http://www.geometry.be
Author: Geometry
Version: 1.0
*/

/* ==========================================================
   Échelle typographique

   Pour tout nouvel élément textuel, choisir l’un de ces
   quatre niveaux afin de conserver une typographie uniforme.
   ========================================================== */

:root {
	--font-size-small: clamp(12px, 0.95vw, 14px);
	--font-size-current: clamp(16px, 1.25vw, 18px);
	--font-size-title: clamp(22px, 1.8vw, 28px);
	--font-size-large-title: clamp(72px, 10.5vw, 150px);

	--line-height-small: 1.2;
	--line-height-current: 1.25;
	--line-height-title: 1.1;
	--line-height-large-title: 0.95;

	--page-margin-inline: 2.5%;
	--page-padding-block: 30px;

	--icon-size: 30px;
	--icon-diagonal-size: 38px;
	--icon-control-size: 52px;
	--icon-edge-inline: 30px;
	--icon-edge-block: 24px;

	--panel-scroll-fade-size: 45px;
	--panel-scroll-fade-bottom-size: 120px;
}

@font-face {
	font-family: "Rubik";
	src: url("fonts/Rubik-Light.woff2") format("woff2");
	font-style: normal;
	font-weight: 300;
	font-display: swap;
}

@font-face {
	font-family: "Rubik";
	src: url("fonts/Rubik-Regular.woff2") format("woff2");
	font-style: normal;
	font-weight: 400;
	font-display: swap;
}

@font-face {
	font-family: "Rubik";
	src: url("fonts/Rubik-Italic.woff2") format("woff2");
	font-style: italic;
	font-weight: 400;
	font-display: swap;
}

@font-face {
	font-family: "Rubik";
	src: url("fonts/Rubik-Medium.woff2") format("woff2");
	font-style: normal;
	font-weight: 500;
	font-display: swap;
}

/* CSS RESET */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed,  figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
body {line-height: 1;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {content: ''; content: none;}
table {border-collapse: collapse; border-spacing: 0;}
/* END CSS RESET */

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

.projets-page {
	width: 100%;
	font-size: var(--font-size-current);
	line-height: var(--line-height-current);
}

.projets-recherche {
	box-sizing: border-box;
	width: auto;
	margin: 0 var(--page-margin-inline);
	padding: var(--page-padding-block) 0;
}

.projets-filtres {
	display: flex;
	flex-direction: column;
	width: 85%;
	max-width: 950px;
	gap: 18px;
	font-size: var(--font-size-title);
	line-height: var(--line-height-title);
}

.projets-filtres-panel__close,
.projets-filtres-panel__open {
	display: none;
}

.projets-filtres__groupe {
	display: flex;
	flex-wrap: wrap;
	align-items: start;
	gap: 12px 16px;
}

.projets-filtres__titre {
	flex: 0 0 auto;
	margin: 0;
	margin-right: 0.75em;
	padding: 7px 0;
	font-size: inherit;
	line-height: var(--line-height-title);
}

.projets-filtres__liste {
	display: contents;
}

.projets-filtre {
	appearance: none;
	box-sizing: border-box;
	border: 3px solid currentColor;
	border-radius: 6px;
	background: transparent;
	padding: 5px 12px 6px;
	color: #000;
	font: inherit;
	line-height: var(--line-height-title);
	text-decoration: none;
	cursor: pointer;

	transition:
		background-color
		180ms
		ease,
		border-color
		180ms
		ease;
}

.projets-filtre:not(.is-active):hover,
.projets-filtre:not(.is-active):focus-visible {
	border-color: #e5e5e5;
	background: #e5e5e5;
}

.projets-filtres__groupe:first-child
.projets-filtre {
	border-radius: 999px;
}

.projets-filtre.is-active {
	border-color: #000;
	background: #000;
	color: #fff;
}

.projets-resultats {
	position: relative;
	margin-top: var(--page-padding-block);
	container-name: projects-results;
	container-type: inline-size;
}

.projets-resultats.is-loading {
	pointer-events: none;
}

.projets-resultats > *:not(
	.projets-resultats__chargement
) {
	transition:
		opacity
		160ms
		ease;
}

.projets-resultats.is-loading > *:not(
	.projets-resultats__chargement
) {
	opacity: 0;
}

.projets-resultats__chargement,
.projets-resultats__vide {
	font-size: var(--font-size-title);
	line-height: var(--line-height-title);
}

.projets-resultats__chargement {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
	display: none;
	margin: 0;
}

.projets-resultats.is-loading
.projets-resultats__chargement {
	display: block;
}

.projets-resultats__points {
	display: inline-block;
	min-width: 1.5em;
}

.projets-resultats__points span {
	opacity: 0;
	animation:
		projets-loading-dot-one
		1200ms
		steps(1, end)
		infinite;
}

.projets-resultats__points span:nth-child(2) {
	animation-name:
		projets-loading-dot-two;
}

.projets-resultats__points span:nth-child(3) {
	animation-name:
		projets-loading-dot-three;
}

@keyframes projets-loading-dot-one {

	0%,
	24%,
	100% {
		opacity: 0;
	}

	25%,
	99% {
		opacity: 1;
	}

}

@keyframes projets-loading-dot-two {

	0%,
	49%,
	100% {
		opacity: 0;
	}

	50%,
	99% {
		opacity: 1;
	}

}

@keyframes projets-loading-dot-three {

	0%,
	74%,
	100% {
		opacity: 0;
	}

	75%,
	99% {
		opacity: 1;
	}

}

@media (max-width: 800px) {

	.projets-filtres__titre {
		flex-basis: 100%;
	}
}

.projets-elements-search {
	position: relative;
	width: min(100%, 500px);
}

.projets-elements-search__field {
	position: relative;
	display: flex;
	align-items: center;
	width: 100%;
}

.projets-elements-search__input {
	box-sizing: border-box;
	width: 100%;
	min-width: 0;
	padding: 7px 44px 8px 12px;
	border: 0;
	border-radius: 6px;
	background: #e5e5e5;
	font: inherit;
	font-style: italic;
	line-height: var(--line-height-title);
	color: #000;

	transition:
		background-color
		180ms
		ease,
		color
		180ms
		ease;
}

.projets-elements-search__input::placeholder {
	color: #000;
	opacity: 1;
}

/*
 * Masque la croix native de certains navigateurs,
 * puisque nous avons notre propre bouton.
 */
.projets-elements-search__input::-webkit-search-cancel-button {
	display: none;
}

.projets-elements-search__toggle,
.projets-elements-search__reset {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	display: flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	padding: 0;
	border: 0;
	background: transparent;
	font: inherit;
	font-size: 1em;
	line-height: 1;
	cursor: pointer;
}

.projets-elements-search__toggle {
	display: none;
}

.projets-elements-search__reset {
	right: 7px;

	transition:
		color
		180ms
		ease;
}

.projets-elements-search__input[data-term-slug] {
	background: #000;
	color: #fff;
	font-style: normal;
}

.projets-elements-search__field:has(
	.projets-elements-search__input[data-term-slug]
)
.projets-elements-search__reset {
	color: #fff;
}

.projets-elements-search__menu {
	position: absolute;
	top: calc(100% + 4px);
	left: 0;
	z-index: 100;
	box-sizing: border-box;
	width: 100%;
	max-height: 280px;
	overflow-x: hidden;
	overflow-y: auto;
	border: 0;
	border-radius: 6px;
	background: #fff;
}

.projets-elements-search__option {
	display: block;
	box-sizing: border-box;
	width: 100%;
	margin: 0;
	padding: 8px 12px;
	border: 0;
	background: transparent;
	text-align: left;
	font: inherit;
	cursor: pointer;
}

.projets-elements-search__option:hover,
.projets-elements-search__option:focus,
.projets-elements-search__option.is-keyboard-active {
	background: #eee;
	outline: none;
}

.projets-elements-search__empty {
	margin: 0;
	padding: 10px 12px;
	font-style: italic;
}

.projets-elements-search__menu[hidden],
.projets-elements-search__option[hidden],
.projets-elements-search__empty[hidden],
.projets-elements-search__reset[hidden] {
	display: none;
}

.projets-grid{

	display:grid;
	grid-template-columns:repeat(3,1fr);
	gap:var(--page-padding-block);
	padding-top:var(--page-padding-block);

}

@container projects-results (max-width: 649px) {

	.projets-grid {
		grid-template-columns: 1fr;
	}
}

@container projects-results (min-width: 650px) and (max-width: 899px) {

	.projets-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@container projects-results (min-width: 1250px) {

	.projets-grid {
		grid-template-columns: repeat(4, 1fr);
	}
}

@container projects-results (min-width: 1550px) {

	.projets-grid {
		grid-template-columns: repeat(5, 1fr);
	}
}

@container projects-results (min-width: 1850px) {

	.projets-grid {
		grid-template-columns: repeat(6, 1fr);
	}
}

.projet__lien {
	position: relative;
	display: block;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	background: #fff;
	color: inherit;
	text-decoration: none;
}

.projet__image {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
}

.projet__image img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center;
	transition: filter 180ms ease;
}

.projet__overlay {
	position: absolute;
	inset: 0;
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	text-align: center;
	opacity: 0;
	transition: opacity 180ms ease;
}

.projet__lien:hover .projet__image img,
.projet__lien:focus-visible .projet__image img {
	filter: brightness(20%);
}

.projet__lien:hover .projet__overlay,
.projet__lien:focus-visible .projet__overlay {
	opacity: 1;
}

.projet__overlay-contenu {
	width: max(
		1px,
		calc(
			var(--projet-image-width, 100%) -
			48px
		)
	);
}

.projet__titre {
	margin: 0;
	font-weight: 400;
}

.projet__intervention {
	margin-top: 0;
	font-weight: 300;
}

.projet__intervention p {
	margin: 0;
}

.projet--abstraction {
	display: flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	background: #fff;
}

.projet--abstraction img {
	display: block;
	width: 58%;
	height: 58%;
	object-fit: contain;
	object-position: center;
	opacity: 1;
	transition: opacity 180ms ease;
}

.projet--abstraction img.is-switching {
	opacity: 0;
}

.projets-resultats,
.projets-grid {
	transition: opacity 0.2s ease;
}

/* ==========================================================
   Fiche projet
   ========================================================== */

.single-project {
	box-sizing: border-box;
	width: 80%;
	margin: 0 auto;
	padding: var(--page-padding-block) 0;
}

.single-project__visuals {
	display: flex;
	flex-direction: column;
	gap: var(--page-padding-block);
}

.single-project__visual-row {
	display: grid;
	grid-template-columns: 1fr;
	box-sizing: border-box;
	width: 100%;
	max-width: 100%;
	gap: var(--page-padding-block);
	align-items: start;
}

.single-project__visual {
	min-width: 0;
	max-width: 100%;
}

.single-project__visual-row--2 {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	width: min(
		100%,
		var(--single-project-normal-visual-width, 100%)
	);
	margin-right: auto;
	margin-left: auto;
}

.single-project__visual img {
	display: block;
	width: auto;
	height: auto;
	max-width: 100%;
	max-height: 90vh;
	object-fit: contain;
	object-position: center;
	margin-right: auto;
	margin-left: auto;
}

.single-project-scroll-top,
.projects-scroll-top {
	position: fixed;
	z-index: 45;

	display: flex;
	align-items: center;
	justify-content: center;

	box-sizing: border-box;
	width: var(--icon-control-size);
	height: var(--icon-control-size);
	padding: 0;
	border: 0;
	background: transparent;
	color: #000;
	appearance: none;
	-webkit-appearance: none;

	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	cursor: pointer;

	transition:
		opacity
		var(--content-duration)
		ease,
		visibility 0s linear var(--content-duration);
}

.single-project-scroll-top {
	top: var(--icon-edge-block);
	left: var(--icon-edge-inline);
}

.projects-scroll-top {
	right: var(--icon-edge-inline);
	bottom: var(--icon-edge-block);
}

.single-project-scroll-top.is-visible,
.projects-scroll-top.is-visible {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;

	transition-delay: 0s;
}

.single-project-scroll-top svg,
.projects-scroll-top svg {
	display: block;
	width: var(--icon-size);
	height: var(--icon-size);
	fill: none;
	stroke: currentColor;
	stroke-width: 3;
	stroke-linecap: round;
	stroke-linejoin: round;
}

/* ==========================================================
   Page 404
   ========================================================== */

.error-page {
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	width: auto;
	min-height: 100vh;
	margin: 0 var(--page-margin-inline);
	padding: var(--page-padding-block) 0;
}

.error-page__code {
	font-size: var(--font-size-large-title);
	font-weight: 400;
	line-height: var(--line-height-large-title);
}

.error-page__content {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.35em;
	font-size: var(--font-size-current);
	font-weight: 400;
	line-height: var(--line-height-current);
}

.error-page__content a {
	color: inherit;
	text-decoration-line: underline;
	text-decoration-thickness: 3px;
	text-underline-offset: 0.12em;
}


/* ==========================================================
   Page Mission
   ========================================================== */

.mission-page {
	box-sizing: border-box;
	width: 100%;
}

.mission-page__hero {
	display: flex;
	flex-direction: column;
	height: 100vh;
	min-height: 0;
}

.mission-page__title {
	flex: 0 0 auto;
	margin:
		var(--page-padding-block)
		var(--page-margin-inline)
		0;
	font-size: var(--font-size-large-title);
	font-weight: 400;
	line-height: var(--line-height-large-title);
}

.mission-page__slider-section {
	box-sizing: border-box;
	flex: 1 1 auto;
	min-height: 0;
	width: 100%;
	height: auto;
	padding: var(--page-padding-block) 0;
}

.mission-slider__viewport {
	cursor: pointer;
}

.mission-slider__image {
	display: block;
	height: 100%;
}

.mission-slider__image img {
	display: block;
	width: auto;
	height: 100%;
	max-width: none;
	object-fit: contain;
	object-position: center;
}

.mission-page__additional-content {
	box-sizing: border-box;
	width: auto;
	margin: 0 var(--page-margin-inline);
	padding: var(--page-padding-block) 0;
	font-size: var(--font-size-current);
	line-height: var(--line-height-current);
}

.mission-page__additional-content > p {
	box-sizing: border-box;
	width: 85%;
	margin-right: 15%;
}

.mission-page__additional-content h2 {
	margin: 0;
	font-size: var(--font-size-title);
	font-weight: 400;
	line-height: 1.4;
}

.mission-page__additional-content h2:not(:first-child) {
	margin-top: 2.8em;
}

.atelier-page {
	box-sizing: border-box;
	width: 100%;
}

.atelier-page__hero {
	display: flex;
	flex-direction: column;
	height: 100vh;
	min-height: 0;
}

.atelier-page__title {
	flex: 0 0 auto;
	margin:
		var(--page-padding-block)
		var(--page-margin-inline)
		0;
	font-size: var(--font-size-large-title);
	font-weight: 400;
	line-height: var(--line-height-large-title);
}

.atelier-page__slider-section {
	box-sizing: border-box;
	flex: 1 1 auto;
	min-height: 0;
	width: 100%;
	height: auto;
	padding: var(--page-padding-block) 0;
}

.atelier-slider__viewport {
	cursor: pointer;
}

.atelier-slider__image {
	display: block;
	height: 100%;
}

.atelier-slider__image img {
	display: block;
	width: auto;
	height: 100%;
	max-width: none;
	object-fit: contain;
	object-position: center;
}

.atelier-page__content {
	box-sizing: border-box;
	width: auto;
	margin: 0 var(--page-margin-inline);
	padding: var(--page-padding-block) 0;
	font-size: var(--font-size-current);
	line-height: var(--line-height-current);
	container-name: projects-results;
	container-type: inline-size;
}

.atelier-page__section-title {
	margin: 0;
	font-size: var(--font-size-title);
	font-weight: 400;
	line-height: 1.4;
}

.atelier-team-member {
	min-width: 0;
	font-size: var(--font-size-current);
	font-weight: 300;
	line-height: var(--line-height-current);
	text-align: center;
}

.atelier-team-member__photo {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	background: #fff;
}

.atelier-team-member__photo img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center;
	filter: grayscale(100%);
}

.atelier-team-member__content {
	margin-top: var(--page-padding-block);
}

.atelier-team-member__name {
	margin: 0;
	font-size: inherit;
	font-weight: 400;
	line-height: inherit;
}

.atelier-team-member__email {
	display: block;
	margin-top: 0;
	color: inherit;
}

.atelier-team-member__description {
	margin-top: 0;
}

.atelier-team-member__description p {
	margin: 0;
}

.atelier-team-member__description p + p {
	margin-top: 1em;
}

.atelier-page__past-collaborations {
	width: 100%;
	margin-top: calc(var(--font-size-title) * 2.8);
}

.atelier-page__past-collaborations .atelier-page__section-title {
	margin-bottom: var(--page-padding-block);
}

.atelier-page__past-collaborations p + p {
	margin-top: 1em;
}

.atelier-page__past-collaborations > p,
.atelier-page__conception > p {
	box-sizing: border-box;
	width: 85%;
	margin-right: 15%;
	font-size: var(--font-size-small);
	line-height: var(--line-height-small);
}

.atelier-page__conception {
	margin-top: calc(var(--font-size-title) * 2.8);
}

.atelier-page__conception .atelier-page__section-title {
	margin-bottom: var(--page-padding-block);
}

.atelier-page__conception p {
	margin: 0 15% 0 0;
}

.atelier-page__conception a {
	color: inherit;
}

/*
 * Sur les très grands écrans, les longs textes du contenu
 * central conservent une longueur de ligne plus confortable.
 */
@media (min-width: 1800px) {

	.mission-page__additional-content > p,
	.atelier-page__past-collaborations > p,
	.atelier-page__conception > p {
		width: 65%;
		margin-right: 35%;
	}

}

.right-panel-content--atelier {
	font-size: var(--font-size-current);
	font-weight: 300;
	line-height: var(--line-height-current);
}

.right-panel-content--atelier h2,
.right-panel-content--mission h2 {
	margin: 0;
	font-size: var(--font-size-title);
	font-weight: 400;
	line-height: 1.4;
}

.right-panel-content--atelier h2:not(:first-child),
.right-panel-content--mission h2:not(:first-child) {
	margin-top: 2.8em;
}

.right-panel-content--atelier p {
	margin: 18px 0 var(--page-padding-block);
}

.right-panel-content--atelier p:last-child {
	margin-bottom: 0;
}

.right-panel-content--mission {
	font-size: var(--font-size-current);
	font-weight: 300;
	line-height: var(--line-height-current);
}

.right-panel-content--mission p {
	margin: 18px 0 var(--page-padding-block);
}

.right-panel-content--mission p:last-child {
	margin-bottom: 0;
}

/* ==========================================================
   Page Intro
   ========================================================== */

.intro-page {
	box-sizing: border-box;
	width: 100%;
	height: 100vh;
	padding:
		var(--page-padding-block)
		0;
	overflow: hidden;
}

.intro-slider,
.intro-slider__viewport,
.intro-slider__track,
.intro-slider__slide,
.intro-slider__link {
	height: 100%;
}

.intro-slider__viewport {
	box-sizing: border-box;
	width: auto;
	margin:
		0
		var(--page-margin-inline);
	overflow: hidden;
}

.intro-slider__track {
	display: flex;
	align-items: center;
	gap: var(--page-padding-block);
	width: max-content;
	transform: translateX(0);
	will-change: transform;
}

.intro-slider__track.is-sliding {
	transition:
		transform
		var(--panel-duration)
		var(--panel-ease);
}

.intro-slider__slide {
	flex: 0 0 auto;
}

.intro-slider__link {
	display: block;
	color: inherit;
	text-decoration: none;
}

.intro-slider__link img {
	display: block;
	width: auto;
	height: 100%;
	max-width: none;
	object-fit: contain;
	object-position: center;
}

.single-project__taxonomies {
	width: 100%;
	margin-top: var(--page-padding-block);
	padding-top: var(--page-padding-block);
}

.single-project__similar {
	position: relative;
	margin-top: var(--page-padding-block);
	padding-bottom: var(--page-padding-block);
}

.single-project__similar-title {
	margin: 0 0 var(--page-padding-block);
	font-size: var(--font-size-title);
	font-weight: 400;
	line-height: var(--line-height-title);
}

.single-project__similar-slider {
	position: relative;
}

.single-project__similar-viewport {
	width: 100%;
	overflow: hidden;
	touch-action: pan-y;
	user-select: none;
	-webkit-user-select: none;
	cursor: grab;
	container-name: similar-projects;
	container-type: inline-size;
}

.single-project__similar-viewport.is-dragging {
	cursor: grabbing;
}

.single-project__similar-track {
	display: flex;
	gap: var(--page-padding-block);
	width: 100%;
	transform: translateX(0);
	will-change: transform;
}

.single-project__similar-track.is-sliding {
	transition:
		transform
		var(--panel-duration)
		var(--panel-ease);
}

.single-project__similar-slide {
	flex: 0 0 calc(
		(
			100% -
			var(--page-padding-block)
		) /
		2
	);
	min-width: 0;
}

@container similar-projects (min-width: 900px) {

	.single-project__similar-slide {
		flex-basis: calc(
			(
				100% -
				var(--page-padding-block) -
				var(--page-padding-block)
			) /
			3
		);
	}
}

@container similar-projects (min-width: 1250px) {

	.single-project__similar-slide {
		flex-basis: calc(
			(
				100% -
				var(--page-padding-block) -
				var(--page-padding-block) -
				var(--page-padding-block)
			) /
			4
		);
	}
}

@container similar-projects (min-width: 1550px) {

	.single-project__similar-slide {
		flex-basis: calc(
			(
				100% -
				var(--page-padding-block) -
				var(--page-padding-block) -
				var(--page-padding-block) -
				var(--page-padding-block)
			) /
			5
		);
	}
}

@media (max-width: 760px) {

	.single-project__visual-row--2 {
		grid-template-columns: 1fr;
		width: 100%;
	}

	.single-project__similar {
		left: 50%;
		width: calc(
			100vw -
			var(--page-margin-inline) -
			var(--page-margin-inline)
		);
		transform: translateX(-50%);
	}

}

/* ==========================================================
   Boutons mosaïque / liste
   ========================================================== */

.projets-affichage {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 0;
	margin: 0;
	padding-bottom: 20px;
	border-bottom: 3px solid currentColor;
}

.projets-affichage__bouton {
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: var(--icon-control-size);
	height: var(--icon-control-size);
	padding: 0;
	border: 0;
	background: transparent;
	color: #999;
	cursor: pointer;
}

.projets-affichage__bouton svg {
	width: var(--icon-size);
	height: var(--icon-size);
	fill: none;
	stroke: currentColor;
	stroke-width: 3;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.projets-affichage__bouton svg circle {
	fill: currentColor;
	stroke: none;
}

.projets-affichage__bouton:hover,
.projets-affichage__bouton.is-active {
	color: #000;
}

@media (min-width: 761px) {

	.projets-affichage__bouton:last-child {
		margin-right: calc(
			var(--icon-edge-inline) -
			var(--page-margin-inline)
		);
	}

}


/* ==========================================================
   Vues
   ========================================================== */

.projets-view[hidden] {
	display: none !important;
}


/* ==========================================================
   Vue liste
   ========================================================== */

.projets-view--list {
	position: relative;
	width: 100%;
}

.projets-liste {
	--project-list-text-width: 66%;

	position: relative;
	width: 100%;
	min-height: 500px;
}

.projets-liste__tableau {
	width: 100%;
}

.projets-liste__entete,
.projets-liste__ligne {
	display: grid;
	grid-template-columns:
		12%
		30%
		minmax(0, 1fr);
	align-items: center;
	column-gap: 0;
}

.projets-liste__entete {
	position: relative;
	box-sizing: border-box;
	padding: 0 12px;
	background: #e9e9e9;
	border-bottom: 3px solid transparent;
}

.projets-liste__tri {
	display: flex;
	align-items: center;
	gap: 8px;
	min-width: 0;
	padding: 9px 0;
	border: 0;
	background: transparent;
	color: inherit;
	text-align: left;
	font: inherit;
	font-weight: 400;
	cursor: pointer;
}

.projets-liste__tri:hover,
.projets-liste__tri.is-active {
	text-decoration: none;
}

.projets-liste__tri-icone {
	display: inline-block;
	min-width: 12px;
}

.projets-liste__ligne {
	position: relative;
	box-sizing: border-box;
	padding: 7px 12px;
	border-bottom: 3px solid transparent;
	color: inherit;
	text-decoration: none;
}

.projets-liste__entete::after,
.projets-liste__ligne::after {
	position: absolute;
	bottom: -3px;
	left: 0;
	width: var(--project-list-text-width);
	height: 3px;
	background: currentColor;
	content: "";
	pointer-events: none;
}

.projets-liste__ligne:hover::before,
.projets-liste__ligne:focus-visible::before,
.projets-liste__ligne:focus-within::before {
	position: absolute;
	top: -3px;
	left: var(--project-list-text-width);
	width: calc(
		100% -
		var(--project-list-text-width)
	);
	height: 3px;
	background: currentColor;
	content: "";
	pointer-events: none;
}

.projets-liste__ligne:hover,
.projets-liste__ligne:focus-visible {
	background: #f2f2f2;
}

.projets-liste__annee,
.projets-liste__projet,
.projets-liste__typologie {
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}


/* ==========================================================
   Aperçu au survol
   ========================================================== */

.projets-liste__apercu {
	position: fixed;
	top: var(--project-preview-top, 0px);
	left: var(--project-preview-left, auto);
	right: auto;
	z-index: 50;
	display: none;
	width: var(
		--project-preview-width,
		min(340px, 30vw)
	);
	transform: none;
	pointer-events: none;
}

.projets-liste__ligne:hover .projets-liste__apercu,
.projets-liste__ligne:focus-visible .projets-liste__apercu {
	display: block;
}

.projets-liste__apercu-image {
	display: block;
	width: 100%;
}

.projets-liste__apercu-image img {
	display: block;
	width: 100%;
	height: auto;
	max-height: 55vh;
	object-fit: contain;
}

.projets-liste__apercu-description {
	display: block;
	margin-top: 14px;
	text-align: center;
	font-weight: 300;
	line-height: 1.25;
}

.projets-liste__apercu-description p {
	margin: 0 0 8px;
}

.projets-liste__apercu-description p:last-child {
	margin-bottom: 0;
}


/* ==========================================================
   Responsive
   ========================================================== */

@media (max-width: 700px) {

	.projets-liste {
		--project-list-text-width: 100%;
	}

	.projets-liste__entete,
	.projets-liste__ligne {
		grid-template-columns:
			24%
			minmax(0, 1fr);
	}

	.projets-liste__typologie,
	.projets-liste__entete
		.projets-liste__tri:nth-child(3) {
		display: none;
	}

}

.projet[hidden],
.projets-grid__sentinel[hidden] {
	display: none !important;
}

.projets-grid__sentinel {
	grid-column: 1 / -1;
	width: 100%;
	height: 1px;
}


/* ==========================================================
   Variables globales du layout
   ========================================================== */

:root {
	--panel-left-width: min(24vw, 420px);
	--panel-right-width: 37vw;
	--panel-border-width: 3px;

	--panel-duration: 500ms;
	--content-duration: 350ms;

	--panel-ease: cubic-bezier(0.65, 0, 0.35, 1);
}


/* ==========================================================
   Structure générale
   ========================================================== */

html,
body {
	min-height: 100%;
}

body {
	margin: 0;
	overflow-x: hidden;
	font-family: "Rubik", Arial, sans-serif;
	font-weight: 400;
}

body.global-menu-is-open,
body.global-menu-is-closing {
	overflow: hidden;
}


/* ==========================================================
   Menu global
   ========================================================== */

.global-menu {
	position: fixed;
	inset: 0;
	z-index: 100;

	box-sizing: border-box;
	display: flex;
	align-items: flex-start;
	min-height: 100vh;
	padding:
		clamp(30px, 4vw, 60px)
		0
		clamp(50px, 8vh, 100px)
		var(--panel-left-width);

	overflow-y: auto;
	overscroll-behavior: contain;

	background: #000;
	color: #fff;

	visibility: hidden;
	transform: translateY(-100%);
	pointer-events: none;

	transition:
		transform
		var(--panel-duration)
		var(--panel-ease),
		visibility
		0s
		linear
		var(--panel-duration);
}

body.global-menu-is-open .global-menu {
	visibility: visible;
	transform: translateY(0);
	pointer-events: auto;

	transition:
		transform
		var(--panel-duration)
		var(--panel-ease),
		visibility
		0s;
}

html.auxau-global-menu-arrival .global-menu {
	visibility: visible;
	transform: translateY(0);
	pointer-events: auto;
	transition: none;
}

.global-menu__navigation {
	box-sizing: border-box;
	width: 100%;
	padding:
		0
		var(--page-margin-inline);
}

.global-menu__mobile-information {
	display: none;
}

.global-menu__mobile-search {
	display: none;
}

.global-menu__list {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: clamp(8px, 1.2vh, 18px);
}

.global-menu__list a {
	color: inherit;
	text-decoration: none;
	font-size: var(--font-size-large-title);
	font-weight: 400;
	line-height: var(--line-height-large-title);
	letter-spacing: -0.055em;
}

.global-menu__list a:hover,
.global-menu__list a:focus-visible,
.global-menu__list .current-menu-item > a {
	text-decoration: underline;
	text-decoration-thickness: 0.045em;
	text-underline-offset: 0.08em;
}

.global-search-toggle {
	position: fixed;
	top: var(--icon-edge-block);
	right: calc(
		var(--icon-edge-inline) +
		var(--icon-control-size)
	);
	z-index: 90;

	display: flex;
	align-items: center;
	justify-content: center;

	box-sizing: border-box;
	width: var(--icon-control-size);
	height: var(--icon-control-size);
	padding: 0;
	border: 0;
	background: transparent;
	color: #000;

	cursor: pointer;

	transition: none;
}

.global-search-toggle svg {
	display: block;
	width: var(--icon-size);
	height: var(--icon-size);
	fill: none;
	stroke: currentColor;
	stroke-width: 3;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.global-search {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 10;

	display: block;
	width: 100%;
	height: var(--global-search-height);
	overflow: hidden;
	background: #fff;
	transform: translateY(-100%);

	transition:
		transform
		var(--panel-duration)
		var(--panel-ease);
}

.global-search__collapsible {
	height: 100%;
}

.global-search__content {
	box-sizing: border-box;
	padding:
		var(--page-padding-block)
		var(--page-margin-inline);
}

.global-search__line {
	width: 100%;
	height: 3px;
	background: #000;
}

.global-search__row {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 0;
	margin-right: calc(
		var(--icon-edge-inline) +
		var(--icon-control-size) +
		var(--icon-control-size) -
		var(--page-margin-inline) +
		8px
	);
	margin-bottom: var(--page-padding-block);
}

.global-search__field {
	flex: 0 1 500px;
	min-width: 0;
}

.global-search__input {
	box-sizing: border-box;
	width: 100%;
	min-width: 0;
	padding: 7px 12px 8px;
	border: 0;
	border-radius: 6px;
	background: #e5e5e5;
	color: #000;
	font-family: inherit;
	font-size: var(--font-size-title);
	font-style: normal;
	font-weight: 400;
	line-height: var(--line-height-title);
}

.global-search__input::placeholder {
	color: #000;
	font-style: italic;
	opacity: 1;
}

body.global-search-is-open
.global-search {
	transform: translateY(0);
}

body.global-search-is-open
.site-content {
	margin-top: var(--global-search-height);
}

/* ==========================================================
   Résultats de recherche
   ========================================================== */

.search-results-page {
	box-sizing: border-box;
	width: auto;
	margin:
		0
		var(--page-margin-inline);
	padding:
		0
		0
		var(--page-padding-block);
	font-size: var(--font-size-current);
	line-height: var(--line-height-current);
	container-name: projects-results;
	container-type: inline-size;
}

.search-results-list {
	display: grid;
	gap: var(--page-padding-block);
}

.search-results-list__link {
	color: inherit;
	text-decoration: none;
}

.search-results-list__link:hover,
.search-results-list__link:focus-visible {
	text-decoration: none;
}

.search-results-page__empty {
	margin: 0;
}

.search-results-page .navigation.pagination {
	margin-top: var(--page-padding-block);
}

.search-results-page .nav-links {
	display: flex;
	gap: 12px;
}

.search-results-page .page-numbers {
	color: inherit;
	text-decoration: none;
}

.search-results-page .page-numbers.current,
.search-results-page .page-numbers:hover,
.search-results-page .page-numbers:focus-visible {
	text-decoration: underline;
	text-underline-offset: 3px;
}

.global-menu-toggle {
	position: fixed;
	top: var(--icon-edge-block);
	right: var(--icon-edge-inline);
	z-index: 130;

	display: flex;
	align-items: center;
	justify-content: center;

	box-sizing: border-box;
	width: var(--icon-control-size);
	height: var(--icon-control-size);
	padding: 0;
	border: 0;
	background: transparent;
	color: #000;

	cursor: pointer;

	transition:
		color
		var(--panel-duration)
		var(--panel-ease);
}

.global-menu-toggle__icon {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: var(--icon-size);
	height: var(--icon-size);
}

.global-menu-toggle__line {
	display: block;
	width: var(--icon-size);
	height: 3px;
	border-radius: 999px;
	background: currentColor;
	transform-origin: center;

	transition:
		width
		var(--panel-duration)
		var(--panel-ease),
		opacity
		var(--panel-duration)
		var(--panel-ease),
		transform
		var(--panel-duration)
		var(--panel-ease);
}

body.global-menu-is-open .global-menu-toggle {
	color: #fff;
}

html.auxau-global-menu-arrival .global-menu-toggle {
	color: #fff;
}

body.global-menu-is-open
.global-menu-toggle__line:first-child {
	width: var(--icon-diagonal-size);
	transform: translateY(11px) rotate(45deg);
}

html.auxau-global-menu-arrival
.global-menu-toggle__line:first-child {
	width: var(--icon-diagonal-size);
	transform: translateY(11px) rotate(45deg);
}

body.global-menu-is-open
.global-menu-toggle__line:nth-child(2) {
	opacity: 0;
}

html.auxau-global-menu-arrival
.global-menu-toggle__line:nth-child(2) {
	opacity: 0;
}

body.global-menu-is-open
.global-menu-toggle__line:last-child {
	width: var(--icon-diagonal-size);
	transform: translateY(-11px) rotate(-45deg);
}

html.auxau-global-menu-arrival
.global-menu-toggle__line:last-child {
	width: var(--icon-diagonal-size);
	transform: translateY(-11px) rotate(-45deg);
}


.site-shell {
	position: relative;
	display: grid;

	/*
	 * Structure permanente :
	 *
	 * colonne 1 : volet gauche
	 * colonne 2 : contenu central
	 * colonne 3 : volet droit push éventuel
	 */
	grid-template-columns:
		var(--panel-left-width)
		minmax(0, 1fr)
		0;

	width: 100%;
	min-height: 100vh;
	background: #fff;

	transition:
		grid-template-columns
		var(--panel-duration)
		var(--panel-ease);
}


/* ==========================================================
   Contenu central
   ========================================================== */

.site-center {
	--global-search-height: calc(
		var(--page-padding-block) +
		var(--page-padding-block) +
		var(--page-padding-block) +
		var(--icon-control-size) +
		3px
	);

	position: relative;
	z-index: 1;
	grid-column: 2;
	min-width: 0;
	min-height: 100vh;
	background: #fff;
}

.site-content {
	position: relative;
	min-width: 0;
	min-height: 100vh;
	margin-top: 0;
	opacity: 1;
	background: #fff;

	transition:
		opacity
		var(--content-duration)
		ease,
		margin-top
		var(--panel-duration)
		var(--panel-ease);
}


/* ==========================================================
   Volet gauche
   ========================================================== */

.site-panel--left {
	position: relative;
	z-index: 20;
	grid-column: 1;

	box-sizing: border-box;
	width: var(--panel-left-width);
	min-height: 100vh;
	border-right: var(--panel-border-width) solid #000;

	background: #fff;
	transform: translateX(0);

	transition:
		transform
		var(--panel-duration)
		var(--panel-ease),
		color
		var(--panel-duration)
		var(--panel-ease);
}

.site-panel__inner--left {
	position: sticky;
	top: 0;
	box-sizing: border-box;
	width: 100%;
	height: 100vh;
	overflow-y: auto;
	padding: 0px 10px 30px 30px;
}

.site-header {
	display: flex;
	flex-direction: column;
	min-height: 100%;
}

.site-logo {
	position: relative;
	display: block;
	width: 100%;
	aspect-ratio: 293.219 / 284.444;
	color: #12120d;
	text-decoration: none;

	transition:
		color
		var(--panel-duration)
		var(--panel-ease);
}

.site-logo__letter,
.site-logo__descriptor {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	overflow: visible;

	transition:
		opacity
		180ms
		ease;
}

.site-logo__letter {
	fill: none;
	stroke: currentColor;
	stroke-width: 1.067;
}

.site-logo__descriptor {
	fill: currentColor;
	font-family: "Rubik", Arial, sans-serif;
	font-size: 17px;
	font-weight: 400;
}

.site-logo__icon-slot {
	position: absolute;
	top: 48.75%;
	left: 80%;
	display: block;
	width: 25%;
	height: 22%;
	transform: translate(-50%, -50%);
}

.site-logo__icon-slot img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center;
	opacity: 0;

	transition:
		filter
		var(--panel-duration)
		var(--panel-ease),
		opacity
		180ms
		ease;
}

.site-logo__icon-slot img.is-ready {
	opacity: 1;
}

.site-logo__icon-slot img.is-switching {
	opacity: 0;
}

.site-secondary-navigation {
	margin-top: auto;
	color: inherit;
	font-size: var(--font-size-title);
	line-height: 1.4;
}

.site-secondary-navigation p {
	margin: 0;
}

.site-secondary-navigation a {
	color: inherit;
	text-decoration: none;
}

.site-secondary-navigation a:hover,
.site-secondary-navigation a:focus-visible,
.site-language-switcher .is-active {
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 3px;
}

.site-instagram-link {
	display: block;
}

.site-contact {
	margin-top: var(--page-padding-block);
	color: inherit;
	font-style: normal;
	font-size: var(--font-size-small);
	line-height: var(--line-height-small);
}

.site-contact p {
	margin: 0;
}

.site-contact p + p {
	margin-top: 20px;
}

.site-contact a {
	color: inherit;
	text-decoration: none;
}

.site-contact a:hover,
.site-contact a:focus-visible {
	text-decoration: underline;
	text-underline-offset: 3px;
}

body.global-menu-is-open .site-panel--left,
body.global-menu-is-closing .site-panel--left,
html.auxau-global-menu-arrival .site-panel--left {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 120;

	height: 100vh;
	border-color: #000;
	background: transparent;
	transform: translateX(0);
	pointer-events: auto;
}

body.global-menu-is-open .site-panel--left,
html.auxau-global-menu-arrival .site-panel--left {
	color: #fff;
}

body.global-menu-is-open .site-logo,
html.auxau-global-menu-arrival .site-logo {
	color: #fff;
}

body.global-menu-is-open .site-logo__icon-slot img {
	filter: invert(1);
}

html.auxau-global-menu-arrival
.site-logo__icon-slot img {
	filter: invert(1);
	transition: none;
}


/*
 * Quand le volet gauche est fermé,
 * sa colonne passe à zéro.
 */
body.left-panel-closed .site-shell {
	grid-template-columns:
		0
		minmax(0, 1fr)
		0;
}

body.left-panel-closed .site-panel--left {
	transform: translateX(
		calc(-100% + var(--panel-border-width))
	);
	pointer-events: none;
}

body.left-panel-closed.global-menu-is-open
.site-panel--left,
body.left-panel-closed.global-menu-is-closing
.site-panel--left,
html.auxau-global-menu-arrival
body.left-panel-closed
.site-panel--left {
	transform: translateX(0);
	pointer-events: auto;
}

/*
 * Sur une fiche projet, le panneau gauche attend que le
 * volet noir ait entièrement terminé sa descente.
 */
body.single-projets.left-panel-closed.global-menu-is-open:not(
	.global-menu-left-panel-ready
)
.site-panel--left {
	transform: translateX(
		calc(-100% + var(--panel-border-width))
	);
	pointer-events: none;
}

/*
 * À la fermeture du menu depuis une fiche projet, le panneau
 * gauche termine d’abord sa sortie avant la remontée du volet noir.
 */
body.single-projets.left-panel-closed.global-menu-left-panel-leaving
.site-panel--left {
	transform: translateX(
		calc(-100% + var(--panel-border-width))
	);
	pointer-events: none;
}

body.global-menu-left-panel-leaving
.global-menu-toggle {
	pointer-events: none;
}

/* ==========================================================
   Volet droit : styles communs
   ========================================================== */

.site-panel--right {
	z-index: 40;

	box-sizing: border-box;
	width: var(--panel-right-width);
	height: 100vh;
	border-left: var(--panel-border-width) solid #000;

	background: #fff;
	transform: translateX(0);

	transition:
		transform
		var(--panel-duration)
		var(--panel-ease);
}

.site-panel__inner--right {
	position: relative;

	box-sizing: border-box;
	width: var(--panel-right-width);
	height: 100%;
	overflow: hidden;

	padding: 30px;
}

.site-panel__close {
	position: absolute;
	bottom: var(--icon-edge-block);
	left: var(--icon-edge-inline);
	z-index: 10;

	display: flex;
	align-items: center;
	justify-content: center;

	box-sizing: border-box;
	width: var(--icon-control-size);
	height: var(--icon-control-size);
	padding: 0;

	border: 0;
	background: transparent;
	color: #000;
	appearance: none;
	-webkit-appearance: none;

	font: inherit;
	font-size: 0;
	line-height: 1;

	cursor: pointer;
}

.site-panel--right .site-panel__close {
	display: flex;
}


/* ==========================================================
   Volet droit overlay
   ========================================================== */

/*
 * Ce volet passe au-dessus du contenu.
 * Il ne modifie donc jamais les colonnes du layout.
 */
.site-panel--right-overlay {
	position: fixed;
	top: 0;
	right: 0;
	z-index: 40;
}

body.right-panel-overlay.right-panel-is-open
.site-panel--right-overlay {
	transform: translateX(0);
}

body.right-panel-overlay.right-panel-is-closed
.site-panel--right-overlay {
	transform: translateX(
		calc(100% - var(--panel-border-width))
	);
	pointer-events: none;
}

/* ==========================================================
   Volet droit push
   ========================================================== */

/*
 * Contrairement à l’overlay, ce panneau participe
 * réellement à la grille dans la troisième colonne.
 */
.site-panel--right-push {
	position: fixed;
	top: 0;
	right: 0;
	z-index: 30;

	grid-column: 3;
	grid-row: 1;

	box-sizing: border-box;
	width: var(--panel-right-width);
	height: 100vh;
	overflow: hidden;

	background: #fff;
	transform: translateX(0);
}

.right-panel-content--project {
	font-size: var(--font-size-current);
	line-height: var(--line-height-current);
}

.right-panel-content--project :where(
	h2,
	h3,
	p,
	div
) {
	font-size: inherit;
	line-height: inherit;
}

.right-panel-content__abstraction {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: min(30vh, 260px);
	margin-bottom: 0;
}

.right-panel-content__abstraction img {
	display: block;
	width: 62%;
	height: min(26vh, 230px);
	object-fit: contain;
	object-position: center;
}

.right-panel-content__identity {
	margin-bottom: var(--page-padding-block);
	text-align: center;
}

.right-panel-content__title {
	margin: 0;
	font-size: inherit;
	font-weight: 400;
	line-height: inherit;
}

.right-panel-content__intervention,
.right-panel-content__description,
.right-panel-content__technical-sheet,
.right-panel-content__details {
	font-weight: 300;
}

.right-panel-content__title,
.right-panel-content__intervention {
	box-sizing: border-box;
	width: 65%;
	margin-right: auto;
	margin-left: auto;
	overflow-wrap: break-word;
}

.right-panel-content__intervention p,
.right-panel-content__description p,
.right-panel-content__technical-sheet p {
	margin: 0;
}

.right-panel-content__description {
	margin-bottom: var(--page-padding-block);
}

.right-panel-content__description p + p,
.right-panel-content__technical-sheet p + p {
	margin-top: 1em;
}

.right-panel-content__details {
	margin-top: 0;
}

.right-panel-content__details p {
	margin: 0;
}

.right-panel-content__download {
	display: inline-block;
	margin-top: 1em;
	color: inherit;
	text-decoration: underline;
	text-underline-offset: 0.15em;
}

/*
 * Sur les écrans très larges, les contenus des panneaux droits
 * conservent une longueur de ligne confortable.
 */
@media (min-width: 1800px) {

	.right-panel-content--project
	.right-panel-content__abstraction,
	.right-panel-content--project
	.right-panel-content__identity,
	.right-panel-content--project
	.right-panel-content__description,
	.right-panel-content--project
	.right-panel-content__technical-sheet,
	.right-panel-content--project
	.right-panel-content__details,
	.right-panel-content--atelier,
	.right-panel-content--mission {
		box-sizing: border-box;
		width: 85%;
		margin-right: 15%;
		margin-left: 0;
	}

}


/*
 * Fiche projet :
 * volet gauche fermé et volet droit ouvert.
 *
 * Le centre est réellement réduit par la troisième colonne.
 */
body.left-panel-closed.right-panel-push.right-panel-is-open
.site-shell {
	grid-template-columns:
		0
		minmax(0, 1fr)
		var(--panel-right-width);
}

body:not(.left-panel-closed).right-panel-push.right-panel-is-open
.site-shell {
	grid-template-columns:
		var(--panel-left-width)
		minmax(0, 1fr)
		var(--panel-right-width);
}


/*
 * Quand le volet droit est fermé,
 * sa colonne passe progressivement à zéro.
 * Le contenu central récupère donc toute la largeur.
 */
body.left-panel-closed.right-panel-push.right-panel-is-closed
.site-shell {
	grid-template-columns:
		0
		minmax(0, 1fr)
		0;
}

body.right-panel-push.right-panel-is-open
.site-panel--right-push {
	transform: translateX(0);
}

body.right-panel-push.right-panel-is-closed
.site-panel--right-push {
	transform: translateX(
		calc(100% - var(--panel-border-width))
	);
	pointer-events: none;
}


/* ==========================================================
   Bouton de réouverture du volet droit
   ========================================================== */

.site-panel__open--right {
	position: fixed;
	top: auto;
	bottom: var(--icon-edge-block);
	right: var(--icon-edge-inline);
	z-index: 45;

	display: flex;
	align-items: center;
	justify-content: center;

	box-sizing: border-box;
	width: var(--icon-control-size);
	height: var(--icon-control-size);
	padding: 0;

	border: 0;
	background: transparent;
	color: #000;
	appearance: none;
	-webkit-appearance: none;

	font: inherit;
	font-size: 0;
	line-height: 1;
	cursor: pointer;

	transition:
		right
		var(--panel-duration)
		var(--panel-ease),
		opacity
		1ms
		linear
		var(--panel-duration);
}

body.right-panel-is-open
.site-panel__open--right {
	right: calc(
		var(--panel-right-width) -
		var(--icon-edge-inline) -
		var(--icon-control-size)
	);
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
}

/*
 * Pendant l'ouverture ou la fermeture manuelle, le bouton
 * extérieur accompagne le volet et assure la transformation
 * continue plus/croix. La croix intérieure reprend ensuite
 * sa place lorsque le mouvement est terminé.
 */
body.is-right-panel-opening
.site-panel__open--right,
body.is-right-panel-closing
.site-panel__open--right {
	opacity: 1;
	visibility: visible;
	pointer-events: none;
	transition-delay: 0s, 0s;
}

body.is-right-panel-opening
.site-panel--right .site-panel__close,
body.is-right-panel-closing
.site-panel--right .site-panel__close {
	opacity: 0;
	pointer-events: none;
}

.site-panel__open--right[hidden] {
	display: none !important;
}

.site-panel__open--left {
	position: fixed;
	bottom: var(--icon-edge-block);
	left: var(--icon-edge-inline);
	z-index: 45;

	display: flex;
	align-items: center;
	justify-content: center;

	box-sizing: border-box;
	width: var(--icon-control-size);
	height: var(--icon-control-size);
	padding: 0;

	border: 0;
	background: transparent;
	color: #000;
	appearance: none;
	-webkit-appearance: none;

	font: inherit;
	font-size: 0;
	line-height: 1;
	text-decoration: none;
	cursor: pointer;

	transition:
		left
		var(--panel-duration)
		var(--panel-ease),
		opacity
		var(--content-duration)
		ease;
}

body:not(.left-panel-closed)
.site-panel__open--left {
	left: calc(
		var(--panel-left-width) -
		var(--icon-edge-inline) -
		var(--icon-control-size)
	);
}

.site-panel__close > span,
.site-panel__open > span {
	position: relative;
	display: block;
	width: var(--icon-size);
	height: var(--icon-size);
}

.site-panel__close > span::before,
.site-panel__close > span::after,
.site-panel__open > span::before,
.site-panel__open > span::after {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 100%;
	height: 3px;
	border-radius: 999px;
	background: currentColor;
	content: "";
	transform:
		translate(-50%, -50%);
	transform-origin: center center;
}

.site-panel__open--left > span::before,
.site-panel__open--left > span::after,
.site-panel__open--right > span::before,
.site-panel__open--right > span::after {
	transition:
		width
		var(--panel-duration)
		var(--panel-ease),
		transform
		var(--panel-duration)
		var(--panel-ease);
}

body:not(.left-panel-closed)
.site-panel__open--left > span::before,
body:not(.left-panel-closed)
.site-panel__open--left > span::after {
	width: var(--icon-diagonal-size);
}

body.right-panel-is-open
.site-panel__open--right > span::before,
body.right-panel-is-open
.site-panel__open--right > span::after {
	width: var(--icon-diagonal-size);
}

body.right-panel-is-open
.site-panel__open--right > span::before {
	transform:
		translate(-50%, -50%)
		rotate(45deg);
}

body.right-panel-is-open
.site-panel__open--right > span::after {
	transform:
		translate(-50%, -50%)
		rotate(-45deg);
}

body:not(.left-panel-closed)
.site-panel__open--left > span::before {
	transform:
		translate(-50%, -50%)
		rotate(45deg);
}

body:not(.left-panel-closed)
.site-panel__open--left > span::after {
	transform:
		translate(-50%, -50%)
		rotate(-45deg);
}

.site-panel__close > span::before,
.site-panel__close > span::after {
	width: var(--icon-diagonal-size);
}

.site-panel__open > span::after {
	transform:
		translate(-50%, -50%)
		rotate(90deg);
}

.site-panel__close > span::before {
	transform:
		translate(-50%, -50%)
		rotate(45deg);
}

.site-panel__close > span::after {
	transform:
		translate(-50%, -50%)
		rotate(-45deg);
}

html.auxau-entering-project
.site-panel__open--left,
body.is-project-panel-arriving
.site-panel__open--left {
	opacity: 0;
	pointer-events: none;
}


/* ==========================================================
   États initiaux contrôlés par JavaScript
   ========================================================== */

/*
 * Sans JavaScript, les éléments restent directement visibles.
 *
 * Avec JavaScript, ils commencent hors écran,
 * puis layout.js ajoute .layout-is-ready.
 */

html.auxau-js
body.right-panel-overlay:not(.layout-is-ready)
.site-panel--right-overlay {
	transform: translateX(
		calc(100% - var(--panel-border-width))
	);
}

/*
 * Le bouton plus/croix attend le panneau overlay au chargement.
 * Il ne doit pas apparaître seul avant l'arrivée du volet.
 */
html.auxau-js
body.right-panel-overlay:not(.layout-is-ready)
.site-panel__open--right {
	opacity: 0;
	pointer-events: none;
}

/* ==========================================================
   Arrivée directe sur une fiche projet
   ========================================================== */

html.auxau-direct-project
body.left-panel-closed.right-panel-push.right-panel-is-open
.site-shell {
	grid-template-columns:
		var(--panel-left-width)
		minmax(0, 1fr)
		var(--panel-right-width);
}

html.auxau-direct-project
body.left-panel-closed.right-panel-push.right-panel-is-closed
.site-shell {
	grid-template-columns:
		var(--panel-left-width)
		minmax(0, 1fr)
		0;
}

html.auxau-direct-project
body.left-panel-closed
.site-panel--left {
	transform: translateX(0);
	pointer-events: auto;
}

html.auxau-direct-project
.site-panel__open--left {
	opacity: 0;
	pointer-events: none;
}

/* ==========================================================
   Transition entre les rubriques
   ========================================================== */

body.is-leaving-for-section {
	cursor: progress;
}

body.is-leaving-for-section .site-content {
	opacity: 0;
	pointer-events: none;
}

body.is-section-panel-leaving.right-panel-is-open
.site-panel--right {
	transform: translateX(
		calc(100% - var(--panel-border-width))
	);
	pointer-events: none;
}

body.is-section-panel-leaving
.site-panel__open--right {
	opacity: 0;
	pointer-events: none;
	transition-delay: 0s, 0s;
}

html.auxau-entering-section
.site-content,
body.is-entering-section
.site-content {
	opacity: 0;
}

html.auxau-entering-section
body.right-panel-is-open
.site-panel--right,
body.is-section-panel-waiting.right-panel-is-open
.site-panel--right {
	transform: translateX(
		calc(100% - var(--panel-border-width))
	);
	pointer-events: none;
}


/* ==========================================================
   Transition listing → projet
   ========================================================== */

body.is-leaving-for-project {
	cursor: progress;
}

body.is-leaving-for-project .site-content {
	opacity: 0;
	pointer-events: none;
}

/* ==========================================================
   Transition projet → projet similaire
   ========================================================== */

body.is-leaving-for-similar-project {
	cursor: progress;
}

body.is-leaving-for-similar-project .site-content {
	opacity: 0;
	pointer-events: none;
}

body.is-similar-project-panel-leaving.right-panel-push
.site-panel--right-push {
	transform: translateX(
		calc(100% - var(--panel-border-width))
	);
	pointer-events: none;
}

html.auxau-entering-similar-project
body.right-panel-push
.site-content,
body.is-entering-similar-project
.site-content {
	opacity: 0;
}

html.auxau-entering-similar-project
body.right-panel-push
.site-panel--right-push {
	transform: translateX(
		calc(100% - var(--panel-border-width))
	);
}

body.is-similar-project-panel-arriving.right-panel-push
.site-panel--right-push {
	transform: translateX(0);
}

/* ==========================================================
   Arrivée sur une fiche projet
   ========================================================== */

/*
 * Avant le démarrage de l’animation :
 *
 * - contenu invisible ;
 * - volet gauche encore visible ;
 * - troisième colonne fermée ;
 * - volet droit hors écran.
 */
html.auxau-entering-project
body.right-panel-push
.site-content {
	opacity: 0;
}

html.auxau-entering-project
body.left-panel-closed.right-panel-push
.site-shell {
	grid-template-columns:
		var(--panel-left-width)
		minmax(0, 1fr)
		0;
}

html.auxau-entering-project
body.left-panel-closed
.site-panel--left {
	transform: translateX(0);
	pointer-events: auto;
}

html.auxau-entering-project
body.right-panel-push
.site-panel--right-push {
	transform: translateX(
		calc(100% - var(--panel-border-width))
	);
}


/*
 * Le volet gauche sort pendant que le droit arrive
 * et que la troisième colonne s’ouvre.
 * Le contenu reste masqué pendant ce mouvement.
 */
body.is-project-panel-arriving
.site-content {
	opacity: 0;
}

body.is-project-panel-arriving.left-panel-closed.right-panel-push
.site-shell {
	grid-template-columns:
		0
		minmax(0, 1fr)
		var(--panel-right-width);
}

body.is-project-panel-arriving.right-panel-push
.site-panel--right-push {
	transform: translateX(0);
}

/*
 * Quand le layout est stabilisé,
 * le contenu du projet apparaît.
 */
body.is-project-layout-ready.left-panel-closed.right-panel-push.right-panel-is-open
.site-shell {
	grid-template-columns:
		0
		minmax(0, 1fr)
		var(--panel-right-width);
}

body.is-project-layout-ready.right-panel-push.right-panel-is-open
.site-panel--right-push {
	transform: translateX(0);
}

body.is-entering-project .site-content {
	opacity: 0;
}

body.is-project-layout-ready .site-content {
	opacity: 1;
}

/*
 * Lorsqu’un projet similaire est ouvert avec le panneau gauche
 * fermé, l’état final de la fiche ne doit pas annuler le fondu
 * de sortie avant le rabattement du panneau droit.
 */
body.left-panel-closed.is-project-layout-ready.is-leaving-for-similar-project
.site-content {
	opacity: 0;
	pointer-events: none;
}


/* ==========================================================
   Retour fiche projet → liste des projets
   ========================================================== */

body.is-leaving-project-page .site-content {
	opacity: 0;
	pointer-events: none;
}

body.is-leaving-project-page
.site-panel__open {
	opacity: 0;
	pointer-events: none;
}

body.is-returning-to-projects-layout.left-panel-closed.right-panel-push.right-panel-is-open
.site-shell,
body.is-returning-to-projects-layout.left-panel-closed.right-panel-push.right-panel-is-closed
.site-shell {
	grid-template-columns:
		var(--panel-left-width)
		minmax(0, 1fr)
		0;
}

body.is-returning-to-projects-layout
.site-panel--left {
	transform: translateX(0);
	pointer-events: auto;
}

body.is-returning-to-projects-layout.right-panel-push.right-panel-is-open
.site-panel--right-push,
body.is-returning-to-projects-layout.right-panel-push.right-panel-is-closed
.site-panel--right-push {
	transform: translateX(100%);
	pointer-events: none;
}

html.auxau-entering-projects
.site-content {
	opacity: 0;
}


/* ==========================================================
   Ouverture et fermeture génériques du volet droit
   ========================================================== */

body.right-panel-is-open
.site-panel--right {
	transform: translateX(0);
}

body.right-panel-is-closed
.site-panel--right {
	transform: translateX(
		calc(100% - var(--panel-border-width))
	);
	pointer-events: none;
}


/* ==========================================================
   Contenu des volets
   ========================================================== */

.site-panel__content {
	box-sizing: border-box;
	height: 100%;
	min-height: 100%;
	overflow-y: auto;
	overscroll-behavior: contain;
	scrollbar-width: none;
	-ms-overflow-style: none;
	padding-bottom: calc(
		var(--icon-control-size) +
		var(--icon-edge-block)
	);
}

.site-panel__content::-webkit-scrollbar {
	display: none;
}

.site-panel__content.can-scroll-down:not(.can-scroll-up) {
	-webkit-mask-image: linear-gradient(
		to bottom,
		#000 0,
		#000 calc(100% - var(--panel-scroll-fade-bottom-size)),
		transparent 100%
	);
	mask-image: linear-gradient(
		to bottom,
		#000 0,
		#000 calc(100% - var(--panel-scroll-fade-bottom-size)),
		transparent 100%
	);
}

.site-panel__content.can-scroll-up:not(.can-scroll-down) {
	-webkit-mask-image: linear-gradient(
		to bottom,
		transparent 0,
		#000 var(--panel-scroll-fade-size),
		#000 100%
	);
	mask-image: linear-gradient(
		to bottom,
		transparent 0,
		#000 var(--panel-scroll-fade-size),
		#000 100%
	);
}

.site-panel__content.can-scroll-up.can-scroll-down {
	-webkit-mask-image: linear-gradient(
		to bottom,
		transparent 0,
		#000 var(--panel-scroll-fade-size),
		#000 calc(100% - var(--panel-scroll-fade-bottom-size)),
		transparent 100%
	);
	mask-image: linear-gradient(
		to bottom,
		transparent 0,
		#000 var(--panel-scroll-fade-size),
		#000 calc(100% - var(--panel-scroll-fade-bottom-size)),
		transparent 100%
	);
}

.site-panel--right-overlay,
.site-panel--right-push {
	will-change: transform;
}

.site-shell {
	will-change: grid-template-columns;
}

.site-panel--left {
	will-change: transform;
}

.site-content {
	will-change: opacity;
}


/* ==========================================================
   Responsive mobile
   ========================================================== */

@media (max-width: 760px) {

	:root {
		--icon-edge-inline: 2.5vw;
		--icon-edge-block: 2.5vw;
	}

	.projects-scroll-top {
		bottom: calc(
			var(--icon-edge-block) +
			var(--icon-control-size)
		);
		z-index: 64;
	}

	.projets-filtres {
		box-sizing: border-box;
		width: 100%;
		padding-right: calc(
			var(--icon-control-size) +
			var(--icon-edge-inline)
		);
		gap: 10px;
		font-size: 18px;
		line-height: var(--line-height-current);
	}

	.page-template-template-projets
	.projets-recherche {
		padding-top: 0;
	}

	.projets-filtres__groupe {
		align-items: center;
		gap: 7px 10px;
	}

	.projets-filtres__titre {
		flex-basis: auto;
		margin-right: 0.35em;
		padding: 4px 0;
		line-height: var(--line-height-current);
	}

	.projets-filtres .projets-filtre {
		border-width: 2px;
		padding: 3px 9px 4px;
		line-height: var(--line-height-current);
	}

	.projets-filtres .projets-elements-search {
		flex: 0 1 60%;
		width: 60%;
		min-width: 0;
	}

	.projets-filtres .projets-elements-search__input {
		padding-top: 4px;
		padding-bottom: 5px;
		line-height: var(--line-height-current);
	}

	.projets-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		padding-top: 0;
	}

	.atelier-slider__slide,
	.mission-slider__slide {
		width: calc(
			100vw -
			var(--icon-edge-inline) -
			var(--icon-edge-inline)
		);
		height: auto;
		aspect-ratio: 1 / 1;
	}

	.atelier-slider__image,
	.mission-slider__image {
		width: 100%;
		height: 100%;
	}

	.atelier-slider__image img,
	.mission-slider__image img {
		width: 100%;
		height: 100%;
		max-width: 100%;
		object-fit: cover;
		object-position: center;
	}

	.projets-affichage {
		position: relative;
		padding-bottom: var(--icon-edge-block);
		border-bottom: 0;
	}

	.projets-affichage::after {
		position: absolute;
		bottom: 0;
		left: calc(0px - var(--page-margin-inline));
		width: calc(
			100% +
			var(--page-margin-inline) +
			var(--page-margin-inline)
		);
		height: 3px;
		background: currentColor;
		content: "";
	}

	.projets-liste__entete::after,
	.projets-liste__ligne::after {
		left: calc(0px - var(--page-margin-inline));
		width: calc(
			100% +
			var(--page-margin-inline) +
			var(--page-margin-inline)
		);
	}

	.projets-liste__entete {
		isolation: isolate;
		background: transparent;
	}

	.projets-liste__entete::before {
		position: absolute;
		z-index: -1;
		top: 0;
		right: calc(0px - var(--page-margin-inline));
		bottom: 0;
		left: calc(0px - var(--page-margin-inline));
		background: #e9e9e9;
		content: "";
	}

	.projet__lien {
		aspect-ratio: auto;
		overflow: visible;
	}

	.projet__image {
		position: relative;
		inset: auto;
		aspect-ratio: 1 / 1;
	}

	.projet__lien:hover .projet__image img,
	.projet__lien:focus-visible .projet__image img {
		filter: none;
	}

	.projet__overlay {
		position: relative;
		inset: auto;
		display: block;
		margin-top: 8px;
		color: #000;
		opacity: 1;
	}

	.projet__overlay-contenu {
		width: 100%;
	}

	.projets-filtres-panel {
		position: fixed;
		right: 0;
		bottom: 0;
		left: 0;
		z-index: 60;
		box-sizing: border-box;
		width: 100%;
		padding:
			var(--icon-edge-block)
			var(--page-margin-inline)
			var(--icon-edge-block);
		overflow: visible;
		border-top: var(--panel-border-width) solid #000;
		background: #fff;
		transform: translateY(
			calc(100% - var(--panel-border-width))
		);
		pointer-events: none;
		transition:
			transform
			var(--panel-duration)
			var(--panel-ease);
	}

	.projets-filtres-panel.is-open {
		transform: translateY(0);
		pointer-events: auto;
	}

	body:not(.mobile-bottom-panels-ready)
	.projets-filtres-panel {
		transform: translateY(100%) !important;
		pointer-events: none;
	}

	.projets-filtres-panel__close,
	.projets-filtres-panel__open {
		appearance: none;
		-webkit-appearance: none;
		align-items: center;
		justify-content: center;
		box-sizing: border-box;
		width: auto;
		height: var(--icon-control-size);
		padding: 0;
		border: 0;
		background: transparent;
		color: #000;
		font: inherit;
		font-size: 0;
		line-height: 1;
		cursor: pointer;
	}

	.projets-filtres-panel__close {
		position: absolute;
		top: var(--icon-edge-block);
		right: var(--icon-edge-inline);
		z-index: 2;
		display: flex;
		width: var(--icon-control-size);
	}

	.projets-filtres-panel__open {
		position: relative;
		z-index: auto;
		display: flex;
		margin-right: auto;
		gap: 8px;
		font-size: var(--font-size-title);
		font-weight: 400;
	}

	.projets-filtres-panel__open[hidden] {
		display: flex !important;
	}

	.projets-filtres-panel__close > span {
		position: relative;
		display: block;
		width: var(--icon-size);
		height: var(--icon-size);
	}

	.projets-filtres-panel__open-symbol {
		font-size: 1.35em;
		font-weight: 300;
		line-height: 1;
	}

	.projets-filtres-panel__open-label {
		line-height: 1;
	}

	.projets-filtres-panel__open:hover
	.projets-filtres-panel__open-label,
	.projets-filtres-panel__open:focus-visible
	.projets-filtres-panel__open-label {
		text-decoration: underline;
		text-decoration-thickness: 2px;
		text-underline-offset: 3px;
	}

	.projets-filtres-panel__close > span::before,
	.projets-filtres-panel__close > span::after {
		position: absolute;
		top: 50%;
		left: 50%;
		width: 100%;
		height: 3px;
		border-radius: 999px;
		background: currentColor;
		content: "";
		transform: translate(-50%, -50%);
		transform-origin: center;
	}

	.projets-filtres-panel__close > span::before,
	.projets-filtres-panel__close > span::after {
		width: var(--icon-diagonal-size);
	}

	.projets-filtres-panel__close > span::before {
		transform: translate(-50%, -50%) rotate(45deg);
	}

	.projets-filtres-panel__close > span::after {
		transform: translate(-50%, -50%) rotate(-45deg);
	}

	/*
	 * Sur mobile, les panneaux passent tous en overlay :
	 * on ne réduit plus la largeur du contenu.
	 */
	.site-shell,
	body.left-panel-closed .site-shell,
	body.left-panel-closed.right-panel-push.right-panel-is-open
	.site-shell,
	body.left-panel-closed.right-panel-push.right-panel-is-closed
	.site-shell,
	body.is-project-panel-arriving.left-panel-closed.right-panel-push
	.site-shell,
	body.is-project-layout-ready.left-panel-closed.right-panel-push
	.site-shell {
		display: flex;
		flex-direction: column;
	}

	.site-center {
		width: 100%;
		min-height: 100vh;
	}

	.site-panel--right {
		position: fixed;
		top: auto;
		right: 0;
		bottom: 0;
		left: 0;
		width: 100%;
		height: 50vh;
		height: 50dvh;
		max-height: 50vh;
		max-height: 50dvh;
		border-top: var(--panel-border-width) solid #000;
		border-left: 0;
	}

	.site-panel--right .site-panel__close {
		right: var(--icon-edge-inline);
		left: auto;
		display: flex;
	}

	.site-panel__open--right,
	.site-panel__open--right[hidden] {
		display: flex !important;
	}

	body.right-panel-is-open
	.site-panel__open--right {
		right: var(--icon-edge-inline);
	}

	.site-panel__open--right > span::before,
	.site-panel__open--right > span::after {
		transition:
			width
			var(--panel-duration)
			var(--panel-ease),
			transform
			var(--panel-duration)
			var(--panel-ease);
	}

	body.right-panel-is-open
	.site-panel__open--right > span::before,
	body.right-panel-is-open
	.site-panel__open--right > span::after {
		width: var(--icon-diagonal-size);
	}

	body.right-panel-is-open
	.site-panel__open--right > span::before {
		transform: translate(-50%, -50%) rotate(45deg);
	}

	body.right-panel-is-open
	.site-panel__open--right > span::after {
		transform: translate(-50%, -50%) rotate(-45deg);
	}

	body:not(.mobile-bottom-panels-ready)
	.site-panel--right {
		transform: translateY(100%) !important;
		pointer-events: none;
	}

	body:not(.mobile-bottom-panels-ready)
	.site-panel__open--right {
		opacity: 0;
		pointer-events: none;
	}

	body.right-panel-overlay.right-panel-is-open
	.site-panel--right-overlay,
	body.right-panel-push.right-panel-is-open
	.site-panel--right-push {
		transform: translateY(0);
	}

	body.right-panel-overlay.right-panel-is-closed
	.site-panel--right-overlay,
	body.right-panel-push.right-panel-is-closed
	.site-panel--right-push {
		transform: translateY(
			calc(100% - var(--panel-border-width))
		);
	}

	.site-panel--left {
		position: relative;
		top: auto;
		left: 0;
		z-index: auto;
		box-sizing: border-box;
		width: calc(
			(
				100% -
				var(--page-margin-inline) -
				var(--page-margin-inline) -
				var(--page-padding-block)
			) / 2
		);
		height: auto;
		min-height: 0;
		border-right: 0;
		background: transparent;
		transform: none !important;
		pointer-events: auto !important;
		flex: 0 0 auto;
		margin-top: var(--icon-edge-block);
		margin-right: auto;
		margin-left: var(--icon-edge-inline);
		will-change: auto;
	}

	.site-panel__inner--left {
		position: relative;
		top: auto;
		width: 100%;
		height: auto;
		overflow: visible;
		padding: 0;
	}

	.site-header {
		min-height: 0;
	}

	.site-logo {
		width: 100%;
	}

	.site-secondary-navigation,
	.site-contact {
		display: none;
	}

	body.global-menu-is-open .site-panel--left,
	body.global-menu-is-closing .site-panel--left,
	html.auxau-global-menu-arrival .site-panel--left {
		position: relative;
		top: auto;
		left: 0;
		z-index: auto;
		width: calc(
			(
				100% -
				var(--page-margin-inline) -
				var(--page-margin-inline) -
				var(--page-padding-block)
			) / 2
		);
		height: auto;
		visibility: visible;
		opacity: 1;
		color: #12120d;
		transform: none !important;
		pointer-events: auto !important;
		will-change: auto;
	}

	body.global-menu-is-open .site-logo,
	body.global-menu-is-closing .site-logo,
	html.auxau-global-menu-arrival .site-logo {
		color: #12120d;
	}

	body.global-menu-is-open .site-logo__icon-slot img,
	body.global-menu-is-closing .site-logo__icon-slot img,
	html.auxau-global-menu-arrival
	.site-logo__icon-slot img {
		filter: none;
	}

	.global-menu {
		z-index: 125;
		flex-direction: column;
		padding:
			var(--page-padding-block)
			var(--page-margin-inline);
	}

	.global-menu__navigation {
		padding: 0;
	}

	.global-search-toggle,
	.global-search {
		display: none;
	}

	body.global-search-is-open
	.site-content {
		margin-top: 0;
	}

	.global-menu__mobile-search {
		display: flex;
		align-items: center;
		width: 100%;
		margin-top: var(--page-padding-block);
		gap: 12px;
	}

	.global-menu__mobile-search-input {
		box-sizing: border-box;
		flex: 0 1 60%;
		width: 60%;
		min-width: 0;
		padding: 7px 12px 8px;
		border: 0;
		border-radius: 6px;
		background: #333;
		color: #fff;
		font-family: inherit;
		font-size: var(--font-size-title);
		font-style: normal;
		font-weight: 400;
		line-height: var(--line-height-title);
	}

	.global-menu__mobile-search-input::placeholder {
		color: #fff;
		font-style: italic;
		opacity: 1;
	}

	.global-menu__mobile-search-submit {
		display: flex;
		align-items: center;
		justify-content: center;
		box-sizing: border-box;
		flex: 0 0 var(--icon-control-size);
		width: var(--icon-control-size);
		height: var(--icon-control-size);
		padding: 0;
		border: 0;
		background: transparent;
		color: #fff;
		cursor: pointer;
	}

	.global-menu__mobile-search-submit svg {
		display: block;
		width: var(--icon-size);
		height: var(--icon-size);
		fill: none;
		stroke: currentColor;
		stroke-width: 3;
		stroke-linecap: round;
		stroke-linejoin: round;
	}

	.global-menu__mobile-information {
		display: flex;
		flex-direction: column;
		width: 100%;
		margin-top: auto;
		color: inherit;
	}

	.global-menu__mobile-navigation {
		font-size: var(--font-size-title);
		line-height: 1.4;
	}

	.global-menu__mobile-navigation a,
	.global-menu__mobile-contact a {
		color: inherit;
		text-decoration: none;
	}

	.global-menu__mobile-navigation .is-active {
		text-decoration: underline;
		text-decoration-thickness: 2px;
		text-underline-offset: 3px;
	}

	.global-menu__mobile-navigation > a {
		display: block;
	}

	.global-menu__mobile-contact {
		margin-top: var(--page-padding-block);
		font-style: normal;
		font-size: var(--font-size-small);
		line-height: var(--line-height-small);
	}

	.global-menu__mobile-contact p {
		margin: 0;
	}

	.global-menu__mobile-contact p + p {
		margin-top: 20px;
	}

	.site-panel__open--left {
		display: none !important;
	}

	.site-panel--right-push {
		grid-column: auto;
	}

	.site-panel__inner--right {
		width: 100%;
	}

}


/* ==========================================================
   Accessibilité : animations réduites
   ========================================================== */

@media (prefers-reduced-motion: reduce) {

	.site-shell,
	.site-center,
	.site-content,
	.site-panel--left,
	.site-panel--right,
	.global-menu,
	.global-search-toggle,
	.global-menu-toggle,
	.global-menu-toggle__line {
		transition-duration: 1ms !important;
		animation-duration: 1ms !important;
	}

	.projets-resultats__points span {
		animation: none;
		opacity: 1;
		transform: none;
	}

}


/* ==========================================================
   Correction des aperçus au survol dans la vue liste
   ========================================================== */

/*
 * Ne pas annoncer de transformation sur le contenu central.
 *
 * Sinon les éléments positionnés en fixed à l’intérieur,
 * comme l’aperçu de la liste, peuvent ne plus être positionnés
 * par rapport à la fenêtre.
 */
.site-content {
	will-change: opacity;
}


/*
 * Les conteneurs de la liste ne doivent pas couper l’aperçu.
 */
.projets-view--list,
.projets-liste,
.projets-liste__tableau,
.projets-liste__lignes,
.projets-liste__ligne {
	overflow: visible;
}


/*
 * L’aperçu reste présent dans le document.
 * Il est seulement rendu invisible jusqu’au survol.
 */
.projets-liste__apercu {
	position: fixed;
	top: var(--project-preview-top, 0px);
	left: var(--project-preview-left, auto);
	right: auto;
	z-index: 9999;

	display: block !important;
	width: var(
		--project-preview-width,
		min(340px, 30vw)
	);

	opacity: 0;
	visibility: hidden;

	transform:
		translateX(12px);

	pointer-events: none;

	transition:
		opacity 180ms ease,
		transform 180ms ease,
		visibility 0s linear 180ms;
}


/*
 * Apparition au survol ou au clavier.
 */
.projets-liste__ligne:hover
.projets-liste__apercu,
.projets-liste__ligne:focus-visible
.projets-liste__apercu,
.projets-liste__ligne:focus-within
.projets-liste__apercu {
	opacity: 1;
	visibility: visible;

	transform:
		translateX(0);

	transition:
		opacity 180ms ease,
		transform 180ms ease,
		visibility 0s;
}


.projets-liste__apercu-image {
	display: block;
	width: 100%;
}


.projets-liste__apercu-image img {
	display: block;
	width: 100%;
	height: auto;
	max-height: 55vh;
	object-fit: contain;
}


.projets-liste__apercu-description {
	display: block;
	margin-top: 14px;
	text-align: center;
	line-height: 1.25;
}


.projets-liste__apercu-description p {
	margin: 0 0 8px;
}


.projets-liste__apercu-description p:last-child {
	margin-bottom: 0;
}


/*
 * On désactive seulement l’aperçu sur les écrans réellement
 * tactiles et étroits, et non plus sous 1000px.
 */
@media (max-width: 760px) {

	.projets-liste__apercu {
		display: none !important;
	}

}



/* ==========================================================
   Autres styles responsive du thème
   ========================================================== */

@media only screen and (max-width: 900px) {

	/* Styles supplémentaires éventuels. */

}