/*

Softy Pinko

https://templatemo.com/tm-535-softy-pinko

*/
/* ---------------------------------------------
Table of contents
------------------------------------------------
01. font & reset css
02. reset
03. global styles
04. header
05. welcome
06. features
07. team
08. pricing
09. blog
10. contact
11. footer
12. preloader

--------------------------------------------- */
/* 
---------------------------------------------
font & reset css
--------------------------------------------- 
*/
@import url("https://fonts.googleapis.com/css?family=Raleway:100,300,400,500,700,900");
/* 
---------------------------------------------
reset
--------------------------------------------- 
*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, div
pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q,
s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li,
figure, header, nav, section, article, aside, footer, figcaption {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
}

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

.clearfix {
  display: inline-block;
}

html[xmlns] .clearfix {
  display: block;
}

* html .clearfix {
  height: 1%;
}

ul, li {
  padding: 0;
  margin: 0;
  list-style: none;
}

header, nav, section, article, aside, footer, hgroup {
  display: block;
}

* {
  box-sizing: border-box;
}

html, body {
  font-family: "Raleway", sans-serif;
  font-weight: 400;
  background-color: #fff;
  font-size: 16px;
  -ms-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

a {
  text-decoration: none !important;
}

h1, h2, h3, h4, h5, h6 {
  margin-top: 0px;
  margin-bottom: 0px;
}

ul {
  margin-bottom: 0px;
}

/* 
---------------------------------------------
global styles
--------------------------------------------- 
*/
html,
body {
  background: #fff;
  font-family: "Raleway", sans-serif;
}

::selection {
  background: #ff589e;
  color: #fff;
}

::-moz-selection {
  background: #ff589e;
  color: #fff;
}

.section {
  position: relative;
  padding-top: 100px;
  padding-bottom: 80px;
}

.section.colored {
  background: #f2f2fe;
}

.hr {
  bottom: 0px;
  width: 100%;
  height: 1px;
  margin-top: 100px;
  border-bottom: 1px solid #eee;
}

.left-heading.light .section-title {
  color: #ffffff;
}

.left-heading .section-title {
  font-weight: 500;
  font-size: 24px;
  line-height: 42px;
  color: #1e1e1e;
  letter-spacing: 0.25px;
  margin-bottom: 30px;
  position: relative;
}

.center-heading {
  text-align: center;
}

.center-heading .section-title {
  font-weight: 500;
  font-size: 28px;
  color: #1e1e1e;
  letter-spacing: 1.75px;
  line-height: 38px;
  margin-bottom: 20px;
}

.center-heading.colored .section-title {
  color: #ffffff;
}

.center-text {
  text-align: center;
  font-weight: 400;
  font-size: 16px;
  color: #777;
  line-height: 28px;
  letter-spacing: 1px;
  margin-bottom: 50px;
}

.center-text.colored {
  color: #fff;
}

.center-text p {
  font-size: 15px;
  color: #1b333b;
  margin-bottom: 30px;
}

.left-text {
  font-weight: 400;
  font-size: 16px;
      color: #1b333b;
  line-height: 28px;
  letter-spacing: 1px;
}

.left-text.light {
  color: #fff;
}

.left-text p {
  margin-bottom: 30px;
}

.left-text p.dark {
  color: #3B566E;
}

.padding-bottom-top-60 {
  padding-top: 60px !important;
  padding-bottom: 60px !important;
}

.padding-bottom-80 {
  padding-bottom: 80px !important;
}

.padding-bottom-100 {
  padding-bottom: 100px !important;
}

.border-bottom {
  border-bottom: 1px solid #eee !important;
}

.mbottom-30 {
  margin-bottom: 30px !important;
}

.align-self-center {
  -ms-flex-item-align: center !important;
  align-self: center !important;
}

.align-self-bottom {
  -ms-flex-item-align: flex-end !important;
  align-self: flex-end !important;
}

.padding-bottom-0 {
  padding-bottom: 0px !important;
}

.padding-top-0 {
  padding-top: 0px !important;
}

.padding-top-80 {
  padding-top: 80px !important;
}

.padding-top-70 {
  padding-top: 70px !important;
}

.padding-top-20 {
  padding-top: 20px !important;
}

.margin-bottom-0 {
  margin-bottom: 0px !important;
}

.margin-bottom-30 {
  margin-bottom: 30px !important;
}

.margin-top-30 {
  margin-top: 30px !important;
}

.margin-top-15 {
  margin-top: 15px !important;
}

.margin-bottom-45 {
  margin-bottom: 45px !important;
}

.margin-bottom-20 {
  margin-bottom: 20px !important;
}

.margin-bottom-60 {
  margin-bottom: 60px !important;
}

.margin-bottom-100 {
  margin-bottom: 100px !important;
}

@media (max-width: 991px) {
  html, body {
    overflow-x: hidden;
  }
  .mobile-top-fix {
    margin-top: 30px;
    margin-bottom: 0px;
  }
  .mobile-bottom-fix {
    margin-bottom: 30px;
  }
  .mobile-bottom-fix-big {
    margin-bottom: 60px;
  }
}

a.main-button-slider {
  font-size: 13px;
  border-radius: 20px;
  padding: 12px 20px;
  background-color: #f93487;
  text-transform: uppercase;
  color: #fff;
  letter-spacing: 0.25px;
  -webkit-transition: all 0.3s ease 0s;
  -moz-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;


      box-shadow:
        0 4px 12px rgba(15, 23, 42, 0.06),
        0 12px 30px rgba(15, 23, 42, 0.08),
        0 24px 60px rgba(15, 23, 42, 0.05);
}




a.main-button-slider:hover {
  background-color: #8261ee;
}



a.main-button-project-overview {
  font-size: 13px;
  border-radius: 20px;
  padding: 12px 20px;
      background-color: rgb(50 135 255);
  text-transform: uppercase;
  color: #fff;
  letter-spacing: 0.25px;
  -webkit-transition: all 0.3s ease 0s;
  -moz-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;


      box-shadow:
        0 4px 12px rgba(15, 23, 42, 0.06),
        0 12px 30px rgba(15, 23, 42, 0.08),
        0 24px 60px rgba(15, 23, 42, 0.05);
}



a.main-button-project-overview:hover  {
  background-color: #f5428d;
}




a.main-button {
  font-size: 13px;
  border-radius: 20px;
  padding: 12px 20px;
   background-color: #8261ee;
  text-transform: uppercase;
  color: #fff;
  letter-spacing: 0.25px;
  -webkit-transition: all 0.3s ease 0s;
  -moz-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}


a.main-button:hover {
  
   background-color: #ff589e;
}



a.main-button-policy {
    font-size: 13px;
    border-radius: 20px;
    display: inline-block;
    margin-left: 20px;
    margin-bottom: 20px;
    padding: 5px 20px;
    background-color: rgb(255, 88, 158);
    text-transform: uppercase;
    color: rgb(255, 255, 255);
    letter-spacing: 0.25px;
    transition: 0.3s;
}



a.main-button-policy:hover {
  background-color: #8261ee;
}


@media (max-width: 480px) {
    a.main-button-policy {
        margin-bottom: 15px;
        margin-left:50px;
    }
}




button.main-button {
  outline: none;
  border: none;
  cursor: pointer;
  font-size: 13px;
  border-radius: 20px;
  padding: 12px 20px;
  background-color: #8261ee;
  text-transform: uppercase;
  color: #fff;
  letter-spacing: 0.25px;
  -webkit-transition: all 0.3s ease 0s;
  -moz-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}

button.main-button:hover {
  background-color: #ff589e;
}


/* 
---------------------------------------------
header
--------------------------------------------- 
*/
.header-area {
  position: fixed;
  top: 30px;
  left: 0px;
  right: 0px;
  z-index: 100;
  height: 100px;
  -webkit-transition: all 0.3s ease 0s;
  -moz-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}

.header-area .main-nav {
  /* box-shadow: 0px 0px 15px rgba(0,0,0,0.1); */
  border: 1px solid rgb(72 160 209 / 19%);
  border-radius: 40px;
  min-height: 80px;
  background: #fff;


  box-shadow: -1px 7px 18px -6px rgba(0,0,0,0.33);
-webkit-box-shadow: -1px 7px 18px -6px rgba(0,0,0,0.33);
-moz-box-shadow: -1px 7px 18px -6px rgba(0,0,0,0.33);
}

.header-area .main-nav .logo {
  float: left;
  border-radius: 10px;
  margin-top: 37px;
  -webkit-transition: all 0.3s ease 0s;
  -moz-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
  margin-left: 30px;
}

.header-area .main-nav .logo img {
  -webkit-transition: all 0.3s ease 0s;
  -moz-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}

.header-area .main-nav .nav {
  float: right;
  margin-top: 27px;
  margin-left: 0px;
  margin-right: 30px;
  -webkit-transition: all 0.3s ease 0s;
  -moz-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
  position: relative;
  z-index: 999;
}

.header-area .main-nav .nav li {
  padding-left: 20px;
  padding-right: 20px;
}

.header-area .main-nav .nav li:last-child {
  padding-right: 0px;
}

.header-area .main-nav .nav li a {
  display: block;
  font-weight: 500;
  font-size: 13px;
  color: #fff;
  -webkit-transition: all 0.3s ease 0s;
  -moz-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
  height: 40px;
  line-height: 40px;
  border: transparent;
  letter-spacing: 1px;
}

.header-area .main-nav .nav li a:hover {
  color: #ff589e;
}

.header-area .main-nav .menu-trigger {
  cursor: pointer;
  display: block;
  position: absolute;
  top: 23px;
  width: 32px;
  height: 40px;
  text-indent: -9999em;
  z-index: 99;
  right: 40px;
  display: none;
}

.header-area .main-nav .menu-trigger span,
.header-area .main-nav .menu-trigger span:before,
.header-area .main-nav .menu-trigger span:after {
  -moz-transition: all 0.4s;
  -o-transition: all 0.4s;
  -webkit-transition: all 0.4s;
  transition: all 0.4s;
  background-color: #3B566E;
  display: block;
  position: absolute;
  width: 30px;
  height: 2px;
  left: 0;
}

.header-area .main-nav .menu-trigger span:before,
.header-area .main-nav .menu-trigger span:after {
  -moz-transition: all 0.4s;
  -o-transition: all 0.4s;
  -webkit-transition: all 0.4s;
  transition: all 0.4s;
  background-color: #3B566E;
  display: block;
  position: absolute;
  width: 30px;
  height: 2px;
  left: 0;
  width: 75%;
}

.header-area .main-nav .menu-trigger span:before,
.header-area .main-nav .menu-trigger span:after {
  content: "";
}

.header-area .main-nav .menu-trigger span {
  top: 16px;
}

.header-area .main-nav .menu-trigger span:before {
  -moz-transform-origin: 33% 100%;
  -ms-transform-origin: 33% 100%;
  -webkit-transform-origin: 33% 100%;
  transform-origin: 33% 100%;
  top: -10px;
  z-index: 10;
}

