.products-hero-section {

            position: relative;
            width: 100%;
            height: 400px; /* Fixed height as per screenshot */
            background-image: url('../images/sh2.png'); 
            background-size: cover;
            background-position: center;
            display: flex;
            align-items: center;
            justify-content: center;
            text-align: center;
            color: white;
            overflow: hidden; /* Ensure content stays within bounds */
            top: -100px;
        }

        .products-hero-overlay {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(0, 0, 0, 0.4); /* Dark overlay as in screenshot */
            z-index: 1;
        }

        .products-hero-content {
            position: relative;
            z-index: 2;
            text-align: left; /* Align text to the left as in screenshot */
            max-width: 1200px; /* Max width to align with container */
            width: 100%;
            padding: 0 15px; /* Bootstrap container padding */
            display: flex;
            flex-direction: column;
            justify-content: center;
            height: 100%; /* Take full height to align content vertically */
            top: 90px;
        }

        .products-hero-overline {
            font-size: 0.9rem;
            font-weight: 500;
            color: #C0D1FF; /* White color */
            letter-spacing: 0.1em;
            text-transform: uppercase;
            margin-bottom: 10px;
            display: flex;
            align-items: center;
            gap: 8px;
            font-weight: bold;
        }
        .products-hero-overline .blue-dot {
            display: inline-block;
            width: 8px;
            height: 8px;
            background-color: #C0D1FF; /* Blue dot */
            border-radius: 50%;
            vertical-align: middle;
        }

        .products-hero-heading {
            font-size: 58px; /* Large heading size */
            font-weight: 600; /* Extra bold */
            line-height: 1.1;
            color: #ffffff; /* White color */
            margin-bottom: 20px;
            width: 51%;
        }

        .products-hero-subheading {
            font-size: 1.25rem; /* Subheading size */
            font-weight: 400; /* Regular weight */
            color: #ffffff; /* White color */
            margin-bottom: 0;
            align-self: flex-end; /* Align to the right as in screenshot */
            margin-left: auto; /* Push to the right */
            /* max-width: 300px; Constrain width for subheading */
            text-align: right; /* Align text within subheading to the right */
            position: relative;
    top: -55px;
        }

        /* Responsive adjustments */
        @media (max-width: 991.98px) { /* Tablet */
            .products-hero-section {
                height: 450px; /* Adjust height for tablet */
            }
            .products-hero-heading {
                font-size: 3.5rem;
            }
            .products-hero-subheading {
                font-size: 1rem;
                max-width: 250px;
            }
            .products-hero-content {
                align-items: flex-start; /* Reset alignment for smaller screens */
                text-align: left;
            }
            .products-hero-subheading {
                align-self: flex-start; /* Reset alignment for smaller screens */
                margin-left: 0;
                text-align: left;
                margin-top: 20px; /* Add space if it wraps below heading */
            }
        }

        @media (max-width: 767.98px) { /* Mobile */
            .products-hero-section {
                height: 350px; /* Adjust height for mobile */
            }
            .products-hero-heading {
                font-size: 2.5rem;
            }
            .products-hero-overline {
                font-size: 0.8rem;
            }
            .products-hero-subheading {
                font-size: 0.9rem;
                max-width: 100%; /* Allow full width on mobile */
                text-align: center; /* Center subheading on mobile */
                margin-left: auto;
                margin-right: auto;
            }
            .products-hero-content {
                text-align: center; /* Center all content on mobile */
                align-items: center;
            }
            .products-hero-overline {
                justify-content: center; /* Center overline content */
            }
        }

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

