/* --- (existing internal CSS kept exactly as before to preserve design) --- */
        /* Universal Box Sizing for better layout consistency */
        *,
        *::before,
        *::after {
            box-sizing: border-box;
        }

        /* Adjusting the base font size for overall scaling */
        html {
            font-size: 15px;
            /* Reduced from browser default 16px to make everything slightly smaller */
        }

        :root {
            --page-background: #ffffff;
            --text-color-default: #212529;
            --text-color-muted: #6c757d;
            --text-color-light: #f8f9fa;
            /* For dark backgrounds like footer */

            --card-background: #ffffff;
            --card-text-color: #212529;

            --section-bg-light: #f8f9fa;
            /* Light grey for sections that were navy */

            --primary-accent-color: #ffc107;
            /* Brighter Yellow */
            --primary-accent-darker: #e0a800;
            --secondary-accent-color: #B29339;
            /* Gold/Brown */

            --border-color: #dee2e6;
            --radius: 0.5rem;
            --font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
            --shadow-sm: 0 .125rem .25rem rgba(0, 0, 0, .075);
            --shadow-md: 0 .5rem 1rem rgba(0, 0, 0, .15);
        }

        body {
            background-color: var(--page-background);
            color: var(--text-color-default);
            font-family: var(--font-family);
            overflow-x: hidden;
        }

        header {
            background: url('../images/banner121.jpg') no-repeat center center/cover;
            min-height: 100vh;
            width: 100%;
            color: #fff;
            display: flex;
            flex-direction: column;
            /* text-align: center; */
            /* Reverted to original behavior where banner content dictates its own alignment */
            position: relative;
        }

        /* Navbar Styles (Removed position: sticky and associated scroll classes) */
        .navbar {
            display: flex;
            justify-content: space-between;
            align-items: center;
            color: white;
            padding: 0.5rem 0rem;
            width: 100%;
            z-index: 1030;
            background-color: transparent;
            transition: background-color 0.3s ease, box-shadow 0.3s ease;
        }

        /* The following styles were related to the 'scrolled' class and are now removed */
        /*
        .navbar.scrolled {
            background-color: var(--page-background);
            box-shadow: var(--shadow-sm);
        }

        .navbar.scrolled .menu li a {
            color: var(--text-color-default);
        }
        .navbar.scrolled .menu li a:hover {
            color: var(--primary-accent-color);
        }
        .navbar.scrolled .hamburger span {
            background-color: var(--text-color-default);
        }
        .navbar.scrolled .contact-info {
            color: var(--secondary-accent-color) !important;
        }
        .navbar.scrolled .contact-info img {
            filter: brightness(0.8);
        }
        */

        .navbar .logo img {
            padding-top: 5px;
            max-height: 70px;
        }

        .navbar .nav-right-container {
            display: flex;
            flex-direction: column;
            align-items: flex-end;
        }

        .navbar .menu {
            display: flex;
            list-style: none;
            margin: 0;
            padding: 0;
        }

        .navbar .menu li {
            margin: 0 1rem;
        }

        .navbar .menu li a {
            color: white;
            text-decoration: none;
            font-size: 1.2rem;
            font-weight: 500;
            transition: color 0.3s ease;
        }

        .navbar .menu li a:hover {
            color: var(--primary-accent-color);
        }

        .navbar .hamburger {
            display: none;
            flex-direction: column;
            cursor: pointer;
            padding: 10px;
        }

        .navbar .hamburger span {
            background-color: white;
            height: 3px;
            width: 25px;
            margin: 3px 0;
            transition: background-color 0.3s ease;
        }

        .contact-info {
            color: var(--primary-accent-color);
            text-decoration: none;
            font-size: 14px;
            padding-right: 1rem;
        }

        .contact-info img {
            vertical-align: middle;
        }


        @media (max-width: 991.98px) {
            .navbar .menu {
                display: none;
                flex-direction: column;
                background-color: #333;
                position: absolute;
                top: 100%;
                left: 0;
                width: 100%;
                padding: 1rem 0;
                box-shadow: var(--shadow-md);
            }

            .navbar .menu.active {
                display: flex;
            }

            .navbar .menu li {
                margin: 0.75rem 0;
                text-align: center;
            }

            .navbar .menu li a {
                color: white;
            }

            .navbar .menu li a:hover {
                color: var(--primary-accent-color);
            }

            .navbar .hamburger {
                display: flex;
            }

            .navbar .nav-right-container {
                align-items: flex-end;
            }

            .contact-info {
                font-size: 12px;
            }
        }

        /* Banner Text Alignment Fix & Original Styles */
        .banner-overlay {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            /*background: rgba(0, 0, 0, 0.55); */
        }

        .banner-content {
            position: absolute;
            /* Original positioning */
            top: 50%;
            left: 10%;
            transform: translateY(-50%);
            z-index: 2;
            /* text-align will be inherited from .banner.text-start */
        }

        .banner-content h1 {
            /* Original styles */
            font-size: 3rem;
            font-weight: bold;
            line-height: 1.2;
        }

        .banner-content p {
            /* Original styles - applies to "Since 2015" p tag */
            font-size: 1.5rem;
            /* Original size */
            margin-top: 1rem;
            /* Original margin */
        }

        /* If you have a specific class for "Since 2015" text, style it here or use the general 'p' above */
        .banner-content p.since-text img {
            /* Style for icon in "Since 2015" */
            height: 25px;
            /* Original icon height */
        }


        .banner-buttons {
            /* Original styles */
            margin-top: 2rem;
        }

        .banner-buttons .btn {
            /* Original styles */
            font-size: 1rem;
            padding: 0.8rem 1.5rem;
            border-radius: 30px;
        }

        .btn-primary {
            /* General primary button style (yellow accent) */
            background-color: var(--primary-accent-color);
            border: none;
            color: var(--text-color-default);
            transition: background-color 0.3s ease;
        }

        .btn-primary:hover {
            background-color: var(--primary-accent-darker);
            color: var(--text-color-default);
        }

        /* Original Banner Responsive Styles */
        @media (max-width: 768px) {
            header {
                background: url('../images/mob-banner.png') no-repeat center center/cover;
                min-height: 100vh;
                /* Adjust height for mobile banner */
                /* height: auto; */
                /* width: 100%; */
            }

            .banner-content {
                left: 5%;
                /* Adjust left position for mobile */
                top: 50%;
                /* Center vertically for mobile */
                transform: translateY(-50%);
            }

            .banner-content h1 {
                font-size: 2rem;
            }

            .banner-content p {
                /* Applies to "Since 2015" */
                font-size: 1.2rem;
            }

            .banner-buttons .btn {
                font-size: 0.9rem;
                padding: 0.6rem 1.2rem;
            }
        }

        @media (max-width: 576px) {
            .banner-content {
                /* Adjust left position if needed for very small screens */
                left: 5%;
            }

            .banner-content h1 {
                font-size: 1.8rem;
            }

            .banner-content p {
                /* Applies to "Since 2015" */
                font-size: 1rem;
            }
        }


        /* Counter Section (Kept from previous enhancement) */
        .counter-section {
            padding: 3rem 0;
        }

        .counter {
            text-align: center;
            border-radius: 10px;
        }

        .counter-count {
            font-size: 2.8em;
            font-weight: bold;
            color: var(--text-color-default);
            display: inline-block;
        }

        .count-up span {
            font-size: 2.8em;
            font-weight: bold;
            color: var(--text-color-default);
            display: inline-block;
            margin-left: 2px;
        }

        .count-text {
            color: var(--text-color-muted);
            font-weight: 500;
            font-size: 1em;
            margin-top: 0.5rem;
        }

        @media (max-width: 768px) {

            .counter-count,
            .count-up span {
                font-size: 1.8em;
                /* Reduced font size for mobile row view */
            }

            .count-text {
                font-size: 0.8em;
                /* Reduced font size for mobile row view */
            }
        }

        /* About Section Styling (Kept from previous enhancement) */
        .about-section {
            padding: 3rem 0;
            background-color: var(--section-bg-light);
        }

        .about-section h2.section-heading {
            font-size: 2.5rem;
            font-weight: bold;
            color: var(--text-color-default);
            margin-bottom: 30px;
            text-align: center;
        }

        .about-section .card {
            border-radius: 15px;
            box-shadow: var(--shadow-md);
            overflow: hidden;
            border: none;
            background-color: var(--card-background);
        }

        .about-section .card-body h4 {
            font-size: 1.6rem;
            font-weight: bold;
            color: var(--text-color-default);
        }

        .about-section .card-body p {
            font-size: 1rem;
            line-height: 1.7;
            color: var(--text-color-muted);
        }

        .about-section .btn-primary {
            font-weight: bold;
            padding: 10px 25px;
        }

        .image-wrapper {
            position: relative;
            overflow: hidden;
            border-radius: 15px;
            height: 100%;
        }

        .image-wrapper img {
            transition: transform 0.4s ease;
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        .image-wrapper:hover img {
            transform: scale(1.08);
        }

        @media (max-width: 768px) {
            .about-section h2.section-heading {
                font-size: 2rem;
            }

            .about-section .card-body h4 {
                font-size: 1.4rem;
            }

            .about-section .card-body p {
                font-size: 0.95rem;
            }

            .about-section .col-md-4 {
                margin-top: 1.5rem;
            }
        }

        /* Blog Section (Kept from previous enhancement) */
        .blog-section {
            padding: 3rem 0;
        }

        .blog-title h2 {
            color: var(--text-color-default);
            font-size: 2.5rem;
            text-align: center;
            font-weight: bold;
            margin-bottom: 2rem;
        }

        .blog-card {
            transition: transform 0.3s ease, box-shadow 0.3s ease;
            border: 1px solid var(--border-color);
            border-radius: var(--radius);
            background-color: var(--card-background);
        }

        .blog-card:hover {
            transform: translateY(-5px);
            box-shadow: var(--shadow-md);
        }

        .blog-card .card-img-top {
            /* height: 250px; Remove or change this */
            object-fit: contain;
            /* Change this */
            width: 100%;
            /* Ensure it takes full width */
            border-top-left-radius: var(--radius);
            border-top-right-radius: var(--radius);
        }

        .blog-card .card-title {
            color: var(--card-text-color);
            font-size: 1.5rem;
            margin-bottom: 0.75rem;
            font-weight: 600;
        }

        .blog-card .card-text {
            color: var(--text-color-muted);
            opacity: 0.9;
            font-size: 0.95rem;
            line-height: 1.6;
        }

        .blog-card .btn-primary {
            background-color: var(--secondary-accent-color);
            border-color: var(--secondary-accent-color);
            color: var(--text-color-light);
            padding: 0.5rem 1.2rem;
            border-radius: var(--radius);
            font-size: 1rem;
            font-weight: 500;
        }

        .blog-card .btn-primary:hover {
            background-color: var(--text-color-light);
            border-color: var(--secondary-accent-color);
            color: var(--secondary-accent-color);
        }

        @media (max-width: 768px) {
            .blog-card .card-img-top {
                /* height: 200px; */
                /* If you want to limit height on mobile, uncomment and adjust */
            }

            .blog-card .card-title {
                font-size: 1.3rem;
            }

            .blog-card .card-text {
                font-size: 0.9rem;
            }
        }

        /* --- Client Section (Slider Container & Customer Logos) - Reverted to Original --- */
        .slider-container-wrapper {
            padding: 3rem 0;
            background: url('../images/blur-bg.jpg') no-repeat center center/cover;
            color: var(--text-color-light);
            background-attachment: fixed;
        }

        .slider-container {
            padding: 20px;
            border-radius: 20px;
        }

        .slider-container p {
            text-align: center;
            padding: 20px;
            font-size: 1.5em;
            color: azure;
        }

        .customer-logos {
            background-color: white;
            border-radius: 15px;
        }

        .slick-slide {
            margin: 0px 20px;
        }

        .slick-slide img {
            width: 100%;
        }

        /* --- End of Client Section Revert --- */

        /* Feature Section (Kept from previous enhancement, if used) */
        .feature-section {
            padding: 3rem 0;
        }

        .feature-section .features-box {
            background-color: transparent;
            padding: 2rem;
            text-align: center;
            transition: all 0.3s;
            border-radius: var(--radius);
        }

        .feature-section .features-icon-border {
            background-color: transparent;
            border-radius: 50%;
            border: 0.2rem solid var(--primary-accent-color);
            margin: 0 auto 1.5rem auto;
            display: inline-block;
        }

        .feature-section .features-box .features-icon {
            height: 7rem;
            width: 7rem;
            background-color: var(--primary-accent-color);
            margin: 15px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .feature-section .features-box .features-icon img {
            width: 3.5rem;
            filter: brightness(0) invert(1);
        }

        .feature-section .features-box h4 {
            margin-top: 1rem;
            color: var(--text-color-default);
            font-size: 1.25rem;
            font-weight: 600;
        }

        .feature-section .features-box:hover {
            background-color: var(--secondary-accent-color);
            box-shadow: var(--shadow-md);
        }

        .feature-section .features-box:hover h4 {
            color: var(--text-color-light);
        }

        .feature-section .features-box:hover .features-icon-border {
            border-color: var(--text-color-light);
        }

        .feature-section .features-box:hover .features-icon {
            background-color: var(--text-color-light);
        }

        .feature-section .features-box:hover .features-icon img {
            filter: none;
        }

        /* --- Product Section - Reverted to Original --- */
        /* Product Section */
        .section-title {
            font-size: 3.5em;
            color: var(--text-color-default);
            /* Changed to use variable for consistency */
        }

        .landing_product_section .product-card:hover {
            transform: scale(1.05);
            box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
        }

        .landing_product_section .product-img {
            position: relative;
        }

        .landing_product_section .product-img img {
            width: 100%;
            height: auto;
            display: block;
        }

        .landing_product_section .product-name {
            position: absolute;
            bottom: 0;
            left: 0;
            right: 0;
            /* background: rgba(0, 0, 0, 0.7); */
            /* Reverted this as per original - it was commented */
            color: var(--text-color-light);
            /* Changed to use variable for consistency on dark background */
            text-align: center;
            padding: 10px;
            font-size: 1.2rem;
            font-weight: bold;
            transition: all 0.3s ease;
        }

        /* Responsive Design */
        @media (max-width: 768px) {
            .landing_product_section .product-name {
                font-size: 1rem;
            }
        }

        /* Product Section Styling */
        .product-container {
            position: relative;
        }

        .product-row {
            display: flex;
            gap: 20px;
            scroll-behavior: smooth;
            overflow-x: auto;
            padding: 10px 0;
        }

        .product-card {
            flex: 0 0 calc(25% - 20px);
            /* 4 items on large screens */
            border: 1px solid var(--border-color);
            /* Using variable */
            border-radius: var(--radius);
            /* Using variable */
            overflow: hidden;
            transition: transform 0.3s ease, box-shadow 0.3s ease;
            background-color: var(--card-background);
            /* Ensure card background is consistent */
            box-shadow: var(--shadow-sm);
            /* Added subtle shadow to cards */
        }

        .product-card:hover {
            transform: translateY(-5px);
            box-shadow: var(--shadow-md);
            /* Stronger shadow on hover */
        }

        .product-card img {
            width: 100%;
            height: 200px;
            object-fit: cover;
        }

        .product-name {
            text-align: center;
            padding: 10px;
            font-weight: bold;
            color: #333;
            /* Kept original for now, as it's on the image */
        }

        /* Updated Scroll Button Styles */
        .scroll-btn {
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            background-color: var(--secondary-accent-color);
            /* Changed to accent color */
            color: var(--text-color-light);
            /* White icon */
            border: none;
            padding: 12px;
            /* Slightly larger padding for better click area */
            border-radius: 50%;
            cursor: pointer;
            z-index: 10;
            transition: background-color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
            /* Added transform and box-shadow to transition */
            box-shadow: var(--shadow-sm);
            /* Added subtle shadow */
        }

        .scroll-btn:hover {
            background-color: var(--primary-accent-color);
            /* Keeps existing hover color */
            transform: translateY(-50%) scale(1.05);
            /* Slight scale on hover */
            box-shadow: var(--shadow-md);
            /* Stronger shadow on hover */
        }

        .left-btn {
            left: -25px;
            /* Adjust position to be visible */
        }

        .right-btn {
            right: -25px;
            /* Adjust position to be visible */
        }

        /* Responsive Design */
        @media (max-width: 768px) {
            .section-title {
                font-size: 2.5em;
                /* Reduced title font size for mobile */
            }

            .product-card {
                flex: 0 0 calc(100% - 20px);
                /* 1 item on small screens */
            }

            .left-btn,
            .right-btn {
                /* display: none; */
                /* This rule is now commented out to show buttons on mobile */
            }

            .left-btn {
                left: 10px;
                /* Repositioned for mobile view */
            }

            .right-btn {
                right: 10px;
                /* Repositioned for mobile view */
            }
        }


        /* Testimonial Section (Kept from previous enhancement) */
        .testimonial-section {
            background: var(--section-bg-light);
            display: flex;
            align-items: center;
            padding: 3rem 0;
        }

        .testimonial-title h2 {
            color: var(--text-color-default);
            font-size: 2.5rem;
            text-align: center;
            font-weight: bold;
            margin-bottom: 2rem;
        }

        .testimonial-card {
            background-color: var(--card-background);
            padding: 2.5rem;
            border-radius: var(--radius);
            box-shadow: var(--shadow-md);
            max-width: 750px;
            margin: 0 auto;
            text-align: center;
            transition: transform 0.3s ease;
            border: 1px solid var(--border-color);
        }

        .testimonial-card:hover {
            transform: translateY(-5px);
        }

        .avatar-wrapper {
            width: 100px;
            height: 100px;
            margin: 0 auto 1.5rem auto;
            border-radius: 50%;
            overflow: hidden;
            box-shadow: var(--shadow-sm);
            border: 3px solid var(--primary-accent-color);
        }

        .avatar {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        .quote-icon {
            color: var(--secondary-accent-color);
            font-size: 1.8rem;
            margin-bottom: 1rem;
        }

        .testimonial-text {
            font-size: 1.1rem;
            font-style: italic;
            color: var(--text-color-muted);
            line-height: 1.7;
            margin-bottom: 1.5rem;
        }

        .client-name {
            color: var(--secondary-accent-color);
            font-weight: 700;
            font-size: 1.1rem;
        }

        .client-designation {
            color: var(--text-color-muted);
            font-size: 0.9rem;
        }

        .carousel-control-prev,
        .carousel-control-next {
            width: 45px;
            height: 45px;
            background-color: var(--secondary-accent-color);
            border-radius: 50%;
            top: 50%;
            transform: translateY(-50%);
            opacity: 0.8;
            transition: opacity 0.3s ease;
        }

        .carousel-control-prev:hover,
        .carousel-control-next:hover {
            opacity: 1;
        }

        .carousel-control-prev-icon,
        .carousel-control-next-icon {
            filter: brightness(0) invert(1);
        }

        .carousel-indicators {
            bottom: -40px;
        }

        .carousel-indicators button {
            width: 10px;
            height: 10px;
            border-radius: 50%;
            background-color: var(--secondary-accent-color);
            opacity: 0.4;
            margin: 0 4px;
            border: none;
        }

        .carousel-indicators button.active {
            opacity: 1;
        }

        @media (max-width: 768px) {
            .testimonial-card {
                padding: 2rem;
            }

            .avatar-wrapper {
                width: 80px;
                height: 80px;
            }

            .testimonial-text {
                font-size: 1rem;
            }
        }

        /* Footer Section (Kept from previous enhancement) */
        .footer-section {
            background-color: #2c3034;
            color: var(--text-color-light);
            padding: 3rem 0 1.5rem 0;
        }

        .footer-logo {
            max-width: 150px;
            height: auto;
            margin-bottom: 1rem;
        }

        .company-desc {
            font-size: 0.95em;
            opacity: 0.8;
            margin-left: 0;
            line-height: 1.6;
        }

        .footer-heading {
            color: var(--primary-accent-color);
            font-weight: 600;
            margin-bottom: 1.5rem;
            font-size: 1.4em;
            text-align: left;
        }

        .footer-links {
            list-style: none;
            padding: 0;
            margin: 0;
            text-align: left;
        }

        .footer-links li {
            margin-bottom: 0.5rem;
        }

        .footer-links a {
            color: rgba(248, 249, 250, 0.8);
            text-decoration: none;
            transition: color 0.3s ease;
            font-size: 0.95em;
        }

        .footer-links a:hover {
            color: var(--primary-accent-color);
        }

        .footer-contact {
            list-style: none;
            padding: 0;
            margin: 0;
            font-size: 0.95em;
            text-align: left;
        }

        .footer-contact li {
            display: flex;
            align-items: center;
            margin-bottom: 0.8rem;
        }

        .footer-contact i {
            margin-right: 10px;
            color: var(--primary-accent-color);
            font-size: 1.1em;
        }

        .newsletter-form input {
            background: rgba(255, 255, 255, 0.08);
            border: 1px solid rgba(255, 255, 255, 0.15);
            color: var(--text-color-light);
            padding: 0.75rem;
        }

        .newsletter-form input::placeholder {
            color: rgba(248, 249, 250, 0.6);
            font-size: 0.95em;
        }

        .newsletter-form .btn {
            background-color: var(--primary-accent-color);
            color: var(--text-color-default);
            border: none;
            padding: 0.75rem;
            width: 100%;
        }

        .newsletter-form .btn:hover {
            background-color: var(--primary-accent-darker);
        }

        .social-links {
            display: flex;
            gap: 1rem;
            justify-content: flex-start;
        }

        .social-icon {
            color: var(--text-color-light);
            font-size: 1.35rem;
            transition: transform 0.3s ease, color 0.3s ease;
        }

        .social-icon:hover {
            color: var(--primary-accent-color);
            transform: translateY(-3px);
        }

        .footer-bottom {
            border-top: 1px solid rgba(255, 255, 255, 0.1);
            padding-top: 1.5rem;
            margin-top: 2rem;
        }

        .footer-legal {
            margin-top: 0.5rem;
        }

        .footer-legal a {
            color: rgba(248, 249, 250, 0.7);
            text-decoration: none;
            font-size: 0.9rem;
            transition: color 0.3s ease;
        }

        .footer-legal a:hover {
            color: var(--primary-accent-color);
        }

        .separator {
            color: rgba(248, 249, 250, 0.4);
            margin: 0 0.5rem;
        }

        @media (max-width: 768px) {
            .footer-section {
                text-align: center;
            }

            .footer-heading,
            .footer-links,
            .footer-contact,
            .social-links {
                text-align: center;
                justify-content: center;
            }

            .footer-logo {
                margin: 0 auto 1rem auto;
            }

            .company-desc {
                margin-left: auto;
                margin-right: auto;
            }

            .footer-contact li {
                justify-content: center;
            }
        }

        /* Fixed WhatsApp Button Styles (Kept from previous enhancement) */
        .whatsapp-fixed-btn {
            position: fixed;
            bottom: 25px;
            right: 25px;
            background-color: #25D366;
            color: white;
            width: 55px;
            height: 55px;
            border-radius: 50%;
            display: flex;
            justify-content: center;
            align-items: center;
            font-size: 28px;
            text-decoration: none;
            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.25);
            z-index: 1000;
            transition: background-color 0.3s ease, transform 0.3s ease;
        }

        .whatsapp-fixed-btn:hover {
            background-color: #1DA851;
            transform: scale(1.08);
        }

        @media (max-width: 576px) {
            .whatsapp-fixed-btn {
                width: 50px;
                height: 50px;
                font-size: 24px;
                bottom: 20px;
                right: 20px;
            }
        }