* {
	font-family: Sora;
	box-sizing: border-box;
}
body {
	margin: 0;
}
a {
	text-decoration: none;
}
nav {
	display: flex;
	justify-content: space-around;
	align-items: center;
	color: white;
	font-size: 16px;
	font-weight: 400;
	line-height: 24px;
	word-wrap: break-word
}
section {
	padding: 85px;
}
.section-head {
	padding: 60px 0;
	display: flex;
	justify-content: center;
	align-items: center;
	background: rgba(236, 236, 240, 0.30);
	color: #01233E;
	text-align: center;
	font-size: 36px;
	font-style: normal;
	font-weight: 700;
	line-height: 48px;
	letter-spacing: 0.36px;
}
.nav {
	padding: 20px 0 10px 0;
	background: #001220;
}
.top {
	padding: 20px 0 0 0;
	/*background: url("../images/image 8.png") center center;*/
	background: linear-gradient(266deg, rgba(0, 0, 0, 0.00) 14.55%, rgba(0, 0, 0, 0.60) 76.78%), linear-gradient(0deg, rgba(3, 35, 75, 0.50) 0%, rgba(3, 35, 75, 0.50) 100%), url("../images/image 8.png") lightgray 50% / cover no-repeat;
}
nav .selected {
	font-weight: 700;
}
.logo {
	display: flex;
	align-items: center;
	gap: 10px;
	color: white;
	font-size: 24px;
	line-height: 32px;
}
.menu {
	display: inline-flex;
	align-items: center;
	gap: 40px;
}
.menu a, .private-link a {
	color: white;
}
.menu a:hover, .private-link a:hover {
	text-decoration: underline;
}
.title {
	padding-top: 10%;
	padding-bottom: 5%;
	padding-left: 20%;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
	gap: 20px;
	width: 60%;
	color: white;
}
.title-1 {
	font-size: 36px;
	font-style: normal;
	font-weight: 700;
	line-height: 48px;
	letter-spacing: 0.36px;
}
.title-2 {
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: 24px;
	width: 80%;
}
.button {
	border-radius: 12px;
	background: #94C6D2;
	padding: 10px 20px;
	color: #03234B;
	text-align: center;
	/*font-family: "Helvetica Now Display";*/
	font-size: 16px;
	font-style: normal;
	font-weight: 700;
	line-height: 26px;
	letter-spacing: 0.48px;
}
.button:hover {
	background: #BFD9E2;
}
.chips-ju {
	display: flex;
	justify-content: flex-end;
	padding-right: 58px;
	padding-bottom: 40px;
}
.chips-ju > div {
	padding: 11px 28px 11px 29px;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 12px;
	background: rgba(255, 255, 255, 0.65);
}
.chips-ju > div > img {
	width: 176px;
	height: 66px;
}
.main-section {
	/*width: 65%;*/
	width: 1376px;
	margin: auto;
	display: flex;
	flex-direction: column;
	gap: 24px;
}
.section-title {
	display: flex;
	justify-content: space-between;
	align-items: center;
	color: #01233E;
	font-size: 28px;
	font-style: normal;
	font-weight: 800;
	line-height: 36px;
	letter-spacing: 0.28px;
}
.link a {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 12px;
	color: #01233E;
	font-size: 16px;
	font-weight: 500;
	line-height: 26px;
	letter-spacing: 0.48px;
	border-bottom: 1px solid #ffffff;
}
.link a:hover {
	border-bottom: 1px solid #01233E;
}
.link-previous img {
	transform: rotate(180deg);
}
.link-hidden {
	display: none;
}
.event-list {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 24px;
}
.event-item {
	display: flex;
	flex-direction: column;
	border-radius: 8px;
	border: 1px solid #DBDEE2;
	background: #FBFBFB;
	padding-bottom: 16px;
	gap: 24px;
}
.event-item:hover {
	box-shadow: 4px 4px 4px 0 rgba(0, 0, 0, 0.12);
}
.event-item img {
	border-bottom: 1px solid #DBDEE2;
	border-radius: 8px 8px 0 0;
}
.event-description {
	padding: 0px 16px;
}
.event-title {
	color: #01233E;
	font-size: 16px;
	font-style: normal;
	font-weight: 700;
	line-height: 26px;
	height: 85px;
}
.event-title div:nth-child(2) {
	overflow: hidden;
	color: #4C545C;
	text-overflow: ellipsis;
	font-size: 12px;
	font-style: normal;
	font-weight: 400;
	line-height: 18px;
	letter-spacing: 0.6px;
}
.event-date {
	padding: 12px 0;
	border-top: 1px solid #DBDEE2;
	overflow: hidden;
	color: #4C545C;
	text-overflow: ellipsis;
	font-size: 12px;
	font-style: normal;
	font-weight: 400;
	line-height: 18px;
	letter-spacing: 0.6px;
}
.event-highlight {
	border-radius: 12px;
	background: #03234B;
	display: flex;
	justify-content: space-between;
	color: #FFF;
}
.event-highlight:hover {
	box-shadow: 4px 4px 4px 0 rgba(0, 0, 0, 0.12);
}
.event-highlight > div:nth-child(1) {
	padding: 40px 0 24px 40px;
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.event-highlight > div:nth-child(2) {
	position: relative;
}
.event-highlight > div:nth-child(2) > img {
	width: 666px;
	height: 254px;
	border-radius: 8px;
}
.event-highlight-title {
	font-size: 24px;
	font-style: normal;
	font-weight: 700;
	line-height: 32px;
	letter-spacing: 0.24px;
}
.event-highlight-subtitle {
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: 24px;
}
.event-highlight-separator {
	width: 24px;
	height: 1px;
	background: #FFF;
	margin-top: 36px;
}
.event-highlight-info {
	font-size: 13px;
	font-style: normal;
	font-weight: 400;
	line-height: 18px;
}
.event-highlight-link {
	position: absolute;
	right: 24px;
	bottom: 24px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 12px;
	color: white;
	font-size: 16px;
	font-style: normal;
	font-weight: 500;
	line-height: 26px;
	letter-spacing: 0.48px;
}
.event-highlight-link a:hover {
	border: none;
}

/* NEWS AREA */
.news-highlight_arrow.left  { left: 12px;  }
.news-highlight_arrow.right { right: 12px; }
.news-highlight_arrow > img { display: none !important; }
.news-highlight {
	 position: relative;
	display: flex;
	justify-content: center;
	gap: 20px;
	width: 1206px;
	height: 361px;
	flex-shrink: 0;
	border-radius: 12px;
	align-items: center;
}
.carousel {
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	position: relative;
}
.carousel img{
	display:block;
	width:100%;
	height:auto;
}
.news-highlight_arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	cursor: pointer;
	display: inline-block;
	width: 42px;
	height: 42px;
	z-index: 9999;
	background: url("../images/Ellipse 1.svg") center/contain no-repeat;
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	border: 0; 
}
.news-highlight_arrow.left{
	left: 12px;
	background-image: url("../images/Group-left.svg"), url("../images/Ellipse 1.svg");
	background-position: center, center;
	background-repeat: no-repeat, no-repeat;
	background-size: 40px 40px, contain;
}
.news-highlight_arrow.right{
	right: 12px;
	background-image: url("../images/Group-right.svg"), url("../images/Ellipse 1.svg");
	background-position: center, center;
	background-repeat: no-repeat, no-repeat;
	background-size: 40px 40px, contain;
}
.news-highlight_arrow.left:hover{
	background-image: url("../images/Group-left.svg"),
					url("../images/Ellipse 2.svg");
	background-size: 45px 45px, contain;
}
.news-highlight_arrow.right:hover{
	background-image: url("../images/Group-right.svg"),
					url("../images/Ellipse 2.svg");
	background-size: 45px 45px, contain;
}
.carousel-container {
	position: relative;
}
#carousel-image {
	width: 1206px;
	height: 361px;
	display: block;
	border-radius: 10px;
	margin-bottom: 10px;
	transition: opacity 300ms ease;
}
.carousel-image-filter {
	z-index: 7;
	position: absolute;
	top: 0;
	left: 0;
	width: 1206px;
	height: 361px;
	border-radius: 10px;
	background: linear-gradient(0deg, rgba(0, 0, 0, 0.25) 0%, rgba(0, 0, 0, 0.25) 100%);
}
#news-textpreview {
	z-index: 8;
	position: absolute;
	bottom: 65px;
	left: 130px;
	width: 40%;
}
.news-highlight-title {
	color: #FFF;
	font-size: 24px;
	font-style: normal;
	font-weight: 700;
	line-height: 32px;
	letter-spacing: 0.24px;
	margin-bottom: 20px;
}
#Readmore-button {
	text-decoration: none;
	border-radius: 12px;
	background: #94C6D2;
	padding: 10px 20px;
	color: #03234B;
	text-align: center;
	/*font-family: "Helvetica Now Display";*/
	font-size: 16px;
	font-style: normal;
	font-weight: 700;
	line-height: 26px;
	letter-spacing: 0.48px;
	width: 40%;
}

