/*
Theme Name: mytheme
Theme URI: https://wordpress.org/themes/mytheme/
Author: the Muhammad
Author URI: https://wordpress.org
Description: mytheme emphasizes simplicity and adaptability. It offers flexible design options, supported by a variety of patterns for different page types, such as services and landing pages, making it ideal for building personal blogs, professional portfolios, online magazines, or business websites. Its templates cater to various blog styles, from text-focused to image-heavy layouts. Additionally, it supports international typography and diverse color palettes, ensuring accessibility and customization for users worldwide.
Requires at least: 6.7
Tested up to: 6.8
Requires PHP: 7.2
Version: 1.2
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: twentytwentyfive
Tags: one-column, custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, block-patterns, rtl-language-support, sticky-post, threaded-comments, translation-ready, wide-blocks, block-styles, style-variations, accessibility-ready, blog, portfolio, news
*/

/*
 * Link styles
 * https://github.com/WordPress/gutenberg/issues/42319
 */
 /* Ensure the body uses the correct font and handles overflow */
/* Ensure the body uses the correct font and handles overflow */
  /* Base body font and overflow handling */
        body {
            font-family: 'Inter', sans-serif; /* Your preferred font */
            overflow-x: hidden; /* Prevent horizontal scroll */
        }

        
      header {
            position: sticky;
            top: 0;
            left: 0;
            width: 100%;
            z-index: 1000;
            
            background-color: rgba(0, 0, 0, 0.1);
            backdrop-filter: blur(10px);
            
            color: white;

            transition: background-color 0.5s ease, backdrop-filter 0.5s ease, border-bottom-color 0.5s ease, box-shadow 0.5s ease;
        }

        header.scrolled {
            background-color: white;
            backdrop-filter: blur(0);
            /* border-bottom: 1px solid #e0e0e0;
            box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); */
            
            & .navbar-brand {
                color: black !important;
            }

            & .nav-link {
                color: black !important;
            }

            & .btn-schedule-now .text-green {
                color: black !important;
            }
            
            color: black !important;
        }

        /* Header Navbar Specifics */
        .navbar {
            height: 100px; /* Fixed height for the header, adjust as needed */
            padding-top: 0;
            padding-bottom: 0;
        }

        .navbar-collapse,
        .navbar-nav,
        .navbar-nav .nav-item {
            height: 100%; /* Ensure these elements take the full height of their parent */
            display: flex; /* Use flexbox for vertical alignment */
            align-items: center; /* Center content vertically */
        }

        /* Custom hover effect for Bootstrap nav links */
        .navbar-nav .nav-item {
            position: relative; /* Needed for absolute positioning of ::before */
        }

        .navbar-nav .nav-item .nav-link {
            padding: 0.5rem 0.75rem; /* Base padding */
            border-radius: 0.375rem; /* Equivalent to rounded-md */
            position: relative; /* Ensure text is above pseudo-element */
            z-index: 2; /* Ensure text is above ::before */
            transition: color 0.3s ease; /* Transition for text color */
            display: inline-flex; /* Use inline-flex to allow padding and align content */
            align-items: center; /* Center content vertically */
            justify-content: center; /* Center content horizontally */
            height: 100%; /* Make link take full height of its parent .nav-item */
            color: white;
            /* IMPORTANT: Ensure no border or outline in any state */
            border: none !important;
            outline: none !important;
            box-shadow: none !important;
        }

        .navbar-nav .nav-item::before { /* Apply ::before to .nav-item */
            content: '';
            position: absolute;
            top: 0; /* Position at the top of the link */
            left: 0;
            width: 100%;
            height: 0; /* Start with 0 height */
            background-color: #8995c4;
            transition: height 0.3s ease-out; /* Animate height */
            z-index: 1; /* Place behind the text (nav-link has z-index 2) */
         
            /* Ensure no border or outline on the pseudo-element */
            border: none !important;
            outline: none !important;
            box-shadow: none !important;
        }

        /* Default hover height for all nav items */
        .navbar-nav .nav-item:hover::before {
            height: calc(100% + 20px); /* Expand to full height of nav-item + 20px (adjust as needed) */
        }

        /* Specific override for the Home link's nav-item hover height (only cover link's height) */
        #homeDropdown:hover::before {
            height: 100%; /* Only cover the nav-item's height */
        }

        .navbar-nav .nav-item .nav-link:hover {
            color: black !important; /* Darker blue text color on hover */
        }

        /* Ensure dropdown items also have hover effect */
        .dropdown-menu .dropdown-item:hover {
            background-color: #f0f0f0; /* Light gray for dropdown hover */
        }

        /* Custom styling for the dropdown menu itself */
        .dropdown-menu {
            width: 160px; /* Fixed width for the dropdown menu */
        }

        /* Adjust logo font weight and size */
        .navbar-brand {
            margin-right: 50px;
            font-weight: 800; /* Equivalent to font-extrabold */
            font-size: 1.5rem; /* Equivalent to text-2xl */
            color: white; /* Default dark text color */
        }

        /* Custom style for the Schedule Now button */
        .btn-schedule-now {
            position: relative;
            overflow: hidden; /* Crucial for clipping the expanding background */
            z-index: 1;
            transition: color 0.3s ease, transform 0.3s ease-in-out;
            background-color: transparent; /* Button's own background is transparent */
            border-color: transparent; /* Button's own border is transparent */
            color: #1D4ED8; /* Initial text color for the button */
            display: inline-flex;
            align-items: center;
            justify-content: center;
            padding: 0.5rem 1.5rem; /* Adjusted padding to ensure text fits well inside the button */
            min-width: 150px; /* Give it a minimum width for the effect to be clear */
            height: 42px; /* Explicit height for the button to control ::before sizing */
            border-radius: 50px; /* Applied directly as per 'rounded' style */
        }

        /* Styles for the text inside the button */
        .btn-schedule-now .text-green {
            color: white; /* Initial text color as per 'text-green' */
            position: relative; /* Ensure text is above pseudo-element */
            z-index: 2;
        }

        /* Pseudo-element for the expanding background */
        .btn-schedule-now::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            height: 100%; /* Matches button height */
            width: 25%; /* Initial width as per 'rounded' style */
            border-radius: 50px; /* Initial border-radius as per 'rounded' style */
            background-color: #8995c4;
            transform-origin: left center; /* Start expansion from the left */
            transform: scaleX(1); /* Initially visible (not scaled to 0) */
            transition: width 0.4s ease-out; /* Animate width only */
            z-index: -1; /* Behind the text */
        }

        /* Hover state for the button */
        .btn-schedule-now:hover::before {
            width: 100%; /* Expand to full width of the button */
        }

        .btn-schedule-now:hover {
            transform: scale(1.05);
            color: #fff; /* Text white on hover */
        }

        /* Adjust spacing between nav items for desktop */
        @media (min-width: 768px) {
            .navbar-nav .nav-item:not(:last-child) {
                margin-right: 0.5rem; /* Adjust this value to control spacing between links */
            }
        }

        /* Remove default Bootstrap dropdown click behavior on desktop */
        @media (min-width: 768px) {
            .dropdown-toggle::after {
                /* Hide the default caret if you don't want it on hover dropdowns */
                display: none;
            }
        }
