body {
   margin: 0;
   font-family: 'Gilroy-Regular', sans-serif;
 }

 @font-face {
   font-family: 'Gilroy-Regular';
   src: url('../fonts/Gilroy-Regular.woff2') format('woff2'),
     url('../fonts/Gilroy-Regular.woff') format('woff');
   font-weight: 400;
   font-style: normal;
 }

 h2 {
   font-size: 36px !important;
 }


 /* moving circle style start */
 .cursor-circle {
   position: fixed;
   top: 0;
   left: 0;
   width: 20px;
   height: 20px;
   background: radial-gradient(circle, rgba(0, 183, 255, 0.7), rgba(0, 110, 255, 0.4));
   border-radius: 50%;
   pointer-events: none;
   transform: translate(-50%, -50%) scale(1);
   z-index: 9999;
   transition: transform 0.2s ease-out, background 0.3s;
   box-shadow: 0 0 10px rgba(0, 183, 255, 0.6), 0 0 20px rgba(0, 183, 255, 0.4);
 }

 /* moving circle style end */

 /* Header */
 header {
   background-color: white;
   border-bottom: 1px solid #eaeaea;
   position: sticky;
   top: 0;
   z-index: 1000;
 }

 .logo {
   height: 60px;
   width: 60px;
 }

 /* Navigation links */
 .nav-link {
   margin-right: 20px;
   color: #999999;
   text-decoration: none;
   font-weight: 500;
   font-size: 14px;
 }

 .nav-link:hover {
   color: #2f80ed;
 }

 .active-link {
   color: #2f80ed;
 }

 /* Buttons */
 .btn-outline-login {
   border: 1px solid #c4e1a1;
   color: #7ab839;
   font-weight: 500;
   background-color: transparent;
   padding: 5px 15px;
   border-radius: 5px;
   font-size: 14px;
 }

 .btn-outline-login:hover {
   background-color: #eaf7d5;
   color: #5c9f28;
 }

 .btn-signup {
   background-color: #a0cc45;
   color: white;
   font-weight: 500;
   padding: 6px 18px;
   border-radius: 5px;
   font-size: 14px;
   border: none;
 }

 .btn-signup:hover {
   background-color: #8bbc34;
 }

 /* Dropdown opens on hover */
 .hover-dropdown:hover .dropdown-menu {
   display: block;
   margin-top: 0;
   /* optional: remove dropdown gap */
 }

 /* Optional: smooth appearance */
 .dropdown-menu {
   transition: all 0.2s ease;
 }


 /* hero section start */
 .hero-section {
   background: radial-gradient(96.67% 157.02% at 96.67% 105.65%, #8EAF39 5.53%, #3CA5DF 54.02%, #357FB7 88.68%);
   color: white;
   padding-top: 30px;
   padding-bottom: 0;
   overflow: hidden;
   min-height: 100vh;
   display: flex;
   align-items: center;
 }

 .hero-content {
   text-align: left;
 }

 .hero-content h1 {
   font-size: clamp(36px, 5vw, 80px);
   font-weight: 700;
   margin-bottom: 20px;
   line-height: 1.2;
 }

 .hero-content p {
   font-size: clamp(16px, 2.5vw, 30px);
   color: #d2e5ff;
   line-height: 1.5;
 }

 .store-buttons img {
   height: clamp(40px, 4vw, 65px);
   margin-right: 10px;
 }

 .hero-img-wrapper {
   display: flex;
   justify-content: center;
   align-items: flex-start;
   overflow: hidden;
   position: relative;
   max-height: 600px;
   height: auto;
 }

 .hero-phone {
   width: 100%;
   max-width: clamp(300px, 45vw, 580px);
   transform: translateY(0);
 }

 .book-demo {
   background-color: #a0cc45;
   color: white;
   font-weight: 500;
   padding: 6px 18px;
   border-radius: 5px;
   font-size: 14px;
   border: none;
 }

 .book-demo:hover {
   background-color: #a0cc45;
   color: white;
 }

 .contact-us {
   border: 1px solid #7ab839;
   color: #fff;
   font-weight: 500;
   background-color: transparent;
   padding: 5px 15px;
   border-radius: 5px;
   font-size: 14px;
 }

 .contact-us:hover {
   border: 1px solid #fff;
   color: #fff;
 }

 .submit-btn-box button {
   background-color: #7ab839;
   color: #fff;
 }

 .submit-btn-box button:hover {
   background-color: #7ab839;
   color: #fff;
 }

 @media(max-width:768px) {
   .store-buttons {
     display: flex;
     justify-content: center !important;
   }

   .contact-us {
     border: 1px solid #fff;
     color: #fff;
   }
 }

 /* ✅ For laptop-size screens: reduce font + image size */
 @media (min-width: 1024px) and (max-width: 1399.98px) {
   .hero-content h1 {
     font-size: 52px;
   }

   .hero-content p {
     font-size: 18px;
   }

   .store-buttons img {
     height: 45px;
   }

   .hero-phone {
     max-width: 510px;
   }
 }

 /* ✅ For extra large screens: everything larger */
 @media (min-width: 1400px) {
   .container {
     max-width: 1320px;
     padding-top: 40px;
   }

   .hero-content {
     max-width: 650px;
   }

   .hero-img-wrapper {
     justify-content: flex-end;
     height: 520px;
     /* ✅ Fixed height to allow bottom cropping */
     align-items: flex-start;
     /* ✅ Align image to top */
     overflow: hidden;
     /* ✅ Crop overflow from bottom */
   }

   .hero-phone {
     max-height: none;
     transform: translateY(40px);
     /* ✅ Push image down slightly for bottom crop */
   }
 }

 /* ✅ Optional: Apply same style even on very large screens (1600px, 1800px, etc.) */
 @media (min-width: 1600px) {
   .hero-img-wrapper {
     height: 540px;
   }

   .hero-phone {
     transform: translateY(50px);
     /* Slightly more push on ultra-wide screens */
   }
 }

 @media (min-width: 1920px) {
   .hero-img-wrapper {
     height: 580px;
   }

   .hero-phone {
     transform: translateY(60px);
     /* Adjusted for larger screens */
   }
 }





 /* ✅ Medium and small screens */
 @media (max-width: 991.98px) {
   .hero-section {
     text-align: center;
     padding: 60px 20px;
     flex-direction: column;
   }

   .hero-content {
     text-align: center;
   }

   .hero-img-wrapper {
     margin-top: 30px;
     justify-content: center;
     max-height: none;
   }

   .hero-phone {
     transform: none;
   }

 }


 /* Hero section end */

 /* About Section Styles start*/
 .about-section {
   background-color: #F7F7FC;
   padding-bottom: 100px;
   padding-top: 100px;

 }

 .stats-box {
   position: absolute;
 }

 .about-img {
   max-width: 90%;
   border-radius: 10px;
   box-shadow: 0px 8px 20px rgba(0, 0, 0, 0.05);
 }

 .horizental-line {
   position: relative;
   display: inline-block;
   font-weight: 600;
   font-size: 14px;
   letter-spacing: 1px;
   color: #F58634;
   /* orange color */
   padding-left: 30px;
   /* space for left line */
   padding-right: 30px;
   /* space for right line */
 }

 .horizental-line::before,
 .horizental-line::after {
   content: '';
   position: absolute;
   top: 50%;
   width: 20px;
   /* length of the line */
   height: 2px;
   /* thickness of the line */
   background-color: #F58634;
   /* same orange */
   transform: translateY(-50%);
 }

 .horizental-line::before {
   left: 0;
 }

 .horizental-line::after {
   right: 0;
 }


 .about-title {
   font-size: 36px;
   font-weight: 700;
   color: #222D39 !important;
 }

 .about-text {
   font-size: 15px;
   color: #4e5d78;
   line-height: 1.6;
 }

 .know-more-btn {
   background-color: #a0cc45;
   color: white;
   border: none;
   padding: 8px 20px;
   font-weight: 500;
   font-size: 14px;
   border-radius: 5px;
   transition: background-color 0.3s ease;
 }

 .know-more-btn:hover {
   background-color: #8bbc34;
 }

 /* About section end */

 /* stats section  */

 .stats-section {
   background-color: #f5f7fb;
 }

 .stats-box {
   position: absolute;
   top: -50%;
   left: 50%;
   transform: translateX(-50%);
   width: 750px;
   height: 130px;
 }

 .stat-number {
   color: #1d8ed8;
   font-size: 2rem;
   font-weight: 700;
   margin-bottom: 0.3rem;
 }

 .stat-label {
   font-size: 14px;
   color: #6c757d;
   margin-bottom: 0;
 }

 @media (max-width: 991.98px) {
   .stats-box {
     width: 100%;
     height: auto;
     position: relative;
     top: 0;
     left: 0;
     transform: none;
     padding: 20px;
   }

   .stat-number {
     font-size: 1.6rem;
   }

   .stat-label {
     font-size: 13px;
   }
 }

 @media (max-width: 767.98px) {

   .border-md-start,
   .border-md-end {
     border: none !important;
   }
 }

 /* stats section end */

 /* booking section start */
 .booking-section {
   padding: 100px 15px;
 }

 .subtitle {
   font-size: 13px;
   color: #f28c38;
   font-weight: 600;
   text-transform: uppercase;
   margin-bottom: 10px;
 }

 .feature-title {
   font-size: 36px;
   font-weight: 600;
   margin-bottom: 30px;
 }

 .feature-list {
   list-style: none;
   padding-left: 0;
   position: relative;
 }

 .feature-list::before {
   content: "";
   position: absolute;
   left: 16px;
   top: 35px;
   bottom: 20px;
   width: 2px;
   background-color: #3ac17b;
   z-index: 0;
 }

 .feature-list li {
   position: relative;
   padding-left: 50px;
   margin-bottom: 40px;
 }

 .feature-number {
   position: absolute;
   left: 0;
   top: 0;
   width: 32px;
   height: 32px;
   background-color: #057de0;
   color: white;
   border-radius: 50%;
   text-align: center;
   line-height: 32px;
   font-weight: bold;
   z-index: 1;
 }

 .feature-heading {
   font-weight: 600;
   margin-bottom: 5px;
 }

 .feature-desc {
   font-size: 14px;
   color: #6c757d;
 }

 .laptop-img {
   max-width: 100%;
   height: auto;
 }

 /* booking section end */


 /* App-feature-section */
 .feature-section {
   padding: 60px 20px;
   text-align: center;
   background: linear-gradient(286.58deg, #8EAF39 2.51%, #3CA5DF 52.55%, #357FB7 88.31%);
 }

 .feature-section h5 {
   font-weight: 600;
   font-size: 14px;
   letter-spacing: 1px;
   /* color: #d2ecff; */
 }

 .feature-section h2 {
   font-weight: bold;
   color: white;
   font-size: 28px;
   margin-bottom: 40px;
 }

 /* Row Flex Layout */
 .app-features-row {
   display: flex;
   flex-wrap: wrap;
   justify-content: center;
   align-items: center;
   gap: 30px;
 }

 /* Equal Flex Columns */
 .feature-col {
   flex: 1 1 300px;
   max-width: 350px;
 }

 /* Feature Boxes */
 .feature-box {
   background-color: white;
   border-radius: 12px;
   padding: 25px 20px;
   margin: 15px 0;
   text-align: left;
   box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
 }

 .feature-box h6 {
   font-weight: 600;
   font-size: 16px;
   margin-bottom: 5px;
 }

 .feature-box p {
   margin: 0;
   font-size: 14px;
   color: #5f5f5f;
 }

 /* Phone Image */
 .phone-img {
   max-width: 220px;
   width: 100%;
   height: auto;
   display: block;
   margin: 0 auto;
 }


 /* App-feature-section */

 /* all benifits-section start */
 .benefits-section {
   padding: 100px 20px;
   background-color: #fff;
 }

 .benefits-title {
   text-align: center;
   margin-bottom: 40px;
 }

 .benefits-title h6 {
   color: #ff7a00;
   font-weight: 600;
   text-transform: uppercase;
   letter-spacing: 1px;
 }

 .benefits-title h2 {
   font-weight: 600;
 }

 .benefit-row {
   display: flex;
   gap: 20px;
   margin-bottom: 40px;
   align-items: stretch;
 }

 .img-container {
   flex: 1;
 }

 .img-container img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   border-radius: 5px;
 }

 .benefit-box {
   flex: 1;
   padding: 20px;
   background-color: #fff;
 }

 .benefit-box h5 {
   font-size: 1rem;
   font-weight: 600;
 }

 .benefit-box p {
   font-size: 0.95rem;
   color: #555;
 }

 .number {
   font-size: 1.4rem;
   font-weight: 700;
   color: #007bff;
 }

 /* ✅ Mobile View: Stack vertically (image top, text bottom) */
 @media (max-width: 767.98px) {
   .benefit-row {
     flex-direction: column;
   }

   .img-container img {
     height: auto;
   }
 }

 /* all benifits-section end */

 /* video-section start */
 .video-section {
   background: linear-gradient(286.58deg, #8EAF39 2.51%, #3CA5DF 52.55%, #357FB7 88.31%);
   padding: 60px 20px;
   text-align: center;
 }

 .video-wrapper {
   position: relative;
   max-width: 700px;
   margin: 0 auto;
   border-radius: 10px;
   overflow: hidden;
   /* box-shadow: 0 0 15px rgba(0, 0, 0, 0.2); */
 }

 .video-wrapper img.thumbnail {
   width: 100%;
   display: block;
 }

 .video-wrapper .play-button {
   position: absolute;
   top: 50%;
   left: 50%;
   width: 64px;
   height: 64px;
   background: rgba(255, 255, 255, 0.8);
   border-radius: 50%;
   transform: translate(-50%, -50%);
   display: flex;
   align-items: center;
   justify-content: center;
   cursor: pointer;
   transition: all 0.3s ease;
 }

 .video-wrapper .play-button:hover {
   background: #ffffff;
   transform: translate(-50%, -50%) scale(1.1);
 }

 .play-button::before {
   content: "";
   display: block;
   width: 0;
   height: 0;
   border-left: 18px solid #1c90d6;
   border-top: 10px solid transparent;
   border-bottom: 10px solid transparent;
 }

 .store-buttons {
   margin-top: 20px;
   display: flex;
   justify-content: start;
   gap: 15px;
   flex-wrap: wrap;
 }

 .store-buttons img {
   height: 50px;
   transition: transform 0.2s ease;
 }

 .store-buttons img:hover {
   transform: scale(1.05);
 }

 /* video-section end */

 /* about-testpan-section start*/
 .about-testpan-section {
   padding: 100px 0px;
 }

 .testpan-heading {
   margin-bottom: 40px;
   text-align: center;
 }

 .testpan-heading h6 {
   color: #ff7a00;
 }

 .testpan-heading h2 {
   color: #000;
 }

 .equal-box {
   background-color: #f5f8fc;
   /* padding: 30px; */
   border-radius: 16px;
   height: 100%;
   display: flex;
   align-items: center;
   justify-content: center;
 }

 .equal-box img {
   max-width: 100%;
   max-height: 100%;
   object-fit: contain;
   border-radius: 12px;
 }

 .about-text {
   margin-top: 20px;
   font-size: 15px;
   color: #333;
 }

 .certifications {
   display: flex;
   align-items: center;
   flex-wrap: wrap;
   gap: 12px;
   /* margin-top: 20px; */
 }

 .certifications img {
   max-height: 60px !important;
   max-width: 60px !important;
 }

 @media (max-width: 768px) {
   .equal-box {
     height: auto;
   }

   .certifications {
     justify-content: center;
   }
 }

 /* about-testpan-section end*/

 /* client-section start*/
 .client-section {
   background-color: #fff;
   padding: 50px 20px;
   text-align: center;
   padding-top: 100px;
 }

 .client-section h4 {
   font-weight: 500;
   margin-bottom: 40px;
   color: #212529;
 }


 .logo-carousel {
   overflow: hidden;
   position: relative;
 }

 .logo-track {
   display: flex;
   animation: scroll 10s linear infinite;
 }

 .logo-track img {
   height: 100px;
   margin: 0 40px;
   object-fit: contain;
   opacity: 0.9;
   transition: transform 0.3s;
 }

 .logo-track img:hover {
   transform: scale(1.1);
 }

 @keyframes scroll {
   0% {
     transform: translateX(0);
   }

   100% {
     transform: translateX(-50%);
   }
 }

 @media (max-width: 768px) {
   .logo-track img {
     margin: 0 20px;
   }
 }

 /* client-section-end */

 /* Count-section-start */
 .count-section {
   background: radial-gradient(98.59% 220.1% at 98.59% 100%, #8EAF39 5.53%, #357CA3 50.95%, #357FB7 88.68%)
     /* warning: gradient uses a rotation that is not supported by CSS and may not behave as expected */
   ;

   /* border-radius: 10px; */
 }

 .count-section h3 {
   font-size: 2rem;
 }

 .count-section p {
   font-size: 0.95rem;
   opacity: 0.85;
 }

 @media (max-width: 767.98px) {
   .count-section .border-end {
     border-right: none !important;
   }
 }

 /* Count-section-end */


 /* contact-us-section */
 .contact-section {
   background-color: #ffffff;
   padding: 100px 0;
 }

 .contact-heading {
   text-align: center;
   /* margin-bottom: 40px; */
 }

 .contact-heading h6 {
   color: #FF6B00;
   font-weight: 600;
   text-transform: uppercase;
   letter-spacing: 1px;
 }

 .contact-heading h2 {
   font-weight: 600;
   font-size: 32px;
   color: #222;
 }

 .form-box {
   background: #f8f9ff;
   padding: 30px;
   border-radius: 15px;
 }

 .form-control {
   border-radius: 10px;
   border: none;
   padding: 12px 16px;
   background-color: #fff;
   box-shadow: none;
 }

 .checkbox-grid {
   display: grid;
   grid-template-columns: repeat(2, 1fr);
   gap: 15px;
   margin-top: 20px;
 }

 .checkbox-option {
   background: #fff;
   border-radius: 10px;
   padding: 10px 16px;
   display: flex;
   align-items: center;
   gap: 10px;
   font-size: 15px;
   cursor: pointer;
   border: 1px solid #ddd;
   transition: all 0.2s ease;
 }

 .checkbox-option input {
   accent-color: #FF6B00;
   width: 18px;
   height: 18px;
 }

 .checkbox-option:hover {
   background-color: #eef2ff;
 }

 .contact-img {
   max-width: 100%;
   height: auto;
 }

 @media (max-width: 767.98px) {
   .checkbox-grid {
     grid-template-columns: 1fr;
   }

   .contact-img {
     margin-top: 30px;
   }
 }

 /* contact-us-section */

 /* FAQ section start */


 .faq-section {
   padding: 100px 15px;
 }

 .faq-left h6 {
   color: #ff8400;
   font-weight: bold;
   margin-bottom: 5px;
 }

 .faq-left h2 {
   font-weight: 600;
   font-size: 28px;
   margin-bottom: 20px;
 }

 .faq-left p {
   color: #6c757d;
   font-size: 15px;
 }

 .faq-left .btn-success {
   background-color: #6dc24b;
   border: none;
   margin-top: 20px;
 }

 .accordion-button {
   background-color: #ffffff;
   border-radius: 8px;
   font-weight: 500;
   padding-right: 3rem;
   position: relative;
 }

 .accordion-button::after {
   content: '+';
   position: absolute;
   right: 1.5rem;
   font-size: 20px;
   font-weight: bold;
   color: #000;
   background-image: none !important;
   transform: none !important;
 }

 .accordion-button:not(.collapsed)::after {
   content: '–';
 }

 .accordion-button:not(.collapsed) {
   background-color: #ffffff;
   color: #000;
   box-shadow: none;
 }

 .accordion-body {
   color: #6c757d;
   font-size: 14px;
 }

 .accordion-item {
   background-color: #ffffff;
   border: none;
   border-radius: 8px;
   margin-bottom: 10px;
   box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
 }

 @media (max-width: 767px) {
   .faq-left {
     text-align: center;
     margin-bottom: 30px;
   }
 }

 /* FAQ section end */

 /* footer section start */
 .footer {
   background-color: #1e2a35;
   color: #dcdcdc;
   padding: 40px 20px 20px;
   font-size: 14px;
 }

 .footer a {
   color: #dcdcdc;
   text-decoration: none;
   margin: 10px 0px;
   display: block;
 }

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

 .footer .logo-footer img {
   width: 60px;
   margin-bottom: 20px;
 }

 .footer .logo-text {
   font-size: 14px;
   max-width: 200px;
 }

 .footer h6 {
   color: #ffffff;
   font-weight: 600;
   margin-bottom: 15px;
 }

 .footer i {
   margin-right: 8px;
   color: #dcdcdc;
 }

 .footer .social-icons i {
   font-size: 16px;
   margin-right: 15px;
   color: #dcdcdc;
   transition: 0.3s ease;
 }

 .footer .social-icons i:hover {
   color: #ffffff;
 }

 .footer-bottom {
   border-top: 1px solid rgba(255, 255, 255, 0.1);
   margin-top: 30px;
   padding-top: 15px;
   font-size: 13px;
   text-align: center;
   color: #cccccc;
 }

 .list-unstyled li {
   margin: 10px 0px;
 }

 /* footer section end */