@import "tailwindcss";
body {background: black;}
@font-face {src: url(../font/Techovier.ttf), url(../font/Techovier.ttf);font-display: swap; font-family: Techovier; font-weight: 500;} 
h1, h2 ,h3 ,p{font-family: "Inter", sans-serif; color: #ffffff;}
.h1_bold{font-family: Techovier; font-size: 60px;}
p {font-size: 18px;line-height: 28px;margin-top: 0.75rem;}
section {position: relative; padding-top: 120px;padding-bottom: 120px;}
footer {padding-top: 60px;}
.features-card:before{display: none;}
.section-header-title{margin-bottom: 12px;}
@media (max-width: 768px) {
  section {padding-top: 60px;}
  .h1_bold{font-size: 29px !important;}
  p{font-size: 14px !important;}
  .footer{padding: 0 20px;}
}

/* Header STARTS HERE */
.logo-with-name {width: 13%;}
.logo-with-name-logo {height: 36px; width: 150px}
.header-nav {background: rgba(255, 121, 0, 50%); border: 1px solid rgba(255, 255, 255, 50%);}
.header-nav-link{font-size: 17px;font-weight: 500;height: 22px;}
.button {border-radius: 37px; font-weight: bold;padding: 10px 25px;font-size: 17px;height: 42px;}
.header-actions-login{font-size: 17px;}
.button-primary .button-border:before {background: linear-gradient(rgba(255, 121, 0) 100%);}
.button-primary:before {background: none; box-shadow: none;}
@media (max-width: 1248px) {
  .header-nav {width: 100vw; height: 100vh; border: 0; border-radius: 0; display: block; left: 0; margin: unset; padding: 77px 0 0; transition: transform .45s ease; transform: none; position: fixed; top: 0; z-index: 1; /* background: rgba(3, 0, 20, .9); */ background: rgba(13, 7, 0, 100%); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);}
  .header-actions-trial {display: none !important;}
  .header-nav li {margin: 0; border-top: 1px solid rgba(255, 255, 255, .1); height: 73px;}
  .header-actions-signup {display: block !important;}
  .header-nav-link {padding: 20px 40px; font-weight: 500; font-size: 20px; line-height: 32px; color: #ffffffe6;}
  .logo-with-name-logo {height: 25px;}
}
@media (max-width: 768px){
  .logo-with-name {max-width: 16%; width: 16%;}
}
@media (max-width: 540px){
  .logo-with-name {max-width: 35%; width: 35%;}
}
/* Header ENDS HERE */


/* Footer STARTS HERE */
.footer{background: rgb(13, 7, 0)100%; border-top: none;}
.footer-top, .footer-newsletter, .footer-bottom{border-bottom: none; padding-top: 0px; padding-bottom: 70px;}
.footer-top{display: flex; flex-direction: column; align-items: left; width: 100%;}
.container-sm{padding-top: 100px;}
.t-orange{color:rgba(255, 121, 0);}
.t-orange:hover{color: #fff;}
.footer-copyright{margin-right: 0px;}
.footer-downline {display: flex; justify-content: space-between; align-items: center; margin-top: 20px;}
.footer-downline nav ul {display: flex; list-style: none; padding: 0;}
.footer-downline nav ul li {margin-right: 20px;}
.footer-downline nav ul li a, .text-wrapper-4 {font-family: "Inter", sans-serif; font-weight: 500; color: #898989; font-size: 15px; text-decoration: none;}
.footer-line, .contact-line {margin-bottom: 20px; align-items: flex-start;}
.footer-title {font-family: "Techovier", sans-serif; font-weight: 400; color: #ffffff; font-size: 23px; margin-bottom: 10px;}
.footer-description {font-family: "Inter", sans-serif; font-weight: 500; color: #898989; font-size: 15px;}
.footer-calltoaction {display: flex; justify-content: flex-start; gap: 50px; margin-bottom: 20px;}
.footer-legal ul{gap: 10px;}
address {font-style: normal; margin-bottom: 40px;}
.gmail, .phone, .office {display: flex; align-items: center; margin-bottom: 20px;}
.group, .img, .group-2 {width: 30px; height: auto; margin-right: 20px;}
.office-text, .phone-text, .gmail-text {font-family: "Inter", sans-serif; font-weight: 900; color: #ffffff; font-size: 15px; margin-right: 20px;}
.office-text-description, .phone-text-description, .gmail-text-description{font-family: "Inter", sans-serif; font-weight: 400; color: #ffffff; font-size: 15px; text-decoration: none;}
.nextfrontier-logo {position: relative; width: 212px; height: 51px; margin-left: auto;}
@media (max-width: 1248px) {
  .button{height: auto;}
  .header-actions-signup{font-size: 14px;padding: 8px 16px;}
  .header-actions-login{font-size: 14px;}
  .footer-calltoaction{flex-direction: column; gap: 10px;}
}
@media (max-width: 768px) {
  .footer-top .contact-line {display: flex; flex-direction: column; align-items: flex-start; gap: 50px;}
  .logo-container {margin-left: 0; margin-top: 0; align-self: flex-start;}
  .nextfrontier-logo {width: 145px; height: 35px;}
  .contact-line-inner {width: 100%;}
  .container-sm{padding-top: 60px;}
  .footer-legal ul {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr 1fr;
    gap: 25px 16px;
    justify-items: start;
    align-items: start;
    padding-left: 0;
  }
  .footer-legal ul li {
    margin-right: 0;
    text-align: left;
    list-style: none;
  }
  .footer-legal ul li a {
    text-align: left;
    display: inline-block;
  }
}
/* Footer ENDS HERE */

/* Homepage STARTS HERE */
/* Hero Section STARTS */
.hero-description, .hero-description-2 {position: relative; z-index: 1;}
.hero-description{width: 59%; margin: 0 auto; color: #fff;z-index: 1;}
.hero-description-2{width: 100%; margin: 0 auto; color: #fff;z-index: 1;padding-top: 225px;font-size: 18px;line-height: 28px;}
.button-primary .button-border:before .t-white{background: linear-gradient(rgba(255, 121, 0) 100%);}
.button-primary::after {background: #ff7900; color: white;}
.register-btn-row {display: flex; flex-direction: row; justify-content: center; align-items: center; margin: 0 auto; width: fit-content; gap: 220px; margin-top: 50px;}
.t-white.button-border:before {background: linear-gradient(#fff, #fff) !important;}
.beams-img {display: block; margin: 0 auto; position: absolute; left: 0; right: 0; top: 10%; z-index: 0; width: 55%; pointer-events: none; z-index: 0;}
/* Light beams animation */
.beams-bg{z-index: 0;}
.light-beams-animation{position: absolute;top: 0; left: 0; width: 100%; height: 100%; z-index: 1;}
.line-wrapper {position: absolute; top: 10%; width: 1px; transform-origin: top center;}
.data-fan-container {position: absolute; width: 100%; height: 33%; top: 112px; left: 0; overflow: hidden; pointer-events: none; z-index: 2;}
.data-line {position: absolute; top: -100%; left: 0; width: 1px; background: linear-gradient(to bottom, transparent, orange, transparent); filter: blur(0.8px); opacity: 0.6; animation: shoot 2s linear forwards;}
.beams-bg, .light-beams-animation {opacity: 0;}
.beams-bg.animate, .light-beams-animation.animate {animation: fadeIn 1s ease-in forwards;}
@keyframes shoot {
  0% {transform: translateY(-100%); opacity: 0.1;}
  50% {opacity: 1;}
  100% {transform: translateY(100%); opacity: 0.1;}
}
@media (max-width: 2560px){
  .hero-description-2{padding-top: 280px;}
  .beams-img{top: 0;}
  .light-beams-animation{top: 2%;}
  .beams-bg {position: relative; left: 16%;}
}
@media (max-width: 1920px){
  .beams-bg{left: 5%;}
}
@media (max-width: 1500px){
  .light-beams-animation{top: 0%;}
  .beams-img{top: 9%;}
  .beams-bg {position: relative; left: 0%;}
  .hero-description-2 {padding-top: 220px;}
}
@media (max-width: 1248px) {
  .hero {padding-top: 140px;padding-bottom: 60px;}
  .hero-content{padding: 0 20px;}
  .hero-description, .hero-description-2{width: 100% !important;}
  .beams-img{top: 25%;}
}
@media (max-width: 768px) {
  .hero-description-2{padding-top: 130px;}
  .beams-img {top: 28%; width: 100vw; max-width: 100vw;}
  .beams-img img {width: 100vw; max-width: 100vw;}
  .register-btn-row {display: flex; gap: 10px ; width: 100% ; align-items: center; margin-top: 50px;}
  .data-fan-container {top: 56px;}
}
@media (max-width: 540px){
  .beams-bg{scale: 1.1;}
}
@media (max-width: 375px){
  .hero-description-2{padding-top: 100px;}
  .beams-img {top: 30%; width: 100vw; max-width: 100vw;}
  .light-beams-animation {top: -2%;}
}
@media (max-width: 360px){
  .beams-img {top: 36%;}
  .light-beams-animation {top: -3%;}
}
/* Hero Section ENDS */

/* About us STARTS*/
.button-orange{background: #FF7900;margin: 0 auto;}
.aboutus-img {display: block; margin: 0 auto; position: absolute; left: 0; right: 0; top: 0; z-index: 0; width: 100%;height:100%; pointer-events: none;scale: 1.2;}
.aboutus-description{width: 64%;margin-bottom: 80px;}
.features-card-description{font-weight: bold;}
.features-card-title{font-family: Techovier;}
.features{width: 900px;}
.features-card{padding: 24px 0px 36px;}
.swiper-slide{width: 100%;}
.features-cards .swiper-wrapper-3-col {display: grid; grid-template-columns: repeat(3, 1fr);}
.divider-features-subline-3{left: 25%;}
.divider-features-subline-4{left: 50%;}
.divider-features-subline-5{left: 75%;}
@media (max-width: 2560px){
  /* .hero{padding-top: 245px;} */
  .about-us-bg-1{position: absolute; top: -36%;}
  .about-us-bg-2{position: absolute; bottom: -37%; right: 0;}
  .aboutus-img{display: none;}
}
@media (max-width: 1500px) {
  .aboutus-img-mobile{display: none;}
  .aboutus-img{display: flex;}
}
@media (max-width: 1248px) {
  .features-card {background-color: transparent;}
}
@media (max-width: 768px) {
  .button-orange {margin-bottom: 12px;}
  .aboutus-description {margin-bottom: 40px;}
  .mt-10{margin-top: 30px;}
  .features{width: auto;}
  .about-us .features-cards {overflow: hidden; }
  .about-us .features-cards .swiper-slide {flex-shrink: 0; width: auto; }
  .about-us .features-cards {width: 100vw; max-width: 100vw; margin: 0 auto; overflow: visible;}
  .about-us .features-cards .swiper-slide {width: 95vw; max-width: 95vw; margin: 0 auto; display: flex; flex-direction: column; align-items: center; justify-content: center; box-sizing: border-box;}
  .about-us .features-cards .swiper-slide:nth-child(2),.about-us .features-cards .swiper-slide:nth-child(3),.about-us .features-cards .swiper-slide:nth-child(4){margin-left:13px;}
  .about-us .features-cards .swiper-slide:nth-child(1){padding-right: 20px;}
  .divider-group-features{display: none;}
  .about-us .swiper-pagination-bullet {background: #FF7900; opacity: 0.4;}
  .about-us .swiper-pagination-bullet-active {background: #FF7900; opacity: 1;}
  .aboutus-img{display: none;}
  .aboutus-img-mobile{display: flex; margin: 0 auto;position: absolute; left: 0; right: 0; top: 0; z-index: 0; width: 100%; height: 100%; pointer-events: none;}
  .aboutus-img-mobile img:nth-child(1){position: absolute; top: -20%;}
  .aboutus-img-mobile img:nth-child(2){position: absolute; top: 68%;}
  .about-us{padding: 100px 0;}
}
/* About us ENDS*/

/* What we do STARTS*/
@media (max-width: 768px){
  .features-cards .swiper-wrapper-3-col {display: grid; grid-template-columns: repeat(1, 3fr);}
  .swiper-slide{margin: 0 auto;}
}
/* What we do ENDS*/

/* Market Analysis STARTS HERE */
.analysis-section{display: flex;flex-direction: column;flex: 1;width: 100%;height: 100%;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;}
.market-analysis{padding-top: 60px;}
.market-analysis .mx-auto{margin-right: 0; margin-left: 0;}
.box {position: relative; height: 332px; margin: 0 auto; min-height: 332px; top: 50%; z-index: 2;}
.box .market-competitor {display: flex; flex-direction: column; align-items: center; width: 100%;}
.box .trend-analysis-line {position: relative; width: 819px; height: 118px; top: 0; left: 11px;}
.box .overlap-group {position: relative; width: 817px; height: 118px; background-color: #ff790040; border-radius: 22px;}
.box .rectangle {position: absolute; width: 793px; height: 94px; top: 12px; left: 12px; background-color: #ff79001a; border-radius: 10px; border: 1px solid; border-color: #ffffff;}
.box .text-wrapper {position: relative; width: 729px; top: 34px; left: 44px; font-weight: 400; color: #ffffff; font-size: 18px; text-align: center; letter-spacing: 0; line-height: 25px;}
.box .div {position: relative; font-family: "Techovier"; font-weight: 400; color: #ffffff; font-size: 31px; text-align: center; letter-spacing: 0; line-height: normal; white-space: nowrap;}
.card-margin {padding: 24px 49px 24px;}
.market-hero {position: relative; width: 100%; height: 100vh; overflow: hidden;}
.trend-bg-img, .trend-bg-container {position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0;}
/* Trend Background Animation */
.light-side-beam {position: absolute; top: 25%; height: 50%; width: 20%; pointer-events: none; overflow: hidden; filter: blur(2px); z-index: 1;}
.left-light-beam {left: 0;}
.right-light {right: 0;}
.trend-beam {position: absolute; height: 2px; width: 100%; opacity: 0.4;}
.left-light-beam .trend-beam {background: linear-gradient(to right, transparent, orange, transparent); animation: flow-left 1.5s linear infinite;}
.right-light .trend-beam {background: linear-gradient(to left, transparent, orange, transparent); animation: flow-right 1.5s linear infinite;}
.trend-beam:nth-child(1) { top: 10%; animation-delay: 0s; }
.trend-beam:nth-child(2) { top: 30%; animation-delay: 0.3s; }
.trend-beam:nth-child(3) { top: 50%; animation-delay: 0.6s; }
.trend-beam:nth-child(4) { top: 70%; animation-delay: 0.9s; }
.trend-beam:nth-child(5) { top: 90%; animation-delay: 1.2s; }
.trend-animation {position: absolute; top: 31%; left: 50%; width: 60%; height: auto; transform: translate(-50%, -50%); z-index: 1; pointer-events: none;}
.market-hero>*:not(.trend-bg-img):not(.trend-animation):not(.projector-container) {z-index: 1;}
/* .projector-container>*:not(.trend-animation) {z-index: 3;} */
/* PROJECTOR ANIMATION */
.projector-container {position: absolute; top: 0; left: 0; width: 100%; height: 100%; bottom: 0; perspective: 1000px; z-index: 3; pointer-events: none;}
.projection-base-wrapper {height: 100%; bottom: -25%; left: 50%; transform: translate(-50%, 0px); transform: translate3d(35%, -33px, -263px) rotateX(71deg); rotate: 0deg; opacity: 40%;}
.projection-base {animation: rotateBase 30s linear infinite;}
.divider-group-trend{display: flex; height: 100%; justify-content: space-between; pointer-events: none; position: absolute; top: 0; width: 100%;}
.divider-features{position: absolute; top:45px; width: 1px; height: 35%; background: linear-gradient(to bottom, rgba(128, 60, 0, 0.2), rgba(128, 60, 0, 0.7), rgba(128, 60, 0, 0.2));}
.divider-features-subline-1 {left: 33.33%;}
.divider-features-subline-2 {left: 66.66%;}
.trend-bg-img,.trend-bg-container .light-side-beam {opacity: 0;}
.trend-bg-img.animate {animation: fadeIn 1s ease-in forwards;}
.trend-bg-container .light-side-beam.animate {animation: fadeIn 1s ease-in forwards;}
@keyframes flow-left {
  0% { transform: translateX(-100%); opacity: 0.1; }
  50% { opacity: 1; }
  100% { transform: translateX(100%); opacity: 0.1; }
}
@keyframes flow-right {
  0% { transform: translateX(100%); opacity: 0.1; }
  50% { opacity: 1; }
  100% { transform: translateX(-100%); opacity: 0.1; }
}
@keyframes rotateBase {
  0% {transform: rotate(0deg);}
  100% {transform: rotate(360deg);}
}
@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}
@media (max-width: 2560px){
  .trend-animation {top: 35%; width: 38%;}
  .market-hero{height: 65vh;}
}
@media (max-width: 1920px){
  .trend-animation{top: 29%; width: 45%;}
  .projection-base-wrapper {transform: translate3d(30%, -110px, -350px) rotateX(68deg);}
  .market-hero{height: 100vh;}
}
@media (max-width: 1600px){
  .market-hero {height: 110vh;}
  .projection-base-wrapper {transform: translate3d(26%, -115px, -550px) rotateX(70deg);}
  .trend-animation {top: 31%;}
}
@media (max-width: 1500px){
  .trend-animation{top: 27%; width: 50%}
  .projection-base-wrapper {transform: translate3d(23%, -128px, -450px) rotateX(71deg);}
  .market-hero{height: 100vh;}
}

@media (max-width: 768px){
 .market-analysis .mx-auto{margin-right: auto; margin-left: auto;}
 .trend-animation{width: 100% !important;}
 .trend-bg-img{height: 30%;}
 .projection-base-wrapper {transform: translate3d(0%, -107px, -445px) rotateX(68deg) !important;}
 .box .trend-analysis-line, .box .overlap-group{width: 100%;left: 0;}
 .box .rectangle, .box .text-wrapper{width: 90%;margin-top: 0;}
 .box .text-wrapper {top: 22px;left: 11px;}
 .box .div {white-space: normal;font-size: 17px !important;}
 .market-hero{height: 110vh;}
 .box {height: 640px; min-height: 640px;top: 22%;}
 .trend-animation{top: 13%;}
 .projector-container{height: 56%;}
 .market-analysis .text-left{text-align: center;}
}

@media (max-width: 540px){
  .light-side-beam{top: 10%; height: 10%;}
  .trend-beam {height: 1px;}
}
/* Market Analysis ENDS HERE */

/* Custom Dashboard STARTS HERE */
.custom-dashboard{padding-bottom: 60px; padding-top: 0px;}
.box-dashboard {position: relative; margin: 0 auto; z-index: 2;}
.box-dashboard .custom-dashboards {position: relative; width: auto; height: auto; top: 0; left: 0;}
.box-dashboard .tool-point {display: flex; flex-direction: row; justify-content: center; align-items: stretch; gap: 50px; width: 85%; margin: 0 auto; margin-top: 50px;}
.box-dashboard .KPI-trackers,.box-dashboard .interactive-filters,.box-dashboard .data-storytelling {display: flex; flex-direction: column; align-items: left; justify-content: flex-start; flex: 1 1 0; min-width: 0; max-width: 365px; border-radius: 16px; padding: 24px 24px; box-sizing: border-box;}
.box-dashboard .interactive-filters-2,.box-dashboard .data-storytelling-2,.box-dashboard .mask-group,.box-dashboard .mask-group-2,.box-dashboard .business-graph-trade {width: 100%; height: auto; object-fit: contain; display: block;}
.img-dashboard {width: 35px; height: auto; object-fit: contain; display: block;}
.box-dashboard .text-wrapper-dashboard,.box-dashboard .div-dashboard,.box-dashboard .text-wrapper-2-dashboard {text-align: left; font-size: 18px; color: #fff; margin-top: 8px; font-family: "Inter", Helvetica, Arial, sans-serif; font-weight: 700;}
.kpi-mask-group-container {width: 100%; height: 168px; display: flex; align-items: center; justify-content: center;}
.kpi-mask-group-container .mask-group {width: 100%; height: 170px;}
.kpi-mask-group-oversize {transform: scale(1.5); transform-origin: center; display: block;}
.box-dashboard .custom-dashboards-2 {width: 100%; height: auto; position: relative; top: 0; left: 0; margin: 0 auto; display: flex; flex-direction: column; align-items: center; justify-content: center; box-sizing: border-box;}
.box-dashboard .p-dashboard {font-weight: 400; font-size: 50px; letter-spacing: 0; line-height: normal; white-space: nowrap; position: static; width: 100%; text-align: center; margin-bottom: 12px;}
.KPI-trackers,.interactive-filters,.data-storytelling,.overlap-group-dashboard,.mask-group,.mask-group-2,.business-graph-trade,.data-storytelling-2,.interactive-filters-2 {position: static !important;}
.tool-bg {position: relative; top: 0; left: 0; width: 80%; height: auto; margin: 0 auto; z-index: 1; pointer-events: none;/}
.tools-hero>*:not(.tool-bg) {z-index: 2;}
.tools-hero {position: relative; margin-top: -100px;}
.tool-bg-animation{position: absolute; height: 100%; width: 100%;}
/* Animation */
#trendline-path {
stroke-dasharray: 1300; stroke-dashoffset: 1500; transition: stroke-dashoffset 0.2s ease-out;}
@media (max-width: 2560px){
  .tool-bg-mobile{margin: 0 auto;}
  .trendline-svg{position: absolute;width: 60%;left: 20%;top: 5%;}
}
@media (max-width: 1920px){
  .trendline-svg{width: 80%;left: 10%;top: 1%;}
}
@media (max-width: 1500px){
  .trendline-svg{width: 100%;left: 0%;top: 0%;}
}
@media (max-width: 768px){
  .custom-dashboard{padding-top: 60px;}
  .img-dashboard,.text-wrapper-dashboard{margin: 0 auto;}
  .tool-bg{margin: 0;width: 100%;}
  .box-dashboard .mask-group{width: 50%; margin: 0 auto;}
}
@media (max-width: 540px){
  .box-dashboard .mask-group{width: 100%;}
}
/* Custom Dashboard ENDS HERE */

/* Consulting STARTS HERE */
.consulting {background: linear-gradient(to bottom,rgba(13, 7, 0, 1) 0%,rgba(37, 27, 12, 1) 100%); padding: 100px 0;}
@media (max-width: 768px){
  .consulting{padding: 60px 0; }
  /* .consulting .features .mx-auto{margin-left: 0; margin-right: 0;}
  .consulting .features-card-title{text-align: left;} */
}
/* Consulting ENDS HERE */

/* Use case STARTS HERE */
.cases-bg {position: relative; top: 0; left: 0; width: 80%; height: auto; margin: 0 auto; z-index: 0; pointer-events: none;}
.use-case {padding-top: 0px;}
.use-cases {position: relative; width: 985px; height: 530px; margin: 0 auto; margin-top: -100px;z-index: 1;}
.use-cases-container {position: relative; width: auto; height: 430px;}
.use-cases-title {font-family: "Techovier", sans-serif; font-weight: 400; color: #ffffff; font-size: 56px; letter-spacing: 0; line-height: normal; white-space: nowrap; margin-bottom: 30px;}
.divider-group,.vertical-divider,.horizontal-divider {pointer-events: none;}
.divider-group {position: absolute; width: 100%; height: 100%;}
.horizontal-divider {position: absolute; left: 0; top: 54%; width: 100%; height: 1px; background: linear-gradient(90deg, rgba(128, 60, 0, 0.2) 0%, rgba(128, 60, 0, 0.7) 50%, rgba(128, 60, 0, 0.2) 100%);}
.vertical-divider {position: absolute; left: 50%; top: 29%; width: 1px; height: 50%; background: linear-gradient(180deg, rgba(128, 60, 0, 0.2) 0%, rgba(128, 60, 0, 0.7) 50%, rgba(128, 60, 0, 0.2) 100%);}
.case-card-container {display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; width: 100%; height: 100%; max-width: 980px; margin: 0 auto;}
.case-card {padding: 32px 62px; display: flex; flex-direction: column; align-items: center; justify-content: flex-start;}
.case-card:hover {background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, .06) 100%); transition: background 0.3s;}
.card-img {width: 50px; height: auto; object-fit: contain; margin-bottom: 16px;}
.case-card-title {font-family: 'Techovier'; font-size: 17px; color: #fff; margin-bottom: 8px; text-align: center;}
.case-card-description {font-size: 17px; color: #BBBBBB; text-align: center;}
.case-bg {position: relative; z-index: 1; width: 100%; height: auto; display: block;}
.wave {position: absolute; top: 40%; left: 0; width: 100%; height: 300px; display: flex; justify-content: center; align-items: center; z-index: 2;}
#canv {width: 100%; height: 50%;}
@media (max-width: 2560px){
  .case-bg{margin: 0 auto;}
  .wave{top: 45%;}
}

@media (max-width: 768px) {
  .use-case{padding: 60px 0;}
  .cases-divider {grid-template-columns: 1fr; grid-template-rows: repeat(4, 1fr); gap: 24px; padding: 24px 0;}
  .box-dashboard .tool-point {flex-direction: column; gap: 24px; width: 100%; margin-top: 32px; align-items: stretch; padding: 0 8px;}
  .box-dashboard .KPI-trackers, .box-dashboard .interactive-filters, .box-dashboard .data-storytelling {max-width: 100%; padding: 18px 12px; align-items: flex-start;}
  .kpi-mask-group-container {height: 110px; min-height: 90px;}
  .kpi-mask-group-container .mask-group {height: 110px;}
  .kpi-mask-group-oversize {transform: scale(1.4);}
  .img-dashboard {width: 28px;}
  .box-dashboard .text-wrapper-dashboard {font-size: 15px; margin-top: 6px;}
  .box-dashboard .p-dashboard {font-size: 28px; white-space: normal; padding: 0 8px;}
  .box-dashboard .custom-dashboards-2 {padding: 0 8px;}
  .tools-hero {margin-top: -40px;}
  .use-cases {width: 100%; height: auto; margin-top: 0; padding: 0 8px;}
  .use-cases-container {height: auto; min-height: 0; padding: 0;}
  .case-card-container {display: flex; flex-direction: column; gap: 18px; width: 100%; max-width: 100%; margin: 0 auto;}
  .case-card {padding: 18px 10px; min-width: 0; align-items: center;}
  .case-card-title {font-size: 15px; margin-bottom: 4px;}
  .case-card-description {font-size: 13px;}
  .divider-group {display: none;}
  .cases-bg {width: 100%; height: auto;}
  .ecg-wave{left: 0; width: 100%;}
}
@media (max-width: 480px) {
  .box-dashboard .p-dashboard {font-size: 20px; padding: 0 4px;}
  .box-dashboard .text-wrapper-dashboard {font-size: 13px;}
  .img-dashboard {width: 22px;}
  .kpi-mask-group-container {height: 70px;}
  .case-card {padding: 12px 2px;}
  .case-card-title {font-size: 13px;}
  .case-card-description {font-size: 11px;}
  .wave{top: 0;}
  #canv {height: 20%;}
}
@media (max-width: 375px){
  .wave{top: -7%;}
  #canv {height: 15%;}
}
/* Use case ENDS HERE */

/* Why Next Frontier STARTS HERE */
.why-next-frontier {padding-top: 100px; padding-bottom: 175px;}
.integrations-items {height: 440px; padding: 0px 24px; margin-top: 30px;}
.integrations-logo {height: auto; left: 50%; position: absolute; top: 200px; transform: translate(-50%); width: 210px; z-index: 1;}
.integrations-waves {height: auto; left: 50%; position: absolute; top: 220px; transform: translate(-50%); width: 210px; z-index: 0}
.integrations-item:nth-child(2),.integrations-item:nth-child(3),.integrations-item:nth-child(4),.integrations-item:nth-child(5) {height: 220px; background: none;}
.integrations-item:nth-child(2):hover,.integrations-item:nth-child(3):hover,.integrations-item:nth-child(4):hover,.integrations-item:nth-child(5):hover {background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, .06) 100%); transition: background 0.3s;}
.card-img-3 {width: 38px;}
.vertical-divider-1,.vertical-divider-2,.horizontal-divider-1,.horizontal-divider-2 {position: absolute; height: 1px;}
.vertical-divider-1,.vertical-divider-2 {width: 280px; background: linear-gradient(90deg, rgba(128, 60, 0, 0.2) 0%, rgba(128, 60, 0, 0.7) 50%, rgba(128, 60, 0, 0.2) 100%);}
.vertical-divider-1 {left: 11%; top: 50%;}
.vertical-divider-2 {right: 11%; top: 50%;}
.horizontal-divider-1,.horizontal-divider-2 {height: 170px; width: 1px; background: linear-gradient(180deg, rgba(128, 60, 0, 0.2) 0%, rgba(128, 60, 0, 0.7) 50%, rgba(128, 60, 0, 0.2) 100%);}
.horizontal-divider-1 {left: 50%; top: 0;}
.horizontal-divider-2 {left: 50%; bottom: 0;}
.why-beam{top: 13%; width: 27%; height: 75%;}
.bg-show{opacity: 1;}
@media (max-width: 768px) {
  .why-next-frontier {padding-top: 60px; padding-bottom: 0;}
  .why-beam {top: 5%; height: 20%;}
  .why-next-frontier .integrations-item {padding: 0;}
  .why-next-frontier .integrations-waves{top: 160px;}
  .why-next-frontier .integrations-items {display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: auto auto auto; grid-template-areas: "item1 item2" "logo  logo" "item3 item4"; width: 100%; margin-top: 0; margin-bottom: 0; top: 0; height: auto; position: relative; z-index: 1; padding: 0 4px;}
  .why-next-frontier .integrations-item {display: flex; flex-direction: column; align-items: center; justify-content: center; background: none; padding: 0; min-width: 0; width: 100%; height: 150px; box-sizing: border-box;}
  .why-next-frontier .card-img{margin-bottom: 0px;}
  .why-next-frontier .integrations-item .integrations-item-description {display: none !important;}
  .why-next-frontier .integrations-item:nth-child(2) { grid-area: item1; }
  .why-next-frontier .integrations-item:nth-child(3) { grid-area: item2; }
  .why-next-frontier .integrations-item:nth-child(4) { grid-area: item3; }
  .why-next-frontier .integrations-item:nth-child(5) { grid-area: item4; }
  .why-next-frontier .integrations-logo{grid-area: logo; justify-self: center; align-self: center; margin: 0 auto; position: static; transform: none; width: 140px; max-width: 40vw;}
  .why-next-frontier .integrations-lines {top: 0;}
  .why-next-frontier .integrations-mobile-texts {display: flex; flex-direction: column; gap: 18px; width: 100%; margin: 24px 0 0 0; align-items: center; justify-content: center;}
  .why-next-frontier .integrations-mobile-texts .integrations-item-description {display: block !important; font-size: 1rem; text-align: center; line-height: 1.4; margin: 0 auto; max-width: 90%;}
  .integrations-mobile-texts .integrations-item{height: 100%; margin-bottom: 30px;}
  .why-next-frontier .divider-group{display: block;}
  .why-next-frontier .vertical-divider-1,.why-next-frontier .vertical-divider-2{width: 120px;}
  .why-next-frontier .vertical-divider-1{left: 20%;}
  .why-next-frontier .vertical-divider-2{right: 20%;}
}
@media (max-width: 540px){
  .why-next-frontier .vertical-divider-1,.why-next-frontier .vertical-divider-2{width: 90px;}
  .why-next-frontier .vertical-divider-1{left: 0;}
  .why-next-frontier .vertical-divider-2{right: 0;}
  .why-next-frontier .horizontal-divider-1,.why-next-frontier .horizontal-divider-2{height: 150px;}
}
/* Why Next FrontierENDS HERE */
/* Homepage ENDS HERE */