@charset "utf-8";
/* CSS Document */

@import url('https://fonts.googleapis.com/css2?family=Gabarito:wght@400..900&family=Inter+Tight:ital,wght@0,100..900;1,100..900&display=swap');

:root {
	--bleuF: #003049;
	--bleuC: #81a1ab;
	--bleuV: #52c6d8;
	--rouge: #ac1b42;
	--gris: #ECEEF0;
	/* PCM */
	--vertPCM: #a1cf77;
	--bleuPCM: #00175a;
	--gabarito: "Gabarito", sans-serif; /* TITRES - EXTRABOLD 800 */
	--inter: "Inter Tight", sans-serif; /* TEXTE - LIGHT 300 | NORMAL 400 | SEMIBOLD 600 */
	--LH: 22pt;
}

* {
	box-sizing: border-box;
}

html {
	scroll-behavior: smooth;
}

body {
	width: 100%;
	margin: auto;
	margin-top: 0;
	font-family: var(--inter);
	font-weight: 300;
	font-size: 12pt;
}

h1, h2, h3, h4, h5, h6 {
	font-family: var(--gabarito);
	font-weight: 800;
	margin: 0;
	padding: 0;
	margin-bottom: 40px;
}

h1, h2.h1 {
	font-size: 26pt;
}

p, a, p strong, ul li a, ul li strong, ul li {
	margin: 0;
	line-height: var(--LH);
}

p + h2 {
	margin-top: 40px;
}

p + ul {
	margin-top: 40px;
	margin-bottom: 40px;
}

ul + h2, ul + h3 {
	margin-top: 40px;
}

.content {
	width: 100%;
	padding: 20px;
	padding-top: 40px;
	padding-bottom: 40px;
	position: relative;
}

.italic {
	font-style: italic;
}

/*
 * HEADER
 */
header, #topBar {
	width: 100%;
}

#topBar {
	height: 100px;
	background: var(--bleuF);
	position: fixed;
	z-index: 500;
	box-shadow: 0 5px 15px 0 rgba(0, 0, 0, .2);
}

#topBar .content {
	display: flex;
	justify-content: space-between;
	align-items: center;
	height: 100%;
	padding-top: 0;
	padding-bottom: 0;
	width: 100%;
	max-width: 1280px;
}

.logo {
	width: 163px;
	height: 60px;
	background: transparent url("images/logo_header.webp") no-repeat;
	background-size: 100%;
	display: block;
	border: 0;
}

#boutonMenu, #close {
	width: 50px;
	height: 50px;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	cursor: pointer;
	font-size: 20pt;
	font-weight: 300;
	color: #FFF;
}

/*
 * MAIN
 */
.red {
	color: var(--rouge);
}

.bleuF {
	color: var(--bleuF);
}

.bleuC {
	color: var(--bleuC);
}

.bleuV {
	color: var(--bleuV);
}

.bleuPCM {
	color: var(--bleuPCM);
}

.vertPCM {
	color: var(--vertPCM);
}

.white {
	color: #FFF;
}

.redBG {
	background: var(--rouge);
	color: #FFF;
}

p.redBG, p.bleuCBG, p.bleuFBG, p.bleuPCMBG {
	border-radius: 7px;
	padding: 20px;
	display: block;
	margin-bottom: 20px;
}

.bleuFBG {
	background: var(--bleuF);
	color: #FFF;
}

.bleuCBG {
	background: var(--bleuC);
}

.bleuVBG {
	background: var(--bleuV);
	color: var(--bleuF);
}

.grisBG {
	background: var(--gris);
}

.bleuPCMBG {
	background: var(--bleuPCM);
	color: #FFF;
}

.vertPCMBG {
	background: var(--vertPCM);
}

.center {
	text-align: center;
}

.wrapper {
	display: flex;
	gap: 40px;
	justify-content: center;
	align-items: flex-start;
	flex-wrap: wrap;
	position: relative;
}

p a, main ul li a {
	color: var(--bleuF);
}

p a:hover, p a:focus, main ul li a:hover, main ul li a:focus {
	color: var(--bleuV);
}

.big {
	font-size: 16pt;
	line-height: 26pt;
}

section {
	position: relative;
}

/*
 * MENU
 */
nav {
	display: none;
	width: 85%;
	max-width: 400px;
	position: fixed;
	z-index: 800;
	top: 0;
	right: 0;
	height: 100vh;
	background: var(--bleuF);
	box-shadow: -10px 0 15px -5px rgba(0, 0, 0, .4);
}

nav ul {
	margin: 0;
	padding: 0;
	list-style: none;
	margin-top: 100px;
	margin-left: 40px;
	display: flex;
	gap: 20px;
	flex-direction: column;
	align-items: flex-start;
}

nav ul li a {
	color: #FFF;
	text-decoration: none;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	height: 50px;
	width: auto;
	padding-left: 20px;
	padding-right: 20px;
	border-radius: 7px;
	transition: all .4s ease;
}

nav ul li a:hover, nav ul li a:focus, nav ul li a.actif {
	background: var(--bleuC);
}

