/**
 * Theme Name:     Twenty Twenty-One Child
 * Author:         the WordPress team
 * Template:       twentytwentyone
 * Text Domain:	   twenty-twenty-one-child
 * Description:    Twenty Twenty-One is a blank canvas for your ideas and it makes the block editor your best brush. With new block patterns, which allow you to create a beautiful layout in a matter of seconds, this theme’s soft colors and eye-catching — yet timeless — design will let your work shine. Take it for a spin! See how Twenty Twenty-One elevates your portfolio, business website, or personal blog.
 */

:root {
	--orange: #ff9b45;
	--beige: #fff4e2;
	--white: #FFFEFC;
	
	--grup6: 17.94rem; /* 288px */
    --grup5: 11.09rem; /* 177px */
    --grup4: 6.85rem; /* 110px */
    --grup3: 2.5rem; /* 40px */
    --grup2: 2rem; /* 32px */
    --grup1: 1.67rem; /* 27px */
    --grup: 1.0625rem; /* 16px */
    --grup-1: 0.62rem; /* 10px */
    --grup-2: 0.38rem; /* 6px */
    --grup-3: 0.24rem; /* 4px */
    --grup-4: 0.15rem; /* 2px */
    --grup-5: 0.09rem; /* 1px */
    --grup-6: 0.06rem; /* 1px */
}

/*-----------BODY------------*/
body{
	background-color: var(--white);
	width:100vw;
	overflow-x:hidden;
}

.site-main{
	padding-top: 0!important;
}

*::before, *::after {
    content: none !important;
}

.responsive-menu-pro-inner::before,
.responsive-menu-pro-inner::after
{
	content: "" !important;
}

main{
	padding: 0 !important;
}

#content{
	min-height: 77vh;
	margin-bottom: 50px;
}

::selection {
  background-color: rgba(255, 155, 69, 0.5);
}

/*------------TEXT-------------*/
@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@300;400;500;600;700&display=swap');

.header-home {
	position: relative;
}

.header-home h1{
	margin: 0 !important;
	font-size: 3.7rem !important;
	width: auto;
}

.mobile-background {
	display: none;
}

@media only screen and (max-width: 1352px) {
	
 	.header-home h1 {
    	font-size: clamp(2.1rem, calc(1.3rem + 2.5vw), 3rem) !important;
  	}
	
	.header img {
		display: none;
	}
	
	.mobile-background {
		display: block;
		position:absolute;
		top: 0;
		left: 0;
		margin: 0 !important;
		width: 75% !important;
	}
	
	.mobile-background img {
		width: 100%;
	}
}

h1 {
    font-size: 2.7rem !important;
	margin: 150px 0 50px !important;
}

.title-problematique{
	margin-bottom: 0 !important;
}

.title_page,
article h1 {
	font-family: Quicksand, Sans-Serif;
	text-align: center;
	font-size: 45px;
	width: 100%;
}

h2{
	font-size: var(--grup2) !important;
	margin: 0 !important;
}

.section-background h2{
	margin-bottom: 50px !important;
}


span{
	color: var(--orange);
}

p{
	font-size: var(--grup) !important;
}

.subtitle{
	margin: 0 !important;
}

@media screen and (max-width: 653px){
	h1 {
		 margin: 85px 0 50px !important;
	}
	
	.title_page {
		font-size: 37px !important;
		padding: 0 10px !important;
	}
}


/*---------BARRE NAV------------*/
#masthead{
	position: fixed;
	justify-content: center;
	top: 0;
    background-color: var(--white);
    width: 100vw !important;
    padding: 10px 86px !important;
	z-index: 30;
	box-shadow: -1px -13px 28px 5px rgba(0,0,0,0.15);
}

.site-logo{
	width: 220px;
	margin: 0 !important;
}

.primary-navigation{
	display: flex;
	align-items: center;
	padding-right: 12px;
}

@media only screen and (min-width: 822px){
	.site-header {
    padding: 18px 0 0 0!important;
	}
}

@media only screen and (max-width: 1352px){
	.primary-navigation{
		margin-left: initial !important;
	}
}

