/*==== GOOGLE FONTS ====*/
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

/*==== CSS VARIABLES ====*/
:root{
	--white-color: #fff;
	--dark-color: #3c3c3c;
	--body-bg-color: #fff;
	--section-bg-color: #e1e1e1;
	--navigation-item-hover-color: #eb6909;
	--orange-color: #eb6909;
	--hover-color: #DC5A00;
	
	--text-shadow: 0 5px 25px rgba(0, 0, 0, 0.1);
	--box-shadow: 0 5px 25px rgb(0 0 0 / 20%);

	--scroll-bar-color: #000;
	--scroll-thumb-color: #3c3c3c;
	--scroll-thumb-hover-color: #212121;
}
/*==== SCROLL TO TOP BUTTON ====*/
.scrollToTop-btn {
	z-index: 99999;
	position: fixed;
	right: 0px;
	bottom: 50px;
	width: 45px;
	height: 45px;
	background: var(--orange-color);
	color: var(--white-color);
	font-size: 2em;
	cursor: pointer;
	opacity: 0;
	transition: 0.5s ease;
	border-radius: 0.25em;
}
.scrollToTop-btn.active {
	right: 50px;
	pointer-events: all;
	opacity: 1;
}
.scrollToTop-btn:hover {
	background: var(--hover-color);
}
.scrollToTop-btn i {
	transition: 0.5s ease;
}
.scrollToTop-btn:hover i {
	transform: translateY(-5px);
}
/*==== SCROLL BAR ====*/
::-webkit-scrollbar {
	width: 11px;
	background: var(--scroll-bar-color);
}
::-webkit-scrollbar-thumb {
	width: 100%;
	background: var(--scroll-thumb-color);
	border-radius: 0.3em;
}
::-webkit-scrollbar-thumb:hover{
	background: var(--scroll-thumb-hover-color);
}

/*==== MAIN CSS ====*/
*{
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	font-family: 'Montserrat', sans-serif;
}
html{
	scroll-behavior: smooth;
}
body{
	background: var(--body-bg-color);
}
.container{
	margin: 0;
}
.row{
	width: 100%;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
}
.card-02 {
	background: #50A7FF;
	position: relative;
	flex: 1;
	max-width: 460px;
	height: 200px;
	margin: 10px;
	border-radius: 5px;	
}
.card-03 {
	background: #FF7675;
	position: relative;
	flex: 1;
	max-width: 940px;
	height: 300px;
	margin: 10px;
	border-radius: 5px;	
}

.flex-center{
	display: flex;
	justify-content: center;
	align-items: center;
}
section {
	position: relative;	
}
.section{
	color: var(--dark-color);
	background: var(--white-color);
	padding: 35px 200px;
	transition: 0.3s ease;
}
h2{
	font-size: 55px;
	font-weight: 600;
	margin-bottom: 30px;
}

/*==== HEADER ====*/
header{
	z-index: 998;
	position: fixed;
	width: 100%;
	height: calc(5rem + 1rem);
	top: 0;
	left: 0;
	display: flex;
	justify-content: center;
	transition: 0.5s ease;
	transition-property: height, background;
}