.header-area .main-nav .menu-trigger span:after {
  -moz-transform-origin: 33% 0;
  -ms-transform-origin: 33% 0;
  -webkit-transform-origin: 33% 0;
  transform-origin: 33% 0;
  top: 10px;
}

.header-area .main-nav .menu-trigger.active span,
.header-area .main-nav .menu-trigger.active span:before,
.header-area .main-nav .menu-trigger.active span:after {
  background-color: transparent;
  width: 100%;
}

.header-area .main-nav .menu-trigger.active span:before {
  -moz-transform: translateY(6px) translateX(1px) rotate(45deg);
  -ms-transform: translateY(6px) translateX(1px) rotate(45deg);
  -webkit-transform: translateY(6px) translateX(1px) rotate(45deg);
  transform: translateY(6px) translateX(1px) rotate(45deg);
  background-color: #3B566E;
}

.header-area .main-nav .menu-trigger.active span:after {
  -moz-transform: translateY(-6px) translateX(1px) rotate(-45deg);
  -ms-transform: translateY(-6px) translateX(1px) rotate(-45deg);
  -webkit-transform: translateY(-6px) translateX(1px) rotate(-45deg);
  transform: translateY(-6px) translateX(1px) rotate(-45deg);
  background-color: #3B566E;
}

.header-area.header-sticky {
  min-height: 80px;
}

.header-area.header-sticky .logo {
  margin-top: 25px;
}

.header-area.header-sticky .nav {
  margin-top: 20px !important;
}

.header-area.header-sticky .nav li a {
  color: #1e1e1e;
}

.header-area.header-sticky .nav li a.active {
  color: #ff589e;
}

@media (max-width: 1200px) {
  .header-area .main-nav .nav li {
    padding-left: 12px;
    padding-right: 12px;
  }
  .header-area .main-nav:before {
    display: none;
  }
}

@media (max-width: 991px) {
  .header-area {
    padding: 0px 15px;
    height: 80px;
    box-shadow: none;
    text-align: center;
  }
  .header-area .container {
    padding: 0px;
  }
  .header-area .logo {
    margin-top: 27px !important;
    margin-left: 30px;
  }
  .header-area .menu-trigger {
    display: block !important;
  }
  .header-area .main-nav {
    overflow: hidden;
  }
  .header-area .main-nav .nav {
    float: none;
    width: 100%;
    margin-top: 80px !important;
    display: none;
    -webkit-transition: all 0s ease 0s;
    -moz-transition: all 0s ease 0s;
    -o-transition: all 0s ease 0s;
    transition: all 0s ease 0s;
    margin-left: 0px;
  }
  .header-area .main-nav .nav li:first-child {
    border-top: 1px solid #eee;
  }
  .header-area .main-nav .nav li {
    width: 100%;
    background: #fff;
    padding-left: 0px !important;
    padding-right: 0px !important;
  }
  .header-area .main-nav .nav li a {
    height: 50px !important;
    line-height: 50px !important;
    padding: 0px !important;
    border: none !important;
    background: #fff !important;
    color: #3B566E !important;
  }
  .header-area .main-nav .nav li a:hover {
    background: #eee !important;
  }
}

@media (min-width: 992px) {
  .header-area .main-nav .nav {
    display: flex !important;
  }
}

