/* Identité commune 2026. Chargée après les styles historiques. */
@import url('ecriture-art.css');

body {
	background: var(--paper, #f4f0e9) !important;
	color: var(--ink, #161514) !important;
	color-scheme: light;
	font-family: var(--sans, 'DM Sans', sans-serif) !important;
	padding-top: 0 !important;
}

html { background: #f4f0e9; color-scheme: light; }

body:not(.redesign-home) #wrapper {
	padding-top: 5.2rem;
	background: var(--paper, #f4f0e9);
}

body:not(.redesign-home) #header {
	background: #161514 !important;
	height: 5.2rem;
	line-height: 5.2rem;
	padding: 0 clamp(1.25rem, 4vw, 4.5rem);
	position: fixed;
}

body:not(.redesign-home) #header .logo,
body:not(.redesign-home) #header nav a {
	color: #f4f0e9 !important;
	font-family: var(--mono, monospace);
	font-size: .7rem;
	letter-spacing: .1em;
	text-transform: uppercase;
}

body:not(.redesign-home) #header .logo {
	background: #161514 !important;
	color: #f4f0e9 !important;
	text-decoration: none;
}
body:not(.redesign-home) #header .logo strong {
	background: transparent !important;
	color: #d6ff46 !important;
	margin: 0;
	padding: 0;
}
body:not(.redesign-home) #header .logo:hover,
body:not(.redesign-home) #header .logo:hover strong { background: #161514 !important; color: #ffffff !important; }
body:not(.redesign-home) #header nav a[href="#menu"] { color: #ffffff !important; }
body:not(.redesign-home) #header nav a[href="#menu"]:before,
body:not(.redesign-home) #header nav a[href="#menu"]:before,
body:not(.redesign-home) #header nav a[href="#menu"]:after { background-color: #ffffff; }

body:not(.redesign-home) #header nav a[href="#menu"]:before {
	background-color: #f4f0e9 !important;
	background-image: none !important;
	box-shadow: 0 .42rem 0 #f4f0e9, 0 .84rem 0 #f4f0e9;
	height: 2px;
	right: 1.25rem;
	top: calc(50% - .42rem);
	width: 1.35rem;
}
body:not(.redesign-home) #header nav a[href="#menu"]:after { display: none; }
body:not(.redesign-home) #header nav a[href="#menu"]:hover:before,
body:not(.redesign-home) #header nav a[href="#menu"]:focus-visible:before {
	background-color: #d6ff46 !important;
	box-shadow: 0 .42rem 0 #d6ff46, 0 .84rem 0 #d6ff46;
}

#menu { background: #161514 !important; color: #f4f0e9 !important; }
#menu .inner { width: min(31rem, 100%) !important; }
#menu a, #menu h1, #menu h2, #menu h3, #menu li { color: #f4f0e9 !important; }
#menu ul.links > li > a:not(.button) {
	font-family: var(--mono, monospace) !important;
	font-size: .72rem !important;
	letter-spacing: .1em !important;
	line-height: 3.25em !important;
}
#menu ul.links > li > a:not(.button):hover,
#menu ul.links > li > a:not(.button):focus-visible { background: #d6ff46; color: #161514 !important; }
#menu .button { background: #d6ff46; box-shadow: none; color: #161514 !important; }
#menu .close {
	background: transparent !important;
	border: 1px solid rgba(244,240,233,.7) !important;
	height: 3rem;
	line-height: 3rem;
	right: 1.25rem;
	top: 1.25rem;
	width: 3rem;
}
#menu .close:before, #menu .close:after {
	background-color: #f4f0e9 !important;
	background-image: none !important;
	height: 2px;
	op: calc(50% - 1px);
	right: .68rem;
	width: 1.55rem;
	opacity: 1 !important;
}
#menu .close:before { transform: rotate(45deg); }
#menu .close:after { transform: rotate(-45deg); }
#menu .close:hover, #menu .close:focus-visible { background: #d6ff46 !important; border-color: #d6ff46 !important; }
#menu .close:hover:before, #menu .close:hover:after, #menu .close:focus-visible:before, #menu .close:focus-visible:after { background-color: #161514 !important; }

