/* Thin (200) */
@font-face {
  font-family: "FONTSPRING DEMO - Proxima Nova";
  src: url("assets/fonts/proxima/Fontspring-DEMO-proximanova-thin.otf") format("opentype");
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}

/* Light (300) */
@font-face {
  font-family: "FONTSPRING DEMO - Proxima Nova";
  src: url("assets/fonts/proxima/Fontspring-DEMO-proximanova-light.otf") format("opentype");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

/* Regular (400) */
@font-face {
  font-family: "FONTSPRING DEMO - Proxima Nova";
  src: url("assets/fonts/proxima/Fontspring-DEMO-proximanova-regular.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* Medium (500) */
@font-face {
  font-family: "FONTSPRING DEMO - Proxima Nova";
  src: url("assets/fonts/proxima/Fontspring-DEMO-proximanova-medium.otf") format("opentype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

/* Semibold (600) */
@font-face {
  font-family: "FONTSPRING DEMO - Proxima Nova";
  src: url("assets/fonts/proxima/Fontspring-DEMO-proximanova-semibold.otf") format("opentype");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

/* Bold (700) */
@font-face {
  font-family: "FONTSPRING DEMO - Proxima Nova";
  src: url("assets/fonts/proxima/Fontspring-DEMO-proximanova-bold.otf") format("opentype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* Black / Extra Bold (800) */
@font-face {
  font-family: "FONTSPRING DEMO - Proxima Nova";
  src: url("assets/fonts/proxima/Fontspring-DEMO-proximanova-black.otf") format("opentype");
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}

html,
body {
  font-family: "FONTSPRING DEMO - Proxima Nova", sans-serif;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

h1 h2 {
  font-family: "Helvetica", "Arial", sans-serif;
}

p span a {
  font-family: "FONTSPRING DEMO - Proxima Nova", sans-serif;
}

.fonthelvatica {
  font-family: "Helvetica", "Arial", sans-serif;
}

.fontinter {
  font-family: "Helvetica", "Arial", sans-serif;
}

img {
  height: auto;
}

.more {
  overflow: hidden;
}

/* Read More / Read Less Gradient Text */
.read-more-link,
.read-less-link {
  /* REMOVE the conflicting background:none */

  background: linear-gradient(130.69deg,
      #8c4ae1 -1.99%,
      #b556be 97.35%) !important;

  background-size: 200% 200% !important;
  animation: gradient-move 4s ease infinite !important;

  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;

  border: none;
  cursor: pointer;
  font-size: 16px;
  padding: 0;
  text-decoration: none !important;
}

.read-more-link:hover,
.read-less-link:hover {
  opacity: 0.9;
}

.fadanimation {
  animation: fadeInUp 1s ease-in-out;
}

.bulletlist li::marker {
  margin: 0px !important;
}

.forheaderlinks li a {
  font-family: "FONTSPRING DEMO - Proxima Nova", sans-serif;

  font-weight: 400;
  font-size: 16px;
  line-height: 150%;
  color: #000000;
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(50px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.gradient-text {
  background: linear-gradient(130.69deg, #8c4ae1 -1.99%, #b556be 97.35%);
  background-size: 200% 200%;
  animation: gradient-move 4s ease infinite;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
}

@keyframes gradient-move {
  0% {
    background-position: 0% 50%;
  }

  50% {
    background-position: 100% 50%;
  }

  100% {
    background-position: 0% 50%;
  }
}

.inputbox {
  width: 100%;
  border: 1px solid #E2E2E2;
  /* border-gray-300 */
  background: #F9F9F9;
  border-radius: 4px;
  /* rounded-lg */
  padding: 14px 16px;
  /* px-4 py-3 */
  font-size: 14px;
  font-weight: 400;
  color: #6E6E6E;
  /* text-gray-800 */
  box-shadow: 0 1px 2px rgb(0 0 0 / 0.05);
  /* shadow-sm */
  outline: none;
  transition: all 0.2s ease;
}

.inputbox:focus {
  border-color: #0740bc;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  /* focus:shadow-md */
}

/* .inputbox {
  @apply w-full border border-gray-300 rounded-lg p-3 focus:border-blue-500 outline-none;
} */
/* .form-container {
        max-width: 600px;
        margin: auto;
        background: #fff;
        padding: 25px 30px;
        border-radius: 10px;
        box-shadow: 0 3px 10px rgba(0,0,0,0.1);
    }

    h2 { text-align: center; margin-bottom: 5px; }
    p.center { text-align: center; margin-top: 5px; }
    a { color: #007bff; }

    .row {
        display: flex;
        gap: 10px;
    }

    .row input, .row select {
        width: 100%;
    }

    input, select, textarea {
        width: 100%;
        padding: 12px;
        margin-top: 12px;
        border: 1px solid #ccc;
        border-radius: 6px;
        font-size: 14px;
    }

    .formbutton {
        width: 100%;
        margin-top: 20px;
        padding: 14px;
        font-size: 16px;
        border: none;
        background: #005be0;
        color: white;
        border-radius: 6px;
        cursor: pointer;
    }

    .formbutton:hover {
        background: #0045b3;
    } */
.textheading {
  font-family: "Helvetica", "Arial", sans-serif;
  font-weight: 700;
  font-size: 32px;
  line-height: 130%;
  color: #171618;
}

.textparagraph {
  font-family: "FONTSPRING DEMO - Proxima Nova", sans-serif;
  font-weight: 400;
  font-size: 18px;
  line-height: 150%;
  letter-spacing: 0px;
  vertical-align: middle;
  color: #767676;
}

.forbghiresection {
  background: linear-gradient(90deg, #0c40bc 0%, #a749a4 100%);
}

.cstombgnav {
  background: linear-gradient(90deg,
      rgba(140, 74, 225, 0.95) 0%,
      rgba(181, 86, 190, 0.95) 100%);
  font-family: "FONTSPRING DEMO - Proxima Nova", sans-serif;

  font-weight: 400;
  font-size: 22px;
  line-height: 150%;
}

.customheader {
  background: #cce2fe;
}

.custom-container {
  max-width: 1240px;
  margin: 0 auto;
}

.slick-list {
  height: auto !important;
  overflow: hidden;
}

/* Slick Slider Custom */
/* .hero-slider {
  padding-bottom: 40px !important;
} */
.slick-dotted.slick-slider {
  margin-bottom: 0px !important;
}

.percent:after {
  content: "+";
  display: inline-block;
}

.percentnew:after {
  content: "%";
  display: inline-block;
}

.percentnewarrow:after {
  content: "%";
  display: inline-block;
}

.percentnewarrow:before {
  content: "<";
  display: inline-block;
}

/* Arrow Buttons */
.slick-dots li button:before {
  color: #eeeeee !important;
  opacity: 1 !important;
  font-size: 10px;
}

.slick-dots li.slick-active button:before {
  color: #a652ca !important;
  opacity: 1 !important;
  font-size: 10px;
}

/* .hero-slider img {
  width: 100%;
  height: auto;
} */

.footerheadng {
  font-family: "FONTSPRING DEMO - Proxima Nova", sans-serif;

  font-weight: 600;
  font-size: 18px;
  line-height: 150%;
  color: #171618;
  margin-bottom: 12px;
}

.footerparagraph {
  font-family: "FONTSPRING DEMO - Proxima Nova", sans-serif;

  font-weight: 400;
  font-size: 14px;
  line-height: 150%;
  color: #767676;
  margin-bottom: 11px;
}

.aboutcardcontent {
  font-family: "FONTSPRING DEMO - Proxima Nova", sans-serif;

  font-weight: 400;
  font-size: 16px;
  line-height: 150%;
  color: #767676;
}

/* Floating Animation */
@keyframes float {
  0% {
    transform: translateY(0px);
  }

  50% {
    transform: translateY(-15px);
  }

  100% {
    transform: translateY(0px);
  }
}

.no-scrollbar::-webkit-scrollbar {
  display: none;
}

/* Wave timing offsets for realism */
.animate-float1 {
  animation: float 4s ease-in-out infinite;
}

.animate-float2 {
  animation: float 4s ease-in-out infinite 0.2s;
}

.animate-float3 {
  animation: float 4s ease-in-out infinite 0.4s;
}

.animate-float4 {
  animation: float 4s ease-in-out infinite 0.6s;
}

.animate-float5 {
  animation: float 4s ease-in-out infinite 0.8s;
}

.animate-float6 {
  animation: float 4s ease-in-out infinite 1s;
}

.animate-float7 {
  animation: float 4s ease-in-out infinite 1.2s;
}

.animate-float8 {
  animation: float 4s ease-in-out infinite 1.4s;
}

.animate-float9 {
  animation: float 4s ease-in-out infinite 1.6s;
}

.animate-float10 {
  animation: float 4s ease-in-out infinite 1.8s;
}

/* .bgsectionnnew {
  position: relative;
  z-index: 111;
} */
/* .bgsectionnnew::after {
  content: "";
  position: absolute;
  inset: 0;
  width: 100%;
  height: 91%;
  background-image: url("img/framebgnew.png");
  background-size: 100%;
  background-repeat: no-repeat;
  background-position: 100% 100%;
  z-index: -1;
} */

/* .arrowbackground {
  position: absolute;
  top: 35px;
  left: 0;
  width: 100%;
  height: 20px;
  background-image: url("img/arrowtimline.png");
  background-repeat: repeat-x;
  background-position: 97% center;
  background-size: 16%;
 
} */

/* // common background */
.bottombackgroundimg {
  position: relative;
}

.bottombackgroundimg::after {
  content: "";
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  background-image: url("img/Frame.png");
  /* <-- your image */
  background-size: 100%;
  /* fill full section */
  background-repeat: no-repeat;
  /* no repeat */
  background-position: 100% 110%;
  /* center it */
  z-index: -1;
  /* place behind content */
}

.formobilcasebg {
  position: relative;

}

.formobilcasebg::after {
  content: "";
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  background-image: url("img/Frame.png");
  /* <-- your image */
  background-size: 100%;
  /* fill full section */
  background-repeat: no-repeat;
  /* no repeat */
  background-position: 100% 110%;
  /* center it */
  z-index: -1;
  /* place behind content */
}

.formobgap {
  gap: 30px !important;
}

.foreventbgnew {
  position: relative;

}

.foreventbgnew::after {
  content: "";
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  background-image: url("img/Frame.png");
  /* <-- your image */
  background-size: 100%;
  /* fill full section */
  background-repeat: no-repeat;
  /* no repeat */
  background-position: 100% 110%;
  /* center it */
  z-index: -1;
  /* place behind content */
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(20px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes fadeBlink {
  0% {
    opacity: 1;
  }

  50% {
    opacity: 0.3;
  }

  100% {
    opacity: 1;
  }
}

.animate-fadeBlink {
  animation: fadeBlink 1.2s ease-in-out infinite;
}

.animate-fadeIn {
  animation: fadeIn 0.5s ease forwards;
}

@keyframes slideUp {
  from {
    opacity: 0;
    transform: translateY(30px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.animate-slideUp {
  animation: slideUp 0.9s ease forwards;
}

.delay-100 {
  animation-delay: 0.1s;
}

.delay-200 {
  animation-delay: 0.2s;
}

.delay-300 {
  animation-delay: 0.3s;
}

#formModal,
#thankYouModal,
#contactFormModal,
#contactThankYouModal,
#discoveryFormModal,
#discoveryThankYouModal {
  z-index: 9999;
}

.gradient-btn {
  background: border-box padding-box, border-box #fff;
  background-image: linear-gradient(#fff, #fff), linear-gradient(124deg, #7395CC 0, #964D86 100%);
  border: 3px solid;
  border-image-source: linear-gradient(180deg, #7395cc00 0%, #964d8600 100%);
  border-radius: 40px;
width: fit-content;
padding: 13px 28px;
font-size: 18px;
font-weight: 700;
margin-bottom: 24px;

}
.heroBg{
  background-image: url(../assets/img/ats/gradient-background.png);
      background-size: contain;
    background-repeat: no-repeat;
    background-position: right;
    margin-top: 100px;
}
 
input[type="date"]::-webkit-calendar-picker-indicator,
input[type="time"]::-webkit-calendar-picker-indicator {
  opacity: 0;          
  cursor: pointer;    
}
 
@media (max-width: 1300px) {
  .custom-container {
    max-width: 92%;
  }
}

@media (max-width: 1270px) {
  .formobgap {
    gap: 16px !important;
  }
}

@media (min-width: 1024px) {
  .slider-card {
    min-width: calc(25% - 1rem);
    /* 3.5 cards (approx) */
  }
}

@media (max-width: 998px) {
  .forheaderlinks a {
    font-family: "FONTSPRING DEMO - Proxima Nova", sans-serif;

    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    color: #000000;
  }

  .forheaderlinks {
    background: #fff;
  }
}

@media (min-width: 768px) and (max-width: 1023px) {
  .slider-card {
    min-width: calc(50% - 1rem);
    /* 2 cards on tablets */
  }

  .formobgap {
    gap: 10px !important;
  }
}

@media (max-width: 768px) {
  .heroBg{
   background-position: 100% 100%;
        margin-top: 40px;
        background-size: 82%;

  }
  .heroBg h1, .heroBg p{
    text-align: center;
  }
  .slider-card {
    min-width: 100%;
    /* 1 card on mobile */
  }

  .textheading {
    font-size: 28px;
  }

  .textparagraph {
    font-size: 18px;
  }

  .formobgap {
    gap: 10px !important;
  }

  .bottombackgroundimg::after {
    background-image: url("img/framehomemobile.webp");
    /* <-- your image */
    background-size: 119%;
    /* fill full section */
  }

  .footerheadng {
    font-size: 16px;
  }

  /* .bgsectionnnew::after {
    width: 100%;
    height: 100%;
    background-image: url("img/framemobileabout.webp"); 
    background-size: 100%;
  } */
  .formobilcasebg::after {
    background-image: url("img/casestudybg.png");
    /* <-- your image */
    background-size: 100% 76%;
    /* fill full section */
  }

  /* .arrowbackground {
    position: absolute;
    top: 35px;
    right: 0;
    width: 100%;
    height: 82%;
    background-image: url(img/about/timlineimgarrow.png) !important;
    background-repeat: repeat-y;
    background-position: 22% 97%;
    background-size: auto;
  } */
}

@media (max-width: 380px) {
  .forwidthextrasmall {
    width: 80px !important;
  }

  .formangegapxs {
    gap: 30px !important;
  }
}