/*** GENERAL ***/

/* Container */
.section-container {
    padding: 5rem 10vw;
}

/* Links & Buttons */
.primary-button:hover{
	background-color: #D9F4F5;
	color: var(--turquoise);
}

.phone-button:hover{
	background-color: #BEF0F2;
}
.inverted-phone-button:hover{
	background-color: #BEF0F2;
}

.border-button{
	border: 2px solid var(--turquoise);
    background-color: transparent;
    color: var(--turquoise);
}
.border-button:hover{
	background-color: var(--turquoise);
	color: white;
}

.section-link:hover{
	color: var(--dark-blue);
}

/* Title section */
.title-section{
	padding: 0 5vw;
	align-items: center;
}

/* Forms */
.gform_heading{
	display: none !important;
}
.gform-theme--foundation .gform_fields{
	row-gap: 10px !important;
}

/*** HEADER ***/

/* Container */
.site-header .section-container{
	padding-top: 0;
	padding-bottom: 20px;
}
.header-bottom, .header-top {
    padding-left: 0;
    padding-right: 0;
}

/* Links & Buttons */
.site-header .border-button{
	height: 40px;
}
.header-link:hover{
	color: var(--turquoise);
}
.language-switcher{
	cursor: pointer;
}

.header-nav .main-menu li:hover{
	color: var(--turquoise);
}

/* Menu mobile */

/* S'assurer que le menu mobile est bien masqué */
.mobile-menu {
    display: none;
    position: fixed;
    top: 0;
    right: 0;
    width: 80%;
    height: 80vh;
    background: white;
    box-shadow: -2px 0 5px rgba(0, 0, 0, 0.2);
    padding: 20px;
    transform: translateX(100%);
    transition: transform 0.3s ease-in-out
}

.mobile-menu.open {
    display: block;
    transform: translateX(0);
}

/* Styles du bouton de fermeture */
.close-menu {
    position: absolute;
    top: 15px;
    right: 15px;
    background: none;
    border: none;
    font-size: 24px;
    cursor: pointer;
    color: #333;
}

/* Bouton burger */
.burger-menu {
    display: flex;
    flex-direction: column;
    gap: 5px;
    background: none;
    border: none;
    cursor: pointer;
    padding: 10px;
}

.burger-menu span {
    display: block;
    width: 25px;
    height: 3px;
    background-color: #333;
    transition: all 0.3s ease-in-out;
}

#mobile-menu .header-top{
	margin-top: 10vw;
}
#mobile-menu .header-top-right{
	flex-direction: column;
	align-items: flex-end;
}

#mobile-menu .header-bottom, #mobile-menu .header-bottom .header-cta{
	align-items: flex-end;
}
#mobile-menu .header-bottom .header-nav{
	padding-left: 0;
	padding-right: 0;
}
#mobile-menu .header-bottom .header-nav .menu-item{
	margin: 20px 0;
	font-size: 24px;
	text-align: right;
}

/* Animation burger */
.burger-menu.open span:nth-child(1) {
    transform: translateY(8px) rotate(45deg);
}
.burger-menu.open span:nth-child(2) {
    opacity: 0;
}
.burger-menu.open span:nth-child(3) {
    transform: translateY(-8px) rotate(-45deg);
}

/*** FOOTER ***/

/* Container */
.site-footer{
	padding-top: 0;
	padding-bottom: 0;
}
.site-footer .section-container{
	padding-bottom: 30px;
	justify-content: space-between;
	flex-wrap: wrap;
}
.footer-appointment{
	flex-grow: 1;
}

/* Links */
.footer-nav li:hover{
	color: #BEF0F2;
}

/*** BLOCKS ***/

/* Services Carrousel */
.services-carousel-nav{
	padding: 0 10vw;
	margin-left: 0;
	margin-right: 0;
}
.services-horizontal-carousel.swiper, .horizontal-carousel.swiper{
	margin-left: 10vw;
	padding: 0;
}
.services-horizontal-carousel .carousel-item{
	height: 210px;
}
.services-horizontal-carousel .carousel-item-title{
    position: absolute;
    top: 120px;
    transition: transform .3s ease-in-out;
    text-align: left;
}
.services-horizontal-carousel .carousel-item:hover .item-icon{
	opacity: 0;
}
.services-horizontal-carousel .carousel-item:hover .item-more-info{
	opacity: 1;
}
.services-horizontal-carousel .carousel-item:hover .carousel-item-title{
	bottom: -30px;
	transform: translateY(-80%);
}

