.hiddenScroll{overflow:hidden;overscroll-behavior: contain;}
.main{background:#1E1E26;}
.mainContainer{width:100%;max-width:1400px;padding:0 15px;margin:0 auto;}
.sectionDark{padding: 100px 0;background: #131212;}
.sectionLight{padding: 100px 0;background:#1E1E26;}
.pageMainHeading .heading{color: #FFF;text-align: center;font-size: 54px;font-weight: 700;line-height: 64px;letter-spacing: -0.54px;}
.pageMainHeading .subHeading{margin-top: 10px;color: #D4D4D4;text-align: center;font-size: 16px;font-weight: 400;line-height: 26px;}
@media screen and (max-width:768px){
.sectionLight, .sectionDark{padding: 50px 0;}
.pageMainHeading .heading{margin: 0 auto;max-width: 80%;font-size: 26px;line-height: 32px;letter-spacing: -0.26px;}
.pageMainHeading .subHeading{margin: 20px auto 0;max-width: 80%;font-size: 14px;line-height: 20px;}
}
/* header section css start*/
.headerSection{position: sticky;top: 0;background:#1E1E26;backdrop-filter:blur(10px);z-index:99;transition:all .3s ease;}
.sectionWrapper{display:flex;justify-content:space-between;align-items:center;padding:15px 0;}
.sectionWrapper .logoIcon{display:flex;align-items:center;justify-content:center;}
.sectionWrapper .ctaWrapper{display:flex;align-items:center;gap:15px;}
.sectionWrapper .ctaWrapper .demoBtn{background:#1E1E26;border:1px solid #FFDD04;color:#FFDD04;padding:12px 25px;border-radius:10px;font-weight:600;cursor:pointer;transition:all .3s ease-in-out;}
.sectionWrapper .ctaWrapper .demoBtn:hover{background:#FFDD04;color:#1E1E26;}
@media screen and (max-width:540px){
  .sectionWrapper .logoIcon img{max-width: 156px;}
.sectionWrapper .ctaWrapper{display: none;}
}
/* header section css end */


/* hero banner section css start*/
.heroCntntBox{padding: 80px 0 50px;display:flex;justify-content:space-between;gap:30px;}
.heroContent{flex:1 1 50%;max-width:645px;}
.heroContent .mainHeading{display: block;color: #fff;font-size: 52px;font-style: normal;font-weight: 700;line-height: 60px;letter-spacing: -0.64px;;position: relative;}
.heroContent .typingText {display: flex;align-items: center;gap: 10px;}
.heroContent .centerHeading {font-size: 52px;font-weight: 700;line-height: normal;color:#FFDD04;white-space: nowrap;overflow: hidden;}
.heroContent .flipWindow{min-height:62px;position:relative;min-width:300px;}
.heroContent .flipWindow .text{position:absolute;width:100%;font-size: 52px;font-weight: 700;line-height: normal;color:#FFDD04;white-space: nowrap;top:0;left:0;opacity:0;animation-duration:4s;animation-timing-function:ease-in-out;animation-iteration-count:infinite;}
.heroContent .flipWindow .text .aiIcon{max-width: 26px;}
.heroContent .flipWindow .text .mobileText{display: none;}
.heroContent .flipWindow .text:nth-child(1){animation-name:slideUpFade;animation-delay:0s;}
.heroContent .flipWindow .text:nth-child(2){animation-name:slideUpFade;animation-delay:2s;}
.heroContent .subHeading{margin-top: 30px;color: #D4D4D4;font-size: 20px;font-style: normal;font-weight: 400;line-height: 34px;}
/* COMMENTED OUT LEAD FORM STYLES - PRESERVED FOR FUTURE USE
.leadFormBox{flex:1 1 45%;background:#11111a;border: 1px solid #FFDD04;box-shadow: 0 4px 70px 16px rgba(255, 221, 4, 0.08);border-radius:16px;transition:all .3s ease-in-out;overflow: hidden;}
.leadFormBox .leadFormHeading{padding: 10px 20px;display: flex;align-items: center;gap: 10px;background: #FFDD04;}
.leadFormBox .leadFormHeading h2{font-size: 14px;font-weight: 700;position: relative;display: flex;gap: 2px; white-space: nowrap;color: #000;}

.leadFormBox.none{display: none;}

/* Lead Form Styles */
.leadFormContent{padding: 30px;}
.leadFormText{font-size: 14px;font-weight: 400;color: #fff;text-align: center;margin-bottom: 25px;}
.leadForm{display: flex;flex-direction: column;gap: 20px;}
.formRow{display: grid;grid-template-columns: 1fr 1fr;gap: 15px;}
.formGroup{display: flex;flex-direction: column;gap: 8px;position: relative;margin-bottom: 0;}
.formLabel{color: #fff;font-size: 12px;font-weight: 600;text-transform: uppercase;letter-spacing: 0.5px;}
.formInput, .formSelect{width: 100%;padding: 12px 15px;background: #292929;border: 1px solid #3A3A47;border-radius: 8px;color: #fff;font-size: 14px;font-weight: 400;transition: all 0.3s ease;outline: none;}
.formInput:focus, .formSelect:focus{border-color: #FFDD04;box-shadow: 0 0 0 2px rgba(255, 221, 4, 0.1);}
.formInput::placeholder{color: #999;font-size: 14px;}
.formSelect{appearance: none;background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFDD04' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6,9 12,15 18,9'%3e%3c/polyline%3e%3c/svg%3e");background-repeat: no-repeat;background-position: right 12px center;background-size: 16px;cursor: pointer;}
.formSelect option{background: #292929;color: #fff;padding: 10px;}
.leadFormBtn{width: 100%;padding: 15px 25px;background: #FFDD04;color: #000;border: 1px solid #FFDD04;border-radius: 8px;font-size: 14px;font-weight: 700;cursor: pointer;transition: all 0.3s ease;text-transform: uppercase;letter-spacing: 0.5px;}
.leadFormBtn:hover{background: transparent;color: #FFDD04;border-color: #FFDD04;transform: translateY(-2px);box-shadow: 0 4px 15px rgba(255, 221, 4, 0.3);}
.leadFormBtn:active{transform: translateY(0);}
END COMMENTED OUT LEAD FORM STYLES */

/* DEMO BOX STYLES - COPIED FROM SUPERAGENT_PRO */
.demoBox{flex:1 1 45%;background:#11111a;border: 1px solid #FFDD04;box-shadow: 0 4px 70px 16px rgba(255, 221, 4, 0.08);border-radius:16px;transition:all .3s ease-in-out;overflow: hidden;}
.demoBox .demoHeading{padding: 10px 20px;display: flex;align-items: center;gap: 10px;background: #FFDD04;}
.demoBox .demoHeading h2{font-size: 14px;font-weight: 700;position: relative;display: flex;gap: 2px; white-space: nowrap;}
.demoBox .demoHeading .langText{display: inline-flex;}

.demoBox.none{display: none;}
.demoCntntBox{padding: 30px;}
.demoCntntBox .demoText{font-size: 14px;font-weight: 400;color: #fff;text-align: center;}
.demoCntntBox .tabs{margin-top: 15px;display: grid;grid-template-columns: auto auto auto;gap:12px;}
.demoCntntBox .tabs .tab{position:relative;padding: 13px 18px;border-radius: 20px;background: #292929;font-size:12px;text-align: center;cursor:pointer;color:#ccc;transition:all .3s ease-in-out;border:1px solid transparent;}
.demoCntntBox .tabs .tab:hover{background:#262636;color:#fff;}
.demoCntntBox .tabs .tab.active{background:#292929;color:#FFDD04;border:1px solid #FFDD04;}
.demoCntntBox .tabs .tab.active::after {content:"";position:absolute;left:50%;bottom:-10px;transform:translateX(-50%);width:0;height:0;border-left:10px solid transparent;border-right:10px solid transparent;border-top:10px solid #FFDD04;transition:all .3s ease-in-out;}
.demoCntntBox .tabs .tab.active::before {content:"";position:absolute;left:50%;bottom:-9px;transform:translateX(-50%);width:0;height:0;border-left:9px solid transparent;border-right:9px solid transparent;border-top:9px solid #292929;transition:all .3s ease-in-out;z-index:1;}

.demoContainer{margin-top: 35px;position:relative;display:flex;gap:20px;flex-wrap:wrap;justify-content:center;}
.demoContainer .demoCard{flex: 1;border-radius: 8px;border: 0.5px dashed transparent;background: #292929;padding:30px 20px;width:230px;text-align:center;color:#fff;transition:all .3s ease}
.demoContainer .demoCard:hover{border: 0.5px dashed #FFDD04;}
.demoContainer .demoCard .demoIcon{width: 88px;height: 88px;background: #0E0E18;border-radius: 50%;display: flex;align-items: center;justify-content: center;margin: 0 auto;}
.demoContainer .demoCard .demoTitle{margin:10px 0;font-size:18px;font-weight:600;color:#fff;}
.demoContainer .demoCard .demoDesc{font-size:12px;color:#ccc;line-height: 18px;margin-bottom:20px;}
.demoContainer .demoCard .demoBtn{display:inline-block;color: #fff;border: 1px solid transparent;background: #0E0E18;padding:10px 20px;border-radius:6px;font-size:13px;font-weight:600;cursor:pointer;text-decoration:none;transition:all .3s ease;}
.demoContainer .demoCard:hover .demoBtn{border:1px solid #FFDD04;color:#FFDD04;}
.demoContainer .demoCard .demoBtn:hover{color:#000;background: #FFDD04;}

/* Single demo card styling */
.demoContainer .demoCard.single-demo{max-width: 500px;width: 100%;padding: 30px 40px;min-height: 200px;display: flex;flex-direction: row;align-items: center;gap: 30px;}
.demoContainer .demoCard.single-demo .demoIcon{width: 100px;height: 100px;margin-bottom: 0;flex-shrink: 0;}
.demoContainer .demoCard.single-demo .demoContent{flex: 1;text-align: left;}
.demoContainer .demoCard.single-demo .demoTitle{font-size: 20px;margin: 10px 0;}
.demoContainer .demoCard.single-demo .demoDesc{font-size: 13px;line-height: 20px;margin-bottom: 20px;}
.demoContainer .demoCard.single-demo .demoBtn{padding: 10px 20px;font-size: 13px;}

/* WEB DEMO POPUP STYLES - COPIED FROM SUPERAGENT_PRO */
.webDemoPopup{min-height: 520px;background:#1b1b1e;border-radius: 16px 16px 25px 25px;border: 1px solid #FFDD04;box-shadow: 0 4px 70px 16px rgba(255, 221, 4, 0.08);display:flex;flex-direction:column;overflow:hidden;transform:scale(0.95) translateY(20px);transition:all .4s cubic-bezier(0.4,0,0.2,1);z-index: 101;display: none;}
.webDemoPopup.active{transform:scale(1) translateY(0px);transition:all .4s cubic-bezier(0.4,0,0.2,1);display: flex;}
.webDemoPopup.none{display: none;}
.webDemoPopup .webDemoPopupHeader{display:flex;align-items:center;justify-content: space-between; background:#FFDD04;padding:12px}
.webDemoPopup .webDemoPopupHeaderIcon{font-size:22px;margin-right:10px}
.webDemoPopup .webDemoPopupHeaderText{color:#000;font-size:14px;font-weight:700;}
.webDemoPopup .webDemoPopupHeader .dFlex{display: flex !important;width: 100% !important;}
.webDemoPopup .webDemoPopupHeader .demoModalClose {color: #1E1E26;font-size: 24px;cursor: pointer;margin-top: -3px;width: 25px;height: 25px;display: flex;align-items: flex-start;justify-content: center;}

.webDemoPopup .webDemoPopupChat{background:#202028;height:calc(100% - 122px);display:flex;flex-direction:column;justify-content: space-between;}
.webDemoPopup .apiResponse{margin-top: 40px;background:#1b1b22;padding:8px 20px;}
.webDemoPopup .apiResponse .message{display: block;font-size:12px;text-align: center;color:#fff;line-height:24px;text-align: center;}

.aiBlobAnimation{margin-top: 50px;display:flex;align-items:center;justify-content:center;}
.aiBlobAnimation .blobContainer {width: 135px;height: 135px;position: relative;}

.blobContainer  .circle{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:120px;height:120px;border-radius:55%;box-shadow:0 0 20px 10px #ff78000d;}
.blobContainer  .circle-1{background:radial-gradient(circle,#0a0a0a00 0%,#0a0a0a00 67%,#ff7800ff 73%,#ff7800ff 100%)}
.blobContainer  .circle-2{background:radial-gradient(circle,#0a0a0a00 0%,#0a0a0a00 67%,#0014ffff 75%,#0014ffff 100%);}
.blobContainer  .circle-3{background:radial-gradient(circle,#0a0a0a00 0%,#0a0a0a00 70%,#ffff 73%,#ffff 100%)}
.blobContainer.active .circle{animation:rotateShape 4s infinite ease-in-out;}
.blobContainer.active .circle-2{animation:rotateShape 4s infinite reverse ease-in-out;}

@keyframes rotateShape {
0%{transform:translate(-50%,-50%) rotate(0deg) scale(0.9);border-radius:50%}
50%{transform:translate(-50%,-50%) rotate(180deg) scale(1.15);border-radius:45% 55% 50% 50%}
100%{transform:translate(-50%,-50%) rotate(360deg) scale(0.9);border-radius:50%}
}

.webDemoPopup .webDemoPopupFooter{background:#FFDD041A;padding:13px 20px;display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:8px}
.webDemoPopup .webDemoPopupWarning{display:flex;align-items:center;gap:8px;}
.webDemoPopup .webDemoPopupWarning .webDemoPopupWarningText{color:#fff;font-size:12px;font-weight:300;line-height: 18px;max-width: 70%;}
.webDemoPopup .webDemoPopupWarningIcon{font-size:14px;margin-right:3px}
.webDemoPopup .demoModalBtn{border-radius: 8px;border: 1px solid #FFDD04;background: #0E0E18;color: #fff;font-size:14px;white-space: nowrap;padding:14px 20px;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:7px;margin-left:auto}
.webDemoPopup .demoModalBtnIcon{font-size:14px;margin-right:4px}

/* MODAL OVERLAY STYLES - COPIED FROM SUPERAGENT_PRO */
.demoModalOverlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000000CC;backdrop-filter:blur(2px);display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:all .4s cubic-bezier(0.4,0,0.2,1);z-index: 100;}
.demoModalOverlay.active{opacity:1;visibility:visible}
.demoModalOverlay.active .demoModal, .demoModalOverlay.active .webDemoPopup{transform:scale(1) translateY(0)}
.demoModalOverlay .demoModal{width:350px;border-radius: 16px;background: #282828;box-shadow:0 1px 15px #00000030;display:none;flex-direction:column;transform:scale(0.95) translateY(20px);transition:all .4s cubic-bezier(0.4,0,0.2,1);}
.demoModal .demoModalHeader {padding:15px 20px;display:flex;align-items:center;justify-content:space-between;}
.demoModal .demoModalHeader .heading{color: #FFF;font-size: 14px;font-weight: 600;line-height: normal;}
.demoModal .demoModalClose{color:#8E8E8E;font-size:24px;cursor:pointer;margin-left:15px;margin-top:-3px;}
.demoModal .demoModalBody{border-top: 1px solid #2F2F2F;display:flex;flex-direction:column;padding:20px;}
.demoModal .demoModalLabel{display:block;color: #B5B5B5;font-size: 12px;font-weight: 400;line-height: normal;}
.demoModal .demoModalInputRow{margin-top: 12px;display:flex;width:100%}
.demoModal .demoModalCountryCode{width: 80px;padding:15px 20px 15px;font-size:12px;border-radius:6px 0 0 6px;background:#fff;color:#333;border: none;font-weight:400;outline:none;}
.demoModal .demoModalInput{flex:1 1 0;padding:10px;margin: 0;font-size:12px;border-radius:0 6px 6px 0;border: none;border-left:1px solid #dedede;background:#fff;color:#333;outline:none;}
.demoModal .demoModalBtn{margin-top:30px;background:#FFDD04;color:#000000;font-size:14px;font-weight:700;border:none;border-radius:6px;padding:14px 10px;width:100%;cursor:pointer;outline:none;}
.demoModal .demoModalBtnFull{width:100%}
.demoModal .demoModalOtpMsg .message{color:#B5B5B5;font-size:12px;line-height:18px;}
.demoModal .demoModalOtpPhone{display:flex;align-items: center;gap: 15px;margin-top: 10px;font-size: 14px;font-weight:700;color:#fff;}
.demoModal .demoModalOtpChange{display: flex;align-items: center;gap: 7px;color:#FFDD04;font-size:14px;font-weight: 700;cursor:pointer}
.demoModal .demoModalOtpInputs{display:flex;gap:8px;align-items: center;justify-content:space-between;margin-top: 25px;}
.demoModal .demoModalOtpInput{width:50px;height:45px;background:#fff;font-size:23px;font-weight:700;color:#101010;text-align:center;border-radius:6px;border: none;outline:none;}
.demoModal .demoModalInfoRow{display:flex;align-items:center;gap:8px;}
.demoModal .demoModalInfoRow .demoModalInfoText{font-size:12px;color:#fff;font-weight:400;}
.demoModal .demoModalInfoIcon > img{width: 15px;}
.demoModal .demoModalUseCase{margin-top:20px;font-size:14px;font-weight:700;}
.demoModal .demoModalUseCaseHead{color:#fff;}
.demoModal .demoModalUseCaseHighlight{color:#FFDD04;}
.demoModal .demoModalDemoText{margin-top: 10px;color:#B5B5B5;font-size:12px;line-height:18px;}
.demoModal .demoModalBanner{margin-top: 20px;background:#353535;border-radius:6px;padding:15px;}
.demoModal .demoModalBannerTitle{color:#FFDD04;font-weight:400;font-size:14px;}
.demoModal .demoModalBannerSubtitle{margin-top: 10px;color:#fff;font-size:12px;font-weight:400;line-height: 18px;}

/* Industry Selection Dropdown - Hidden on tablet and desktop */
.demoModal .demoModalIndustrySelect{
  width:100%;
  padding:15px 20px;
  font-size:12px;
  border-radius:6px;
  background:#fff;
  color:#333;
  border:1px solid #dedede;
  font-weight:400;
  outline:none;
  margin-top:12px;
  display:none;
  appearance:none;
  -webkit-appearance:none;
  -moz-appearance:none;
  background-image:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6,9 12,15 18,9'%3e%3c/polyline%3e%3c/svg%3e");
  background-repeat:no-repeat;
  background-position:right 15px center;
  background-size:16px;
  padding-right:40px;
  position:relative;
  z-index:1;
  overflow:visible;
}

/* Hide industry selection label on desktop and tablet */
.demoModal .demoModalLabel[for="industrySelect"] {
  display: none;
}

/* Show dropdown only on mobile phones */
@media screen and (max-width: 540px) {
  .demoModal .demoModalIndustrySelect {
    display: block;
  }
  
  /* Show industry selection label on mobile */
  .demoModal .demoModalLabel[for="industrySelect"] {
    display: block;
  }
  
  /* Ensure modal can handle dropdown overflow */
  .demoModal {
    overflow: visible;
  }
  
  .demoModal .demoModalBody {
    overflow: visible;
  }
}

/* Ensure dropdown options display properly */
.demoModal .demoModalIndustrySelect option {
  padding: 10px;
  background: #fff;
  color: #333;
  font-size: 12px;
  line-height: 1.4;
  white-space: normal;
  word-wrap: break-word;
}

.demoModal .demoModalIndustrySelect:focus {
  border-color: #FFDD04;
  box-shadow: 0 0 0 2px rgba(255, 221, 4, 0.2);
}

/* Mobile-specific dropdown styling */
@media screen and (max-width: 540px) {
  .demoModal .demoModalIndustrySelect option {
    padding: 12px 15px;
    font-size: 14px;
    line-height: 1.3;
  }
  
  /* Ensure dropdown doesn't get cut off */
  .demoModalOverlay {
    overflow: visible;
  }
  
  .demoModalOverlay .demoModal {
    overflow: visible;
  }
}

/* DEMO BOX MOBILE STYLES */
.mobCtaBtn {padding:15px 50px;margin-top: 40px;width: 100%;background:#FFDD04;color:#232323;border:1px solid #FFDD04;border-radius:12px;font-size:16px;font-weight:700;cursor:pointer;outline:none;display: none;}

/* Mobile responsive styles for demo box */
@media screen and (max-width: 1024px) {
.heroCntntBox{flex-direction: column;}
.heroContent{max-width:100%;}
.heroContent .mainHeading{text-align: center;}
.heroContent .typingText{align-items: initial;justify-content: center;}
.voiceContainer{justify-content: center;}
}

@media screen and (max-width: 768px) {
.heroContent{flex: 100%;max-width: 100%;}
.heroCntntBox{display: block;padding: 20px 0 0;}
.heroContent .mainHeading{font-size: 28px;line-height: 34px;letter-spacing: normal;}
.heroContent .typingText{height: 34px;}
.heroContent .flipWindow .text .aiIcon{max-width: 20px;}
.heroContent .flipWindow{min-height: auto;min-width: 160px;width: 100%;}
.heroContent .flipWindow .text .mobileText{display: inline-block;}
.heroContent .flipWindow .text .webText{display: none;}
.heroContent .centerHeading{display: none;}
.heroContent .centerHeading,.heroContent .flipWindow .text{font-size: 28px;line-height: 34px;text-align: center;}
.heroContent .subHeading{margin-top: 30px;font-size: 14px;line-height: 20px;text-align: center;}
.demoBox{display: none;}
.voiceContainer{gap: 30px;}
.voiceContainer .botIcon{width: 50px;height: 50px;padding: 10px;flex-shrink: 0;}
.voiceContainer .botIcon > img,.voiceContainer .userIcon > img{width: 100%;height: 100%;}
.voiceContainer .userIcon{width: 50px;height: 50px;flex-shrink: 0;}
.waveform .voiceBar{width: 2px;}
.mobCtaBtn{display: block;}
}

@media (max-width: 1024px) {
.webDemoPopup{position: fixed;width: 100%;left: 0;bottom: -100%;border-radius: 20px 20px 0 0;display: block;}
.webDemoPopup.active{bottom: 0;transition:all .4s cubic-bezier(0.4,0,0.2,1);display: block;}
.webDemoPopup .webDemoPopupHeader,.webDemoPopup .webDemoPopupFooter{padding-left:10px;padding-right:10px}
.webDemoPopup .webDemoPopupMessage{padding-left:10px;padding-right:10px;font-size:12px}
.webDemoPopup .webDemoPopupFooter{flex-direction:column;align-items:flex-start;gap:10px}
.webDemoPopup .webDemoPopupChat{height:calc(70vh - 110px)}
.webDemoPopup .demoModalBtn{width:100%;justify-content:center;margin-left:0}
.demoModalOverlay{justify-content:initial;align-items: flex-end;}
.demoModalOverlay .demoModal{width:100%;border-radius: 20px 20px 0 0;}
.demoModalOverlay .webDemoPopup{width:100%;border-radius: 20px 20px 0 0;}
.demoModal .demoModalOtpInputs{justify-content: space-evenly;}
}

@media screen and (max-width: 768px) {
.demoModal .demoModalOtpInputs{justify-content: space-between;}
.aiBlobAnimation{margin-top: 30px;}
.blobContainer  .circle{width: 90px;height: 90px;}
}

@media screen and (max-width: 768px) {
/* COMMENTED OUT LEAD FORM MOBILE STYLES - PRESERVED FOR FUTURE USE
.leadFormBox{display: block;margin-top: 30px;width: 100%;}
.leadFormContent{padding: 20px;}
.formRow{grid-template-columns: 1fr;gap: 15px;}
.formInput, .formSelect{padding: 10px 12px;font-size: 13px;}
.leadFormBtn{padding: 12px 20px;font-size: 13px;}
.leadFormHeading{padding: 8px 15px;}
.leadFormHeading h2{font-size: 13px;}
.leadFormText{font-size: 13px;margin-bottom: 20px;}

/* Form validation mobile styles */
.formGroup {
  margin-bottom: 15px;
}

.formLabel {
  font-size: 11px;
  margin-bottom: 5px;
}

.formInput, .formSelect {
  padding: 12px 10px;
  font-size: 14px;
}

.leadFormBtn {
  padding: 14px 20px;
  font-size: 14px;
  margin-top: 10px;
}

/* Error states mobile */
.formGroup.has-error .formInput,
.formGroup.has-error .formSelect {
  border-width: 2px;
}

.formGroup .formInput.valid,
.formGroup .formSelect.valid {
  border-width: 2px;
}

.error-message {
  font-size: 11px;
  margin-top: 3px;
}

.notification {
  padding: 12px 15px;
}

.notification-message {
  font-size: 13px;
}
}

.demoBox{flex:1 1 45%;background:#11111a;border: 1px solid #FFDD04;box-shadow: 0 4px 70px 16px rgba(255, 221, 4, 0.08);border-radius:16px;transition:all .3s ease-in-out;overflow: hidden;}

.demoBox .demoHeading{padding: 10px 20px;display: flex;align-items: center;gap: 10px;background: #FFDD04;}

.demoBox .demoHeading h2{font-size: 14px;font-weight: 700;position: relative;display: flex;gap: 2px; white-space: nowrap;}

/* .demoBox .demoHeading .langText{display: inline-flex;animation: language 4s steps(25, end) infinite;overflow: hidden;} */

.demoBox .demoHeading .langText{display: inline-flex;}
.demoCntntBox{padding: 30px;}
.demoCntntBox .demoText{font-size: 14px;font-weight: 400;color: #fff;text-align: center;}
.demoCntntBox .tabs{margin-top: 15px;display: grid;grid-template-columns: auto auto auto;gap:12px;}
.demoCntntBox .tabs .tab{position:relative;padding: 13px 18px;border-radius: 20px;background: #292929;font-size:12px;text-align: center;cursor:pointer;color:#ccc;transition:all .3s ease-in-out;border:1px solid transparent;}
.demoCntntBox .tabs .tab:hover{background:#262636;color:#fff;}
.demoCntntBox .tabs .tab.active{background:#292929;color:#FFDD04;border:1px solid #FFDD04;}
.demoCntntBox .tabs .tab.active::after {content:"";position:absolute;left:50%;bottom:-10px;transform:translateX(-50%);width:0;height:0;border-left:10px solid transparent;border-right:10px solid transparent;border-top:10px solid #FFDD04;transition:all .3s ease-in-out;}
.demoCntntBox .tabs .tab.active::before {content:"";position:absolute;left:50%;bottom:-9px;transform:translateX(-50%);width:0;height:0;border-left:9px solid transparent;border-right:9px solid transparent;border-top:9px solid #292929;transition:all .3s ease-in-out;z-index:1;}

.demoContainer{margin-top: 35px;position:relative;display:flex;gap:20px;flex-wrap:wrap;justify-content:center;}
.demoContainer .demoCard{flex: 1;border-radius: 8px;border: 0.5px dashed transparent;background: #292929;padding:30px 20px;width:230px;text-align:center;color:#fff;transition:all .3s ease}
.demoContainer .demoCard:hover{border: 0.5px dashed #FFDD04;}
.demoContainer .demoCard .demoIcon{width: 88px;height: 88px;background: #0E0E18;border-radius: 50%;display: flex;align-items: center;justify-content: center;margin: 0 auto;}
.demoContainer .demoCard .demoTitle{margin:10px 0;font-size:18px;font-weight:600;color:#fff;}
.demoContainer .demoCard .demoDesc{font-size:12px;color:#ccc;line-height: 18px;margin-bottom:20px;}
.demoContainer .demoCard .demoBtn{display:inline-block;color: #fff;border: 1px solid transparent;background: #0E0E18;padding:10px 20px;border-radius:6px;font-size:13px;font-weight:600;cursor:pointer;text-decoration:none;transition:all .3s ease;}
.demoContainer .demoCard:hover .demoBtn{border:1px solid #FFDD04;color:#FFDD04;}
.demoContainer .demoCard .demoBtn:hover{color:#000;background: #FFDD04;}


.mobCtaBtn {padding:15px 50px;margin-top: 40px;width: 100%;background:#FFDD04;color:#232323;border:1px solid #FFDD04;border-radius:12px;font-size:16px;font-weight:700;cursor:pointer;outline:none;display: none;}

@keyframes  language {
  0%   { width: 0ch; }
  100%  { width: 100%; }   
}
@keyframes slideUpFade {
0%{opacity:0;transform:translateY(100%)}
10%{opacity:1;transform:translateY(0)}
40%{opacity:1;transform:translateY(0)}
60%{opacity:0;transform:translateY(-100%)}
100%{opacity:0;transform:translateY(-100%)}
}
.voiceContainer{margin-top: 30px;display:flex;align-items:center;gap:40px;}
.voiceContainer .botIcon{width:70px;height:70px;border-radius:50%;background:#000;display: flex;align-items: center;justify-content: center;}
.voiceContainer .botIcon > img{margin-top: 10%;max-width: 40px;max-height: 40px;}
.voiceContainer .userIcon {width:70px;height:70px;border-radius:50%;object-fit:cover;border: 5px solid #ffffff1f;display: flex;align-items: center;justify-content: center;}
.voiceContainer .waveform{--scale: 0.7;display:flex;align-items:center;gap:10px}
.waveform .voiceBar{width:4px;border-radius:2px;background:repeating-linear-gradient(to bottom,#9b5de5,#9b5de5 3px,transparent 3px,transparent 6px);animation:waveAnim 1s infinite ease-in-out;}

.waveform .voiceBar {
  transform-origin: middle bottom;   /* scale from bottom */
}
.waveform .voiceBar:nth-child(1){height:calc(30px * var(--scale));animation-delay:0s;}
.waveform .voiceBar:nth-child(2){height:calc(60px * var(--scale));animation-delay:.05s;}
.waveform .voiceBar:nth-child(3){height:calc(50px * var(--scale));animation-delay:.1s;}
.waveform .voiceBar:nth-child(4){height:calc(120px * var(--scale));animation-delay:.15s;}
.waveform .voiceBar:nth-child(5){height:calc(150px * var(--scale));animation-delay:.2s;}
.waveform .voiceBar:nth-child(6){height:calc(170px * var(--scale));animation-delay:.25s;}
.waveform .voiceBar:nth-child(7){height:calc(150px * var(--scale));animation-delay:.3s;}
.waveform .voiceBar:nth-child(8){height:calc(120px * var(--scale));animation-delay:.35s;}
.waveform .voiceBar:nth-child(9){height:calc(90px * var(--scale));animation-delay:.4s;}
.waveform .voiceBar:nth-child(10){height:calc(60px * var(--scale));animation-delay:.45s;}
.waveform .voiceBar:nth-child(11){height:calc(30px * var(--scale));animation-delay:.5s;}
.waveform .voiceBar:nth-child(12){height:calc(60px * var(--scale));animation-delay:.55s;}
.waveform .voiceBar:nth-child(13){height:calc(50px * var(--scale));animation-delay:.6s;}
.waveform .voiceBar:nth-child(14){height:calc(120px * var(--scale));animation-delay:.65s;}
.waveform .voiceBar:nth-child(15){height:calc(140px * var(--scale));animation-delay:.7s;}
.waveform .voiceBar:nth-child(16){height:calc(180px * var(--scale));animation-delay:.75s;}
.waveform .voiceBar:nth-child(17){height:calc(130px * var(--scale));animation-delay:.8s;}
.waveform .voiceBar:nth-child(18){height:calc(120px * var(--scale));animation-delay:.85s;}
.waveform .voiceBar:nth-child(19){height:calc(50px * var(--scale));animation-delay:.9s;}
.waveform .voiceBar:nth-child(20){height:calc(60px * var(--scale));animation-delay:.95s;}

@keyframes waveAnim {
0%,100%{transform:scaleY(0.3);opacity:.6;}
50%{transform:scaleY(1);opacity:1;}
}

.voiceForm {padding:25px 0;display: flex;align-items: center;justify-content: center;gap: 4px;}
.voiceForm .bar {transform-origin: middle bottom;--scale: 1;width: 5px;height: 5px;background: #fff;border-radius: 3px;opacity: 0.9;transition: all 0.4s ease-in-out;}
.voiceForm.active .bar {animation: voiceWaveAnim 0.7s infinite ease-in-out alternate;}

.voiceForm.active .bar:nth-child(1) { height: calc(10px * var(--scale)); animation-delay: 0s; }
.voiceForm.active .bar:nth-child(2) { height: calc(16px * var(--scale)); animation-delay: .15s; }
.voiceForm.active .bar:nth-child(3) { height: calc(12px * var(--scale)); animation-delay: .3s; }
.voiceForm.active .bar:nth-child(4) { height: calc(24px * var(--scale)); animation-delay: .45s; }
.voiceForm.active .bar:nth-child(5) { height: calc(18px * var(--scale)); animation-delay: .6s; }
.voiceForm.active .bar:nth-child(6) { height: calc(9px * var(--scale)); animation-delay: .75s; }
.voiceForm.active .bar:nth-child(7) { height: calc(20px * var(--scale)); animation-delay: .9s; }

@keyframes voiceWaveAnim {
  0%   { transform: scaleY(1); }
  50%  { transform: scaleY(1.6); }
  100% { transform: scaleY(1); }
}


@media screen and (max-width: 1024px) {
.heroCntntBox{flex-direction: column;}
.heroContent{max-width:100%;}
.heroContent .mainHeading{text-align: center;}
.heroContent .typingText{align-items: initial;justify-content: center;}
.voiceContainer{justify-content: center;}
.leadFormBox{width: 100%;max-width: 500px;margin: 30px auto 0;}
}
@media screen and (max-width: 768px) {
.heroContent{flex: 100%;max-width: 100%;}
.heroCntntBox{display: block;padding: 20px 0 0;}
.heroContent .mainHeading{font-size: 28px;line-height: 34px;letter-spacing: normal;}
.heroContent .typingText{height: 34px;}
.heroContent .flipWindow .text .aiIcon{max-width: 20px;}
.heroContent .flipWindow{min-height: auto;min-width: 160px;width: 100%;}
.heroContent .flipWindow .text .mobileText{display: inline-block;}
.heroContent .flipWindow .text .webText{display: none;}
.heroContent .centerHeading{display: none;}
.heroContent .centerHeading,.heroContent .flipWindow .text{font-size: 28px;line-height: 34px;text-align: center;}
.heroContent .subHeading{margin-top: 30px;font-size: 14px;line-height: 20px;text-align: center;}
.demoBox{display: none;}
.voiceContainer{gap: 30px;}
.voiceContainer .botIcon{width: 50px;height: 50px;padding: 10px;flex-shrink: 0;}
.voiceContainer .botIcon > img,.voiceContainer .userIcon > img{width: 100%;height: 100%;}
.voiceContainer .userIcon{width: 50px;height: 50px;flex-shrink: 0;}
.waveform .voiceBar{width: 2px;}
.mobCtaBtn{display: block;}
@keyframes typing {
0%   { width: 0ch; }
60%  { width: 100%; }   
90%  { width: 100%; }   
100% { width: 0ch; } 
}
.waveform .voiceBar:nth-child(3),
.waveform .voiceBar:nth-child(6),
.waveform .voiceBar:nth-child(9),
.waveform .voiceBar:nth-child(14),
.waveform .voiceBar:nth-child(18) {
  display: none;
}
.waveform .voiceBar:nth-child(1){height:calc(20px * var(--scale));}
.waveform .voiceBar:nth-child(2){height:calc(40px * var(--scale));}
.waveform .voiceBar:nth-child(4){height:calc(80px * var(--scale));}
.waveform .voiceBar:nth-child(5){height:calc(100px * var(--scale));}
.waveform .voiceBar:nth-child(7){height:calc(100px * var(--scale));}
.waveform .voiceBar:nth-child(8){height:calc(80px * var(--scale));}
.waveform .voiceBar:nth-child(10){height:calc(40px * var(--scale));}
.waveform .voiceBar:nth-child(11){height:calc(20px * var(--scale));}
.waveform .voiceBar:nth-child(12){height:calc(40px * var(--scale));}
.waveform .voiceBar:nth-child(13){height:calc(35px * var(--scale));}
.waveform .voiceBar:nth-child(15){height:calc(90px * var(--scale));}
.waveform .voiceBar:nth-child(16){height:calc(110px * var(--scale));}
.waveform .voiceBar:nth-child(17){height:calc(85px * var(--scale));}
.waveform .voiceBar:nth-child(19){height:calc(35px * var(--scale));}
.waveform .voiceBar:nth-child(20){height:calc(40px * var(--scale));}
@keyframes bounce {
  0%, 100% {transform: scaleY(0.3);}
  50% {transform: scaleY(1);}
}  
}
@media screen and (max-width: 540px) {
.voiceContainer{justify-content: space-between;gap: 0;}
}
@media screen and (max-width: 340px) {
.heroContent .flipWindow .text .mobileText{font-size: 20px;line-height: 28px;}
}
/* hero banner section css end*/


/* trusted by section css start*/
.trustedSection{padding:20px 0 50px;}
.sectionTitle{color: #E6E6E6;font-size: 16px;font-weight: 700;line-height: normal;margin-bottom:30px}
.scrollWrapper{overflow:hidden;}
.scrollContent{display:flex;width: 100%;transition: all 0.5s linear;}
.scrollContent.animate{animation:scrollLeft 25s linear infinite;will-change: transform;}
.scrollContent .item{display: flex;align-items: center;justify-content: center;margin-right:80px;transition: all 0.5s linear;}
.scrollContent .item > img{height:auto;display:block;transition: all 0.5s linear;}

@keyframes scrollLeft {
0%{transform:translateX(0)}
100%{transform:translateX(-80%)}
}

@media screen and (max-width: 768px) {
.sectionTitle{font-size: 14px;line-height: normal;margin-bottom:20px}
.scrollContent{gap: 10px;}
.scrollContent.animate{animation:scrollLeft 10s linear infinite;will-change: transform;}
.scrollContent .item{margin-right:20px} 
.scrollContent .item > img{max-width: 50px;}
}
/* trusted by section css end*/


/* explore more section css start*/
.useCasesSection{width:100%;text-align:center}
.useCasesSection .useCasesContainer{margin:40px auto 0;display:grid;grid-template-columns:repeat(2, 1fr);gap:20px;max-width:800px;justify-items:center;}
.useCaseCard{background-color:#1f1f1f;border-radius:12px;width:100%;max-width:350px;text-align:left;box-sizing:border-box;position:relative;cursor:pointer;transition:transform 0.3s ease, box-shadow 0.3s ease;}
.useCaseCard .useCaseDetails{display: flex;gap: 20px;padding:20px 20px 15px;}
.useCaseCard .useCaseDetails .useCaseLogo{width:53px;height:53px;display: flex;align-items: center;justify-content: center;border: 1px solid #3A3A47;background: #1E1E26;border-radius:50%;overflow:hidden;}
.useCaseCard .useCaseTitle{color: #FFF;font-size: 16px;font-weight: 700;line-height: 26px;}
.useCaseCard .useCaseDesc{color: #DFDFDF;font-size: 14px;font-style: normal;font-weight: 400;line-height: 18px;margin-top:5px;}
.useCasesSection .useCasePlayer{padding:15px 20px 20px;border-top: 1px solid #242424; display:flex;align-items:center;gap:12px}
.useCasesSection .playButton{width:40px;height:40px;border-radius:50%;background-color:#FFDD04;display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;transition:all 0.3s ease;position:relative}
.useCasesSection .playButton::before{content:"";display:block;width:0;height:0;border-left:12px solid #1E1E26;border-top:7px solid transparent;border-bottom:7px solid transparent;transition:all 0.3s ease}
.useCasesSection .playButton.playing{background-color:#ff6b6b}
.useCasesSection .playButton.playing::before{display:none}
.useCasesSection .playButton.playing::after{content:"";display:block;width:4px;height:16px;background-color:#1E1E26;position:absolute;left:50%;top:50%;transform:translate(-50%, -50%);box-shadow:8px 0 0 #1E1E26;margin-left:-4px}
.useCasesSection .playButton:hover{transform:scale(1.1);box-shadow:0 4px 12px rgba(255, 221, 4, 0.3)}
.useCasesSection .voiceBars{flex:1;height:20px;background:repeating-linear-gradient(to right,#33d4ff,#33d4ff 2px,transparent 2px,transparent 6px)}

/* Use Case Tooltip Styles */
.useCaseTooltip{
  position: absolute;
  bottom: -40px;
  left: 50%;
  transform: translateX(-50%);
  background: #FFDD04;
  color: #1E1E26;
  padding: 8px 16px;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s ease;
  z-index: 10;
  box-shadow: 0 4px 12px rgba(255, 221, 4, 0.3);
}

.useCaseTooltip::before{
  content: '';
  position: absolute;
  top: -6px;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-bottom: 6px solid #FFDD04;
}

/* Tooltip for first row (Real Estate and Banking) - show above */
.useCaseCard:nth-child(1) .useCaseTooltip,
.useCaseCard:nth-child(2) .useCaseTooltip{
  bottom: auto;
  top: -40px;
  left: 50%;
  transform: translateX(-50%);
}

.useCaseCard:nth-child(1) .useCaseTooltip::before,
.useCaseCard:nth-child(2) .useCaseTooltip::before{
  top: auto;
  bottom: -6px;
  left: 50%;
  transform: translateX(-50%);
  border-bottom: none;
  border-top: 6px solid #FFDD04;
}

.useCaseCard:hover{
  transform: translateY(-5px);
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.3);
}

.useCaseCard:hover .useCaseTooltip{
  opacity: 1;
  visibility: visible;
  transform: translateX(-50%) translateY(-5px);
}

/* Hover animation for upper row tooltips */
.useCaseCard:nth-child(1):hover .useCaseTooltip,
.useCaseCard:nth-child(2):hover .useCaseTooltip{
  transform: translateX(-50%) translateY(5px);
}
@media (max-width: 768px) {
.useCasesSection .useCasesContainer{margin: 30px auto 0;grid-template-columns: 1fr;gap: 12px;max-width: 100%;}
.useCasesSection .useCaseCard{max-width: 100%;}
.useCaseCard .useCaseTitle{font-size: 14px;}
.useCaseCard .useCaseDesc{font-size: 12px;line-height: 18px;}
.useCaseCard .useCaseDetails .useCaseLogo{width:43px;height:43px;}
.useCaseCard .useCaseDetails .useCaseLogo>img{max-width: 50%;}
.useCaseCard .useCaseDetails{padding: 15px 15px 10px;}

/* Mobile: Show language info as italic text in brackets */
.useCaseTooltip{
  display: none;
}

/* Add language info as italic text in brackets for mobile */
.useCaseCard .useCaseDesc::after{
  content: " (English)";
  font-style: italic;
  color: #D4D4D4;
  font-size: 12px;
}

.useCaseCard:nth-child(2) .useCaseDesc::after{
  content: " (English, Hindi)";
}

.useCaseCard:nth-child(3) .useCaseDesc::after{
  content: " (Hindi)";
}

.useCaseCard:nth-child(4) .useCaseDesc::after{
  content: " (Hindi, Odia)";
}

/* Hide hover effects and transitions on mobile */
.useCaseCard{
  transition: none;
}

.useCaseCard:hover{
  transform: none;
  box-shadow: none;
}

.useCaseCard:hover .useCaseTooltip{
  transform: none;
  opacity: 1;
  visibility: visible;
}
}
/* explore more section css end*/


/* stmartagentTab section css start*/
.superAgentDetails .tabs{transform: translateY(30px);z-index: 1;display:flex;align-items:center;position: relative;width: fit-content;background:#fff;padding:5px;border-radius:80px;box-shadow:0 1px 6px #0000001f;margin:10px auto 0;}
.superAgentDetails .tabs .tab{padding:8px 20px;color: #333;font-size: 16px;font-weight: 500;line-height: 34px;white-space: nowrap;background-color: #fff;border-radius:80px;display:flex;align-items:center;gap:8px;transition: all 0.4s ease-in-out;position: relative;cursor: pointer;}
.superAgentDetails .tabs .tab.active{background-color:#FFDD04;color:#000;}
.superAgentDetails .tabContents{position:relative;min-height:530px;}
.superAgentDetails .tabContent{opacity:0;transform:translateY(10px);position:absolute;top:0;left:0;bottom: 0;right: 0;width:100%;pointer-events:none;transition:opacity .4s ease,transform .4s ease}
.superAgentDetails .tabContent.active{opacity:1;transform:translateY(0);pointer-events:auto;}
.superAgentDetails .tabContent.fade-out{opacity:0;transform:translateY(10px);transition:opacity .4s ease,transform .4s ease;}

.featurePanel{width: 100%;height: 100%;position: relative;border-radius: 26px;background: #131212;overflow: hidden;}
.featurePanel .featureList{position: absolute;left: 40px;bottom: 40px;background-color:#17161a;border-radius:12px;border:1px solid #FFDD04;min-width:360px;max-width:605px;z-index: 1;}
.featurePanel .featureItem{padding: 25px;display:flex;flex-direction:column;gap:4px}
.featurePanel .featureItem ~ .featureItem{border-top: 1px solid #FFDD0414;}
.featurePanel .featureTitle{color: #FFDD04;font-size: 18px;font-weight: 700;line-height: normal;letter-spacing: -0.18px;margin-bottom:2px}
.featurePanel .featureDescription{color: #D4D4D4;font-size: 14px;font-weight: 400;line-height: 22px;}
.featurePanel .featureImage{width: 100%;height: 100%;background:transparent;display:flex;justify-content:flex-end;position: relative;}
.featurePanel .featureImage::before {content: '';position: absolute;top: 0; left: 0;width: 70%;height: 100%;background: linear-gradient(to right, #131212 70%, transparent 100%);opacity: 0.8;pointer-events: none;}
.featurePanel .featureImage img{max-width:100%;height:100%;object-fit:contain}

.statsBar{display:flex;flex-direction:row;justify-content:space-between;align-items:flex-start;gap:0;width:100%;margin:50px auto 0;}
.statsBar .statBlock{display:flex;flex-direction:column;align-items:flex-start;min-width:180px;gap:4px;position: relative;}
.statsBar .statBlock:not(:first-child)::before{content:"";position:absolute;left:-40px;top:calc(50% - 30px);width:1px;height:60px;background:#FFDD0433;border-radius:1px;}
.statsBar .statIcon{width:32px;height:32px;margin-bottom:7px;object-fit:contain}
.statsBar .statValue{font-size:38px;font-weight:800;color:#FFDD04;margin-top:10px;}
.statsBar .statValue.lessThan{color:#FFDD04;letter-spacing:.5px}
.statsBar .statTitle{margin-top: 10px;font-size:18px;font-weight:600;color:#fff;line-height: 150%;}
.statsBar .statDesc{font-size:14px;color:#D4D4D4;font-weight:400;line-height: 150%;}
@media screen and (max-width: 768px) {
.superAgentDetails .tabs{width: 100%;overflow-x: auto;padding: 3px;transform: translateY(22px);}
.superAgentDetails .tabs::-webkit-scrollbar{display: none;}
.superAgentDetails .tabs .tab{flex: 1;font-size: 11px;padding: 2px 18px;border-radius: 60px;cursor: default;transition: all 0.5s ease-in-out;}
.superAgentDetails .tabs .tab span {display: inline-block;max-width: 0;overflow: hidden;white-space: nowrap;transition: all 0.4s ease-in-out;}
.superAgentDetails .tabs .tab.active span{max-width: 300px;}
.superAgentDetails .tabContents{min-height: 457px;}
.featurePanel{background: none;}
.featurePanel .featureItem{padding: 20px;gap: 8px;}
.featurePanel .featureList{padding-top: 15px;background: #1E1E26;position: unset;max-width: 100%;min-width: 100%;}
.featurePanel .featureImage{display: none;}
.featurePanel .featureTitle{font-size: 14px;}
.featurePanel .featureDescription{font-size: 12px;line-height: 18px;}
.statsBar{margin: 20px 0 0;flex-wrap: wrap;gap: 40px;position: relative;}
.statsBar .statValue{font-size: 32px;}
.statsBar .statIcon{width: 25px;height: 25px;}
.statsBar .statTitle{font-size: 14px;}
.statsBar .statDesc{font-size: 11px;}
.statsBar .statBlock{width: calc(50% - 20px);min-width: auto;}
.statsBar .statBlock:not(:first-child)::before{display: none;}
.statsBar::before{content:"";position:absolute;top: calc(48% - 1px);left:0;right:0;width:100%;height:1px;background-color:#FFDD0433;}
.statsBar::after{content:"";position:absolute;left: calc(49% - 1px);top:0;right:0;width:1px;height:100%;background-color:#FFDD0433;}
}
/* stmartagentTab section css end*/


/* features Stats section css start*/
.buildForScale{padding-bottom: 0;}
.featuresStatsPanel{margin-top: 80px;padding-bottom: 50px;position: relative;display:flex;flex-direction:row;justify-content:flex-start;gap:34px;width:100%;}
.featuresStatsPanel .featuresList{max-width: 570px;position: relative;background-color:transparent;display:flex;flex-direction:column;gap:18px;}
.featuresStatsPanel .featureItem{display:flex;flex-direction:row;align-items:flex-start;padding:12px 0;gap:16px;min-height:44px}
.featuresStatsPanel .featureIcon{width:24px;height:24px;object-fit:cover}
.featuresStatsPanel .featureContent{display:flex;flex-direction:column;gap:0}
.featuresStatsPanel .featureTitle{color: #FFDD04;font-size: 20px;font-weight: 700;letter-spacing: -0.2px;}
.featuresStatsPanel .featureDesc{margin-top: 10px;color: #D4D4D4;font-size: 16px;font-weight: 400;line-height: 22px;}
.featuresStatsPanel .statsCard{background: #1E1E26;border-radius: 20px 20px 0 0;backdrop-filter: blur(5px);position:absolute;right:0;bottom:0;width:450px;}
.featuresStatsPanel .statsCard::before{content:"";border-radius: 20px 0 0 0;position:absolute;bottom:0px;left:-50px;width:50px;height:calc(100% - 50px);background:#272731;pointer-events:none;z-index: -1;}
.featuresStatsPanel .statsCard .statsGrid{display:grid;grid-template-columns:1fr 1fr;position: relative;}
.featuresStatsPanel .statsCard .statsGrid::before{content:"";position:absolute;top: calc(48% - 1px);left:0;right:0;width:100%;height:1px;background-color:#2A2626;z-index: -1;}
.featuresStatsPanel .statsCard .statsGrid::after{content:"";position:absolute;left: calc(50% - 1px);top:0;right:0;width:1px;height:100%;background-color:#2A2626;z-index: -1;}
.featuresStatsPanel .statsCard .statBox{padding: 20px;text-align: center;display:flex;flex-direction:column;align-items:center;justify-content: center;}
.featuresStatsPanel .statsCard .statIcon{width:28px;height:28px;margin-bottom:4px;object-fit:contain}
.featuresStatsPanel .statsCard .statValue{font-size:44px;font-weight:700;color:#FFDD04;line-height:normal;}
.featuresStatsPanel .statsCard .statLabel{font-size:14px;color:#fff;font-weight:700;margin-top: 2px;}
.featuresStatsPanel .statsCard .statDesc{font-size:11px;color:#aaa;font-weight:400;line-height:150%;margin-top: 2px;}
@media screen and (max-width:1024px){
.featuresStatsPanel{padding-bottom: 0;}
.featuresStatsPanel{margin-top: 40px;flex-direction: column;}
.featuresStatsPanel .featureTitle{font-size: 14px;}
.featuresStatsPanel .featureDesc{font-size: 12px;line-height: 18px;}
.featuresStatsPanel .statsCard{position: initial;width: calc(100% - 15px);}
.featuresStatsPanel .statsCard::before{left: -15px;width: 15px;}
.featuresStatsPanel .statsCard .statsGrid::before{top: calc(47% - 1px);}
.featuresStatsPanel .statsCard .statValue{font-size: 32px;}
.featuresStatsPanel .statsCard .statLabel{font-size: 13px;}
.featuresStatsPanel .statsCard .statDesc{font-size: 11px;}
.featuresStatsPanel .statsCard .statBox{padding: 15px;}
.featuresStatsPanel .statsCard .statIcon{width: 25px;height: 25px;margin-bottom: 8px;} 
}
@media screen and (max-width:540px){
.featuresStatsPanel{align-items: flex-end;}
.featuresStatsPanel .featuresList{gap: 0;}
}
/* features Stats section css end*/


/* features Stats section css start*/
.featuresGrid{margin-top: 40px;display:grid;grid-template-columns:1fr 1fr 1fr;grid-gap:28px;width:100%;}
.featuresGrid .featureCard{border-radius: 26px;background: #131212;padding:22px 20px 20px;display:flex;flex-direction:column;align-items:center;text-align: center;border:1px solid transparent;transition:all .3s ease-in-out;}
.featuresGrid .featureCard:hover{border:1px solid #FFDD04;box-shadow: 0 0 40px 2px rgba(255, 221, 4, 0.06);}
.featuresGrid .featureHeader{color:#fff;font-size:18px;font-weight:700;transition: all 0.3s ease-in-out;}
.featuresGrid .featureCard:hover .featureHeader{color:#FFDD04}
.featuresGrid .featureDesc{margin-top: 20px;color:#D4D4D4;font-size:14px;font-weight:400;min-height:48px}
.featuresGrid .featureImg{margin-top: 30px;width:100%;height:175px;border-radius:20px;background:#191921;overflow: hidden;}
.featuresGrid .featureImg>img{width: 100%;height: 100%;object-fit: cover;}
.featuresGrid .featureBtn{background:#131212;border-radius: 8px;color: #fff;border: 1px solid #FFF;padding:12px 35px;font-size:12px;font-weight:400;cursor:pointer;transition:all 0.3s linear;}
.featuresGrid .featureCard:hover .featureBtn{color:#FFDD04;border: 1px solid #FFDD04;}

@media (max-width: 680px) {
.featuresGrid{grid-gap:12px;overflow-x: auto;display: flex;}
.featuresGrid::-webkit-scrollbar{display: none;}
.featuresGrid .featureCard{min-width: 220px;padding: 15px;}
.featuresGrid .featureHeader{font-size: 14px;;}
.featuresGrid .featureDesc{margin-top: 10px;font-size: 1rpx;line-height: 17px;display: -webkit-box;-webkit-line-clamp: 3;line-clamp: 3;-webkit-box-orient: vertical;overflow: hidden;}
.featuresGrid .featureImg{margin-top: 20px;height: 110px;}
.featuresGrid .featureBtn{padding: 8px 25px;font-size: 12px;}
}
/* features Stats section css end*/


/* matrics section css end*/
.metricsSection{margin-top: 30px;}
.metricsBar{display:flex;justify-content:space-between;width:100%;align-items:center;position: relative;}
.metricsBar .metricBox{position:relative;display:flex;flex-direction:column;align-items:center;justify-content: center;min-width:160px;}
.metricsBar .metricBox:not(:first-child)::before{content:"";position:absolute;left:-40px;top:calc(50% - 30px);width:1px;height:60px;background:#FFDD0433;border-radius:1px;}
.metricsSection .metricTitle{font-size:26px;color:#fff;font-weight:600;line-height: 150%;;}
.metricsSection .metricValue{font-size:56px;color:#FFDD04;font-weight:800;line-height: normal;margin-top:5px}
.metricsSection .metricValue.lessThan,.metricsSection .metricValue.greaterThan{color:#FFDD04;letter-spacing:1px}
.metricsSection .metricValue .highlight{color:#FFDD04;letter-spacing: 1px;}
.metricsSection .metricDesc{font-size:16px;color:#D4D4D4;font-weight:400;line-height: 150%;}
.metricsSection .metricSubDesc{font-size:12px;color:#FFDD04;line-height: 150%;margin-bottom: 3px;}
.metricsSection .infraCardsRow{margin-top: 35px;display:flex;gap:30px;}
.metricsSection .infraCard{flex: 1;background:#1E1E26;border-radius:20px;padding:40px;}
.metricsSection .infraCardIcon .infraIconImg{object-fit:contain;vertical-align: middle;}
.metricsSection .infraCardContent{margin-top: 20px;}
.metricsSection .infraCardTitle{font-size:22px;font-weight:700;color:#FFDD04;}
.metricsSection .infraCardList{margin-top: 20px;color:#e6e6e6;}
.metricsSection .infraCardList li{padding-left:18px;margin-bottom:5px;font-size:14px;line-height: 26px;font-weight:400;position: relative;}
.metricsSection .infraCardList li::before{content:"";position:absolute;left:0;top:calc(50% - 3px);width:5px;height:6px;background:#FFDD04;border-radius:50%}
@media (max-width: 1024px) {
.metricsSection .metricsBar{flex-wrap: wrap;gap: 40px;}
.metricsSection .infraCardsRow{flex-direction:column;gap:18px;align-items:stretch}
.metricsSection .metricBox{width: calc(50% - 20px);min-width: auto;text-align: center;}
.metricsSection .metricBox:not(:first-child)::before{display: none;}
.metricsSection .metricTitle{font-size: 18px;white-space: nowrap;}
.metricsSection .metricValue{font-size: 28px;}
.metricsSection .metricDesc{font-size: 12px;}
.metricsBar::before{content:"";position:absolute;top: calc(48% - 1px);left:0;right:0;width:100%;height:1px;background-color:#FFDD0433;}
.metricsBar::after{content:"";position:absolute;left: calc(49% - 1px);top:0;right:0;width:1px;height:100%;background-color:#FFDD0433;}
}
@media (max-width: 768px) {
.metricsSection .infraCard{padding: 25px;}
.metricsSection .infraCardTitle{font-size: 20px;line-height: normal;}
.metricsSection .infraCardList li{font-size: 12px;line-height: 24px;}
.metricsSection .infraCardList li::before{top: 8px;}
}
/* matrics section css end*/


/* testimonal slider css end*/
.bannerCarousel{margin-top: 36px;position: static;height: 360px!important;}
.bannerCarousel .testimonialSlider {position: absolute;width: 60%; margin: 0;top: inherit;left: 50%;transform: translateX(-50%);}
.carouselContainer{position: relative;left: 50%;top: 0%;height: 80%;transform: translate(-50%) scale(0.8);width: 100%;}
.carouselContainer .slick-slider .slick-arrow {position:absolute;top: calc(50% - 20px);}
.carouselContainer .slick-slider .next-btn{position: absolute;right:-105px;cursor: pointer;transform: rotate(-90deg);} 
.carouselContainer .slick-slider .next-btn::after{content: "\e919"; font-family: icomoon;color: #fff;font-size: 14px;font-weight: bold;}
.carouselContainer .slick-slider .prev-btn::after{content: "\e919";font-family: icomoon;color: #fff;font-size: 14px;font-weight: bold;}
.carouselContainer .slick-slider .prev-btn {position: absolute;left: -105px;cursor: pointer;transform: rotate(90deg);}  
.carouselContainer .slick-slider .prev-btn, .next-btn {width: 40px;height: 40px;border-radius: 50%;border: none;background: #000;text-align: center;padding: 0;z-index: 1;} 
.carouselContainer .content{height: 370px;}
.carouselContainer .slick-sprev{clip-path: polygon(0 0, 100% 20%, 100% 80%, 0% 100%);opacity: 0.9;filter:blur(2px) !important;}
.carouselContainer .slick-snext{clip-path: polygon(0 20%, 100% 0, 100% 100%, 0 80%);opacity: 0.9;filter:blur(2px) !important;}

.slick-dots{text-align:right;position:absolute;bottom:0;left:0;right:0}
.slick-track{max-width:100%!important;transform:translate3d(0,0,0)!important;perspective:100px}
.slick-slide{position:absolute;top:0;left:0;right:0;bottom:0;margin:auto;opacity:0;width:100%!important;transform:translate3d(0,0,0);transition:transform 1s,opacity 1s}
.slick-snext,.slick-sprev{display:block}
.slick-current{opacity:1;position:relative;display:block;transform:translate3d(0,0,20px);z-index:2}
.slick-snext{opacity:1;transform:translate3d(35%,0,0);z-index:1}
.slick-sprev{opacity:1;transform:translate3d(-35%,0,0);}

.testimonialSlider .testimonialCard{border-radius: 18px;background: #FFF;box-shadow: 0 0 84px 0 rgba(0, 0, 0, 0.20);padding:40px;display:flex;flex-direction:column;align-items:flex-start;}
.testimonialSlider .testimonialStars{display:flex;gap:5px;}
.testimonialSlider .testimonialStar{width:40px;height:40px}
.testimonialSlider .quoteLeft{text-align:left;}
.testimonialSlider .quoteRight{text-align: right;}
.testimonialSlider .testimonialText {margin:15px 0 0;}
.testimonialSlider .testimonialText .testimonialDesc{min-height: 84px;display: -webkit-box;-webkit-line-clamp: 3;line-clamp: 3;-webkit-box-orient: vertical;overflow: hidden;color: #000;font-size: 16px;font-weight: 700;line-height: 28px;}
.testimonialSlider .testimonialFooter{display:flex;gap: 15px;margin-top:14px;width:100%;position:relative;z-index:2}
.testimonialSlider .testimonialAuthorBadge{width:52px;height:52px;background:#F2950033;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;}
.testimonialSlider .testimonialBadgeInitials{color:#F29500;font-size:20px;font-weight:600}
.testimonialSlider .testimonialAuthorInfo{display:flex;flex-direction:column;justify-content:center;min-width:0}
.testimonialSlider .testimonialAuthorName{color:#000;font-size:16px;font-weight:700;}
.testimonialSlider .testimonialAuthorRole{color:#666;font-size:14px;font-weight:400;margin-top:2px}
.testimonialSlider .testimonialQuoteRight{margin-left:auto}
@media (max-width: 768px) {
.testimonialSlider .testimonialCard{padding:20px 12px 18px}
.testimonialSlider .testimonialStars>img{max-width: 20px;}
.testimonialSlider .quoteLeft>svg,.testimonialSlider .quoteRight > svg{max-width: 30px;}
.testimonialSlider .testimonialText .testimonialDesc{font-size: 12px;line-height: 20px;}
.bannerCarousel .testimonialSlider {width: 72%;}
.testimonialSlider .testimonialFooter{margin-top:0px}
.testimonialSlider .testimonialAuthorBadge{width:35px;height:35px}
.testimonialSlider .testimonialBadgeInitials{font-size:16px}
.testimonialSlider .testimonialAuthorName{font-size:12px;}
.testimonialSlider .testimonialAuthorRole{font-size:12px;line-height: normal;}
.carouselContainer .slick-slider .prev-btn {left: -90px;cursor: default;}  
.carouselContainer .slick-slider .next-btn {right: -90px;cursor: default;}
}

.ctaBlock{margin-top: 100px;background:#131212;border-radius:26px;padding:50px;position: relative;}
.ctaBlock .ctaContent{max-width: 65%;}
.ctaBlock .ctaTitle{font-size:34px;font-weight:700;color:#fff;line-height: normal;}
.ctaBlock .ctaDesc{font-size:20px;line-height: 30px;font-weight:400;color:#D4D4D4;margin-top:10px}
.ctaBlock .ctaActions{display:inline-flex;gap:14px;margin-top:30px}
.ctaBlock .ctaBtn{padding:15px 50px;border-radius:12px;font-size:16px;font-weight:700;cursor:pointer;outline:none;transition: 0.3s all ease-in-out;}
.ctaBlock .ctaBtnPrimary{background:#FFDD04;color:#232323;border:1px solid #FFDD04;}
.ctaBlock .ctaBtnPrimary:hover{background:transparent;color:#FFDD04;}
.ctaBlock .ctaBtnSecondary{background:transparent;color:#FFDD04;border:1px solid #FFDD04;}
.ctaBlock .ctaBtnSecondary:hover{background:#FFDD04;color:#000;}
.ctaBlock .ctaImageWrap{position: absolute;right: 50px;top: calc(50% - 95px);}
.ctaBlock .ctaImageWrap::after {content: "";position: absolute;top: 0;left: -100%;width: 100%;height: 100%;background: url('../images/graphImsge.png') no-repeat;background-size: cover;opacity: 0.1;mask-image: linear-gradient(to bottom, rgba(0,0,0,1), rgba(0,0,0,0));-webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,1), rgba(0,0,0,0));}
.ctaBlock .ctaImage{object-fit:cover;border-radius:12px;background:#232327;}

@media (max-width: 1024px) {
.ctaBlock{padding: 20px;}
.ctaBlock .ctaImageWrap{right: 20px;}
}
@media (max-width: 768px) {
.ctaBlock{margin-top: 0;padding:20px;}
.ctaBlock .ctaContent{max-width: 100%;}
.ctaBlock .ctaTitle{font-size:24px;line-height: 34px;}
.ctaBlock .ctaDesc{font-size:15px;line-height: 26px;}
.ctaBlock .ctaImageWrap{margin-top: 25px; position: initial;width: 100%;aspect-ratio: 1.5 / 1;}
.ctaBlock .ctaImage{width:100%;height:100%;object-fit:cover;}
.ctaBlock .ctaActions{width:100%;gap:15px;}
.ctaBlock .ctaBtn{padding:15px 10px;font-size:12px}
.ctaBlock .ctaBtnPrimary{width: 130px;}
.ctaBlock .ctaBtnSecondary{flex: 1 1 0;}
}

/* testimonal slider css end*/


/* seamless integration css end*/
.integrationCardsRow{margin-top: 40px;display:flex;gap:30px;justify-content:center;}
.integrationCardsRow .integrationCard{flex: 1;background:#1E1E26;border-radius:26px;padding:25px;display:flex;flex-direction:column;align-items:flex-start;position:relative;border:1px solid transparent;transition: all 0.3s ease-in-out;}
.integrationCardsRow .integrationCard:hover{border:1px solid #FFDD04}
.integrationCardsRow .integrationIconImg{width:32px;height:32px;object-fit:contain}
.integrationCardsRow .integrationCardHeader{font-size:22px;color:#FFDD04;font-weight:700;margin-top:7px}
.integrationCardsRow .integrationCardDesc{color:#D4D4D4;font-size:16px;line-height: 24px;font-weight:400;margin-top:15px;}
.integrationCardsRow .integrationCardLogos{display:flex;flex-direction:row;gap:20px;margin-top:15px}
.integrationCardsRow .logoBox{background:#fff;border-radius:8px;padding:6px 10px;flex: 1;height:52px;display:flex;align-items:center;justify-content:center}
.integrationCardsRow .cardLogoText{font-size:12px;font-weight:700;text-align: center;background: linear-gradient(90deg, #F30C0C 0%, #4C00BF 100%);background-clip: text;-webkit-background-clip: text;-webkit-text-fill-color: transparent;letter-spacing:1px;line-height: normal;}
.integrationCardsRow .integrationCardBtn{width:100%;background:transparent;border-radius: 8px;color: #fff;border: 1px solid #FFF;font-size:12px;font-weight:400;padding:12px 5px;cursor:pointer;margin-top:30px;transition: all 0.3s ease-in-out;}
.integrationCardsRow .integrationCard:hover .integrationCardBtn{box-shadow: 0 0 40px 2px rgba(255, 221, 4, 0.06);border:1px solid #FFDD04;color:#FFDD04;border:1px solid #FFDD04;}
.integrationCardsRow .integrationCard:hover .integrationCardBtn:hover{background:#FFDD04;color:#1E1E26;border: 1px solid #FFDD04;}
@media (max-width: 1024px) {
.integrationCardsRow{flex-direction:column;gap:15px;}
}
@media (max-width: 768px) {
.integrationCardsRow .integrationCard{padding:20px;}
.integrationCardsRow .integrationCardHeader{margin-top: 10px;font-size:16px;line-height: 100%;}
.integrationCardsRow .integrationCardDesc{font-size:12px;line-height: 20px;margin-top:10px;}
.integrationCardsRow .integrationCardLogos{flex-wrap:wrap;gap:10px;}
.integrationCardsRow .logoBox{width: calc(24% - 10px);height: 40px;}
.integrationCardsRow .logoBox > img{width:100%;height:100%;object-fit:contain;}
.integrationCardsRow .cardLogoText{font-size:7px;line-height: 10px;}
}
/* seamless integration css end*/


/* footer css end*/
.footerSection{width:100%;background:#23232a;}
.footerSection .footerMain{padding:75px 0 30px;}
.footerSection .footerLists{display:flex;flex-direction:row;flex-wrap:wrap;gap:36px;justify-content:flex-start;}
.footerSection .footerLists ~ .footerLists{margin-top:20px;padding-top:20px;border-top:1px solid #32323C;}
.footerSection .footerList{min-width: calc(25% - 28px);}
.footerSection .footerList.footerAbout{flex:2 2 0;}
.footerSection .footerList.mobService{display: none;}
.footerSection .footerAbout .footerListMenu li{max-width: 90%;}
.footerSection .footerListTitle{color: #FFF;font-size: 18px;font-weight: 600;line-height: 22px;letter-spacing: -0.18px;}
.footerSection .footerListMenu{margin-top:20px;}
.footerSection .footerListMenu li,.footerSection .footerListMenu li > a{display: flex;color: #D4D4D4;font-size: 14px;font-style: normal;font-weight: 400;line-height: 24px;transition: all 0.3s ease-in-out;}
.footerSection .footerListMenu li > a:hover{color: #FFDD04;transform: scale(1.03);}
.footerSection .footerContactIcons{display:flex;gap:15px;margin-top:20px}
.footerSection .footerBottomFlex{display:flex;gap:15px;justify-content: center;}
.footerSection .footerBottomFlex .footerBottomLeft{font-size: 14px;color: #d4d4d4;line-height: normal;transition: all 0.3s ease-in-out;}
.footerSection .footerIconImg{width:27px;height:27px;object-fit:contain;background:#222;border-radius:6px;transition: all 0.3s ease-in-out;}
.footerSection .footerIconImg:hover{transform: scale(1.2);}
.footerSection .footerBottom{width:100%;background:#000;padding:16px 18px;display:flex;justify-content:space-between;align-items:center;margin-top:22px;}
.footerSection .footerBottomMenu{display:flex;gap:22px;}
.footerSection .footerBottomMenu > a{cursor:pointer;font-size: 14px;color: #d4d4d4;line-height: normal;transition: all 0.3s ease-in-out;}
.footerSection .footerBottomMenu > a:hover{color: #fff;transform: scale(1.03);}

@media (max-width: 480px) {
.footerSection .footerListTitle{font-size: 14px;line-height: 18px;}
.footerSection .footerListMenu{margin-top:10px;}
.footerSection .footerListMenu li,.footerSection .footerListMenu li > a{font-size: 12px;line-height: 20px;}
.footerSection .footerLists.footerAboutLists{flex-direction: column;}
.footerSection .footerLists{gap:20px;}
.footerSection .footerList{min-width: calc(50% - 10px);}
.footerSection .footerAbout .footerListMenu li{max-width: 100%;}
.footerSection .footerBottom{padding:15px 5px;margin-top: 0;}
.footerSection .footerBottomMenu{display: none;}
.footerSection .footerBottomFlex .footerBottomLeft{font-size: 12px;}
.footerSection .footerList.mobService{display: block;}
.footerSection .footerMain{padding:30px 0;}
}
/* footer css end*/


/* overlay css start */
.demoModalOverlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000000CC;backdrop-filter:blur(2px);display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:all .4s cubic-bezier(0.4,0,0.2,1);z-index: 100;}
.demoModalOverlay.active{opacity:1;visibility:visible}
.demoModalOverlay.active .demoModal, .demoModalOverlay.active .webDemoPopup{transform:scale(1) translateY(0)}
.demoModalOverlay .demoModal{width:350px;border-radius: 16px;background: #282828;box-shadow:0 1px 15px #00000030;display:none;flex-direction:column;transform:scale(0.95) translateY(20px);transition:all .4s cubic-bezier(0.4,0,0.2,1);}
.demoModal .demoModalHeader {padding:15px 20px;display:flex;align-items:center;justify-content:space-between;}
.demoModal .demoModalHeader .heading{color: #FFF;font-size: 14px;font-weight: 600;line-height: normal;}
.demoModal .demoModalClose{color:#8E8E8E;font-size:24px;cursor:pointer;margin-left:15px;margin-top:-3px;}
.demoModal .demoModalBody{border-top: 1px solid #2F2F2F;display:flex;flex-direction:column;padding:20px;}
.demoModal .demoModalLabel{display:block;color: #B5B5B5;font-size: 12px;font-weight: 400;line-height: normal;}
.demoModal .demoModalInputRow{margin-top: 12px;display:flex;width:100%}
.demoModal .demoModalCountryCode{width: 80px;padding:15px 20px 15px;font-size:12px;border-radius:6px 0 0 6px;background:#fff;color:#333;border: none;font-weight:400;outline:none;}
.demoModal .demoModalInput{flex:1 1 0;padding:10px;margin: 0;font-size:12px;border-radius:0 6px 6px 0;border: none;border-left:1px solid #dedede;background:#fff;color:#333;outline:none;}
.demoModal .demoModalBtn{margin-top:30px;background:#FFDD04;color:#000000;font-size:14px;font-weight:700;border:none;border-radius:6px;padding:14px 10px;width:100%;cursor:pointer;outline:none;}
.demoModal .demoModalBtnFull{width:100%}
.demoModal .demoModalOtpMsg .message{color:#B5B5B5;font-size:12px;line-height:18px;}
.demoModal .demoModalOtpPhone{display:flex;align-items: center;gap: 15px;margin-top: 10px;font-size: 14px;font-weight:700;color:#fff;}
.demoModal .demoModalOtpChange{display: flex;align-items: center;gap: 7px;color:#FFDD04;font-size:14px;font-weight: 700;cursor:pointer}
.demoModal .demoModalOtpInputs{display:flex;gap:8px;align-items: center;justify-content:space-between;margin-top: 25px;}
.demoModal .demoModalOtpInput{width:50px;height:45px;background:#fff;font-size:23px;font-weight:700;color:#101010;text-align:center;border-radius:6px;border: none;outline:none;}
.demoModal .demoModalInfoRow{display:flex;align-items:center;gap:8px;}
.demoModal .demoModalInfoRow .demoModalInfoText{font-size:12px;color:#fff;font-weight:400;}
.demoModal .demoModalInfoIcon > img{width: 15px;}
.demoModal .demoModalUseCase{margin-top:20px;font-size:14px;font-weight:700;}
.demoModal .demoModalUseCaseHead{color:#fff;}
.demoModal .demoModalUseCaseHighlight{color:#FFDD04;}
.demoModal .demoModalDemoText{margin-top: 10px;color:#B5B5B5;font-size:12px;line-height:18px;}
.demoModal .demoModalBanner{margin-top: 20px;background:#353535;border-radius:6px;padding:15px;}
.demoModal .demoModalBannerTitle{color:#FFDD04;font-weight:400;font-size:14px;}
.demoModal .demoModalBannerSubtitle{margin-top: 10px;color:#fff;font-size:12px;font-weight:400;line-height: 18px;}

.webDemoPopup{min-height: 520px;background:#1b1b1e;border-radius: 16px 16px 25px 25px;border: 1px solid #FFDD04;box-shadow: 0 4px 70px 16px rgba(255, 221, 4, 0.08);display:flex;flex-direction:column;overflow:hidden;transform:scale(0.95) translateY(20px);transition:all .4s cubic-bezier(0.4,0,0.2,1);z-index: 101;display: none;}
.webDemoPopup.active{transform:scale(1) translateY(0px);transition:all .4s cubic-bezier(0.4,0,0.2,1);display: flex;}
.webDemoPopup.none{display: none;}
.webDemoPopup .webDemoPopupHeader{display:flex;align-items:center;justify-content: space-between; background:#FFDD04;padding:12px}
.webDemoPopup .webDemoPopupHeaderIcon{font-size:22px;margin-right:10px}
.webDemoPopup .webDemoPopupHeaderText{color:#000;font-size:14px;font-weight:700;}
.webDemoPopup .webDemoPopupHeader .dFlex{display: flex !important;width: 100% !important;}
.webDemoPopup .webDemoPopupHeader .demoModalClose {color: #1E1E26;font-size: 24px;cursor: pointer;margin-top: -3px;width: 25px;height: 25px;display: flex;align-items: flex-start;justify-content: center;}
.webDemoPopup .webDemoPopupChat{background:#202028;height:calc(100% - 122px);display:flex;flex-direction:column;justify-content: space-between;}
.webDemoPopup .apiResponse{margin-top: 40px;background:#1b1b22;padding:8px 20px;}
.webDemoPopup .apiResponse .message{display: block;font-size:12px;text-align: center;color:#fff;line-height:24px;text-align: center;}

.aiBlobAnimation{margin-top: 50px;display:flex;align-items:center;justify-content:center;}
.aiBlobAnimation .blobContainer {width: 135px;height: 135px;position: relative;}

.blobContainer  .circle{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:120px;height:120px;border-radius:55%;box-shadow:0 0 20px 10px #ff78000d;}
.blobContainer  .circle-1{background:radial-gradient(circle,#0a0a0a00 0%,#0a0a0a00 67%,#ff7800ff 73%,#ff7800ff 100%)}
.blobContainer  .circle-2{background:radial-gradient(circle,#0a0a0a00 0%,#0a0a0a00 67%,#0014ffff 75%,#0014ffff 100%);}
.blobContainer  .circle-3{background:radial-gradient(circle,#0a0a0a00 0%,#0a0a0a00 70%,#ffff 73%,#ffff 100%)}
.blobContainer.active .circle{animation:rotateShape 4s infinite ease-in-out;}
.blobContainer.active .circle-2{animation:rotateShape 4s infinite reverse ease-in-out;}

@keyframes rotateShape {
0%{transform:translate(-50%,-50%) rotate(0deg) scale(0.9);border-radius:50%}
50%{transform:translate(-50%,-50%) rotate(180deg) scale(1.15);border-radius:45% 55% 50% 50%}
100%{transform:translate(-50%,-50%) rotate(360deg) scale(0.9);border-radius:50%}
}

.webDemoPopup .webDemoPopupFooter{background:#FFDD041A;padding:13px 20px;display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:8px}
.webDemoPopup .webDemoPopupWarning{display:flex;align-items:center;gap:8px;}
.webDemoPopup .webDemoPopupWarning .webDemoPopupWarningText{color:#fff;font-size:12px;font-weight:300;line-height: 18px;max-width: 70%;}
.webDemoPopup .webDemoPopupWarningIcon{font-size:14px;margin-right:3px}
.webDemoPopup .demoModalBtn{border-radius: 8px;border: 1px solid #FFDD04;background: #0E0E18;color: #fff;font-size:14px;white-space: nowrap;padding:14px 20px;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:7px;margin-left:auto}
.webDemoPopup .demoModalBtnIcon{font-size:14px;margin-right:4px}
@media (max-width: 1024px) {
.webDemoPopup{position: fixed;width: 100%;left: 0;bottom: -100%;border-radius: 20px 20px 0 0;display: block;}
.webDemoPopup.active{bottom: 0;transition:all .4s cubic-bezier(0.4,0,0.2,1);display: block;}
.webDemoPopup .webDemoPopupHeader,.webDemoPopup .webDemoPopupFooter{padding-left:10px;padding-right:10px}
.webDemoPopup .webDemoPopupMessage{padding-left:10px;padding-right:10px;font-size:12px}
.webDemoPopup .webDemoPopupFooter{flex-direction:column;align-items:flex-start;gap:10px}
.webDemoPopup .webDemoPopupChat{height:calc(70vh - 110px)}
.webDemoPopup .demoModalBtn{width:100%;justify-content:center;margin-left:0}
.demoModalOverlay{justify-content:initial;align-items: flex-end;}
.demoModalOverlay .demoModal{width:100%;border-radius: 20px 20px 0 0;}
.demoModalOverlay .webDemoPopup{width:100%;border-radius: 20px 20px 0 0;}
.demoModal .demoModalOtpInputs{justify-content: space-evenly;}
}
@media screen and (max-width: 768px) {
.demoModal .demoModalOtpInputs{justify-content: space-between;}
.aiBlobAnimation{margin-top: 30px;}
.blobContainer  .circle{width: 90px;height: 90px;}
}
/* overlay css end */

/* Lead Form Modal Styles */
.leadFormModalOverlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.8);
  backdrop-filter: blur(4px);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  visibility: hidden;
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  z-index: 1000;
}

.leadFormModalOverlay.active {
  opacity: 1;
  visibility: visible;
}

.leadFormModal {
  width: 90%;
  max-width: 600px;
  max-height: 90vh;
  background: #1E1E26;
  border-radius: 16px;
  border: 1px solid #FFDD04;
  box-shadow: 0 4px 70px 16px rgba(255, 221, 4, 0.08);
  transform: scale(0.95) translateY(20px);
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.leadFormModalOverlay.active .leadFormModal {
  transform: scale(1) translateY(0);
}

.leadFormModalHeader {
  padding: 20px 30px;
  background: #FFDD04;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid #FFDD04;
}

.leadFormModalTitle {
  color: #000;
  font-size: 18px;
  font-weight: 700;
  margin: 0;
}

.leadFormModalClose {
  background: none;
  border: none;
  color: #000;
  font-size: 28px;
  cursor: pointer;
  padding: 0;
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  transition: all 0.3s ease;
}

.leadFormModalClose:hover {
  background: rgba(0, 0, 0, 0.1);
  transform: scale(1.1);
}

.leadFormModalBody {
  padding: 0;
  overflow-y: auto;
  flex: 1;
}

.leadFormContent {
  padding: 30px;
}

.leadFormText {
  font-size: 14px;
  font-weight: 400;
  color: #fff;
  text-align: center;
  margin-bottom: 25px;
  line-height: 1.5;
}

/* Mobile Responsive for Lead Form Modal */
@media screen and (max-width: 768px) {
  .leadFormModal {
    width: 95%;
    max-height: 95vh;
    margin: 20px;
  }
  
  .leadFormModalHeader {
    padding: 15px 20px;
  }
  
  .leadFormModalTitle {
    font-size: 16px;
  }
  
  .leadFormContent {
    padding: 20px;
  }
  
  .leadFormText {
    font-size: 13px;
    margin-bottom: 20px;
  }
}

@media screen and (max-width: 480px) {
  .leadFormModal {
    width: 100%;
    height: 100%;
    max-height: 100vh;
    border-radius: 0;
    margin: 0;
  }
  
  .leadFormModalHeader {
    padding: 15px;
  }
  
  .leadFormModalTitle {
    font-size: 14px;
  }
  
  .leadFormContent {
    padding: 15px;
  }
  
  .formRow {
    grid-template-columns: 1fr;
    gap: 15px;
  }
}

/* Form Validation Styles */

/* Responsive form layout improvements - Additional spacing adjustments */
@media screen and (max-width: 1024px) {
  .leadForm {
    gap: 18px;
  }
}

@media screen and (max-width: 768px) {
  .leadForm {
    gap: 15px;
  }
}

@media screen and (max-width: 480px) {
  .leadForm {
    gap: 12px;
  }
}

.formGroup.has-error .formInput,
.formGroup.has-error .formSelect {
  border-color: #ff4444 !important;
  box-shadow: 0 0 0 2px rgba(255, 68, 68, 0.1) !important;
}

.formGroup .formInput.valid,
.formGroup .formSelect.valid {
  border-color: #00cc44 !important;
  box-shadow: 0 0 0 2px rgba(0, 204, 68, 0.1) !important;
}

.error-message {
  display: block;
  color: #ff4444;
  font-size: 12px;
  font-weight: 500;
  margin-top: 5px;
  line-height: 1.4;
  animation: fadeInError 0.3s ease-in-out;
}

@keyframes fadeInError {
  from {
    opacity: 0;
    transform: translateY(-5px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.form-error {
  color: #ff4444;
  font-size: 12px;
  font-weight: 500;
}

/* Notification Styles */
.notification {
  position: fixed;
  top: 20px;
  right: 20px;
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
  padding: 15px 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
  min-width: 300px;
  max-width: 400px;
  z-index: 1000;
  animation: slideInNotification 0.3s ease-out;
}

.notification-success {
  border-left: 4px solid #00cc44;
  background: #f0fff4;
}

.notification-error {
  border-left: 4px solid #ff4444;
  background: #fff5f5;
}

.notification-info {
  border-left: 4px solid #0066cc;
  background: #f0f8ff;
}

.notification-warning {
  border-left: 4px solid #ffaa00;
  background: #fffbf0;
}

.notification-message {
  color: #333;
  font-size: 14px;
  font-weight: 500;
  flex: 1;
}

.notification-close {
  background: none;
  border: none;
  font-size: 18px;
  color: #666;
  cursor: pointer;
  padding: 0;
  width: 20px;
  height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  transition: all 0.2s ease;
}

.notification-close:hover {
  background: #f0f0f0;
  color: #333;
}

@keyframes slideInNotification {
  from {
    opacity: 0;
    transform: translateX(100%);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

/* Mobile Responsive for Notifications */
@media screen and (max-width: 768px) {
  .notification {
    top: 10px;
    right: 10px;
    left: 10px;
    min-width: auto;
    max-width: none;
  }
}

/* Form Loading State */
.leadFormBtn:disabled {
  opacity: 0.7;
  cursor: not-allowed;
  background: #ccc !important;
  color: #666 !important;
  border-color: #ccc !important;
}

/* Enhanced Form Input Focus States */
.formInput:focus,
.formSelect:focus {
  outline: none;
  border-color: #FFDD04 !important;
  box-shadow: 0 0 0 2px rgba(255, 221, 4, 0.2) !important;
  transform: translateY(-1px);
  transition: all 0.3s ease;
}

/* Form Group Error Animation */
.formGroup.has-error {
  animation: shakeError 0.5s ease-in-out;
}

@keyframes shakeError {
  0%, 100% { transform: translateX(0); }
  25% { transform: translateX(-5px); }
  75% { transform: translateX(5px); }
}

/* Success Checkmark for Valid Fields */
.formGroup .formInput.valid::after,
.formGroup .formSelect.valid::after {
  content: "✓";
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  color: #00cc44;
  font-weight: bold;
  font-size: 16px;
  z-index: 1;
}

/* Responsive checkmark positioning */
@media screen and (max-width: 768px) {
  .formGroup .formInput.valid::after,
  .formGroup .formSelect.valid::after {
    right: 10px;
    font-size: 14px;
  }
}

/* Error message styles */
.demoModal .demoModalError {
  color: #ff4444;
  font-size: 12px;
  margin-top: 8px;
  margin-bottom: 0;
  line-height: 1.4;
  display: none;
}

.demoModal .demoModalError.show {
  display: block;
}

/* Industry selection styles */
.demoModal .demoModalIndustrySelection {
  margin: 20px 0;
}

.demoModal .demoModalIndustryOptions {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: 12px;
}

.demoModal .demoModalIndustryOption {
  display: flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  padding: 8px 12px;
  border-radius: 6px;
  transition: background-color 0.2s;
}

.demoModal .demoModalIndustryOption:hover {
  background-color: #3a3a3a;
}

.demoModal .demoModalIndustryOption input[type="radio"] {
  margin: 0;
  accent-color: #FFDD04;
}

.demoModal .demoModalIndustryText {
  color: #fff;
  font-size: 14px;
  font-weight: 500;
}

@media screen and (max-width: 480px) {
  .formGroup .formInput.valid::after,
  .formGroup .formSelect.valid::after {
    right: 8px;
    font-size: 12px;
  }
}

/* Mobile Form Enhancements - Additional styles for smaller screens */

/* Extra small devices */
@media screen and (max-width: 480px) {
  .leadFormContent {
    padding: 15px;
  }
  
  .formRow {
    gap: 12px;
  }
  
  .formGroup {
    margin-bottom: 12px;
  }
  
  .formLabel {
    font-size: 10px;
    margin-bottom: 4px;
  }
  
  .formInput, .formSelect {
    padding: 10px 8px;
    font-size: 13px;
  }
  
  .formInput::placeholder {
    font-size: 13px;
  }
  
  .leadFormBtn {
    padding: 12px 15px;
    font-size: 13px;
  }
  
  .error-message {
    font-size: 10px;
    margin-top: 2px;
  }
  
  .notification {
    padding: 10px 12px;
    top: 10px;
    right: 10px;
    left: 10px;
  }
  
  .notification-message {
    font-size: 12px;
  }
  
  .notification-close {
    font-size: 16px;
    width: 18px;
    height: 18px;
  }
}

/* Very small devices */
@media screen and (max-width: 360px) {
  .leadFormContent {
    padding: 12px;
  }
  
  .formInput, .formSelect {
    padding: 8px 6px;
    font-size: 12px;
  }
  
  .formInput::placeholder {
    font-size: 12px;
  }
  
  .leadFormBtn {
    padding: 10px 12px;
    font-size: 12px;
  }
  
  .error-message {
    font-size: 9px;
  }
  
  .formLabel {
    font-size: 9px;
  }
}

/* Tablet landscape */
@media screen and (min-width: 769px) and (max-width: 1024px) {
  .leadFormContent {
    padding: 25px;
  }
  
  .formRow {
    gap: 18px;
  }
  
  .formInput, .formSelect {
    padding: 13px 14px;
    font-size: 14px;
  }
  
  .leadFormBtn {
    padding: 16px 30px;
    font-size: 15px;
  }
  
  .error-message {
    font-size: 12px;
  }
}

/* Large screens */
@media screen and (min-width: 1200px) {
  .leadFormContent {
    padding: 35px;
  }
  
  .formRow {
    gap: 20px;
  }
  
  .formInput, .formSelect {
    padding: 14px 16px;
    font-size: 15px;
  }
  
  .leadFormBtn {
    padding: 18px 35px;
    font-size: 16px;
  }
  
  .error-message {
    font-size: 13px;
  }
  
  .formLabel {
    font-size: 13px;
  }
}

/* ===== COMPREHENSIVE MODAL MOBILE RESPONSIVENESS ===== */

/* Tablet and smaller screens */
@media screen and (max-width: 768px) {
  .demoModalOverlay {
    padding: 20px;
    align-items: center;
  }
  
  .demoModalOverlay .demoModal {
    width: 100%;
    max-width: 400px;
    margin: 0 auto;
  }
  
  .demoModal .demoModalHeader {
    padding: 20px 20px 15px;
  }
  
  .demoModal .demoModalHeader .heading {
    font-size: 16px;
  }
  
  .demoModal .demoModalBody {
    padding: 20px;
  }
  
  .demoModal .demoModalInputRow {
    flex-direction: row;
    gap: 0;
  }
  
  .demoModal .demoModalCountryCode {
    width: 80px;
    border-radius: 6px 0 0 6px;
    border: 1px solid #dedede;
    border-right: none;
  }
  
  .demoModal .demoModalInput {
    flex: 1;
    border-radius: 0 6px 6px 0;
    border: 1px solid #dedede;
    border-left: none;
  }
  
  .demoModal .demoModalOtpInputs {
    justify-content: space-between;
    gap: 10px;
  }
  
  .demoModal .demoModalOtpInput {
    width: 45px;
    height: 50px;
    font-size: 20px;
  }
  
  .demoModal .demoModalBtn {
    padding: 16px 20px;
    font-size: 16px;
  }
  
  .demoModal .demoModalOtpPhone {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    margin-top: 10px;
  }
  
  .demoModal .demoModalOtpPhone .phoneNumber {
    font-size: 14px;
    font-weight: 700;
    color: #fff;
  }
  
  .demoModal .demoModalOtpInputs {
    justify-content: space-between;
    gap: 10px;
  }
  
  .demoModal .demoModalOtpInput {
    width: 50px;
    height: 50px;
    font-size: 20px;
  }
  
  .demoModal .demoModalBanner {
    padding: 20px;
  }
  
  .demoModal .demoModalBannerTitle {
    font-size: 16px;
  }
  
  .demoModal .demoModalBannerSubtitle {
    font-size: 14px;
    line-height: 20px;
  }
}

/* Mobile phones */
@media screen and (max-width: 540px) {
  .demoModalOverlay {
    padding: 10px;
    align-items: flex-end;
  }
  
  .demoModalOverlay .demoModal {
    width: 100%;
    border-radius: 20px 20px 0 0;
    max-height: 90vh;
    overflow-y: auto;
  }
  
  .demoModal .demoModalHeader {
    padding: 20px 20px 10px;
  }
  
  .demoModal .demoModalBody {
    padding: 15px 20px 20px;
  }
  
  .demoModal .demoModalInputRow {
    flex-direction: row;
    gap: 0;
  }
  
  .demoModal .demoModalCountryCode {
    width: 80px;
    border-radius: 6px 0 0 6px;
    border: 1px solid #dedede;
    border-right: none;
  }
  
  .demoModal .demoModalInput {
    flex: 1;
    border-radius: 0 6px 6px 0;
    border: 1px solid #dedede;
    border-left: none;
  }
  
  .demoModal .demoModalOtpPhone {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    margin-top: 10px;
  }
  
  .demoModal .demoModalOtpPhone .phoneNumber {
    font-size: 14px;
    font-weight: 700;
    color: #fff;
  }
  
  .demoModal .demoModalOtpInputs {
    justify-content: space-evenly;
    gap: 8px;
  }
  
  .demoModal .demoModalOtpInput {
    width: 45px;
    height: 50px;
    font-size: 20px;
  }
  
  .demoModal .demoModalBtn {
    padding: 18px 20px;
    font-size: 16px;
    margin-top: 25px;
  }
  
  .demoModal .demoModalBanner {
    padding: 15px;
    margin-top: 15px;
  }
  
  .demoModal .demoModalBannerTitle {
    font-size: 14px;
  }
  
  .demoModal .demoModalBannerSubtitle {
    font-size: 12px;
    line-height: 18px;
  }
}

/* Small mobile phones */
@media screen and (max-width: 480px) {
  .demoModalOverlay {
    padding: 5px;
  }
  
  .demoModal .demoModalHeader {
    padding: 15px 15px 10px;
  }
  
  .demoModal .demoModalBody {
    padding: 10px 15px 15px;
  }
  
  .demoModal .demoModalInputRow {
    flex-direction: row;
    gap: 0;
  }
  
  .demoModal .demoModalCountryCode {
    width: 80px;
    border-radius: 6px 0 0 6px;
    border: 1px solid #dedede;
    border-right: none;
  }
  
  .demoModal .demoModalInput {
    flex: 1;
    border-radius: 0 6px 6px 0;
    border: 1px solid #dedede;
    border-left: none;
  }
  
  .demoModal .demoModalOtpPhone {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: 8px;
  }
  
  .demoModal .demoModalOtpPhone .phoneNumber {
    font-size: 13px;
    font-weight: 700;
    color: #fff;
  }
  
  .demoModal .demoModalOtpInputs {
    gap: 6px;
  }
  
  .demoModal .demoModalOtpInput {
    width: 40px;
    height: 45px;
    font-size: 18px;
  }
  
  .demoModal .demoModalBtn {
    padding: 16px 15px;
    font-size: 15px;
  }
  
  .demoModal .demoModalBanner {
    padding: 12px;
  }
  
  .demoModal .demoModalBannerTitle {
    font-size: 13px;
  }
  
  .demoModal .demoModalBannerSubtitle {
    font-size: 11px;
    line-height: 16px;
  }
}

/* Extra small screens */
@media screen and (max-width: 360px) {
  .demoModal .demoModalOtpInputs {
    gap: 4px;
  }
  
  .demoModal .demoModalOtpInput {
    width: 32px;
    height: 38px;
    font-size: 14px;
  }
  
  .demoModal .demoModalBtn {
    padding: 14px 12px;
    font-size: 14px;
  }
}