#close {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	width: 50px;
	height: 50px;
	cursor: pointer;
	color: #FFF;
	position: absolute;
	top: 20px;
	right: 0;
	transition: all .4s ease;
}

#close:hover, #close:focus {
	color: var(--rouge);
}

/*
 * BACKGROUND / FIRST SECTION
 */
#background {
	background: var(--gris);
	padding-top: 100px;
}

#background.bottomSpace {
	padding-bottom: 100px;
}

.wrapper.presentation {
	align-items: flex-start;
}

.wrapper.presentation:not(.mentor) h1 {
	margin-bottom: 0;
	order: 2;
	width: 100%;
}

.video {
	/*width: 480px;
	height: 270px;*/
	width: 100%;
	max-width: 780px;
	height: auto;
	border-radius: 7px;
	/*background: rgba(0, 0, 0, .15);*/
	order: 1;
	position: relative;
	z-index: 250;
}

.video h2 {
	position: absolute;
	/*background: var(--bleuC);*/
	color: #FFF;
	top: -10px;
	left: 25px;
	padding: 20px;
	border-radius: 7px;
	font-size: 14pt;
	height: 50px;
	display: flex;
	align-items: center;
	margin-bottom: 0;
	z-index: 600;
}

video {
	width: 100%;
	height: auto;
	border-radius: 7px;
	position: relative;
	z-index: 500;
	margin-bottom: 0;
	display: block;
}

h2 + video {
	margin-top: 15px;
}

.float {
	margin: auto;
	display: block;
	margin-bottom: 10px;
}

.cta {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 7px;
	border-radius: 7px;
	padding-left: 20px;
	padding-right: 20px;
	text-decoration: none;
	background: var(--bleuF);
	color: #FFF;
	margin: auto;
	margin-top: 40px;
	width: 100%;
	max-width: 220px;
	height: 50px;
	transition: all .4s ease;
}

.cta:hover, .cta:focus {
	background: var(--bleuV);
	color: #FFF;
}

.redBG .cta {
	background: #FFF;
	color: var(--rouge);
	border: 1px solid #FFF;
}

.redBG .cta:hover, .redBG .cta:focus {
	color: #FFF;
	background: transparent;
}

.bleuVBG .cta {
	background: var(--bleuF);
	color: #FFF;
}

.bleuVBG .cta:hover, .bleuVBG .cta:focus {
	background: #FFF;
	color: var(--bleuF);
}

.stepsProcess, .stepsPCM {
	justify-content: center !important;
	align-items: stretch !important;
	gap: 15px;
	counter-reset: nbStep;
	margin-top: 60px;
}

.stepsPCM {
	gap: 40px;
}

.stepProcess, .stepPCM {
	width: 100%;
	max-width: 190px;
	border-radius: 7px;
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 15px;
	padding-top: 35px;
	padding-bottom: 20px;
	background: #FFF;
	position: relative;
	text-align: center;
	counter-increment: nbStep;
}

.stepProcess::before {
	content: counter(nbStep);
	position: absolute;
	width: 60px;
	height: 60px;
	border-radius: 50%;
	top: -30px;
	left: 50%;
	margin-left: -30px;
	background: var(--bleuV);
	color: #FFF;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 14pt;
	font-family: var(--gabarito);
	font-weight: 800;
	border: 7px solid var(--gris);
	box-sizing: border-box;
}

.stepPCM {
	text-align: left;
	align-items: flex-start;
	max-width: 360px;
}

.stepPCM strong {
	width: 100%;
	text-align: center;
	display: block;
	font-weight: 800;
	font-family: var(--gabarito);
	color: var(--bleuF);
	font-size: 14pt;
	margin-bottom: 20px;
}

.stepPCM ul {
	list-style: none;
	padding-left: 5px;
}

.stepPCM li::before {
	color: var(--bleuF);
	font-family: 'Material Icons';
	content: 'done';
	margin-right: 5px;
	vertical-align: middle;
}

.stepPCM span {
	position: absolute;
	width: 60px;
	height: 60px;
	border-radius: 50%;
	top: -30px;
	left: 50%;
	margin-left: -30px;
	background: var(--vertPCM);
	color: var(--bleuF);
	display: flex;
	align-items: center;
	justify-content: center;
	border: 7px solid var(--gris);
	box-sizing: border-box;
}

.infobulle {
	width: 100%;
	border-radius: 7px;
	background: var(--bleuC);
	padding: 20px;
	color: var(--bleuF);
	text-align: center;
	font-weight: 600;
	font-size: 16pt;
	position: relative;
	padding-bottom: 100px;
	margin-bottom: 80px;
	order: 4;
}

.author {
	font-weight: 300;
	font-size: 12pt;
}

.xp {
	width: 180px;
	height: 180px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	gap: 15px;
	background: var(--rouge);
	color: #FFF;
	margin: auto;
	position: absolute;
	left: 50%;
	bottom: -90px;
	margin-left: -90px;
	font-size: 12pt;
	font-weight: 300;
	box-shadow: 0 -10px 15px -5px rgba(0, 0, 0, .4);
}

