/* .............................................................................
SITE BLOCKS
............................................................................. */

/*
BLOCK / Standard styles
Styles standard des blocs principaux. */
.bMain {padding-top: var(--base-spacing-top);padding-bottom: var(--base-spacing-bottom);}

	/*
	ALT :
	No double padding.
	Si 2 blocks avec cette classe se chevauchent, ne pas mettre
	d'espacement entre ces 2 blocs. */
	.bMain--noDP + .bMain--noDP {padding-top: 0; }

	/*
	ALT :
	Forcer zero padding top ou bottom. */
	.bMain--noTP {padding-top: 0; }
	.bMain--noBP {padding-bottom: 0; }



/*
BLOCK / Boxes list
Boxes 4 cols per row. */
.bBoxesList {--espacementV: 1.35vw; --espacementH: 1.35vw; --nbItems: 4;}
.bBoxesListz {--nbItems: 3; margin-top: 7.5em;}
.bBoxesList__list {position: relative; }
.bBoxesList__items {display: flex;flex-wrap: wrap;margin: calc(-1 * var(--espacementV)) calc(-1 * var(--espacementH));}
.bBoxesList__items .iBoxAvantage {flex: 0 0 auto; width: calc(100% / var(--nbItems)); padding: var(--espacementV) var(--espacementH); }

/* Carousel */
.bBoxesList .jsCarouselStd {flex-wrap: nowrap; }

	/* Arrows */
	.bBoxesList__nav {display: flex;justify-content: center;margin-top: 5em;}

	/* Before init, on affiche les boites comme elles seront apres le init. */
	.bBoxesList .jsCarouselStd.flickity-enabled {display: block; }
	.bBoxesList .jsCarouselStd:not(.flickity-enabled) > *:nth-child(1n+5) {display: none; }

	/* Big screens */
	@media (min-width:125rem) {
		.bBoxesList {--espacementV: 1.5em;--espacementH: 1.5em;}
	}
	
	/* 3 cols */
	@media (max-width:62rem) {
		.bBoxesList {--espacementV: 3vw; --espacementH: 3vw; --nbItems: 3; }
		.bBoxesList__nav {margin-top: 3em;}
		.bBoxesList .jsCarouselStd:not(.flickity-enabled) > *:nth-child(1n+4) {display: none; }
	}
	
	/* 2 cols */
	@media (max-width:46rem) {
		.bBoxesList {--nbItems: 2; --espacementH: var(--width-std); }
		.bBoxesList__nav {margin-top: 2em;}
		.bBoxesList__items {margin-left: 0; margin-right: 0;}
		.bBoxesList__items .flickity-viewport {overflow: visible;}
		.bBoxesList .jsCarouselStd:not(.flickity-enabled) > *:nth-child(1n+3) {display: none; }
	}



/*
BLOCK / Form
Block avec le formulaire pour appliquer. */
.bForm {background-color: var(--color-red);padding-bottom: 0;}
.bForm__in {max-width: 50em; margin-left: auto; margin-right: auto; }

.bForm .formGroup--send .btn {margin-bottom: calc(-0.5 * var(--size)); }

	/* 
	ANIMATE APPEAR */
	.js .bForm.jsAnimateClass .iHead {opacity: 0.2; transition: opacity 1s; transition-delay: 0s; }
	.js .bForm.jsAnimateClass.animate .iHead {opacity: 1; }



/*
BLOCK / Sliding words
Mots en plusieurs lignes qui bougent. */
.bSlidingWords { }
.bSlidingWords__list {overflow: hidden; }
.bSlidingWords__items {display: flex; }
.bSlidingWords__items .iGrosTitre {flex: 0 0 auto;margin: 0;padding: 0 0.7em;}
.bSlidingWords__footer {text-align: center; margin-top: calc(0.5 * var(--base-spacing-top)); margin-bottom: calc(0.5 * var(--base-spacing-bottom));}

/* Carousel */
.bSlidingWords .jsCarouselWords { }

	/* Before init, on affiche les boites comme elles seront apres le init. */
	.bSlidingWords .jsCarouselWords__items.flickity-enabled {display: block; }



