/* @import url('https://fonts.googleapis.com/css2?family=Saira+Stencil+One&display=swap'); */

 /* ================== Animation ============================ */
 /* Default cursor hide */
 /* Default cursor ON rehne dein */
 * {
     text-decoration: none !important;

 }

 @media (max-width: 767px) {

     .product-section,
     .product-section * {
         /* position: static !important; */
     }
 }

 /* SERVICE BUTTON */
 .services-wrapper {
     position: fixed;
     top: 340px;
     right: 0;
     z-index: 9999;
     display: flex;
     align-items: center;
 }

 /* TOGGLE GROUP */
 .services-toggle {
     position: relative;
     width: 48px;
     height: 180px;
 }

 /* SERVICES BUTTON */
 .services-btn {
     width: 48px;
     height: 120px;
     background: #FFFFFF;
     border: 1px solid #FE0000;
     border-top-right-radius: 10px;
     border-bottom-right-radius: 10px;
     cursor: pointer;

     /* 🔥 ROTATE */
     transform: rotate(180deg);
     writing-mode: vertical-rl;
     text-align: center;
     font-weight: 600;
     font-family: Inter;
     font-size: 20px;
     line-height: 100%;
     color: #0071A8;

 }

 /* ARROW ICON (BOTTOM RIGHT) */
 .arrow-icon {
     position: absolute;
     bottom: 0;
     right: 0;
     width: 48px;
     height: 48px;
     background: #FFFFFF;
     display: flex;
     align-items: center;
     justify-content: center;
     border-bottom-right-radius: 10px;
     border-bottom-left-radius: 10px;
     font-size: 18px;
     cursor: pointer;
     transform: rotate(89deg);
     border: 1px solid #FE0000;
 }

 .arrow-icon img {
     width: 35px;
     height: 37px;
     transform: rotate(271deg);
     display: flex;
     align-items: center;
     justify-content: center;

 }

 .services-panel {
     position: absolute;
     right: 48px;
     width: 191px;
     /* height: 207px; */
     background: #fff;
     border-top-left-radius: 10px;
     border-bottom-left-radius: 10px;
     padding: 15px;
     box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
     display: none;
     top: 3px;
 }

 .services-panel h4 {
     font-size: 12px;
     font-weight: 500;
     font-family: Inter;
     line-height: 100%;
     color: #000000;
     margin-bottom: 10px;
 }


 .services-panel p {
     margin-bottom: 10px;
     font-size: 11px;
     font-weight: 400;
     font-family: Inter;
     line-height: 100%;
     color: #000000;
 }

 .services-panel p a {
     color: #000000 !important;

 }

 .explore-btn {
     margin-top: 10px;
     width: 109px;
     height: 24px;
     /* padding: 8px; */
     background: #FFFFFF;
     border-radius: 10px;
     border: 2px solid #0071A8;
     cursor: pointer;
     font-size: 12px;
     font-weight: 400;
     font-family: Inter;
     line-height: 100%;
     color: #000000;
     transition: all 0.4s ease-in-out;
     clip-path: polygon(0% 0%,
             100% 0%,
             100% 100%,
             0% 100%);
 }

 .explore-btn:hover {
     background: #0071A8;
     border: none;
     color: #FFFFFF;
     /* transform: scale(1.05) */
     clip-path: polygon(12% 0%,
             100% 0%,
             88% 100%,
             0% 100%);
     border-radius: 0px;

 }

 .services-panel {
     display: none;
 }

 .services-panel.active {
     display: block;
 }

 /* Custom ball cursor */
 .custom-cursor {
     width: 12px;
     height: 12px;
     border-radius: 50%;
     background: #004364;
     position: fixed;
     pointer-events: none;

     /* thora neeche dikhane ke liye */
     transform: translate(-50%, -50%);

     transition:
         background-color 0.2s ease,
         transform 0.1s ease;

     z-index: 9999;
 }

 /* Hover state */
 .custom-cursor.hover {
     background: #e80303;
     transform: translate(-50%, -50%) scale(1.5);
 }






 .fade-left,
 .fade-right {
     opacity: 0;
     will-change: transform, opacity;
 }

 .fade-left.animate {
     animation: fadeInFromLeft 2s ease-out forwards;
 }

 .fade-right.animate {
     animation: fadeInFromRight 2s ease-out forwards;
 }

 @keyframes fadeInFromLeft {
     from {
         opacity: 0;
         transform: translateX(-200px);
     }

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

 @keyframes fadeInFromRight {
     from {
         opacity: 0;
         transform: translateX(200px);
     }

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


 /* Base class for all animated cards */
 /* .animate-card {
     opacity: 0;
     transform: translateY(100px);
     transition: all 1.2s ease-out;
 }

 .animate-card.show {
     opacity: 1;
     transform: translateY(0);
 }

 .animate-card[data-delay] {
     transition-delay: var(--delay);
 } */

 /* Base state (hidden & zoomed-in) */
 .animate-card {
     opacity: 0;
     transform: scale(0.2) translateY(60px);
     transition:
         opacity 0.9s ease,
         transform 0.9s ease;
 }

 .animate-card.show {
     opacity: 1;
     transform: scale(1) translateY(0);
 }

 .animate-card {
     transition-delay: var(--delay, 0ms);
 }




 /* Baaqi CSS yahan se shuru karein */


 /*============= Navbar css============== */
 /* .navbar {
     height: 180px;
     position: relative;
     padding: 0;
 } */

 .nav-logo {
     width: 200px;
     height: 180px;
     object-fit: contain;
     margin-top: -22px;
 }

 /* .nav-logo {
     height: 100%;
     width: 200px;
     max-height: 137px;
     object-fit: contain;
 } */

 .blue-block {
     position: absolute;
     top: 0;
     right: 0;
     background: #0071A8;
     height: 127px;
     display: flex;
     align-items: center;
     padding-right: 20px;
     width: 85%;
     border-bottom-left-radius: 37px;
     z-index: 3 !important;
 }

 .blue-block li {
     margin-left: 17px;
     gap: 15px;
 }



 .nav-link {
     font-weight: 600;
     color: white !important;
     font-size: 20px;
     display: flex;
     align-items: center;
     gap: 5px;
 }

 .icon-style {
     font-size: 28px;
     color: white;
 }

 .contact-btn {
     background-color: #D43838;
     color: white;
     font-weight: 600;
     border-radius: 10px;
     font-size: 20px;
     height: 41px;
     box-shadow: 0px 4px 5px #00000040;

     width: 130px;
     font-family: Inter, sans-serif;
     clip-path: polygon(0% 0%,
             100% 0%,
             100% 100%,
             0% 100%);
     transition: all 0.4s ease-in-out;
 }

 .contact-btn:hover {
     background-color: #c33333;
     color: white;
     clip-path: polygon(12% 0%,
             100% 0%,
             88% 100%,
             0% 100%);

 }

 .navbar-toggler-icon {
     background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath stroke='rgba%280,0,0,0.7%29' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
 }


 .mega-menu {
     position: fixed;
     top: 119px;
     left: 50.5%;
     transform: translateX(-50%);
     width: 85vw;
     background: linear-gradient(90deg, #006A9E, #658392);
     color: white;
     padding: 30px;
     border-radius: 15px;
     z-index: 9999;

     display: none;
     /* 👈 no animation */
 }


 /* SHOW STATE */
 .has-mega.show .mega-menu {
     display: block;
     /* 👈 instant show */
 }

 .mega-force-hide .mega-menu {
     display: none !important;
 }

 /* icon rotate */
 .dropdown-icon {
     transition: transform 0.3s ease;
 }

 .has-mega.show .dropdown-icon {
     transform: rotate(180deg);
 }




 .has-mega {
     position: static;
 }

 @media (min-width: 992px) {
     .has-mega:hover>.mega-menu {
         display: block;
     }

     .has-mega:hover .dropdown-icon {
         transform: rotate(180deg);
     }
 }

 .nav-repair-title {
     display: inline-flex;
     align-items: center;
     gap: 10px;
     font-family: Saira;
     font-weight: 700;
     font-size: 20px;
     cursor: pointer;
     line-height: 137%;
     color: #000000;
     position: relative;

 }

 .city-repair-title {
     display: inline-flex;
     align-items: center;
     gap: 10px;
     font-family: Saira;
     font-weight: 700;
     font-size: 20px;
     cursor: pointer;
     line-height: 137%;
     color: #000000;
     position: relative;
 }

 .city-repair-title a {
     font-size: 20px !important;
     color: #000000 !important;

 }

 .city-repair-title::after {
     content: "";
     position: absolute;
     left: 50%;
     bottom: -4px;

     width: 0;
     height: 2px;
     background-color: #E9A426;

     transform: translateX(-50%);
     transition: width 0.35s eas
 }

 .city-repair-title::after {
     width: calc(100% - 0px);
 }

 .nav-repair-title::after {
     content: "";
     position: absolute;
     left: 50%;
     bottom: -4px;
     width: 0;
     height: 2px;
     background-color: #E9A426;
     transform: translateX(-50%);
     transition: width 0.35s ease;
 }

 .nav-repair-title:hover::after {
     width: 100%;
 }

 .nav-repair-title i {
     /* opacity: 0; */
     transform: translateX(-5px);
     transition: all 0.3s ease;
     font-size: 18px;
     color: #000000;

     display: flex;
     align-items: center;
     justify-content: center;
     margin-top: 3px;
 }


 .nav-title {
     font-family: Saira;
     font-weight: 700;
     font-size: 14px;
     line-height: 137%;
     color: #FFFFFF;
     margin-top: 10px;

     position: relative;
     display: inline-block;
     cursor: pointer;
     max-width: 176px;
 }

 /* underline (hidden by default) */
 .nav-title::after {
     content: "";
     position: absolute;
     left: 50%;
     bottom: -4px;

     width: 0;
     height: 2px;
     background-color: #E9A426;

     transform: translateX(-50%);
     transition: width 0.35s ease;
 }

 .nav-title::after {
     width: calc(100% - 0px);
 }

 .nav-div {


     position: relative;
     /* display: inline-block;
        cursor: pointer; */
     max-width: 176px;
 }

 /* underline (hidden by default) */
 .nav-div::after {
     content: "";
     position: absolute;
     left: 50%;
     bottom: -6px;

     width: 0;
     height: 2px;
     background-color: #E9A426;

     transform: translateX(-50%);
     transition: width 0.35s ease;
 }

 .nav-div::after {
     width: calc(100% - 0px);
 }

 .nav-div p {
     font-family: Saira;
     font-weight: 700;
     font-size: 10px;
     line-height: 137%;
     width: 100%;
     max-width: 166px;
 }

 .nav-mega-btn {
     width: 130px;
     height: 25px;
     background-color: #E9A426;
     border-radius: 10px;
     border: none;
     box-shadow: 0px 4px 4px #00000040;
     color: #FFFFFF;
     font-family: Saira;
     font-weight: 700;
     font-size: 10px;
     line-height: 137%;
     transition: all 0.5s ease-in-out;
 }

 .nav-mega-btn:hover {
     /* width: 135px; */
     transform: scale(1.04)
 }

 .mega-menu .bottomm {
     text-decoration: none;
     font-family: Saira;
     font-weight: 700;
     font-size: 10px;
     line-height: 137%;
     color: #FFFFFF;
     position: relative;

 }



 /* animated border */
 .mega-menu .bottomm::after {
     content: "";
     position: absolute;
     left: 50%;
     bottom: -4px;
     width: 0;
     height: 2px;
     background-color: #E9A426;
     transform: translateX(-50%);
     transition: width 0.8s ease;
 }

 /* hover animation */
 .mega-menu .bottomm:hover::after {
     width: 100%;
     color: #E9A426;

 }

 .mega-menu .bottomm:hover {
     color: #E9A426;
     /* border-bottom: 1px solid #E9A426; */
     transform: scale(1.3);
 }


 .dropdown-icon {
     transition: 0.3s;
     font-size: 15px;
 }

 .dropdown:hover .dropdown-icon {
     transform: rotate(180deg);
 }

 .city-grid {
     display: grid;
     grid-template-columns: repeat(5, 1fr);
     /* ⭐ 5 equal columns */
     gap: 20px;
 }

 .city-grid p {
     margin: 0;
     padding: 0;
     /* margin-top: 6px; */
 }

 .city-grid p a {
     font-family: Saira;
     font-weight: 700;
     font-size: 14px !important;
     line-height: 137%;
     color: #FFFFFF;
     text-decoration: none;
 }

 .nav-product p {
     margin: 0;
     padding: 0;
 }

 .nav-product p a {
     font-family: Saira;
     font-weight: 700;
     font-size: 14px !important;
     line-height: 137%;
     color: #FFFFFF;
     text-decoration: none;
 }

 /* Responsive */
 @media (max-width: 1200px) {
     .city-grid {
         grid-template-columns: repeat(3, 1fr);
     }
 }

 @media (max-width: 768px) {
     .city-grid {
         grid-template-columns: repeat(2, 1fr);
     }
 }

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


 .contact-icons-wrapper .icon-image {
     width: 29px;
     height: 22px;
     object-fit: contain;
     transition: transform 0.2s ease;
 }

 .contact-icons-wrapper a:hover .icon-image {
     transform: scale(1.1);
 }

 .contact-icons-wrapper .separator {
     color: #ffffff;
     font-size: 1.4rem;
     /* font-weight: 300; */
     line-height: 1;
     margin-bottom: 3px;
 }

 @media (max-width: 991px) {

     /* 1. Navbar Collapse (Default - Closed State) */
     .navbar-collapse {
         transition: max-height 0.5s ease-in-out !important;
         max-height: 0 !important;
         overflow: hidden !important;

         position: absolute;
         top: 164px;
         left: 0;
         width: 100%;
         z-index: 1040;
         background-color: #0071A8;
         border-bottom-left-radius: 37px;
     }

     .navbar-collapse.show {
         max-height: 100vh !important;
         overflow-y: auto !important;
     }

     /* 3. Collapsing State (Animation ke dauran) - Yehi asal fix hai */
     .collapsing {
         transition: max-height 0.5s ease-in-out !important;

         height: auto !important;

         max-height: 100vh !important;
         overflow: hidden !important;
     }


     /* Baki existing mobile styles */
     /* .blue-block {
         position: static;
         width: 100% !important;
         height: 763px !important;
         padding: 10px 0;

         z-index: 10000 !important;
     } */
     .blue-block {
         position: static;
         width: 100%;
         height: auto;
         /* 🔥 FIX */
         min-height: 100vh;
         /* full screen menu */
         padding: 20px 15px;
         margin-top: 0;
         z-index: 10000;
         border-radius: 0;
     }

     .mega-menu {
         display: none;
         /* hidden by default */
         position: static;
         width: 100%;
         padding: 10px;
         /* transform: none !important; */
         margin-left: -25px;
     }

     .has-mega.show .mega-menu {
         display: block;
         /* JS toggle se visible */
     }

     .navbar-nav .nav-item {
         margin-left: 0 !important;
         padding: 10px 15px;
     }
 }

 @media (max-width: 1024px) {
     .nav-logo {
         width: 120px;
         height: 145px;
     }

     .blue-block {
         height: 127px;

         padding-right: 20px;
         width: 86%;
         box-sizing: border-box !important;

     }

     .container,
     .container-fluid {
         padding-right: 40px !important;
     }

     body {
         overflow-x: hidden !important;
     }

     .nav-link {

         font-size: 13px;

         gap: 10px;
     }

     .contact-icons-wrapper .icon-image {
         width: 22px;
         height: 20px;

     }

     .blue-block ul {
         padding-left: 10px !important;
         gap: 8px !important;
     }

     .contact-btn {

         font-size: 15px;
         width: 7rem;
     }

     .xray-card {

         width: auto !important;

     }

     .xray-title {
         font-size: 14px !important;

     }

     .xray-desc {
         font-size: 11px !important;

     }

     .xray-btn {

         padding: 5px 10px !important;

     }

     .oem-img-box {

         width: 259px !important;
     }

     .choose-card {
         width: auto !important;
     }

     .news-card .news-title {

         font-size: 16px !important;

     }


 }

 /*============== HERO SECTION css ===============================css */
 .hero-section {
     background: #0071A8;
     margin-top: 180px;
 }

 /* HEADING */
 .hero-heading {
     font-size: 50px;
     font-family: Arial, sans-serif;
     font-weight: 700;
 }

 .hero-heading span {
     color: #1d1c1c;
 }

 /* PARAGRAPH */
 .hero-para {
     font-size: 16px;
     font-weight: 700;
 }

 /* STACKED IMAGES CONTAINER */
 .stack-images {
     width: 160px;
     height: 70px;
 }

 /* COMMON IMAGE STYLE */
 /* Hero Image Container */
 .hero-img {
     position: absolute;
     width: 60px;
     height: 60px;
     border-radius: 50%;
     overflow: hidden;
     border: 2px solid white;
     z-index: 5;
 }

 /* Overlay */
 .hero-img::after {
     content: "";
     position: absolute;
     inset: 0;
     background: rgba(17, 16, 16, 0.35);
     border-radius: 50%;
 }

 /* First 3 images par overlay visible */
 .img-1::after,
 .img-2::after,
 .img-3::after {
     display: block;
 }

 .img-4::after {
     display: none;
 }

 /* Image inside container */
 .hero-img img {
     width: 100%;
     height: 100%;
     object-fit: cover;
 }

 /* Positions */
 .img-1 {
     top: 0;
     right: -40px;
 }

 .img-2 {
     top: -1px;
     right: 12px;
 }

 .img-3 {
     top: -2px;
     right: 59px;
 }

 .img-4 {
     top: -3px;
     right: 106px;
 }


 /* CUSTOMER COUNT */
 .customer-count {
     font-size: 30px;
     font-weight: 600;
     color: #c33333;
     margin-left: 20px;
 }

 .customer-text {
     font-size: 14px;
     font-weight: 500;
     margin-left: 20px;
 }

 /* BUTTONS */
 .hero-btn {
     background-color: white;
     color: #000000;
     font-weight: 600;
     padding: 10px 25px;
     border-radius: 10px;
     border: none;
     font-size: 16px;

     background-image: linear-gradient(#c33333, #c33333);
     background-repeat: no-repeat;
     background-size: 0% 100%;
     /* Start from left 0% */
     background-position: left;
     /* Fill left → right */
     transition: background-size 0.4s ease, color 0.4s ease;
 }

 /* Hover */
 .hero-btn:hover {
     background-size: 100% 100%;
     /* ⭐ Full fill hover pe */
     color: white;
     /* White text on red */
 }


 #service-icon,
 #login-icon {
     font-size: 37px;
     /* ⭐ bada icon */
     color: white;
 }

 /* .hero-main-img {
            width: 100%;
            height: 450px;
        } */

 /* img slider */
 .slider-container {
     width: 100%;
     height: 500px;
     overflow: hidden;
     position: relative;
     border-radius: 15px;
     /* background: #ffffff; */
     /* ya koi bhi color */
 }

 .slider-track {
     display: flex;
     width: 100%;
     transition: transform 1s ease-in-out;
 }

 .slide {
     min-width: 100%;
     height: 500px;
     /* container height match */
     display: flex;
     justify-content: center;
     align-items: center;
     /* background: white; */
     /* empty space ka color */
 }

 .slider-img {
     width: 500px;
     height: 500px;
     object-fit: contain;
     /* ⭐⭐ Full image show */
 }

 /*=======================info Section Styling  =============================== */
 .info-section {
     background: #ffffff;
 }

 /* Heading */
 .info-heading {
     font-size: 32px;
     font-weight: 700;
     color: #000;
 }

 .info-heading span {
     color: #0168A4;
 }

 /* Paragraphs */
 .info-para {
     font-size: 20px;
     color: #000000;
     font-weight: 400;
     font-family: Arial;
     max-width: 641px;
     line-height: 160%;
 }

 /* Read More Button */
 .read-btn {
     background: #0168A4;
     color: #fff;
     /* padding: 10px 25px; */
     font-size: 20px;
     font-weight: 400;
     border-radius: 10px;
     border: none;
     box-shadow: 0px 4px 4px #00000040;
     transition: 0.5s;
     width: 150px;
     height: 43px;
     font-family: Inter;
     line-height: 100%;
 }

 .read-btn:hover {
     width: 170px;
     /* transform: scale(1.03); */

 }


 /* Right Image same height as left column */
 /* --- 1. Image Slider Wrapper --- */
 .image-slider-wrapper {
     overflow: hidden;


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

     width: 100%;

     margin: 0 auto;
 }

 /* --- 2. Image Styles --- */
 .info-img {
     height: 532px;
     width: 436px;
     object-fit: cover;
     border-radius: 15px;
     border: 5px solid #0071A8;

     display: block;
 }

 .image-slide-track {
     display: flex;
     width: 400%;
 }

 .image-slide-item {
     width: 25%;
     flex-shrink: 0;
     display: flex;
     justify-content: center;
     align-items: center;
 }


 /* ==================================== features-section =============================== */

 .features-section {
     background: #0071A8;
 }

 .features-section h5 {
     font-size: 24px;
     font-family: Inter, sans-serif;
     font-weight: 600;
 }

 .feature-icon {
     font-size: 40px;
     /* padding: 12px; */
     /* border-radius: 50%; */
     /* background: rgba(255, 255, 255, 0.2); */
 }

 /* input section */
 /* Section Title */
 .section-title {
     font-size: 40px;
     font-weight: 700;
     font-family: Arial, sans-serif;
     text-align: center;
 }

 .section-title span {
     color: #0071A8;
 }

 /* Search Input */
 /* Wrapper */
 .search-wrapper {
     display: flex;
     justify-content: center;
     gap: 10px;
     max-width: 500px;
     margin: 0 auto;
 }

 /* Input */
 .search-input {
     flex: 1;
     padding: 12px 20px;
     background: #DEE9FF;
     /* BG COLOR */
     border: 2px solid #DEE9FF;
     /* OUTLINE SAME COLOR */
     border-radius: 21px;
     font-size: 16px;
     color: #A2A6B0;
     outline: none;
     /* REMOVE OUTLINE */
 }

 .search-input:focus {
     border: 2px solid #0071A8;
     /* FOCUS BORDER SAME COLOR */
     outline: none;
 }


 .search-input::placeholder {
     color: #121212CF;
     font-size: 17px;
     font-weight: 400;
     font-family: Inter, sans-serif;
 }

 /* Button outside the input */
 .search-btn {
     padding: 12px 20px;
     background: #EF1616;
     color: white;
     border: none;
     border-radius: 19px;
     font-size: 18px;
     cursor: pointer;
     transition: 0.3s;
 }

 .search-btn:hover {
     background: #c70f0f;
 }


 /* Category Buttons */
 .cat-btn {
     width: 150px;
     background: #DEE9FF;
     border: none;
     color: #A2A6B0;
     /* padding: 10px 0; */
     font-size: 16px;
     border-radius: 21px;
     font-weight: 500;
     transition: all 0.4s ease-in-out;
     height: 39px;
 }

 .cat-btn:hover {
     background: #b1c1ef;
 }

 @media(max-width: 767px) {
     .cat-btn {
         width: 130px !important;
         font-size: 12px !important;
     }
 }

 /* best product section */

 .product-card {
     background: #0071A8;
     padding: 2px;
     border-radius: 12px;
     box-shadow: 0 4px 4px #00000040;
     color: white;
     border: 8px solid #0071A8;
     margin-top: 40px;
     transition: all 0.4s ease-in-out;
     height: 400px;
     /* width: 219px; */
     position: relative;
 }

 .product-card:hover {
     transform: scale(1.03) translateY(-10px);
 }

 .product-img {
     width: 100%;
     /* border-radius: 12px; */
     border-top-left-radius: 12px;
     border-top-right-radius: 12px;
     height: 196px;

 }

 .stars i {
     font-size: 20px;
     margin-right: 12px;
 }

 .gold {
     color: #E9A426;
 }

 .product-title {
     font-size: 18px;
     font-weight: 500;
     font-family: Inter, sans-serif;
     margin-top: 10px;
 }

 .product-desc {
     font-size: 12px;
     font-weight: 400;
     font-family: Inter, sans-serif;
     opacity: 0.9;
 }

 .price-box {
     /* margin-top: 15px; */
     position: absolute;
     bottom: 10px;
     /* left: 50%; */
     width: 100%;
 }

 .old-price {
     text-decoration: line-through;
     color: #d8a036;

     font-size: 20px;
     font-weight: 500;
     font-family: Inter, sans-serif;
 }

 .new-price {
     font-size: 20px;
     font-weight: 500;
     font-family: Inter, sans-serif;
 }

 .buy-btn {
     background: white;
     color: #000000;
     padding: 6px 15px;
     border-radius: 8px;
     border: none;
     font-weight: 600;
     font-size: 12px;
     transition: all 0.4s ease-in-out;
 }

 .buy-btn:hover {
     background: rgb(224, 223, 223);

 }

 @keyframes blink-zoom {
     0% {
         transform: scale(1);
         opacity: 1;
     }

     50% {
         transform: scale(1.1);
         opacity: 0.8;
     }

     100% {
         transform: scale(1);
         opacity: 1;
     }
 }

 .discount-badge {
     position: absolute;
     top: -53px;
     right: -14px;
     background: #EF1616;
     color: white;
     width: 40px;
     height: 40px;
     border-radius: 50%;
     font-size: 8px;
     font-weight: 700;
     display: flex;
     align-items: center;
     justify-content: center;
     flex-direction: row;

     animation: blink-zoom 0.8s infinite alternate;
 }


 .all-products-btn {
     background: #0168A4;
     color: white;
     padding: 10px 40px;
     font-size: 18px;
     font-weight: 600;
     border-radius: 15px;
     border: none;
     box-shadow: 0 4px 4px #00000040;
     transition: all 0.4s ease-in-out;
 }

 .all-products-btn:hover {
     transform: scale(1.02) translateY(-2px);
     background: #1f5473;

 }

 /* card slider css */

 .offer-title {
     font-size: 48px;
     font-weight: 700;
     color: #000;
 }

 .offer-desc {
     font-size: 16px;
     color: #444;
 }

 /* SLIDER MAIN */
 .offer-title {
     font-size: 48px;
     font-weight: 700;
     color: #000;
     font-family: Arial, Helvetica, sans-serif;
 }

 .offer-title span {
     color: #0168A4;
 }

 .offer-desc {
     font-size: 16px;
     color: #444;
 }

 /* SLIDER MAIN */
 .offer-slider-wrapper {
     position: relative;
     overflow: visible;

 }

 .offer-slider-container {
     overflow: hidden;
     padding: 15px 0px;
 }

 /* pagination */

 .offer-pagination {
     display: flex;
     justify-content: center;
     margin-top: 15px;
     gap: 8px;
 }

 .offer-dot {
     width: 10px;
     height: 10px;
     background: #bbb;
     border-radius: 50%;
     cursor: pointer;
     transition: 0.3s;
 }

 .offer-dot.active {
     background: #076FA1;
     transform: scale(1.3);
 }


 .offer-slider-track {
     display: flex;
     gap: 20px;
     transition: transform 1s ease-in-out;
 }

 .offer-card {
     min-width: 23.6%;
     width: 273px;
     background: #fff;
     border-radius: 30px;
     padding: 10px;
     text-align: center;
     border: 3px solid #076FA1;
     height: 436px;
     position: relative;
 }

 .offer-card hr {
     color: #000000;
     height: 4px;
     opacity: 1 !important;
 }

 .card-img {
     width: 251;
     height: 150px;
     object-fit: cover;
     border-radius: 10px;
 }

 .card-title {
     font-size: 20px;
     font-weight: 700;
     margin-top: 10px;
     color: #0168A4;
 }

 .card-desc {
     font-size: 16px;
     color: #000000;
     text-align: center;
     font-weight: 700;
     font-family: Arial;
 }


 .offer-card .readd-btn {
     background: #ffffff;
     color: #0168A4;
     border: 1px solid #FE0000D9;
     /* padding: 7px 10px; */
     height: 29px;
     border-radius: 20px;
     width: 125px;
     margin-top: 8px;
     font-size: 18px;
     font-weight: 700;
     font-family: Inter;
     position: absolute;
     line-height: 100%;
     bottom: 15px;
     left: 25%;
     transition: all 0.4s ease-in-out;
 }

 .offer-card .readd-btn:hover {
     background: #0168A4;
     box-shadow: 0px 1px 5px #262727;
     transform: scale(1.01);
     color: #ffffff;
     border: none;

 }

 /* BUTTONS */
 .offer-prev,
 .offer-next {
     position: absolute;
     top: 50%;
     transform: translateY(-50%);
     background: #004A6D;
     color: #fff;
     border: none;
     padding: 6px 10px;
     border-radius: 50%;
     z-index: 10;
 }

 .offer-prev {
     left: -58px;
 }

 .offer-next {
     right: -50px;
 }

 .offer-prev i,
 .offer-next i {
     font-size: 18px;
 }

 /* RESPONSIVE */
 @media(max-width:991px) {
     .offer-card {
         min-width: 49.4%;
     }

     .offer-prev {
         left: -21px;
     }

     .offer-prev,
     .offer-next {

         border: none;
         padding: 3px 7px;
         /* border-radius: 50%;
                z-index: 10; */
     }

     .offer-slider-container {
         /* overflow: hidden; */
         padding: 15px;
     }

     .offer-next {
         right: -32px;
     }

     .navbar {
         height: 200px !important;

     }

     /* .offer-card {
                min-width: 23.6%;
            } */
     .hero-detail-section .hero-title {
         font-family: Arial, sans-serif;
         font-size: 45px !important;

     }

     .hero-detail-section {

         height: 440px !important;
     }

     .reviewSwiper::after {
         content: "";
         position: absolute;
         left: 0% !important;
         bottom: 0;
         transform: translateX(-50%);
         width: 100%;
         max-width: 498px;
         height: 3px;
         background: #056EA0;
     }
 }

 @media(max-width:575px) {
     .offer-card {
         min-width: 96% !important;
     }

     .navbar {
         height: 198px !important;

     }

     .reviewSwiper::after {
         content: "";
         position: absolute;
         /* left: -121%; */
         right: 111% !important;

     }

     .offer-prev {
         left: -4px;
     }

     .offer-prev,
     .offer-next {

         border: none;
         padding: 4px 7px;
         /* border-radius: 50%;
                z-index: 10; */
     }

     .choose-title {
         font-size: 24px !important;

     }

     .filter-btn.active {

         font-size: 15px !important;
     }

     .filter-btn {

         font-size: 15px !important;

     }

     /* .offer-slider-container {
         overflow: hidden;
         padding: 27px;
     } */

     .offer-slider-container {
         overflow: hidden !important;
         padding: 8px !important;
         /* Extra optional – taake sides se gap hide ho jaye */
     }

     .offer-next {
         right: 5px;
     }

     .offer-slider-track {
         gap: 24px;
     }

     .offer-prev i,
     .offer-next i {
         font-size: 16px;
     }

     .offer-slider-wrapper {
         padding: 44px;
     }

     .hero-heading {
         font-size: 32px !important;

     }

     .hero-para {
         font-size: 12px !important;
     }

     .customer-text {
         font-size: 11px !important;

     }

     .offer-desc {
         font-size: 14px !important;
     }

     .offer-title {
         font-size: 29px !important;

     }

     .section-title {
         font-size: 24px !important;

     }

     .hero-detail-section {

         height: 400px !important;
     }

     .offer-card .read-btn {
         left: 13% !important;
     }
 }

 /* x-ray contaner  */

 .main-heading {
     font-size: 48px;
     font-weight: 700;
     color: #000000;
     font-family: Arial, Helvetica, sans-serif;
 }

 .main-heading span {
     color: #0168A4;
 }

 .xray-box {
     background: #006A9E1A;
     /* Light transparent blue */
     box-shadow: 0 0 20px #00000040;
     text-align: center;
 }

 .xray-card {
     background: #ffffff;
     border-radius: 30px;
     box-shadow: 0 0 15px #00000020;
     padding: 20px;
     width: 277px;
     height: 436px;
     border: 3px solid #076FA1;
     transition: all 0.4s ease-in-out;
     position: relative;
 }

 .xray-card:hover {
     transform: scale(1.04);
 }

 .xray-title {
     font-size: 22px;
     font-weight: 700;
     color: #0168A4;
 }

 .xray-desc {
     font-size: 20px;
     color: #555;
     margin-bottom: 15px;
 }

 .xray-btn {
     background: #0168A4;
     color: #fff;
     border: none;
     padding: 8px 18px;
     border-radius: 6px;
     box-shadow: 0 0 10px #00000040;
     position: absolute;
     bottom: 20px;
     left: 30%;
     text-decoration: none;
     transition: transform 0.5s ease-in-out, background 0.5s ease-in-out, opacity 0.5s ease-in-out;
 }

 .xray-btn:hover {
     background: #004c78;
     transform: scale(1.1);
     opacity: 1;
 }

 .reveal-lines {
     display: inline-block;


     color: #0168A4;
     transition: background-position 1s linear;
     background-position: 0 100%;
 }

 .reveal-lines:hover {
     background-position: 0 0%;
 }


 .color-animate span {
     display: block;
     font-size: inherit;
     font-weight: inherit;
     opacity: 0.9;

     /* Default: Animation Off */
     animation: none;
 }






 .equipment-title {
     font-size: 22px;
     font-weight: 700;
     margin-bottom: 10px;
 }

 .equipment-list {
     list-style-type: disc;
     /* padding-left: 20px; */
     margin-bottom: 20px;
 }

 .equipment-list li {
     font-size: 16px;
     color: #000;
     margin-bottom: 6px;
     list-style: none;
 }


 .btn-lg {
     /* padding: 13px; */
     font-size: 18px;
     /* font-weight: 700; */
     width: 342px;
     height: 46px;
     font-weight: 600;
     font-size: 20px;
 }

 .btn-lgg {
     background-color: #0168A4;
     box-shadow: 0 4px 4px #00000040;
     border-radius: 10px;
     width: 198px;
     height: 43px;
     border: none;
     color: #ffffff;
     font-weight: 500;
     font-family: Inter, sans-serif;
     font-size: 18px;
     line-height: 100%;
     /* display: flex;
     justify-content: center;
     align-items: center; */
     transition: all 0.4s ease-in;
 }

 .btn-lgg:hover {
     background-color: #025686;
     transform: scale(1.03);
 }

 /* ==================medical section ==================================== */

 .medical-section {
     background: #F4F4F4BF;
 }

 /* Main Heading */
 .main-heading {
     color: #000000;
     font-size: 40px;
     font-weight: 700;
     font-family: Arial, Helvetica, sans-serif;
     line-height: 140%;
 }

 .main-heading span {
     color: #016B9F;
     font-size: 40px;
     font-weight: 700;
     font-family: Arial, Helvetica, sans-serif;
     line-height: 140%;
 }

 /* Equipment Titles */
 .equipment-title {
     color: #066EA0;
     font-size: 20px;
     font-weight: 600;
     line-height: 140%;
     font-family: Inter, sans-serif;
 }

 /* Lists */
 .equipment-list li {
     padding-left: 20px;
     line-height: 104%;
     font-weight: 600;
     font-family: Inter, sans-serif;
     color: #0D0D0D;
     margin-top: 20px;
 }

 /* Bottom Description */
 .bottom-text {
     line-height: 140%;
     font-weight: 600;
     font-family: Inter, sans-serif;
     color: #0D0D0D;
 }

 /* Button Styling */
 .get-btn {
     background: #0168A4;
     box-shadow: 0 4px 4px #00000040;
     border: none;
     max-width: 342px;
     width: 100%;
     height: 43px;
     border-radius: 10px;
     font-weight: 600;
     font-family: Inter, sans-serif;
     font-size: 20px;
     line-height: 140%;
     color: #FFFFFF;
     display: flex;
     justify-content: center;
     align-items: center;
     transition: all 0.4s ease-in-out;
 }

 .get-btn:hover {
     background: #014d78;
     transform: translateY(-2px);

 }

 /*============================ oem container css ========================= */


 .oem-trust-section .section-title {
     font-weight: 700;
     font-size: 48px;
     font-family: Arial, Helvetica, sans-serif;
 }

 @media(max-width:768px) {
     .oem-trust-section .section-title {
         font-size: 40px !important;
     }
 }

 @media(max-width:767px) {
     .oem-trust-section .section-title {
         font-size: 35px !important;
     }

     .get-btn {

         font-size: 13px !important;

     }

     .oem-img-box {

         width: 100% !important;

     }

     .oem-card {
         width: 100% !important;
     }

 }

 .section-title span {
     color: #0168A4;
 }

 .oem-img-box {
     position: relative;
     overflow: hidden;
     /* border-radius: 12px; */
     width: 314px;
     border-top-left-radius: 10px;
     border-top-right-radius: 10px;
     border-bottom-left-radius: 2px;
     border-bottom-right-radius: 2px;

     transition: all 0.6s ease-in-out;
 }

 /* IMAGE */
 .oem-img {
     width: 100%;
     border-top-left-radius: 20px;
     border-top-right-radius: 20px;
     border-bottom-left-radius: 0px;
     border-bottom-right-radius: 0px;
     display: block;
     width: 314px;
     height: 337px;
     transition: all 0.7s ease-in-out;

 }

 .oem-img-2 {
     width: 100%;
     border-top-left-radius: 20px;
     border-top-right-radius: 20px;
     border-bottom-left-radius: 0px;
     border-bottom-right-radius: 0px;
     display: block;
     width: 314px;
     height: 337px;
     transition: all 0.7s ease-in-out;

 }

 /* .oem-img, */
 .oem-img-box:hover {
     transform: scale(1.08) translateY(-8px);
     box-shadow: 0px 12px 25px rgba(0, 0, 0, 0.25);
 }

 .oem-img-2:hover {
     transform: scale(1.08) translateY(-8px);
     box-shadow: 0px 12px 25px rgba(0, 0, 0, 0.25);
 }

 .oem-img-box::after {
     content: "";
     position: absolute;
     left: 0;
     bottom: 0;
     width: 100%;
     height: 55%;
     /* bottom half */
     background: linear-gradient(to top,
             #000000B2 60%,
             #FFFFFF00 100%);
     border-radius: 0 0 12px 12px;
     pointer-events: none;
 }


 .oem-card-title {
     position: absolute;
     bottom: 30px;
     left: 0;
     /* right: 140px; */
     /* background: rgba(0, 0, 0, 0.65); */
     color: #fff;
     padding: 10px 15px;
     font-size: 24px;
     font-weight: 700;
     font-family: Inter, sans-serif;
     /* font-family: Inter, sans-serif; */

     text-align: center;
     z-index: 2;
 }

 .oem-desc {
     margin-top: 15px;
     font-size: 15px;
     font-weight: 700;
     font-family: Arial;
     line-height: 160%;
     color: #121212B2;
     max-width: 314px;
 }

 .oem-list {
     margin-top: 10px;
     padding-left: 18px;
 }

 .oem-list li {
     margin-bottom: 6px;
     color: #444;
 }



 /* SECTION BACKGROUND */
 .mission-section {
     background: linear-gradient(90deg, #006A9E 0%, #A5CDE0 100%);
     color: #fff;
 }

 /* CEO IMAGE */
 .ceo-img {
     width: 100%;
     max-width: 314px;
     height: 400px;
     border-radius: 18px;
     /* object-fit: cover; */
     background-size: cover;
     /* box-shadow: 0 4px 15px rgba(0, 0, 0, 0.25); */
 }

 /* TEXT STYLES */
 .ceo-name {
     font-size: 24px;
     font-weight: 700;
 }

 .ceo-title {
     font-size: 16px;
     opacity: 0.9;
 }

 .mission-text {
     font-size: 24px;
     margin-bottom: 25px;
     font-weight: 400;
     color: #0D0D0D;
 }

 /* BUTTON */
 .about-btn {
     background: #fff;
     color: #006A9E;
     padding: 10px 25px;
     border: none;
     border-radius: 8px;
     font-weight: 600;
     box-shadow: 0 4px 10px rgba(0, 0, 0, 0.25);
     transition: 0.3s ease;
     margin-top: 60px;
 }

 .about-btn:hover {
     background: #e9e9e9;
     transform: translateY(-3px);
 }

 /*========================== location container ====================*/

 /* SECTION TITLE */
 .location-section .section-title {
     font-size: 48px;
     font-weight: 600;
     color: #000000;
     font-family: Inrer, sans-serif;
 }

 .location-section .section-title span {
     color: #0071A8;
 }

 .location-section .section-desc {
     font-size: 18px;
     max-width: 900px;
     margin: auto;
     line-height: 1.7;
     color: #444;
 }

 /* LEFT IMAGE */
 .location-img {
     border-radius: 12px;
     /* box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25); */
     /* margin-top: 70px; */
     height: 573px;
     width: 100%;
 }

 /* RIGHT BOX */
 .location-box {
     background: #0A70A238;
     padding: 25px;
     border-radius: 12px;
     box-shadow: 0 4px 15px #00000040;

 }

 /* HEADINGS */
 .box-title {
     font-size: 50px;
     font-weight: 600;
     color: #0168A4;
     font-family: sans-serif;
 }

 .box-title span {
     color: #000000;
 }

 .sub-title {
     font-size: 24px;
     font-weight: 600;
     color: #0168A4;
     font-family: Inter, sans-serif;
 }

 /* LISTS */
 .primary-list,
 .secondary-list {
     list-style-type: disc;
     padding-left: 20px;
 }

 .primary-list li,
 .secondary-list li {
     font-size: 16px;
     margin-bottom: 8px;
     color: #01395C;
 }

 .secondary-list li {
     color: #333;
 }

 .secondary-list .area-link {
     color: inherit;
     text-decoration: none;
 }

 .secondary-list .area-link:hover {
     color: #01395C;
     /* ya jo bhi primary color hai */
     text-decoration: underline;
 }

 /* chose section css */

 .choose-title {
     font-size: 48px;
     font-weight: 600;
     color: #0D0D0D;
     text-align: center;
     /* margin-bottom: 40px; */
     font-family: Inter, sans-serif;
     line-height: 160%;
 }

 .choose-title span {
     color: #046DA0;
 }

 .choose-card {
     position: relative;
     background: #fff;
     padding: 5px;
     border-radius: 12px;
     text-align: center;
     /* box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1); */
     overflow: hidden;
     height: 145px;
     width: 323px;
     border: 1px solid #046DA0;
 }

 /* COLOR FILL LAYER */
 .choose-card::before {
     content: "";
     position: absolute;
     inset: 0;
     background: #0A70A2;
     /* solid color */
     width: 0%;
     /* Start from ZERO */
     transition: width 0.8s ease;
     /* smooth fill */
     z-index: 0;
 }

 /* On hover - fill left → right */
 .choose-card:hover::before {
     width: 100%;
     /* FULL CARD */

 }

 /* Content stays above the color */
 .choose-card * {
     position: relative;
     z-index: 2;
 }

 /* Optional: text white on hover */
 .choose-card:hover .choose-heading,
 .choose-card:hover .choose-desc,
 .choose-card:hover .choose-icon {
     color: #fff;
     transition: 0.5s ease;
 }





 .choose-icon {
     font-size: 40px;
     color: #046DA0;
     /* Green check icon */
     /* margin-bottom: 15px; */
 }

 .choose-heading {
     font-size: 22px;
     font-weight: 700;
     color: #000000;
     font-family: Inter, sans-serif;

 }

 .choose-desc {
     font-size: 14px;
     color: #000000;
     margin-top: -10px;
     font-weight: 400;
     font-family: Inter, sans-serif;
 }

 .choose-top {
     display: flex;
     align-items: center;
     /* justify-content: center; */
     gap: 8px;
     /* margin-bottom: 12px; */
 }

 @media(max-width:576px) {
     .choose-card {

         height: auto;
         width: auto !important;
     }

     .location-img {
         height: auto;
     }

     .ceo-img {
         max-width: 100% !important;
         height: 300px !important;
     }

     .hero-btn {

         padding: 7px 10px !important;
         font-size: 12px !important;

     }

     .main-heading {
         font-size: 23px !important;

     }

     .main-heading span {
         font-size: 23px !important;

     }

     .btn-lg {
         font-size: 12px !important;

     }



     .equipment-title {
         font-size: 16px !important;

     }

     .equipment-list li {
         font-size: 14px !important;
     }

     .footer-select {
         max-width: 185px !important;
         width: 100%;

     }
 }

 @media(max-width:786px) {
     .choose-card {

         height: auto;
         width: auto !important;
     }

     .footer-select {
         max-width: 159px !important;
         width: 100%;

     }

     .location-img {
         border-radius: 12px;
         /* box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25); */
         /* margin-top: 70px; */
         height: auto;
         width: 100%;
     }

     .oem-img {

         width: 283px !important;
         height: 300px !important;


     }

     .main-heading {
         font-size: 45px;

     }

     /* .oem-img-box {

         width: 283px !important;

     } */


     .xray-card {
         width: 325px !important;
     }

     .ceo-img {
         width: 100%;
         max-width: 50%;
         height: 400px;
     }

     /* .mx {
                margin-left: 100px;
            } */
     .bg-section {

         height: 60vh !important;
     }
 }

 @media(max-width:767px) {
     .bg-section {

         height: 31vh !important;
     }
 }

 /* .active {
     color: red !important;
 } */

 /* home banner */
 .bg-section {
     background-image: url('/frontend/images/home-banner-img1.png');
     background-size: cover;
     background-position: center;
     background-repeat: no-repeat;
     height: 100vh;
     width: 100%;
     position: relative;
 }

 /* Overlay */
 /* .bg-section .overlay {
     position: absolute;
     inset: 0;
     background: rgba(0, 0, 0, 0.1);
 } */

 /* Center Content */
 .content-wrapper {
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);

 }

 .shadow-div {
     background: transparent !important;
     filter: drop-shadow(0px -30px 30px #ffffff)
         /* Left strong */
         drop-shadow(-33px 0px 33px #ffffff)
         /* Right strong */
         drop-shadow(61px 0px 43px #ffffff)
         /* Bottom (very light) */
         drop-shadow(0px 0px 0px #ffffff);
 }



 /* 10+ Years Text */
 .years-text {
     color: #0071A8;
     font-size: 55px;
     font-weight: 700;
     font-family: 'Poppins', sans-serif;
 }

 /* Curved Lines */
 .line-wrapper {
     width: 100%;
     height: 10px;
     position: relative;
 }

 /* Straight part 75% */
 .line-straight {
     width: 75%;
     height: 6px;
     background: #0071A8;
     display: inline-block;
     vertical-align: top;
     border-radius: 3px 0 0 3px;
 }

 /* Curved part 25% */
 .line-curve {
     width: 25%;
     height: 3px;
     display: inline-block;
     vertical-align: top;
     position: relative;
     overflow: hidden;
 }

 /* Smooth downward curve using ::after */
 .line-curve::after {
     content: "";
     position: absolute;
     top: -6px;
     /* move up to create curve */
     left: 0;
     width: 100%;
     height: 18px;
     /* curve height */
     background: #0071A8;
     border-radius: 0 0 50% 50%;
     /* bottom bend */
 }





 /* Review Box */
 .review-box {
     width: 343px;
     height: 88px;
     background: #FFFFFF;
     border-radius: 22px;
     display: flex;
     align-items: center;
     margin-top: 25px;
 }

 /* Rating Left Box */
 .rating-box {
     width: 165px;
     height: 88px;
     background: #0071A8;
     border-radius: 22px;
     color: white;
 }

 .rating-number {
     font-size: 55px;
     font-weight: 700;
     line-height: 100%;
     color: #FFFFFF;
 }

 .rating-star i {
     font-size: 24px;
     color: #CACDD8;
     /* Gold color */
 }


 /* Google Content */
 .google-logo {
     width: 112px;
     height: auto;
     margin-bottom: 0px;
 }

 .review-text {
     font-size: 16px;
     font-weight: 500;
 }


 /* faqs section */


 .faqs-section {
     /* background: #f4f4f4; */
 }

 .faqs-heading {
     font-size: 40px;
     font-weight: 700;
     color: #0D0D0D;
     margin-bottom: 10px;
     font-family: Arial, sans-serif;
 }

 .faqs-subheading {
     font-size: 17px;
     color: #121212;
     margin-bottom: 30px;
     font-weight: 600;
     font-family: Arial, sans-serif;

 }

 .faq-para {
     color: #A2A6B0;
     font-size: 16px;
     font-weight: 700;
     font-family: Arial, sans-serif;

 }

 /* .faqs-list {
            border-top: 1px solid #ccc;
        } */

 .faq-item {
     border-bottom: 1px solid #ccc;
     cursor: pointer;
 }

 .faq-title {
     padding: 15px 0;
     font-size: 17px;
     font-family: Inter, sans-serif;
     color: #121212;
     font-weight: 600;
     position: relative;
     display: flex;
     justify-content: space-between;
     align-items: center;
 }

 .faq-icon {
     font-size: 24px;
     color: #0168A4;
     transition: transform 0.4s ease;
 }

 /* Rotate icon when active */
 .faq-item.active .faq-icon {
     transform: rotate(180deg);
 }

 .faq-content {
     max-height: 0;
     overflow: hidden;
     transition: max-height 0.4s ease, padding 0.3s ease;
     padding: 0 0;
     color: #333;
     font-size: 16px;
 }

 .faq-item.active .faq-content {
     max-height: 200px;
     /* adjust according to content */
     padding: 10px 0;
 }

 .faq-content {
     display: none;
     padding-top: 8px;
     color: #555;
     transition: all 0.3s ease;
 }

 .faq-item.active .faq-content {
     display: block;
 }

 .btn-see-more {
     margin-top: 60px;
     background: #0168A4;
     color: #fff;
     border: none;
     /* padding: 10px 25px; */
     border-radius: 10px;
     font-size: 18px;
     font-weight: 500;
     cursor: pointer;
     width: 150px;
     height: 43px;
     box-shadow: 0px 4px 4px #00000040;
     line-height: 100%;
     font-family: Inter, sans-serif;
     transition: all 0.4s ease-in;
 }

 .btn-see-more:hover {
     background: #004972;
     transform: scale(1.02) translateY(-7px);

 }

 .faq-img {
     max-width: 100%;
     border-radius: 12px;
     /* box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15); */
 }

 /* tooltip */
 .review-heading {
     font-size: 40px;
     font-weight: 400;
     font-family: Arial, Helvetica, sans-serif;
     text-align: center;
 }

 .review-heading span {
     font-size: 40px;
     font-weight: 700;
     font-family: Arial, Helvetica, sans-serif;
     color: #0168A4;
 }

 .reviewSwiper {
     width: 700px;
     max-width: 100%;
     /* 👈 responsive */
     margin: 0 auto;
     padding: 200px 0 80px;
     direction: rtl;
     overflow: visible;
     position: relative;
     /* 👈 required */
 }

 /* 🔽 BORDER BOTTOM */
 .reviewSwiper::after {
     content: "";
     position: absolute;
     left: 50%;
     bottom: 0;
     transform: translateX(-50%);
     width: 100%;
     /* 👈 same as container */
     max-width: 1100px;
     height: 3px;
     background: #056EA0;
     /* border color */
 }


 @media(max-width:768px) {
     .reviewSwiper {
         width: 430px !important;

     }

     .tooltip-box {
         width: 600px !important;
     }

     .tooltip-box p {
         font-size: 12px !important;
     }
 }

 @media(max-width:767px) {
     .reviewSwiper {
         width: 240px !important;

     }

     .tooltip-box {
         width: 320px !important;
         height: auto !important;
     }

     .tooltip-box p {
         font-size: 12px !important;
     }
 }

 /* Slide box */
 .tooltip-slide {
     width: 106px !important;
     height: 96px;
     border-radius: 34px;
     position: relative;
 }

 /* Slide images */
 .tooltip-slide img {
     width: 100%;
     height: 100%;
     object-fit: cover;
     border-radius: 34px;
     filter: brightness(40%);
     transition: .4s;
 }

 /* Active-center image */
 .tooltip-slide.is-center img {
     filter: brightness(100%);
     transform: scale(1.2);
 }

 /* Tooltip */
 .tooltip-box {
     position: absolute;
     bottom: 150%;
     left: 50%;
     transform: translateX(-50%);
     width: 894px;
     height: 133px;
     padding: 14px;
     background: #000000AD;
     color: #fff;
     opacity: 0;
     visibility: hidden;
     border-radius: 34px;
     transition: .3s;
     z-index: 10;
     direction: ltr !important;
     text-align: left !important;
     padding-left: 30px;
 }

 .tooltip-box::after {
     content: "";
     position: absolute;
     bottom: -10px;
     left: 50%;
     transform: translateX(-50%);
     border-left: 12px solid transparent;
     border-right: 12px solid transparent;
     border-top: 12px solid #000;
 }

 .starss {
     padding-left: 50px;
 }

 .starss i {
     font-size: 30px;
     color: #CACDD8;
     /* default grey */
 }

 .starss i.active {
     color: #E9A426 !important;
     /* active star */
 }

 .diff {
     color: #CACDD8;
 }

 .tooltip-box p {
     font-size: 16px;
     line-height: 160%;
     font-weight: 500;
     font-family: Inter;
 }

 .tooltip-box p .quote {
     color: #DEE9FF;
     font-size: 50px;
     margin-right: 6px;
     /* gap */
 }

 /* Tooltip show only when center */
 .tooltip-slide.is-center .tooltip-box {
     opacity: 1;
     visibility: visible;
     bottom: 120%;
 }

 /* =============product section css =========== */

 .product-section-heading {
     color: #ffffff;
     font-weight: 600;
     font-size: 48px;
     font-family: Inter, sans, sans-serif;
 }

 .product-section-heading span {
     color: #0D0D0D;

 }

 .product-series-para {
     color: #FFFFFF;
     font-family: 'Poppins', sans-serif;
     font-size: 18px;
     font-weight: 700;
 }

 .product-series-bg {
     background: linear-gradient(to right, #006A9E 60%, #A5CDE0);
 }

 .filter-btn {
     background-color: transparent;
     border: none;
     color: #ffffff;
     padding: 8px 20px;
     font-family: 'Poppins', sans-serif;
     font-size: 18px;
     font-weight: 700;
     cursor: pointer;
     transition: all 0.3s ease;
     border-radius: 15px;
     /* max-width: 200px;
     height: 40px; */
     transition: all 0.4s ease-in-out;

 }

 .filter-btn:hover {
     color: #9a9898;

 }

 .filter-btn.active {
     background-color: #0071A8;
     color: white;
     border-color: #0071A8;
     box-shadow: 0 4px 6px rgba(0, 113, 168, 0.3);
     font-family: Poppins;
     font-size: 18px;
     font-weight: 700;
     /* max-width: 149px;
     height: 40px; */
     border-radius: 15px;
     transition: all 0.4s ease-in-out;
 }

 .filter-btn.active:hover {
     background-color: #015c89;
     transform: scale(1.04);

 }

 .filter-btn:not(.active):hover {
     background-color: #0071A81A;
 }

 .products-series-section .section-heading {
     margin-bottom: 25px !important;
 }

 .custom-card {
     background-color: #ffffff;
     border-radius: 12px;
     /* overflow: hidden; */
     height: 380px;
     width: 250px;
     margin-top: 30px;
     transition: all 0.6s ease-in-out;
 }

 .custom-card:hover {
     transform: scale(1.08);
 }

 .custom-card img {
     height: 196px;
     border-radius: 12px;


 }

 .custom-card .card-content-box {
     background-color: #0A70A238;
     border-top: 1px solid rgba(0, 0, 0, 0.05);
     border-bottom-left-radius: 12px;
     border-bottom-right-radius: 12px;
     height: 186px;

 }

 .product-title {
     font-size: 16px;
     font-weight: 500;
     /* color: #FFFFFF; */
     font-family: Inter, sans-serif;
     line-height: 160%;
 }

 .card-text {
     font-size: 13px;
     font-weight: 400;
     color: #202020;
     font-family: Inter, sans-serif;
 }

 .buy-now-btn {
     background-color: #FFFFFF;
     /* border-color: ; */
     color: #000000;
     font-weight: 600;
     transition: background-color 0.3s;
     font-size: 12px;
 }



 .new-price {
     color: #1a1b1b !important;
 }

 .product-discount-badge {
     position: absolute;
     top: 10px;
     right: 10px;
     background-color: #f30f1b;
     color: white;
     font-weight: bold;
     font-size: 0.75rem;

     border-radius: 50%;

     padding: 8px 5px;
     width: 40px;
     height: 40px;
     display: flex;
     align-items: center;
     justify-content: center;
     text-align: center;
     line-height: 1.1;
     z-index: 5;
 }

 @media (max-width: 768px) {

     /* Example: Agar contact container overflow kar raha hai */
     .contact-container {
         width: 95% !important;
         /* Thoda kam karein */
         padding: 15px !important;
         /* Padding kam karein */
         box-sizing: border-box;

     }

     .product-section-heading {


         font-size: 48px;

     }


     body {
         overflow-x: hidden;


     }

     .product-section-heading {


         font-size: 48px;

     }

     .info-heading {
         font-size: 24px !important;

     }

     .info-para {
         font-size: 15px !important;

     }

     .info-img {
         height: 470px !important;

     }

     .container,
     .container-fluid {
         padding-right: var(--bs-gutter-x, 1.5rem) !important;
         padding-left: var(--bs-gutter-x, 1.5rem) !important;
     }
 }

 @media (max-width: 767px) {
     .product-section-heading {


         font-size: 29px !important;
     }

     .product-series-para {

         font-size: 16px;

     }

     .container,
     .container-fluid {
         padding-right: var(--bs-gutter-x, 1.5rem) !important;
         padding-left: var(--bs-gutter-x, 1.5rem) !important;
     }

     .xray-card {
         width: auto !important;
     }

     .box-title {
         font-size: 29px !important;
     }

     .sub-title {
         font-size: 20px !important;
     }

     .faqs-heading {
         font-size: 30px !important;

     }

     .faq-img {
         max-width: 90% !important;
     }

     .custom-card {
         height: 470px !important;
         /* width: 90%; */
     }

     .custom-card .card-content-box {
         height: 170px !important;
     }

 }


 /* ================= recent news section css ================== */

 .recent-news-section {
     background: linear-gradient(to right, #006A9E 60%, #A5CDE0);
     padding-top: 60px;
     padding-bottom: 60px;
 }


 .recent-news-section .section-title {
     color: white;
     font-family: 'Inter', sans-serif;
     font-weight: 600;
     font-size: 48px;
     margin-bottom: 15px;
 }

 /* Section Description */
 .recent-news-section .section-desc {
     color: #ffffff;
     font-size: 17px;
     font-weight: 500;
     max-width: 700px;
     margin-left: auto;
     margin-right: auto;
     line-height: 1.6;
 }

 /* News Card Styles */
 .news-card {
     border: none;
     transition: transform 0.3s ease, box-shadow 0.3s ease;
     height: 412px;
     transition: all 0.4s ease;
     position: relative;
 }

 .news-card:hover {
     transform: translateY(-7px) scale(1.01);
     box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15) !important;
 }

 .news-card img {
     height: 178.52px;
     width: 279.27px;
     background-size: cover;
 }

 .news-card .news-title {
     color: #006A9E;
     font-size: 20px;
     font-weight: 700;
     line-height: 100%;
 }

 .news-card .news-desc {
     font-size: 12px;
     line-height: 160%;
     color: #00000080 !important;
     font-weight: 700;
     font-family: Arial;
     max-width: 279.26751708984375px;
 }

 .read-more-link {
     color: #000000B2;
     font-weight: 700;
     font-size: 16px;
     line-height: 160%;
     position: absolute;
     left: 17px;
     bottom: 14px;

 }

 .read-more-link:hover {
     color: #d19421;
     /* Darker accent on hover */
 }

 .read-more-link .fas.fa-arrow-right {
     transition: transform 0.3s ease;

     font-size: 1.5rem;

     margin-left: 8px;
     margin-top: 3px;


 }

 .read-more-link:hover .fas.fa-arrow-right {
     transform: translateX(10px);

 }

 /* --- Responsive Adjustments --- */
 @media (max-width: 768px) {
     .recent-news-section .section-title {
         font-size: 36px;
         /* Smaller title on mobile */
     }
 }


 /* ====================================== all hero section css ================================*/


 .hero-detail-section {
     background: linear-gradient(to right, #006A9E 60%, #A5CDE0);
     padding-top: 50px;
     padding-bottom: 80px;
     height: 351px;
     margin-top: 180px;
 }

 .hero-detail-section .hero-title {
     font-family: Arial, sans-serif;
     font-size: 50px;
     font-weight: 700;
     color: white;
     line-height: 120%;
 }

 .hero-title span {
     color: #000000;
 }

 .hero-detail-section .hero-description {
     font-size: 16px;
     font-weight: 700;
     max-width: 800px;
     line-height: 160%;
     font-family: Arial, sans-serif;

 }

 .simple-breadcrumb-container {
     max-width: 1200px;
     margin: 0 auto;
     text-align: left;
 }

 .simple-breadcrumb {
     display: flex;
     align-items: center;
     font-family: Inter, sans-serif;
     font-size: 12px;
     font-weight: 500;
 }

 .breadcrumb-link {
     color: #0D0D0D;
     text-decoration: none;
     transition: color 0.3s;
 }

 .breadcrumb-link:hover {
     color: #e3eff4;
 }

 .breadcrumb-separator {
     color: #0D0D0D;
     font-size: 12px;
     margin: 0 8px;
 }

 .breadcrumb-active {
     color: #ffffff;
     font-weight: 600;
 }







 /* =============================== circle section  ================================== */


 .hero-circles-section {
     /* min-height: 750px; */
     display: flex;
     flex-direction: column;

     background-color: #ffffff;
     position: relative;
     overflow: hidden;
 }

 .circle-one {
     background: #EBE9E980;
     width: 1413px;
     height: 1111px;
     border-radius: 50%;
     position: absolute;
     top: -200px;
     left: -452px;
     z-index: 0;
 }

 .circle-two {
     background: #EBE9E980;
     width: 1406.71px;
     height: 548.92px;
     border-radius: 50%;
     position: absolute;
     left: 390px;
     top: 700px;
     transform: rotate(-18.33deg);
     z-index: 0;
 }

 /* .hero-circles-section .container {
     z-index: 1;
 } */

 /* ============================= service page css  =======================================*/

 @media (max-width: 991px) {
     .hero-circles-section {
         min-height: 600px;
     }

     .hero-main-heading {
         font-size: 26px;

     }

     .hero-description {
         text-align: start;
         font-size: 15px;

     }

     /* Circles ko mobile par chota kar dein ya hide kar dein */
     .circle-one {
         width: 800px;
         height: 800px;
         top: 100px;
         left: -400px;
     }

     .circle-two {
         width: 700px;
         height: 700px;
         bottom: -350px;
         right: -350px;
     }

     .equipment-heading {
         font-size: 40px !important;

     }

     .equipment-list li {
         padding-left: 10px !important;
         font-size: 17px !important;
         margin-bottom: 10px !important;
     }

     .service-main-heading {
         font-size: 32px !important;

     }

     .main-desc {

         font-size: 15px !important;
     }

     .infoo-img {

         margin: 0 auto 60px auto !important;
     }

     .btn-contact {

         margin-top: 17px !important;
     }

     .bottom-bg {

         margin-top: 0px !important;
     }
 }

 @media (max-width: 767px) {

     /* Very small devices par circles ko hide karna behtar hai performance aur simplicity ke liye */
     .circle-one,
     .circle-two {
         display: none;
     }

     .hero-image-top {

         margin-top: 27px;
     }

     .bottom-bg {
         margin-top: -243px !important;
     }

     .contact-section {

         height: 550px !important;
     }

     .service-card h4 {
         font-size: 25px !important;

     }

     .service-card p {
         font-size: 14px !important;

     }

     .rental-heading {
         font-size: 42px !important;

     }

     .service-main-heading {
         font-size: 20px !important;
     }

     .main-desc {
         font-size: 12px !important;
     }

     .hero-detail-section .hero-title {
         font-size: 37px !important;

     }

     .hero-detail-section .hero-description {
         font-size: 14px !important;
         font-weight: 600 !important;

     }

     .equipment-heading {
         font-size: 18px !important;
         font-weight: 600;

     }

     .equipment-list li {
         padding-left: 0px !important;
         font-size: 14px !important;
         margin-bottom: 10px !important;
     }

     .yes-icon {
         color: #0168A4;
         font-size: 28px !important;

     }
 }

 .medical-equipment-section {
     z-index: 2;
 }

 .equipment-heading {
     font-size: 48px;
     font-weight: 600;
     color: #0D0D0D;
     font-family: Inter, sans-serif;
     /* max-width: 900px; */
 }

 .equipment-heading span {
     color: #0071A8;
 }

 .equipment-list {
     list-style: disc !important;

 }



 .equipment-list li {
     font-size: 22px;
     margin-bottom: 12px;
     /* display: flex;
     align-items: center; */
     color: #121212B2;
     font-weight: 700;
     z-index: 2;
     font-family: Inter, sans-serif;
 }

 .yes-icon {
     color: #0168A4;
     font-size: 40px;
     margin-right: 10px;
     z-index: 2;
 }


 /* ======================= cta section =================== */
 .cta-contact-section {
     background: #0071A8;
     padding: 30px 0;
     height: 342px;
 }

 @media(max-width:768px) {
     .cta-contact-section {

         height: 682px;
     }

     .cta-contact-text {

         font-size: 17px !important;

     }

     .cta-image {

         margin-top: 23px !important;
     }

     .cta-contact-img1 {
         margin-top: -33px !important;

     }

     .cta-contact-box {

         margin-top: 70px !important;
     }
 }

 @media(max-width:767px) {
     .cta-contact-img1 {
         display: none;
     }

     .cta-contact-text {
         font-size: 10px !important;
     }

     .cta-contact-section {
         height: 681px !important;
     }

     .cta-contact-heading {

         font-size: 27px !important;

     }
 }


 .cta-contact-heading {
     font-family: Arial;
     font-weight: 700;
     font-style: Bold;
     font-size: 48px;
     line-height: 48px;
     letter-spacing: 0%;
     text-transform: capitalize;
     color: #FFFFFF;
 }

 .cta-contact-box {
     width: 626px;
     height: 54px;
     background: #FF3535;
     border-radius: 10px;

     display: flex;
     align-items: center;
     justify-content: space-between;
     padding: 0 18px;
     gap: 15px;
     margin-top: 50px;
 }

 .cta-contact-text {
     font-family: Arial;
     font-weight: 700;
     font-size: 20px;
     line-height: 160%;
     letter-spacing: 0%;
     color: #FFFFFF;
 }

 .cta-contact-icon {
     width: 116px;
     height: 54px;
     margin-right: -18px;
     border-top-right-radius: 10px;
     border-bottom-right-radius: 10px;


 }

 .cta-contact-img1 {
     margin-top: -45px;
     width: 91.49410625494069px;
     height: 133.9307499759018px;
 }



 .cta-contact-sp {
     font-size: 39px;
     color: #FFFFFF;
     display: block;
     text-align: center;
     padding-bottom: 10px;
 }

 .cta-img-wraper {
     position: relative;
 }

 .cta-phone {
     position: absolute;
     right: 14px;
     top: 6px;
     height: 39px;
     width: 39px;
 }

 .cta-line {
     position: absolute;
     right: -3px;
     font-size: 39px;
     color: #0071A8;
     bottom: 4px;

 }

 .cta-image {
     width: 184px;
     height: 304px;
     object-fit: contain;
     margin-top: 8px;
     max-width: 100%;
 }

 /* ============== aostin section css ================ */

 .austin {
     background: rgba(0, 106, 158, 0.1);
     box-shadow: 0px 0px 20px #00000040;
     padding: 40px;
     text-align: center;
     /* height: 523px; */
 }

 .austin-heading {
     font-family: Arial;
     font-weight: 700;
     font-size: 48px;
     line-height: 100%;
     letter-spacing: 0;
     text-transform: capitalize;
     margin-bottom: 20px;
 }

 .austin-heading span {
     color: #0168A4;
 }

 .austin-desc {
     font-family: Arial;

     font-weight: 400;


     font-size: 20px;


     line-height: 160%;



 }





 /* ============ sub details pages css ===================== */

 .image-slider {
     position: relative;
     width: 510px;
     height: 499px;
 }

 .main-img {
     width: 100%;
     max-width: 510px;
     height: 499px;
     object-fit: cover;
     border: 5px solid #0071A8;
     border-radius: 15px;
     margin-top: 23px;
 }


 @media(max-width:768px) {
     .main-img {
         margin-left: 16%;
     }

     .thumb-slider-container {

         margin-left: 18% !important;
     }

     .pagination-wrapper {

         margin-left: 23% !important;
     }
 }

 @media(max-width:460px) {
     .main-img {
         max-width: 375px !important;
         margin-left: 0% !important;

     }

     .pagination-wrapper {
         margin-left: 4% !important;
     }
 }

 @media(max-width: 400px) {
     .main-img {
         max-width: 326px !important;
         margin-left: 0% !important;
     }

     .pagination-wrapper {
         margin-left: -3% !important;
     }

     .detail-heading {
         font-size: 30px !important;

     }

     .service-list {

         font-size: 14px !important;

     }
 }

 @media(max-width:767px) {


     .austin-heading {
         font-size: 20px !important;
     }

     .thumb-slider-container {

         margin-left: 0% !important;
     }



     .austin-desc {

         font-size: 14px !important;
     }

     .austin-li {

         font-size: 14px !important;

     }
 }

 .thumbs {
     margin-top: 15px;
     display: flex;
     gap: 10px;
 }

 .thumb {
     width: 90px;
     height: 90px;
     object-fit: cover;
     border-radius: 8px;
     cursor: pointer;
     border: 3px solid transparent;
 }

 .thumb:hover {
     border-color: #0071A8;
 }

 /* Right Column */


 .detail-heading {
     font-size: 32px;
     font-weight: 700;
     margin-bottom: 20px;
     line-height: 63px;
     margin-bottom: 12px;
 }

 .detail-heading span {
     color: #0A70A2;
     display: block;
 }

 .service-list li {
     font-family: Arial;
     font-weight: 400;
     font-size: 20px;
     line-height: 160%;
     letter-spacing: 0;
     margin-bottom: 12px;
 }

 .quote-btn {
     background-color: #0071A8;
     color: #fff;
     border: none;
     font-size: 18px;
     border-radius: 10px;
     cursor: pointer;
     width: 100%;
     max-width: 248px;
     height: 43px;
     font-weight: 500;
     line-height: 100%;
     font-family: Inter;
     box-shadow: 0px 4px 4px #00000040;
     margin-top: 20px;
     transition: all 0.4s ease-in-out
 }

 .quote-btn:hover {
     background-color: #015b88;
     transform: scale(1.03) translateY(-4px);
 }

 .thumb-slider-container {
     position: relative;
     width: 100%;
     display: flex;
     align-items: center;
     gap: 5px;
     margin-top: 36px;
     margin-left: 6%;
 }

 /* Only this container hides extra thumbnails */
 .thumb-wrapper {
     width: 350px;
     /* 4 thumbs * (82px + gap) */
     overflow: hidden;
 }

 .thumbs-track {
     display: flex;
     gap: 10px;
     transition: transform 0.5s ease-in-out;
 }

 .thumb {
     width: 82px;
     height: 45px;
     border-radius: 6px;
     cursor: pointer;
     object-fit: cover;
     border: 2px solid transparent;
 }

 .thumb:hover {
     border-color: #0071A8;
 }

 .thumb-prev,
 .thumb-next {
     background: #0071A8;
     color: #fff;
     border: none;
     padding: 8px 12px;
     cursor: pointer;
     border-radius: 6px;
     font-size: 18px;
 }

 /* Pagination segments */
 .pagination-wrapper {
     width: 350px;

     display: flex;
     justify-content: center;
     margin-left: 11%;

 }

 .pagination-bar {
     display: flex;
     justify-content: center;
     gap: 8px;
     margin-top: 20px;
 }

 .pg-segment {
     width: 40px;
     height: 8px;
     background: #d1d1d1;
     border-radius: 2px;
     cursor: pointer;
     transition: background 0.3s;
 }

 .pg-segment.active {
     background: #015e8c;
 }



 /*=============== form section ==========================*/

 /* Section Background */
 .contact-section {
     background: #ffffff;
 }

 /* Left Column */
 .contact-heading {
     font-size: 32px;
     font-weight: 700;
     color: #0071A8;
     font-family: Saira;
     line-height: 137%;

 }

 .contact-desc {
     font-size: 16px;
     color: #00000080;
     font-weight: 700;
     font-family: Arial;
     line-height: 160%;

 }

 .contact-info {
     display: flex;
     align-items: center;
 }

 .contact-icon {
     font-size: 20px;
     color: #FE0000;
     /* red icon color */
     margin-right: 10px;
 }

 .contact-text {
     font-size: 22px;
     font-weight: 300;
     font-family: Inter;
     line-height: 100%;
     color: #000000B2;
 }

 .contact-textt {
     font-size: 20px;
     font-weight: 400;
     font-family: Arial;
     line-height: 100%;
     color: #026B9F;
 }

 .tech-heading {
     font-weight: 700;
     color: #0071A8;
     font-size: 20px;
     line-height: 160%;
     font-family: Arial;
 }

 /* Form Column */
 .form-wrapper {
     background: #006A9E1A;
     /* light blue transparent */
     border-radius: 10px;
     width: 100%;

     max-width: 538px;
     /* height: 660px; */
     padding-bottom: 20px;

 }

 .form-heading {
     font-size: 32px;
     font-weight: 700;
     color: #0071A8;
     font-family: Saira;
     line-height: 137%;
 }

 .form-desc {
     font-size: 16px;
     color: #00000080;
     font-weight: 400;
     font-family: Poppins;
     line-height: 30px;

 }

 .submit-btn {
     background: #066EA1;
     color: #fff;
     font-weight: 700;
     border-radius: 10px;
     width: 100%;

     max-width: 427px !important;
     height: 32px;
     font-size: 20px;
     line-height: 137%;
     font-family: 'Saira';
     margin-top: 40px;

     transition: all 0.4s ease-in-out;
     display: flex;
     justify-content: center;
     align-items: center;
 }

 .submit-btn:hover {
     background: #015077;
     color: #fff;
     transform: scale(1.03)
 }

 .formm-input {
     width: 100%;

     max-width: 427px;
     height: 28px;
     border-radius: 10px;
     font-size: 14px;
     color: #8B8B8B;
     line-height: 137%;
     font-weight: 400;
     font-family: Inter;

 }

 .formm-select {
     width: 100%;

     max-width: 205px;
     height: 28px;
     border-radius: 10px;
     font-size: 14px;
     color: #8B8B8B;
     line-height: 137%;
     font-weight: 400;
     font-family: Inter;

 }

 .formm-select::placeholder {
     color: #8B8B8B;
 }

 .formmm-select {
     width: 100%;
     max-width: 152px;

     height: 28px;
     border-radius: 10px;
     font-size: 14px;
     color: #8B8B8B;
     line-height: 137%;
     font-weight: 400;
     font-family: Inter;
 }

 .formm-text {
     width: 100%;
     max-width: 427px;

     height: 84px;
     color: #8B8B8B;
     line-height: 137%;
     font-weight: 400;
     font-family: Inter;
 }

 .form-control:focus,
 .form-select:focus,
 textarea.form-control:focus {
     box-shadow: none !important;
     outline: none !important;
     border: 2px solid #026B9F !important;
     color: #8B8B8B;

 }

 /* ============= pagination =================== */

 .pagination {
     display: flex;
     justify-content: center;
     list-style: none;
     padding: 0;
     margin-top: 70px;
     /* margin-right: 130px; */
 }

 .page-link {
     color: #A2A6B0;
     display: flex;
     /* text center */
     align-items: center;
     /* vertical center */
     justify-content: center;
     /* horizontal center */
     height: 46px;
     width: 46px;
     padding: 0;
     text-decoration: none;
     transition: background-color 0.3s;
     border: 2px solid #A2A6B0;
     margin: 0 4px;
     border-radius: 50%;
 }


 .page-link.active {
     background-color: #B7E9FF;
     color: #333;
     border: 1px solid #B7E9FF;
 }

 .page-link:hover:not(.active) {
     background-color: #0071A8;
     color: #FFFFFF;
 }

 .page-link:first-child,
 .page-link:last-child {
     font-weight: bold;
 }

 .ellipsis {
     color: #555;
     padding: 8px 16px;
     margin: 0 4px;
     align-self: center;
 }




 /* ================ blog feature section css ============================ */



 .latest-blog-heading {
     font-size: 48px;
     font-weight: 700;
     font-family: Arial;
     line-height: 48px;

 }

 .latest-blog-heading span {
     color: #036CA0;
 }

 .featured-card {
     background: #fff;
     border-radius: 12px;
     padding: 15px;
     /* box-shadow: 0px 3px 12px rgba(0, 0, 0, 0.08); */
     transition: all 0.6s ease-in-out;
     border: 1px solid #0168A4 !important;
     height: 270px;
 }

 .featured-card:hover {
     box-shadow: 0px 8px 20px rgba(3, 108, 160, 0.25);
     transform: scale(1.04);
     cursor: pointer;
 }

 .featured-img {
     width: 180px;
     height: 100px;
     border-radius: 10px;
     object-fit: cover;
     margin-right: 15px;
 }

 .cate-btn {
     background: #0168A4;
     border: none;
     /* padding: 5px 12px; */
     width: 100%;
     max-width: 132px;
     height: 24px;
     border-radius: 8px;
     margin-right: 5px;
     font-size: 12px;
     font-weight: 400;
     font-family: Inter;
     line-height: 100%;
     color: #ffffff;
     transition: all 0.4s ease-in-out;
 }

 .cate-btn:hover {
     background: #015484;
     transform: scale(1.05)
 }

 .featured-title {
     font-size: 20px;
     font-weight: 600;
     margin: 0;
     font-family: Inter;
     line-height: 100%;
     color: #000000;
 }

 .featured-desc {
     font-size: 12px;
     font-weight: 700;
     font-family: Arial;
     line-height: 160%;
     color: #000000B2;
     margin: 8px 0;
 }

 .read-time {
     font-size: 12px;
     font-weight: 700;
     font-family: Arial;
     line-height: 160%;
     color: #00000080;
     color: #333;
 }

 .post-date {
     font-size: 12px;
     font-weight: 700;
     font-family: Arial;
     line-height: 160%;
     color: #00000080;
 }

 .social-icons i {
     font-size: 16px;
     margin-left: 10px;
     cursor: pointer;
     color: #FE0000;
 }

 .social-icons i:hover {
     color: #0168A4;
     transform: scale(1.5)
 }

 @media (max-width: 575px) {
     .featured-card {
         flex-direction: column;
         text-align: center;
         height: auto;
     }

     .featured-img {
         margin: 0 auto 10px auto;
     }
 }



 /* ================= COMMENT SECTION STYLING ================= */

 .comment-section {
     background: #006A9E1A;
 }

 .comment-heading {
     color: #0168A4;
     font-size: 36px;
     font-weight: 700;
     line-height: 100%;
     font-family: Inter;
 }

 .comment-input {
     border-radius: 10px;
     border: 1px solid #ccc;
     padding: 12px 14px;
     font-size: 24px;
     font-weight: 400;
     line-height: 140%;
     font-family: Inter;
     max-width: 567px;
     height: 71px;
     color: #8B8B8B;
 }

 .comment-textarea {
     border-radius: 15px;
     border: 1px solid #ccc;
     padding: 12px 14px;
     font-size: 24px;
     font-weight: 400;
     line-height: 140%;
     font-family: Inter;
     max-width: 567px;
     height: 118px;
     color: #8B8B8B;

 }

 .comment-input:focus,
 .comment-textarea:focus {
     border-color: #0168A4;
     box-shadow: 0px 0px 5px #0168A450;
 }

 .submitt-btn {
     background: #0168A4;
     color: #FFFFFF;
     width: 145px;
     height: 45px;
     border-radius: 10px;
     font-weight: 600;
     font-size: 20px;
     line-height: 100%;
     transition: all 0.4s ease-in-out;
     margin-top: 20px;
 }

 .submitt-btn:hover {
     background: #004f7a;
     transform: scale(1.06);
     color: #FFFFFF;

 }


 /* ================= RIGHT SIDE COMMENTS BOX ================= */

 .feedback-box {
     background: #F4F4F4;
     width: 567px;
     height: 318px;
     padding: 20px;
     border-radius: 10px;
     overflow-y: auto;
     overflow-x: hidden;
 }





 .single-comment {
     background: #fff;
     width: 518px;
     height: auto;
     border-left: 10px solid #0168A4;
     padding: 2px 15px;
     margin-top: 10px;
 }

 .comment-name {
     font-size: 24px;
     font-weight: 600;
     line-height: 140%;
     font-family: Inter;
     margin-bottom: 4px;
     color: #000000;
 }

 .comment-by {
     font-size: 22px;
     font-weight: 600;
     line-height: 140%;
     font-family: Inter;
     margin-bottom: 4px;
     color: #00000099;
 }


 /* ================= RESPONSIVE ================= */

 @media(max-width: 992px) {
     .comments-box {
         width: 100%;
         height: auto;
     }

     .single-comment {
         width: 100%;
         height: auto;
     }
 }

 @media(max-width: 576px) {
     .submit-btn {
         width: 100%;
     }
 }



 .contact-text a {
     color: #ffffff;
 }

 .contact-text a:hover {
     color: #ffffff;
     /* hover pe bhi white rahe */
 }




 /* ========== brand slider ==================== */

 .brand-slider {
     padding: 30px 0;
     background: #fff;
     overflow: hidden;
     margin-top: 70px;
 }

 /* 👉 Flip container horizontally */
 .swiper {
     /* transform: scaleX(-1); */
 }

 /* 👉 Flip slides back to normal */
 .swiper-slide {
     /* transform: scaleX(-1); */
     display: flex;
     justify-content: center;
     align-items: center;
     padding: 10px;
 }

 .brand-slider img {
     width: 100%;
     height: 120px;
     /* filter: grayscale(100%); */
     /* opacity: 0.8; */
     transition: 0.3s;
 }

 .brand-slider img:hover {
     /* filter: grayscale(0); */
     opacity: 1;
     transform: scale(1.05);

 }

 /* ============= service form ========================= */

 .service-modal-overlay {
     position: fixed;
     /* top: 54%;
     left: 50%;
     transform: translate(-50%, -50%); */
     inset: 0;
     background: rgba(0, 0, 0, 0.3);
     display: none;
     justify-content: center;
     align-items: center;
     z-index: 20000;
     border-radius: 14px;

 }

 .service-modal-overlay.active {
     display: flex;
 }

 /* 🔹 Modal box compact */
 .service-modal-box {
     width: 100%;
     max-width: 480px;
     padding: 20px;
     border-radius: 14px;
     /* background: linear-gradient(135deg, #FFFFFF, #5BC3C4); */
     background: linear-gradient(to right, #66b9e2, #7DAAC0);

     position: relative;
     max-height: 94vh;
     overflow-y: auto;
     scrollbar-width: none;
     /* Firefox */
     -ms-overflow-style: none;

 }

 .service-modal-box::-webkit-scrollbar {
     display: none;
 }

 /* 🔹 Heading compact */
 .service-modal-heading {
     text-align: center;
     margin-bottom: 12px;
     /* kam margin */
     font-size: 20px;
     font-family: 'Poppins', sans-serif;
 }

 /* 🔹 Inputs compact */


 .service-form input,
 .service-form select,
 .service-form textarea {
     width: 100%;
     padding: 8px 10px;
     /* kam padding */
     margin-bottom: 10px;
     /* kam gap */
     border-radius: 6px;
     border: 1px solid #ccc;
     font-size: 14px;
     font-family: 'Poppins', sans-serif;
 }

 .checkbox-group input,
 .radio-group input {
     margin: 0;
     width: 12px;
     height: 12px;
     flex-shrink: 0;
 }

 /* 🔹 Textarea choti */
 .service-form textarea {
     resize: none;
     max-height: 80px;
 }

 /* 🔹 Group spacing reduced */
 .form-group {
     margin-bottom: 8px;
 }

 /* 🔹 Checkbox & radio compact */
 .checkbox-group,
 .radio-group {
     display: flex;
     gap: 15px;
     flex-wrap: wrap;
     margin-top: 15px;
 }

 .checkbox-group label,
 .radio-group label {
     font-size: 11px;
     display: inline-flex;
     align-items: center;
     gap: 5px;
     line-height: 1.3;
     white-space: nowrap;
 }


 /* 🔹 Submit button compact */
 .service-submit-btn {
     width: 100%;
     padding: 10px;
     background: linear-gradient(90deg, #006A9E, #d81212);
     color: #fff;
     border: none;
     border-radius: 6px;
     font-size: 14px;
     cursor: pointer;
     transition: all 0.4s ease;
 }

 .service-submit-btn:hover {
     transform: scale(1.03);
 }

 /* 🔹 Close icon */
 .service-modal-close {
     position: absolute;
     top: 10px;
     right: 10px;

     width: 32px;
     height: 32px;

     display: grid;
     place-items: center;

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

     cursor: pointer;
     color: red;
     border-radius: 50%;
     transition: all 0.3s ease;
 }


 .service-modal-close:hover {
     background-color: #FE0000;
     color: #FFFFFF;
 }

 /*=========================== model css ===================*/

 .buy-form-overlay {
     position: fixed;
     inset: 0;
     /* background: rgba(0, 0, 0, 0.1); */
     display: none;
     justify-content: center;
     align-items: center;
     z-index: 20000;
 }

 .buy-form-overlay.active {
     display: flex;
 }

 .buy-form-box {
     /* background: #fff; */
     background: linear-gradient(90deg, #5aa2c7 0%, #c9cacb 100%);

     width: 100%;
     max-width: 450px;
     padding: 25px;
     border-radius: 12px;
     position: relative;
 }

 .buy-form-box h3 {
     margin-bottom: 20px;
     text-align: center;
     font-weight: 700;
     font-family: 'Poppins';
     font-size: 32px;
     line-height: 100%;
     color: #ffffff;
 }

 /* .buy-form-box h3 span {
     color: #0071A8;

 } */

 .buy-form input,
 .buy-form select,
 .buy-form textarea {
     width: 100%;
     padding: 10px;
     margin-bottom: 12px;
     border-radius: 6px;
     border: 1px solid #ccc;
 }

 .buy-form textarea {
     resize: none;
     height: 80px;
 }

 .buy-form .submit-btn {
     width: 100%;
     background: #006A9E;
     color: #fff;
     padding: 10px;
     border: none;
     border-radius: 6px;
     cursor: pointer;
 }

 .close-form {
     position: absolute;
     top: 10px;
     right: 15px;
     font-size: 24px;
     cursor: pointer;
     width: 40px;
     height: 40px;
     border-radius: 50%;
     background-color: #ebf2f2;
     display: flex;
     align-items: center;
     justify-content: center;
     color: rgb(250, 6, 6);
     transition: all 0.4s ease-in-out;
 }

 .close-form:hover {

     background-color: red;
     color: #ffffff !important;
 }

 .policy-card {
     width: 327px;
     min-height: 258px;
     /* fixed height ki jagah */
     border: 3px solid #076FA1;
     box-shadow: 0px 4px 14.8px #5BC3C4;
     padding: 20px 20px 70px;
     /* bottom space for button */
     border-radius: 30px;
     position: relative;
     margin-top: 30px;
 }


 .policy-card .card-title {
     font-size: 22px;
     font-weight: 700;
     color: #0071A8;
     font-family: Inter;
     margin-bottom: 10px;
     line-height: 100%;
 }

 .policy-card .card-desc {
     font-size: 16px;
     color: #121212B2;
     margin-bottom: 20px;
     text-align: start;
     font-family: Poppins;
     font-weight: 500;
     line-height: 160%;
     max-width: 263px;
 }


 .policy-card .custom-btn {
     display: flex;
     justify-content: center;
     align-items: center;
     background: #0168A4;
     font-size: 18px;
     color: #fff;
     border-radius: 10px;
     text-decoration: none;
     font-weight: 600;
     width: 227px;
     height: 43px;
     box-shadow: 0px 4px 4px #00000040;
     position: absolute;
     bottom: 10px;
     left: 18px;
     font-family: Inter;
     line-height: 100%;

 }


 .custom-btn i {
     margin-left: 12px;
     font-size: 20px;
 }

 .links-heading {
     font-size: 48px;
     font-weight: 600;
     color: #0071A8;
     font-family: Inter;
     margin-bottom: 10px;
     line-height: 48px;
     text-align: center;
 }