@font-face {
	font-family: "Source Sans Pro";
	font-style: normal;
	font-weight: 300;
	font-display: swap;
	src: url("/assets/fonts/source-sans-pro-300.woff2") format("woff2");
}

@font-face {
	font-family: "Source Sans Pro";
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url("/assets/fonts/source-sans-pro-600.woff2") format("woff2");
}

:root {
	--font-size: 1.5833rem;
	--sidebar-width: 375px;
	--container-width: 1400px;
	--container-padding: 0;
	--section-padding: 4em;
	--cover-padding: 6em;
	--ink: #6b6b6b;
	--heading: #666;
	--navy: #273a86;
	--red: #ab0000;
	--hover: #c0425a;
	--section-bg: rgb(122 147 199 / 0.23);
	--panel-bg: rgb(255 255 255 / 0.7);
	--sidebar-bg: #222629;
	--sidebar-ink: rgb(255 255 255 / 0.5);
	--sidebar-icon: #41484c;
	--active-icon: #e27689;
	--toggle-bg: #7d858d;
}

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

html {
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
}

@media (prefers-reduced-motion: no-preference) {
	html {
		scroll-behavior: smooth;
	}
}

body {
	margin: 0;
	background: #fff;
	color: var(--ink);
	font-family: "Source Sans Pro", sans-serif;
	font-size: var(--font-size);
	font-weight: 300;
	line-height: 1.75em;
}

h1,
h2,
h3,
p,
ul,
figure {
	margin: 0;
	padding: 0;
}

h1,
h2,
h3 {
	font-weight: 300;
	color: var(--heading);
	line-height: 1.5em;
}

h2 {
	font-size: 2em;
	letter-spacing: -1px;
	margin-bottom: calc(var(--font-size) * 2);
}

p,
ul {
	margin-bottom: 2em;
}

ul {
	list-style: none;
}

strong {
	font-weight: inherit;
	color: var(--red);
}

a {
	color: inherit;
	text-decoration: none;
	border-bottom: 1px dotted rgb(128 128 128 / 0.5);
	transition: color 0.35s ease-in-out, border-bottom-color 0.35s ease-in-out;
}

a:hover {
	color: var(--hover);
	border-bottom-color: transparent;
}

:focus-visible {
	outline: 3px solid var(--navy);
	outline-offset: 3px;
}

img {
	max-width: 100%;
	height: auto;
}

.icon {
	width: 1.25em;
	height: 1.25em;
	fill: currentColor;
}

.visually-hidden {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
}

.skip-link {
	position: absolute;
	top: 0.5em;
	left: -999em;
	z-index: 10010;
	padding: 0.5em 1em;
	background: #fff;
	color: var(--navy);
	border: 0;
	font-weight: 600;
}

.skip-link:focus {
	left: 0.5em;
}

#header {
	position: fixed;
	top: 0;
	left: 0;
	width: var(--sidebar-width);
	height: 100%;
	overflow-y: auto;
	background: var(--sidebar-bg);
	box-shadow: inset -0.25em 0 0.25em 0 rgb(0 0 0 / 0.1);
	color: #fff;
	text-align: right;
}

#header :focus-visible {
	outline-color: #fff;
}

.branding {
	min-height: 48px;
	margin: 1.75em 1.5em 1.5em;
}

.site-title {
	margin: 0;
	color: #fff;
	font-size: 1em;
	font-weight: 600;
	line-height: 1em;
}

.site-title a {
	border: 0;
}

.site-title a:hover {
	color: #fff;
	text-decoration: underline;
}

.site-tagline {
	margin: 0.5em 0 0;
	color: var(--sidebar-ink);
	font-size: 0.6em;
	line-height: 1.25em;
}

.nav {
	margin: 0;
}

.nav a {
	display: block;
	padding: 0.5em 1.5em;
	color: var(--sidebar-ink);
	border: 0;
	transition: none;
}