/*==============================================================
================================================================
=========================HERO CSS===============================*/

 /* Hero Section - Now takes full viewport height and contains all elements */
        .hero-section {
            position: relative;
            width: 100%;
            height: 100vh; /* Takes full viewport height */
            background-size: cover;
            background-position: center;
            display: flex;
            align-items: center;
            justify-content: center;
            color: white;
            text-align: center;
			top: -100px;
            transition: background-image 0.7s ease-in-out;
        }

        /* Overlay for text readability */
        .hero-section .overlay {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(0, 0, 0, 0.4);
            z-index: 1;
        }

        /* Content (H1 and P) within the hero section */
        .hero-section .content {
            position: relative;
            z-index: 2;
            padding-right: 20%;
            padding-left: 10%;
            text-align: left;
            max-width: 60%; /* Limit width of the main text block */
            /* Add animation for content fading in/out */
            opacity: 1;
            transform: translateY(0);
            transition: opacity 0.5s ease-in-out, transform 0.5s ease-in-out;
        }
        /* Optional: for content fading out/in on slide change, requires JS */
        .hero-section.fading-out .content {
            opacity: 0;
            transform: translateY(-20px);
        }

        .hero-section .content h1 {
            font-size: 3.8em;
            margin-bottom: 15px;
            line-height: 1.2;
            font-weight: 700;
            text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
        }

        .hero-section .content p {
            font-size: 1.4em;
            letter-spacing: 2px;
            font-weight: 300;
        }

        /* Slider Navigation Controls (Arrows) */
        .slider-controls {
            position: absolute;
            right: 30px;
            top: 50%;
            transform: translateY(-50%);
            z-index: 3;
            display: flex;
            flex-direction: column;
            gap: 12px;
        }

        .slider-controls .arrow {
            background-color: rgba(255, 255, 255, 0.15);
            border: 1px solid rgba(255, 255, 255, 0.4);
            color: white;
            width: 45px;
            height: 45px;
            display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            font-size: 1.8em;
            user-select: none;
            transition: background-color 0.3s, border-color 0.3s;
        }

        .slider-controls .arrow:hover {
            background-color: rgba(255, 255, 255, 0.3);
            border-color: rgba(255, 255, 255, 0.8);
        }

        /* Pagination Display within the Hero Section (bottom-left) */
        .slide-pagination-display {
            position: absolute;
            left: 50px;
            bottom: 30px;
            z-index: 3;
            display: flex;
            align-items: flex-end;
            gap: 15px;
            color: white;
            text-shadow: 1px 1px 2px rgba(0,0,0,0.5);
        }

        .slide-pagination-display .current-page-number {
            font-size: 1.5em;
            font-weight: bold;
            letter-spacing: 1px;
        }

        .slide-pagination-display .dots {
            display: flex;
            gap: 6px;
            align-items: center;
        }

        .slide-pagination-display .dot {
            width: 9px;
            height: 9px;
            background-color: rgba(255, 255, 255, 0.5);
            border-radius: 50%;
            transition: background-color 0.3s;
            cursor: pointer;
        }

        .slide-pagination-display .dot.active {
            background-color: white;
        }

        /* Info Box - Now positioned absolutely within hero-section (bottom-right) */
        .info-box {
            position: absolute;
            right: 50px; /* Position from right edge */
            bottom: 30px; /* Position from bottom edge */
            z-index: 3;
            display: flex;
            flex-direction: column;
            align-items: flex-start;
            gap: 12px;
            color: white; /* Changed to white for visibility on slider background */
            max-width: 380px;
            text-shadow: 1px 1px 2px rgba(0,0,0,0.5); /* Shadow for readability */
            background-color: rgba(0,0,0,0.2); /* Slight background to separate it */
            padding: 15px 20px;
            border-radius: 5px;
            /* Optional: Add animation for content fading in/out */
            opacity: 1;
            transform: translateY(0);
            transition: opacity 0.5s ease-in-out, transform 0.5s ease-in-out;
        }
        /* Optional: for content fading out/in on slide change, requires JS */
        .hero-section.fading-out .info-box {
            opacity: 0;
            transform: translateY(20px);
        }


        .info-box p {
            margin: 0;
            font-size: 0.95em;
            line-height: 1.6;
            min-height: 40px; /* Give it a min-height to prevent layout shifts when text changes */
        }

        .about-us-button {
            background-color: transparent;
            border: 1px solid white; /* Changed to white border */
            color: white; /* Changed to white text */
            padding: 10px 18px;
            text-decoration: none;
            font-size: 0.85em;
            font-weight: bold;
            text-transform: uppercase;
            display: flex;
            align-items: center;
            gap: 8px;
            transition: background-color 0.3s, color 0.3s, border-color 0.3s;
        }

        .about-us-button:hover {
            background-color: white; /* Background becomes white on hover */
            color: #333; /* Text becomes dark on hover */
            border-color: white;
        }

        .about-us-button .arrow-right {
            font-size: 1.3em;
            line-height: 1;
        }

        /* Windows Activation Watermark - Still a demo placeholder if desired */
        

/*==============================================================
================================================================
=========================MARQUEE ===============================*/

		.marquee-section {
			top: -100px;
            background-color: #f8f9fa; /* Light background as seen in screenshot */
            padding: 20px 0; /* Vertical padding */
            overflow: hidden; /* Hide content outside the marquee area */
            white-space: nowrap; /* Prevent items from wrapping */
            box-shadow: 0 2px 5px rgba(0,0,0,0.05); /* Subtle shadow */
            position: relative; /* Needed for animation context */
        }

        .marquee-content {
            display: inline-block; /* Allows content to flow horizontally */
            animation: marquee-scroll 30s linear infinite; /* Increased duration for slower speed */
            /* padding-left: 100%; Removed, handled by JS duplication and transform */
            /* Use a CSS variable for dynamic width in animation */
            transform: translateX(0); /* Initial state */
        }

        .marquee-item {
            display: inline-flex; /* Align icon and text */
            align-items: center;
            gap: 8px; /* Adjusted space between icon and text for tighter look */
            font-size: 1.1rem;
            font-weight: 500;
            color: #212529; /* Dark text color */
            margin-right: 60px; /* Space between each item */
            vertical-align: middle; /* Align items vertically */
        }

        .marquee-item svg {
            width: 20px; /* Size of the checkmark icon */
            height: 20px;
            /* The fill and stroke properties are now defined within the SVG path itself
               to accurately replicate the provided SVG. */
            flex-shrink: 0; /* Prevent icon from shrinking */
        }

        /* Keyframe animation for continuous scrolling */
        @keyframes marquee-scroll {
            0% {
                transform: translateX(0%);
            }
            /* Use a CSS variable for the full scroll distance */
            100% {
                transform: translateX(calc(-1 * var(--marquee-width)));
            }
        }

        /* Pause animation on hover (optional) */
        .marquee-content:hover {
            animation-play-state: paused;
        }

        /* Responsive adjustments for smaller screens */
        @media (max-width: 767.98px) {
            .marquee-section {
                padding: 15px 0;
            }
            .marquee-item {
                font-size: 0.9rem;
                gap: 6px; /* Further reduced gap for mobile */
                margin-right: 40px;
            }
            .marquee-item svg {
                width: 18px;
                height: 18px;
            }
            .marquee-content {
                animation-duration: 45s; /* Even slower scroll on smaller screens */
            }
        }
