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

html,
* {
	cursor: none;
}

*,
*::before,
*::after {
  box-sizing:border-box;
  -webkit-box-sizing:border-box;
  -moz-box-sizing:border-box;
  -o-box-sizing:border-box;
  -ms-box-sizing:border-box;
  outline: none;
}

html, body {
  font-family: 'Poppins', sans-serif !important;
  font-size:18px;
  color:#ffffff;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  padding:0;
  margin:0;
  background:#fff !important;
}


h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, var,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video, ul, li {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
	list-style:none;
}

article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {
	display:block;
}

h1, h2, h3, h4, h5, h6 {
  line-height:1.5;
  margin:0;
}

h2{
  font-size:150px;
  color:#ffffff;
}

h3{
  font-size:75px;
  color:#ffffff;
}

h4{
  font-size:45px;
  color:#ffffff;
}

article, p {
  font-size:18px;
  color:#ffffff;
  line-height:1.5;
  padding:0;
  margin:0;
}

a {
  color:#ffffff;
  text-decoration:none;
  transition:all .5s ease;
  -webkit-transition:all .5s ease;
  -moz-transition:all .5s ease;
  display: inline-block;
}

a:hover {
  color:#ffffff;
}

img {
  vertical-align:middle;
  border-style:none;
  max-width:100%;
}

.btn{
  font-size:15px;
  color:#ffffff;
  text-transform:uppercase;
  display:inline-block;
  padding:20px 60px;
  background:#ffffff;
}

.clearfix {
  display:inline-block;
}

.clearfix::after {
  visibility:hidden;
  display:block;
  font-size:0;
  content:"";
  clear:both;
  height:0;
}

* html .clearfix {
  height:1%;
}

.clearfix {
  display:block;
}

/*******/

.o-scroll {
	background-color: #d4c9c9;
	overflow: hidden
}

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
}

[data-scroll-direction=horizontal] [data-scroll-container] {
	height: 100vh;
	display: inline-block;
	white-space: nowrap
}