/*  NEWS LIST AREA */
.news-list {
	display: flex;
	width: 100%;
	gap: 24px;
}
.news-item {
	width: 50%;
	padding: 16px;
	display: flex;
	flex-direction: column;
	gap: 8px;
	border-radius: 8px;
	border: 1px solid #DBDEE2;
	background: #FBFBFB;
}
.news-item:hover {
	box-shadow: 4px 4px 4px 0 rgba(0, 0, 0, 0.12);
}
.news-title {
	color: #01233E;
	font-size: 16px;
	font-style: normal;
	font-weight: 700;
	line-height: 26px;
}
.news-date {
	overflow: hidden;
	color: #4C545C;
	text-overflow: ellipsis;
	font-size: 12px;
	font-style: normal;
	font-weight: 400;
	line-height: 18px;
	letter-spacing: 0.6px;
}
.news-separator {
	width: 42px;
	height: 1px;
	background: #A6ADB5;
}
.goals {
	width: 100%;
	padding: 0;
	background: #F7F8FA;
	background: url("../images/starlight_logo 1.png") #F7F8FA right bottom / 590px 565px no-repeat;
}
.goals .main-section {
	padding: 85px;
}
.goals-description {
	color: #01233E;
	font-size: 14px;
	font-style: normal;
	font-weight: 400;
	line-height: 24px;
	letter-spacing: 0.28px;
	width: 70%;
}
.goals-list {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}
.goals-list .goals-big-item {
	grid-column: 2/4;
}
.goals-item {
	border-radius: 8px;
	border: 1px solid #DBDEE2;
	background: #FBFBFB;
	display: flex;
	justify-content: center;
	align-items: flex-start;
	gap: 24px;
	padding: 24px;
}
.goals-item > div:nth-child(1) {
	border-radius: 6px;
	background: rgba(1, 35, 62, 0.60);
	padding: 2px 10px;
	color: #FFF;
	text-align: center;
	font-size: 18px;
	font-style: normal;
	font-weight: 400;
	line-height: 24px;
	letter-spacing: 0.28px;
}
.goals-item > div:nth-child(2) {
	color: #01233E;
	font-size: 14px;
	font-style: normal;
	font-weight: 400;
	line-height: 24px;
	letter-spacing: 0.28px;
}
.consortium {
	display: flex;
	justify-content: center;
	align-items: center;
	background: #01233E;
}
.consortium img {
	width: 1200px;
	height: 621px;
}
footer {
	display: flex;
	justify-content: center;
	align-items: center;
	background: #01233E;
	padding-bottom: 28px;
}
.footer {
	border: 1px solid #EFEFEF;
	background: #F7F8FA;
	padding-top: 9px;
	padding-bottom: 14px;
}
footer img {
	width: 119px;
	height: 119px;
}
.footer img {
	width: 77px;
	height: 91px;
}