/*==============================================================
================================================================
=========================ABOUT US===============================*/




.about-us-section {
            /* padding: 80px 0; */
            background-color: #fff; /* White background for the section as in screenshot */
        }

        .section-overline {
            font-size: 0.9rem;
            font-weight: 500;
            color: #6c757d;
            letter-spacing: 0.1em;
            text-transform: uppercase;
            margin-bottom: 10px;
            display: flex; /* Use flexbox to align dot and text */
            align-items: center; /* Vertically center dot and text */
            gap: 8px; /* Space between dot and text */
        }
        .section-overline .blue-dot { /* Specific styling for the dot in this section */
            display: inline-block;
            width: 8px; /* Size of the dot */
            height: 8px; /* Size of the dot */
            background-color: #0d6efd; /* Bootstrap primary blue color for the dot */
            border-radius: 50%; /* Make it a circle */
            vertical-align: middle; /* Align with text baseline */
        }

        .section-heading {
            font-size: 3rem;
            font-weight: 800;
            line-height: 1.2;
            color: #212529;
            margin-bottom: 50px; /* Space below heading */
        }

        /* Image Grid */
        .image-grid {
			position: relative;
            display: grid;
            grid-template-columns: 1fr 1fr; /* Two columns */
            gap: 20px; /* Space between images */
            margin-right: 30px; /* Space from the text content */
        }

        .image-grid img {
            width: 100%;
            height: 100%;
            object-fit: cover; /* Ensure images cover the area */
            border-radius: 0.5rem; /* Rounded corners for images */
            box-shadow: 0 5px 15px rgba(0,0,0,0.1); /* Subtle shadow */
        }
        /* Specific image sizing to match screenshot aspect ratios */
        .image-grid img:nth-child(1) { /* Top-left */
            height: 350px; /* Adjust as needed */
        }
        .image-grid img:nth-child(2) { /* Top-right */
            height: 200px; /* Adjust as needed */
        }
        .image-grid img:nth-child(3) { /* Bottom-left */
            height: 200px; /* Adjust as needed */
        }
        .image-grid img:nth-child(4) { /* Bottom-right */
            height: 354px;
			position: absolute;
			max-width: 293px;
			left: 311px;
			bottom: 0;
        }


        /* Tab Navigation */
        .tab-nav {
            display: flex;
            gap: 30px; /* Space between tab items */
            margin-bottom: 25px;
            border-bottom: 1px solid #e9ecef; /* Subtle bottom border for tabs */
            padding-bottom: 10px;
        }

        .tab-nav-item {
            font-size: 1.2rem;
            font-weight: 600;
            color: #6c757d; /* Default tab color */
            cursor: pointer;
            position: relative;
            padding-bottom: 10px; /* Space for the active indicator */
            transition: color 0.3s ease;
        }

        .tab-nav-item.active {
            color: #212529; /* Active tab color */
        }

        .tab-nav-item::after {
            content: '';
            position: absolute;
            left: 0;
            bottom: 0;
            width: 0;
            height: 3px; /* Active indicator height */
            background-color: #0d6efd; /* Active indicator color */
            transition: width 0.3s ease;
        }

        .tab-nav-item.active::after {
            width: 100%; /* Active indicator full width */
        }

        /* Tab Content */
        .tab-content-item {
            display: none; /* Hidden by default */
            animation: fadeIn 0.5s ease-out; /* Fade in animation */
        }

        .tab-content-item.active {
            display: block; /* Show active content */
        }

        .tab-content-item p {
            font-size: 1rem;
            line-height: 1.6;
            color: #495057;
            margin-bottom: 15px;
        }

        .tab-content-item p strong {
            font-weight: 600;
            color: #212529;
        }

        /* Stats Section */
        .stats-section {
            padding-top: 10px; /* Space from tab content */
        }
        .stats-item {
            display: flex;
            flex-direction: column; /* Stack name/percentage and progress bar */
            padding: 10px 0;
            border-bottom: 1px solid #e9ecef;
            font-size: 1rem;
            color: #495057;
        }
        .stats-item:last-child {
            border-bottom: none; /* No border for the last item */
        }
        .stats-item .text-row {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 5px; /* Space between text and progress bar */
        }
        .stats-item .percentage {
            font-weight: 600;
            color: #212529;
        }

        /* Progress Bar Styles */
        .progress-bar-container {
            width: 100%;
            height: 5px; /* Height of the progress bar */
            background-color: #e9ecef; /* Light grey track */
            border-radius: 5px; /* Rounded corners for the track */
            overflow: hidden; /* Hide overflow of the fill */
        }

        .progress-bar-fill {
            height: 100%;
            background-color: #0d6efd; /* Blue fill color */
            border-radius: 5px; /* Rounded corners for the fill */
            transition: width 0.8s ease-out; /* Smooth animation for width change */
        }

        @keyframes fadeIn {
            from { opacity: 0; transform: translateY(10px); }
            to { opacity: 1; transform: translateY(0); }
        }

        /* Responsive adjustments */
        @media (max-width: 991.98px) {
            .image-grid {
                margin-right: 0;
                margin-bottom: 30px;
            }
            .section-heading {
                font-size: 2.5rem;
                margin-bottom: 30px;
            }
        }

        @media (max-width: 767.98px) {
            .image-grid {
                grid-template-columns: 1fr; /* Single column on mobile */
                gap: 15px;
            }
            .section-heading {
                font-size: 2rem;
                text-align: center;
            }
            .section-overline {
                text-align: center;
                justify-content: center; /* Center dot and text on mobile */
            }
            .tab-nav {
                justify-content: center; /* Center tabs on mobile */
                gap: 15px;
            }
            .tab-nav-item {
                font-size: 1rem;
            }
            .tab-content-item p {
                font-size: 0.9rem;
            }
        }