/*
BLOCK / Infos
Titre, sliding words, wave separator et carousel. */
.bInfos {--insideSpacing:calc(0.4 * var(--base-spacing)); padding-top:calc(5em + var(--base-spacing-top));background-color: var(--color-gray);}
.bInfos > *:not(:first-child) {margin-top: var(--insideSpacing); }
.bInfos > *:not(:last-child) {margin-bottom: var(--insideSpacing) }
.bInfos__title {text-align: center; }
.bInfos__words {margin-left: calc(-1 * var(--width-std-left)); margin-right: calc(-1 * var(--width-std-right)); }
.bInfos__separator {display: flex; justify-content: center; }
.bInfos__separator .svgIcon {color: var(--color-blue); font-size: 10em; }
.bInfos__avantages {max-width: 60em;margin-left: auto;margin-right: auto;}

	/* 
	ANIMATE APPEAR */
	.js .bInfos.jsAnimateClass .bInfos__title {opacity: 0; transition: opacity 1s; transition-delay: 0s; }
	.js .bInfos.jsAnimateClass.animate .bInfos__title {opacity: 1; }

	.js .bInfos.jsAnimateClass .bSlidingWords__items {opacity: 0; transition: opacity 1s; transition-delay: 0.3s; }
	.js .bInfos.jsAnimateClass.animate .bSlidingWords__items {opacity: 1; }
	.js .bInfos.jsAnimateClass .bSlidingWords__items + .bSlidingWords__items {transition-delay: 0.6s; }

	.js .bInfos.jsAnimateClass .bInfos__separator {opacity: 0.1; transition: opacity 1s; transition-delay: 0.9s; }
	.js .bInfos.jsAnimateClass.animate .bInfos__separator {opacity: 1; }

	/* 
	ANIMATE APPEAR */
	.js .bInfos__avantages.jsAnimateClass .iBoxAvantage__badge {opacity: 0; transition: opacity 1s; transition-delay: var(--delay, 0s); }
	.js .bInfos__avantages.jsAnimateClass.animate .iBoxAvantage__badge {opacity: 1; }

	.js .bInfos__avantages.jsAnimateClass .iBoxAvantage__badge .svgIcon svg {opacity: 0; transform: scale(0.8); transition: opacity 1s, transform 1s; transition-delay: calc(0.3s + var(--delay, 0s)); }
	.js .bInfos__avantages.jsAnimateClass.animate .iBoxAvantage__badge .svgIcon svg {opacity: 1; transform: none; }

	.js .bInfos__avantages.jsAnimateClass .iBoxAvantage__ctn {opacity: 0; transition: opacity 1s; transition-delay: calc(0.3s + var(--delay, 0s)); }
	.js .bInfos__avantages.jsAnimateClass.animate .iBoxAvantage__ctn {opacity: 1; }

	.js .bInfos__avantages.jsAnimateClass .bBoxesList__nav {opacity: 0; transform: translateY(0.5em); transition: opacity 1s, transform 1s; transition-delay: 0.6s; }
	.js .bInfos__avantages.jsAnimateClass.animate .bBoxesList__nav {opacity: 1; transform: none; }

	/* Spacings and sizes */
	@media (max-width:62rem) {
		.bInfos {--insideSpacing:calc(0.3 * var(--base-spacing)); padding-top: calc(3em + var(--base-spacing-top)); }
	}

	@media (max-width:46rem) {
		.bInfos {overflow: hidden;}
		.bInfos__separator .svgIcon {font-size: 6em; }
	}



/*
BLOCK / Liberte
Image en BG a gauche et image en BG a droite.
Contenu en plein centre. */
.bLiberte {--insideSpacing:calc(0.5 * var(--base-spacing));display: grid;grid-template-columns: 22vw 1fr 22vw;grid-template-rows: auto;padding-top: var(--base-spacing-top);align-items: end;position: relative;}
.bLiberte__cCtn {grid-column: 2 / 3;grid-row: 1 / 2;text-align: center;align-self: center;justify-self: center;max-width: 60em;margin-bottom: 8em;}
.bLiberte__cCtn > * + * {margin-top: var(--insideSpacing); }
.bLiberte__cImgLeft {grid-column: 1 / 2; grid-row: 1 / 2; }
.bLiberte__cImgRight {grid-column: 3 / 4; grid-row: 1 / 2; }

.bLiberte__title {max-width: 30em;margin-left: auto;margin-right: auto; }
.bLiberte__ctn { }
.bLiberte__cta {margin: 0;position: absolute;z-index: 2;bottom: 0;left: 50%;transform: translate(-50%, 50%);}

	/* 
	ANIMATE APPEAR */
	.js .bLiberte.jsAnimateClass .bLiberte__title {opacity: 0.1; transition: opacity 1s; transition-delay: 0s; }
	.js .bLiberte.jsAnimateClass.animate .bLiberte__title {opacity: 1; }

	.js .bLiberte.jsAnimateClass .bLiberte__ctn {opacity: 0; transition: opacity 1s; transition-delay: 0.3s; }
	.js .bLiberte.jsAnimateClass.animate .bLiberte__ctn {opacity: 1; }

	.js .bLiberte.jsAnimateClass .bLiberte__cImgLeft {opacity: 0.1; transition: opacity 1s; transition-delay: 0.6s; }
	.js .bLiberte.jsAnimateClass.animate .bLiberte__cImgLeft {opacity: 1; }

	.js .bLiberte.jsAnimateClass .bLiberte__cImgRight {opacity: 0.1; transition: opacity 1s; transition-delay: 0.6s; }
	.js .bLiberte.jsAnimateClass.animate .bLiberte__cImgRight {opacity: 1; }

	.js .bLiberte.jsAnimateClass .bLiberte__cta {opacity: 0; transform: translate(-50%, calc(1em + 50%)); visibility: hidden; transition: opacity 1s, transform 1s; transition-delay: 0.9s; }
	.js .bLiberte.jsAnimateClass.animate .bLiberte__cta {opacity: 1; transform: translate(-50%, 50%); visibility: visible; }

	/* Images under content */
	@media (max-width:46rem) {
		.bLiberte {grid-template-columns: 1fr 1fr; gap: 0 25%; }
		.bLiberte__cCtn {grid-column: 1 / 3; grid-row: 1 / 2; padding-left: var(--width-std-left); padding-right: var(--width-std-right); margin-bottom: 0; }
		.bLiberte__cImgLeft {grid-column: 1 / 2; grid-row: 2 / 3; }
		.bLiberte__cImgRight {grid-column: 2 / 3; grid-row: 2 / 3; }
	}



/*
BLOCK / Title
Description. */



/* Lity */
.circle-video {
    width:100%;
	background-color: var(--color-blue);
	border-radius: 50%;
	border: 0.6em solid var(--color-blue);
	position: relative;
}

.circle-video-a {
	position: relative;
	border-radius: 50%;
	display: block;
}

.circle-video-a:hover div svg {
	fill: var(--color-red);
	transition: fill 0.3s;
}

.circle-video-div {
	width: 25%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index:1;
}

.circle-video-div {
	opacity: 0.95;
	fill: white;
}



/* Put gap only when circle */
:not(.bLiberte) + .bInfos {
	padding-top: 2em !important;
}