.primary-navigation a{
	font-size: 16px !important ;
	transition: 0.3s ease-in-out;
	border-radius: 50px;
	padding: 8px 19px !important;
    height: fit-content !important;
	text-decoration-color: var(--orange) !important;
}
.primary-navigation a:hover {
	text-decoration-color: var(--orange) !important;
	transition: 0.3s ease-in-out;
	text-decoration-style: solid !important;
}

.primary-navigation a:focus {
	background-color: var(--orange) !important;
}

.primary-navigation .current-menu-item > a:first-child, .primary-navigation .current_page_item > a:first-child {
    text-decoration-color: var(--orange) !important;
}

.primary-navigation .primary-menu-container > ul > .menu-item > a {
	padding: 8px 13px !important;
}
.primary-navigation > div > .menu-wrapper 
{
    gap: 0;
}

#primary-menu-list li{
	align-items: center;
}

.menu-item-288 a,
.menu-item-288 a:focus{
	background-color: var(--orange) !important;
    border-radius: 24px;
	color: white !important;
	border: solid 2px var(--orange);
	text-decoration: none !important;
	font-weight: 600 !important;
	margin-left: 13px !important;
}

.menu-item-288 a:hover{
	background-color: transparent !important;
	color: var(--orange) !important;
}

/*---------RESPONSIVE MENU-----------*/
@media screen and (max-width: 1106px){
	
	#rmp_menu_trigger-669 {
    	top: 30px;
    	right: 20px;
		border: var(--white) 2px solid;
		box-shadow: 2px 3px 6px 0px rgba(0,0,0,0.06);
	}
	
	#rmp-menu-wrap-669 .rmp-menu-item-link {
		height: auto !important;
		line-height: 35px;
		padding: 30px;
	}
	
	#rmp-container-669 {
		max-width: 450px;
		left: auto;
        right: 0;
	}
	
	#rmp-menu-title-669 {
    	padding-right: 9%;
	}
	
	.rmp-menu-title-image{
		width: 75%;	
		margin: 0 !important;
	}
	
	.rmp-container.rmp-slide-left, .rmp-container.rmp-push-left {
		-webkit-transform: translateX(100%);
	}
}
	
/*-------------------------------------*/
	
@media only screen and (min-width: 653px)
:root 
{
    --global--font-size-xl: 2.5rem;
    --global--font-size-xxl: 6rem;
    --global--font-size-xxxl: 9rem;
    --heading--font-size-h3: 2rem;
    --heading--font-size-h2: 3rem;
}

:root {
    --global--font-size-md: 1.1rem !important;
}
/*Gap Block*/
.wp-container-11.wp-container-11
{
    gap: 1.5em !important;
}

/*Section 1 - Accueil*/

.header-home {
	height: 87vh !important;
    align-items: center;
    display: flex;
	padding: 0 5.5rem !important;
	gap: 3rem;
	width: 100%;
}

.header{
	height:96vh;
	margin: 0 !important;
	padding-top: 70px;
}

.chevron-down {
	width: 30px !important;
    position: absolute;
	bottom: 7px;
    left: 50%;
    transform: translate(-50%, -50%);
}

.chevron-down img {
	height: auto !important;
	display: block !important;
	bottom: 0 !important;
}

@media screen and (max-width: 653px){
	h2 {
    	font-size: var(--grup1) !important;
	}
	
	.header {
		height: 85vh !important;
		margin-bottom: 20px !important;
	}
	
	.header-home {
		padding: 0 2rem !important;
		align-items: center !important;
		flex-direction: column !important;
        justify-content: flex-start !important;
        padding-top: 35% !important;
        height: 100% !important;
	}
	
	.header-home h1 {
		text-align: center;
	}
	
	.chevron-down img {
		bottom: -15px !important;
	}
}

.header img{
	position: absolute;
    bottom: 4vh;
	right:0;
	height: 90vh;
	width: initial;
}

@media screen and (max-width: 1106px){
	.header img{
		display: none;
	}
	
	.header-home{
		flex-direction: column !important;
	}
}

#colophon{
	display:none;
}

.site-header{
	max-width: none !important;
}

main header{
	display: none !important;
}

.thematic{
	height: 100px;
	width: 80px
}

/*----------BUTTONS---------------*/

.back {
	background: transparent;
	position: absolute;
	top: 0;
	left: 35px;
}

.back svg {
	height: 30px;
    fill: #ff9b45;
}