.number {
	font-weight: 800;
	font-size: 36pt;
	font-family: var(--gabarito);
}

.presentationContent {
	order: 3;
}

.stepsMentoring {
	counter-reset: nbStepM;
	gap: 10px;
}

.stepMentoring {
	counter-increment: nbStepM;
	width: 100%;
	display: flex;
	align-items: center;
	border-radius: 7px;
	flex-wrap: nowrap;
	/*background: rgba(255, 255, 255, .1);*/
	padding: 10px;
	position: relative;
	transition: all .4s ease;
}

.stepMentoring:hover, .stepMentoring:focus {
	background: rgba(255, 255, 255, .1);
}

.stepMentoring p {
	width: calc(100% - 55px);
}

.stepMentoring::before {
	content: counter(nbStepM);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	margin-right: 15px;
	border: 1px solid #FFF;
	color: #FFF;
	font-weight: 600;
	transition: all .4s ease;
}

.stepMentoring:hover::before, .stepMentoring:focus::before {
	background: #FFF;
	color: var(--bleuF);
}

/*
 * STATS
 */
.wrapper.stats {
	justify-content: center;
}

.stat, .reason:not(button) {
	width: 100%;
	max-width: 360px;
	text-align: center;
}

.wrapper.pcm {
	/*margin-top: 40px;*/
	align-items: flex-start;
}

.pcm .stat {
	max-width: 160px;
	color: var(--bleuF);
}

.stat .value {
	color: var(--rouge);
}

.pcm .stat .value {
	color: var(--bleuF);
}

.value .number + span {
	font-weight: bold;
}

/*
 * REASONS
 */
.wrapper.reasons, .wrapper.questions, .wrapper.packages {
	justify-content: center;
	align-items: flex-start;
	gap: 60px;
	counter-reset: nbReason;
	margin-top: 60px;
}

.wrapper + button {
	margin-top: 40px;
}

.reason:not(button) {
	width: 100%;
	max-width: 600px;
	text-align: left;
	counter-increment: nbReason;
	position: relative;
	display: flex;
	align-items: stretch;
	padding-left: 100px;
}

.reason:not(button) .material-icons {
	color: var(--rouge);
	display: block;
	margin-bottom: 2px;
	font-size: 30px;
}

.reason:not(button) .material-icons + strong {
	display: block;
	margin-bottom: 10px;
	color: var(--rouge);
	font-family: var(--gabarito);
	font-weight: 800;
	font-size: 14pt;
}

.reason:not(button)::before {
	width: 75px;
	height: 100%;
	content: '0' counter(nbReason);
	font-family: var(--gabarito);
	color: rgba(0, 0, 0, .15);
	font-weight: 800;
	font-size: 40pt;
	position: absolute;
	left: 0;
	border-right: 5px solid rgba(0, 0, 0, .15);
}

.reason:not(button):nth-of-type(10)::before {
	content: counter(nbReason);
}

/*
 * BOOK BACK EXTRACT
 */
.extract {
	background: rgba(255, 255, 255, .1);
	backdrop-filter: blur(7px);
	border-radius: 7px;
	padding: 20px;
	position: relative;
	z-index: 100;
	width: 100%;
	max-width: 600px;
	margin: auto;
	margin-top: -100px;
	margin-bottom: 20px;
	padding-top: 65px;
	box-shadow: 0 15px 15px 0 rgba(0, 0, 0, .1);
}

.bookBack {
	position: relative;
	z-index: 500;
}

.extract p {
	position: relative;
}

.extract p::before {
	content: '\201C';
	position: absolute;
	top: -95px;
	left: 0;
	width: 60px;
	height: 60px;
	border-radius: 50%;
	font-family: var(--gabarito);
	color: #FFF;
	background: var(--bleuV);
	font-size: 60pt;
	display: flex;
	align-items: center;
	justify-content: center;
	padding-top: 40px;
	box-sizing: border-box;
	box-shadow: 0 15px 15px 0 rgba(0, 0, 0, .1);
}

/*
 * BOOSTER EVENT / PROCESS
 */
.process {
	margin-top: 40px;
	flex-direction: column;
	align-items: center;
	gap: 20px;
}

.photo {
	width: 230px;
	height: 230px;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	border-radius: 50%;
	margin: auto;
}

.legend {
	padding: 15px;
	border-radius: 7px;
	background: rgba(255, 255, 255, .2);
	position: relative;
	z-index: 100;
	margin: auto;
	margin-top: -20px;
	backdrop-filter: blur(5px);
	box-shadow: 0 10px 15px 0 rgba(0, 0, 0, .1);
}

.legend + a {
	margin: auto;
	display: block;
	margin-top: 25px;
	width: 40px;
	text-align: center;
}

.step {
	width: 100%;
	max-width: 300px;
	text-align: center;
}

.step > p:first-child {
	/*background: rgba(0, 0, 0, .075);*/
	border-radius: 7px;
	padding: 20px;
	margin-bottom: 20px;
	/*border: 1px solid rgba(255, 255, 255, .5);*/
	background: #FFF;
	color: var(--rouge);
}

