@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');



html {scroll-behavior: smooth;}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}

* {padding:0; margin:0;}
body{margin:0px; font-family: "Inter", sans-serif; font-w-webkit-font-smoothing: subpixel-antialiased ; font-weight: normal;  counter-reset: section;
/*overflow: hidden;*/}
a             {  text-decoration:none; transition-duration: 0.5s; outline:none !important; }
a:hover       { text-decoration: none;    
	animation-delay: 0.5s;
    animation-duration: 1s; 
    animation-iteration-count: infinite;
    animation-name: hvr-back-pulse;
    animation-timing-function: linear;
	}
:focus   { outline: 0; text-decoration:none !important; }
img{border:0px; outline:none; max-width:100%;}
.img-fullwidth {width:100%;}

ul,li{ list-style:none; margin:0; padding:0;}
strong{ }
/* Headings */
h1,h2,h3,
h4,h5,h6      { font-family: "Inter", sans-serif; }
h1            { }
h2            { }
h3            { }
h4            { }
h5            { }
h6            { }

input[type="submit"]{ cursor:pointer}


::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  opacity: 1;
}
::-moz-placeholder { /* Firefox 19+ */
  opacity: 1;
}
:-ms-input-placeholder { /* IE 10+ */
  opacity: 1;
}
:-moz-placeholder { /* Firefox 18- */
  opacity: 1;
}



body {  }

@media only screen and (min-width:1660px) {
  .container { max-width: 1440px; }

}

/* ============ common Css ============= */


.common_button {
  display: inline-block;
  background: #f15a22;
  border-radius: 10px;
  color: #fff;
  font-size: 18px;
  font-weight: 700;
  padding: 12px 28px;
}

.common_button:hover {
  background-color: #3691f1;
  color: #fff;
}

.common_button2 {
  display: inline-block;
  background: #3691f1;
  border-radius: 10px;
  color: #fff;
  font-size: 18px;
  font-weight: 700;
  padding: 12px 28px;
}

.common_button2:hover {
  background-color: #f15a22;
  color: #fff;
}

.common_padding { padding: 70px 0; }