@media (prefers-color-scheme: dark) {
	html, body { background: #f4f0e9 !important; color: #161514 !important; }
	#menu { background: #161514 !important; color: #f4f0e9 !important; }
}

body:not(.redesign-home) #main,
body:not(.redesign-home) #main.alt { background: var(--paper, #f4f0e9); }

/* Les anciennes bannières Forty deviennent des chapôs éditoriaux lisibles. */
body:not(.redesign-home) #banner {
	align-items: center;
	background: #f4f0e9 !important;
	background-image: none !important;
	border-bottom: 1px solid rgba(22,21,20,.18);
	color: #161514;
	display: flex;
	min-height: min(35rem, 72vh);
	overflow: hidden;
	padding: clamp(5rem, 10vw, 9rem) clamp(1.25rem, 9vw, 10rem) clamp(4rem, 7vw, 7rem);
	position: relative;
}

body:not(.redesign-home) #banner:before {
	background: transparent;
	border: 1px solid rgba(22,21,20,.16);
	border-radius: 50%;
	content: '';
	display: block;
	height: min(54vw, 44rem);
	left: 53%;
	opacity: 1;
	position: absolute;
	top: -35%;
	width: min(54vw, 44rem);
	z-index: 0;
}

body:not(.redesign-home) #banner:after {
	color: #ff6e5f;
	content: 'EA';
	font: 500 clamp(8rem, 22vw, 23rem)/.8 var(--serif, Georgia, serif);
	letter-spacing: -.17em;
	opacity: .16;
	position: absolute;
	right: 11%;
	top: 22%;
	z-index: 0;
}

body:not(.redesign-home) #banner > .inner {
	border: 1px solid rgba(22,21,20,.17);
	margin: 0;
	max-width: 56rem;
	padding: clamp(2rem, 5vw, 4.5rem);
	position: relative;
	width: 100%;
	z-index: 1;
}

body:not(.redesign-home) #banner > .inner .image { display: none !important; }
body:not(.redesign-home) #banner .major { margin-bottom: 1.7rem; }
body:not(.redesign-home) #banner h1 {
	border: 0;
	color: #161514 !important;
	font: 500 clamp(3.2rem, 7.5vw, 7.5rem)/.87 var(--serif, Georgia, serif) !important;
	letter-spacing: -.075em;
	margin: 0;
	padding: 0;
	text-transform: none;
}
body:not(.redesign-home) #banner h1:after { background: #ff6e5f; content: ''; display: block; height: 5px; margin-top: 1.3rem; width: 4rem; }
body:not(.redesign-home) #banner .content { max-width: 42rem; }
body:not(.redesign-home) #banner .content p {
	color: #34312d !important;
	font: 1.1rem/1.6 var(--sans, sans-serif) !important;
	letter-spacing: 0;
	margin: 0;
}
body:not(.redesign-home) #main > section { border-top: 0; }
body:not(.redesign-home) #main > section > .inner {
	max-width: 66rem;
	padding: clamp(3rem, 7vw, 7rem) clamp(1.25rem, 6vw, 5rem);
}

body:not(.redesign-home) #main h1,
body:not(.redesign-home) #main h2,
body:not(.redesign-home) #main h3 {
	color: var(--ink, #161514);
	font-family: var(--serif, Georgia, serif) !important;
	font-weight: 500;
	letter-spacing: -.055em;
	text-transform: none;
}