.arrow {
	width: 50px;
	height: 50px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #FFF;
	transform: rotateZ(90deg);
}

.step p strong:first-child {
	display: block;
}

.wrapper.gifts.events {
	margin-top: 80px;
	margin-bottom: 40px;
}

.wrapper.events .gift {
	/*background: rgba(0, 0, 0, .075);
	border: 1px solid rgba(255, 255, 255, .5);*/
	background: none;
}

.wrapper.events .gift .material-icons {
	/*border: 1px solid #FFF;*/
	left: 50%;
	margin-left: -30px;
	background: #FFF;
	color: var(--rouge);
}

.wrapper.events .gift h3 {
	margin-bottom: 15px;
	text-align: center;
	color: #FFF;
}

.getGift.big {
	max-width: 350px;
	min-height: 50px; /*80px;*/
	height: auto;
	padding-left: 20px;
	padding-right: 20px;
	/*font-size: 16pt;
	font-family: var(--gabarito);
	font-weight: 800;*/
}

.gift.noshadow, .gift.noshadow:hover, .gift.noshadow:focus {
	box-shadow: none;
}

.getGift.big:hover, .getGift.big:focus {
	background: #FFF;
	color: var(--bleuF);
}

.wrapper.atCenter {
	justify-content: center;
	margin-top: 40px;
}

.review.alone {
	max-width: 100%;
	text-align: center;
	background: rgba(0, 0, 0, .075);
	border-radius: 7px;
	padding: 20px;
}

.wrapper.keynote {
	flex-wrap: wrap;
	align-items: flex-start;
	justify-content: center;
	/*margin-bottom: 40px;*/
}

.keynote .presentationContent {
	order: 1;
	width: 100%;
}

.presentationContent h1 {
	margin-bottom: 40px !important;
}

.img {
	width: 100%;
	order: 2;
}

.img img {
	width: 100%;
	margin: auto;
	max-width: 300px;
	height: auto;
	border-radius: 7px;
	display: block;
	filter: grayscale(.5);
}

.citationKeynote p {
	font-size: 18pt;
	line-height: 28pt;
	font-style: italic;
	font-weight: 600;
}

.citationKeynote p + span {
	width: 100%;
	text-align: center;
	display: block;
	margin-top: 20px;
}

/*
 * ABOUT
 */
.photo.about {
	align-items: flex-start;
}

.photo.about img {
	width: 230px;
	height: auto;
}

.presentation .right {
	display: flex;
	gap: 40px;
	flex-wrap: wrap;
	width: 100%;
}

.zones {
	width: 100%;
	justify-content: center;
}

.zone {
	padding: 40px;
	background: #FFF;
	border-radius: 7px;
	max-width: calc(100% - 40px);
	margin: auto;
}

.right h1, .right .zone + h2, .right .wrapper + h2 {
	width: 100%;
	margin-bottom: 0;
	color: var(--bleuF);
}

.zone h2, .zone h3 {
	color: var(--bleuF);
	font-size: 16pt;
}

.zone img {
	display: block;
	margin: auto;
	margin-top: 20px;
	width: auto;
	max-width: 100%;
	height: auto;
}

/*
 * List
 */
.list {
	margin: 0;
	list-style: none;
	padding-left: 0;
}

.list li::before {
	content: 'check';
	font-family: 'Material Icons';
	color: var(--rouge);
	font-size: 16pt;
	margin-right: 10px;
	vertical-align: middle;
}

.list.classic li::before {
	content: 'chevron_right';
}

.wrapper.references {
	gap: 20px;
	margin-top: 40px;
	justify-content: center;
	align-items: center;
}

.wrapper.references img {
	margin: 0;
}

/*
 * FAQ
 */
.fullHeight {
	min-height: calc(100vh - 100px);
}

.wrapper.questions, .wrapper.packages {
	gap: 40px;
}

.question {
	width: 100%;
	max-width: 620px;
}

.question h2, .question h3 {
	color: var(--bleuF);
	cursor: pointer;
	font-size: 14pt;
	padding-bottom: 20px;
	margin-bottom: 0;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	line-height: 24pt;
	border-bottom: 1px solid #DDD;
	transition: all .4s ease;
}

.question h2:hover, .question h2:focus, .question h3:hover, .question h3:focus {
	color: var(--bleuV);
	border-color: var(--bleuV);
}

.redBG .question h2, .redBG .question h3 {
	color: #FFF;
	border-bottom: 1px solid rgba(255, 255, 255, .2);
}

.redBG .question h2:hover, .redBG .question h2:focus, .redBG .question h3:hover, .redBG .question h3:focus {
	color: var(--bleuC);
	border-color: var(--bleuC);
}


.question h2 + p, .question h3 + p {
	display: none;
	margin-top: 20px;
}

.bleuFBG .question h2, .bleuFBG .question h3 {
	color: #FFF;
	border-color: rgba(255, 255, 255, .15);
}