/* 
---------------------------------------------
welcome
--------------------------------------------- 
*/
.welcome-area {
  overflow: hidden;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
     background: linear-gradient(135deg, #6A00FF 0%, #8A2BE2 45%, #FF2D7A 100%);
  height: 100vh;
}

.welcome-area .header-text {
  position: absolute;
  top: 50%;
  transform: translateY(-55%);
  text-align: center;
  width: 100%;
}

.welcome-area .header-text h1 {
  font-weight: 500;
  font-size: 36px;
  line-height: 54px;
  letter-spacing: 1.4px;
  margin-bottom: 30px;
  color: #fff;
}

.welcome-area .header-text p {
  font-weight: 400;
  font-size: 15px;
  color: #fff;
  line-height: 28px;
  letter-spacing: 0.25px;
  margin-bottom: 40px;
  position: relative;
}

@media (max-width: 991px) {
  .welcome-area .header-text {
    top: 65% !important;
    transform: perspective(1px) translateY(-60%) !important;
    text-align: center;
  }
  .welcome-area .header-text h1 {
    text-align: center;
    color: #fff;
    margin-bottom: 15px;
  }
  .welcome-area .header-text h1 span {
    color: #fff;
  }
  .welcome-area .header-text p {
    text-align: center;
    color: #fff;
    margin-bottom: 20px;
  }
}

@media (max-width: 820px) {
  .welcome-area .header-text {
    top: 65% !important;
    transform: perspective(1px) translateY(-60%) !important;
  }
   .welcome-area .header-text h1 {
    font-size: 22px;
    line-height: 30px;
    margin-bottom: 15px;
  }
  .welcome-area .header-text p {
    margin-bottom: 20px;
  }
}

@media (max-width: 765px) {
  .welcome-area {
    margin-bottom: 100px;
  }
  .welcome-area .header-text {
    top: 50% !important;
    transform: perspective(1px) translateY(-50%) !important;
    text-align: center;
  }
  .welcome-area .header-text .buttons {
    display: none;
  }
  .welcome-area .header-text h1 {
    font-weight: 600;
    font-size: 24px !important;
    line-height: 30px !important;
    margin-bottom: 30px !important;
  }
  .welcome-area .header-text h1 span {
    color: #fff;
  }
  .welcome-area .header-text p {
    text-align: center;
    color: #fff;
    font-size: 14px;
    line-height: 22px;
    margin-bottom: 40px;
  }
}









/* 
---------------------------------------------
features
--------------------------------------------- 
*/
.features-small-item {
    cursor: pointer;
    display: block;
    background: #fff;
    border-radius: 20px;
    padding: 30px;
    text-align: center;
    position: relative;
    margin-bottom: 30px;
    transition: all 0.35s ease;
    border: 1px solid rgb(18 192 255 / 45%);


box-shadow: 0px 6px 5px -4px rgba(125,120,120,0.73);
-webkit-box-shadow: 0px 6px 5px -4px rgba(125,120,120,0.73);
-moz-box-shadow: 0px 6px 5px -4px rgba(125,120,120,0.73);
 
}


.features-small-item:hover .icon {
  background-color: #ff589e;
}

.features-small-item .icon {
  -webkit-transition: all 0.3s ease 0s;
  -moz-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
  width: 90px;
  height: 90px;
  line-height: 90px;
  margin: auto;
  position: relative;
  margin-bottom: 30px;
  background: #609af3;
  /* background: #8261ee; */
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
}

.features-small-item .icon i {
  font-size: 18px;
  color: #fff;
}

.features-small-item .features-title {
  font-weight: 500;
  font-size: 18px;
  color: #1e1e1e;
  letter-spacing: 0.7px;
  margin-bottom: 15px;
  position: relative;
  z-index: 2;
}

.features-small-item p {
  font-weight: 400;
  font-size: 13px;
 color: rgb(66 77 161);
  letter-spacing: 0.5px;
  line-height: 25px;
  position: relative;
  z-index: 2;
}

.features-small-item a {
  float: right;
  position: relative;
  z-index: 2;
}

.home-feature {
  padding-bottom: 0px;
  padding-top: 30px;
  margin-top: -220px;
  z-index: 9;
}

@media (max-width: 991px) {
  .home-feature {
    padding-bottom: 0px;
    padding-top: 0px;
    margin-top: 0px;
  }
}

/* 
---------------------------------------------
parallax & home seperator
--------------------------------------------- 
*/
.mini {
  min-height: 215px;
  overflow: hidden;
  position: relative;
  padding-top: 90px;
  padding-bottom: 90px;
}

.mini:before {
  content: '';
  position: absolute;
  width: 140%;
  height: 140%;
  opacity: .95;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  background-image: url(../images/work-process-bg.png);
  z-index: 2;
  top: -20%;
  left: -20%;
    background: linear-gradient(135deg, #6A00FF 0%, #8A2BE2 45%, #FF2D7A 100%);
}

.mini .mini-content {
  position: relative;
  z-index: 3;

}

.mini .mini-content .info {
  text-align: center;
  color: #fff;
  padding-top: 20px;
  padding-bottom: 20px;
}

.mini .mini-content .info small {
  display: block;
  font-weight: 400;
  font-size: 13px;
  margin-bottom: 5px;
}

.mini .mini-content .info strong {
  font-weight: 700;
  font-size: 17px;
  margin-bottom: 40px;
  display: block;
}

.mini .mini-content .info h1 {
  color: #fff;
  font-weight: 500;
  font-size: 28px;
  letter-spacing: 0.25px;
  margin-bottom: 30px;
}

.mini .mini-content .info p {
  letter-spacing: 1px;
  margin-bottom: 40px;
  color: #fff;
  letter-spacing: 0.25px;
  line-height: 26px;
  font-weight: 400;
  font-size: 15px;
}

.mini .mini-content .info p span {
  text-decoration: underline;
}

.mini .mini-content .mini-box {
  display: block;
  background: #fff;
  padding: 20px;
  border-radius: 20px;
  box-shadow: 0 2px 48px 0 rgba(0, 0, 0, 0.08);
  margin-bottom: 30px;
  position: relative;
  -webkit-transition: all 0.3s ease 0s;
  -moz-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
  text-align: center;
}

.mini .mini-content .mini-box:hover {
  margin-top: -10px;
}

.mini .mini-content .mini-box:before {
  content: '';
  position: absolute;
  z-index: -1;
  background: #fff;
  width: 100%;
  opacity: .15;
  height: 100%;
  bottom: -10px;
  left: 0px;
  right: -20px;
  margin: auto;
  border-radius: 20px;
}

.mini .mini-content .mini-box i {
  display: block;
  font-size: 20px;
  margin-bottom: 15px;
}

.mini .mini-content .mini-box span {
  display: block;
  font-weight: 400;
  font-size: 14px;
  color: #777;
  letter-spacing: .75px;
}

.mini .mini-content .mini-box strong {
  display: block;
  font-weight: 400;
  font-size: 17px;
  color: #1e1e1e;
  letter-spacing: 0.25px;
  margin-bottom: 5px;
  margin-top: 20px;
}

.counter {
  overflow: hidden;
  position: relative;
}

.counter:before {
  content: '';
  position: absolute;
  width: 140%;
  height: 140%;
  opacity: .90;
  background-image: url(../images/fun-facts-bg.png);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  z-index: 2;
  top: -20%;
  left: -20%;
}

.counter .content {
  position: relative;
  z-index: 3;
  width: 100%;
   background: linear-gradient(135deg, #6A00FF 0%, #8A2BE2 45%, #FF2D7A 100%);

}

.counter .content .count-item {
  height: 340px;
  position: relative;
  float: left;
  width: 100%;
}

.counter .content .count-item.decoration-bottom {
  position: relative;
}

.counter .content .count-item.decoration-bottom:after {
  content: '';
  position: absolute;
  width: 70%;
  height: 32px;
  top: 160px;
  left: 70%;
  background: url(../images/circle-dec.png) center center no-repeat;
  -webkit-transition: all 0.3s ease 0s;
  -moz-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}

.counter .content .count-item.decoration-top {
  position: relative;
}

.counter .content .count-item.decoration-top:after {
  content: '';
  position: absolute;
  width: 70%;
  height: 32px;
  top: 140px;
  left: 70%;
  background: url(../images/circle-dec.png) center center no-repeat;
  -webkit-transition: all 0.3s ease 0s;
  -moz-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}

.counter .content .count-item:hover strong {
  margin-top: 110px;
}

.counter .content .count-item strong {
  display: block;
  text-align: center;
  font-weight: 600;
  font-size: 36px;
  letter-spacing: 0.25px;
  margin-bottom: 10px;
  color: #fff;
  margin-top: 120px;
  -webkit-transition: all 0.3s ease 0s;
  -moz-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}

.counter .content .count-item span {
  display: block;
  text-align: center;
  color: #fff;
  font-weight: 500;
  font-size: 17px;
  letter-spacing: 0.25px;
}

@media (max-width: 991px) {
  .parallax {
    padding-top: 60px;
    padding-bottom: 60px;
    min-height: auto;
  }
  .parallax .content {
    position: relative !important;
    top: 0% !important;
    transform: perspective(1px) translateY(0%) !important;
  }
  .counter {
    padding-top: 60px;
    padding-bottom: 60px;
  }
  .counter .content {
    position: relative !important;
    top: 0% !important;
    transform: perspective(1px) translateY(0%) !important;
  }
  .counter .content .count-item {
    height: auto;
    padding-top: 20px;
    padding-bottom: 20px;
  }
  .counter .content .count-item:hover strong {
    margin-top: 0px;
  }
  .counter .content .count-item:before {
    display: none;
  }
  .counter .content .count-item:after {
    display: none;
  }
  .counter .content .count-item strong {
    margin-top: 0px;
  }
}

/* 
---------------------------------------------
team
--------------------------------------------- 
*/
.team-item {
  background: #fff;
  border: 1px solid #80808052;
  box-shadow: 0 2px 48px 0 rgba(0, 0, 0, 0.10);
  border-radius: 20px;
  position: relative;
  margin-bottom: 30px;
  padding-bottom: 25px;



  
box-shadow: 0px 6px 5px -4px rgba(125,120,120,0.73);
-webkit-box-shadow: 0px 6px 5px -4px rgba(125,120,120,0.73);
-moz-box-shadow: 0px 6px 5px -4px rgba(125,120,120,0.73);
}

.team-item:hover .team-content .team-info {
  margin-left: 30px;
}

.team-item i {
  display: block;
  margin-left: 25px;
  margin-top: 25px;
  font-size: 30px;
  color: #4E47DE;
  text-align: center;
}

.team-item .user-image {
  width: 60px;
  height: 60px;
  overflow: hidden;
  -webkit-border-radius: 100px;
  -moz-border-radius: 100px;
  border-radius: 100px;
  -webkit-transition: all 0.3s ease 0s;
  -moz-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
  margin-left: 25px;
  float: left;
}

.team-item .team-content {
  text-align: left;
  overflow: hidden;
}

.team-item .team-content .team-info {
  float: left;
  margin-left: 20px;
  margin-top: 8px;
  -webkit-transition: all 0.3s ease 0s;
  -moz-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}

.team-item .team-content .team-info .user-name {
  display: block;
  font-weight: 400;
  font-size: 17px;
  color: #1e1e1e;
  letter-spacing: 0.25px;
  margin-bottom: 5px;
}

.team-item .team-content .team-info span {
  display: block;
  font-weight: 400;
  font-size: 15px;
  color: #ff589e;
  letter-spacing: 0.25px;
}

.team-item .team-content p {
  margin-top: 25px;
  padding-left: 25px;
  padding-right: 25px;
  margin-bottom: 25px;
  font-weight: 400;
  font-size: 15px;
  color: #1b333b;
  letter-spacing: 0.6px;
  line-height: 26px;
}

/* 
---------------------------------------------
pricing
--------------------------------------------- 
*/
.pricing-item {
  background: #FFFFFF;
  box-shadow: 0 2px 48px 0 rgba(0, 0, 0, 0.1);
  border-radius: 20px;
  margin-bottom: 30px;
  margin-top: 20px;
  padding: 30px 0px 40px 0px;
}

.pricing-item.active .pricing-header {
  position: relative;
}

.pricing-item.active .pricing-header .pricing-title {
  color: #1e1e1e;
}

.pricing-item.active .pricing-body .price-wrapper {
  background-color: #ff589e;
}

.pricing-item.active .pricing-body .price-wrapper .currency {
  color: #fff;
}

.pricing-item.active .pricing-body .price-wrapper .price {
  color: #fff;
}

.pricing-item.active .pricing-body .price-wrapper .period {
  color: #fff;
}

.pricing-item .pricing-header {
  text-align: center;
  display: block;
  position: relative;
  padding-bottom: 10px;
}

.pricing-item .pricing-header .pricing-title {
  font-weight: 500;
  font-size: 17px;
  letter-spacing: 0.25px;
  color: #ff109d;
  width: 180px;
  height: 40px;
  line-height: 40px;
  left: 0px;
  right: 0px;
  margin: auto;
}

.pricing-item .pricing-body {
  margin-bottom: 40px;
}

.pricing-item .pricing-body .price-wrapper {
  text-align: center;
  padding-top: 20px;
  padding-bottom: 13px;
  background: #8261ee;
  width: 80%;
  margin: auto;
  margin-bottom: 40px;
  margin-top: 5px;
  border-radius: 20px;
}

.pricing-item .pricing-body .price-wrapper .currency {
  height: 47px;
  font-weight: 500;
  font-size: 32px;
  color: #fff;
  position: relative;
  top: -1px;
}

.pricing-item .pricing-body .price-wrapper .price {
  font-weight: 500;
  font-size: 28px;
  color: #fff;
}

.pricing-item .pricing-body .price-wrapper .period {
  font-weight: 400;
  font-size: 14px;
  color: #fff;
  display: block;
  letter-spacing: 0.88px;
}

.pricing-item .pricing-body .list li {
  text-align: center;
  margin-bottom: 12px;
  font-weight: 400;
  font-size: 13px;
  color: #7a7a7a;
  letter-spacing: 0.25px;
  text-decoration: line-through;
}

.pricing-item .pricing-body .list li.active {
  color: #1b333b;
  text-decoration: none;
}

.pricing-item .pricing-footer {
  text-align: center;
  margin-top: 50px;
}

/* 
---------------------------------------------
blog
--------------------------------------------- 
*/
.blog-post-thumb {
  text-align: center;
  margin-bottom: 30px;
}

.blog-post-thumb.big .img {
  height: 400px;
}

.blog-post-thumb .img {
  overflow: hidden;
  border-radius: 20px;
  position: relative;
  height: 200px;
}

.blog-post-thumb .blog-content {
  margin-top: -30px;
  padding-top: 50px;
}

.blog-post-thumb h3 {
  margin-bottom: 20px !important;
}

.blog-post-thumb h3 a {
  font-weight: 500;
  font-size: 18px;
  color: #1e1e1e;
  letter-spacing: 0.25px;
  line-height: 26px;
  -webkit-transition: all 0.3s ease 0s;
  -moz-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}

.blog-post-thumb h3 a:hover {
  color: #ff589e;
}

.blog-post-thumb .text {
  font-weight: 400;
  font-size: 13px;
  color: #777;
  letter-spacing: 0.26px;
  line-height: 26px;
  margin-bottom: 15px;
}

.blog-post-thumb .post-footer span {
  float: left;
  height: 30px;
  line-height: 30px;
  font-weight: 300;
  font-size: 14px;
  color: #777;
  padding-left: 30px;
}

.blog-post-thumb a.main-button  {
  margin-top: 10px;
  display: inline-block;
}

.blog-list .blog-post-thumb {
  text-align: left;
}


/* 
---------------------------------------------
contact
--------------------------------------------- 
*/

#contact-us {
  
  padding: 160px 0px;

box-shadow: 0px -2px 26px -8px rgba(54,41,130,0.76);
-webkit-box-shadow: 0px -2px 26px -8px rgba(54,41,130,0.76);
-moz-box-shadow: 0px -2px 26px -8px rgba(54,41,130,0.76);
}

#contact-us h5 {
  font-weight: 500;
  font-size: 18px;
  color: #1e1e1e;
  letter-spacing: 0.25px;
  line-height: 26px;
}

.contact-text {
  font-weight: 400;
  font-size: 14px;
  color: #6F8BA4;
  letter-spacing: 0.6px;
  line-height: 26px;
}

.contact-text p {
  margin-bottom: 28px;
}

.contact-form input,
.contact-form textarea {
  color: #777;
  font-size: 14px;
  border: 1px solid rgb(255 102 252 / 44%);
  width: 100%;
  height: 50px;
  outline: none;
  padding-left: 20px;
  padding-right: 20px;
  border-radius: 25px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  margin-bottom: 30px;
}

.contact-form textarea {
  height: 150px;
  resize: none;
  padding: 20px;
}



.contact-form input,
.contact-form textarea:hover{
   border: 1px solid rgb(255 102 252 / 100%);
}
/* 
---------------------------------------------
footer
--------------------------------------------- 
*/
footer {
      background: linear-gradient(
        135deg,
        #12082b 0%,
        #1b1038 40%,
        #2a1247 70%,
        #3a1148 100%
    );
    color: #fff;
  padding-top: 30px;
}

footer .social {
  overflow: hidden;
  margin-top: 10px;
  text-align: center;
}

footer .social li {
  margin: 0px 10px;
  display: inline-block;
}

footer .social li a {
  color: #006df9;
   text-align: center;
  background-color: #fff;
  width: 36px;
  height: 36px;
  line-height: 36px;
  border-radius: 50%;
  display: inline-block;
  font-size: 16px;
  -webkit-transition: all 0.3s ease 0s;
  -moz-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}

footer .social li a:hover {
  background-color: dodgerblue;
  color: #fff;
}

footer .copyright {
  text-align: center;
  border-top: 1px solid rgba(250,250,250,0.2);
  margin-top: 30px;
  padding-top: 30px;
  padding-bottom: 30px;
  font-weight: 400;
  font-size: 12px;
  color: #fff;
  letter-spacing: 0.88px;
  text-transform: uppercase;
}

@media (max-width: 991px) {
  footer .text {
    margin-bottom: 30px;
  }
  footer h5 {
    margin-bottom: 15px;
  }
  footer .footer-nav {
    margin-bottom: 30px;
  }
}

/* 
---------------------------------------------
preloader
--------------------------------------------- 
*/
#preloader {
  overflow: hidden;
  background-image: linear-gradient(135deg, #a759d1 0%, #8261ee 100%);
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  position: fixed;
  z-index: 9999;
  color: #fff;
}

#preloader .jumper {
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  display: block;
  position: absolute;
  margin: auto;
  width: 50px;
  height: 50px;
}

