@font-face {
	font-family: 'Neo Sans Std';
	src: url('./fonts/NeoSansStd-Regular.eot');
	src: url('./fonts/NeoSansStd-Regular.eot?#iefix') format('embedded-opentype'),
		url('./fonts/NeoSansStd-Regular.woff2') format('woff2'),
		url('./fonts/NeoSansStd-Regular.woff') format('woff'),
		url('./fonts/NeoSansStd-Regular.ttf') format('truetype'),
		url('./fonts/NeoSansStd-Regular.svg#NeoSansStd-Regular') format('svg');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Poppins';
	src: url('./fonts/Poppins-Regular.eot');
	src: url('./fonts/Poppins-Regular.eot?#iefix') format('embedded-opentype'),
		url('./fonts/Poppins-Regular.woff2') format('woff2'),
		url('./fonts/Poppins-Regular.woff') format('woff'),
		url('./fonts/Poppins-Regular.ttf') format('truetype'),
		url('./fonts/Poppins-Regular.svg#Poppins-Regular') format('svg');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}

:root {
	--ratio: .8;

	/*Fond principal	Blanc cassé	#F9F9F6*/
	--color-background: #F9F9F6;
	/*Fond principal-2	Blanc neige	#FFFAFA*/
	--color-background2: #FFFAFA;
	/*Sections alternées	Vert sauge clair	#F1F5F2*/
	--color-section-alt: #F1F5F2;
	/*Texte principal	Gris anthracite	#2E2E2E*/
	--color-text: #2E2E2E;
	/*Titres, accents	Vert sauge	#7BAE7F*/
	--color-accent: #7BAE7F;
	/*Liens, hover boutons	Bleu gris	#6B7D8D*/
	--color-link: #6B7D8D;
	/*Footer, zones sombres	Bleu gris foncé	#4A5A6A*/
	--color-footer: #4A5A6A;
	/*Couleur d’accent subtile	Rose poudré	#D9A5A5*/
	--color-accent-soft: #D9A5A5;
	--color-background-svg: rgba(22, 165, 96, 0.1);
}

* {
	font-family: 'Poppins';
	box-sizing: border-box;
}

html { scroll-behavior: smooth; }

body {
	margin: 0;
	background: var(--color-background);
	color: var(--color-text);
	overflow: auto;
	box-sizing: border-box !important;
}

/* ########################## */
/* ~~~~~~~~~~ LOGO ~~~~~~~~~~ */
	#logo_holder {
		display: inline-block;
		opacity: 1;
		font-size: 0;
		user-select: none;
		z-index: 100 !important;
		min-width: 328px;
		flex-shrink: 0;
	}

		#logo_holder #img_home {
			display: inline-block;
			width: calc( 100px * var(--ratio) );
			height: calc( 100px * var(--ratio) );
			margin: calc( 5px * var(--ratio) );
		}

		#logo_holder #text_logo {
			display: inline-block;
			width: calc( 300px * var(--ratio) );
			height: calc( 110px * var(--ratio) );
			font-family: 'Neo Sans Std';
			vertical-align: top;
			text-align: center;
			background: #fff;
			background-image: linear-gradient(135deg, #69df66, #408e7f);
			color: transparent;
			background-clip: text;
		}

			#logo_holder #text_logo #text_logo_l1 {
				display: inline-block;
				width: calc( 300px * var(--ratio) );
				text-align: center;
				font-size: calc( 50px * var(--ratio) );
				letter-spacing: calc( 1px * var(--ratio) );
				margin-top: calc( 10px * var(--ratio) );
			}

			#logo_holder #text_logo #text_logo_l2 {
				display: inline-block;
				width: calc( 300px * var(--ratio) );
				text-align: center;
				font-size: calc( 16px * var(--ratio) );
				letter-spacing: calc( 0.8px * var(--ratio) );
				font-weight: bold;
				margin-left: calc( 2px * var(--ratio) );
			}

			#logo_holder #text_logo * { font-family: inherit; }
/* ########################## */