.bleuFBG .question h2:hover, .bleuFBG .question h3:hover, .bleuFBG .question h2:focus, .bleuFBG .question h3:focus {
	color: var(--bleuV);
	border-color: var(--bleuV);
}

/*
 * PACKAGES/FORFAITS
 */
.pack {
	width: 100%;
	max-width: 400px;
	border-radius: 7px;
	padding: 20px;
	padding-top: 20px !important;
	background: #FFF;
	box-shadow: 0 20px 15px -5px rgba(0, 0, 0, .05) !important;
}

.pack h3, .pack p {
	margin-bottom: 20px;
	text-align: center;
}

.pack h3 {
	color: var(--bleuF);
}

.pack .price {
	width: 90px;
	height: 90px;
	margin: auto;
	border-radius: 50%;
	background: var(--gris);
	display: flex;
	flex-direction: column;
	gap: 0px;
	align-items: center;
	justify-content: center;
	font-size: 18pt;
	font-weight: 800;
	font-family: var(--gabarito);
	color: var(--bleuF);
}

.price .pp {
	font-size: 10pt;
	font-family: var(--inter);
	font-weight: 300;
	text-decoration: line-through;
}

.pack:hover, .pack:focus {
	box-shadow: 0 20px 15px -5px rgba(0, 0, 0, .15) !important;
}
/*
 * REVIEWS
 */
#reviews {
	/*margin-top: 130px;*/
	position: relative;
	background: var(--rouge);
}

.reviewsZone {
	width: 100%;
	max-width: 1280px;
	position: relative;
	padding-left: 20px;
	padding-right: 20px;
	margin: auto;
	margin-top: -40px;
}

.bottomSpace {
	padding-bottom: 110px;
}

.bottomSpace40 {
	padding-bottom: 40px;
}

.bottomSpace60 {
	padding-bottom: 60px;
}

.bottomSpace80 {
	padding-bottom: 80px;
}

#reviews h2 {
	text-align: center;
	color: #FFF;
}

.review {
	/*background: #FFF;*/
	border-radius: 7px;
	/*padding: 20px;*/
	padding-left: 20px;
	padding-right: 20px;
	padding-bottom: 20px;
	width: 100%;
	max-width: 360px;
	min-width: 100%;
	color: #FFF; /* #000 */
	/*box-shadow: 0 10px 15px -5px rgba(0, 0, 0, .2);*/
}

.stars {
	color: #F7A243;
	margin-top: 5px;
}

.review .author {
	color: #FFF; /* #999 */
	font-style: italic;
}

.review .author strong {
	font-weight: 800;
	font-style: normal;
	font-family: var(--gabarito);
	font-size: 14pt;
	color: #FFF; /* var(--rouge) */
}

.reviewContent {
	margin-top: 20px;
}

/*
 * CARROUSEL
 */
.carouselZone {
	position: relative;
}

.navigation {
	color: var(--rouge);
	position: absolute;
	z-index: 200;
	width: 35px;
	height: 50px;
	display: flex;
	align-items: center;
	justify-content: center;
	/*background: var(--rouge);*/
	background: #FFF;
	cursor: pointer;
	top: 50%;
	margin-top: -25px;
	transition: all .4s ease;
}

.goNext {
	right: 0;
	border-radius: 25px 0 0 25px;
	padding-left: 5px;
	/*box-shadow: 5px 0 15px 0 rgba(0, 0, 0, .2);*/
}

.goPrev {
	left: 0;
	border-radius: 0 25px 25px 0;
	padding-right: 5px;
	/*box-shadow: -5px 0 15px 0 rgba(0, 0, 0, .2);*/
}

.navigation:hover, .navigation:focus {
	background: var(--bleuC);
	color: #FFF;
}

.carouselContent {
	display: flex;
	align-items: center;
	gap: 40px;
	width: 100%;
	/*padding-left: 40px;
	padding-right: 40px;*/
	padding-bottom: 0px;
	overflow-x: auto;
	position: relative;
}

.carouselElement {
	width: 100% !important;
}

section {
	height: auto;
}

.wrapper.gifts {
	margin-top: 60px;
	gap: 70px;
	justify-content: center;
}

.gift, .pack {
	width: 100%;
	max-width: 400px;
	background: rgba(255, 255, 255, 1);
	position: relative;
	padding: 20px;
	padding-top: 40px;
	border-radius: 7px;
	box-shadow: 0 20px 15px -5px rgba(0, 0, 0, .1);
	transition: all .4s ease;
}

.gift:hover, .gift:focus, .pack:hover, .pack:focus {
	transform: translateY(-8px);
	box-shadow: 0 20px 15px -5px rgba(0, 0, 0, .25);
	/*background: var(--bleuC);*/
}

.gift > .material-icons {
	font-size: 32px;
	color: #FFF;
	background: var(--rouge);
	width: 60px;
	height: 60px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 10px;
	position: absolute;
	top: -30px;
}

.gift h3 {
	color: var(--bleuF);
	font-size: 16pt;
	margin-bottom: 20px;
	line-height: 22pt;
}

.gift p {
	color: #000;
}