#preloader .jumper > div {
  background-color: #fff;
  width: 10px;
  height: 10px;
  border-radius: 100%;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  position: absolute;
  opacity: 0;
  width: 50px;
  height: 50px;
  -webkit-animation: jumper 1s 0s linear infinite;
  animation: jumper 1s 0s linear infinite;
}

#preloader .jumper > div:nth-child(2) {
  -webkit-animation-delay: 0.33333s;
  animation-delay: 0.33333s;
}

#preloader .jumper > div:nth-child(3) {
  -webkit-animation-delay: 0.66666s;
  animation-delay: 0.66666s;
}

@-webkit-keyframes jumper {
  0% {
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  5% {
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 0;
  }
}

@keyframes jumper {
  0% {
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  5% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}









/* ==========================
   NEW ADDED 

   ========================== */
@media(max-width:768px){

.digital-career-btn-spacer{
    display: block;
  margin-bottom: 10px;
}
}


.service-h1{
margin-bottom: 20px;
}


.service-title-sub-p{
width: 70%;

}


.career-services{
  background-color: #1e3cff14;
  padding: 30px;
  border-radius: 20px;
  margin-bottom: 30px;
  margin-top: 80px;
}


   .services-eyebrow{
font-size: 13px;
   }


.services-h2{
  margin-bottom: 10px;
}


.index-content-heading.light .section-title {
  color: #ffffff;
}

.index-content-heading .section-title {
  font-weight: 500;
  font-size: 24px;
  line-height: 42px;
  color: #1e1e1e;
  letter-spacing: 0.25px;
  margin-bottom: 7px;
  position: relative;
}



.contact-us-main {
    padding: 15px;
    border: 1px solid #ffffff;
    border-radius: 10px;
    color: #ffffff;
    padding-left: 25px;
    padding-right: 25px;
    background: dodgerblue;
}


.contact-us-main:hover {
    border: 1px solid rgb(102, 93, 100);
color: rgb(102, 93, 100);
background: transparent;
}







.service-button-main {
    padding: 15px;
    padding-left: 34px;
    padding-right: 34px;
    border: 2px solid #fdfcfc;
    border-radius: 10px;
    color: #ffffff;
    font-size: 18px;
}


.service-button-main:hover {
    border: 1px solid rgb(1, 183, 255);
color: white;
background: dodgerblue;
}


/* ===========================
SAAS FORM
=========================== */

.saas-form-section{
    padding:80px 20px;
        background: #e9f2ff;
        border-radius: 20px;
}

.saas-form-container{
    max-width:850px;
    margin:auto;
    background:#fff;
    padding:40px;
    border-radius:20px;
    box-shadow:0 15px 40px rgba(0,0,0,.08);
}

.saas-form-title{
    text-align:center;
    font-size:2rem;
    margin-bottom:10px;
}

.saas-form-description{
    text-align:center;
    color:#666;
    margin-bottom:35px;
}

.saas-form-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:20px;
}

.saas-form-group{
    display:flex;
    flex-direction:column;
    margin-bottom:20px;
}

.saas-form-group label{
    margin-bottom:8px;
    font-weight:600;
    color:#333;
}

.saas-form-group input,
.saas-form-group select,
.saas-form-group textarea{

    width:100%;
    padding:14px 16px;
    border:1px solid #d9d9d9;
    border-radius:12px;
    font-size:15px;
    outline:none;
    transition:.3s;
    box-sizing:border-box;
}

.saas-form-group input:focus,
.saas-form-group select:focus,
.saas-form-group textarea:focus{
    border-color:#4f7cff;
    box-shadow:0 0 0 4px rgba(79,124,255,.15);
}

.saas-form-group textarea{
    resize:vertical;
}

.saas-checkbox{
    display:flex;
    align-items:flex-start;
    gap:10px;
    margin:20px 0;
    font-size:14px;
    cursor:pointer;
}

.saas-checkbox input{
    width:auto;
    margin-top:4px;
}

.saas-submit-btn{

    width:100%;
    border:none;
    padding:16px;
    border-radius:12px;
    background:#4f7cff;
    color:#fff;
    font-size:16px;
    font-weight:600;
    cursor:pointer;
    transition:.3s;
}

.saas-submit-btn:hover{
    background:#3a66e0;
}

@media(max-width:768px){

.saas-form-grid{
    grid-template-columns:1fr;
}

.saas-form-container{
    padding:25px;
}

}


/* ======================================================
CAREER COMPARISON TABLE
====================================================== */

.career-table-wrapper{
    width:100%;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    margin:30px 0;
}

.career-comparison-table{
    width:100%;
    min-width:650px;
    border-collapse:collapse;
    background:#fff;
}

.career-comparison-table th,
.career-comparison-table td{
    padding:18px 20px;
    border:1px solid #e5e5e5;
    text-align:left;
    vertical-align:top;
}

.career-comparison-table th{
    background:#f54a88d9;
    color:#fff;
    font-weight:700;
}

.career-comparison-table tr:nth-child(even){
    background:#fafafa;
}


/* Mobile */

@media (max-width:768px){

    .career-comparison-table{
        min-width:520px;
    }

    .career-comparison-table th,
    .career-comparison-table td{
        padding:14px;
        font-size:15px;
    }

}


/* ======================================================
CAREER COMPARISON TABLE END
====================================================== */


p.h1-subtitle {
    color: gray;
    font-size: 13px;
}


   







.digital-career-custom-button{
    display:inline-block;
    width:100%;
    max-width:255px;
    padding:15px 20px;

    border:1px solid #008cff;
    border-radius:10px;

    background:transparent;
    color:#008cff;

    text-align:center;
    text-decoration:none;
    font-weight:600;


    transition:all .3s ease;
    box-sizing:border-box;
      font-size:15px;
}

.digital-career-custom-button:hover,
.digital-career-custom-button:focus{
    background:#008cff;
    color:#fff;
    text-decoration:none;
}

@media (max-width:768px){

    .digital-career-custom-button{
        max-width:100%;
        padding:14px 18px;
        font-size:15px;
    }

}

@media (max-width:480px){

    .digital-career-custom-button{
        padding:13px 16px;
        font-size:14px;
    }

}











.legal-p{
  margin-top: 20px;
  margin-bottom: -70px;
}


.global-about-image{
 
  margin-bottom: 20px;
  width: 30%;
}

.about-image-container{
 display: flex;  
  justify-content: center;
}








button.intro-cta-project-overview {
    border: none;
    background: none;
}



/* =========================
SAAS CAREER WEB PRICING START
========================= */

/* ======================================================
   PREMIUM SAAS PRICING
====================================================== */

.website-saas-section{
    position:relative;
    overflow:hidden;
    padding:120px 20px;
    background:
        radial-gradient(circle at top left,#dbeafe 0%,transparent 35%),
        radial-gradient(circle at bottom right,#e0f2fe 0%,transparent 40%),
        linear-gradient(180deg,#ffffff 0%,#f8fbff 100%);
}

.website-saas-container{
    max-width:1280px;
    margin:auto;
    position:relative;
    z-index:2;
}

/* Header */

.website-saas-header{
    text-align:center;
    margin-bottom:70px;
}

.website-saas-header h2{

    font-size:3rem;
    font-weight:800;
    letter-spacing:-1px;
    color:#0f172a;
    margin-bottom:18px;
    line-height:1.2;

}

.website-saas-header p{

    max-width:760px;
    margin:auto;
    color:#64748b;
    font-size:1.08rem;
    line-height:1.9;

}


/* Grid */

.website-pricing-grid{

    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(340px,1fr));
    gap:38px;

}


/* Card */

.website-plan-card{

    position:relative;

    padding:48px 40px;

    border-radius:30px;

    background:rgba(255,255,255,.75);

    backdrop-filter:blur(18px);

    -webkit-backdrop-filter:blur(18px);

    border:1px solid rgba(255,255,255,.6);

    box-shadow:

        0 25px 70px rgba(15,23,42,.08),

        0 8px 30px rgba(15,23,42,.05);

    transition:.45s ease;

    overflow:hidden;

}

/* gradient border */

.website-plan-card::before{

    content:"";

    position:absolute;

    inset:0;

    padding:1px;

    border-radius:30px;

    background:linear-gradient(
        135deg,
        rgba(255,255,255,.9),
        rgba(59,130,246,.15),
        rgba(99,102,241,.18)
    );

    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);

    -webkit-mask-composite:xor;
            mask-composite:exclude;

}

.website-plan-card:hover{

    transform:translateY(-14px);

    box-shadow:

        0 35px 90px rgba(37,99,235,.18),

        0 12px 45px rgba(15,23,42,.10);

}


/* Featured */

.website-featured-plan{

    transform:scale(1.05);

    background:linear-gradient(
        180deg,
        #ffffff,
        #f7fbff
    );

    border:1px solid rgba(37,99,235,.25);

    box-shadow:

        0 0 0 2px rgba(37,99,235,.12),

        0 35px 100px rgba(37,99,235,.18);

}

.website-featured-plan::after{

    content:"";

    position:absolute;

    width:220px;
    height:220px;

    top:-100px;
    right:-80px;

    border-radius:50%;

    background:rgba(59,130,246,.12);

    filter:blur(60px);

}

.website-featured-plan:hover{

    transform:translateY(-15px) scale(1.05);

}


/* Badge */

.website-plan-badge{

    position:absolute;

    left:50%;

    top:-16px;

    transform:translateX(-50%);

    padding:11px 28px;

    border-radius:999px;

    background:linear-gradient(
        135deg,
        #2563eb,
        #4f46e5
    );

    color:#fff;

    font-size:.82rem;

    font-weight:700;

    letter-spacing:.8px;

    box-shadow:0 15px 35px rgba(37,99,235,.35);

}


/* Title */

.website-plan-top{

    text-align:center;

    margin-bottom:36px;

}

.website-plan-top h3{

    font-size:2rem;

    color:#0f172a;

    margin-bottom:12px;

    font-weight:700;

}

.website-plan-subtitle{

    color:#64748b;

    line-height:1.8;

}


/* Price */

.website-plan-price{

    margin-top:30px;

}

.website-plan-price span{

    font-size:3.6rem;

    font-weight:800;

    color:#2563eb;

    letter-spacing:-2px;

}

.website-plan-price small{

    display:block;

    margin-top:10px;

    color:#94a3b8;

    font-size:.95rem;

}


/* Features */

.website-feature-list{

    list-style:none;

    padding:0;

    margin:40px 0 0;

}

.website-feature-list li{

    display:flex;

    align-items:center;

    gap:12px;

    padding:16px 0;

    color:#334155;

    border-bottom:1px solid rgba(148,163,184,.18);

}

.website-feature-list li:last-child{

    border:none;

}

.website-feature-list li::before{

    content:"✓";

    width:28px;

    height:28px;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    background:#ecfdf5;

    color:#10b981;

    font-weight:700;

    flex-shrink:0;

}


/* Button */

.website-plan-button{

    display:block;

    margin-top:42px;

    text-align:center;

    text-decoration:none;

    padding:17px;

    border-radius:16px;

    font-weight:700;

    font-size:1rem;

    color:#fff;

    background:linear-gradient(
        135deg,
        #2563eb,
        #4f46e5
    );

    box-shadow:

        0 15px 35px rgba(37,99,235,.30);

    transition:.35s;

}

.website-plan-button:hover{

    transform:translateY(-3px);

    box-shadow:

        0 22px 45px rgba(37,99,235,.40);

}


/* Responsive */

@media(max-width:992px){

    .website-featured-plan{

        transform:none;

    }

    .website-featured-plan:hover{

        transform:translateY(-12px);

    }

}

@media(max-width:768px){

    .website-saas-section{

        padding:90px 18px;

    }

    .website-saas-header h2{

        font-size:2.2rem;

    }

    .website-plan-card{

        padding:38px 28px;

    }

    .website-plan-price span{

        font-size:3rem;

    }

}


/* =========================
SAAS CAREER WEB PRICING END
========================= */

   

/* =========================
SAAS CAREER PRICING
========================= */


.saas-career-section {
    padding: 90px 20px;
    background: #c7e3ff61;
    border: 1px solid #c7e3ff99;
    border-radius: 20px;
    box-sizing: border-box;
    width: 100%;
    overflow: auto;
}

/* Tablet */
@media (max-width: 992px) {
    .saas-career-section {
        padding: 70px 18px;
        border-radius: 18px;
    }
}

/* Mobile */
@media (max-width: 768px) {
    .saas-career-section {
        padding: 50px 16px;
        border-radius: 16px;
    }
}

/* iPhone SE and small phones */
@media (max-width: 390px) {
    .saas-career-section {
        padding: 40px, 12px;
      
        border-radius: 14px;
   
    }
}

/* Extra small phones */
@media (max-width: 320px) {
    .saas-career-section {
        padding: 35px 10px;
        border-radius: 12px;
    }
}






.saas-container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding-left: 20px;
    padding-right: 20px;
    box-sizing: border-box;
}

/* Large tablets and smaller laptops */
@media (max-width: 992px) {
    .saas-container {
        padding-left: 18px;
        padding-right: 18px;
    }
}

/* Tablets and mobile devices */
@media (max-width: 768px) {
    .saas-container {
        padding-left: 16px;
        padding-right: 16px;
        max-width: 100%;
    }
}

/* iPhone SE, small phones (375px and below) */
@media (max-width: 390px) {
    .saas-container {
        padding-left: 12px;
        padding-right: 12px;
    }
}

/* Very small phones */
@media (max-width: 320px) {
    .saas-container {
        padding-left: 10px;
        padding-right: 10px;
    }
}



.saas-header{

text-align:center;
max-width:750px;
margin:auto;
margin-bottom:60px;

}



.saas-header h2{

font-size: 2.5rem;
    color: #1f2937;
    margin-bottom: 15px;

}



.saas-header p{

font-size:18px;
line-height:1.8;
color:#566d8d;


}






.saas-pricing-grid{

display:grid;
grid-template-columns:repeat(3,1fr);
gap:30px;

}







.saas-card{


background:white;

border-radius:24px;

padding:40px 35px;

position:relative;

    border: 1px solid #ff49e2;

box-shadow:

0 15px 40px rgba(15,23,42,.08);

transition:.3s;


}





.saas-card:hover{

transform:translateY(-10px);

box-shadow:

0 25px 60px rgba(15,23,42,.15);

}





.saas-card.popular{

border:2px solid #2563eb;

transform:scale(1.05);

}




.saas-card.popular:hover{

transform:scale(1.05) translateY(-10px);

}





.saas-badge{


position:absolute;

top:-18px;

left:50%;

transform:translateX(-50%);


background:#2563eb;

color:white;

padding:8px 15px;

border-radius:50px;

font-size:14px;

font-weight:700;


}







.saas-card-top h3{

font-size: 1.8rem;
    margin-bottom: 10px;
    color: rgb(17, 24, 39);

}



.saas-subtitle{

color: #1b333b;

min-height:50px;

line-height:1.6;

}





.saas-price{

margin:30px 0;

}



.saas-price span{


font-size:48px;

font-weight:500;

color: #2563eb;

display:block;


}



.saas-price small{

color:#64748b;

}





.saas-features{


list-style:none;

padding:0;

margin:30px 0;


}



.saas-features li{


display:flex;

gap:12px;

align-items:center;

margin-bottom:18px;

color:#334155;

font-size:16px;


}




.saas-features i{


width:25px;

height:25px;

display:flex;

align-items:center;

justify-content:center;

border-radius:50%;

background:#dcfce7;

color:#16a34a;

font-style:normal;

font-weight:bold;


}






.saas-button{


display:block;

text-align:center;

background:#111827;

color:white;

padding:15px 25px;

border-radius:12px;

font-weight:700;

text-decoration:none;

transition:.3s;


}



.saas-button:hover{

background:#2563eb;

color:white;

}







@media(max-width:992px){


.saas-pricing-grid{

grid-template-columns:1fr;

}


.saas-card.popular{

transform:none;

}


.saas-card.popular:hover{

transform:translateY(-10px);

}


.saas-header h2{

font-size:32px;

}


}

/*END SAAS*/



/*Rates Convertions*/

/* SaaS Pricing Conversion Table */
/* Premium SaaS Currency Table */

.pricing-conversion-table{
    width:100%;
    margin:50px auto;
    background:linear-gradient(145deg,#ffffff,#f8fafc);
    border-radius:24px;
    padding:35px;
    box-shadow:
        0 20px 50px rgba(15,23,42,.10);
    border:1px solid rgba(226,232,240,.8);
    overflow-x:auto;
    
}


/* Table */

.pricing-conversion-table table{
    width:100%;
    min-width:850px;
    border-collapse:separate;
    border-spacing:0 12px;
    font-family:"Inter","Segoe UI",sans-serif;
}


/* Header */

.pricing-conversion-table thead th{

    padding:20px;
    background: linear-gradient(135deg, rgb(139, 92, 246), rgb(109, 77, 240));
    color:#fff;
    font-size:15px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.8px;
    border:none;

}


.pricing-conversion-table thead th:first-child{
    border-radius:16px 0 0 16px;
    
}

.pricing-conversion-table thead th:last-child{
    border-radius:0 16px 16px 0;
}



/* Rows */

.pricing-conversion-table tbody tr{

    background:#ffffff;
    box-shadow:
        0 8px 25px rgba(15,23,42,.05);
    transition:.35s ease;

}


.pricing-conversion-table tbody tr:hover{

    transform:translateY(-5px);

    box-shadow:
        0 15px 35px rgba(15,23,42,.12);

}


/* Cells */

.pricing-conversion-table td{

    padding:22px 20px;
    text-align:center;
    color:#475569;
    font-size:15px;
    border-top:1px solid #f1f5f9;
    border-bottom:1px solid #f1f5f9;

}


.pricing-conversion-table td:first-child{

    text-align:left;
    font-weight:700;
    color:#0f172a;
    border-radius:16px 0 0 16px;

}


.pricing-conversion-table td:last-child{

    border-radius:0 16px 16px 0;

}


/* Currency */

.pricing-conversion-table td:nth-child(2){

    color:#64748b;
    font-weight:600;

}


/* Plan Pricing */

.pricing-conversion-table td:nth-child(3),
.pricing-conversion-table td:nth-child(4),
.pricing-conversion-table td:nth-child(5){

    font-size:18px;
    font-weight:800;

}


/* Basic */

.pricing-conversion-table td:nth-child(3){

    color:#2563eb;
font-weight: 500;
}


/* Premium Featured */

.pricing-conversion-table th:nth-child(4){

       background: linear-gradient(135deg, rgb(173 37 235), rgb(79, 70, 229));

}


.pricing-conversion-table td:nth-child(4){

    color:#2563eb;
    background:#eff6ff;
    font-weight: 500;

}


/* Advanced */

.pricing-conversion-table td:nth-child(5){

    color:#7c3aed;
    background:#faf5ff;
     font-weight:500;

}



/* Premium Badge */

.pricing-conversion-table th:nth-child(4)::after{

    content:" MOST POPULAR";

    display:block;
    margin-top:8px;

    font-size:10px;
    letter-spacing:.5px;

    color:#dbeafe;

}



/* Note */

.price-note{

    margin-top:30px;
    padding:18px 22px;

    background:#0f172a;
    color:#cbd5e1;

    border-radius:16px;

    font-size:14px;
    line-height:1.7;

    box-shadow:
        0 10px 25px rgba(15,23,42,.15);

}


/* Mobile */

@media(max-width:768px){

    .pricing-conversion-table{

        padding:20px;
        border-radius:18px;

    }


    .pricing-conversion-table table{

        min-width:800px;

    }

}
/* Rates convertion END */










/* Career Comparison Table */

.table-responsive{
    overflow-x:auto;
    margin:40px 0;
    border-radius:18px;
    border: 1px solid #db89eb75

    
}

.career-comparison-table{
    width:100%;
    min-width:700px;
    border-collapse:separate;
    border-spacing:0;
    background:#fff;
    border-radius:18px;
    overflow:hidden;
    box-shadow:
        0 8px 30px rgba(17,24,39,.08),
        0 2px 8px rgba(17,24,39,.05);
    border:1px solid #eceff5;
}

.career-comparison-table thead th{
    background:linear-gradient(135deg,#8b5cf6,#6d4df0);
    color:#fff;
    padding:20px 24px;
    text-align:center;
    font-size:1rem;
    font-weight:700;
    letter-spacing:.5px;
    border:none;
    position:relative;
}

.career-comparison-table thead th::after{
    content:"";
    position:absolute;
    left:0;
    bottom:0;
    width:100%;
    height:1px;
    background:rgba(255,255,255,.18);
}

.career-comparison-table td{
    padding:18px 22px;
    border-bottom:1px solid #f1f3f8;
    text-align:center;
    color:#555;
    font-size:.97rem;
    transition:.25s ease;

    
}

.career-comparison-table td:first-child{
    text-align:left;
        font-weight: 500;
    color: rgb(52 89 137);
    background:#fcfcff;
}

.career-comparison-table tbody tr:nth-child(even){
    background:#fafbff;
}

.career-comparison-table tbody tr:hover{
    background:#f4f1ff;
    transform:scale(1.003);
    box-shadow:inset 4px 0 0 #8261ee;
}

.career-comparison-table tbody tr:last-child td{
    border-bottom:none;
}

/* Rounded corners */
.career-comparison-table thead th:first-child{
    border-top-left-radius:18px;
}

.career-comparison-table thead th:last-child{
    border-top-right-radius:18px;
}

.career-comparison-table tbody tr:last-child td:first-child{
    border-bottom-left-radius:18px;
}

.career-comparison-table tbody tr:last-child td:last-child{
    border-bottom-right-radius:18px;
}

@media (max-width:767px){

    .career-comparison-table{
        min-width:650px;
    }

    .career-comparison-table th,
    .career-comparison-table td{
        padding:14px 16px;
        font-size:.92rem;
    }

}
/* Career Comparison Table end */






.career-view-template{
 border: none;
 background-color: transparent;
  color: blue;
  font-size: 16px;
  display: block;
}




.career-view-template:hover{
  color: rgba(0, 0, 255, 0.664);
}



.button-group {
    
    gap: 15px;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}


.custom-web-consultation-btn {
    display: inline-block;
    background: #8261ee;
    color: #fff;
    border: none;
    padding: 12px 30px;
    border-radius: 30px;
    cursor: pointer;
    font-size: 16px;
    text-align: center;
    transition: .3s;
}

/* .custom-web-consultation-btn:hover {
    background: #6c4dd8;
} */


/* Automatically stack buttons on mobile */
@media (max-width: 600px) {

    .button-group {
        flex-direction: column;
        width: 100%;
    }

    .custom-web-consultation-btn {
        width: 100%;
        max-width: 300px;
    }

}

















   span.career-steps-color {
    color: #ff109bd8;
}


/* ===========================
   Lightbox 1
=========================== */

/* Button */
.lightbox-btn{
    background: #f50000db;
    color:#fff;
    border:none;
    padding:12px 30px;
    border-radius:30px;
    cursor:pointer;
    font-size:16px;
    transition:background .3s;
}

.lightbox-btn:hover{
    background: #ff4242f5;
}

/* Overlay */
.lightbox{
    display:none;
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;

    background:rgba(0,0,0,.7);
    z-index:9999;

    justify-content:center;
    align-items:flex-start;

    padding:40px 20px;
    overflow-y:auto;
    box-sizing:border-box;
}

/* Content */
.lightbox-content{
    background:#fff;
    width:100%;
    max-width:700px;
    max-height:90vh;

    overflow-y:auto;

    border-radius:12px;
    padding:30px;
    position:relative;
    box-sizing:border-box;

    animation:fadeIn .3s ease;
}

/* Heading */
.lightbox-content h2{
    margin-bottom:15px;
}

/* Paragraph */
.lightbox-content p{
    line-height:1.8;
    color: #1b333b;
}

/* Close Button */
.close-btn{
    position:sticky;
    top:0;
    float:right;

    font-size:30px;
    color:red;
    cursor:pointer;
    background:#fff;
    z-index:10;
}

.close-btn:hover{
    color:#000;
}

/* Responsive */
@media (max-width:768px){

    .lightbox{
        padding:20px 10px;
    }

    .lightbox-content{
        padding:20px;
        max-height:95vh;
    }

}

/* Animation */
@keyframes fadeIn{

    from{
        opacity:0;
        transform:scale(.95);
    }

    to{
        opacity:1;
        transform:scale(1);
    }

}

/* ===========================
   End Lightbox 1
=========================== */








/* ===========================
   Lightbox 2 Start
=========================== */

/* Button */
.lightbox2-btn{
    background: #f50000db;
    color:#fff;
    border:none;
    padding:12px 30px;
    border-radius:30px;
    cursor:pointer;
    font-size:16px;
    transition:background .3s;
}

.lightbox2-btn:hover{
   background: #ff4242f5;
}

/* Overlay */
.lightbox2{
    display:none;
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;

    background:rgba(0,0,0,.7);
    z-index:9999;

    justify-content:center;
    align-items:flex-start;

    padding:40px 20px;
    overflow-y:auto;
    box-sizing:border-box;
}

/* Content */
.lightbox2-content{
    background:#fff;
    width:100%;
    max-width:700px;
    max-height:90vh;

    overflow-y:auto;

    border-radius:12px;
    padding:30px;
    position:relative;
    box-sizing:border-box;

    animation:fadeIn2 .3s ease;
}

/* Heading */
.lightbox2-content h2{
    margin-bottom:15px;
}

/* Paragraph */
.lightbox2-content p{
    line-height:1.8;
    color:#1b333b;
}

/* Close Button */
.close2-btn{
    position:sticky;
    top:0;
    float:right;

    font-size:30px;
    color:red;
    cursor:pointer;
    background:#fff;
    z-index:10;
}

.close2-btn:hover{
    color:#000;
}

/* Responsive */
@media (max-width:768px){

    .lightbox2{
        padding:20px 10px;
    }

    .lightbox2-content{
        padding:20px;
        max-height:95vh;
    }

}

/* Animation */
@keyframes fadeIn2{

    from{
        opacity:0;
        transform:scale(.95);
    }

    to{
        opacity:1;
        transform:scale(1);
    }

}

/* ===========================
   End Lightbox 2
=========================== */








.section.colored {
    background: #f2f2fe;
    border-radius: 10px;
    margin-top: 20px;
}

.notice-career{
 color: rgb(255 120 0);
 font-weight: 600;
 font-size: 19px;
 margin-top: 30px;
 margin-bottom:6px;
}

span.career-plan-title {
    font-weight: 500;
    display: block;
    color: #ff109d;
    margin-top: 40px;
}

.career-h4 {
    color: rgb(0 0 0);
    font-size: 19px;
    margin-top: 30px;
    margin-bottom: 10px;
}

.career-plan-button {
	background: transparent;
		color: rgb(26, 26, 29);
	border: none;
	padding: 14px 28px;
	border-radius: 8px;
	font-size: 20px;
	cursor: pointer;
	transition: 0.3s;
}


.career-plan-button:hover {
	opacity: 0.85;
}



/* Modal Background */

.career-modal {

	display: none;

	position: fixed;

	z-index: 9999;

	left: 0;
	top: 0;

	width: 100%;
	height: 100%;

	background: rgba(0,0,0,0.65);

	overflow-y: auto;

	padding: 40px 15px;

}



/* Modal Box */

.career-modal-content {

	background: #ffffff;

	max-width: 900px;

	margin: auto;

	padding: 35px;

	border-radius: 12px;

	position: relative;

}



/* Close Button */

.career-modal-close {

	position: absolute;

	right: 20px;

	top: 15px;

	font-size: 32px;

	border: none;

	background: transparent;

	cursor: pointer;

	color: #333;

}


.visually-hidden{
  margin-bottom: 20px;
}


.visually-hidden-legal {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
}


.legal-and{
      color: #009deb;
}

.theme-btn{
    --primary:#6A3DFF;
    --secondary:#FF2E93;
    --shadow:rgba(140,80,255,.45);

    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:14px;

    padding:7px 25px;

    margin-top: 10px;

    font-size:0.8rem;
    font-weight:700;
    letter-spacing:.3px;
    text-decoration:none;
    color:#fff;

    background:linear-gradient(135deg,var(--primary),var(--secondary));
    border:none;
    border-radius:60px;

    position:relative;
    overflow:hidden;

    box-shadow:
        0 10px 30px rgba(106,61,255,.35),
        0 0 25px rgba(255,46,147,.25);

    transition:
        transform .35s ease,
        box-shadow .35s ease,
        filter .35s ease;
}

/* Glass highlight */
.theme-btn::before{
    content:"";
    position:absolute;
    top:0;
    left:-120%;
    width:60%;
    height:100%;

    background:linear-gradient(
        120deg,
        transparent,
        rgba(255,255,255,.75),
        transparent
    );

    transform:skewX(-25deg);
    transition:.8s;
}

/* Glow border */
.theme-btn::after{
    content:"";
    position:absolute;
    inset:0;
    border-radius:inherit;
    padding:2px;

    background:linear-gradient(
        135deg,
        rgba(255,255,255,.7),
        rgba(255,255,255,0)
    );

    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);

    -webkit-mask-composite:xor;
            mask-composite:exclude;

    opacity:.5;
}

.theme-btn:hover{
    transform:translateY(-4px) scale(1.02);

    box-shadow:
        0 16px 40px rgba(106,61,255,.45),
        0 0 40px rgba(255,46,147,.45);

    filter:saturate(1.1);
}

.theme-btn:hover::before{
    left:150%;
}

.theme-btn i{
    width:42px;
    height:42px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:50%;
    background:rgba(255,255,255,.18);
    backdrop-filter:blur(12px);

    transition:.35s;
}

.theme-btn:hover i{
    transform:translateX(6px) rotate(-8deg);
    background:#fff;
    color:#8a38ff;
}

.theme-btn:active{
    transform:scale(.98);
}












.custom-web-consultation-btn{
    --primary:#6A3DFF;
    --secondary:#FF2E93;
    --shadow:rgba(140,80,255,.45);

    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:14px;

    padding:10px 25px;

    margin-top: 20px;

    font-size:0.8rem;
    font-weight:700;
    letter-spacing:.3px;
    text-decoration:none;
    color:#fff;

    background:linear-gradient(135deg,var(--primary),var(--secondary));
    border:none;
    border-radius:60px;

    position:relative;
    overflow:hidden;

    box-shadow:
        0 10px 30px rgba(106,61,255,.35),
        0 0 25px rgba(255,46,147,.25);

    transition:
        transform .35s ease,
        box-shadow .35s ease,
        filter .35s ease;
}

/* Glass highlight */
.custom-web-consultation-btn::before{
    content:"";
    position:absolute;
    top:0;
    left:-120%;
    width:60%;
    height:100%;

    background:linear-gradient(
        120deg,
        transparent,
        rgba(255,255,255,.75),
        transparent
    );

    transform:skewX(-25deg);
    transition:.8s;
}

/* Glow border */
.custom-web-consultation-btn::after{
    content:"";
    position:absolute;
    inset:0;
    border-radius:inherit;
    padding:2px;

    background:linear-gradient(
        135deg,
        rgba(255,255,255,.7),
        rgba(255,255,255,0)
    );

    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);

    -webkit-mask-composite:xor;
            mask-composite:exclude;

    opacity:.5;
}

.custom-web-consultation-btn:hover{
    transform:translateY(-4px) scale(1.02);

    box-shadow:
        0 16px 40px rgba(106,61,255,.45),
        0 0 40px rgba(255,46,147,.45);

    filter:saturate(1.1);
}

.custom-web-consultation-btn:hover::before{
    left:150%;
}

.custom-web-consultation-btn i{
    width:42px;
    height:42px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:50%;
    background:rgba(255,255,255,.18);
    backdrop-filter:blur(12px);

    transition:.35s;
}

.custom-web-consultation-btn:hover i{
    transform:translateX(6px) rotate(-8deg);
    background:#fff;
    color:#8a38ff;
}

.custom-web-consultation-btn:active{
    transform:scale(.98);
}









 .breadcrumb{
    max-width:1200px;
    margin:100px auto 40px;
    padding:0 20px;
    font-size:15px;
    margin-top: -10px;
    background: none;
}

.breadcrumb ol{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    list-style:none;
    margin:0;
    padding:0;
}

.breadcrumb li{
    display:flex;
    align-items:center;
}

.breadcrumb li+li::before{
    content:"›";
    color:#999;
    margin:0 10px;
}

.breadcrumb a{
    color:#0d6efd;
    text-decoration:none;
}

.breadcrumb a:hover{
    text-decoration:underline;
}

.breadcrumb [aria-current="page"]{
    color: #ff109d;
    font-weight:400;
}







 .global-content-image {
    display: block;
    border: 1px solid #df79f97d;
    width: 100%;
    max-width: 600px;   /* Change this value to your desired size */
    height: auto;
    margin: 0 auto;
    border-radius: 12px; /* Optional */
    margin-bottom: 20px;

box-shadow: 0px 1px 24px 0px rgba(234,128,255,0.75);
-webkit-box-shadow: 0px 1px 24px 0px rgba(234,128,255,0.75);
-moz-box-shadow: 0px 1px 24px 0px rgba(234,128,255,0.75);
}

.skip-link {
    position: absolute;
    top: -40px;
    left: 0;
    background: #000000;
    color: #ffffff;
    padding: 8px 16px;
    z-index: 99999;
    text-decoration: none;
    font-weight: bold;
    border-radius: 0 0 4px 0;
    transition: top 0.2s ease-in-out;
}

.skip-link:focus {
    top: 0;
    outline: 3px solid #005fcc;
    outline-offset: 2px;
}







   .back-to-policies{
    display: block;
    margin-bottom: 20px;
    color: #0087ff;
    background-color: transparent;
    border:none;
   }


   .back-to-policies:hover{
  color: gray;
   border:none;
   }


.custom-h2{
    font-size:1.3rem;
    font-weight:700;
    color: rgb(45 35 19);
    letter-spacing:.5px;
    margin-bottom: 6px;
    margin-top: 35px;

    
    /* padding-left: 1.8rem; */
    padding-bottom: 0.2rem;
    /* text-indent: -1.8rem; */
}



/* Mobile */
@media (max-width: 767px){
    .custom-h2{
        font-size: 1.4rem;
        line-height: 1.4;
        letter-spacing: .3px;
        margin-top: 24px;
    }
}

/* Small phones */
@media (max-width: 575px){
    .custom-h2{
        font-size: 1.3rem;
        line-height: 1.4;
        letter-spacing: .2px;
        margin-top: 30px;
    }
  }


.custom-h3{
  margin-top: 30px;
  margin-bottom: 10px;
}

.policy-p{
  color: #1b333b;
  margin-bottom: 20px;
}





   .policy-list {
    list-style: none;
    padding: 0;
    margin: 0;
}



.policy-list  li {
    position: relative;
    padding-left: 35px;
    margin-bottom: 18px;
    font-size: 16px;
    line-height: 1.7;
   color: #1b333b;
    font-weight: 400;
   
}

.policy-list  li::before {
    content: "⦿";
    position: absolute;
    left: 0;
    top: 2px;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: #9a40e47e;
    color: #fff;
    font-size: 14px;
    font-weight: bold;
    display: flex;
    align-items: center;
    justify-content: center;
}



/* Desktop */
.policy-container {
    padding: 50px;
    width: 57%;
    margin: 150px auto 7%;
    position: relative;
    border: 1px solid #d983df69;
    border-radius: 20px;
}


/* Tablets */
@media (max-width: 991px) {
    .policy-container {
       width: 90%;
    }
}

/* Mobile */
@media (max-width: 767px) {
    .policy-container {
        width: 90%;
    }
}

/* Small phones (iPhone SE, etc.) */
@media (max-width: 375px) {
    .policy-container {
       width: 90%;
    }
}




/* 
---------------------------------------------
policy container
--------------------------------------------- 
*/



p.updated {
    margin-top: 10px;
    margin-bottom: 20px;
    font-size: 12px;
}


.last-updated{
      color: #9a9f9f;
font-weight: 500;
}





@media (max-width: 820px) {
  .welcome-area .header-text-policy {
    top: 25% !important;
    transform: perspective(1px) translateY(-60%) !important;
  }
   .welcome-area .header-text-policy h1 {
    font-size: 22px;
    line-height: 30px;
    margin-bottom: 15px;
  }
  .welcome-area .header-text-policy p {
    margin-bottom: 20px;
  }
}



@media (max-width: 767px) {
  .welcome-area {
    margin-bottom: 100px;
  }
  .welcome-area .header-text-policy {
    top: 25% !important;
    transform: perspective(1px) translateY(-50%) !important;
    text-align: center;
  }
  .welcome-area .header-text-policy .buttons {
    display: none;
  }
  .welcome-area .header-text-policy h1 {
    font-weight: 600;
    font-size: 24px !important;
    line-height: 30px !important;
    margin-bottom: 30px !important;
  }
  .welcome-area .header-text-policy h1 span {
    color: #fff;
  }
  .welcome-area .header-text-policy p {
    text-align: center;
    color: #fff;
    font-size: 14px;
    line-height: 22px;
    margin-bottom: 40px;
  }
}






@media (max-width: 375px) {
  .welcome-area {
    margin-bottom: 100px;
  }
  .welcome-area .header-text-policy {
    top: 30% !important;
    transform: perspective(1px) translateY(-50%) !important;
    text-align: center;
  }
  .welcome-area .header-text-policy .buttons {
    display: none;
  }
  .welcome-area .header-text-policy h1 {
    font-weight: 600;
    font-size: 20px !important;
    line-height: 30px !important;
    margin-bottom: 30px !important;
  }
  .welcome-area .header-text-policy h1 span {
    color: #fff;
  }
  .welcome-area .header-text-policy p {
    text-align: center;
    color: #fff;
    font-size: 14px;
    line-height: 22px;
    margin-bottom: 40px;
  }
}






   .img-fluid {
    max-width: 70% !important;
    height: auto;
}


.frequenty{
  color: #ff3aa6;
}


  .row-contact-form{
    display: flex;
    justify-content: center;
}



   h3.policy-title {
    text-align: center;
    margin-top: 30px;

}




.view-color{
    display: inline-block;
    margin-top: 20px;
  font-weight: 500;
}



.notice-policy{
    color: rgb(255 120 0) !important;
    margin-bottom: 5px;
    font-weight: 700;


}

.notice{
  color: yellow !important;
  margin-bottom: 5px;
  font-weight: 700;
  
}

.notice-p{
  color: white !important;
  
}





 
/* Metrics Strip */



.intro-metrics {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 50px;
	padding: 40px 50px;
	border-radius: 20px;
	margin-bottom: 60px;
	position: relative;
	overflow: hidden;
}



@media (max-width: 375px) {
    .intro-metrics {
        display: inline !important;

    }

   
}


@media (max-width: 767px) {
    .intro-metrics {
       display: inline !important;
    }

}


@media (max-width: 991px) {
    .intro-metrics {
        display: inline !important;
    }
  }




.intro-metrics::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 1px;
	background: linear-gradient(90deg, transparent, rgb(253 255 255 / 52%), transparent);
}