/*==============================================================
================================================================
=========================SERVICES===============================*/


		.services-section {
            padding: 180px 0;
            background-color: #fff; /* White background */
        }

        .section-overline {
            font-size: 0.9rem;
            font-weight: 500;
            color: #6c757d;
            letter-spacing: 0.1em;
            text-transform: uppercase;
            margin-bottom: 10px;
            display: flex;
            align-items: center;
            gap: 8px;
        }
        .section-overline .blue-dot {
            display: inline-block;
            width: 8px;
            height: 8px;
            background-color: #0d6efd;
            border-radius: 50%;
            vertical-align: middle;
        }

        .section-heading {
            font-size: 3rem;
            font-weight: 800;
            line-height: 1.2;
            color: #212529;
            margin-bottom: 20px;
        }

        .services-description {
            font-size: 1rem;
            color: #495057;
            line-height: 1.6;
            margin-bottom: 20px;
        }

        .view-all-services {
            display: inline-flex;
            align-items: center;
            gap: 5px;
            text-decoration: none;
            color: #212529; /* Dark text color */
            font-weight: 600;
            transition: color 0.3s ease;
        }
        .view-all-services:hover {
            color: #0d6efd; /* Blue on hover */
        }
        .view-all-services svg {
            width: 16px;
            height: 16px;
            stroke: currentColor;
            stroke-width: 2;
        }

        /* Service Cards */
        .service-card {
            position: relative;
            border-radius: 0.5rem;
            overflow: hidden; /* Hide overflowing image parts */
            box-shadow: 0 5px 15px rgba(0,0,0,0.1);
            height: 300px; /* Fixed height for consistency as in screenshot */
            display: flex;
            align-items: flex-end; /* Align content to the bottom */
            transition: transform 0.3s ease, box-shadow 0.3s ease;
        }

        .service-card:hover {
            transform: translateY(-5px); /* Slight lift on hover */
            box-shadow: 0 8px 20px rgba(0,0,0,0.15);
        }

        .service-card img {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            object-fit: cover;
            z-index: 1;
        }

        .service-card-overlay {
            position: absolute;
            inset: 0;
            background-color: rgba(0, 0, 0, 0.4); /* Dark overlay for text readability */
            z-index: 2;
        }

        .service-card-content {
            position: absolute;
			left: 70px;
			top: 29px;
			border-radius: 8px 8px 8px 8px;
			padding: 16px 24px 8px 24px;
            z-index: 3;
            color: #fff;
            text-align: left;
            width: 80%; /* Ensure content takes full width */
            background-color: #8BA2C8;
            backdrop-filter: blur(5px); /* Subtle blur for glassmorphism effect */
        }

        .service-card-content h5 {
            font-size: 1rem;
            font-weight: 500;
            margin-bottom: 0.5rem;
            color: rgba(255, 255, 255, 0.8); /* Lighter text for sub-heading */
        }

        .service-card-content h4 {
            font-size: 1.5rem;
            font-weight: 700;
            margin-bottom: 0;
        }

        /* Responsive adjustments */
        @media (max-width: 991.98px) {
            .section-heading {
                font-size: 2.5rem;
            }
            .services-description {
                margin-bottom: 15px;
            }
            .service-card {
                height: 250px; /* Adjust height for smaller screens */
            }
            .service-card-content {
                padding: 1rem;
            }
            .service-card-content h4 {
                font-size: 1.3rem;
            }
        }

        @media (max-width: 767.98px) {
            .section-heading {
                font-size: 2rem;
                text-align: center;
            }
            .section-overline {
                text-align: center;
                justify-content: center;
            }
            .services-description {
                text-align: center;
            }
            .view-all-services {
                justify-content: center;
                margin-top: 20px; /* Space from description */
            }
            .service-card {
                height: 220px;
            }
            .service-card-content h4 {
                font-size: 1.2rem;
            }
            .col-md-6 {
                margin-bottom: 20px; /* Space between cards on mobile */
            }
        }



/*==============================================================
================================================================
=========================WHYCHOOSE US===============================*/




		 .why-choose-us-section {
            padding: 80px 0;
            background-color: #fff;
        }

        .section-overline {
            font-size: 0.9rem;
            font-weight: 500;
            color: #6c757d;
            letter-spacing: 0.1em;
            text-transform: uppercase;
            margin-bottom: 10px;
            display: flex;
            align-items: center;
            gap: 8px;
        }
        .section-overline .blue-dot {
            display: inline-block;
            width: 8px;
            height: 8px;
            background-color: #0d6efd;
            border-radius: 50%;
            vertical-align: middle;
        }

        .section-heading {
            font-size: 3rem;
            font-weight: 800;
            line-height: 1.2;
            color: #212529;
            margin-bottom: 40px; /* Space below heading */
        }

        .section-description {
            font-size: 1rem;
            color: #495057;
            line-height: 1.6;
            margin-bottom: 20px;
            max-width: 400px; /* Constrain width as in screenshot */
        }

        .view-all-services {
            display: inline-flex;
            align-items: center;
            gap: 5px;
            text-decoration: none;
            color: #212529; /* Dark text color */
            font-weight: 600;
            transition: color 0.3s ease;
        }
        .view-all-services:hover {
            color: #0d6efd; /* Blue on hover */
        }
        .view-all-services svg {
            width: 16px;
            height: 16px;
            stroke: currentColor;
            stroke-width: 2;
        }

        /* Feature Cards */
        .feature-card {
            text-align: center;
            padding: 20px;
            margin-top: 50px; /* Space from top content */
        }

        .feature-card .icon-wrapper {
            width: 80px; /* Size of the icon area */
            height: 80px;
            background-color: #e0f2f7; /* Light blue background for icon */
            border-radius: 50%; /* Circular background */
            display: inline-flex;
            align-items: center;
            justify-content: center;
            margin-bottom: 25px; /* Space between icon and title */
        }

        .feature-card .icon-wrapper svg {
            width: 40px; /* Size of the SVG icon inside the circle */
            height: 40px;
            stroke: #0d6efd; /* Blue stroke color for icons */
            stroke-width: 1.5; /* Line thickness */
            fill: none; /* No fill */
            stroke-linecap: round;
            stroke-linejoin: round;
        }

        .feature-card h5 {
            font-size: 1.2rem;
            font-weight: 700;
            color: #212529;
            margin-bottom: 10px;
        }

        .feature-card p {
            font-size: 0.95rem;
            color: #495057;
            line-height: 1.6;
            margin-bottom: 0;
        }

        /* Responsive adjustments */
        @media (max-width: 991.98px) {
            .section-heading {
                font-size: 2.5rem;
            }
            .section-description {
                max-width: 100%;
            }
            .feature-card {
                margin-top: 30px;
            }
        }

        @media (max-width: 767.98px) {
            .section-heading {
                font-size: 2rem;
                text-align: center;
            }
            .section-overline {
                text-align: center;
                justify-content: center;
            }
            .section-description {
                text-align: center;
                margin-left: auto;
                margin-right: auto;
            }
            .view-all-services {
                justify-content: center;
                margin-top: 20px;
            }
            .feature-card {
                margin-top: 20px;
            }
        }