.getGift, .finish {
	width: 100%;
	height: 50px;
	max-width: 290px;
	margin: auto;
	text-decoration: none;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 5px;
	border-radius: 7px;
	background: var(--bleuV);
	color: #FFF;
	margin-top: 20px;
	border: 0;
	font-family: var(--inter);
	font-size: 12pt;
	cursor: pointer;
	transition: all .4s ease;
}

.finish {
	max-width: 150px;
}

.getGift:hover, .getGift:focus, .finish:hover, .finish:focus {
	background: var(--rouge);
}

.getGift.light {
	background: rgba(255, 255, 255, .15);
	/*border: 1px solid #FFF;*/
	color: #FFF;
}

.getGift.light:hover, .getGift.light:focus {
	background: #FFF;
	color: var(--bleuF);
}

.getGift.lighter {
	background: #FFF;
	/*border: 1px solid #FFF;*/
	color: var(--bleuF);
}

.getGift.lighter:hover, .getGift.lighter:focus {
	background: var(--bleuF);
	color: #FFF;
}

.quote {
	padding-top: 40px;
	border-top: 1px solid rgba(0, 0, 0, .05);
	margin-top: 40px;
}

.quote p {
	text-align: center;
	font-size: 18pt;
	line-height: 28pt;
	font-style: italic;
	color: var(--bleuF);
	font-weight: 600;
}

.quote span {
	width: 100%;
	text-align: center;
	display: block;
	margin-top: 20px;
	color: var(--bleuF);
}

/*
 * WRAPPER WITH ILLUSTRATION
*/
.illustration {
	gap: 20px;
}

.illustration img {
	width: 100%;
	max-width: 800px;
	height: auto;
	display: block;
	margin: auto;
	margin-top: -150px;
	transform: scale(.01);
	position: relative;
	z-index: 400;
	transition: all .4s ease;
}

.illustration .wrapContent {
	width: 100%;
}

.illustration .getGift {
	margin-top: 40px;
	position: relative;
	z-index: 400;
}

.socials {
	display: flex;
	gap: 15px;
	flex-wrap: wrap;
	margin-top: 40px;
}

.socials.center {
	justify-content: center;
}

.social {
	display: flex;
	gap: 10px;
	align-items: center;
	justify-content: flex-start;
	color: #FFF;
	text-decoration: none;
	padding: 10px;
	border-radius: 7px;
	transition: all .4s ease;
}

.social:hover, .social:focus {
	background: rgba(255, 255, 255, .15);
	color: #FFF
}

i {
	font-size: 40px;
}

.fa-linkedin {
	color: #0E76A8;
}

.fa-whatsapp-square {
	color: #25D366;
}

.social.dark {
	background: none;
	border: 1px solid var(--bleuF);
	color: var(--bleuF);
}

.social.dark:hover, .social.dark:focus {
	background: var(--bleuF);
	color: #FFF;
}

.joinLinkedIn .social.dark {
	background: rgba(255, 255, 255, .5);
	color: var(--bleuF);
	margin: auto;
	margin-top: 20px;
	width: auto;
	max-width: 300px;
	border: none;
	justify-content: center;
}

.joinLinkedIn .social.dark:hover, .joinLinkedIn .social.dark:focus {
	background: #FFF;
	color: var(--bleuF);
}

/*
 * BRANDS TRUST
 */
.wrapper.trust {
	align-items: center;
}

.wrapper.trust img {
	width: 70px;
	height: auto;
}

/*
 * BLOG / ARTICLES
 */
.wrapper.articles {
	justify-content: center;
}

.article {
	width: 100%;
	max-width: 400px;
	border-radius: 7px;
	background: #FFF;
	text-align: center;
	box-shadow: 0 20px 15px -5px rgba(0, 0, 0, .1);
	transition: all .4s ease;
}

.article > a:first-child {
	display: flex;
	align-items: center;
	justify-content: center;
	border: 0;
	border-radius: 7px 7px 0 0;
	text-decoration: none;
	overflow: hidden;
	margin-bottom: 20px;
	transition: all .4s ease;
}

.article img {
	min-width: 400px;
	height: auto;
	transition: all .4s ease;
}

.article:hover img, .article:focus img {
	transform: scale(1.1);
}

.article:hover, .article:focus {
	box-shadow: 0 20px 15px -5px rgba(0, 0, 0, .25);
}

.article h2 {
	width: 100;
	padding-left: 20px;
	padding-right: 20px;
	margin-bottom: 0;
	font-size: 16pt;
	color: var(--bleuF);
}

.article p {
	width: 100%;
	padding: 20px;
}

.article p a:last-child {
	width: 100%;
	max-width: 150px;
	height: 50px;
	border-radius: 7px;
	text-decoration: none;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--bleuV);
	color: #FFF;
	margin-top: 20px;
	margin-left: auto;
	margin-right: 0;
	transition: all .4s ease;
}

.article p a:last-child:hover, .article p a:last-child:focus {
	background: var(--rouge);
}

/*
 * BLOG / FICHE ARTICLE
 */
/*.articleContent {
	margin-top: 20px;
}*/