@media screen and (max-width: 1106px) {
	#rmp_menu_trigger-669 {
		top: 20px;
	}
	
	.back {
		top: 30px;
		left: 23px;  
	}
}

.wp-block-button__link{
	transition: 0.3s;
}

@media screen and (max-width: 653px){
	.wp-block-button__link{
		border: solid 1px !important;
	}
}

.wp-block-button.is-style-outline>.wp-block-button__link {
    padding: 0.5em 1.333em !important;
}

.wp-block-button .wp-block-button__link{
	font-family: Quicksand, Sans-Serif;
	font-weight: 700;
}

/*--change background color on hover--*/
.has-background .wp-block-button.is-style-outline .wp-block-button__link:hover,
.has-background .wp-block-button.is-style-outline .wp-block-button__link:active {
	background-color: var(--orange) !important;
}

/*--remove dot on focus--*/
is-style-outline .wp-block-button__link[style*=radius]:focus, 
.wp-block-button a.wp-block-button__link[style*=radius]:focus {
    outline: none !important;
}

/*--remove background and border on focus--*/
.has-background-white .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) {
    background: none !important;
	color: black !important;
	outline: none;
}

.wp-block-buttons{
	justify-content: center !important;
}

@media screen and (max-width: 653px){
	.wp-block-buttons{
		width: -webkit-fill-available;
	}
}

/*-------------CAROUSEL---------------*/
/*--Books--*/
.wpcp-carousel-wrapper{
	background-color: var(--beige);
	padding: 30px 40px;
	margin-top: 0 !important;
}

.title-wrapper{
	margin: 0 0 20px 0 !important;
	padding-bottom: 0 !important;
	padding-left: 87px !important;
}

@media screen and (max-width: 653px){
	.title-wrapper{
		padding-left: 20px !important;
	}
	
	.wpcp-single-item img{
		width: 69vw !important;
	}
}

.title-wrapper h2{
	line-height: 1.1 !important;
}
.title-wrapper span{
	color: black !important;
	font-size: 1.375rem !important;
}

/*--show left arrow--*/
.fa-angle-left::before{
	content: "\f104" !important;
}

/*--show right arrow--*/
.fa-angle-right::before{
	content: "\f105" !important;
}

/*--arrow size--*/
.fa-angle-left::before,
.fa-angle-right::before{
	font-size: 3rem;
}

/*--Citations--*/
.citations-slider {
	width: 100%;
	margin-bottom: 0 !important;
}

.citations-slider .wpcp-carousel-wrapper {
	background-color: transparent;
	display: none;
	width: 100%;
	padding: 10px;
}

.citations-slider .wpcp-next-button,
.citations-slider .wpcp-prev-button {
	display: none
}

@media screen and (max-width: 653px){
	.citations-slider .wpcp-carousel-wrapper {
		display: block
	}
	.citations-fix {
		display: none !important;
	}
}

/*---------------ARTICLE--------------*/

.wp-block-latest-posts{
	margin-top: 50px !important;
    justify-content: space-between;
    width: 90%;
	margin-right: 0 !important;
}

@media screen and (max-width: 653px){
	.wp-block-latest-posts {
		justify-content: center;
	}
	
	.wp-block-latest-posts__list li {
		margin-bottom: 20px !important;
	}
}

.wp-block-latest-posts li{
	width: 285px !important;
}

.wp-block-latest-posts__post-title{
	font-size: var(--grup1) !important;
	width: 100%;
	text-align: center;
}

.wp-block-latest-posts__post-excerpt{
	width: inherit;
	font-size: var(--grup) !important;
	font-weight: 300;
}

/*--image--*/

.wp-block-latest-posts__featured-image a img,
.section-content img {
	border-radius: 25px;
}

/*----------------HOME-----------*/

.section-background{
	margin: 0 0 100px 0 !important;
	position: relative;
}

@media screen and (max-width: 653px){
	.section-background > p{
		width: 87%;
	}
}

.entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator){
	max-width: 100% !important
}

.cards{
	width: 89% !important;
    flex-wrap: wrap !important;
    gap: 38px;
	z-index: 2;
}

.card{
	border-radius: 44px;
    width: 287px;
    justify-content: space-between;
    padding: 52px 18px !important;
	box-shadow: 7px 8px 24px 0px rgba(0,0,0,0.04);
	height: 430px;
}

