* { --__dym: calc(11vw) ; }
.content { height: auto !important ; background: black ; }
._pannel { min-height: 40vh ; overflow: hidden ; }
._pannel_land { padding-top: 17vh ; }
._pannel_service , ._pannel_boutiques { padding-top: 114px ; }
.ltitle {
    font-size: 4.8rem ;
	text-align: center ;
	font-weight: 600 ;
	letter-spacing: -0.29rem ;
}
.ltitle a:before { height: 3px ; bottom: -11px ; }
.ltitle yb-animate ~ yb-animate { margin-top: -0.21em ; }
.ltitle yb-animate ~ yb-animate ~ yb-animate { margin-top: -0.21em ; }
.stitle , #_3dctn yb-animate {
    font-size: 2.3rem ;
}
.stitle yb-animate { height: 0.87em ; text-align: left ; }
yb-animate[data-scroll]:not(.is-inview) > div { transform: scaleY(0) ; }
h1 yb-animate div { font-family: inter ; }
.ldesc { width: 641px ; max-width: 100% ; color: var(--silver) ; text-align: center ; }










/*      _pannel_land        */
._pannel_land { padding-bottom: 21px ; }
._brands , ._partenaires { height: 49px ; background: url(https://youbyke.com/__static/media/brands.png) center / auto 100% no-repeat ; margin-top: 24px ; }







/*      pannel mockup       */
._sectionstick { height: 300vh ; } 
#_pannel_mockup_ctn { height: 100vh ; height: 100dvh ; background: black !important ; }
#_pannel_ctn {
	transition: transform 0.71s ;
}
#_pannel_mockup_ctn.mockup_ready_right #_pannel_ctn { transform: matrix(0.7 , 0 , 0 , 0.7 , 490 , 0) ; }
#_pannel_mockup_ctn.mockup_ready_left #_pannel_ctn { transform: matrix(0.7 , 0 , 0 , 0.7 , -490 , 0) ; }
#_mockup_desc ,
#_mockup_desc_right { max-width: 590px ; opacity: 0 ; transition: opacity 0.71s ; }
#_mockup_desc_right { right: var(--__dym) ; }
#_pannel_mockup_ctn.mockup_ready_right #_mockup_desc { opacity: 1 ; }
#_pannel_mockup_ctn.mockup_ready_left #_mockup_desc_right { opacity: 1 ; }
._screenshot {
    height: 80% ;
    top: 10% ;
    width: 80% ;
    background: url(screen_accueil.webp) center / cover no-repeat ;
	animation: appear 0.71s ;
    z-index: -1 ;

}
#_screen_devis { display: none ; background-image: url(screen_devis.webp) ; }
#_screen_opendevis { display: none ; background-image: url(screen_opendevis.webp) ; }
@keyframes appear {
	0% { opacity: 0 ; }
}











/*		services 		*/
._pannel_service , ._pannel_howitworks , ._pannel_pricing { padding: 4rem 0px 7rem 0px ; }
._slidr , ._slidr_screen { width: calc(100% + var(--__dym) * 2) ; left: calc(var(--__dym) * -1) ; overflow: visible !important ; cursor: grab ; }
._slidr:active , ._slidr_screen:active { cursor: grabbing ; }
._pannel_service ._block {
	height: -webkit-fill-available ;
	margin: 0px 7px ;
	white-space: normal ;
	padding-top: 171px ;
	
}
.swiper-slide { transition: opacity 0.41s , transform 0.41s !important ; }
.swiper-slide:nth-of-type(1) { background: url(../__static/media/_illus/_isometric/euro-1.svg) 2rem 44px / 94px no-repeat ; }
.swiper-slide:nth-of-type(2) { background: url(../__static/media/_illus/_isometric/directions-car-3.svg) 2rem 44px / 94px no-repeat ; }
.swiper-slide:nth-of-type(3) { background: url(../__static/media/_illus/_isometric/shield-social-0.svg) 2rem 44px / 94px no-repeat ; }
.swiper-slide:nth-of-type(4) { background: url(../__static/media/_illus/_isometric/payments-0.svg) 2rem 44px / 94px no-repeat ; }
.swiper-slide:not(.swiper-slide-active) { opacity: 0.4 ; }
.swiper-scrollbar { max-width: 33% ; bottom: -2rem !important ; opacity: 1 !important ; }
._pannel_service .ldesc ,
._pannel_bcmpartenaire .ldesc ,
._pannel_pricing .ldesc { color: var(--black) ; }




/*		howitworks		*/
._slidr_screen img { height: auto ; width: 100% ; max-width: 100% ; aspect-ratio: 1000 / 577 ; border-radius: 14px ; object-fit: cover ; }
._slidr_screen .swiper-scrollbar { background: #474749 !important ; }
._slidr_screen .swiper-scrollbar-drag { background: var(--lgrey) !important ; }










/*		land_pricing		*/
#land_pricing {  }
.float_price {
	height: 81px ;
	width: 81px ;
	border-radius: 0px 0px 0px 21px ;
	line-height: 61px ;
	font-size: 2rem ;
	text-align: center ;
	inset: 0px 0px auto auto ;
	z-index: 1 ;

}
.float_price:after {
    content: '/Mois' ;
    font-size: 1.1rem ;
    line-height: 11px ;
    position: absolute ;
    inset: auto 0px 19px 0px ;

}
#land_pricing ._page { width: 471px ; }
#land_pricing ._page ._label {
    background: url(../__static/media/_icon/checkmark-sharp.svg) 9px 9px / 21px no-repeat var(--lgrey) ;
    padding: 9px 0px 9px 39px ;
    border-bottom: 1px solid var(--border) ;

}
._breadcrumb > div { background: var(--darkcolor) ; color: var(--lgrey) ; }









/*		_pannel_reviews		*/
._pannel_reviews { padding-top: 61px ; padding-bottom: 61px ; min-height: 0px ; }
#review_slider { width: calc(100% - (var(--__dym) * 2)) ; white-space: nowrap ; width: max-content ; }
#review_slider ._block { height: 124px ; width: 411px ; white-space: normal ; background: none ; box-shadow: none ; }
.reviews_ctn:after , .reviews_ctn:before { 
	content: '' ;
	height: 100% ;
	width: 0px ;
	position: absolute ;
	inset: 0px ;
	box-shadow: 0px 0px 41px 61px var(--main) ;
	z-index: 3 ;
}
.reviews_ctn:before { inset: 0px 0px 0px auto ; }










/*		devenir partenaire		*/
._pannel_bcmpartenaire { min-height: 0px ; padding: 4rem 0px 4rem 0px ; }
._pannel_bcmpartenaire a:before { bottom: 0px ; background: var(--black) ; }






/*		footer		*/
._pannel_footer {
	padding: 91px 0px 171px 0px ;


}
._pannel_footer ._flex a { line-height: 39px ; font-family: inter , sans-serif ; }
._footer_flx img { filter: grayscale(1) ; }
._cc { width: calc(100% - (var(--__dym) * 2)) ; line-height: 61px ; bottom: 21px ; border-top: 1px solid #2e2e2f ; }
















@media only screen and (max-width: 1144px) {
	.ltitle { font-size: 4.3rem ; }

	#_pannel_mockup_ctn.mockup_ready_right #_pannel_ctn { transform: matrix(1.41 , 0 , 0 , 1.41 , 170 , 240) ; }
	#_pannel_mockup_ctn.mockup_ready_left #_pannel_ctn { transform: matrix(1.41 , 0 , 0 , 1.41 , -170 , 240) ; }
	#_mockup_desc , #_mockup_desc_right { top: -231px ; max-width: calc(100% - 2 * var(--__dym)) ; }
}
@media only screen and (max-width: 1440px) {
	._3d_section { max-width: 441px ; }
	._3d_section:not(._active) { display: none ; }
}
@media only screen and (max-width: 930px) {
	.ltitle { font-size: 3.3rem ; }

	._clientsave { font-size: 14.1vw ; line-height: 15.4vw ; }

	.review_ctn { width: 100% ; left: 0px ; }
	.review_ctn:after , .review_ctn:before { display: none ; }
	.review_ctn ._block { width: 331px ; }

	._pannel_footer > ._flex { display: block ; }
	._pannel_footer > ._flex > div:not(._footer_flx) { width: 50% ; float: left ; }
	._footer_flx img { margin-top: 31px ; width: 100% ; }
}
@media only screen and (max-width: 770px) {
	.ltitle { font-size: 2.81rem ; letter-spacing: -0.23rem ; }
	img { max-width: 90% ; height: auto ; }


}
@media only screen and (max-width: 540px) { 
	* { --__dym : 21px !important ; } 
	.ltitle { font-size: 2.5rem ; letter-spacing: -0.2rem ; }
	._clientsave { filter: none !important ; }
}
@media only screen and (max-width: 470px) { 
	.ltitle { font-size: 2.1rem ; letter-spacing: -0.1rem ; }
}
@media only screen and (max-width: 410px) { 
	.ltitle { font-size: 1.9rem ; letter-spacing: -0.1rem ; }
}






/*      locomotive scroll       */
html.has-scroll-smooth { overflow: hidden ; }
html.has-scroll-dragging {
	-webkit-user-select: none ;
	-moz-user-select: none ;
	-ms-user-select: none ;
	user-select: none ;
}
.has-scroll-smooth body { overflow: hidden ; }
.has-scroll-smooth [data-scroll-container] { min-height: 100vh ; min-height: 100dvh ; }
[data-scroll-direction="horizontal"] [data-scroll-container] {
	height: 100vh ;
	height: 100dvh ;
	display: inline-block ;
	white-space: nowrap ;
}
[data-scroll-direction="horizontal"] [data-scroll-section] {
	display: inline-block ;
	vertical-align: top ;
	white-space: nowrap ;
	height: 100% ;
}
.c-scrollbar {
	position: absolute ;
	right: 0 ;
	top: 0 ;
	width: 11px ;
	height: 100% ;
	transform-origin: center right ;
	transition: transform 0.3s, opacity 0.3s ;
	opacity: 0 ;
}
.c-scrollbar:hover { transform: scaleX(1.45) ; }
.c-scrollbar:hover, .has-scroll-scrolling .c-scrollbar, .has-scroll-dragging .c-scrollbar { opacity: 1 ; }
[data-scroll-direction="horizontal"] .c-scrollbar {
	width: 100% ;
	height: 10px ;
	top: auto ;
	bottom: 0 ;
	transform: scaleY(1) ;
}
[data-scroll-direction="horizontal"] .c-scrollbar:hover { transform: scaleY(1.3) ; }
.c-scrollbar_thumb {
	position: absolute ;
	top: 0 ;
	right: 0 ;
	background-color: var(--dkgrey) ;
	opacity: 0.5 ;
	width: 7px ;
	border-radius: 10px ;
	margin: 2px ;
	cursor: -webkit-grab ;
	cursor: grab ;
}
.has-scroll-dragging .c-scrollbar_thumb { cursor: -webkit-grabbing ; cursor: grabbing ; }
[data-scroll-direction="horizontal"] .c-scrollbar_thumb {
	right: auto ;
	bottom: 0 ;
}