header.sticky{
	height: calc(2.5rem + 1rem);
	background: rgba(0, 0, 0, 0.7);
	backdrop-filter: blur(20px);
	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

header .nav-bar{
	position: relative;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0 200px;
	transition: 0.3s ease;
}
header ul{
	list-style: none;
	float: right;
}
header ul li{
	display: inline;
	color: #fff;
}
.nav-bar .logo {
	width: 38px;
	height: 33px;
	background-image: url("../images/iq_logo.svg");
}

/* ===== FULL MENU A LAISSER ICI ====*/
.nav-close-btn, .nav-menu-btn{
	display: none;
	
}
.navigation .nav-items a{
	color: var(--white-color);
	font-size: 1em;
	font-weight: 600;
	text-decoration: none;
	text-shadow: var(--text-shadow);
	transition: 0.5s;
}
.nav-items a.active {
	color: var(--navigation-item-hover-color);
}
.nav-items a:hover {
	color: var(--navigation-item-hover-color);
}
.navigation .nav-items a i{
	display: none;
}

.navigation .nav-items a:not(:last-child){
	margin-right: 45px;
}

/*==== HOME ====*/
.home{
	min-height: 100vh;
}
.logo-header{
	width: 300px;
	height: 128px;
	background-image: url("../images/iqanto_logo_header.svg");
}

/*==== BACKGROUND SLIDER ====*/
.bg-slider{
	z-index: 777;
	position: relative;
	width: 100%;
	min-height: 100vh;
	background-color: var(--dark-color);
}
.bg-slider .swiper-slide{
	position: relative;
	width: 100%;
	height: 100vh;
}
.bg-slider .swiper-slide img{
	width: 100%;
	height: 100vh;
	object-fit: cover;
	background-position: center;
	background-size: cover;
	pointer-events: none;
}

.text-content{
	position: absolute;
	top: 22%;
	color: var(--white-color);
	margin: 0 200px;
	transition: 0.3s ease;
	z-index: 778;
}

.text-content .title {
	max-width: 900px;
	font-size: 66px;
	line-height: 66px;
	font-weight: 600;
	margin: 80px 0 70px;
	text-shadow: var(--text-shadow);
	margin-bottom: 20px;
	transform: translateY(0);
	transition: 0.5s ease;
	opacity: 1;
}
.text-content p{
	max-width: 700px;
	background: rgba(255, 255, 255, 0.1);
	backdrop-filter: blur(10px);
	text-shadow: var(--text-shadow);
	margin: 50px 0 0;
	padding: 20px;
	font-size: 18px;
	border-radius: 10px;
	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
	border-right: 1px solid rgba(255, 255, 255, 0.1);
	box-shadow: var(--box-shadow);
	transform: translateX(-18px);
	opacity: 1;
}
/*==== ABOUT US SECTION ====*/
.about-us {
	padding-top: 100px;
	background:#e5e5e5;
}
.about-us .box-title{
	position: relative;
	flex: 1;
	max-width: 700px;
	margin: 200px 10px 0;
	z-index: 900;
}
.about-us p{
	margin: 0 0 20px 45px;
	text-align: justify;
}
.about-us a{


	font-weight: bold;
	color: var(--dark-color);
}
.about-us ul{
	margin: 0 0 20px 40px;
}
.about-us ul li{
	color: var(--orange-color);
	margin: 0 0 10px 20px;
}
.about-us span{
	color: var(--dark-color);
}
.map {
	position: relative;
	flex: 1;
	width: 100%;
	margin: 0;
	z-index: 900;
}

/*==== EXPERTISE SECTION ====*/

.expertise{
	padding-top: 100px;
	background-image:url('../images/iqanto_wave.png'),url('../images/iqanto_q.svg'),linear-gradient(0deg, rgba(229,229,229,1) 0%, rgba(255,255,255,1) 10%, rgba(255,255,255,1) 90%, rgba(229,229,229,1) 100%, rgba(229,229,229,1) 100%);
	background-repeat: no-repeat, no-repeat, no-repeat;
	background-position: top,left center;
}
.expertise .cubes {
	width: 1245px;
	background-image:url('../images/iqanto_expertises_cubes.png');
}
.color-cubes{
	text-align: center;
	transition: 0.5s ease;
	cursor: pointer;
}
.color-cubes:hover{
	font-weight: 800;
}
.color-cubes a{
	padding: 20px 0;
	text-decoration: none;
	color: var(--orange-color);
	font-size: 20px;
}
.cube-title {
	margin: 20px 0;
}
.cube-01 {
	background: url('../images/iqanto_expertises_cube_private_cloud.png');
	height: 360px;
	width: 249px;
	opacity: 0;
	transform: translateY(0);
	transition: 0.5s ease;
	transition-property: transform, opacity;
}
.cube-01:hover, .cube-02:hover, .cube-03:hover, .cube-04:hover, .cube-05:hover {
	opacity: 1;
	transform: translateY(-20px);	
}
.cube-02 {
	background: url('../images/iqanto_expertises_cube_business_solution.png');
	height: 360px;
	width: 249px;
	opacity: 0;
	transform: translateY(0);
	transition: 0.5s ease;
	transition-property: transform, opacity;
}
.cube-03 {
	background: url('../images/iqanto_expertises_cube_itcyber.png');
	height: 360px;
	width: 249px;
	opacity: 0;
	transform: translateY(0);
	transition: 0.5s ease;
	transition-property: transform, opacity;
}
.cube-04 {
	background: url('../images/iqanto_expertises_cube_industrial_solution.png');
	height: 360px;
	width: 249px;
	opacity: 0;
	transform: translateY(0);
	transition: 0.5s ease;
	transition-property: transform, opacity;
}
.cube-05 {
	background: url('../images/iqanto_expertises_cube_industrial_perf.png');
	height: 360px;
	width: 249px;
	opacity: 0;
	transform: translateY(0);
	transition: 0.5s ease;
	transition-property: transform, opacity;
}
.expertise .illustration{
	width: 500px;
	margin: auto;
}
.expertise .box-expertise img{
	width: 100%;
}
.expertise .box-title{
	position: relative;
	flex: 1;
	max-width: 700px;
	margin: 10px;
	border-radius: 5px;
	z-index: 900;
}
.expertise .sub-title{
	color: var(--orange-color);
	font-size: 36px;
	font-weight: 600;
	padding-top:100px;
}
.expertise .baseline{
	color: #3c3c3c;
	font-size: 20px;
	font-weight: 600;
	margin-bottom: 20px;
}
.row-box-title{
	width: 100%;
	display: flex;
	justify-content: left;
	flex-wrap: wrap;

}
.box-expertise{
	position: relative;
	flex: 1;
	max-width: 600px;
	padding: 20px;
}
.box-expertise p{
	margin: 15px 0;
	text-align: justify;
}
.box-partners {
	width: 100%;
}
.logo-partners, .square-logo-partners, .logo-aws, .logo-td, .logo-microsoft, .logo-dell, .logo-hp, .logo-wmware, .logo-azure, .logo-storm, .logo-atempo{
	display: inline-flex;
	margin: 10px 15px 10px 0;
	cursor: pointer;
	filter: saturate(0);
	transition:0.3s ease-out;
}
.logo-aws{
	width: 150px;
	height: 90px;
}

.logo-td{
	width: 109px;
	height: 90px;
}
.logo-microsoft{
	width: 155px;
	height: 36px;
}
.logo-dell{
	width: 150px;
	height: 50px;
}
.logo-hp{
	width: 68px;
	height: 50px;
}
.logo-wmware{
	width: 65px;
	height: 50px;
}
.logo-azure{
	width: 120px;
	height: 50px;
}
.logo-storm{
	width: 90px;
	height: 50px;
}
.logo-atempo{
	width: 80px;
	height: 50px;
}
.logo-partners{
	width: 100px;
	height: 50px;
}
.square-logo-partners{
	width: 60px;
	height: 50px;
}
.logo-partners:hover, .square-logo-partners:hover, .logo-aws:hover, .logo-td:hover, .logo-microsoft:hover, .logo-dell:hover, .logo-hp:hover, .logo-wmware:hover, .logo-azurehover, .logo-storm:hover, .logo-atempo:hover{
	filter: saturate(1);
}
/*==== ACCORDION V2 ====*/

.choose__content, .choose__faq {
	display: grid;
	row-gap: 2rem;
}
.choose__faq-header{
	display: flex;
	align-items: center;
	column-gap: 0.75rem;
	cursor: pointer;
}
.choose__faq-title{
	font-size: 15px;
}
.choose__faq-icon{
	display: inline-flex;
	padding: 5px 8px;
	background: var(--orange-color);
	border-radius: 0.5rem;
	color: var(--white-color);
	font-size: 30px;
	box-shadow: 0 2px 8px hsla(15, 68%, 32%, .4);
	transition: box-shadow .4s;
}
.choose__faq-icon i{
	transition: transform .3s;
}
.choose__faq-content{
	overflow: hidden;
	height: 0;
	transition: height 1s ease;
}
/* Rotate icon */
.faq-open .choose__faq-icon i {
	transform:  rotate(45deg);
}
/* Change color icon */
.faq-open .choose__faq-icon{
	background-color: var(--white-color);
	color: var(--orange-color);
}
.choose__faq-content ul{
	list-style-type: disc;
	margin: 0;
	padding:0 16px;
}
.choose__faq-content li{
	margin: 10px 0;
	font-size: 10px;
	color: var(--dark-color);
}
.choose__faq-content li span{
	font-size:16px;
}
/*==== APPROCHE SECTION ====*/

.approche{
	background-color: #e5e5e5;
	background-image: url('../images/tram_section1.png');
	background-repeat: no-repeat;
	background-position: top left;
}
.approche .box{
	position: relative;
	flex: 1;
	max-width: 800px;
	margin: 100px 10px 10px 500px;
	border-radius: 5px;
	z-index: 900;
}
.approche .virgule{
	position: absolute;
	width: 500px;
	top: -150px;
	left: 200px;
	z-index: 899;
}
.approche p{
	margin: 10px 0 0 35px;
	text-align: justify;
}
.orange-form{
	width: 30px;
	height: 30px;
	margin:53px 0 0 0;
	float: left;
	z-index: 3;
}
.orange-form img{
	width: 100%;
}

.graph{
	margin: 150px 0 0;
}
.mobile-graph{
	display: none;
}
.circle {
	height: 250px;
	width: 250px;
	margin: 10px;
	cursor: pointer;
	transform: translate(0, 0);
	transition: 0.5s ease;
	transition-property: transform, background;
	filter: drop-shadow(0 5px 10px rgb(0 0 0 / 20%));
}
.circle-part1 {
	background: url("../images/iqanto_circle_01.svg");
}
.text-circle-part1, .text-circle-part2, .text-circle-part3, .text-circle-part4{
	opacity: 0;
	transition: 0.5s ease;
}
.circle-part1:hover .text-circle-part1, .circle-part2:hover .text-circle-part2, .circle-part3:hover .text-circle-part3, .circle-part4:hover .text-circle-part4{
	opacity: 1;
}
.box-text-circle-part1, .box-text-circle-part3{
	width: 400px;
	position: absolute;
	right:250px;
	top:50px;
	text-align: right;
}
.box-text-circle-part2, .box-text-circle-part4{
	width: 400px;
	position: absolute;
	left:250px;
	top:50px;
	text-align: left;
}
.title-circle{
	font-size: 26px;
	font-weight: 600;
	margin-bottom: 10px;
}
.circle-part1:hover{
	background: url("../images/iqanto_circle_01_hover.svg");
	transform: translate(-20px, -20px);
}
.circle-part2{
	background: url("../images/iqanto_circle_02.svg");
}
.circle-part2:hover{
	background: url("../images/iqanto_circle_02_hover.svg");
	transform: translate(20px, -20px);
}
.circle-part3{
	background: url("../images/iqanto_circle_03.svg");
}
.circle-part3:hover{
	background: url("../images/iqanto_circle_03_hover.svg");
	transform: translate(-20px, 20px);
}
.circle-part4{
	background: url("../images/iqanto_circle_04.svg");
}
.circle-part4:hover{
	background: url("../images/iqanto_circle_04_hover.svg");
	transform: translate(20px, 20px);
}


/*==== INNOVATION SECTION ====*/

.innovation{
	padding-top: 100px;
	padding-bottom: 50px;
	background-image:url('../images/iqanto_innovation_trame.svg'),linear-gradient(180deg, #e5e5e5, #ffffff);
	background-repeat: no-repeat, no-repeat;
	background-position: top;
}
.innovation .box-title{
	position: relative;
	flex: 1;
	max-width: 700px;
	margin: 10px;
	border-radius: 5px;
	z-index: 900;
}
.innovation .orange-form{
	margin:39px 0 0 0;
}
.innovation h2{
	line-height: 40px;
	padding-left: 40px;
	
}
.innovation h2 span{
	font-size: 35px;
	line-height: 0px;
	font-weight: 600;
}
.innovation .box-title p{
	margin-left: 40px;
	text-align: justify;
}
.ref{
	margin-bottom: 25px;
}
.logo-innovation {
	margin-top:10px;
}
.sub-title-innovation{
	color: var(--orange-color);
	text-transform: uppercase;
	letter-spacing: 4.2px;
	font-size: 28px;
	margin: 50px 0 25px;
}
.box-innovation{
	position: relative;
	flex: 1;
	max-width: 33%;
	padding: 40px;
}
.box-innovation p{
	text-align: justify;
}
/*==== COMPLIANCE ====*/
.compliance{
	padding-top: 100px;
	padding-bottom: 150px;
	text-align: justify;
}
.compliance .box-compliance img{
	width: 100%;
}
.compliance .box-title{
	position: relative;
	flex: 1;
	max-width: 50%;
	margin: 0;
	padding: 0;
	border-radius: 5px;
	z-index: 900;
}
.box-compliance{
	position: relative;
	flex: 1;
	max-width: 50%;
	padding: 10px;
}
.code-conduite {
	width: 100%;
	margin: 90px 0 0 0;
}
.compliance .legende {
	font-size: 12px;
	margin: 15px 0 20px 45px;
}
.compliance p{
	margin: 0 0 20px 45px;
	text-align: justify;
}
.compliance ul{
	margin: 0 0 20px 40px;
}
.compliance ul li{
	color: var(--orange-color);
	margin: 0 0 10px 20px;
}
.compliance span{
	color: var(--dark-color);
}
/*==== FOOTER ====*/

.frise{
	background: url('../images/iqanto_frise.png'),linear-gradient(#fff 149px, #3c3c3c 150px);
	background-repeat: no-repeat;
	background-position: center;
	height: 196px;
	width: 100%;
}
.flex {
  display: flex;
  flex-wrap: wrap;
}
footer{
	background-color: var(--dark-color);
	color: var(--white-color);
	width: 100%;
	padding: 50px 0 20px;
	height: auto;
}
footer li{
	list-style: none;
	display: inline;
}
footer li a{
	text-decoration: none;
	color: #fff;
	transition: 0.3s ease;
}
footer li a:hover{
	color: var(--orange-color);

}
footer .container{
	width: 1120px;
	margin: 0 auto;
}
footer h3{
	margin-bottom: 15px;
	font-weight: 600;
	font-size: 20px;
	text-align: center;
}

.box-compagnies {
	width: 100%;
	margin: 0 auto 50px;
	text-align: center;
}
.box-compagnies a{
	text-decoration: none;
	transition: 0.3s ease;
}
.logo-groupe-snef {
	width: 100px;
	height: 100px;
	margin: 0 auto 30px;

}
.logo-footer {
	width: 100px;
	display: inline-block;
	margin: 0 20px;
	transition: 0.3s ease;
}
.box-compagnies a:hover {
	cursor: pointer;
	opacity:0.6;
}
.box-aboutus{
	width: 100%;
	text-align: justify;
}
.info{
	margin: 20px 0 0;
	text-align: center;
}

.bottom-line{
	border-top: 1px solid #e5e5e5;
	width: 100%;
	margin: 20px 0;
}
.quicklinks{
	margin: 0 auto;
	justify-content: center;
	align-content: center;
	text-align: center;
}
.quicklinks ul li{
	display: inline;
	margin-right: 20px;
}
.copyright {
	background-color: #000;
	color: #fff;
	width: 100%;
	padding: 20px 200px;
}
.copyright .container {
	width: 100%;
	justify-content: space-between;
	align-content: space-between;
}
.copyright .text-copyright{
	text-align: left;
	margin-top: 10px;
	font-size: 14px;
}
.copyright .logo-copyright{
	width: 130px;
	height: 33px;
}