.metric-item {
	text-align: center;
}

.metric-value {
	
  color:white;
	font-size: 42px;
	font-weight: 700;
	
}

.metric-suffix {
	
	font-size: 28px;
	font-weight: 700;
	background: linear-gradient(135deg, var(--primary), var(--accent));
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
}

.metric-label {
	display: block;
	font-size: 15px;
	color: white;
	margin-top: 8px;
	letter-spacing: 1px;
}

.metric-divider {
	width: 1px;
	height: 50px;
	background: linear-gradient(180deg, transparent, rgba(255, 255, 255, 0.15), transparent);
}






/* =========================================================
   SERVICES CARD GRID
   Premium responsive SaaS layout
   ========================================================= */

.intro-values {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 28px;

    width: 100%;
    margin: 20px 0 65px;

    align-items: stretch;
}


/* =========================================================
   CARD LINK
   Makes the entire card clickable and equal height
   ========================================================= */

.intro-cta-primary-services {
    display: flex;
    width: 100%;
    height: 100%;

    color: inherit;
    text-decoration: none;

    align-items: stretch;
}


/* =========================================================
   VALUE CARD
   ========================================================= */

.value-card {
    position: relative;

    display: flex;
    flex-direction: column;

    width: 100%;
    height: 390px;
    min-height: 390px;

    box-sizing: border-box;

    padding: 32px 30px;

    background: #ffffff;

    border: 1px solid rgba(44, 101, 189, 30%);
    border-radius: 20px;

    overflow: hidden;

    box-shadow:
        0 8px 25px rgba(31, 55, 86, 0.06),
        0 2px 6px rgba(31, 55, 86, 0.04);

    transition:
        transform 0.3s ease,
        border-color 0.3s ease,
        box-shadow 0.3s ease,
        background-color 0.3s ease;
}