/* RESEARCH AREA*/

/*#research{
    padding: 0;
}*/


#researchmenu {
    color: #6A7077;
    display: flex;
    align-items: center;
    margin-bottom: 24px;
    gap: 50px;
    font-size: var(--Font-Size-Body-M, 16px);
    font-style: normal;
    font-weight: 550;
	display: none; /* hidden for now as not enough data */
}

.research-option {
    cursor: pointer;
}

.bold {
    font-weight: bold;
}

button {
    all: unset;
    /* reset propre */
    cursor: pointer;
}

.trigger {
    display: inline-block;
    /* bordure à la largeur du texte */
    margin: 0;
    padding: 0;
    line-height: 1;
    font-weight: 400;
    border-bottom: 1px solid transparent;
    background: none;
    border-radius: 0;
    transition: border-bottom-color .15s ease, font-weight .15s ease;
}

.trigger.active {
    font-weight: 700;
    color: #01233E;
    border-bottom-color: var(--Stroke-Default, #01233E);
}

.banner {
    display: flex;
    flex-direction: row;
    margin: 12px 0;
    padding: 24px;
    background: #FBFBFB;
    border: 1px solid #DBDEE2;
    border-radius: 8px;
    align-items: center;
    width: 50%;
    gap: 24px;
    color: #01233E;
    font-weight: 700;
    height: 100px;
}


/* Barre de boutons */
#researchmenu {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
    align-items: flex-end;
    margin-bottom: 12px;
	display: none; /* hidden for now as not enough data */
}

#researchmenu .trigger {
    all: unset;
    cursor: pointer;
    display: inline-block;
    line-height: 1;
    white-space: nowrap;
    font-weight: 400;
    border-bottom: 1px solid transparent;
    transition: border-bottom-color .15s ease, font-weight .15s ease;
}

#researchmenu .trigger.active {
    font-weight: 700;
    color: #01233E;
    border-bottom-color: var(--Stroke-Default, #01233E);
}

/* Zone panels superposés */
.banners {
    position: relative;
    overflow: hidden;
    height: 0;
    transition: height .25s ease;
}

.panel {
    position: absolute;
    inset: 0;
    overflow: auto;
    opacity: 0;
    pointer-events: none;
    transform: translateY(4px);
    transition: opacity .2s ease, transform .2s ease;
     display: flex;
    flex-direction: row;
    gap: 24px;
}

.panel.active {
    opacity: 1;
    pointer-events: auto;
    transform: none;
}

/* Bannières à l’intérieur des panels (pas de hidden ici) */
.banner {
    display: flex;
    align-items: center;
    gap: 24px;
    margin: 12px 0;
    padding: 24px;
    background: #FBFBFB;
    border: 1px solid #DBDEE2;
    border-radius: 8px;
    color: #01233E;
    font-weight: 700;
}
.banner:hover {
	box-shadow: 4px 4px 4px 0 rgba(0, 0, 0, 0.12);
}