body:not(.redesign-home) #main h1 { font-size: clamp(3rem, 7vw, 6.5rem); line-height: .9; }
body:not(.redesign-home) #main h2 { font-size: clamp(2.1rem, 4vw, 4rem); line-height: .95; }
body:not(.redesign-home) #main h3 { font-size: clamp(1.45rem, 2.4vw, 2.25rem); line-height: 1; }
body:not(.redesign-home) #main header.major > :first-child:after { background-color: var(--pink, #ff6e5f); }
body:not(.redesign-home) #main p,
body:not(.redesign-home) #main li,
body:not(.redesign-home) #main td {
	color: #34312d;
	font-family: var(--sans, sans-serif) !important;
	font-size: 1.03rem;
	line-height: 1.7;
}
/* Des pages historiques appliquent .p en blanc : la feuille moderne doit primer. */
body:not(.redesign-home) #main .p,
body:not(.redesign-home) #main .p b { color: var(--ink, #161514) !important; }
body:not(.redesign-home) #main strong,
body:not(.redesign-home) #main b,
body:not(.redesign-home) #main th { color: var(--ink, #161514) !important; }
body:not(.redesign-home) #main label { color: var(--ink, #161514) !important; }
body:not(.redesign-home) #main a { color: #161514; border-bottom-color: #ff6e5f; }
body:not(.redesign-home) #main a:hover,
body:not(.redesign-home) #main a:focus-visible {
	background: #d6ff46;
	border-bottom-color: #d6ff46;
	color: #161514 !important;
	outline: 0;
}
body:not(.redesign-home) #main table { width: min(100%, 62rem) !important; margin: 2.5rem auto; }
body:not(.redesign-home) #main img { height: auto; max-width: 100%; }

/* Galeries historiques : les légendes ne doivent jamais hériter du blanc. */
body:not(.redesign-home) #main .gallery {
	display: block;
	margin: 2.5rem auto;
	max-width: 76rem;
}
body:not(.redesign-home) #main .gallery .responsive-table {
	border-collapse: separate;
	border-spacing: .85rem;
	margin: 0 auto;
	width: 100% !important;
}
body:not(.redesign-home) #main .gallery .responsive-table td {
	background: #fffdf8;
	box-shadow: inset 0 0 0 1px rgba(22,21,20,.14);
	color: #161514 !important;
	padding: 1rem !important;
	text-align: center;
	vertical-align: top;
}
body:not(.redesign-home) #main .gallery h5,
body:not(.redesign-home) #main .gallery h6 {
	color: #161514 !important;
	font-family: var(--mono, monospace) !important;
	font-size: .72rem !important;
	font-weight: 500;
	letter-spacing: .06em;
	line-height: 1.35;
	margin: 0 0 .8rem;
	text-transform: uppercase;
}
/* Brouillons : les repères de la galerie deviennent des cartouches très lisibles. */
body.brouillons-page #main h6,
body.brouillons-page #main .gallery h5 {
	background: #d6ff46;
	color: #161514 !important;
	display: inline-block;
	padding: .45rem .6rem;
}
body.brouillons-page #main h6 { margin: 1.4rem 0 2rem; }
body:not(.redesign-home) #main .gallery .thumbnail {
	border: 1px solid rgba(22,21,20,.5);
	border-radius: 0;
	box-shadow: none;
}
body:not(.redesign-home) #main .spotlights > section { background: #ebe5dc; }
body:not(.redesign-home) #main .spotlights > section:nth-child(2n) { background: #e0d5c6; }
body:not(.redesign-home) #main .spotlights > section > .content { padding: 3rem; }
body:not(.redesign-home) #main .spotlights > section > .content p { color: #34312d; }