/* =========================================================
   TOP ACCENT LINE
   ========================================================= */

.value-card::before {
    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 100%;
    height: 3px;

    background: linear-gradient(
        90deg,
        #2c65bd,
        #ff7c08
    );

    opacity: 0.9;
}


/* =========================================================
   SUBTLE CARD GLOW
   ========================================================= */

.value-card::after {
    content: "";

    position: absolute;

    width: 150px;
    height: 150px;

    top: -75px;
    right: -75px;

    background: rgba(44, 101, 189, 0.04);

    border-radius: 50%;

    pointer-events: none;
}


/* =========================================================
   HOVER
   ========================================================= */

.intro-cta-primary-services:hover .value-card {
    transform: translateY(-6px);

    border-color: rgba(44, 101, 189, 0.30);

    box-shadow:
        0 18px 40px rgba(31, 55, 86, 0.12),
        0 5px 12px rgba(31, 55, 86, 0.06);
}






/* =========================================================
   CARD NUMBER
   ========================================================= */

.value-number {
    position: relative;
    z-index: 1;

    flex-shrink: 0;

    font-size: 28px;
    line-height: 1;

    font-weight: 700;

    letter-spacing: 0.04em;

    color: rgba(255, 124, 8, 0.78);

    margin: 0 0 14px;
}