.articleContent img {
	width: 100%;
	max-width: 600px;
	margin: auto;
	margin-bottom: 0;
	display: block;
	border-radius: 7px;
}

.articleText {
	width: 100%;
}

.articleText > p:first-child {
	margin-bottom: 20px;
}

.articleText h1, .articleText h2, .articleText h3, .articleText h4 {
	color: var(--bleuF);
}

.articleText p + h2, .articleText p + h3, .articleText p + h4, .articleText ul + h2, .articleText ul + h3, .articleText ul + h4 {
	margin-top: 40px;
}

.articleTitle {
	margin-bottom: 0;
}

.back {
	width: 50px;
	height: 50px;
	text-decoration: none;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: var(--bleuC);
	color: #FFF;
	margin-bottom: 20px;
	transition: all .4s ease;
}

.back:hover, .back:focus {
	background: var(--bleuF);
}

.articleText .link {
	width: 100%;
	margin-top: 40px;
	padding-top: 40px;
	border-top: 1px solid rgba(0, 0, 0, .1);
}

.articleText .classic, .classic.legals {
	list-style: none;
}

.articleText .classic li::before, .classic.legals li::before {
	font-family: 'Material Icons';
	content: 'arrow_forward';
	color: var(--bleuF);
	margin-right: 7px;
	vertical-align: middle;
	font-size: 24px;
}

/*
 * SHADOWBOX
 */
#shadow {
	top: 0;
	left: 0;
	position: fixed;
	width: 100%;
	height: 100vh;
	background: rgba(0, 0, 0, .6);
	backdrop-filter: blur(4px);
	align-items: center;
	justify-content: center;
	padding: 40px;
	display: none;
	z-index: 500;
}

.shadowbox {
	width: 100%;
	max-width: 600px;
	min-height: 100px;
	padding: 20px;
	background: #FFF;
	border-radius: 7px;
	position: relative;
	box-shadow: 0 20px 15px -5px rgba(0, 0, 0, .2);
	display: none;
}

.shadowbox h3 {
	color: var(--bleuF);
	margin-bottom: 20px;
	line-height: 20pt;
}

.closeShadowbox {
	position: absolute;
	top: -15px;
	right: 15px;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--bleuC);
	color: #FFF;
	cursor: pointer;
	font-weight: 400;
	transition: all .4s ease;
}

.closeShadowbox:hover, .closeShadowbox:focus {
	background: var(--rouge);
}

/*
 * FORMS
 */
form {
	display: flex;
	justify-content: center;
	gap: 25px;
	flex-wrap: wrap;
}

p + form {
	margin-top: 25px;
}

form * {
	outline: 0;
}

input {
	width: 100%;
	height: 50px;
	border-radius: 5px;
	font-family: var(--inter);
	padding-left: 10px;
	padding-right: 10px;
	border: 1px solid #CCC;
	transition: all .4s ease;
}

input:hover, input:focus {
	border-color: var(--bleuV);
}

.boutonForm {
	width: 100%;
	text-align: center;
}

.boutonForm img {
	margin: auto;
	display: block;
}

.boutonForm strong {
	color: var(--bleuV);
}

input[type="submit"] {
	display: block;
	margin: auto;
	max-width: 250px;
	background: var(--bleuF);
	color: #FFF;
	font-size: 12pt;
	border: none;
	cursor: pointer;
}

input[type="submit"]:hover, input[type="submit"]:focus {
	background: var(--bleuV);
}

.full {
	max-width: 100%;
}

footer {
	background: var(--bleuF);
}

footer .content > a:first-child {
	width: 163px;
	height: 60px;
	display: block;
}

footer .logo {
	background: url("images/logo_footer.webp") center no-repeat;
	background-size: 163px 60px;
	width: 163px;
	height: 60px;
}

footer h3 {
	color: #FFF;
}

footer a + h3 {
	margin-top: 40px;
}

footer .wrapper {
	align-items: flex-start;
	margin-top: 60px;
	margin-bottom: 40px;
	justify-content: flex-start;
}

footer .bloc {
	width: 100%;
	max-width: 400px;
}

/*footer .content > .bloc:first-of-type {
	max-width: 100%;
	margin-bottom: 40px;
	padding-bottom: 40px;
	border-bottom: 1px solid rgba(255, 255, 255, .1);
}

footer .cta {
	background: #FFF;
	color: var(--bleuF);
	margin: auto;
	margin-top: 0;
}

footer .cta:hover, footer .cta:focus {
	background: var(--bleuV);
	color: #FFF;
}*/

footer a, footer p {
	color: #FFF;
	line-height: var(--LH);
}

footer a {
	text-decoration: none;
}

footer a:hover, footer a:focus {
	color: var(--bleuV);
}

footer .wrapper + p {
	padding-top: 40px;
	border-top: 1px solid rgba(255, 255, 255, .1);
}

/*
 * ANCRES
 */
.anchor {
	position: absolute;
	z-index: 0;
	left: 0;
	top: -100px;
	width: 0;
	height: 100px;
}