.prod-page-section { /* Renamed */
            padding: 80px 0;
            background-color: #fff;
        }

        /* Product Grid */
        .prod-page-grid { /* Renamed */
            display: grid;
            grid-template-columns: repeat(2, 1fr); /* 2 columns for desktop */
            gap: 50px; /* Space between product cards */
        }

        .prod-page-card { /* Renamed */
            position: relative;
            height: 400px; /* Fixed height for consistency */
            margin-bottom: 50px;
        }

        .prod-page-image { /* Renamed */
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            object-fit: cover;
            z-index: 1; /* Below the content and overlay */
        }

      

        .prod-page-content { /* Renamed */
            position: absolute; /* Positioned at the bottom */
            bottom: -50px;
            left: 0;
            width: 100%;
            z-index: 2; /* Above image, below overlay */
            padding: 20px;
            text-align: left;
            transition: opacity 0.3s ease; /* Added transition for opacity */
        }

        .prod-page-card:hover .prod-page-content { /* Renamed */
            opacity: 0; /* Make it disappear on hover */
        }

        /* Hover Details Overlay */
        .prod-page-details-overlay { /* Renamed */
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: #8995c4; /* Set to desired opaque blue */
            color: #fff;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            padding: 20px;
            opacity: 0; /* Initially hidden */
            transition: opacity 0.3s ease; /* Only transition opacity */
            text-align: center;
            z-index: 3; /* Above content and image */
        }

        .prod-page-card:hover .prod-page-details-overlay { /* Renamed */
            opacity: 0.7; /* Show on hover */
            color: black;
        }

        .prod-page-title { /* Renamed */
            font-size: 1.5rem;
            font-weight: 700;
            color: #212529; /* Changed to dark for consistency with screenshot */
            margin-bottom: 5px;
            
        }

        .prod-page-subtitle { /* Renamed */
            font-size: 0.9rem;
            color: #6c757d; /* Changed to grey for consistency with screenshot */
            margin-bottom: 0;
        }

        .prod-page-details-title { /* Renamed */
            font-size: 1.8rem;
            font-weight: 800;
            margin-bottom: 10px;
            opacity: 1;
        }

        .prod-page-details-description { /* Renamed */
            font-size: 0.95rem;
            line-height: 1.6;
            margin-bottom: 20px;
            max-width: 80%; /* Constrain text width */
            opacity: 1;
        }

        .prod-page-view-btn { /* Renamed */
            display: inline-flex;
            align-items: center;
            gap: 8px;
            padding: 0.75rem 1.5rem;
            background-color: white; /* White button */
            color: black; /* Blue text */
            border: none;
            border-radius: 0.5rem;
            font-weight: 600;
            text-decoration: none;
            transition: background-color 0.3s ease, color 0.3s ease, transform 0.3s ease;
            opacity: 1;
        }
        .prod-page-view-btn:hover { /* Renamed */
            background-color: black; /* Light blue on hover */
            transform: translateY(-2px);
            color: white;
        }
        .prod-page-view-btn svg { /* Renamed */
            width: 16px;
            height: 16px;
            stroke: currentColor;
            stroke-width: 2;
        }

        /* Responsive adjustments */
        @media (max-width: 991.98px) { /* Tablet */
            .prod-page-grid { /* Renamed */
                grid-template-columns: 1fr; /* Single column on tablet */
                gap: 20px;
            }
            .prod-page-card { /* Renamed */
                height: 350px; /* Adjust height for tablet */
            }
            .prod-page-details-title { /* Renamed */
                font-size: 1.5rem;
            }
            .prod-page-details-description { /* Renamed */
                font-size: 0.9rem;
            }
        }

        @media (max-width: 767.98px) { /* Mobile */
            .prod-page-card { /* Renamed */
                height: 300px; /* Adjust height for mobile */
            }
            .prod-page-content { /* Renamed */
                padding: 15px;
            }
            .prod-page-title { /* Renamed */
                font-size: 1.3rem;
            }
            .prod-page-subtitle { /* Renamed */
                font-size: 0.8rem;
            }
            .prod-page-details-title { /* Renamed */
                font-size: 1.3rem;
            }
            .prod-page-details-description { /* Renamed */
                font-size: 0.85rem;
                max-width: 90%;
            }
            .prod-page-view-btn { /* Renamed */
                padding: 0.6rem 1.2rem;
                font-size: 0.9rem;
            }
        }