/* =========================================================
   CARD TITLE
   ========================================================= */

.value-card h3 {
    position: relative;
    z-index: 1;

    margin: 0 0 14px;

    font-size: 20px;
    line-height: 1.35;

    font-weight: 700;

    color: #1e1e1e;

    min-height: 54px;
}


/* =========================================================
   CARD DESCRIPTION
   ========================================================= */

.value-card p {
    position: relative;
    z-index: 1;

    margin: 0;

    font-size: 15px;
    line-height: 1.65;

    color: #31454d;

    flex-grow: 1;
}


/* =========================================================
   VIEW BUTTON
   Always stays at bottom
   ========================================================= */

.value-card .theme-btn {
    position: relative;
    z-index: 2;

    display: inline-flex;

    align-items: center;
    justify-content: center;

    align-self: flex-start;

    margin-top: auto;

    min-width: 82px;
    min-height: 40px;

    padding: 8px 18px;

    box-sizing: border-box;

    border-radius: 999px;

    font-size: 13px;
    font-weight: 600;

    text-decoration: none;

    transition:
        transform 0.25s ease,
        box-shadow 0.25s ease,
        background-color 0.25s ease;
}


.intro-cta-primary-services:hover .theme-btn {
    transform: translateY(-1px);
}


/* =========================================================
   LARGE DESKTOP
   ========================================================= */