.card-title {
	gap: 0 !important;
	justify-content: center;
}

.card-title,
.card-title p {
	font-size: 1.3rem !important;
}

.card img{
	width: 38%;
}

@media screen and (max-width: 653px){
	.cards{
		gap: 14px;
	} 
	
	.card {
		padding: 17px 13px !important;
        width: 100%;
        border-radius: 22px;
        height: 270px;
        justify-content: space-around;
        gap: 0 !important;
	} 
	
	.card .wp-block-image {
		width: 58px;
	}
	
	.card img {
		width: auto;
	}
	
	.card2 {
		height: auto !important;
        padding: 20px 20px !important;
        gap: 20px !important;
	}
	
	.circle-1 {
		right: -14vw !important;
    	top: 97px !important;
	}
	
	.section-background {
    	margin: 0 0 50px 0 !important;
		overflow-x: hidden;
	}
	
	.section-background h2 {
    	margin-bottom: 30px !important;
	}
	
	.section-content {
		gap: 10px !important;
	}
	
	.section-content img {
		width: 80%;
	}
	
	.card-title {
		flex-direction: row !important;
		gap: 5px !important;
	}
}

.section,
.content-title {
	width: 87%;
}

@media screen and (max-width: 653px){
	.section{
		margin-top: 0 !important;
	}
}

.content-title > .wp-block-group__inner-container {
	align-items: flex-start;
}

.wp-block-group__inner-container {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.section-content{
	justify-content: space-between !important;
	margin: 0 0 50px 0 !important;
	width: 100%;
	gap: 50px;
}

*[class*=inner-container] > *:not(.entry-content):not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator){
	max-width: 1253px !important;
}

.a-propos > *[class*=inner-container] > *:not(.entry-content):not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator){
	max-width: 950px !important;
}

@media screen and (max-width: 653px){
	.section-content{
		flex-direction: column;
		gap: 30px !important;
	}
}

.section-content div{
	gap: 30px;
}

.section-content p{
	max-width: 715px;
}

.card2{
	width: 363px;
    height: 320px;
    justify-content: space-between;
	gap: 0;
}

.card2 div{
	gap: 20px;
}

.circle-1{
	position: absolute;
    right: 4vw;
	top: 90px;
}

/*-------------COMMUNICATION RELATIONNELLE------------*/

.espere{
	border-radius: 44px;
	margin: 0 59px !important;
	justify-content: space-between;
}

@media screen and (max-width: 653px){
	.espere{
		flex-direction: column;
		margin: 0 !important;
        padding: 27px 0 !important;
		border-radius: 20px;
	}
	
	.espere > div {
    	width: 87% !important;
	}
	
	.espere img {
		height: 250px;
	}
	
	.display-none-mobile {
		display: none;
	}
}

.acronyme-espere{
	font-size: 1.375rem !important;
	margin: 20px 0 !important;
}

.espere > div{
	width: 61%;
}

.citation{
	border-radius:44px;
	width: 50%;
	position: relative;
	height: 422px;
    display: flex;
    justify-content: center;
}

@media screen and (max-width: 653px){
	.citation {
    	width: 90%;
		padding: 20px !important;
		height: 335px;
	}
}
	
.quote-left,
.quote-right{
	position: absolute;
}

.quote-left{
	left: 25px;
    top: 25px;
}

.quote-right{
	right: 25px;
    bottom: 25px;
}

.citation p{
	 z-index: 1;
}
/*----------ACCOMPAGNEMENT---------------*/

.accompagnement-cards .card{
	width: 287px;
	height: 308px;
	margin-bottom: 50px;
}

.duration{
	font-size: var(--grup) !important;
}

.price{
	font-size: var(--grup2) !important;
}

.accompagnement-section{
	margin: 0px 0 35px 0 !important;
}
/*--------------A PROPOS---------------*/
.a-propos{
	padding-top: 10vh !important;
}

.a-propos-content{
	width: 100% !important;
	margin-bottom: 50px !important;
}

.a-propos h1 {
	width: 100%;
	margin: 0 !important;
	font-size: 2em !important;
}

.a-propos h2 {
	font-size: 1.4em !important;
    width: 100%;
    margin: 20px 0 !important;
	
}

.a-propos img{
	margin: 20px 0;
}

.a-propos .espere > div {
	width: 100%;
}