.nav a:hover {
	color: #fff;
}

.nav a:focus-visible {
	outline-offset: -3px;
}

.nav span {
	position: relative;
	display: block;
	font-size: 0.8em;
}

.nav .icon {
	position: absolute;
	top: 0.469em;
	left: 0;
	width: 1.5625em;
	color: var(--sidebar-icon);
}

body:has(#top:target) .nav a[href="#top"],
body:has(#notreregroupement:target) .nav a[href="#notreregroupement"],
body:has(#lescinqmaladies:target) .nav a[href="#lescinqmaladies"],
body:has(#facts:target) .nav a[href="#facts"],
body:has(#priorities:target) .nav a[href="#priorities"],
body:has(#partners:target) .nav a[href="#partners"],
body:has(#featured:target) .nav a[href="#featured"],
body:has(#pdf:target) .nav a[href="#pdf"] {
	background: rgb(0 0 0 / 0.15);
	box-shadow: inset 0 0 0.25em 0 rgb(0 0 0 / 0.125);
	color: #fff;
}

body:has(#top:target) .nav a[href="#top"] .icon,
body:has(#notreregroupement:target) .nav a[href="#notreregroupement"] .icon,
body:has(#lescinqmaladies:target) .nav a[href="#lescinqmaladies"] .icon,
body:has(#facts:target) .nav a[href="#facts"] .icon,
body:has(#priorities:target) .nav a[href="#priorities"] .icon,
body:has(#partners:target) .nav a[href="#partners"] .icon,
body:has(#featured:target) .nav a[href="#featured"] .icon,
body:has(#pdf:target) .nav a[href="#pdf"] .icon {
	color: var(--active-icon);
}

.social {
	display: flex;
	justify-content: center;
	gap: 0.9em;
	margin: 0 0 2em;
	color: var(--sidebar-ink);
}

.social a {
	display: inline-block;
	line-height: 1.75em;
}

.social .icon {
	vertical-align: middle;
}

.menu-toggle {
	display: none;
}

#main {
	margin-left: var(--sidebar-width);
}

#main > section {
	margin: 0;
	padding: var(--section-padding) 0;
	overflow: hidden;
	background-color: var(--section-bg);
	box-shadow: inset 0 1px 0 0 rgb(0 0 0 / 0.05), inset 0 0.1em 0.1em 0 rgb(0 0 0 / 0.024);
	text-align: center;
}

#main > section.cover {
	padding: var(--cover-padding) 0;
}

.container {
	width: var(--container-width);
	max-width: 100%;
	margin: 0 auto;
	padding: 0 var(--container-padding);
}

.panel {
	padding: 20px;
	border-radius: 20px;
	background-color: var(--panel-bg);
}

.inner {
	width: 80%;
	margin: 0 10%;
}

.photo {
	padding: 10px;
	border-radius: 20px;
}

.photo--third {
	width: 30%;
}

.photo--wide {
	width: 80%;
}

.hero-logo {
	padding: 0 var(--container-padding);
}

.hero-logo a {
	display: block;
	width: fit-content;
	max-width: 100%;
	margin: 0 auto;
	border: 0;
}

.hero-logo img {
	display: block;
}

.tagline {
	margin: 2em 0 1.3333em;
	color: var(--navy);
	font-size: 1.5em;
	line-height: 1.5em;
}

.intro {
	margin-bottom: 40px;
	color: var(--navy);
}

.video iframe {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	border: 0;
}

.justify {
	text-align: justify;
}

.members {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	align-items: end;
	row-gap: 2em;
}

.members li {
	grid-column: span 2;
}

.members li:nth-child(n + 4) {
	grid-column: span 3;
}

.members a {
	display: block;
	border: 0;
}

.members img {
	display: block;
	margin: 0 auto;
}

.priorities h2 {
	margin-bottom: 0;
}

.priorities .photos {
	margin-bottom: 2em;
}

.priority h3 {
	color: var(--red);
	font-size: 1em;
	line-height: 1.75em;
}

.sponsors {
	margin-bottom: 0;
}

.sponsors li {
	display: inline;
}

.sponsors .photo {
	width: 20%;
}

.sponsors .photo--narrow {
	width: 15%;
}

.publications a .photo {
	width: 30%;
}

.closing {
	color: var(--red);
}

.error-page {
	display: grid;
	place-items: center;
	min-height: 100vh;
	padding: 2em 15px;
	background-color: var(--section-bg);
	text-align: center;
}

.error-page .panel {
	max-width: 36em;
	padding: 2em;
}

.error-page img {
	display: block;
	margin: 0 auto 2em;
}

.error-page h1 {
	margin-bottom: 0.5em;
	font-size: 2em;
}

.error-page p:last-child {
	margin-bottom: 0;
}

@media screen and (max-width: 1880px) {
	:root {
		--font-size: 1.4167rem;
		--sidebar-width: 300px;
		--container-width: 1200px;
	}
}

@media screen and (max-width: 1620px) {
	:root {
		--container-width: 960px;
		--section-padding: 3em;
		--cover-padding: 5em;
	}
}

@media screen and (min-width: 961px) and (max-width: 1320px) {
	:root {
		--font-size: 1.3333rem;
		--sidebar-width: 20%;
		--container-width: 100%;
		--container-padding: 2em;
	}

	.nav a {
		padding-top: 0.5em;
		padding-bottom: 0.5em;
		font-size: 0.8em;
	}

	.nav span {
		padding-right: 2.25em;
	}

	.nav .icon {
		top: 0.78em;
		left: 100%;
		margin-left: -1.5625em;
	}
}

@media screen and (max-width: 960px) {
	:root {
		--font-size: 1.3333rem;
		--sidebar-width: 275px;
		--container-width: 100%;
		--container-padding: 2em;
		--section-padding: 3em;
		--cover-padding: 4em;
	}

	html,
	body {
		overflow-x: hidden;
	}

	#header {
		z-index: 10002;
		visibility: hidden;
		transform: translateX(-100%);
		transition: transform 0.5s, visibility 0s linear 0.5s;
		box-shadow: inset -0.25em 0 0.25em 0 rgb(0 0 0 / 0.125);
	}

	#header:target {
		visibility: visible;
		transform: none;
		transition: transform 0.5s;
	}

	.branding {
		margin: 1.5em 1.25em 1.25em;
	}

	.nav a {
		padding: 0.5em 1.25em;
	}

	.menu-toggle {
		position: fixed;
		top: 9px;
		left: 9px;
		z-index: 10001;
		display: flex;
		align-items: center;
		justify-content: center;
		width: 58.5px;
		height: 40.5px;
		border: 0;
		border-radius: 6px;
		background: var(--toggle-bg);
		color: #fff;
		font-size: 18px;
		line-height: 1;
	}

	.menu-toggle:hover {
		color: #fff;
	}

	.menu-toggle .icon {
		width: 1em;
		height: 1em;
	}

	.menu-close {
		position: absolute;
		z-index: 1;
	}

	body:has(#header:target) .menu-open {
		visibility: hidden;
	}

	#main {
		margin-left: 0;
		transition: transform 0.5s;
	}

	body:has(#header:target) #main {
		transform: translateX(var(--sidebar-width));
	}
}

@media screen and (max-width: 736px) {
	:root {
		--font-size: 1.1667rem;
		--container-padding: 15px;
		--section-padding: 2em;
	}

	h2 {
		font-size: 1.5em;
		letter-spacing: 0;
	}

	.tagline {
		margin-top: 1.5em;
	}

	.justify {
		text-align: center;
	}

	#main img,
	#main .photo,
	#main .sponsors .photo,
	#main .hero-logo a {
		width: 75%;
	}

	#main .hero-logo img {
		width: 100%;
	}
}

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