@media (min-width: 1200px) {

    .intro-values {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 28px;
    }

    .value-card {
        height: 390px;
        min-height: 390px;
    }
}


/* =========================================================
   TABLET / SMALL LAPTOP
   ========================================================= */

@media (max-width: 1199px) {

    .intro-values {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 24px;
    }

    .value-card {
        height: 400px;
        min-height: 400px;

        padding: 30px 26px;
    }
}


/* =========================================================
   SMALL TABLET
   ========================================================= */

@media (max-width: 767px) {

    .intro-values {
        grid-template-columns: 1fr;
        gap: 20px;

        margin-bottom: 50px;
    }

    .value-card {
        height: 390px;
        min-height: 390px;

        padding: 30px 25px;

        border-radius: 18px;
    }

    .value-number {
        font-size: 27px;
    }

    .value-card h3 {
        font-size: 19px;
        min-height: auto;
    }

    .value-card p {
        font-size: 14px;
        line-height: 1.65;
    }
}


/* =========================================================
   iPHONE / SMALL MOBILE
   ========================================================= */

@media (max-width: 480px) {

    .intro-values {
        gap: 18px;
    }

    .value-card {
        height: 400px;
        min-height: 400px;

        padding: 28px 22px;

        border-radius: 18px;
    }

    .value-number {
        font-size: 26px;
        margin-bottom: 12px;
    }

    .value-card h3 {
        font-size: 18px;
        line-height: 1.35;

        margin-bottom: 13px;
    }

    .value-card p {
        font-size: 14px;
        line-height: 1.6;
    }

    .value-card .theme-btn {
        min-width: 78px;
        min-height: 38px;

        padding: 7px 16px;

        font-size: 12px;
    }
}


/* =========================================================
   VERY SMALL DEVICES
   iPhone SE / 320px - 375px
   ========================================================= */

@media (max-width: 375px) {

    .intro-values {
        gap: 16px;
    }

    .value-card {
        height: 410px;
        min-height: 410px;

        padding: 26px 20px;
    }

    .value-number {
        font-size: 24px;
    }

    .value-card h3 {
        font-size: 17px;
    }

    .value-card p {
        font-size: 13px;
        line-height: 1.6;
    }
}


/* =========================================================
   ACCESSIBILITY
   ========================================================= */

.intro-cta-primary-services:focus-visible {
    outline: 3px solid rgba(44, 101, 189, 0.35);
    outline-offset: 5px;
    border-radius: 22px;
}


/* =========================================================
   REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

    .value-card,
    .value-card .theme-btn {
        transition: none;
    }

    .intro-cta-primary-services:hover .value-card {
        transform: none;
    }

    .intro-cta-primary-services:hover .theme-btn {
        transform: none;
    }
}


















   .whychooselist {
    list-style: none;
    padding: 0;
    margin: 0;
}



.whychooselist li {
    position: relative;
    padding-left: 38px;
    margin-bottom: 18px;
    font-size: 16px;
    line-height: 1.7;
   color: #1b333b;
    font-weight: 400;
}

.whychooselist li::before {
    content: "✓";
    position: absolute;
    left: 0;
    top: 2px;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: #00b894;
    color: #fff;
    font-size: 14px;
    font-weight: bold;
    display: flex;
    align-items: center;
    justify-content: center;
}



h2 {
    font-size: clamp(24px, 5vw, 30px);
    color: #2d315b;
}

h3 {
    color: rgb(45 35 19);
    font-size: clamp(18px, 4vw, 20px);
    margin-bottom: 10px;
}

   
.content-container {
    background: rgb(252, 252, 255);
    margin-top: 50px;
    border: 1px solid #80808059;
    padding: 40px;
    border-radius: 15px;
}


/* ==========================
   INTRO
   ========================== */



.intro-cta-secondary {
    padding: 6.5px 18px;
    background: transparent;
    border: 1px solid rgb(255 255 255 / 50%);
    border-radius: 50px;
    color: rgba(255, 255, 255, 0.7);
    font-family: 'Michroma', sans-serif;
    /* font-family: 'Outfit', sans-serif; */
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 1px;
    cursor: pointer;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    margin-left: 10px;


     box-shadow:
        0 4px 12px rgba(15, 23, 42, 0.06),
        0 12px 30px rgba(15, 23, 42, 0.08),
        0 24px 60px rgba(15, 23, 42, 0.05);
}


.intro-cta-secondary:hover {
	border-color: rgba(249, 251, 252, 0.89);
	color: #ffffff;
}



.intro-cta-secondary {
    display: inline-flex;
    align-items: center;
    gap:10px;
}



.youtube-icon {

    height: 20px;
    background: #FF0000;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}



.youtube-icon svg {
    height: 15px;
    width: 25px;
    fill: #ffffff;
    margin-left: 1px; /* Centers the play triangle visually */
}







   .work-process-header {
    text-align: center;
}

.work-process-header h1 {
    color: #ffffff;
    font-family: 'Syne', sans-serif;
    font-size: 42px;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: 1px;
   
}


.work-process-header p {
    color: rgba(255,255,255,0.75);
    font-family: 'Outfit', sans-serif;
    font-size: 18px;
    line-height: 1.7;
    margin-top: 20px;
}





  .global-space-height{
        margin-top: 50px;
    }



      .global-space-intro-height{
        margin-top: 90px;
    }



 .global-space-header{
        margin-top: 80px;
    }


     .global-space-footer{
        margin-top: 10%;
    }








    



/* ==========================
   CONTACT ICON ONLY
   ========================== */

.contact-futuristic-icon {
    margin-bottom: 15px;
    height:45px;
    position:relative;
    display:flex;
    justify-content:center;
    align-items:center;

}


/* Outer communication signal */

.contact-futuristic-icon::before {

    content:"";

    position:absolute;

    width:42px;
    height:42px;

    border:2px solid #00ffff;

    border-radius:50%;

    border-right-color:transparent;

    box-shadow:
        0 0 10px #00ffff;

    animation:contactRotate 6s linear infinite;

}



/* Inner connection ring */

.contact-futuristic-icon::after {

    content:"";

    position:absolute;

    width:28px;
    height:28px;

    border:1px dashed rgba(0,255,255,.6);

    border-radius:50%;

    animation:contactPulse 3s infinite;

}



/* Message core */

.contact-core {

    width:18px;
    height:14px;

    background:#00ffff;

    border-radius:4px;

    position:relative;

    z-index:2;

    box-shadow:

        0 0 10px #00ffff,
        0 0 25px #00ffff;

    animation:contactGlow 2s infinite;

}



/* Message tail */

.contact-core::before {

    content:"";

    position:absolute;

    bottom:-4px;

    left:4px;

    width:0;
    height:0;

    border-left:5px solid transparent;
    border-right:5px solid transparent;
    border-top:6px solid #00ffff;

}



/* Communication dot */

.contact-core span {

    position:absolute;

    width:4px;
    height:4px;

    background:white;

    border-radius:50%;

    top:5px;

    left:7px;

    box-shadow:
        8px 0 0 white,
        16px 0 0 white,
        0 0 8px white;

}



/* Animations */

@keyframes contactRotate {

    from {
        transform:rotate(0deg);
    }

    to {
        transform:rotate(360deg);
    }

}


@keyframes contactPulse {

    0%,100% {
        transform:scale(1);
        opacity:.5;
    }

    50% {
        transform:scale(1.15);
        opacity:1;
    }

}


@keyframes contactGlow {

    0%,100% {
        transform:scale(1);
    }

    50% {
        transform:scale(1.15);
    }

}

















   /* ==========================
   FAQ Section
========================== */

.faq-section{
    width:100%;
    max-width:900px;
    margin:auto;
}



.faq-section-second{
    width:100%;
    max-width:900px;
    margin:auto;
    padding-top: 50px;
}



.left-heading{
    margin-bottom:35px;
}



.section-title{
    font-size:1.8rem;
    font-weight:700;
    color:#222;
    letter-spacing:.5px;
}

.left-text{
    display:flex;
    flex-direction:column;
    gap:18px;
}

/* ==========================
   FAQ Card
========================== */

.faq-item{
    background:#fff;
    border: 1px solid #cdb4ff87;
    border-radius:14px;
    overflow:hidden;
    transition:.35s ease;
    box-shadow:0 5px 20px rgba(0,0,0,.05);
    
}

.faq-item:hover{
    transform:translateY(-2px);
    box-shadow:0 12px 28px rgba(0,0,0,.08);
}

/* Remove default marker */

.faq-item summary{
    list-style:none;
}

.faq-item summary::-webkit-details-marker{
    display:none;
}

/* Question */

.faq-item summary{
    cursor:pointer;
    position:relative;
    padding:22px 65px 22px 24px;

    font-size:1.08rem;
    font-weight:600;
    line-height:1.6;

    color: #1b333b;
    transition:.3s;  
}

.faq-item summary:hover{
    color:#2563eb;
}

/* Plus Icon */

.faq-item summary::after{
    content:"+";
    position:absolute;
    right:24px;
    top:50%;
    transform:translateY(-50%);
    width:34px;
    height:34px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:50%;
    background:#f5f7fa;

    font-size:22px;
    font-weight:400;

    color:#2563eb;
    transition:.35s;
}

/* Open State */

.faq-item[open]{
    border-color:#2563eb;
}

.faq-item[open] summary{
    color:#2563eb;
}

.faq-item[open] summary::after{
    content:"−";
    background:#2563eb;
    color:#fff;
    transform:translateY(-50%) rotate(180deg);
}

/* Answer */

.faq-item p{
    padding:0 24px 24px;
    margin:0;

    font-size:1rem;
    line-height:1.8;

    color: #1b333b;
    /* color:#5b6475; */
}

/* Divider */

.faq-item[open] summary{
    border-bottom:1px solid #edf1f5;
}

/* Responsive */

@media (max-width:768px){

    .section-title{
        font-size:1.7rem;
    }

    .faq-item summary{
        padding:18px 55px 18px 18px;
        font-size:1rem;
    }

    .faq-item p{
      color: #1b333b;
        padding:0 18px 20px;
    }

}