/*==============================================================
================================================================
=========================PRODUCTS SECTION===============================*/


		.products-section {
            padding: 80px 0;
            background-color: #fff; /* White background */
        }

        .section-overline {
            font-size: 0.9rem;
            font-weight: 500;
            color: #6c757d;
            letter-spacing: 0.1em;
            text-transform: uppercase;
            margin-bottom: 10px;
            display: flex;
            align-items: center;
            gap: 8px;
        }
        .section-overline .blue-dot {
            display: inline-block;
            width: 8px;
            height: 8px;
            background-color: #0d6efd;
            border-radius: 50%;
            vertical-align: middle;
        }

        .section-heading {
            font-size: 3rem;
            font-weight: 800;
            line-height: 1.2;
            color: #212529;
            margin-bottom: 20px;
        }

        .products-description {
            font-size: 1rem;
            color: #495057;
            line-height: 1.6;
            margin-bottom: 20px;
            max-width: 400px; /* Constrain width as in screenshot */
        }

        .view-all-products {
            display: inline-flex;
            align-items: center;
            gap: 5px;
            text-decoration: none;
            color: #212529; /* Dark text color */
            font-weight: 600;
            transition: color 0.3s ease;
        }
        .view-all-products:hover {
            color: #0d6efd; /* Blue on hover */
        }
        .view-all-products svg {
            width: 16px;
            height: 16px;
            stroke: currentColor;
            stroke-width: 2;
        }

        /* Product Cards */
        .product-card {
            position: relative;
            border-radius: 0.5rem;
            overflow: hidden; /* Hide overflowing image parts */
            box-shadow: 0 5px 15px rgba(0,0,0,0.05); /* Subtle shadow */
            height: 250px; /* Fixed height for consistency as in screenshot */
            display: flex;
            align-items: flex-end; /* Align content to the bottom */
            transition: transform 0.3s ease, box-shadow 0.3s ease;
            background-color: #f0f2f5; /* Light grey background for cards as in screenshot */
        }

        .product-card:hover {
            transform: translateY(-5px); /* Slight lift on hover */
            box-shadow: 0 8px 20px rgba(0,0,0,0.1);
        }

        .product-card img {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            object-fit: cover;
            z-index: 1;
           
        }

        .product-card-overlay {
            position: absolute;
            inset: 0;
            background-color: rgba(0, 0, 0, 0.3); /* Darker overlay over the image as in screenshot */
            z-index: 2;
        }

        .product-card-content {
            position: relative;
            z-index: 3;
            padding: 1rem; /* Adjusted padding */
            color: #fff;
            text-align: left;
            width: 100%; /* Ensure content takes full width */
           
            
        }

        .product-card-content h5 {
            font-size: 0.9rem; /* Adjusted font size */
            font-weight: 500;
            margin-bottom: 0.2rem; /* Reduced margin */
            color: rgba(255, 255, 255, 0.8); /* Lighter text for sub-heading as in screenshot */
        }

        .product-card-content h4 {
            font-size: 1.2rem; /* Adjusted font size */
            font-weight: 700; /* Bolder as in screenshot */
            margin-bottom: 0;
        }

        /* Responsive adjustments */
        @media (max-width: 991.98px) {
            .section-heading {
                font-size: 2.5rem;
            }
            .products-description {
                max-width: 100%;
            }
            .product-card {
                height: 220px; /* Adjust height for smaller screens */
            }
            .product-card-content {
                padding: 0.8rem;
            }
            .product-card-content h4 {
                font-size: 1.1rem;
            }
        }

        @media (max-width: 767.98px) {
            .section-heading {
                font-size: 2rem;
                text-align: center;
            }
            .section-overline {
                text-align: center;
                justify-content: center;
            }
            .products-description {
                text-align: center;
                margin-left: auto;
                margin-right: auto;
            }
            .view-all-products {
                justify-content: center;
                margin-top: 20px; /* Space from description */
            }
            .product-card {
                height: 200px;
            }
            .product-card-content h4 {
                font-size: 1rem;
            }
            .col-md-6, .col-lg-3 { /* Ensure consistent spacing on mobile */
                margin-bottom: 20px;
            }
        }





/*==============================================================
================================================================
=========================COUNTER===============================*/
        .parallax-counter-section {
            position: relative;
            padding: 100px 0; /* Vertical padding */
            color: #212529; /* Dark text color for readability */
            text-align: center;
            background-image: url('./assets/images/paralex.png'); /* Placeholder for your background image */
            background-size: cover;
            background-position: center;
            background-attachment: fixed; /* Key for parallax effect */
            margin-top: 100px;
        }

        .parallax-overlay {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(255, 255, 255, 0.8); /* Semi-transparent white overlay to lighten background */
            z-index: 1;
        }

        .counter-grid {
            position: relative;
            z-index: 2; /* Ensure content is above overlay */
            display: grid;
            grid-template-columns: repeat(2, 1fr); /* Two columns per row for larger screens */
            gap: 60px; /* Increased space between counter items to match screenshot */
            max-width: 800px; /* Adjusted max width for the grid to match screenshot */
            margin: 0 auto; /* Center the grid */
        }

        .counter-item {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
        }

        .counter-number {
            font-size: 4rem; /* Large number size */
            font-weight: 300; /* Light font weight as in screenshot */
            line-height: 1;
            margin-bottom: 5px; /* Space between number and label */
            color: #212529; /* Dark text color */
        }

        .counter-label {
            font-size: 0.9rem;
            font-weight: 500;
            text-transform: uppercase;
            letter-spacing: 0.1em;
            color: #6c757d; /* Secondary text color */
        }

        /* Responsive adjustments */
        @media (max-width: 767.98px) {
            .parallax-counter-section {
                padding: 60px 0;
            }
            .counter-number {
                font-size: 3rem;
            }
            .counter-label {
                font-size: 0.8rem;
            }
            .counter-grid {
                grid-template-columns: 1fr; /* Stack on mobile */
                gap: 30px;
            }
        }

        @media (max-width: 575.98px) {
            .counter-grid {
                grid-template-columns: 1fr; /* Stack on very small screens */
            }
        }