/* Les panneaux d’orientation deviennent des cartes éditoriales. */
body:not(.redesign-home) #main .spotlights {
	display: grid;
	gap: 1.25rem;
	margin: 0 auto;
	max-width: 82rem;
	padding: clamp(1.25rem, 4vw, 4rem);
}
body:not(.redesign-home) #main .spotlights > section,
body:not(.redesign-home) #main .spotlights > section:nth-child(2n) {
	background: #ebe5dc;
	display: grid !important;
	grid-template-columns: minmax(14rem, .92fr) minmax(0, 1.08fr);
	min-height: 24rem;
	position: relative;
}
body:not(.redesign-home) #main .spotlights > section:nth-child(2n) { background: #e9d3bb; }
body:not(.redesign-home) #main .spotlights > section:nth-child(3n) { background: #d9d7d0; }
body:not(.redesign-home) #main .spotlights > section > .image {
	background: #c9c3b8;
	display: block;
	grid-column: 1;
	min-height: 24rem;
	width: auto !important;
}
body:not(.redesign-home) #main .spotlights > section > .image img {
	height: 100%;
	object-fit: cover;
	width: 100%;
}
body:not(.redesign-home) #main .spotlights > section > .content {
	align-items: stretch;
	background: inherit;
	display: flex;
	grid-column: 2;
	justify-content: flex-end;
	padding: clamp(2rem, 5vw, 5rem);
	width: auto !important;
}
body:not(.redesign-home) #main .spotlights > section > .content > .inner { margin: 0; max-width: 38rem; width: 100%; }
body:not(.redesign-home) #main .spotlights > section:nth-child(2n) > .content { align-items: stretch; }
body:not(.redesign-home) #main .spotlights h3 { margin-top: 0; }
body:not(.redesign-home) .button,
body:not(.redesign-home) input[type="submit"],
body:not(.redesign-home) input[type="reset"] {
	border-radius: 0;
	box-shadow: inset 0 0 0 1px #161514;
	color: #161514 !important;
	font-family: var(--mono, monospace);
	font-size: .68rem;
	letter-spacing: .08em;
}
body:not(.redesign-home) .button:hover,
body:not(.redesign-home) input[type="submit"]:hover { background: #d6ff46; color: #161514 !important; }
body:not(.redesign-home) input[type="text"],
body:not(.redesign-home) input[type="email"],
body:not(.redesign-home) textarea {
	background: #fffdf8;
	border: 1px solid rgba(22,21,20,.32);
	color: #161514 !important;
}

body:not(.redesign-home) #footer {
	background: #d6ff46;
	color: #161514;
	padding: 2.5rem clamp(1.25rem, 6vw, 5rem);
}
body:not(.redesign-home) #footer .inner { padding: 0; }
body:not(.redesign-home) #footer a,
body:not(.redesign-home) #footer li { color: #161514; font-family: var(--mono, monospace); font-size: .72rem; }

	@media screen and (max-width: 736px) {
	body:not(.redesign-home) #wrapper { padding-top: 4.4rem; }
	body:not(.redesign-home) #header { height: 4.4rem; line-height: 4.4rem; }
	body:not(.redesign-home) #main > section > .inner { padding: 3.5rem 1.35rem; }
	body:not(.redesign-home) #main header.major { max-width: 100%; width: auto; }
	body:not(.redesign-home) #main header.major > p {
		letter-spacing: .12em;
		overflow-wrap: anywhere;
		white-space: normal;
	}
	body:not(.redesign-home) #main .spotlights > section > .content { padding: 2rem 1.35rem; }
	body:not(.redesign-home) #banner { min-height: auto; padding: 4rem 1.25rem; }
	body:not(.redesign-home) #banner > .inner { padding: 2rem 1.35rem; }
	body:not(.redesign-home) #banner:before { height: 21rem; left: 48%; top: -8rem; width: 21rem; }
	body:not(.redesign-home) #banner:after { font-size: 9rem; right: 12%; }
	body:not(.redesign-home) #main .spotlights > section,
	body:not(.redesign-home) #main .spotlights > section:nth-child(2n) { grid-template-columns: 1fr; }
	body:not(.redesign-home) #main .spotlights > section > .image { grid-column: 1; min-height: 15rem; }
	body:not(.redesign-home) #main .spotlights > section > .content { grid-column: 1; padding: 2rem 1.35rem; }
}