.common_heading_area :is(h2, h3, h4) { font-size: clamp(23px, 2.8vw, 32px); color: #083784; font-weight: 700; padding-bottom: 15px; position: relative; }
.common_heading_area p { font-size: clamp(17px, 1.6vw, 20px); color: #000; padding-bottom: 20px; }
.common_heading_area ul { padding-left: 0; }
.common_heading_area ul li { padding: 0 0 15px 45px; color: #333; font-size: 18px; font-weight: 400; background: url('../images/bullet1.png') 0 4px no-repeat; }
.common_heading_area ul li strong { font-weight: 700; display: block; padding-bottom: 15px; }

.common_heading_area2 :is(h2, h3, h4) { font-size: clamp(23px, 2.8vw, 32px); color: #34cda1; font-weight: 700; padding-bottom: 15px; position: relative; }
.common_heading_area2 p { font-size: clamp(17px, 1.6vw, 20px); color: #fff; padding-bottom: 20px; }
.common_heading_area2 ul { padding-left: 0; }
.common_heading_area2 ul li { padding: 0 0 15px 45px; color: #fff; font-size: 18px; font-weight: 400; background: url('../images/bullet2.png') 0 4px no-repeat; }
.common_heading_area2 ul li strong { font-weight: 700; display: block; padding-bottom: 15px; }

.common_heading_area3 { padding-bottom: 25px; text-align: center; }
.common_heading_area3 :is(h2, h3, h4) { font-size: clamp(26px, 3.8vw, 60px); color: #083784; font-weight: 800; padding-bottom: 10px; position: relative; }
.common_heading_area3 p { font-size: clamp(17px, 1.6vw, 20px); color: #333; padding-bottom: 20px; }




/* ============ Header Css ============= */


header {width: 100%; position: sticky; position: -webkit-sticky; left: 0; top: 0; padding:0;z-index: 999;transition: all 0.3s ease; background: #f8fcfb;}
.header_area { display: flex; justify-content: space-between; align-items: center; padding: 20px 0 30px; position: relative; z-index: 5; }
.nav_area { position: relative; top: 58px; background: #fff; border-radius: 10px; box-shadow: 0 0 35px 0 rgba(0,0,0,0.1); }
.sina-nav-wrapper .container-fluid { padding: 0; }
.sina-nav .sina-menu > li > a { max-width: fit-content; padding:20px 50px; position: relative; background: #fff; border-radius: 10px; }
.sina-nav .sina-menu > li > a::after { content: ' '; position: absolute; right: 0; top: 18px; width: 1px; height: 25px; background: #b9c0cf; }
.sina-nav .sina-menu > li:last-child > a::after { display: none; }
.sina-nav .sina-menu {  margin: 0;  display: table; }
.sina-nav.navbar-transparent .sina-menu > li > a { text-transform: uppercase; color: #333; font-size: 21px; font-weight: 500; font-family: "Inter", sans-serif; }
.sina-nav.navbar-transparent .sina-menu > li > a:hover {  font-weight: 600; background: #3691f1; border-radius: 10px; color: #fff;}
.sina-nav.navbar-transparent .sina-menu > li > a:hover::after { display: none; }

.mob_logo { display: none; } 
.menu_cross_btn { display: none; }
.right_area { display: flex; align-items: center;}

.header_area .right_area { position: relative; }


@media only screen and (min-width:3840px) {
  header::after { right: -20%; }
}

/* ============ Banner Css ============= */

.banner { width: 100%; position: relative; background: linear-gradient(180deg,rgba(5, 32, 77, 1) 0%, rgba(8, 55, 132, 1) 44%); overflow: hidden; position: relative; }
.banner .container { position: relative;  min-height:800px; z-index: 5; }
.banner::before { width: 100%; height: 100%; position: absolute; left: -40px; top: 0; content: ' '; z-index: 1; background: url('../images/banner_line.png') 0 0 no-repeat; }
.banner .content_block { width: 680px; position: absolute; left: 0; top: 50%; transform: translateY(-50%); color: #fff; }
.banner .content_block h1 { font-size: clamp(27px, 3.4vw, 75px); margin: 0; padding-bottom: clamp(15px, 2vw, 30px); font-weight: 800;}
.banner .content_block p { font-size: clamp(17px, 1.5vw, 22px); margin: 0; padding-bottom: clamp(15px, 2vw, 30px); font-weight: 500; }
.banner .content_block .buttons_area { display: flex; padding-bottom: clamp(15px, 2vw, 30px); }
.banner .content_block .buttons_area a { margin-right: 20px; }
.banner .content_block .icons_area { display: flex; justify-content: space-between; }
.banner .content_block .icons_area .icon { display: flex; align-items: center; color: #fff; font-size: 18px; font-weight: 700; width: 33%; }
.banner .content_block .icons_area .icon img { margin-right: 10px; }
/* .banner .content_block .icons_area .icon:hover { color: #fff; } */

.banner_video_area { background: #fff; position: absolute; right: -21%; bottom: 0; border-radius:80px 0 0 80px; /* width: 900px; height: 750px; */ -webkit-transform: skew(-7deg, 0deg); z-index: 8;} 
.banner_video_block { /* background: #fff; */ position: relative; right: -10px; bottom: 0; border-radius: 80px 0 0 80px; /* width: 900px; */ height: 750px; -webkit-transform: skew(3deg, 0deg); overflow: hidden; }
.banner_video_block .hero_video { width: 100%; height: 100%; margin-left: -50px; -webkit-transform: skew(0deg, 0deg); object-fit: cover;}
.banner_video_block .play_button { width: 132px; height: 132px; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); }
.banner_video_block .play_button img { -webkit-transform: skew(5deg, 0deg); }


/* ============ what's getting Css ============= */

.what_getting { padding: 120px 0 50px; background: #f8fcfb url('../images/line1.png') 0 50% no-repeat; }
.getting_box { border-radius: 20px; background: #e9f2ff; padding: 0 0 0 55px; position: relative; display: flex; justify-content: space-between; }
.getting_box_left { width: 40%; padding: 35px 0; }
.blue_box_right { width: 55%; background: url('../images/blue_back.png') 0 0 no-repeat; background-size: 100% 100%; position:relative; margin-top: -40px; }
.blue_box_right .common_heading_area2 { width: 100%; padding: 65px 7% 35px 21%; }

.getting_box_left .common_heading_area p, .blue_box_right .common_heading_area2 p { position: relative; }
.getting_box_left .common_heading_area p::after { content: ' '; position: absolute; left: 0; bottom: 0; background: #d0d5dc; width: 100%; height: 1px; } 
.blue_box_right .common_heading_area2 p::after { content: ' '; position: absolute; left: 0; bottom: 0; background: #516c97; width: 100%; height: 1px; }
.blue_box_right .common_heading_area2 h2 { padding-top: 10px; }
.blue_box_right .common_heading_area2 .outcome_box p::after { display: none; }
.blue_box_right .common_heading_area2 ul li { padding: 7px 0 8px 45px; background-position: 0 9px; }

.getting_box_left .common_heading_area ul li { padding-top: 7px; background-position: 0 10px; padding-bottom: 18px; }

.outcome_box { background: #001c4961; padding: 15px 25px; border: 1px solid #cfddf1; border-radius: 15px; margin-top: 30px;  }
.outcome_box h3 { color: #34cda1; padding: 0 0 5px; font-size: clamp(21px, 1.9vw, 27px); font-weight: 700; }
.outcome_box p { color: #fff; font-size: 17px; font-style: italic; padding: 0; }


/* ============ solutions Css ============= */

.solutions { background: #fff url('../images/mid_dot.png') 50% 50% no-repeat; }

.solutions .common_heading_area ul li { background: url('../images/bullet3.png') 0 4px no-repeat; }
.solutions .common_heading_area3 p { padding-left: 10%; padding-right: 10%;}
.solution_box_lft { position: relative; -webkit-transform: skew(-4deg, 0deg); background: #fff; box-shadow: 0 0 15px 0 rgba(0,0,0,0.25); padding: 40px 55px 50px; border-radius: 15px; z-index: 3; width: 95%;}
.solution_box_lft .common_heading_area { -webkit-transform: skew(4deg, 0deg); position: relative; height: 100%; }

.solution_box_lft_outer { position: relative; }
.solution_box_lft_outer::before { width: 93%; height: 50%; background: #358fef; position: absolute; left: 4px; top: -7px; border-radius: 15px; content: ' '; z-index: 1; }
.solution_box_lft_outer::after { width: 50%; height: 50%; background: #358fef; position: absolute; right: 40px; bottom: -5px; border-radius: 15px; content: ' '; z-index: 1; }

.outcome_box2 { background: #fff; padding: 15px 25px 5px; border: 1px solid #cfddf1; border-radius: 15px; margin-top: 30px; width: 100%; }
.outcome_box2 h3 { color: #34cda1; padding: 0; font-size: clamp(21px, 1.9vw, 27px); font-weight: 700; }
.outcome_box2 p { color: #5a75a7; font-size: 16px; font-style: italic; padding: 0; }

.solution_box_lft_outer2 { position: relative; display: flex;justify-content: flex-end; height: 100%;}
.solution_box_lft_outer2::before { width: 93%; height: 50%; background: #33c99f; position: absolute; right: 4px; top: -7px; border-radius: 15px; content: ' '; z-index: 1; }
.solution_box_lft_outer2::after { width: 50%; height: 50%; background: #33c99f; position: absolute; left: 40px; bottom: -5px; border-radius: 15px; content: ' '; z-index: 1; }

.solution_box_right { position: relative; -webkit-transform: skew(4deg, 0deg); background: #fff; box-shadow: 0 0 15px 0 rgba(0,0,0,0.25); padding: 40px 55px 30px; border-radius: 15px; z-index: 3; width: 95%; }
.solution_box_right .common_heading_area { -webkit-transform: skew(-4deg, 0deg); position: relative; height: 100%; }
.solution_box_lft .common_heading_area p, .solution_box_right .common_heading_area p { font-weight: 600; }
.solution_box_lft .outcome_box2 p, .solution_box_right .outcome_box2 p {  font-weight: 400; } 




/* ============ looks Css ============= */

.looks { background: #f8fcfb; }
.looks .common_heading_area ul li { background: url('../images/bullet3.png') 0 4px no-repeat; }


/* ============ insights Css ============= */

.insights { background: url('../images/lower_bk.png') 0 0 no-repeat; background-size: cover; padding: 70px 0 200px; position: relative; }
.insights .common_heading_area3 h2 { color: #fff; }
.insights_whitebox { width: 100%; max-width: 1215px; margin: 0 auto; position: relative; padding: 90px 12% 0; background: url('../images/insights_bk.png') 0 4px no-repeat; background-size: 100% 100%; position: relative; }
.insights_whitebox h3 { position: relative; display: inline-block; }
.insights_whitebox h3::after { position: absolute; right: -160px; bottom: 22px; background: #348eee; height: 1px; width: 150px; content: ' '; }
.insights .common_button { position: relative; left: 50%; transform: translateX(-50%); bottom:-30px; padding-top: 17px; padding-bottom: 17px; }
.insights_whitebox ul { margin-bottom: 40px; }


/* ============ footer Css ============= */

footer { background: #000; }
footer .footer_top { padding: 80px 0; display: flex; justify-content: space-between; align-items: center; }
footer .footer_top .logoarea { display: flex; align-items: center; }
footer .footer_top .sep { width: 1px; height: 70px; background: #787878; margin: 0 35px; }
footer .footer_top .text { color: #fff; font-weight: 700; font-size: 24px; width: 400px; text-transform: capitalize;}
footer .footer_top .text b { font-weight: 700; }
footer .copyright { padding: 20px 0; text-align: center; color: #fff; font-size: 18px; border-top: 1px solid #303030; }


.img_area_outer { width: 100%; height: 100%; position: relative; padding-top: 15px;}
.img_area_outer::before { content: ' '; position: absolute; left: 115px; top: 0; border-radius: 25px; width: 539px; height: 443px; z-index: 0; background: url('../images/img_feame_back.png') 0 0 no-repeat; transform: skewX(4deg);}
.img_area {
    width: 100%; 
    margin: 0 auto;
    overflow: hidden;
    border-radius:25px;
    position: relative;
    
}
.img_position {
    min-height: 625px;
    background: #000;
    width: 100%; 
    transform-origin: bottom;
    transform: skewX(12deg);
    border-radius:25px;
    overflow: hidden;
    position: relative; 
    z-index: 3;
}
.img_position img { 
  transform: skewX(-12deg);
  position: absolute;
  left: 66px;
  object-fit: cover;
  width: 100%;
  height: 100%;
}


.common_heading_area_sol {
    display: flex;
    flex-direction: column;
}


.page-id-2146 .solution_box_right ul { margin-top: -18px }
.page-id-2242 .solution_box_right ul { margin-top: -16px } 
.page-id-2242 .solution_box_right .outcome_box2 { position: relative; top: 23px; }
.page-id-2156 .solution_box_lft ul { margin-top: -20px; }



/* ============ Responsive Css ============= */


@media only screen and (max-width:1660px) {

.banner { height: auto; }
.img_area_outer::before { left: 115px;width: 439px; height: 333px; transform: skewX(12deg);}
.common_heading_area :is(h2, h3, h4) { font-size: clamp(23px, 2.8vw, 31px); }
}

@media only screen and (max-width:1559px) {
.common_heading_area :is(h2, h3, h4) { background-position: 0 77%;background-size: 75%; }
.sina-nav .sina-menu > li > a { padding: 20px 35px; }
.banner_video_area { right: -25%; }
.banner .content_block .icons_area { width: 91%; }
.getting_box_left { width: 45%; }
.blue_box_right { width: 55%; }
}

@media only screen and (max-width:1399px) {
.header_area .logo { width: 230px; }
.sina-nav .sina-menu > li > a { padding: 20px 23px; }
.sina-nav.navbar-transparent .sina-menu > li > a, .sina-nav .sina-menu > li > a { font-size: 16px; }
.banner .content_block .icons_area { width: 93%; }
.banner .container { min-height: 600px; }
.banner_video_block { height: 550px; }
.getting_box_left { width: 40%; }
.blue_box_right { width: 60%; }
.img_position { min-height: 425px; }
.img_position img { left: 44px; }
 .img_area_outer::before { left: 177px; width: 319px;height: 243px; }
}

@media only screen and (max-width:1199px) {
.links_area ul li a {padding: 20px 15px 20px 40px; font-size: 15px; }
.sina-nav .sina-menu > li { margin: 0; }
.sina-nav .sina-menu > li > a { padding: 20px 23px; }
.header_area .logo { width: 200px; }
header .container::after { right: -27%; }
.banner .content_block { width: 50%; }
.banner .content_block .buttons_area { display: block; }
.common_button2 { padding: 8px 20px; font-size: 15px; }
.common_button, .common_button2 strong {font-size: 15px;padding: 6px 20px;}
.banner .content_block .buttons_area a { margin: 0 0 15px; }
.common_button2 strong { padding: 4px 20px; }
.banner .content_block .icons_area .icon { font-size: 16px; }
.banner .content_block .icons_area .icon img { width: 22px; }
.blue_box_right { width: 45%; background-position: 45% 0; background-size: cover; }
.blue_box_right .common_heading_area2 { padding: 65px 7% 35px 12%; }
footer .footer_top { padding: 40px 0; }

.insights_whitebox ul { margin-bottom: 0; }

.common_padding { padding: 40px 0; }
.top_footer { padding-top: 50px; padding-bottom: 30px; }

.img_area_outer::before { left: -15px; width: 50%;height: 50%;transform: skewX(0deg); }

}

@media only screen and (max-width:1024px) {
header::after, header .container::after { display: none; }
.top_ph { display: none;}
.nav_area { position: absolute; right: 0; top: 18px; background: transparent; box-shadow: 0 0 0 0; }
.nav_area .sina-nav { background-color: transparent; }
.sina-nav .sina-nav-header { height: auto; }
.sina-nav .navbar-toggle { margin: 0; font-size: 26px;color: #083784; position: relative; top: 0; }
.mob_logo { display: block; } 
.menu_cross_btn { display: block; position: absolute; right: 22px; top: 5px; color: #EA2C00;}
.sina-nav.mobile-sidebar .sina-menu { width: 100%; }
.sina-nav .sina-menu > li > a { padding: 12px 10px; background: transparent; border-radius: 0; border-color: #81a0d3; }
.sina-nav .sina-menu > li > a::after { display: none; }
.sina-nav.navbar-transparent .sina-menu > li > a, .sina-nav .sina-menu > li > a { display: block; max-width: 100%; color: #fff; }
.sina-nav.navbar-transparent .sina-menu > li > a:hover, .sina-nav .sina-menu > li > a:hover { color: #3691f1; background: transparent; border-radius: 0;}
.mob_logo  { position: relative; width: 170px;  left: 15px; top: 6px; }
.mob_logo img { width: 220px; left: 12px; top: 6px; }

.right_area .header_button1, .right_area .header_button2 { display: none; }
.header_area .right_area { padding-right: 45px; }

}


@media only screen and (max-width:991px) {

.banner_video_area { width: 100%; }
.banner_video_area, .banner_video_block, .banner_video_block .play_button img { -webkit-transform: skew(0deg, 0deg); }
.banner_video_block .hero_video { margin-left: 0; }
.banner .container { min-height: 550px; }
.banner .content_block { z-index: 9; padding: 35px; background: rgba(5,32,75,0.3);border-radius: 20px; transform: translate(0, -50%); width: 60%;}
.banner .content_block .icons_area { display: block; }
.banner .content_block .icons_area .icon { padding-bottom: 8px; width: 100%; }
.common_button2 { padding: 8px 10px; font-size: 14px; }
.solution_box_lft_outer { margin-bottom: 60px; }
.insights_whitebox { background-size: cover; background-position: 50% 0; border-radius: 25px; padding: 80px 6% 0; }
.footer_top .logo { width: 150px; }
footer .footer_top .sep { margin: 0 20px; }
footer .footer_top .text { font-size: 16px; }
footer .footer_top .logoarea { width: 75%; }

}

  
@media only screen and (max-width:767px) {
.sina-nav .navbar-toggle { top: 35px; }
.bullet_speed .text_block { padding-left: 0; }
.header_area { padding: 10px 0; }
.nav_area { top: -25px; }
.banner .content_block .icons_area { display: none; }
.banner .content_block { width: 100%; transform: translate(0, 0); top: inherit; bottom: 0; padding: 30px 35px 0; position: relative;}
.banner_video_area { right: 0; border-radius: 30px; position: relative;margin-top: 15px;}
.banner_video_block { right: 0; border-radius: 30px; }
.banner .container { max-width: 100%; }
.banner .content_block .buttons_area { padding-bottom: 0; }
.banner .container, .banner_video_block {height: fit-content; min-height: fit-content; }
.what_getting { padding: 40px 0 40px; }
.getting_box { display: block;padding: 0; overflow: hidden;}
.getting_box_left { padding: 30px; width: 100%; }
.blue_box_right { margin-top: 0; }
.blue_box_right { width: 100%; background-size: 200% 200%; }
.blue_box_right .common_heading_area2 { padding: 65px 7% 35px; }
.solution_box_lft, .solution_box_right { -webkit-transform: skew(0, 0deg);width: 100%; }
.solution_box_right .common_heading_area, .solution_box_lft .common_heading_area { -webkit-transform: skew(0, 0deg); }
.banner_textarea p { width: 100%; }


}


@media only screen and (max-width:576px) {
  .mob_logo img {
    width: 130px;
  }
.insights { padding: 70px 0 100px; }
.solution_box_lft, .solution_box_right { padding: 40px 25px 30px; }

footer .footer_top .logoarea { width: 100%; flex-wrap: wrap; justify-content: center;}
footer .footer_top { flex-wrap: wrap; justify-content: center;text-align: center; }
footer .footer_top .text { width: 100%; padding: 20px 0; }
footer .footer_top .sep { display: none; }

.img_position {min-height: 275px;}
.img_position img { left: 25px;}
.img_area_outer::before { left: -7px; top: 10px; }
}

@media only screen and (max-width:480px) {
.header_area .logo { width: 130px; }
.sina-nav .navbar-toggle { top: 27px;}
 header .container::after { right: -15%; }
 .insights_whitebox h3::after { right: -110px; width: 100px;  }
.common_button, .common_button2 strong { font-size: 13px; }
.common_button2 { font-size: 13px; }

.mob_logo { width: 180px; }

}

@media only screen and (max-width:400px) {
.common_button, .common_button2 strong { padding: 6px 10px; }
}