/* Highlight */
.highlight{
	gap: 8vw;
}
.highlight-description{
	padding-left: 0;
}

/* Buttons */
.buttons-section{
	margin-left: 10vw;
	margin-right: 10vw;
}

/* Collapsible */
.collapsible-container{
	padding: 5rem 15vw;
}
.c-collapsible{
	cursor: pointer;
}
.c-collapsible:hover{
	color: var(--turquoise);
}

/* Carrousel */
.carousel-nav{
	padding: 0 10vw;
	margin-left: 0;
	margin-right: 0;
}

/* Banner */
.banner{
	padding: 5rem 10vw;
}
.banner-container{
	padding-left: 0;
	padding-right: 0;
}

/* Job offers */
.job-offers{
	padding: 5rem 10vw;
}
.job-offers .job-header h1{
	margin-bottom: 1.5rem;
}

/*** SERVICES PAGE ***/
.services{
	padding: 5rem 15vw;
}
.services .grid-section .grid-item:hover .item-title{
	bottom: -80px;
	left: initial;
}

/*** CONTACT PAGE + RECRUTEMENT PAGE ***/
.contact-form{
	padding: 5rem 15vw;
	gap: 10vw;
}

/*** RESPONSIVE ***/

/* Cacher le menu mobile sur desktop */
@media (min-width: 1024px) {
    .mobile-menu {
        display: none !important;
    }
	.hidden-desktop {
        display: none !important;
    }
}

@media (max-width: 1023px) {
    .hidden-mobile {
        display: none !important;
    }
}

/*** Tablette ***/
@media (min-width: 480px) and (max-width: 768px){
	.site-footer .section-container{
		justify-content: flex-start;
		gap: 2.5rem;
	}
	.values-container{
		flex-wrap: wrap;
		justify-content: flex-start;
	}
	.image-row .image_container{
		overflow: hidden;
	}
	.banner .banner-container{
		flex-basis: 50% !important;
	}
	.services .service-header .md\:w-1\/3{
		width: 50%;
	}
}

/*** Tablette & Mobile ***/
@media (max-width: 768px){
	.site-header .section-container{
		padding-bottom: 0;
	}
	.header-bottom.flex{
		flex-direction: initial;
		align-items: center;
	}
	
	.section-container, .contact-form, .banner, .collapsible-container, .appointment-container, .services {
		padding: 5rem 5vw;
	}
	.full_width_image-container{
		padding: 0 5vw;
	}
	
	.hero-banner{
		height: fit-content !important;
	}
	.hero-banner .hero-content{
		max-width: 100%;
		padding: 0 5vw;
	}
	
	.title-section{
		flex-direction: column;
        gap: 1.5rem;
        align-items: flex-start;
		padding: 0;
	}
	.c-section-content{
		width: 100%;
	}
	
	.banner{
		background-position: left center !important;
	}
	
	.services-carousel-nav{
		flex-direction: column;
	}
	.services-carousel-nav .md\:w-1\/2{
		width: 100%;
		margin-bottom: 1.25rem;
	}
	
	.job-offers{
		flex-direction: column;
	}
	.job-header{
		padding-left: 0;
		padding-right: 0;
		margin-bottom: 3rem;
	}
	.job-card{
		width: 80vw;
	}
	
	.c-collapsible{
		width: 100%;
	}
}


/*** Mobile ***/
@media screen and (max-width: 480px){
	.site-footer .section-container{
		flex-direction: column;
		gap: 2.5rem;
	}
	.footer-phones{
		flex-direction: column;
	}
	.w-1\/2 {
		width: 100%;
	}
	.contact-map{
		max-width: 100%;
	}
	.md\:justify-start{
		justify-content: start;
	}
	.buttons-list{
		justify-content: center;
	}
	.services-carousel-nav .items-end{
		margin-bottom: 3rem;
	}
	.services-carousel-nav .primary-button{
		margin-right: 0;
	}
	.services .services-header{
		padding-bottom: 30px;
	}
	.services .grid-item{
		width: 90vw;
	}
}