/*==============================================================
================================================================
=========================METHODOLOGY===============================*/
        
        .methodology-section {
            padding: 80px 0;
            background-color: #fff;
            margin-top: 100px;
        }

        .section-overline {
            font-size: 0.9rem;
            font-weight: 500;
            color: #6c757d;
            letter-spacing: 0.1em;
            text-transform: uppercase;
            margin-bottom: 10px;
            display: flex;
            align-items: center;
            gap: 8px;
        }
        .section-overline .blue-dot {
            display: inline-block;
            width: 8px;
            height: 8px;
            background-color: #0d6efd;
            border-radius: 50%;
            vertical-align: middle;
        }

        .section-heading {
            font-size: 3rem;
            font-weight: 800;
            line-height: 1.2;
            color: #212529;
            margin-bottom: 40px; /* Space below heading */
        }

        .section-description {
            font-size: 1rem;
            color: #495057;
            line-height: 1.6;
            margin-bottom: 20px;
            max-width: 400px; /* Constrain width as in screenshot */
        }

        .get-in-touch-link {
            display: inline-flex;
            align-items: center;
            gap: 5px;
            text-decoration: none;
            color: #212529; /* Dark text color */
            font-weight: 600;
            transition: color 0.3s ease;
        }
        .get-in-touch-link:hover {
            color: #0d6efd; /* Blue on hover */
        }
        .get-in-touch-link svg {
            width: 16px;
            height: 16px;
            stroke: currentColor;
            stroke-width: 2;
        }

        /* Process Steps */
        .process-steps-container {
            display: flex;
            justify-content: space-between;
            align-items: flex-start; /* Align items to the top */
            position: relative;
            margin-top: 50px; /* Space from top content */
            padding: 0 20px; /* Padding to ensure lines don't hit edges on smaller screens */
        }

        /* Connecting Line */
        .process-steps-container::before {
            content: '';
            position: absolute;
            top: 45px; /* Adjust to align with the middle of the number boxes */
            left: 50px; /* Start after the first box */
            right: 50px; /* End before the last box */
            height: 1px;
            background-color: #e0e0e0; /* Light grey line color */
            z-index: 0; /* Behind the steps */
        }

        .process-step {
            flex: 1; /* Distribute space equally */
            display: flex;
            flex-direction: column;
            align-items: center;
            text-align: center;
            position: relative; /* For z-index to be above line */
            z-index: 1;
            padding: 0 15px; /* Padding for text content */
        }

        .step-number-box {
            width: 90px; /* Size of the box */
            height: 90px;
            background-color: #e0f2f7; /* Light blue background */
            border-radius: 0.5rem; /* Rounded corners */
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 2.5rem; /* Large number font size */
            font-weight: 700;
            color: #212529;
            margin-bottom: 30px; /* Space between number box and title */
            box-shadow: 0 4px 10px rgba(0,0,0,0.05); /* Subtle shadow */
        }

        .step-title {
            font-size: 1.1rem;
            font-weight: 700;
            color: #212529;
            margin-bottom: 15px;
        }

        .step-description {
            font-size: 0.95rem;
            color: #495057;
            line-height: 1.6;
            margin-bottom: 0;
        }

        /* Responsive adjustments */
        @media (max-width: 991.98px) {
            .section-heading {
                font-size: 2.5rem;
            }
            .section-description {
                max-width: 100%;
            }
            .process-steps-container {
                flex-wrap: wrap; /* Wrap items on smaller screens */
                justify-content: center;
                padding: 0; /* Remove horizontal padding */
            }
            .process-steps-container::before {
                display: none; /* Hide horizontal line on wrap */
            }
            .process-step {
                flex-basis: 48%; /* Two columns on tablet */
                margin-bottom: 40px; /* Space between wrapped items */
            }
            .process-step:nth-child(odd) {
                margin-right: 4%; /* Space between two columns */
            }
            .process-step:nth-child(even) {
                margin-right: 0;
            }
        }

        @media (max-width: 767.98px) {
            .section-heading {
                font-size: 2rem;
                text-align: center;
            }
            .section-overline {
                text-align: center;
                justify-content: center;
            }
            .section-description {
                text-align: center;
                margin-left: auto;
                margin-right: auto;
            }
            .get-in-touch-link {
                justify-content: center;
                margin-top: 20px;
            }
            .process-step {
                flex-basis: 90%; /* Single column on mobile */
                margin-right: 0 !important; /* Reset margin */
                margin-bottom: 30px; /* Space between stacked items */
            }
        }

/*==============================================================
================================================================
=========================NEWS===============================*/

            .news-section {
                margin-top: 100px;
            padding: 80px 0;
            background-color: #fff;
        }

        .section-overline {
            font-size: 0.9rem;
            font-weight: 500;
            color: #6c757d;
            letter-spacing: 0.1em;
            text-transform: uppercase;
            margin-bottom: 10px;
            display: flex;
            align-items: center;
            gap: 8px;
        }
        .section-overline .blue-dot {
            display: inline-block;
            width: 8px;
            height: 8px;
            background-color: #0d6efd;
            border-radius: 50%;
            vertical-align: middle;
        }

        .section-heading {
            font-size: 3rem;
            font-weight: 800;
            line-height: 1.2;
            color: #212529;
            margin-bottom: 20px;
        }

        .section-description {
            font-size: 1rem;
            color: #495057;
            line-height: 1.6;
            margin-bottom: 30px;
            max-width: 350px; /* Constrain width as in screenshot */
        }

        .view-all-news-btn {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 8px;
            text-decoration: none;
            background-color: #0d6efd; /* Blue background */
            color: #fff; /* White text */
            padding: 12px 25px; /* Button padding */
            border-radius: 0.5rem; /* Rounded corners */
            font-weight: 600;
            transition: background-color 0.3s ease, transform 0.3s ease;
            border: none; /* Remove default button border */
        }
        .view-all-news-btn:hover {
            background-color: #0a58ca; /* Darker blue on hover */
            transform: translateY(-2px); /* Slight lift */
            color: #fff; /* Ensure text stays white */
        }
        .view-all-news-btn svg {
            width: 16px;
            height: 16px;
            stroke: currentColor;
            stroke-width: 2;
        }

        /* Carousel Navigation Arrows */
        .carousel-arrows {
            display: flex;
            align-items: center;
            gap: 15px;
            margin-top: 20px; /* Space from cards */
            justify-content: flex-end; /* Align to the right */
        }
        .carousel-arrow {
            background-color: #fff; /* White background as in screenshot */
            border: none;
            border-radius: 50%;
            width: 45px; /* Size of arrow circle */
            height: 45px;
            display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            transition: background-color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
            box-shadow: 0 2px 5px rgba(0,0,0,0.1); /* Subtle shadow as in screenshot */
        }
        .carousel-arrow:hover {
            background-color: #f0f0f0; /* Slightly darker on hover */
            transform: translateY(-2px);
            box-shadow: 0 4px 8px rgba(0,0,0,0.15);
        }
        .carousel-arrow svg {
            width: 20px;
            height: 20px;
            stroke: #212529; /* Dark stroke for icon as in screenshot */
            stroke-width: 2;
        }

        /* News Cards Container (Viewport) */
        .news-cards-container {
            width: 450px; /* Fixed width to show one card exactly */
            overflow: hidden; /* Hide cards outside this width */
            margin-left: auto; /* Center the container on larger screens */
            margin-right: auto;
        }

        /* News Cards Wrapper (The element that slides) */
        .news-cards-wrapper {
            display: flex;
            gap: 20px; /* Space between cards */
            transition: transform 0.5s ease-in-out; /* Smooth sliding transition */
        }

        /* Individual News Card */
        .news-card {
            flex: 0 0 auto; /* Don't grow, don't shrink, base on content */
            width: 450px; /* Fixed width for cards */
            background-color: #fff;
            border-radius: 0.5rem;
            box-shadow: 0 5px 15px rgba(0,0,0,0.05);
            overflow: hidden;
            transition: transform 0.3s ease, box-shadow 0.3s ease;
        }

        .news-card:hover {
            transform: translateY(-5px);
            box-shadow: 0 8px 20px rgba(0,0,0,0.1);
        }

        .news-card-image {
            position: relative;
            width: 100%;
            height: 250px; /* Fixed height for image area */
            background-size: cover;
            background-position: center;
        }

        .news-card-date {
            position: absolute;
            top: 20px;
            right: 20px;
            background-color: #0d6efd; /* Blue background as in screenshot */
            color: #fff; /* White text */
            padding: 5px 10px;
            border-radius: 0.25rem;
            font-size: 0.85rem;
            font-weight: 600;
        }

        .news-card-content {
            padding: 20px;
            /* No border here, matching screenshot */
        }

        .news-card-category {
            font-size: 0.85rem;
            font-weight: 500;
            color: #6c757d;
            margin-bottom: 10px;
            display: flex;
            align-items: center;
            gap: 5px;
        }
        .news-card-category svg {
            width: 14px;
            height: 14px;
            stroke: currentColor;
            stroke-width: 2;
        }

        .news-card-title {
            font-size: 1.5rem;
            font-weight: 700;
            line-height: 1.3;
            color: #212529;
            margin-bottom: 10px;
        }

        .news-card-description {
            font-size: 0.95rem;
            color: #495057;
            line-height: 1.6;
            margin-bottom: 0;
        }

        /* Responsive adjustments */
        @media (max-width: 1200px) { /* Adjust card width for slightly smaller desktops */
            .news-cards-container,
            .news-card {
                width: 400px; /* Adjust width for smaller screens */
            }
        }

        @media (max-width: 991.98px) { /* Tablet and smaller */
            .section-heading {
                font-size: 2.5rem;
            }
            .section-description {
                max-width: 100%;
            }
            .news-cards-container {
                width: 100%; /* Allow container to take full width */
                margin-left: 0;
                margin-right: 0;
            }
            .news-card {
                width: 350px; /* Smaller card width on tablet */
            }
            .carousel-arrows {
                justify-content: center; /* Center arrows on tablet */
                margin-top: 30px;
            }
        }

        @media (max-width: 767.98px) { /* Mobile */
            .section-heading {
                font-size: 2rem;
                text-align: center;
            }
            .section-overline {
                text-align: center;
                justify-content: center;
            }
            .section-description {
                text-align: center;
                margin-left: auto;
                margin-right: auto;
            }
            .view-all-news-btn {
                width: 100%; /* Full width button on mobile */
                max-width: 250px; /* Max width for button */
                margin-left: auto;
                margin-right: auto;
                display: flex; /* Ensure flex properties apply */
            }
            .news-cards-container {
                width: 90vw; /* Occupy most of the viewport width */
                margin-left: auto;
                margin-right: auto;
            }
            .news-card {
                width: 90vw; /* Card width matches container width */
                flex-shrink: 0; /* Prevent shrinking */
            }
            .news-cards-wrapper {
                gap: 15px; /* Reduced gap on mobile */
            }
            .carousel-arrows {
                margin-top: 20px;
            }
        }