.presentation {
	gap: 50px
}

.presentation h1 {
	text-align: start;
}

.a-propos .wp-block-button {
	margin-top: 20px;
} 

@media screen and (max-width: 653px){
	.a-propos {
		margin-top: 0 !important;
		position: absolute;
    	top: 0;
		padding-top: 20px !important;
	}
	
	.a-propos h2 {
		width: 87%;
		font-size: 1.1em !important;
		margin: 30px 0 10px 0 !important;
	}
	
	.presentation {
		flex-direction: column;
    	gap: 0px;
	}
	
	.presentation h1,
	.presentation p {
		text-align: center;
	}
}
/*--------------CONTACT----------------*/
.contact-title {
	text-align: start;
}

.form-contact{
	width: 87%;
    justify-content: space-between !important;
    align-items: start !important;
    margin-top: 100px !important;
}

.contact-portrait {
	width: 50% !important;
}

.contact-icon{
	width: 20px;
	align-items: center;
    display: flex;
}

.contact-infos{
	gap: 35px;
	margin-top: 10px !important;
}

.adresse-infos{
	width: 55%;
}

.section-adresse-infos{
	margin: 40px 0 !important;
}

@media screen and (max-width: 653px){
	.form-contact {
		flex-direction: column;
		gap: 50px;
		margin-bottom: 50px !important;
		margin-top: 60px !important;
	}
	
	.contact-title {
		text-align: center;
	}
	
	.form-contact > div {
		width: 100%;
		align-items: center;
	}
	
	.wp-container-core-group-is-layout-5 {
		align-items: center !important;
	}
	
	.contact-infos {
		margin-top : 30px !important;
	}
	
	.wpcf7 {
    	border-radius: 20px !important;
    	padding: 23px 17px 15px !important;
    	width: 86vw;
	}
	
	.align_name {
		flex-direction: column;
	}
	
	.align_name p {
		max-width: 100% !important;
	}
	
	.adresse-infos {
		width: 100%;
	}
}

/*-----------FOOTER---------------*/
.footer {
	align-items: center !important;
	padding: 40px 0 !important;
}

.widget-area {
	margin: 0 !important;
	padding: 0 !important;
}

.widget-area section {
	width: 100vw !important;
	margin: 0 !important;
}

.widget-area nav{
	width: 100%;
}

.widget-area ul{
	display: flex;
	flex-direction: column;
}

.widget-area a{
	font-size: var(--grup) !important;
	color: black !important;
	text-decoration: none !important;
	text-decoration-color: var(--orange) !important;
}

.widget-area a:hover{
	text-decoration: underline !important;
	transition: text-decoration 0.3s ease-in-out;
	text-decoration-color: var(--orange) !important;
}

.footer-content {
	align-items: start;
	width: 90%;
	justify-content: space-between;
	flex-wrap: wrap !important;
}

.footer-content .wp-block-image {
	width: 220px;
}

.copyright {
	font-size: 0.8em !important;
	margin-top: 40px !important;
}

@media screen and (max-width: 653px){
	.widget_nav_menu {
		width: 100%;
	}
	
	.copyright {
		text-align: center;
	}
	
	.footer-content {
		gap: 30px;
	} 
	
	.footer-content .wp-block-image {
		margin-left: auto;
		margin-right: auto;
	}
	
	.footer p {
		width: 100% !important;
	}
}

/*------------PROBLEMATIQUES-----------*/
.icon-problematique{
	margin-top: 20px !important;
	margin-bottom: 68px !important;
	height: 60px;
}

.icon-problematique img {
	max-height: 100% !important;
}

@media screen and (max-width: 653px){
	.mobile-none {
		display: none;
	}
	
	.icon-problematique {
		margin-bottom: 30px !important;
	}
}

/*--------------ACTUALITES---------------*/
.wp-block-latest-posts__list {
	margin-top: 0 !important;
}

.wp-block-latest-posts__list li {
	margin-right: 0 !important;
}

.wp-block-latest-posts__list li * {
    margin: 5px 0 !important;
}

.wp-block-latest-posts__featured-image img {
	border-radius: 10px;
}

.wp-block-latest-posts__post-title {
	font-family: Quicksand, Sans-Serif !important;
	text-align: start;
	font-weight: 600 !important;
}