/* ########################### */
/* ~~~~~~~~~~ CORPS ~~~~~~~~~~ */
	header {
		display: flex;
		width: 100%;
		min-height: 60px;
		position: sticky;
		top: 0;
		left: 0;
		background-color: var(--color-background2);
		flex-direction: row;
		padding: 0px 20px !important;
		align-items: center;
		justify-content: space-between;
		z-index: 100;
		font-size: 20px;
		box-sizing: border-box !important;
		box-shadow: 0 2px 8px rgba(0,0,0,0.1);
		gap: 1em;
		flex-wrap: nowrap;
	}

	.menu-nav {
		display: flex;
		flex-direction: row;
		justify-content: space-evenly;
		flex: 1 1 auto;
	}

		nav {
			display: flex;
			flex-wrap: nowrap;
			justify-content: center;
			gap: .5vw;
		}

			nav a, nav div {
				display: inline-block;
				margin: 0;
				color: var(--color-text);
				text-decoration: none;
				font-size: 1vw;
				font-weight: 600;
				width: auto;
				text-align: center;
				padding: 1em 1.5em;
				transition: all .1s ease-in-out;
				cursor: pointer !important;
			}

				nav a:hover, nav div:hover {
				color: var(--color-accent);
				transform: translateY(-3px);
			}

	.menu-mobile {
		display: none;
		position: fixed;
		z-index: 90 !important;
		width: 100vw;
		top: calc(110px * var(--ratio));
		transform: translateY( calc(-100% - ( 110px * var(--ratio) )) );
		background-color: var(--color-background2);
		transition: all .25s ease-in-out;
		border-bottom: solid 2px #666;
		text-align: center;
	}

		.menu-mobile:is(.displayed){
			transform: unset;
		}

		.menu-mobile nav {
			display: flex;
			width: 100vw;
			flex-direction: column;
			justify-content: center;
		}

			.menu-mobile nav a, .menu-mobile #mobile-fake_btn_accueil {
				width: unset;
				margin: unset;
				padding: 0;
				height: 55px;
				line-height: 55px;
				font-size: large;
			}

				.menu-mobile nav a:hover {
					color: var(--color-accent);
					transform: unset;
				}

			.menu-mobile nav .split-mobile {
				width: 97%;
				height: 1px;
				background-color: #ddd;
				margin: 0 auto;
				padding: 0 !important;
			}

	.menu-mobile-burger {
		display: none;
		z-index: 1000;
		padding: 0 20px;
	}

		.menu-mobile-burger div {
			width: 30px;
			height: 4px;
			background-color: black;
			margin: 6px 0;
			transition: 0.4s;
			user-select: none;
		}

	.cta-button { 
		background-color: var(--color-accent);
		color: white; 
		font-size: 22px;
		border-radius: 12px;
		padding: 10px 20px;
		border: none;
		box-shadow: 0 2px 8px rgba(0,0,0,0.3);
		transition: all .15s ease-in-out;
		cursor: pointer;
	}

		.cta-button:hover {
			background-color: var(--color-link);
			color: white;
			box-shadow: 0 4px 6px rgba(0,0,0,0.2);
		}
		.cta-button:disabled {
			background-color: var(--color-section-alt);
			background-color: darkgrey;
			color: lightgrey;
			box-shadow: unset;
		}
		.cta-button:disabled:hover {
			box-shadow: unset;
			cursor: default;
		}

	.hero {
		display: flex;
		align-items: center;
		justify-content: space-evenly;
		position: relative;
		text-align: center;
		padding: 60px 20px;
		padding-top: 100px;
		color: white;
	}

		.hero-text { z-index: 50; }

		.hero-deco, .section-deco { margin: 0 20px; }

		.hero h1 { margin: 0; font-size: 24px; }

		.hero h1, .hero p {
			display: inline-flex;
			justify-content: center;
			align-items: center;
			background-color: rgba(0,0,0,.05);
			padding: 10px 15px;
			border-radius: 12px;
			color: var(--color-text);
			line-height: 50px;
		}

		#mentions-legales h2, #cgv h2, #confidentialite h2 {
			display: inline-flex;
			justify-content: center;
			align-items: center;
		}

		.hero-image {
			flex: 0 0 auto;
			width: calc(800px * .85);
			height: calc(477px * .85);
			background-image: url('../img/visuels/image_02_light.webp');
			background-size: cover;
			border-radius: 5px;
			-webkit-mask-image: 
				linear-gradient(to right, transparent 0px, black 5%, black 95%, transparent 100%),
				linear-gradient(to top, transparent 0px, black 5%, black 95%, transparent 100%);
			-webkit-mask-composite: intersect;
			mask-image: 
				linear-gradient(to right, transparent 0px, black 5%, black 95%, transparent 100%),
				linear-gradient(to top, transparent 0px, black 5%, black 95%, transparent 100%);
			mask-composite: intersect;
			mask-mode: alpha;
			-webkit-mask-mode: alpha;
		}

	section {
		width: 100%;
		padding: 10px 20px 40px 20px;
		text-align: center;
		scroll-margin-top: 80px;
		box-sizing: border-box;
	}

	section:nth-child(even){ background-color: var(--color-section-alt); }

	.card-container {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		gap: 20px;
		margin: 0;
		margin-top: 30px;
	}

	.card {
		display: flex;
		flex-direction: column;
		background: white;
		border-radius: 12px;
		box-shadow: 0 2px 8px rgba(0,0,0,0.1);
		padding: 20px;
		width: min(17.5%, 300px);
		position: relative;
	}

		.card:has(.services-en-savoir-plus){
			padding-bottom: 40px;
		}

		.xl {
			min-width: 34%;
			text-align: left;
			align-items: flex-start;
			flex-direction: row;
		}

			.xl.top { border-top: solid 5px var(--color-accent); }
			.xl.left { border-left: solid 5px var(--color-accent); }
			.xl.right { border-right: solid 5px var(--color-accent); }
			.xl.bottom { border-bottom: solid 5px var(--color-accent); }

		.mega {
			width: 60%;
			max-width: 800px;
			text-align: left;
			align-items: flex-start;
			flex-direction: column;
			justify-content: center;
		}

		.services-en-savoir-plus {
			display: inline-block;
			position: absolute;
			bottom: 12.5px;
			background: var(--color-accent);
			color: #fff !important;
			padding: 5px 15px;
			border-radius: 12px;
			left: 50%;
			transform: translateX(-50%);
			font-variant: all-small-caps;
			font-size: larger;
			font-weight: bold;
			cursor: pointer;
			border: none;
			box-shadow: 0 2px 8px rgba(0,0,0,0.3);
			transition: all .15s ease-in-out;
			text-decoration: none !important;
		}

			.services-en-savoir-plus:hover {
				background-color: var(--color-link);
				color: white;
				box-shadow: 0 4px 6px rgba(0,0,0,0.2);
			}
			.services-en-savoir-plus:disabled {
				background-color: var(--color-section-alt);
				background-color: darkgrey;
				color: lightgrey;
				box-shadow: unset;
			}
			.services-en-savoir-plus:disabled:hover {
				box-shadow: unset;
				cursor: default;
			}

		#apropos .xl { align-items: center !important; }

		#apropos .pathway {
			width: 8px;
			height: 40px;
			background: var(--color-accent);
			position: absolute;
			bottom: -40px;
			left: 30px;
		}

			#apropos .pathway.right { right: 30px; left: unset; }

			.xl h3 { margin: 0 15px; }
			.xl p { margin: 0 0 0 15px; }

		.xxl {
			width: 40%;
			text-align: left;
			align-items: flex-start;
			flex-direction: row;
			position: relative;
		}

			.xxl div { text-align: justify; }

			.xxl h3 { margin: 0; }

			.xxl img {
				max-width: 150px;
				border-radius: 12px;
				box-shadow: 0 2px 8px rgba(0,0,0,0.3);
				margin-right: 20px;
			}

		.card-with-header { border-top: solid 5px var(--color-accent); }

		.numeric-header {
			display: inline-block;
			width: 40px;
			height: 40px;
			line-height: 40px;
			background: var(--color-accent);
			color: white;
			font-weight: bold;
			text-align: center;
			border-radius: 20px;
			position: absolute;
			top: -22px;
			left: 50%;
			transform: translateX(-50%);
		}

		.img-header img {
			width: 60px;
			height: auto;
			margin: 5px;
		}

	.wrap-svg {
		display: flex;
		flex: 0 0 auto;
		width: 48px;
		height: 48px;
		align-items: center;
		justify-content: center;
		border-radius: 24px;
		background-color: var(--color-background-svg);
	}

	.svg-icon { stroke: var(--color-accent); }

	.faq-tabs {
		max-width: 60%;
		margin: 2rem auto;
		font-family: sans-serif;
		background: white;
		box-shadow: 0 2px 8px rgba(0,0,0,0.1);
	}

	.faq-tab-buttons {
		display: flex;
		gap: 1rem;
		flex-wrap: wrap;
		border-bottom: 2px solid #ddd;
		justify-content: space-evenly;
	}

	.tab-button {
		background: none;
		border: none;
		padding: 0.5rem 1rem;
		cursor: pointer;
		font-size: 1rem;
		border-bottom: 2px solid transparent;
		transition: all 0.3s ease;
		color: var(--color-text);
	}

	.tab-button.active {
		border-color: var(--color-accent);
		color: var(--color-accent);
	}

	.faq-tab-content {
		display: none;
		animation: fadeIn 0.3s ease-in;
		padding: 20px;
		text-align: justify;
	}

		.faq-tab-content .ask-faq {
			font-weight: 600;
			text-align: left;
		}

		.faq-tab-content h3 { text-align: left !important; }

	.faq-tab-content.active { display: block; }

		.faq-tab-content div {
			height: 150px;
			display: flex;
			align-items: flex-start;
			justify-content: space-between;
		}

		.faq-tab-content img {
			width: 150px;
			float: right;
			margin: 0 0 15px 15px;
			border-radius: 12px;
			box-shadow: 0 2px 8px rgba(0,0,0,0.3);
		}

	@keyframes fadeIn {
		from { opacity: 0; transform: translateY(10px); }
		to { opacity: 1; transform: translateY(0); }
	}

	#contact .sub-section-wrapper, #mentions-legales .sub-section-wrapper, #cgv .sub-section-wrapper, #confidentialite .sub-section-wrapper {
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		gap: 40px;
		padding: 20px;
	}

	#mentions-legales .sub-section-wrapper, #cgv .sub-section-wrapper {
		flex-wrap: wrap;
		justify-content: center;
	}

	#confidentialite .sub-section-wrapper {
		flex-direction: column !important;
		flex-wrap: initial !important;
		justify-content: center;
		align-items: center;
	}

		.sub-section {
			display: flex;
			width: 50%;
			flex-direction: column;
			box-sizing: border-box;
			padding: 20px 40px;
		}

			.sub-section h3 { text-align: left; }

			.sub-section label {
				text-align: left;
				margin-bottom: 4px;
				margin-left: 16px;
				font-weight: 600;
			}

			.sub-section input, .sub-section textarea {
				padding: 8px 16px;
				margin-bottom: 25px;
				line-height: 22px;
				border: solid 1px rgb(209 213 219);
				outline: none;
				border-radius: 12px;
				background: var(--color-background);
			}

				.sub-section input:focus, .sub-section textarea:focus {
					outline: solid 2px #555;
				}

			.sub-section textarea { margin-bottom: unset; }

			.sub-section .personnal-data-wrapper {
				display: inline-flex;
				align-items: center;
				justify-content: center;
				padding: 5px 10%;
			}

				.sub-section .personnal-data-wrapper input[type="checkbox"] {
					display: inline-block;
					margin: unset;
					padding: unset;
					border: unset;
					line-height: unset;
					outline: unset;
					border-radius: unset;
					background: unset;
					width: 8em;
					height: 8em;
					position: relative;
				}

				.sub-section .personnal-data-wrapper label {
					max-width: calc(100% - 36px - 30px);
					display: inline-block;
					margin: 0;
					padding: 15px;
					font-weight: normal;
					text-align: center;
					text-wrap: balance;
				}

			.sub-section textarea {
				resize: vertical;
				min-height: calc( 22px * 4 );
				max-height: calc( 22px * 8 );
			}

			.div-infos-contact {
				display: flex;
				align-items: flex-start;
				margin: 7.5px 0;
				position: relative;
			}

				.div-infos-contact div {
					display: flex;
					flex-direction: column;
					align-items: flex-start;
					justify-content: flex-start;
					text-align: left;
					margin-left: 20px;
				}

					.div-infos-contact div p { margin: 0; }
					.div-infos-contact div p:first-of-type { font-weight: 600; }

				.div-infos-contact svg {
					margin-top: .25em;
					min-width: 24px;
					min-height: 24px;
				}

			.sub-section .map {
				background: url('../img/visuels/grass2.webp');
				border-radius: 12px;
			}

				.sub-section .map .img-map {
					filter: drop-shadow(0 0 15px rgba(15,15,15,.5));
					padding: 20px;
				}

					.sub-section .map .img-map svg {
						height: auto;
						max-width: 100%;
					}

			.sub-section .status {
				display: flex;
				visibility: hidden;
				background: lightgrey;
				padding: 10px 20px;
				border-radius: 12px;
				margin-top: 10px;
				font-size: 1.2em;
				align-items: center;
				justify-content: center;
				gap: 30px;
				transition: all .15s ease-in-out;
			}

				.sub-section .status.valid { background-color: var(--color-accent); }
				.sub-section .status.invalid { background-color: var(--color-accent-soft); }

				.sub-section .status p { margin: 0; padding: 0; }
				.sub-section .status img { width: 30px; }
				.sub-section .status img:nth-of-type(1){ animation: rotationFW 3s linear infinite; }
				.sub-section .status img:nth-of-type(2){ animation: rotationBW 3s linear infinite; }

				@keyframes rotationFW { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
				@keyframes rotationBW { from { transform: rotate(360deg); } to { transform: rotate(0deg); } }

	footer {
		display: flex;
		flex-direction: row;
		background-color: var(--color-footer);
		color: #FAFAF7;
		align-items: center;
		justify-content: space-evenly;
		gap: 20px;
		padding: 20px;
	}

		footer .cta-button {
			text-decoration: none;
			text-align: center;
			font-size: 18px !important;
			min-width: 195px;
		}

			footer .cta-button:hover {
				color: #fff !important;
			}

		footer div {
			display: flex;
			flex-direction: column;
			align-items: normal;
		}

		footer .split-footer {
			width: 1px;
			height: 40px;
			background-color: #ccc;
		}

		footer div.row {
			flex-direction: row;
			gap: 10px;
		}

		footer * { margin: 0; padding: 0; }

		footer .footer-link {
			display: inline;
			cursor: pointer;
			color: var(--color-background);
			transition: all .1s ease-in-out;
		}

			footer .footer-link:hover {
				color: var(--color-accent-soft);				
			}

		footer .img-links:hover img {
			transform: scale(1.05);
			padding: 0;
		}

			footer .img-links img {
				width: 60px;
				height: 60px;
				padding: 5px;
				background: var(--color-link);
				border-radius: 12px;
				transition: all .15s ease-in-out;
			}

	.scroll-to-top {
		display: none;
		font-size: 60px;
		position: fixed;
		bottom: 100px;
		background: rgba(107,125,141,.25);
		opacity: 0;
		cursor: pointer;
		color: var(--color-link);
		transition: all ease-in-out .15s;
	}

		.scroll-to-top.display {
			display: block;
			opacity: .3;
		}

			.scroll-to-top.display:hover { opacity: 1; }

		.scroll-to-top.left { left: 0; border-top-right-radius:12px; border-bottom-right-radius:12px; }
		.scroll-to-top.right { right: 0; border-top-left-radius:12px; border-bottom-left-radius:12px; }

	.overlay {
		display: none; /* show en inline-block */
		position: fixed;
		top: 0;
		left: 0;
		width: 100vw;
		height: 100vh;
		background: rgba(0,0,0,.5);
		z-index: 200;
	}

	.modal {
		z-index: 250;
		display: none; /* show en flex */
		justify-content: center;
		align-items: flex-start;
		position: fixed;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		width: 75vw;
		height: 75vh;
		padding: 20px;
		border-radius: 12px;
		box-shadow: 0 2px 8px rgba(0,0,0,0.2);
		background: var(--color-background);
		box-sizing: border-box;
		overflow: hidden;
	}

	.modal-content {
		background-color: white;
		padding: 10px;
		border-radius: 5px;
		width: 100%;
		height: 100%;
		overflow: hidden;
	}

	.modal-header {
		text-align: center;
		margin-bottom: 20px;
	}

		.modal h2 { padding: 0; margin: 0; }

	.modal-body {
		display: flex;
		width: 100%;
		height: 100%;
		gap: 20px;
		align-items: center;
		justify-content: center;
	}

	.modal-body .legal-section {
		width: 49%;
		height: 100%;
		display: inline-block;
		vertical-align: top;
		overflow-y: scroll;
	}

	.modal-body .legal-section-mobile { display: none; }

		.modal-content:has(.modal-header) .modal-body .legal-section { max-height: 58vh; }

		.modal:hover .closer { opacity: 1; }

		.modal .closer {
			opacity: .5;
			position: absolute;
			top: 0;
			right: 0;
			padding: 5px 6px;
			margin: 3px;
			border: solid 1px lightgrey;
			border-radius: 5px;
			background: var(--color-background2);
			cursor: pointer;
			transition: all .1s ease-in-out;
		}

			.modal .closer:hover {
				background: rgba(205,92,92,.25);
			}

		body.modal-open { overflow: hidden; }

		.modal ol {
			list-style: decimal;
			max-height: 100%;
		}

			.modal ol>li {
				font-size: 1.1vw;
				margin: 36px 0 12px;
				font-weight: bold;
				text-decoration: underline;
				text-decoration-color: var(--color-accent);
			}

			.modal ol ul { padding-left: 0; }

			.modal ol p { text-wrap: balance; }

			.modal ol li { text-wrap: balance; }


	/* Responsive */
	@media (max-width: 768px) {
		:root { --ratio: .75; }

		h2 {
			margin-top: 0;
		}

		body { overflow-x: hidden; }

		.desc {
			margin: 0 auto !important;
			text-wrap: balance;
		}

		header {
			flex-direction: row;
			width: 100vw;
			padding: 0 !important;
		}

			header .cta-button { display: none; }

		#logo_holder { min-width: unset; }

		.menu-nav { display: none; }
		.menu-mobile { display: block; }
		.menu-mobile-burger { display: block; }

		section {
			padding: 20px 10px !important;
			scroll-margin-top: 80px;
		}

		.cta-button {
			font-size: 18px;
			margin: 7.5px 0;
			padding: 15px 10px;
		}

			.cta-button:hover {
				background-color: var(--color-link);
				color: white;
				transform: unset;
				box-shadow: 0 4px 6px rgba(0,0,0,0.2);
			}

		.hero {
			padding-top: 80px !important;
			scroll-margin-top: 40px !important;
		}

		.hero h1, .hero p { background-color: rgba(255,255,255,.75); }
		.hero p {
			line-height: 25px;
			text-wrap: balance;
		}

		.hero-image {
			position: absolute;
			left: 50%;
			transform: translateX(-50%);
			overflow: hidden;
		}

		.hero-deco { margin: 0; font-size: .75em; }

		.card { width: 95%; }

		.xl {
			flex-direction: column !important;
			align-items: center;
			width: 95%;
		}

			.xl .wrap-svg { margin-bottom: 15px; }
			.xl h3, .xl p { text-align: center; margin: unset; }

		.faq-tabs { max-width: 100%; }

		.faq-tab-content { padding: 10px; }

			.faq-tab-content img { width: 120px; }

			.faq-tab-content h3 { text-align: left !important; }

		.faq-tab-buttons {
			flex-direction: column;
			gap: 0.5rem;
		}

		.sub-section-wrapper {
			flex-direction: column !important;
			padding: 0 !important;
		}

		.sub-section { 
			width: 100%;
			padding: 10px;
		}

		.sub-section .map .img-map { padding: 8px; }

		.sub-section .personnal-data-wrapper {
			padding: 0;
			flex-wrap: wrap;
		}

			.sub-section .personnal-data-wrapper input[type="checkbox"] {
				width: 2em;
				height: 2em;
			}

			.sub-section .personnal-data-wrapper label { padding: 15px 0; }

		footer { flex-direction: column; }

			footer div { align-items: center; }

				footer div p { text-align: center; }

				footer div:has(.cta-button){
					flex-wrap: wrap;
					justify-content: center;
				}

		.split-footer { display:none; }

		.img-links { text-align: center; }
		.img-links img { width: 70% !important; height: unset !important; }

		.footer-link { margin: 5px; }

		#mentions-legales .sub-section-wrapper, #cgv .sub-section-wrapper { align-items: center; }

	}

	@media (max-width: 480px){
		:root {
			--ratio: .65;
		}
	}

	@media (max-width: 320px){
		:root {
			--ratio: .5;
		}
	}
/* ########################### */