/*==============================================================
================================================================
=========================TESTIMONIALS===========================*/




        .testimonials-section {
            padding: 80px 0;
            background-color: #fff;
        }

        .section-overline {
            font-size: 0.9rem;
            font-weight: 500;
            color: #6c757d;
            letter-spacing: 0.1em;
            text-transform: uppercase;
            margin-bottom: 10px;
            display: flex;
            align-items: center;
            gap: 8px;
        }
        .section-overline .blue-dot {
            display: inline-block;
            width: 8px;
            height: 8px;
            background-color: #0d6efd;
            border-radius: 50%;
            vertical-align: middle;
        }

        .section-heading {
            font-size: 3rem;
            font-weight: 800;
            line-height: 1.2;
            color: #212529;
            margin-bottom: 20px;
        }

        .section-description {
            font-size: 1rem;
            color: #495057;
            line-height: 1.6;
            margin-bottom: 20px;
            max-width: 400px; /* Constrain width as in screenshot */
        }

        .get-in-touch-link {
            display: inline-flex;
            align-items: center;
            gap: 5px;
            text-decoration: none;
            color: #212529; /* Dark text color */
            font-weight: 600;
            transition: color 0.3s ease;
        }
        .get-in-touch-link:hover {
            color: #0d6efd; /* Blue on hover */
        }
        .get-in-touch-link svg {
            width: 16px;
            height: 16px;
            stroke: currentColor;
            stroke-width: 2;
        }

        /* Testimonial Carousel */
        .testimonial-carousel-wrapper {
            display: flex;
            align-items: center;
            justify-content: center;
            margin-top: 50px; /* Space from top content */
            position: relative; /* For pagination dots */
        }

        .testimonial-carousel-container {
            width: 100%; /* Take full width of its parent column */
            overflow: hidden; /* Hide overflowing cards */
        }

        .testimonial-cards-wrapper {
            display: flex;
            gap: 30px; /* Space between testimonial cards */
            transition: transform 0.5s ease-in-out; /* Smooth sliding */
        }

        .testimonial-card {
            flex: 0 0 auto; /* Don't grow, don't shrink */
            width: calc(50% - 15px); /* Two cards per row with gap */
            background-color: #fff;
            padding: 30px;
            border-radius: 0.5rem;
            box-shadow: 0 5px 15px rgba(0,0,0,0.05);
            text-align: left;
        }

        .quote-icon {
            font-size: 4rem; /* Large quote icon */
            color: #e0e0e0; /* Light grey color as in screenshot */
            line-height: 1;
            margin-bottom: 20px;
            display: block; /* Ensure it takes its own line */
        }

        .testimonial-text {
            font-size: 1.1rem;
            line-height: 1.7;
            color: #495057;
            margin-bottom: 25px;
        }

        .reviewer-info {
            display: flex;
            align-items: center;
            gap: 15px;
        }

        .reviewer-avatar {
            width: 50px;
            height: 50px;
            border-radius: 50%;
            object-fit: cover;
            box-shadow: 0 2px 5px rgba(0,0,0,0.1);
        }

        .reviewer-details h6 {
            font-size: 1rem;
            font-weight: 700;
            color: #212529;
            margin-bottom: 0;
        }

        .reviewer-details p {
            font-size: 0.85rem;
            color: #6c757d;
            margin-bottom: 0;
        }

        /* Carousel Navigation Arrows */
        .carousel-arrow {
            background-color: #fff;
            border: none;
            border-radius: 50%;
            width: 45px;
            height: 45px;
            display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            transition: background-color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
            box-shadow: 0 2px 5px rgba(0,0,0,0.1);
            flex-shrink: 0;
        }
        .carousel-arrow:hover {
            background-color: #f0f0f0;
            transform: translateY(-2px);
            box-shadow: 0 4px 8px rgba(0,0,0,0.15);
        }
        .carousel-arrow svg {
            width: 20px;
            height: 20px;
            stroke: #212529;
            stroke-width: 2;
        }

        /* Pagination Dots */
        .carousel-pagination {
            position: absolute;
            bottom: -40px; /* Position below the carousel */
            left: 50%;
            transform: translateX(-50%);
            display: flex;
            gap: 10px;
            margin-top: 20px; /* Space from carousel */
        }

        .pagination-dot {
            width: 8px;
            height: 8px;
            background-color: #e0e0e0; /* Default dot color */
            border-radius: 50%;
            cursor: pointer;
            transition: background-color 0.3s ease;
        }

        .pagination-dot.active {
            background-color: #0d6efd; /* Active dot color */
        }

        /* Responsive adjustments */
        @media (max-width: 1200px) {
            .testimonial-card {
                width: calc(50% - 15px); /* Maintain two cards per row */
            }
        }

        @media (max-width: 991.98px) { /* Tablet and smaller */
            .section-heading {
                font-size: 2.5rem;
            }
            .section-description {
                max-width: 100%;
            }
            .testimonial-carousel-wrapper {
                flex-direction: column; /* Stack arrows and carousel */
                gap: 20px;
            }
            .testimonial-carousel-container {
                width: 100%; /* Take full width */
            }
            .testimonial-cards-wrapper {
                gap: 20px; /* Smaller gap */
            }
            .testimonial-card {
                width: calc(100% - 20px); /* One card per row on tablet, with side padding */
                margin: 0 10px; /* Add horizontal margin for better spacing */
            }
            .carousel-pagination {
                bottom: -30px; /* Adjust pagination position */
            }
        }

        @media (max-width: 767.98px) { /* Mobile */
            .section-heading {
                font-size: 2rem;
                text-align: center;
            }
            .section-overline {
                text-align: center;
                justify-content: center;
            }
            .section-description {
                text-align: center;
                margin-left: auto;
                margin-right: auto;
            }
            .get-in-touch-link {
                justify-content: center;
                margin-top: 20px;
            }
            .testimonial-card {
                width: 90vw; /* Occupy most of the viewport width */
                padding: 20px;
            }
            .testimonial-carousel-container {
                overflow-x: auto; /* Enable horizontal scroll on mobile */
                scroll-snap-type: x mandatory; /* Snap to cards */
                -webkit-overflow-scrolling: touch;
            }
            .testimonial-card {
                scroll-snap-align: start; /* Snap to start of card */
            }
            .testimonial-cards-wrapper {
                gap: 15px; /* Smaller gap on mobile */
                padding: 0 5vw; /* Padding to center cards visually in scroll */
            }
            .carousel-arrow {
                display: none; /* Hide arrows on very small screens if scroll is primary nav */
            }
        }