[data-scroll-direction=horizontal] [data-scroll-section] {
	display: inline-block;
	vertical-align: top;
	white-space: nowrap;
	height: 100%
}
.cursor {position: fixed; width: 30px; height: 30px; border-radius: 50%; background-color: #ffffff; pointer-events: none; mix-blend-mode: difference; z-index: 999999; transition: transform 0.2s;}

header, footer, .dl-sections{float:left;width:100%;}
.dl-sections{padding:100px 0 0 0;}

.container {
  max-width: 1440px;
}

.top-nav{position: fixed; width: 100%; z-index: 11; transition: all .5s ease;}
.top-nav .header-block{display: flex; padding: 15px 0; justify-content: space-between; align-items: center;  transition: all .5s ease;}
.top-nav .header-block .logo{width: 269px; transition: all .5s ease;}
.top-nav .header-block .rightside{display: flex; align-items: center;}
.top-nav .header-block .rightside .demo-link{background: #04143c; font-size: 12px; font-weight: 500; color: #fff; border:none; border-radius: 25px; line-height: 38px; text-transform: uppercase; padding: 0 20px; text-decoration: none; letter-spacing: 1.5px}
.top-nav .header-block .rightside .mail{text-decoration: none; letter-spacing: 1.5px; font-size: 16px; font-weight: 500; color: #04143c; margin-right: 30px}
header.fixed .top-nav{background: #fff; -webkit-box-shadow: 0px 0px 27px 0px rgba(23,23,23,0.1); -moz-box-shadow: 0px 0px 27px 0px rgba(23,23,23,0.1); box-shadow: 0px 0px 27px 0px rgba(23,23,23,0.1); transition: all .5s ease;}
header.fixed .top-nav .header-block{padding: 10px 0; transition: all .5s ease;}
header.fixed .top-nav .header-block .logo{width: 200px; transition: all .5s ease;}


.btn-blue{background: #04143c; border:#04143c 1px solid; font-size: 18px; color: #fff; letter-spacing: 1px; text-transform: uppercase; padding: 15px 45px; border-radius: 30px; text-decoration: none;}
.btn-blue:hover{text-decoration: none; background: transparent; color: #04143c}

.btn-blue-border{background: transparent; border:#04143c 1px solid; font-size: 18px; color: #04143c; letter-spacing: 1px; text-transform: uppercase; padding: 15px 45px; border-radius: 30px; text-decoration: none;}
.btn-blue-border:hover{text-decoration: none; background: #04143c; color: #fff}

.hero-banner { padding: 150px 0 0 0; overflow: hidden; position: relative;}
.hero-banner::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 700px; background: linear-gradient(0deg, #fff 0%, #28b1ff1f 100% 100%); z-index:1; }
.hero-banner-top .inner-flex { display: flex; justify-content: space-between;  gap: 30px; align-items: center; position: relative; z-index: 2;}
.hero-banner-top .inner-flex .content  { max-width: 668px;}
.hero-banner-top .inner-flex .content h1 { font-size: 52px; line-height: 62px; font-weight: bold; color:#05153D; margin-bottom: 30px;}
.hero-banner-top .inner-flex .content p { font-size: 16px; line-height: 24px; color: #434343; margin-bottom: 30px; font-weight: 400;} 
.hero-banner-top .inner-flex .content .form-area { background: #fff;  position: relative; border: 1px solid #E5EAF4; border-radius: 33px; padding: 15px 24px; margin-right: 20%; }
.hero-banner-top .inner-flex .content .form-area .form-control { border: none; background: #fff; color: #6B88B0; font-size: 16px; line-height: 30px; font-weight: 500; padding: 0; border-radius: 33px; height: auto;}
.hero-banner-top .inner-flex .content  .form-area .form-control:focus { box-shadow: none; }
.hero-banner-top .inner-flex .content  .form-area .btn-go {background: #05153d;  position: absolute; top: 4px; right: 5px; font-size: 16px; line-height: 22px; font-weight: 600; color: #fff; padding: 15px 30px; border: none; border-radius: 25px; }
.hero-banner-top .inner-flex .photo-area { position: relative; width: 570px; height: 600px;}
.hero-banner-top .inner-flex .photo-area img { position: relative; z-index: 1; border-radius: 0 0  300px 300px; width: 100%; height: 100%;}
.hero-banner-top .inner-flex .photo-area::after {content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background:url(../images/ats/banner-bg.png) no-repeat center center; background-size: cover; z-index: 0; }

.hero-banner-bottom { padding: 100px 0; position: relative; }
.hero-banner-bottom .photo-area { position: relative;}
.hero-banner-bottom .photo-area::after {  content: "";  position: absolute; top: 102px; left: 0; width: 100%; height: 500px; background: url(../images/ats/chart-bg.png) no-repeat center center; background-size: 100% 100%;   z-index: 1; }
.hero-banner-bottom .photo-area .main-screen { width: 100%; border: 2px solid #D9D9D9; border-radius: 10px; position: relative; z-index: 2;} 
.hero-banner-bottom .photo-area .main-screen img { width: 100%; height: 100%; border-radius: 6px; }
.hero-banner-bottom .photo-area .main-screen .chart-vector { position: absolute; border-radius: 50%; }
.hero-banner-bottom .photo-area .main-screen .chart-vector { position: absolute; border-radius: 50%; }
.hero-banner-bottom .photo-area .main-screen .chart-vector:nth-child(2) {top: 110px; right: -26px; animation: complexFloat1 6s ease-in-out infinite; }
.hero-banner-bottom .photo-area .main-screen .chart-vector:nth-child(3) { bottom: 130px; left: -29px; animation: complexFloat2 7s ease-in-out infinite; }
.hero-banner-bottom .photo-area .main-screen .chart-vector:nth-child(4) { bottom: -41px; right: 300px; animation: complexFloat3 8s ease-in-out infinite; }
@keyframes complexFloat1 {0%  { transform: translate(0, 0) scale(1); } 25%  { transform: translate(10px, -15px) scale(1.05); } 50%  { transform: translate(-10px, 10px) scale(1); } 75%  { transform: translate(5px, -10px) scale(0.95); } 100% { transform: translate(0, 0) scale(1); } }
@keyframes complexFloat2 {0%   { transform: translate(0, 0) scale(1); } 25%  { transform: translate(-15px, 10px) scale(0.95); } 50%  { transform: translate(10px, -10px) scale(1.05); } 75%  { transform: translate(-5px, 15px) scale(1); } 100% { transform: translate(0, 0) scale(1); } }
@keyframes complexFloat3 {0%   { transform: translate(0, 0) scale(1); } 25%  { transform: translate(15px, 15px) scale(1.05); } 50%  { transform: translate(-15px, -10px) scale(0.95); } 75%  { transform: translate(10px, 10px) scale(1); } 100% { transform: translate(0, 0) scale(1); } }

h2 { font-size: 40px; line-height:100%; font-weight: 700; color: #05153D; margin-bottom: 15px; }

.chart-report { background: #EEF6FF; padding: 100px 0; }
.chart-report .inner-flex .leftside{ max-width: 45%;}
.chart-report .inner-flex .rightside{ max-width: 48%;}
.chart-report .inner-flex { display: flex; gap: 100px; }
.chart-report .inner-flex .content p { font-weight: 400; font-size: 16px; line-height: 24px; letter-spacing: 0%;  color: #434343; margin-bottom: 40px;}
.chart-report .inner-flex .content h4 {font-weight: 600; font-size: 24px; line-height: 30px; color: #05153D; margin-bottom: 20px; }
.chart-report .inner-flex .content ul {     margin: 0 -5px; padding: 0px; display: flex; flex-wrap: wrap; list-style: none;}
.chart-report .inner-flex .content ul li { width: 50%; padding: 0 5px; margin-bottom: 10px; }
.chart-report .inner-flex .content ul li .gray-block { background: #FFF; border-radius: 30px; padding: 13px 13px 13px 60px; font-size: 18px; line-height: 26px; font-weight: 500; color: #434343; position: relative; }
.chart-report .inner-flex .content ul li .gray-block::before { content: ''; background: url(../images/ats/yes-icon.png) no-repeat center center;width: 24px; height: 24px; position: absolute; top: 13px; left: 16px; }
.chart-report .inner-flex .chart-report-row { display: flex; flex-direction: column; gap: 50px;}
.chart-report .inner-flex .chart-report-row .chart-report-col { display: flex; gap: 25px;  transition: transform 0.4s ease, box-shadow 0.4s ease;}
.chart-report .inner-flex .chart-report-row .chart-report-col .icon-area { min-width: 80px; padding: 20px; height: 80px; background-color: #FFFFFF; box-shadow: 0px 4px 9px 0px #0000000D;  transition: background-color 0.4s ease, transform 0.4s ease;}
.chart-report .inner-flex .chart-report-row .chart-report-col .icon-area svg { width: 100%; height: 100%; transition: transform 0.4s ease; }
.chart-report .inner-flex .chart-report-row .chart-report-col .content h4 { font-weight: 600; font-size: 24px; line-height: 100%; color: #05153D; margin-bottom: 8px; }
.chart-report .inner-flex .chart-report-row .chart-report-col .content p { font-weight: 400; font-size: 16px; line-height: 24px; letter-spacing: 0%;  color: #434343; margin-bottom: 0px;}
.chart-report .inner-flex .chart-report-row .chart-report-col .content .btn-go { background: linear-gradient(0deg, #05153D 0%, #3C5BA7 50%); font-size: 14px; font-weight: 400; color: #fff; transition: all .5s ease; border: none; padding: 15px 20px; border-radius: 6px; line-height: 18px; text-transform: uppercase; text-decoration: none; letter-spacing: 4%; }
.chart-report .inner-flex .chart-report-row .chart-report-col:hover .icon-area { background: #05153D}
.chart-report .inner-flex .chart-report-row .chart-report-col:hover .icon-area svg { transform: rotate(360deg);  }
.chart-report .inner-flex .chart-report-row .chart-report-col .icon-area svg path { transition: stroke 0.4s ease; }
.chart-report .inner-flex .chart-report-row .chart-report-col:hover .icon-area svg path { stroke: #ffffff;}

.our-features { padding: 100px 0; }
.our-features .our-features-heading  { margin-bottom: 30px;}
.our-features .our-features-heading h2 { text-align: center; }
.our-features .our-features-heading p { font-weight: 400; font-size: 16px; line-height: 24px; text-align: center; color: #434343; margin: 0; }
.tab-content-block .tab-content { display: none; }
.tab-content-block .tab-content.tab-content-active { display: block; animation-name: fadeIn; animation-duration: 1s; }
.our-features .our-features-tabs ul { display: flex; gap: 0px; list-style: none; padding: 0; justify-content: space-between; margin: 0; padding: 10px 36px; border: 1px solid #E5EAF4; border-radius: 6px; box-shadow: 0px 4px 9px 0px #0000000D;  }
.our-features .our-features-tabs ul li{width: 25%;}
.our-features .our-features-tabs ul li a { padding: 8px 20px 8px 20px; display: flex; font-weight: 400; font-size: 24px; line-height: 30px; text-align: center; color: #05153D; position: relative; opacity: 50%; gap: 10px;   text-decoration: none; justify-content: center;}
.our-features .our-features-tabs ul li a.our-features-tab-active::before {content: ''; position: absolute; bottom: -14px; left: 0px; width: 100%; height: 6px; border-radius: 6px 6px 0 0; background: #05153d; transition: all .5s ease; -webkit-transition: all .5s ease; -moz-transition: all .5s ease;  }
.our-features .our-features-tabs ul li:last-child a.our-features-tab-active::before {bottom: -10px; }
.our-features .our-features-tabs ul li a.our-features-tab-active { opacity: 100%;} 
.our-features .tab-content .our-features-content {display: flex;  align-items: center;  margin-top: 50px;}
.our-features .tab-content .our-features-content .our-features-card { width: 26%; background-color: #EEF6FF; padding: 40px 20px; border-radius: 12px; position: relative; }
.our-features .tab-content .our-features-content .our-features-block { width: 74%; padding-left: 80px; }
.our-features .tab-content .our-features-content .our-features-card::after { content: ''; position: absolute; bottom:  0; right: 0; width: 137px; height: 127px; background: url(../images/ats/jobs-made-easy-bg.png) no-repeat center center; background-size: contain; z-index: 0; }
.our-features .tab-content .our-features-content .our-features-card h3 { font-weight: 600; font-size: 24px; line-height: 30px; letter-spacing: 0px; margin-bottom: 25px; color: #05153D ; text-align: center;}
.our-features .tab-content .our-features-content .our-features-card p { font-weight: 400; font-size: 16px; line-height: 24px; letter-spacing: 0px; text-align: center; color: #434343; margin-bottom: 30px; }
.our-features .tab-content .our-features-content .our-features-card a {border: 1px solid #05153d; transition: all 0.3s ease-in-out; font-size: 14px; font-weight: 400; color: #05153d; padding: 12px 22px; border-radius: 6px; line-height: 16px; width: fit-content; display: block;margin: auto; text-decoration: none;}
.our-features .tab-content .our-features-content ul { margin: 0; list-style: none; padding: 0; }
.our-features .tab-content .our-features-content ul li {font-size: 16px; line-height: 24px; color: #434343; font-weight: 400; margin-bottom: 20px; position: relative;     padding-left: 30px;} 
.our-features .tab-content .our-features-content ul li::after { content: ''; position: absolute; left: 0; width: 18px; height: 16px; top: 3px; background: url(../images/ats/our-features-icon.png) no-repeat center center; background-size: contain; z-index: 0; }
.our-features .tab-content .our-features-content ul li strong { display: block; font-weight: 700; margin-bottom: 2px; color: #05153D; }
.our-features .tab-content .our-features-content ul li:last-child { margin-bottom: 0px; }
@keyframes fadeIn { from { opacity: 0; } to {  opacity: 1; } }

.our-features .tab-content .our-features-content .our-features-card a:hover { background: #05153d; border: 1px solid #05153D; color: #fff;}

.application-tracking {padding: 100px 0; background-color: #EEF6FF; position: relative;}
.application-tracking::after { content: ''; position: absolute; top: 20px; left: 0; width: 347px; height: 350px; background: url(../images/ats/application-tracking-bg.png) no-repeat center center; background-size: 100% 100%; z-index: 1; animation-name: bounce; -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; -webkit-animation-duration: 5s; animation-duration: 5s; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; }
.application-tracking .application-tracking-heading { max-width: 1000px; margin: auto; padding-bottom: 40px;}
.application-tracking .application-tracking-heading h2 { text-align: center; }
.application-tracking .application-tracking-heading p { font-weight: 400; font-size: 16px; line-height: 24px; text-align: center; color: #555555; margin: 0; }
.application-tracking .application-tracking-grid {display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px;}
.application-tracking .application-tracking-grid .application-tracking-col { background-color: #fff;  position: relative; z-index: 111;  overflow: hidden; padding: 20px 26px; border-radius: 20px; border-bottom: 3px solid #28B1FF;   transition: transform 0.4s ease, box-shadow 0.4s ease, border 0.4s ease;}
.application-tracking .application-tracking-grid .application-tracking-col h4 { font-weight: 600; font-size: 22px; line-height: 24px; transition: color 0.4s ease; letter-spacing: 0px; margin-bottom: 12px; color: #05153D ; text-align: center;}
.application-tracking .application-tracking-grid .application-tracking-col p { font-weight: 400; font-size: 16px; line-height: 24px;   transition: color 0.4s ease; letter-spacing: 0px; text-align: center;  color: #555555; margin-bottom: 0; }
.application-tracking .application-tracking-btn a { border-radius: 6px; background: transparent; transition: all 0.3s ease-in-out; color: #05153d; font-size: 14px; padding: 12px 22px; text-align: center; font-weight: 400; line-height: 16px; letter-spacing: 0px; border: 1px solid #05153d; width: fit-content; display: block; margin: 30px auto auto;  text-decoration: none;}
.application-tracking .application-tracking-btn a:hover { background: #05153d; border: 1px solid #05153D; color: #fff;}
.application-tracking .application-tracking-grid .application-tracking-col::before { content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 0%; background: #05153D; z-index: -1; transition: height 0.5s ease; }
.application-tracking .application-tracking-grid .application-tracking-col:hover::before { height: 100%; }
.application-tracking .application-tracking-grid .application-tracking-col:hover { transform: translateY(-8px) scale(1.02); box-shadow: 0 15px 30px rgba(0, 0, 0, 0.15); border-bottom: 3px solid #05153D; }
.application-tracking .application-tracking-grid .application-tracking-col:hover h4 { color: #FFFFFF;}
.application-tracking .application-tracking-grid .application-tracking-col:hover p { color: #FFFFFF;}

.whatsapp-integration { padding: 100px 0; }
.whatsapp-integration .inner-flex { display: flex;  }
.whatsapp-integration .inner-flex .left-area { max-width: 50%; padding-right: 60px; }
.whatsapp-integration .inner-flex .right-area { max-width: 50%; }
.whatsapp-integration .whatsapp-integration-heading h2{margin: 0 0 25px 0;}
.whatsapp-integration .whatsapp-integration-heading p {font-weight: 400; font-size: 18px; line-height: 26px; color: #333333; margin: 0 0 15px 0;}
.whatsapp-integration .whatsapp-integration-heading span { font-weight: 400; font-size: 16px; line-height: 24px; color: #555555; display: inline-block; }
.whatsapp-integration .whatsapp-integration-row { display: flex; flex-direction: column; gap: 18px;}
.whatsapp-integration .whatsapp-integration-row .whatsapp-integration-col { 	transition: all 0.5s ease-in-out; background-color: #EEF6FF; border-radius: 10px; display: flex; gap: 30px; padding: 15px 20px; align-items: center;  transition: transform 0.4s ease, box-shadow 0.4s ease, background-color 0.4s ease; position: relative;}
.whatsapp-integration .whatsapp-integration-row .whatsapp-integration-col .text h4 { font-weight: 600; font-size: 24px; line-height: 28px; color: #05153D; margin-bottom: 10px;}
.whatsapp-integration .whatsapp-integration-row .whatsapp-integration-col .text p {  font-weight: 400; font-size: 16px; line-height: 24px; color: #434343; margin: 0;} 
.whatsapp-integration .whatsapp-integration-row .whatsapp-integration-col .whatsapp-integration-img { min-width: 120px; height: 120px ;     background: #05153dd4; border-radius: 10px;   transition: all 0.5s ease-in-out; display: flex; align-items: center; justify-content: center; position: relative; }
/* .whatsapp-integration-row .whatsapp-integration-col .whatsapp-integration-img::after { content: ""; width: 100%; height: 100%; background: url(../images/whatsapp-bg.png) center center no-repeat; background-size: 100% 100% !important; position: absolute; left: 0; top: 0; z-index: 1;   transition: opacity 0.4s ease; } */
.whatsapp-integration.whatsapp-integration .whatsapp-integration-row .whatsapp-integration-col .whatsapp-integration-img img { width: 65px; height: 65px; object-fit: contain; z-index: 111; position: relative;   transition: transform 0.4s ease;}
.whatsapp-integration .whatsapp-integration-row .whatsapp-integration-col:before { position: absolute; content: ''; left: 0px; top: 0px; border-radius: 6px; right: 0px; bottom: 0px; background-color: #28B1FF; transition: -webkit-transform 0.4s ease; transition: transform 0.4s ease; transition: transform 0.4s ease, -webkit-transform 0.4s ease; -webkit-transform: scale(0, 1); -ms-transform: scale(0, 1); transform: scale(0, 1); -webkit-transform-origin: right center; -ms-transform-origin: right center; transform-origin: right center; }
.whatsapp-integration .whatsapp-integration-row .whatsapp-integration-col .text {position: relative; z-index: 111;}
.whatsapp-integration .whatsapp-integration-row .whatsapp-integration-col:hover .text h4 { color: #FFFFFF;}
.whatsapp-integration .whatsapp-integration-row .whatsapp-integration-col:hover .text p { color: #FFFFFF;}
.whatsapp-integration .whatsapp-integration-row .whatsapp-integration-col:hover:before {-webkit-transform: scale(1, 1); -ms-transform: scale(1, 1); transform: scale(1, 1); -webkit-transform-origin: left center; -ms-transform-origin: left center; transform-origin: left center; }
.whatsapp-integration .whatsapp-integration-row .whatsapp-integration-col:hover .whatsapp-integration-img  { -webkit-transform: scale(-1) rotate(180deg); -moz-transform: scale(-1) rotate(180deg); -ms-transform: scale(-1) rotate(180deg); -o-transform: scale(-1) rotate(180deg); transform: scale(-1) rotate(180deg); }
.whatsapp-integration .whatsapp-integration-row .whatsapp-integration-col:hover .whatsapp-integration-img { background-color: #000;}
@keyframes bounce {
  0%,
  20%,
  53%,
  80%,
  100% { -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
  40%,
  43% {-webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); -webkit-transform: translate3d(0, -40px, 0); transform: translate3d(0, -30px, 0); }
  70% {-webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);  -webkit-transform: translate3d(0, -20px, 0);  transform: translate3d(0, -15px, 0); }
  90% { -webkit-transform: translate3d(0, -4px, 0); transform: translate3d(0, -4px, 0); }
}


.al-based-job-suggestion { padding-bottom: 100px; }
.al-based-job-suggestion .inner-felx { display: flex;}
.al-based-job-suggestion .inner-felx .left-area {width: 50%; min-height: 250px; padding-right: 100px;}
.al-based-job-suggestion .inner-felx .right-area { max-width: 50%; padding: 150px 0 150px 80px;}
.al-based-job-suggestion .inner-felx .left-area .photo-area  { width: 100%; height: 100%; position: relative; overflow: hidden;}
.al-based-job-suggestion .inner-felx .left-area .photo-area img {width: 100%; height: 100%; position: absolute; top: 0; bottom: 0; left: 0; right: 0; object-fit: cover; }
.al-based-job-suggestion .inner-felx .right-area  {padding: 150px 0;}
.al-based-job-suggestion .inner-felx .right-area .al-based-content { display: flex; flex-direction: column; gap: 30px;}
.al-based-job-suggestion .inner-felx .right-area .al-based-content .al-based-col { padding: 24px 120px 24px 40px;  border-radius: 10px; 	transition: all 0.5s ease-in-out; border-left: 3px solid transparent;}
.al-based-job-suggestion .inner-felx .right-area .al-based-content .al-based-col.active {background-color: #EEF6FF;  border-left: 3px solid #05153D; }
.al-based-job-suggestion .inner-felx .right-area .al-based-content .al-based-col:hover {background-color: #EEF6FF;  border-left: 3px solid #05153D; }
.al-based-job-suggestion .inner-felx .right-area h2 { margin-bottom: 50px;}
.al-based-job-suggestion .inner-felx .right-area .al-based-content .al-based-col h4 { font-weight: 600; font-size: 24px; line-height: 100%; letter-spacing: 5%; margin-bottom: 11px; color: #05153D;}
.al-based-job-suggestion .inner-felx .right-area .al-based-content .al-based-col p {    color: #434343; font-weight: 400; font-size: 16px;  margin: 0; line-height: 24px; } 


footer { background-color: #EEF6FF;}
.footer-area { padding: 45px 0 0;}
.footer-area .footer-heading {padding: 83px 0;}
.footer-area .footer-heading h2 {font-family: "Inter", sans-serif; text-align: center; position: relative; margin: 0; z-index: 11; font-weight: 900;}
.footer-area .footer-heading h2.touch-text::before { content: "Get in touch"; position: absolute; text-transform: uppercase; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 135px; font-weight: 900; color: #ddebf9; white-space: nowrap; letter-spacing: 2px; z-index: -1; text-transform: uppercase; }
.footer-area .inner-flex { display: flex; align-items: center;}
.footer-area .inner-flex .leftside {width: 50%; padding-right: 100px;}
.footer-area .inner-flex .right-form {width: 50%;}
.footer-area .inner-flex .leftside .info { margin: 0 0 35px 0; padding-left: 80px; position: relative; font-size: 16px; line-height: 24px; color: #727988; font-weight: 400;}
.footer-area .inner-flex .leftside .info:last-child { margin: 0;}
.footer-area .inner-flex .leftside .icon { width: 60px; height: 60px; border-radius: 50%; position: absolute; top: 50%; left: 0px; display: flex; background: #FFf; justify-content: center; align-items: center; margin-top: -30px; }
.footer-area .inner-flex .leftside .info span {display: block; font-size: 14px; font-weight: 700; color: #05153D; text-transform: uppercase; margin-bottom: 2px;}
.footer-area .inner-flex .leftside .info a { color: #727988; text-decoration: none;    word-wrap: break-word; }
.footer-area .inner-flex .leftside .info .icon img { width: 28px; height: 28px; object-fit: contain; }
.footer-area .inner-flex .right-form  h3 {  font-weight: 600; font-size: 32px; line-height: 100%; color: #05153D; text-transform: capitalize; margin-bottom: 20px;}
.footer-area .inner-flex .right-form .cols-10 { padding: 0 7px; margin-bottom: 14px;}
.footer-area .inner-flex .right-form .cols-10:last-child {margin: 0;}
.footer-area .inner-flex .right-form .row-10 { margin: 0 -10px; }
.footer-area .inner-flex .right-form .form-control {font-family: "Inter", sans-serif; border: 0; border-radius: 10px; background: #FFFFFF; padding: 12px 15px; color: #05153D;  font-weight: 400; font-size: 16px; line-height: 26px; height: auto;}
.footer-area .inner-flex .right-form .form-control::placeholder { color: #727988;}
.footer-area .inner-flex .right-form .form-control:focus{box-shadow: none;}
.footer-area .inner-flex .right-form .btn-submit{     padding: 12px 22px; background: transparent; transition: all 0.3s ease-in-out; border: 1px solid #05153D; margin-top: 5px; border-radius: 10px; color: #05153D; font-weight: 400; font-size: 14px; line-height: 16px; letter-spacing: 0px; text-align: center; }
.footer-area .inner-flex .right-form .btn-submit:hover { background: #05153D; border: 1px solid #05153D; color: #fff;}
.footer-area .copyright { font-weight: 500; font-size: 16px; line-height: 100%; color: #434343; padding: 20px 0; border-top: 1px solid #777777; text-align: center; margin-top: 45px;}
.footer-area .copyright a { color: #434343;}

/* .footer-area  */

@media (max-width:1460px) {

    .container {padding: 0 40px;}
    .hero-banner-top .inner-flex .photo-area { width: 520px; height: 544px; }
    .hero-banner-top .inner-flex .content h1 { font-size: 70px; line-height: 80px; margin-bottom: 20px;}
} 

@media (max-width:1200px) {

    .hero-banner-top .inner-flex .photo-area { width: 420px; height: 444px; }
    .hero-banner-top .inner-flex .content h1 { font-size: 60px; line-height: 70px; margin-bottom: 20px;}
}

@media(max-width:1024px){
     
    h2 {font-size: 26px; line-height: 30px;}
   
    .container {padding: 0 20px;}
    .top-nav .header-block .logo {width: 200px;}
  .top-nav .header-block .rightside .mail{font-size: 12px; margin-right: 20px;}

    .hero-banner-top .inner-flex .photo-area { width: 320px; height: 336px;}
    .hero-banner-top .inner-flex .content h1 { font-size: 40px; line-height: 50px; margin-bottom: 10px;}
    .hero-banner-top .inner-flex .content p { font-size: 16px; line-height: 22px;  margin-bottom: 20px; }
    .hero-banner-top .inner-flex .content .form-area {padding: 10px 16px; margin-right: 0;}
    .hero-banner-top .inner-flex .content .form-area .btn-go { top: 3px; right: 3px; font-size: 14px; line-height: 16px; padding: 14px 20px; }
    .hero-banner-top .inner-flex { gap: 20px; }
    .hero-banner { padding: 120px 0 0 0; }

    .hero-banner-bottom { padding: 40px 0;}
    .hero-banner::before { height: 400px;}
    .hero-banner-bottom .photo-area .main-screen {  height: 350px;  }
    .hero-banner-bottom .photo-area .main-screen .chart-vector img { width: 35px; }
    .hero-banner-bottom .photo-area .main-screen .chart-vector:nth-child(4) { bottom: -13px; right: 200px; }
    .hero-banner-bottom .photo-area .main-screen .chart-vector:nth-child(2) { right: 8px;}
    .hero-banner-bottom .photo-area .main-screen .chart-vector:nth-child(3) { bottom: 130px; left: 9px; }
    .hero-banner-bottom .photo-area::after {display: none;}
    
    .chart-report { padding: 40px 0;}
    .chart-report .inner-flex {gap: 20px; flex-direction: column;}
    .chart-report .inner-flex .leftside { max-width: 100%;}
    .chart-report .inner-flex .rightside  { max-width: 100%;}
    .chart-report .inner-flex .content ul li .gray-block { font-size: 16px; line-height: 24px; }
    .chart-report .inner-flex .chart-report-row { gap: 20px; }
    .chart-report .inner-flex .chart-report-row .chart-report-col{align-items: center;}
    .chart-report .inner-flex .chart-report-row .chart-report-col .content h4 { font-size: 20px; }
    .chart-report .inner-flex .chart-report-row .chart-report-col .content p { font-size: 14px; line-height: 20px; }
    .chart-report .inner-flex .content p { font-size: 14px; line-height: 20px; margin-bottom: 25px;} 
    .chart-report .inner-flex .content h4 {font-size: 22px; line-height: 26px; margin-bottom: 14px; }
    .chart-report .inner-flex .chart-report-row .chart-report-col .icon-area {min-width: 70px; padding: 16px; height: 70px;}

    .our-features { padding: 40px 0;}
    .our-features .our-features-heading {margin-bottom: 20px;}
    .our-features .our-features-heading p{font-size: 14px; line-height: 21px;}
    .our-features .our-features-tabs ul li a { padding: 4px 8px 4px 8px; font-size: 18px; line-height: 30px; gap: 8px; }
    .our-features .our-features-tabs ul { padding: 7px 26px; gap: 15px;}
    .our-features .our-features-tabs ul li {width: auto;}
    .our-features .our-features-tabs ul li a.our-features-tab-active::before {    bottom: -11px; }
    .our-features .tab-content .our-features-content .our-features-block{ padding-left: 60px;}
    .our-features .tab-content .our-features-content{align-items: start; margin-top: 20px;}
    
    .application-tracking { padding: 40px 0 ;}
    .application-tracking::after { width: 250px; height: 250px;}
    .application-tracking .application-tracking-heading{padding-bottom: 20px;}
    .application-tracking .application-tracking-heading p{font-size: 14px; line-height: 21px;}
    .application-tracking .application-tracking-grid .application-tracking-col {padding: 16px 12px; }
    .application-tracking .application-tracking-grid .application-tracking-col h4 {font-size: 16px; line-height: 20px; margin-bottom: 4px;}
    .application-tracking .application-tracking-grid { gap: 22px;}
    .application-tracking .application-tracking-grid .application-tracking-col p {font-size: 13px; line-height: 18px;}

    .whatsapp-integration {padding: 40px 0; }
    .whatsapp-integration .whatsapp-integration-heading h2{margin: 0 0 15px 0;}
    .whatsapp-integration .whatsapp-integration-row .whatsapp-integration-col .whatsapp-integration-img {min-width: 110px; height: 100px;}
    .whatsapp-integration.whatsapp-integration .whatsapp-integration-row .whatsapp-integration-col .whatsapp-integration-img img { width: 55px; height: 55px;}
    .whatsapp-integration .whatsapp-integration-row .whatsapp-integration-col .text h4 {font-size: 18px; line-height: 21px; margin: 0 0 5px 0;}
    .whatsapp-integration .whatsapp-integration-heading p {    font-size: 20px; line-height: 26px; }
    .whatsapp-integration .whatsapp-integration-heading span{font-size: 13px; line-height: 21px;}

    .al-based-job-suggestion .inner-felx .right-area {padding: 0px;}
    .al-based-job-suggestion .inner-felx .right-area h2 {margin-bottom: 15px;}
    .al-based-job-suggestion .inner-felx .right-area .al-based-content{gap: 20px;}
    .al-based-job-suggestion .inner-felx .right-area .al-based-content .al-based-col h4 { font-size: 18px; margin-bottom: 8px;}
    .al-based-job-suggestion .inner-felx .right-area .al-based-content .al-based-col p {font-size: 12px; line-height: 20px;}
    .al-based-job-suggestion .inner-felx .right-area .al-based-content .al-based-col{ padding: 14px 80px 14px 30px;}

    .al-based-job-suggestion { padding-bottom: 40px; }
    .footer-area{padding: 0;}
    .footer-area .footer-heading h2.touch-text::before {font-size: 60px;}
    .footer-area .footer-heading {padding: 25px 0;}
    .footer-area .inner-flex{align-items: start;}
    .footer-area .inner-flex .right-form{padding-left: 30px;}
    .footer-area .inner-flex .right-form h3{font-size: 22px;}
}


@media(max-width:991px) {
    .our-features .our-features-heading { margin-bottom: 30px;}
    .our-features .our-features-tabs ul { padding: 7px 12px; gap: 11px;}
    .our-features .our-features-tabs ul li a.our-features-tab-active::before {bottom: -7px; height: 4px;}
    .our-features .our-features-tabs ul li a svg { width: 25px; height: 25px ; object-fit: contain;}
    .our-features .our-features-tabs ul li a {font-size: 14px; line-height: normal; gap: 8px; align-items: center;}
    .our-features .tab-content .our-features-content {margin-top: 30px;}
    .our-features .tab-content .our-features-content .our-features-block {padding-left: 30px;}
    .our-features .tab-content .our-features-content .our-features-block { width: 65%;}
    .our-features .tab-content .our-features-content .our-features-card  {width: 35%;}
    .our-features .tab-content .our-features-content ul li {font-size: 13px; line-height: 20px; margin-bottom: 10px;}
    .our-features .tab-content .our-features-content .our-features-card h3 {font-size: 18px; line-height: 24px; margin-bottom: 10px;}
    .our-features .tab-content .our-features-content .our-features-card p {font-size: 13px; line-height: 20px; margin-bottom: 10px;}

    .application-tracking::after { width: 150px; height: 150px; }
    .application-tracking .application-tracking-grid {gap: 14px;}
    .al-based-job-suggestion .inner-felx .right-area .al-based-content .al-based-col {padding: 14px 25px 14px 15px;}
    .al-based-job-suggestion .inner-felx .left-area .photo-area img { object-fit: contain;}
    .al-based-job-suggestion .inner-felx .left-area { padding-right: 50px;}
    .whatsapp-integration .whatsapp-integration-row .whatsapp-integration-col {gap: 20px; padding: 12px 15px;}
    .whatsapp-integration .whatsapp-integration-row .whatsapp-integration-col .whatsapp-integration-img {min-width: 80px; height: 80px;}
    .whatsapp-integration.whatsapp-integration .whatsapp-integration-row .whatsapp-integration-col .whatsapp-integration-img img { width: 45px; height: 45px;}
    .whatsapp-integration .whatsapp-integration-row .whatsapp-integration-col .text p{font-size: 13px; line-height: 17px;}
    .whatsapp-integration .inner-flex .left-area { padding-right: 30px;}
    .whatsapp-integration .whatsapp-integration-heading p { font-size: 16px; line-height: 24px;}
    .chart-report .inner-flex .chart-report-row .chart-report-col .icon-area {min-width: 60px; height: 60px;}
    .chart-report .inner-flex .chart-report-row .chart-report-col .content h4 { margin-bottom: 8px;}
    .footer-area .inner-flex .leftside { padding-right: 60px; }
    .footer-area .inner-flex .leftside .icon { width: 55px; height: 55px; top: 0; margin-top: 0; }
    .footer-area .inner-flex .leftside .info .icon img {width: 30px; height: 30px;}
    .footer-area .inner-flex .leftside .info { padding-left: 66px; }
 }


@media (max-width: 767px) {
    h2 { font-size: 24px; } 

    header .top-nav .header-block .rightside .call-link {display: none;}
    .top-nav .header-block .logo {width: 140px;}
    header.fixed .top-nav .header-block .logo { width: 140px; }
    .top-nav .header-block .rightside .mail{display: none;}
    header.fixed .top-nav .header-block .rightside .demo-link { font-size: 10px; padding: 8px 10px; line-height: 16px; }
    .top-nav .header-block .rightside .demo-link{ font-size: 10px; padding: 8px 10px; line-height: 16px;}

    .hero-banner { padding: 100px 0 0 0; }
    .hero-banner-top .inner-flex { gap: 20px; flex-direction: column-reverse; }
    .hero-banner-top .inner-flex .photo-area { width: 100%; height: 100%; }
    .hero-banner-top .inner-flex .content h1 {font-size: 28px; line-height: 36px;  margin-bottom: 8px;}
    .hero-banner-top .inner-flex .content p {font-size: 14px; line-height: 18px; margin-bottom: 14px;}
    .hero-banner-top .inner-flex .content .form-area .btn-go { top: 3px; right: 3px; font-size: 14px; line-height: 16px; padding: 10.5px 20px; }
    .hero-banner-top .inner-flex .content .form-area { padding: 8px 14px; }
    .hero-banner-top .inner-flex .content .form-area .form-control {font-size: 14px; line-height: 27px;}
    .hero-banner-bottom { padding: 50px 0;}
    .hero-banner-bottom .photo-area .main-screen {height: 180px; border-radius: 0;}
    .hero-banner-bottom .photo-area .main-screen .chart-vector:nth-child(3) { left: 15px;}
    .hero-banner-bottom .photo-area .main-screen .chart-vector:nth-child(2) { right: 15px;}
    .chart-report { padding: 50px 0;}
    .chart-report .inner-flex .content p { font-size: 14px; line-height: 20px; margin-bottom: 18px; }
    .chart-report .inner-flex .content ul li { width: 100%; margin-bottom: 8px; }
    .chart-report .inner-flex .content ul li .gray-block { font-size: 14px; line-height: 20px;  padding: 10px 10px 10px 52px;}
    .chart-report .inner-flex .content ul li .gray-block::before { width: 21px; height: 21px;  top: 9px; left: 19px; background-size: 100% 100%; }
    .chart-report .inner-flex .chart-report-row .chart-report-col .icon-area { width: fit-content; min-width: 60px;  align-items: center; padding: 14px; height: 60px;}
    .chart-report .inner-flex .chart-report-row .chart-report-col { flex-direction: column; gap: 10px; align-items: center}
    .chart-report .inner-flex .chart-report-row .chart-report-col .content h4 { font-size: 20px; margin-bottom: 6px; text-align: center; }
    .chart-report .inner-flex .chart-report-row .chart-report-col .content p {font-size: 14px; line-height: 20px; text-align: center;}
    .chart-report .inner-flex .chart-report-row { gap: 25px;}

    .our-features { padding: 50px 0;}
    .our-features .our-features-heading p {font-size: 15px; line-height: 19px;}
    .our-features .our-features-tabs ul { padding: 6px 9px; gap: 10px; flex-wrap: wrap; }
    .our-features .our-features-tabs ul li a.our-features-tab-active::before {height: 4px;}
    .our-features .tab-content .our-features-content {gap: 25px; flex-direction: column;}
    .our-features .tab-content .our-features-content .our-features-card { width: 100%; padding: 25px 15px;}
    .our-features .tab-content .our-features-content .our-features-card h3 {font-size: 20px; line-height: 24px; margin-bottom: 10px;}
    .our-features .tab-content .our-features-content .our-features-card a {font-size: 14px; padding: 8px 20px; line-height: 18px;}
    .our-features .tab-content .our-features-content .our-features-card::after {width: 90px; height: 90px;}
    .our-features .tab-content .our-features-content .our-features-block {width: 100%; padding: 0;}
    .our-features .tab-content .our-features-content ul li {font-size: 14px; line-height: 20px;}

    .application-tracking { padding: 50px 0;}
    .application-tracking::after { width: 80px; height: 80px;}
    .application-tracking .application-tracking-grid {gap: 10px;  grid-template-columns: repeat(1, 1fr);}
    .application-tracking .application-tracking-heading {padding-bottom: 30px;}
    .application-tracking .application-tracking-heading p {font-size: 15px; line-height: 20px;}
    .application-tracking .application-tracking-grid .application-tracking-col h4 { font-size: 18px; line-height: 20px; margin-bottom: 6px;}
    .application-tracking .application-tracking-grid .application-tracking-col p {font-size: 14px; line-height: 17px;}
    .application-tracking .application-tracking-btn a {padding: 10px 25px; font-size: 14px; margin: 20px auto auto;}

    .whatsapp-integration {padding: 50px 0;}
    .whatsapp-integration .inner-flex { flex-direction: column; gap: 30px; }
    .whatsapp-integration .inner-flex .left-area { max-width: 100%; padding-right: 0;}
    .whatsapp-integration .whatsapp-integration-heading p { font-size: 16px; line-height: 20px; margin-bottom: 8px; }
    .whatsapp-integration .whatsapp-integration-heading span {  font-size: 14px; line-height: 19px; display: inline-block; }
    .whatsapp-integration .inner-flex .right-area {max-width: 100%;}
    .whatsapp-integration .whatsapp-integration-row .whatsapp-integration-col { padding: 10px 14px; gap: 10px; display: block;}
    .whatsapp-integration .whatsapp-integration-row .whatsapp-integration-col .whatsapp-integration-img { width: 60px; height: 60px; margin-bottom: 5px;}
    .whatsapp-integration.whatsapp-integration .whatsapp-integration-row .whatsapp-integration-col .whatsapp-integration-img img {width: 30px; height: 30px;}
    .whatsapp-integration .whatsapp-integration-row .whatsapp-integration-col .text h4 {font-size: 18px; line-height: 20px;}
    .whatsapp-integration .whatsapp-integration-row .whatsapp-integration-col .text h4 { font-size: 18px; line-height: 20px; margin-bottom: 6px; }
    .whatsapp-integration .whatsapp-integration-row .whatsapp-integration-col .text p { font-size: 13px; line-height: 15px;}
    .whatsapp-integration .whatsapp-integration-row {gap: 12px;}

    .al-based-job-suggestion .inner-felx {flex-direction: column; gap: 30px;}
    .al-based-job-suggestion .inner-felx .left-area {width: 100%; padding-right: 0;}
    .al-based-job-suggestion .inner-felx .left-area .photo-area img {position: relative;}
    .al-based-job-suggestion .inner-felx .right-area {max-width: 100%; padding: 20px 0 0;}
    .al-based-job-suggestion .inner-felx .right-area h2 {margin-bottom: 20px;}
    .al-based-job-suggestion .inner-felx .right-area .al-based-content .al-based-col { padding: 10px 20px 10px 15px; }
    .al-based-job-suggestion .inner-felx .right-area .al-based-content .al-based-col h4 {font-size: 18px; margin-bottom: 6px;}
    .al-based-job-suggestion .inner-felx .right-area .al-based-content .al-based-col p { font-size: 14px; line-height: 17px; }
    .al-based-job-suggestion .inner-felx .right-area .al-based-content { gap: 20px; }
    .al-based-job-suggestion {padding-bottom: 50px;}

    .footer-area .footer-heading h2.touch-text::before { font-size: 37px; -webkit-text-stroke: 1px #28B1FFCC; }
    .footer-area .footer-heading {padding: 0 0 32px 0;}
    .footer-area .inner-flex {flex-direction: column; gap: 30px;}
    .footer-area .inner-flex .leftside { width: 100%; padding-right: 0; }
    .footer-area .inner-flex .right-form { width: 100%; }
    .footer-area .inner-flex .leftside .info {margin: 0 0 20px 0; padding-left: 57px; font-size: 13px;}
    .footer-area .inner-flex .leftside .icon { width: 45px; height: 45px; }
    .footer-area .inner-flex .leftside .info .icon img { width: 25px; height: 25px; }
    .footer-area .inner-flex .leftside .info .icon img {width: 35px; height: 35px;}
    .footer-area .inner-flex .right-form h3 {font-size: 20px; margin-bottom: 12px;}
    .footer-area .inner-flex .right-form .form-control {padding: 10px 13px; font-size: 14px; line-height: 22px;}
    .footer-area .inner-flex .right-form .cols-10 {    margin-bottom: 10px;}
    .footer-area .inner-flex .right-form .btn-submit {padding: 12px 14px; font-size: 14px; }
    .footer-area .copyright {margin-top: 35px; font-size: 14px; line-height: 18px; padding: 13px 0;}

    .hero-banner-bottom .photo-area .main-screen .chart-vector img { width: 22px; }
    .hero-banner-top .inner-flex .photo-area::after {background-size: 100% 100%;} 


}