/*
 * VERSION PC
 */
@media only screen and (min-width: 1280px) {
	.content {
		width: 1280px;
		margin: auto;
		padding-left: 0;
		padding-right: 0;
	}
	
	#boutonMenu, #close {
		display: none;
	}
	
	/*#background {
		padding-bottom: 30px;
	}*/
	
	nav {
		display: flex;
		align-items: flex-end;
		width: auto;
		position: static;
		box-shadow: none;
		height: auto;
		max-width: none;
	}
	
	nav ul {
		margin-top: 0;
		margin-left: 0;
		flex-direction: row;
	}
	
	nav ul li a:hover, nav ul li a:focus, nav ul li a.actif {
		background: var(--bleuC);
	}
	
	.wrapper {
		justify-content: space-between;
		align-items: center;
	}
	
	.video {
		order: 3;
		width: 640px;
		height: 360px;
	}
	
	.video h2 {
		top: -25px;
	}
	
	video, h2 + video {
		margin-top: 0;
	}
	
	.float {
		float: left;
		margin-right: 20px;
		margin-bottom: 20px;
	}
	
	.pcm .stat {
		max-width: 290px;
	}
	
	.presentationContent {
		order: 2;
		width: calc(100% - 680px);
	}
	
	.cta {
		margin: inherit;
		margin-top: 40px;
	}
	
	.infobulle {
		width: 100%;
		padding-bottom: 20px;
		margin-bottom: 0;
		margin-top: 20px;
	}
	
	.infobulle > p {
		padding-left: 190px;
	}
	
	.xp {
		bottom: 50%;
		margin-bottom: -90px;
		left: auto;
		margin-left: 0;
		box-shadow: 0 0 15px 0px rgba(0, 0, 0, .5);
	}
	
	.reviewsZone {
		padding-left: 0;
		padding-right: 0;
	}
	
	.review {
		min-width: 360px;
		padding: 20px;
	}
	
	.carouselContent {
		overflow: hidden;
		padding-left: 40px;
		padding-right: 40px;
		padding-bottom: 0;
		align-items: flex-start;
	}
	
	.goNext {
		right: -25px;
		width: 50px;
		padding-left: 0;
		border-radius: 50%;
	}
	
	.goPrev {
		left: -25px;
		width: 50px;
		padding-right: 0;
		border-radius: 50%;
	}
	
	.wrapper.gifts {
		gap: 40px;
	}
	
	.illustration .wrapContent {
		width: calc(100% - 840px);
	}
	
	.illustration .getGift {
		margin-left: 0;
	}
	
	.extract {
		position: absolute;
		left: 0;
		top: 20px;
		margin-top: 0;
		z-index: 400;
		background: rgba(255, 255, 255, .35);
		max-width: 550px;
		padding-top: 40px;
		box-shadow: 15px 15px 15px 0 rgba(0, 0, 0, .1);
	}
	
	.extract p::before {
		top: -70px;
	}
	
	.bookBack {
		left: 170px;
	}
	
	.stepsPCM {
		align-items: flex-start !important;
	}
	
	/*
	 * BLOG / FICHE ARTICLE
	 */
	.articleContent {
		align-items: flex-start;
		flex-direction: row-reverse;
	}
	
	.articleContent img {
		margin: 0;
		position: sticky;
		top: 120px;
	}
	
	.articleText {
		width: calc(100% - 640px);
	}
	
	/*
	 * PROCESS
	 */
	.process {
		flex-direction: row;
		justify-content: center;
		align-items: flex-start !important;
	}
	
	.arrow {
		transform: none;
		width: 50px;
		margin-top: 10px;
	}
	
	.step {
		max-width: 250px;
	}
	
	.legend {
		margin-top: -25px;
	}
	
	.keynote.withVideo {
		align-items: center !important;
		flex-wrap: nowrap;
	}
	
	.keynote.withVideo .presentationContent {
		width: calc(100% - 680px);
	}
	
	.keynote:not(.withVideo) .presentationContent {
		width: calc(100% - 340px);
	}
	
	.img {
		width: 300px;
	}
	
	/*
	 * ABOUT
	 */
	.presentation.mentor {
		align-items: flex-start;
		padding: 0;
	}
	
	.right {
		width: calc(100% - 270px) !important;
	}
	
	.zones {
		flex-wrap: nowrap;
		align-items: flex-start;
	}
	
	.zone {
		max-width: none;
		margin: inherit;
	}
	
	.presentation .left {
		position: sticky;
		top: 120px;
	}
	
	#shadow {
		z-index: 1000;
	}
	
	/*
	 * FOOTER
	 */
	footer .content > p:last-child {
		font-size: 10pt;
	}
}

@media only screen and (width: 1280px) {
	.content {
		width: 1200px;
	}
}

@media only screen and (-webkit-min-device-pixel-ratio : 1.5), only screen and (min-device-pixel-ratio : 1.5) {
	.logo {
		background-image: url("images/logo_header_2x.webp");
	}
	
	footer .logo {
		background-image: url("images/logo_footer_2x.webp");
	}
}