/*==============================================================
================================================================
=========================FOOTER===============================*/
/* General section padding */
        .footer-main-section {
            padding: 100px 0; /* Increased vertical padding for more space as in screenshot */
            background-color: #fff; /* Ensure white background for the main footer content */
        }

        /* "Let's Get Started" text */
        .text-overline {
            font-size: 0.9rem;
            font-weight: 500;
            color: #6c757d; /* Bootstrap secondary color */
            letter-spacing: 0.1em;
            text-transform: uppercase;
            margin-bottom: 15px; /* Adjusted margin */
            display: flex; /* Use flexbox to align dot and text */
            align-items: center; /* Vertically center dot and text */
            gap: 8px; /* Space between dot and text */
        }
        .blue-dot {
            display: inline-block;
            width: 8px; /* Size of the dot */
            height: 8px; /* Size of the dot */
            background-color: #0d6efd; /* Bootstrap primary blue color for the dot */
            border-radius: 50%; /* Make it a circle */
            vertical-align: middle; /* Align with text baseline */
        }

        .heading-main {
            font-size: 3.2rem; /* Adjusted for larger visual impact */
            font-weight: 800; /* Extra bold */
            line-height: 1.2;
            color: #212529; /* Dark text */
            margin-bottom: 20px;
			width: 60%;
        }

        .description-text {
            font-size: 1rem;
            color: #495057; /* Slightly lighter dark text */
            max-width: 480px; /* Adjusted max-width for better line breaks */
            margin-bottom: 40px; /* Adjusted margin */
        }

        /* Custom style for the footer's Schedule Now button */
        .btn-footer-cta { /* Renamed class */
            /* Using Bootstrap's default .btn-primary styles */
            background-color: #0d6efd; /* Bootstrap primary blue */
            border-color: #0d6efd; /* Bootstrap primary blue */
            color: #fff; /* White text */
            font-weight: 600; /* Semi-bold */
            padding: 0.75rem 2rem; /* Larger padding for a more prominent button */
            border-radius: 0.5rem; /* Slightly rounded corners */
            transition: background-color 0.3s ease, border-color 0.3s ease, transform 0.3s ease;
            display: inline-flex;
            align-items: center;
            gap: 8px; /* Space between text and icon */
        }
        .btn-footer-cta:hover { /* Renamed class */
            background-color: #0a58ca; /* Darker blue on hover */
            border-color: #0a58ca; /* Darker blue on hover */
            transform: translateY(-2px); /* Slight lift effect */
            box-shadow: 0 4px 8px rgba(0,0,0,0.1); /* Subtle shadow on hover */
        }
        .btn-footer-cta svg { /* Renamed class */
            width: 18px; /* Size of the arrow icon */
            height: 18px;
            stroke: currentColor; /* Inherit color from button text */
            stroke-width: 2;
        }


        /* Contact Information Styling */
        .contact-info-block {
            margin-bottom: 30px; /* Adjusted margin between blocks */
        }
        .contact-info-block h6 {
            font-size: 1rem;
            font-weight: 600;
            color: #6c757d;
            margin-bottom: 8px; /* Adjusted margin */
        }
        .contact-info-block p,
        .contact-info-block a {
            font-size: 1.1rem;
            font-weight: 500;
            color: #212529;
            text-decoration: none;
            transition: color 0.3s ease;
        }
        .contact-info-block a:hover {
            color: #0d6efd; /* Bootstrap primary blue */
        }

        /* Copyright Section */
        .copyright-section {
            background-color: #f8f9fa; /* Light background for copyright */
            padding: 20px 0;
            font-size: 0.9rem;
            color: #6c757d;
            text-align: center;
            border-top: 1px solid #e9ecef; /* Subtle top border */
        }

        /* Responsive adjustments */
        @media (max-width: 767.98px) {
            .heading-main {
                font-size: 2.5rem; /* Smaller heading on mobile */
            }
            .footer-main-section {
                padding: 60px 0;
                text-align: center; /* Center content on mobile */
            }
            .description-text {
                max-width: 100%; /* Full width on mobile */
                margin-left: auto;
                margin-right: auto;
            }
            .contact-info-block {
                text-align: center; /* Center contact info on mobile */
            }
            .text-overline {
                justify-content: center; /* Center dot and text on mobile */
            }
        }


