/* Home Page Center Fix - Auto Fit for All Screen Sizes */

/* Ensure all containers are centered */
.hero-slider-wrapper,
.why-choose-us-container,
.clean-energy-section,
.service-solutions-section,
.our-expert-container,
.how-it-works-section,
.projects-container,
.testimonial-container,
.latest-news-container {
    width: 100%;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
}

/* Inner containers should be centered with max-width */
.hero-container,
.why-choose-us-container,
.clean-energy-container,
.service-solutions-container,
.our-expert-container > *,
.how-it-works-container,
.projects-container > *,
.testimonial-container > *,
.latest-news-container > * {
    max-width: 1320px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 20px;
    padding-right: 20px;
}

/* Why Choose Us Section */
.why-choose-us-container {
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 20px;
}

/* Clean Energy Section */
.clean-energy-container {
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 20px;
}

/* Service Solutions */
.service-solutions-container {
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 20px;
}

.service-container-main {
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 20px;
}

/* Our Expert Section */
.our-expert-container {
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 20px;
}

.our-expert-grid-container {
    max-width: 1320px;
    margin: 0 auto;
}

/* How It Works Section */
.how-it-works-container {
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 20px;
}

.how-it-works-grid-container {
    max-width: 1320px;
    margin: 0 auto;
}

/* Projects/Gallery Section */
.projects-container {
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 20px;
}

.projects-slider {
    max-width: 1320px;
    margin: 0 auto;
}

/* Testimonials Section */
.testimonial-container {
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* Latest News Section */
.latest-news-container {
    max-width: 1320px;
    margin: 0 auto;
    padding: 0 20px;
}

.masonry-grid {
    max-width: 1320px;
    margin: 0 auto;
}

/* Responsive - Tablets */
@media (max-width: 1024px) {
    .hero-container,
    .why-choose-us-container,
    .clean-energy-container,
    .service-solutions-container,
    .our-expert-container,
    .how-it-works-container,
    .projects-container,
    .testimonial-container,
    .latest-news-container {
        max-width: 100%;
        padding-left: 30px;
        padding-right: 30px;
    }
}

/* Responsive - Mobile */
@media (max-width: 768px) {
    .hero-container,
    .why-choose-us-container,
    .clean-energy-container,
    .service-solutions-container,
    .our-expert-container,
    .how-it-works-container,
    .projects-container,
    .testimonial-container,
    .latest-news-container {
        padding-left: 20px;
        padding-right: 20px;
    }
}

@media (max-width: 480px) {
    .hero-container,
    .why-choose-us-container,
    .clean-energy-container,
    .service-solutions-container,
    .our-expert-container,
    .how-it-works-container,
    .projects-container,
    .testimonial-container,
    .latest-news-container {
        padding-left: 15px;
        padding-right: 15px;
    }
}

/* Ensure body and html don't cause overflow */
body, html {
    overflow-x: hidden;
    width: 100%;
}

/* Main content wrapper */
body > * {
    max-width: 100%;
    overflow-x: hidden;
}
/* ========================================
   HOME PAGE - PREMIUM SPACING & LAYOUT
   ======================================== */

/* ========== SECTION SPACING SYSTEM ========== */

/* Hero Section - No top padding (starts at top) */
.hero-slider-wrapper {
    padding: 0;
    margin-bottom: 80px; /* Space after hero */
}

/* Why Choose Us Section */
.why-choose-us-container {
    padding: 80px 40px;
    margin-bottom: 80px;
    background: #ffffff;
}

/* Clean Energy Section (Who We Are) */
.clean-energy-section {
    padding: 100px 40px;
    margin-bottom: 80px;
    background: linear-gradient(135deg, #f8fef5 0%, #ffffff 100%);
}

.clean-energy-container {
    max-width: 1320px;
    margin: 0 auto;
}

/* Service Solutions Section (Our Products) */
.service-solutions-section {
    padding: 100px 40px;
    margin-bottom: 80px;
    background: #ffffff;
}

.service-solutions-container {
    max-width: 1320px;
    margin: 0 auto;
}

.service-container-main {
    max-width: 1320px;
    margin: 60px auto 0;
    padding: 0 40px;
}

/* Our Expert/Services Section */
.our-expert-container {
    padding: 100px 40px;
    margin-bottom: 80px;
    background: linear-gradient(135deg, #f0fff4 0%, #ffffff 100%);
}

.our-expert-grid-container {
    max-width: 1320px;
    margin: 60px auto 0;
    gap: 40px; /* Space between service cards */
}

/* How It Works Section */
.how-it-works-section {
    padding: 100px 40px;
    margin-bottom: 80px;
    background: #ffffff;
}

.how-it-works-container {
    max-width: 1320px;
    margin: 0 auto;
}

.how-it-works-grid-container {
    max-width: 1320px;
    margin: 60px auto 0;
    gap: 40px; /* Space between steps */
}

/* Projects/Gallery Section */
.projects-container {
    padding: 100px 40px;
    margin-bottom: 80px;
    background: linear-gradient(135deg, #f8fef5 0%, #ffffff 100%);
}

.projects-slider {
    max-width: 1320px;
    margin: 60px auto 0;
}

/* Testimonials Section */
.testimonial-container {
    padding: 100px 40px;
    margin-bottom: 80px;
    background: #ffffff;
}

/* Latest News Section */
.latest-news-container {
    padding: 100px 40px 120px;
    margin-bottom: 0; /* Last section */
    background: linear-gradient(135deg, #f0fff4 0%, #ffffff 100%);
}

.masonry-grid {
    max-width: 1320px;
    margin: 60px auto 0;
    gap: 30px; /* Space between blog cards */
}

/* ========== SECTION TITLE SPACING ========== */

/* Add space below section titles */
.why-choose-us-container h2,
.clean-energy-section h2,
.service-solutions-section h2,
.our-expert-container h2,
.how-it-works-section h2,
.projects-container h2,
.testimonial-container h2,
.latest-news-container h2 {
    margin-bottom: 50px;
    margin-top: 0;
    padding-top: 0;
}

/* Common title (subtitle) spacing */
.common-title {
    margin-bottom: 20px;
    margin-top: 0;
}

/* ========== CARD & ELEMENT SPACING ========== */

/* Service Cards Spacing */
.service-solutions-card {
    margin-bottom: 30px;
}

/* Expert Grid Cards */
.our-expert-grid-card {
    margin-bottom: 40px;
}

/* How It Works Steps */
.how-it-works-grid-box {
    padding: 40px 30px;
    margin-bottom: 30px;
}

/* Projects/Gallery Items */
.projects-card {
    margin: 15px;
}

/* Blog Cards */
.latest-news-grid-card {
    margin-bottom: 30px;
}

/* ========== INNER CONTENT SPACING ========== */

/* Why Choose Us - Text & Image Gap */
.why-choose-us-left-container {
    margin-right: 60px;
}

.why-choose-us-right-container {
    padding: 20px 0;
}

.why-choose-us-right-container p {
    margin-bottom: 10px;
    line-height: 1.5;
    font-size: 14px;
}

/* Clean Energy Cards Gap */
.clean-energy-financial-savings {
    padding: 40px 30px;
    margin-bottom: 30px;
}

.clean-energy-left-container {
    margin-right: 60px;
}

/* Service Solutions Top Section */
.service-solutions-top-container {
    margin-bottom: 60px;
}

.service-solutions-top-left-container h2 {
    margin-bottom: 20px;
}

/* Our Expert Paragraph */
.our-expert-para1 {
    margin-bottom: 40px;
    padding: 0 20px;
    line-height: 1.8;
}

/* How It Works Paragraph */
.how-it-works-para2 {
    margin-bottom: 60px;
    padding: 0 20px;
    line-height: 1.8;
}

/* Testimonial Content Spacing */
.testimonial-right-top-container {
    margin-bottom: 50px;
}

.testimonial-right-top-content {
    margin-bottom: 40px;
}

.testimonial-para2 {
    margin-top: 30px;
    line-height: 1.8;
}

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

/* Large Desktops (1440px+) */
@media (min-width: 1440px) {
    .why-choose-us-container,
    .clean-energy-section,
    .service-solutions-section,
    .our-expert-container,
    .how-it-works-section,
    .projects-container,
    .testimonial-container,
    .latest-news-container {
        padding-left: 60px;
        padding-right: 60px;
    }
}

/* Tablets (768px - 1024px) */
@media (max-width: 1024px) {
    /* Reduce section padding */
    .why-choose-us-container,
    .clean-energy-section,
    .service-solutions-section,
    .our-expert-container,
    .how-it-works-section,
    .projects-container,
    .testimonial-container,
    .latest-news-container {
        padding: 60px 30px;
        margin-bottom: 60px;
    }

    /* Reduce gaps */
    .why-choose-us-left-container {
        margin-right: 40px;
    }

    .clean-energy-left-container {
        margin-right: 40px;
    }

    /* Smaller title spacing */
    h2 {
        margin-bottom: 40px;
    }
}

/* Mobile (481px - 768px) */
@media (max-width: 768px) {
    /* Smaller section padding */
    .why-choose-us-container,
    .clean-energy-section,
    .service-solutions-section,
    .our-expert-container,
    .how-it-works-section,
    .projects-container,
    .testimonial-container,
    .latest-news-container {
        padding: 50px 20px;
        margin-bottom: 50px;
    }

    /* Stack elements vertically */
    .why-choose-us-left-container,
    .clean-energy-left-container {
        margin-right: 0;
        margin-bottom: 40px;
    }

    /* Smaller gaps */
    .our-expert-grid-container,
    .how-it-works-grid-container {
        gap: 30px;
        margin-top: 40px;
    }

    h2 {
        margin-bottom: 30px;
    }
}

/* Small Mobile (up to 480px) */
@media (max-width: 480px) {
    /* Minimal padding for small screens */
    .why-choose-us-container,
    .clean-energy-section,
    .service-solutions-section,
    .our-expert-container,
    .how-it-works-section,
    .projects-container,
    .testimonial-container,
    .latest-news-container {
        padding: 40px 15px;
        margin-bottom: 40px;
    }

    /* Smaller gaps */
    .our-expert-grid-container,
    .how-it-works-grid-container {
        gap: 20px;
        margin-top: 30px;
    }

    /* Smaller card spacing */
    .clean-energy-financial-savings,
    .how-it-works-grid-box {
        padding: 30px 20px;
        margin-bottom: 20px;
    }

    h2 {
        margin-bottom: 25px;
    }

    .projects-card {
        margin: 10px;
    }
}

/* ========== PREMIUM VISUAL ENHANCEMENTS ========== */

/* Subtle section dividers */
.clean-energy-section::before,
.our-expert-container::before,
.projects-container::before,
.latest-news-container::before {
    content: '';
    display: block;
    height: 2px;
    width: 80px;
    background: linear-gradient(90deg, #5a8716 0%, #7ab82d 100%);
    margin: 0 auto 40px;
    border-radius: 2px;
}

/* Section fade-in effect (optional - already have AOS) */
.why-choose-us-container,
.clean-energy-section,
.service-solutions-section,
.our-expert-container,
.how-it-works-section,
.projects-container,
.testimonial-container,
.latest-news-container {
    opacity: 1;
    animation: fadeInSection 0.8s ease-in-out;
}

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

/* Add breathing room to paragraphs */
p {
    line-height: 1.8;
    margin-bottom: 20px;
}

/* Button spacing */
.get-a-quote-btn,
.our-services-btn,
.contact-us-today {
    margin-top: 30px;
    margin-bottom: 20px;
}

/* ========== CENTERING SYSTEM ========== */

/* Ensure all containers are centered */
.hero-slider-wrapper,
.why-choose-us-container,
.clean-energy-section,
.service-solutions-section,
.our-expert-container,
.how-it-works-section,
.projects-container,
.testimonial-container,
.latest-news-container {
    width: 100%;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
}

/* Inner containers max-width */
.hero-container,
.clean-energy-container,
.service-solutions-container,
.service-container-main,
.how-it-works-container,
.projects-slider,
.masonry-grid {
    max-width: 1320px;
    margin-left: auto;
    margin-right: auto;
}

/* Prevent horizontal overflow */
body, html {
    overflow-x: hidden;
    width: 100%;
}

body > * {
    max-width: 100%;
    overflow-x: hidden;
}

/* ========== SUMMARY ========== */
/*
This CSS file provides:
1. ✅ Consistent 80-100px spacing between sections
2. ✅ Professional padding within sections (100px top/bottom)
3. ✅ Proper gaps between cards and elements (30-40px)
4. ✅ Alternating background colors for visual separation
5. ✅ Responsive spacing that adapts to screen size
6. ✅ Premium visual enhancements
7. ✅ Centered layout with max-width 1320px
8. ✅ Breathing room for all text content
9. ✅ Consistent spacing system across entire page
10. ✅ Mobile-optimized spacing
*/
/* ========================================
   HOME PAGE - FINAL COMPREHENSIVE FIXES
   Fixes: Spacing, Text Visibility, Centering
   ======================================== */

/* ========== FIX 1: EXCESSIVE SPACING BETWEEN SECTIONS ========== */

/* Reduce excessive spacing between sections */
.hero-slider-wrapper {
    margin-bottom: 50px !important; /* Was 80px */
}

.why-choose-us-container {
    padding: 60px 40px !important; /* Was 80px */
    margin-bottom: 50px !important; /* Was 80px */
}

.clean-energy-section {
    padding: 70px 40px !important; /* Was 100px */
    margin-bottom: 50px !important; /* Was 80px */
}

.service-solutions-section {
    padding: 70px 40px !important; /* Was 100px */
    margin-bottom: 50px !important; /* Was 80px */
}

.our-expert-container {
    padding: 70px 40px !important; /* Was 100px */
    margin-bottom: 50px !important; /* Was 80px */
}

.how-it-works-section {
    padding: 70px 40px !important; /* Was 100px */
    margin-bottom: 50px !important; /* Was 80px */
}

.projects-container {
    padding: 70px 40px !important; /* Was 100px */
    margin-bottom: 50px !important; /* Was 80px */
}

.testimonial-container {
    padding: 70px 40px !important; /* Was 100px */
    margin-bottom: 50px !important; /* Was 80px */
}

.latest-news-container {
    padding: 70px 40px 80px !important; /* Was 100px 40px 120px */
    margin-bottom: 0 !important;
}

/* ========== FIX 2: WHITE TEXT ON WHITE BACKGROUND ========== */

/* Service Solutions Section (Our Products) - Fix white text */
.service-solutions-top-left-container h2 {
    color: #000000 !important; /* Was white rgba(255, 255, 255, 1) */
    font-weight: 700 !important;
}

.service-solutions-top-right-container p {
    color: #333333 !important; /* Was white rgba(255, 255, 255, 1) */
    font-weight: 400 !important;
}

/* Ensure all section titles are dark colored */
h2 {
    color: #000000 !important;
}

h3 {
    color: #222222 !important;
}

p {
    color: #333333 !important;
}

/* Common title visibility */
.common-title {
    color: #34530a !important; /* Keep green for accent */
}

/* Lead text visibility */
.lead {
    color: #333333 !important;
}

/* ========== FIX 3: CENTER ALIGNMENT FOR ALL SECTIONS ========== */

/* Force all sections to be centered */
.why-choose-us-container,
.clean-energy-section,
.service-solutions-section,
.our-expert-container,
.how-it-works-section,
.projects-container,
.testimonial-container,
.latest-news-container {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
}

/* Center section titles */
.why-choose-us-container h2,
.clean-energy-section h2,
.service-solutions-section h2,
.our-expert-container h2,
.how-it-works-section h2,
.projects-container h2,
.testimonial-container h2,
.latest-news-container h2 {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    width: 100% !important;
}

/* Center common titles (subtitles) */
.common-title {
    text-align: center !important;
    width: 100% !important;
}

/* Why Choose Us - Center content */
.why-choose-us-container {
    flex-direction: row !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 40px !important;
}

.why-choose-us-left-container {
    flex: 0 0 auto !important;
    text-align: center !important;
}

.why-choose-us-right-container {
    flex: 1 !important;
    max-width: 600px !important;
    text-align: left !important;
}

/* Clean Energy - Center grid */
.clean-energy-container {
    display: flex !important;
    justify-content: center !important;
    align-items: flex-start !important;
    gap: 60px !important;
    max-width: 1320px !important;
    margin: 0 auto !important;
}

.clean-energy-left-container {
    flex: 0 0 auto !important;
}

.clean-energy-right-container {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)) !important;
    gap: 30px !important;
    flex: 1 !important;
}

/* Service Solutions - Center content */
.service-solutions-top-container {
    text-align: center !important;
    max-width: 1320px !important;
    margin: 0 auto 0px !important; /* Removed all bottom margin */
    padding-bottom: 0px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
}

.service-solutions-top-left-container {
    width: 100% !important;
    text-align: center !important;
    margin-bottom: 0px !important;
    padding-bottom: 0px !important;
}

.service-container-main {
    max-width: 1320px !important;
    margin: 0 auto !important;
}

/* Our Expert/Services - Center grid */
.our-expert-container {
    text-align: center !important;
}

.our-expert-grid-container {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 30px !important;
    max-width: 1320px !important;
    margin: 60px auto 0 !important;
    justify-content: center !important;
}

/* How It Works - Center grid */
.how-it-works-container {
    max-width: 1320px !important;
    margin: 0 auto !important;
    text-align: center !important;
}

.how-it-works-grid-container {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)) !important;
    gap: 30px !important;
    max-width: 1320px !important;
    margin: 60px auto 0 !important;
    justify-content: center !important;
}

.how-it-works-grid-box {
    text-align: center !important;
    background: #ffffff !important;
    border: 2px solid #34530a !important; /* Green border for good framing */
    border-radius: 12px !important;
    padding: 10px 6px 5px !important; /* Added bottom padding back: 5px */
    box-shadow: 0 3px 15px rgba(52, 83, 10, 0.1) !important; /* Green-tinted shadow */
    transition: all 0.3s ease !important;
    margin-bottom: 0 !important;
    position: relative !important;
    overflow: hidden !important;
}

/* Remove the green gradient top bar to reduce height */
.how-it-works-grid-box::before {
    display: none !important;
    content: none !important;
}

.how-it-works-grid-box:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 6px 25px rgba(52, 83, 10, 0.2) !important;
    border-color: #5a8716 !important;
}

/* Style the Step text */
.how-it-works-grid-box .step-text {
    background: linear-gradient(135deg, #34530a 0%, #5a8716 100%) !important; /* Gradient badge */
    color: white !important;
    padding: 1px 6px !important;
    border-radius: 12px !important;
    font-size: 9px !important;
    font-weight: 600 !important;
    display: inline-block !important;
    margin-bottom: 2px !important;
    margin-top: 8px !important; /* INCREASED from 3px - move Step badge down more */
    text-transform: uppercase !important;
    letter-spacing: 0.3px !important;
}

/* Style the step image - SQUARE shape - FORCE OVERRIDE */
.how-it-works-grid-box img,
.how-it-works-grid-box .br-50,
.how-it-works-grid-box img.br-50,
.how-it-works-grid-box .how-it-works-square-img {
    margin: 4px auto 2px auto !important; /* Top 4px, bottom 2px - image moved down */
    display: block !important;
    border: 2px solid #e8f5e0 !important;
    box-shadow: 0 2px 8px rgba(52, 83, 10, 0.1) !important;
    border-radius: 8px !important; /* SQUARE with slight corner radius - NOT round */
    object-fit: cover !important;
}

/* OVERRIDE .br-50 round class for How We Operate images ONLY */
.how-it-works-grid-box .br-50 {
    border-radius: 8px !important; /* FORCE square - override 50% round */
}

.how-it-works-grid-box h3 {
    margin: 1px 0 1px !important; /* Reduced from 2px 0 1px */
    font-size: 13px !important; /* Reduced from 14px */
    font-weight: 700 !important;
    color: #000000 !important;
}

.how-it-works-grid-box-para {
    font-size: 10px !important;
    line-height: 1.2 !important;
    color: #555555 !important;
    margin: 0 0 3px 0 !important; /* Added bottom margin back: 3px */
    padding: 0 4px 0px !important;
}

/* Projects/Gallery - Center slider */
.projects-container {
    text-align: center !important;
}

.projects-slider {
    max-width: 1320px !important;
    margin: 60px auto 0 !important;
}

/* Latest News - Center grid */
.latest-news-container {
    text-align: center !important;
}

.masonry-grid {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 30px !important;
    max-width: 1320px !important;
    margin: 60px auto 0 !important;
}

/* ========== FIX 4: INNER CONTENT SPACING ========== */

/* Reduce title bottom margins */
h2 {
    margin-bottom: 30px !important; /* Was 50px */
}

.common-title {
    margin-bottom: 15px !important; /* Was 20px */
}

/* Reduce card gaps */
.our-expert-grid-container,
.how-it-works-grid-container {
    gap: 30px !important; /* Was 40px */
}

.masonry-grid {
    gap: 25px !important; /* Was 30px */
}

/* ========== FIX 5: RESPONSIVE ADJUSTMENTS ========== */

/* Tablets (768px - 1024px) */
@media (max-width: 1024px) {
    .why-choose-us-container,
    .clean-energy-section,
    .service-solutions-section,
    .our-expert-container,
    .how-it-works-section,
    .projects-container,
    .testimonial-container,
    .latest-news-container {
        padding: 50px 30px !important;
        margin-bottom: 40px !important;
    }

    /* 2 columns for services on tablets */
    .our-expert-grid-container {
        grid-template-columns: repeat(2, 1fr) !important;
    }

    /* Stack why choose us vertically */
    .why-choose-us-container {
        flex-direction: column !important;
    }

    .why-choose-us-left-container {
        margin-bottom: 30px !important;
    }

    /* Stack clean energy vertically */
    .clean-energy-container {
        flex-direction: column !important;
    }

    .clean-energy-left-container {
        margin-bottom: 30px !important;
    }
}

/* Mobile (481px - 768px) */
@media (max-width: 768px) {
    .why-choose-us-container,
    .clean-energy-section,
    .service-solutions-section,
    .our-expert-container,
    .how-it-works-section,
    .projects-container,
    .testimonial-container,
    .latest-news-container {
        padding: 40px 20px !important;
        margin-bottom: 30px !important;
    }

    .our-expert-grid-container,
    .how-it-works-grid-container {
        grid-template-columns: 1fr !important;
        gap: 25px !important;
    }

    h2 {
        margin-bottom: 25px !important;
        font-size: 32px !important;
        line-height: 48px !important;
    }
}

/* Small Mobile (up to 480px) */
@media (max-width: 480px) {
    .why-choose-us-container,
    .clean-energy-section,
    .service-solutions-section,
    .our-expert-container,
    .how-it-works-section,
    .projects-container,
    .testimonial-container,
    .latest-news-container {
        padding: 30px 15px !important;
        margin-bottom: 25px !important;
    }

    h2 {
        margin-bottom: 20px !important;
        font-size: 28px !important;
        line-height: 42px !important;
    }

    .our-expert-grid-container,
    .how-it-works-grid-container,
    .masonry-grid {
        gap: 20px !important;
    }
}

/* ========== FIX 6: TESTIMONIAL SECTION ========== */

/* Optimize testimonial content to fit 350px height */

/* Title section - compact with minimal top space */
.testimonial-right-top-container {
    margin-bottom: 5px !important; /* Reduced from 8px */
    margin-top: 0 !important;
    padding: 0 !important;
}

.testimonial-right-top-container .common-title {
    font-size: 10px !important; /* Smaller from 12px */
    margin-bottom: 3px !important; /* Reduced from 5px */
    margin-top: 0 !important;
    letter-spacing: 1px !important;
}

.testimonial-right-top-container h2 {
    font-size: 16px !important; /* Smaller to fit 250px height */
    line-height: 20px !important; /* Tighter */
    margin-bottom: 4px !important;
    margin-top: 0 !important;
}

/* Quote content - compact with less top space */
.testimonial-right-top-content {
    margin-bottom: 8px !important; /* Reduced from 10px */
    margin-top: 0 !important;
    padding: 0 !important;
}

.testimonial-right-top-content img {
    width: 25px !important; /* Smaller quote icon from 30px */
    height: 25px !important;
    margin-bottom: 3px !important; /* Reduced from 5px */
    margin-top: 0 !important;
}

.testimonial-right-top-container p,
.testimonial-right-top-content p,
.testimonial-para2 {
    color: #333333 !important;
    font-size: 13px !important; /* INCREASED from 12px */
    line-height: 1.45 !important; /* Better readability */
    margin-top: 4px !important;
    max-height: 100px !important; /* Adjusted for 250px height */
    overflow: hidden !important;
}

/* Client info section - compact */
.testimonial-person-content {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    margin-top: 10px !important;
}

.testimonial-person {
    flex: 0 0 auto !important;
}

.testimonial-person img {
    width: 35px !important; /* Smaller to fit 250px */
    height: 35px !important;
    border-radius: 50% !important;
    object-fit: cover !important;
}

.testimonial-content {
    flex: 1 !important;
}

.testimonial-content h3 {
    color: #000000 !important;
    font-size: 12px !important; /* Smaller for compact layout */
    margin: 0 !important;
    line-height: 1.2 !important;
}

/* Navigation arrows - compact */
.testimonial-arrow {
    margin-top: 8px !important;
    padding: 0 !important;
}

/* Center testimonial section - INCREASED HEIGHT */
.testimonial-container {
    display: flex !important;
    flex-direction: row !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 30px !important;
    text-align: left !important;
    max-width: 900px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 20px 20px 25px 20px !important; /* INCREASED bottom padding from 20px to 25px */
}

/* Testimonial left image container - INCREASED SIZE */
.testimonial-left-container {
    flex: 0 0 300px !important; /* INCREASED from 250px */
    max-width: 300px !important;
    width: 300px !important;
    min-width: 300px !important;
    height: 300px !important; /* INCREASED from 250px */
}

.testimonial-left-container img {
    width: 100% !important;
    height: 100% !important;
    max-width: 300px !important;
    max-height: 300px !important;
    object-fit: cover !important;
    border-radius: 15px !important;
}

/* Testimonial right content container - INCREASED HEIGHT */
.testimonial-right-container {
    flex: 0 0 500px !important; /* INCREASED from 450px */
    max-width: 500px !important;
    width: 500px !important;
    min-width: 500px !important;
    height: 300px !important; /* INCREASED from 250px */
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    overflow: hidden !important;
}

@media (max-width: 1024px) {
    .testimonial-container {
        flex-direction: column !important;
        text-align: center !important;
    }

    .testimonial-left-container,
    .testimonial-right-container {
        max-width: 100% !important;
    }
}

/* ========== FIX 7: SERVICE CARD TEXT & FRAMES ========== */

.service-solutions-card {
    border: 2px solid #e0e0e0 !important; /* Gray border all sides */
    border-top: 5px solid #34530a !important; /* GREEN top border - THICKER */
    border-bottom: none !important; /* No bottom border - green section handles it */
    box-shadow: 0 2px 8px rgba(0,0,0,0.08) !important;
    transition: all 0.3s ease !important;
    position: relative !important;
    height: 480px !important; /* FIXED HEIGHT - all cards same size */
    display: flex !important;
    flex-direction: column !important;
}

/* Green highlight bar at bottom - ALWAYS VISIBLE - FIXED HEIGHT */
.service-solutions-card .learn-more-btn {
    background-color: #34530a !important; /* GREEN background - ALWAYS */
    color: #FFFFFF !important; /* WHITE text - ALWAYS */
    padding: 20px 0 !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    height: 60px !important; /* FIXED HEIGHT */
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important; /* Don't shrink */
    margin-top: auto !important; /* Push to bottom */
}

.service-solutions-card:hover {
    border-color: #34530a !important; /* All borders green on hover */
    box-shadow: 0 4px 15px rgba(52, 83, 10, 0.15) !important;
    transform: translateY(-3px) !important;
}

.service-solutions-card:hover .learn-more-btn {
    background-color: #34530a !important; /* Keep green on hover */
    color: #FFFFFF !important; /* Keep white text on hover */
}

/* Product title section - GREEN background with WHITE text - FIXED HEIGHT */
.service-solutions-top-card-content {
    background-color: #34530a !important; /* GREEN background */
    padding: 24px !important;
    height: 80px !important; /* FIXED HEIGHT */
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important; /* Don't shrink */
}

.service-solutions-card h3,
.service-solutions-top-card-content h3 {
    color: #FFFFFF !important; /* WHITE text on green background */
    margin: 0 !important;
    font-size: 24px !important;
    font-weight: 600 !important;
}

.service-solutions-card p,
.service-solutions-top-card-content p {
    color: #FFFFFF !important; /* WHITE text */
}

/* FIX: Override line-height: 0 from bottom-card-content - FIXED HEIGHT */
.service-solutions-bottom-card-content {
    line-height: 0 !important; /* Keep line-height: 0 for image only */
    height: 280px !important; /* FIXED HEIGHT for image */
    flex-shrink: 0 !important; /* Don't shrink */
}

/* Product text section above Learn More button */
.product-text-section {
    display: block !important;
    width: 100% !important;
    background: #ffffff !important;
    padding: 15px 20px !important;
    text-align: center !important;
    min-height: 50px !important;
    box-sizing: border-box !important;
}

.product-desc-text {
    display: block !important;
    color: #555555 !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
    margin: 0 !important;
    padding: 0 !important;
    font-weight: 400 !important;
}

/* ========== FIX 8: CLEAN ENERGY CARD TEXT ========== */

.clean-energy-financial-savings h3 {
    color: #000000 !important;
}

.clean-energy-financial-savings p {
    color: #333333 !important;
}

.clean-energy-left-container h2 {
    color: #000000 !important;
}

/* ========== FIX 9: HOW IT WORKS TEXT ========== */

.how-it-works-grid-box h3 {
    color: #000000 !important;
}

.how-it-works-grid-box p,
.how-it-works-grid-box-para {
    color: #333333 !important;
}

.how-it-works-para1,
.how-it-works-para2 {
    color: #333333 !important;
}

/* ========== FIX 10: BLOG/NEWS CARD TEXT ========== */

.latest-news-grid-card h3,
.latest-news-grid-card-h3,
.blog1-ellipsis-text {
    color: #000000 !important;
}

.latest-news-card-content p {
    color: #333333 !important;
}

/* ========== FIX 11: REMOVE DECORATIVE LINES (Green/Red/Blue) ========== */

/* Remove the decorative gradient lines that appear before sections */
.clean-energy-section::before,
.our-expert-container::before,
.projects-container::before,
.latest-news-container::before,
.service-solutions-section::before,
.how-it-works-section::before,
.why-choose-us-container::before,
.testimonial-container::before {
    display: none !important;
    content: none !important;
    height: 0 !important;
    width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    background: none !important;
}

/* Remove the decorative lines after section titles */
.clean-energy-section::after,
.our-expert-container::after,
.projects-container::after,
.latest-news-container::after,
.service-solutions-section::after,
.how-it-works-section::after,
.why-choose-us-container::after,
.testimonial-container::after,
.clean-energy-section h2::after,
.our-expert-container h2::after,
.projects-container h2::after,
.latest-news-container h2::after,
.service-solutions-section h2::after,
.how-it-works-section h2::after,
.why-choose-us-container h2::after,
.testimonial-container h2::after {
    display: none !important;
    content: none !important;
    height: 0 !important;
    width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    background: none !important;
    background-image: none !important;
}

/* Remove any SVG or decorative elements */
section::before,
section::after,
.section::before,
.section::after,
div[class*="container"]::before,
div[class*="container"]::after,
div[class*="section"]::before,
div[class*="section"]::after {
    display: none !important;
    background-image: none !important;
    border: none !important;
}

/* Remove specific decorative line after Recent Posts title */
.latest-news-container h2::before,
.latest-news-container h2::after,
.latest-news-container::before,
.latest-news-container::after {
    display: none !important;
    content: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Also remove from all other sections */
.clean-energy-section::before,
.clean-energy-section::after,
.our-expert-container::before,
.our-expert-container::after,
.projects-container::before,
.projects-container::after,
.service-solutions-section::before,
.service-solutions-section::after,
.how-it-works-section::before,
.how-it-works-section::after {
    display: none !important;
    content: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Add MORE space for "Our Most Recent Posts" section only */
.latest-news-container h2 {
    margin-bottom: 40px !important; /* More space for Recent Posts section */
    padding-bottom: 0px !important;
}

.latest-news-container {
    padding-top: 50px !important;
    padding-bottom: 50px !important;
}

.masonry-grid {
    margin-top: 0px !important; /* No extra margin needed */
    padding-top: 0px !important;
}

/* ========== FIX 12: REDUCE EXCESSIVE WHITE SPACE ========== */

/* Minimal spacing between all sections - very tight */
.hero-slider-wrapper {
    margin-bottom: 15px !important; /* Reduced from 30px */
}

.why-choose-us-container {
    padding: 30px 40px !important; /* Reduced from 40px */
    margin-bottom: 15px !important; /* Reduced from 30px */
}

.clean-energy-section {
    padding: 30px 40px !important; /* Reduced from 50px */
    margin-bottom: 15px !important; /* Reduced from 30px */
}

.service-solutions-section {
    padding: 30px 40px 20px !important; /* Reduced from 50px */
    margin-bottom: 15px !important; /* Reduced from 30px */
}

.our-expert-container {
    padding: 30px 40px !important; /* Reduced from 50px */
    margin-bottom: 15px !important; /* Reduced from 30px */
}

.how-it-works-section {
    padding: 8px 40px 8px !important; /* Added bottom padding back: 8px */
    margin-bottom: 15px !important; /* Same as other sections */
    background: none !important; /* Remove any background decorative lines */
}

/* Remove blue wavy decorative lines above and below How We Operate */
.how-it-works-section::before,
.how-it-works-section::after {
    display: none !important;
    content: none !important;
    background: none !important;
    background-image: none !important;
    border: none !important;
    height: 0 !important;
    width: 0 !important;
}

.how-it-works-grid-container {
    margin-bottom: 0 !important; /* Remove bottom margin from grid */
    padding-bottom: 0 !important;
    margin-top: 3px !important; /* Minimal gap between title and grid */
}

.how-it-works-container {
    padding-bottom: 0 !important; /* Remove bottom padding */
    margin-bottom: 0 !important; /* Remove bottom margin */
}

/* FORCE "How We Operate" title to be VISIBLE - Aggressive override */
.how-it-works-section h2,
.how-it-works-container h2,
.how-it-works-section > .how-it-works-container > h2 {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    text-align: center !important;
    margin: 0 0 10px 0 !important;
    font-size: 42px !important;
    font-weight: 700 !important;
    line-height: 64px !important;
    color: #000000 !important;
    padding: 0 !important;
    height: auto !important;
    overflow: visible !important;
    position: relative !important;
    z-index: 10 !important;
    background: transparent !important;
}

/* Remove old common-title styles from How We Operate */
.how-it-works-para1 {
    display: none !important;
}

.how-it-works-para2 {
    display: none !important;
}

.projects-container {
    padding: 30px 40px !important; /* Reduced from 50px */
    margin-bottom: 15px !important; /* Reduced from 30px */
}

.testimonial-container {
    padding: 15px 40px 20px 40px !important; /* INCREASED bottom padding from 15px to 20px */
    margin-bottom: 15px !important; /* SAME as other sections */
}

.latest-news-container {
    padding: 30px 40px 40px !important; /* NORMAL top padding same as other sections */
    margin-bottom: 0 !important;
    margin-top: 0px !important;
}

/* Minimal title spacing for all sections */
h2 {
    margin-bottom: 10px !important; /* Minimal spacing - same as Recent Posts */
    margin-top: 0 !important;
}

.common-title {
    margin-bottom: 10px !important; /* Minimal spacing */
    margin-top: 0 !important;
}

/* Apply 10px margin to all section titles */
.our-expert-container h2,
.how-it-works-section h2,
.service-solutions-section h2,
.projects-container h2,
.clean-energy-section h2,
.why-choose-us-container h2,
.testimonial-container h2 {
    margin-bottom: 10px !important;
    padding-bottom: 0px !important;
}

/* Fix "Our Products" title - prevent line break */
.service-solutions-section h2,
.service-solutions-top-left-container h2 {
    white-space: nowrap !important; /* Prevent text wrapping */
    text-align: center !important;
    width: 100% !important;
}

/* ========== FIX 13: WHO WE ARE SECTION - PROPER LAYOUT ========== */

/* Clean Energy Section (Who We Are) - HORIZONTAL Layout */
.clean-energy-section {
    background: #f8f9fa !important; /* Light gray background */
}

.clean-energy-container {
    display: flex !important; /* Flex for horizontal layout */
    flex-direction: row !important; /* Horizontal - side by side */
    gap: 25px !important; /* REDUCED gap from 50px to 25px - less space between image and cards */
    max-width: 1400px !important; /* Increased from 1320px for more card width */
    margin: 0 auto !important;
    align-items: flex-end !important; /* ALIGN TO BOTTOM - all elements same baseline */
    padding-top: 0 !important;
}

.clean-energy-left-container {
    flex: 0 0 auto !important; /* Don't grow, don't shrink */
    width: 35% !important; /* Left side takes 35% */
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important; /* Align to LEFT */
}

.clean-energy-left-container h2 {
    text-align: left !important; /* Title aligned LEFT */
    margin-bottom: 10px !important;
    margin-top: 60px !important; /* MOVED DOWN MORE - was 30px */
    width: 100% !important;
    padding-left: 0 !important;
}

.clean-energy-left-bottom-container {
    width: 100% !important;
    display: flex !important;
    justify-content: flex-start !important; /* Align to LEFT */
    margin-top: 0 !important;
    padding-top: 0 !important;
}

.clean-energy-content-container {
    width: 100% !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
}

.clean-energy-star-container {
    width: 100% !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
}

.clean-energy-content-container img {
    width: 100% !important;
    height: 450px !important; /* INCREASED from 380px to 450px - MORE HEIGHT */
    max-height: 450px !important;
    border-radius: 15px !important;
    object-fit: cover !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Remove any extra spacing from image container */
.clean-energy-star-container img {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    height: 450px !important; /* INCREASED from 380px to 450px - MORE HEIGHT */
}

.clean-energy-right-container {
    flex: 1 !important; /* Right side takes remaining space */
    display: flex !important;
    flex-direction: row !important; /* HORIZONTAL - cards side by side */
    flex-wrap: nowrap !important; /* NO WRAPPING - all in one line */
    gap: 25px !important; /* INCREASED gap from 15px to 25px - EQUAL spacing between all cards */
    justify-content: space-between !important;
    align-items: flex-end !important; /* ALIGN TO BOTTOM */
    align-self: flex-end !important; /* Align container to bottom */
}

.clean-energy-financial-savings {
    background: white !important;
    padding: 25px 18px !important; /* INCREASED padding from 20px 15px */
    border-radius: 10px !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.05) !important;
    text-align: center !important;
    transition: transform 0.3s ease, box-shadow 0.3s ease !important;
    margin-bottom: 0 !important;
    flex: 1 1 0 !important; /* Equal width for all 3 cards */
    min-width: 0 !important;
    width: 100% !important;
    height: 450px !important; /* INCREASED from 380px to 450px - MATCH IMAGE */
    max-height: 450px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important; /* Center content vertically */
    overflow: hidden !important;
}

.clean-energy-financial-savings:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 5px 15px rgba(0,0,0,0.1) !important;
}

.clean-energy-financial-savings img {
    margin: 0 auto 12px !important; /* More space */
    display: block !important;
    width: 65px !important; /* LARGER icon from 60px */
    height: 65px !important;
}

.clean-energy-financial-savings h3 {
    margin: 12px 0 10px !important; /* More spacing */
    font-size: 21px !important; /* INCREASED from 20px to 21px */
    font-weight: 700 !important;
    white-space: normal !important;
    line-height: 1.4 !important;
}

.clean-energy-financial-savings p {
    margin: 0 !important;
    padding: 0 10px !important; /* INCREASED horizontal padding from 8px to 10px */
    font-size: 16px !important; /* INCREASED from 15px to 16px */
    line-height: 1.65 !important; /* INCREASED line spacing from 1.6 to 1.65 */
    white-space: normal !important;
}

/* Responsive for Who We Are - Stack on smaller screens */
@media (max-width: 1024px) {
    .clean-energy-container {
        flex-direction: column !important; /* Stack vertically on tablets */
        gap: 30px !important;
    }

    .clean-energy-left-container {
        width: 100% !important;
    }
}

@media (max-width: 768px) {
    .clean-energy-financial-savings {
        padding: 20px 15px !important;
    }

    .clean-energy-container {
        gap: 25px !important;
    }
}

/* ========== FIX 14: REMOVE EXTRA PADDING/MARGIN FROM CONTENT ========== */

/* Remove extra spacing from inner elements - Minimal gaps */
.service-solutions-top-container {
    margin-bottom: 0px !important; /* Remove gap completely */
}

.our-expert-para1 {
    margin-bottom: 10px !important; /* Minimal gap */
}

.how-it-works-para2 {
    margin-bottom: 10px !important; /* Minimal gap */
}

.our-expert-grid-container,
.how-it-works-grid-container {
    margin-top: 10px !important; /* Minimal gap between title and content */
}

/* Ensure how-it-works-container shows the h2 */
.how-it-works-container {
    position: relative !important;
}

.projects-slider {
    margin-top: 10px !important; /* Minimal gap for gallery slider */
}

.masonry-grid {
    margin-top: 0px !important; /* No extra margin - title already has 40px */
}

.service-container-main {
    margin-top: 0px !important; /* Remove gap between title and products */
    padding: 0 !important;
}

/* Reduce spacing in product cards */
.service-solutions-bottom-container {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Reduce space between Our Products title and product cards */
.service-solutions-section h2,
.service-solutions-top-left-container h2 {
    margin-bottom: 0px !important; /* Remove all space after "Our Products" title */
    padding-bottom: 0px !important;
}

/* Reduce the card title height to remove space */
.service-solutions-top-card-content {
    height: auto !important; /* Remove fixed height */
    min-height: 0 !important;
    padding: 10px !important;
    margin: 0 !important;
}

.service-solutions-card {
    margin-bottom: 15px !important; /* Reduce space between cards */
}

.service-solutions-autoplay .slick-slide {
    margin: 0 10px !important; /* Reduce horizontal spacing between product cards */
}

/* Reduce padding inside product section */
.service-solutions-top-container {
    padding-bottom: 0 !important;
}

/* ========== SUMMARY OF FIXES ========== */
/*
✅ 1. Reduced excessive spacing between sections (100px → 50px, 80px → 30px)
✅ 2. Fixed white text on white background (Our Products section)
✅ 3. Ensured all sections are properly centered
✅ 4. Fixed all h2, h3, p text visibility (dark colors)
✅ 5. Proper responsive behavior for mobile/tablet
✅ 6. Centered grid layouts (Our Services, How It Works)
✅ 7. Centered Latest News/Blog section
✅ 8. Improved overall spacing harmony
✅ 9. Fixed testimonial section alignment
✅ 10. All text elements are now visible
✅ 11. REMOVED decorative red/green/blue lines
✅ 12. REDUCED excessive white space dramatically
✅ 13. FIXED Who We Are section layout (2-column grid)
✅ 14. Removed extra padding from inner elements
*/
/* Who We Are Section Fix */
.clean-energy-section {
    max-width: 1320px;
    width: 100%;
    margin: 50px auto !important;
    padding: 0 15px !important;
}

.clean-energy-container {
    background-image: url('../images/clean-energy/clean-energy-bg.png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    padding: 60px 40px !important;
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: flex-start !important;
    gap: 40px !important;
}

.clean-energy-left-container {
    flex: 1 1 380px !important;
    max-width: 450px !important;
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 30px !important;
}

.clean-energy-left-container h2 {
    font-size: 36px !important;
    font-weight: bold !important;
    color: #222 !important;
    margin-bottom: 20px !important;
}

.clean-energy-left-bottom-container {
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
}

.clean-energy-content-container {
    display: flex !important;
    flex-direction: column !important;
    gap: 15px !important;
}

.clean-energy-star-container {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
}

.clean-energy-star-container img {
    width: 100% !important;
    height: auto !important;
    max-height: 450px !important;
    object-fit: cover !important;
    border-radius: 8px !important;
}

.clean-energy-right-container {
    flex: 1 1 550px !important;
    width: 100% !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    gap: 20px !important;
    overflow-x: auto !important;
}

.clean-energy-financial-savings {
    flex: 0 0 280px !important;
    min-width: 280px !important;
    max-width: 280px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    padding: 18px !important;
    background: rgba(255, 255, 255, 0.9) !important;
    border-radius: 8px !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1) !important;
    overflow: hidden !important;
}

.clean-energy-financial-savings img {
    width: 72px !important;
    height: 72px !important;
    object-fit: contain !important;
}

.clean-energy-financial-savings h3 {
    font-size: 18px !important;
    font-weight: bold !important;
    color: #222 !important;
    margin: 10px 0 !important;
    line-height: 1.3 !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
}

.clean-energy-financial-savings p {
    font-size: 13px !important;
    color: #666 !important;
    line-height: 1.5 !important;
    margin: 0 !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
}

/* Responsive Design */
@media (max-width: 1024px) {
    .clean-energy-container {
        padding: 40px 30px !important;
        gap: 30px !important;
    }

    .clean-energy-left-container {
        max-width: 100% !important;
    }

    .clean-energy-right-container {
        flex: 1 1 100% !important;
    }
}

@media (max-width: 768px) {
    .clean-energy-container {
        padding: 30px 20px !important;
        flex-direction: column !important;
    }

    .clean-energy-left-container h2 {
        font-size: 28px !important;
    }

    .clean-energy-financial-savings {
        flex: 1 1 100% !important;
    }

    .clean-energy-star-container img {
        max-height: 300px !important;
    }
}
/* Our Products Section - ULTRA LUXURY PREMIUM DESIGN */

/* Hide the description text under product images */
.product-text-section {
    display: none !important;
    height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
}

.product-desc-text {
    display: none !important;
}

/* Remove blank space from hidden title section */
.service-solutions-top-card-content {
    display: none !important;
    height: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    min-height: 0 !important;
}

/* Product Cards - Force Horizontal Slider Layout */
.service-solutions-bottom-container,
.service-solutions-autoplay {
    display: block !important;
    overflow: visible !important;
    grid-template-columns: none !important;
}

.service-solutions-bottom-container *,
.service-solutions-autoplay * {
    grid-column: unset !important;
    grid-row: unset !important;
}

.service-container-main {
    position: relative !important;
    padding: 0 60px !important;
}

/* Ensure slick slider shows cards properly */
.service-solutions-autoplay.slick-initialized {
    width: 100% !important;
}

.service-solutions-autoplay .slick-list {
    overflow: visible !important;
    padding: 20px 0 !important;
}

.service-solutions-autoplay .slick-track {
    display: flex !important;
    gap: 20px !important;
}

.service-solutions-autoplay .slick-slide {
    margin: 0 10px !important;
    float: none !important;
    display: block !important;
}

.service-solutions-card-link {
    display: block !important;
    width: 100% !important;
}

/* Ensure cards take full slide width */
.service-solutions-autoplay .slick-slide > * {
    width: 100% !important;
}

/* Fix card height - remove all bottom spacing */
.service-solutions-card {
    display: flex !important;
    flex-direction: column !important;
    height: auto !important;
    min-height: auto !important;
    margin: 0 auto !important;
}

/* Slider Arrows for Products */
.service-solutions-autoplay .slick-arrow {
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 50px !important;
    height: 50px !important;
    background: #34530a !important;
    border-radius: 50% !important;
    z-index: 10 !important;
    cursor: pointer !important;
    border: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all 0.3s ease !important;
}

.service-solutions-autoplay .slick-arrow:before {
    color: white !important;
    font-size: 20px !important;
}

.service-solutions-autoplay .slick-prev {
    left: -60px !important;
}

.service-solutions-autoplay .slick-next {
    right: -60px !important;
}

.service-solutions-autoplay .slick-arrow:hover {
    background: #5a8716 !important;
    transform: translateY(-50%) scale(1.1) !important;
}

/* LUXURY PREMIUM CARD WITH GOLDEN ACCENT BORDER */
.service-solutions-card {
    display: flex !important;
    flex-direction: column !important;
    overflow: visible !important;
    border-radius: 20px !important;
    background: #ffffff !important;
    position: relative !important;
    box-shadow:
        0 10px 40px rgba(0, 0, 0, 0.15),
        0 4px 15px rgba(0, 0, 0, 0.1),
        0 1px 3px rgba(0, 0, 0, 0.08) !important;
    transition: all 0.6s cubic-bezier(0.23, 1, 0.32, 1) !important;
    border: 5px solid transparent !important;
    background-clip: padding-box !important;
}

/* Luxury double-border effect with gold accent */
.service-solutions-card::before {
    content: '' !important;
    position: absolute !important;
    inset: -5px !important;
    border-radius: 20px !important;
    padding: 5px !important;
    background: linear-gradient(
        135deg,
        #d4af37 0%,
        #f4e4a6 15%,
        #34530a 30%,
        #5a8716 50%,
        #34530a 70%,
        #f4e4a6 85%,
        #d4af37 100%
    ) !important;
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0) !important;
    -webkit-mask-composite: xor !important;
    mask-composite: exclude !important;
    z-index: -1 !important;
    opacity: 0.9 !important;
    transition: all 0.6s ease !important;
}

/* Inner glow effect */
.service-solutions-card::after {
    content: '' !important;
    position: absolute !important;
    inset: 0 !important;
    border-radius: 15px !important;
    box-shadow: inset 0 0 30px rgba(212, 175, 55, 0.1) !important;
    pointer-events: none !important;
    opacity: 0 !important;
    transition: opacity 0.6s ease !important;
}

.service-solutions-card:hover {
    transform: translateY(-15px) scale(1.03) !important;
    box-shadow:
        0 25px 60px rgba(52, 83, 10, 0.3),
        0 15px 35px rgba(0, 0, 0, 0.2),
        0 5px 15px rgba(0, 0, 0, 0.15),
        0 0 0 1px rgba(212, 175, 55, 0.3) !important;
}

.service-solutions-card:hover::before {
    opacity: 1 !important;
    background: linear-gradient(
        135deg,
        #d4af37 0%,
        #ffd700 20%,
        #5a8716 40%,
        #7ab82d 50%,
        #5a8716 60%,
        #ffd700 80%,
        #d4af37 100%
    ) !important;
}

.service-solutions-card:hover::after {
    opacity: 1 !important;
}

/* Premium Title Section with Elegant Background */
.service-solutions-top-card-content {
    padding: 32px 28px !important;
    background: linear-gradient(
        135deg,
        #f8faf9 0%,
        #ffffff 50%,
        #f8faf9 100%
    ) !important;
    position: relative !important;
    z-index: 2 !important;
    border-bottom: none !important;
}

/* Decorative corner accents */
.service-solutions-top-card-content::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 60px !important;
    height: 60px !important;
    background: linear-gradient(135deg, rgba(212, 175, 55, 0.15) 0%, transparent 100%) !important;
    border-top-left-radius: 15px !important;
}

.service-solutions-top-card-content::after {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    width: 60px !important;
    height: 60px !important;
    background: linear-gradient(225deg, rgba(212, 175, 55, 0.15) 0%, transparent 100%) !important;
    border-top-right-radius: 15px !important;
}

/* Luxury Title Styling - Normal Case with Watermark Effect */
.service-solutions-top-card-content h3 {
    font-size: 24px !important;
    font-weight: 600 !important;
    color: rgba(42, 63, 21, 0.25) !important;
    margin: 0 !important;
    text-align: center !important;
    text-transform: capitalize !important;
    letter-spacing: 1px !important;
    text-shadow:
        0 1px 2px rgba(255, 255, 255, 0.8),
        0 2px 4px rgba(212, 175, 55, 0.15) !important;
    position: relative !important;
    z-index: 3 !important;
    transition: all 0.4s ease !important;
    opacity: 0.35 !important;
    font-family: 'Georgia', serif !important;
    font-style: italic !important;
}

.service-solutions-card:hover .service-solutions-top-card-content h3 {
    transform: scale(1.05) !important;
    letter-spacing: 1.2px !important;
    opacity: 0.45 !important;
    color: rgba(52, 83, 10, 0.3) !important;
}

/* Image Container with Overlay */
.service-solutions-bottom-card-content {
    flex: 1 !important;
    position: relative !important;
    overflow: hidden !important;
    background: #000 !important;
}

/* Elegant gradient overlay on image */
.service-solutions-bottom-card-content::after {
    content: '' !important;
    position: absolute !important;
    inset: 0 !important;
    background: linear-gradient(
        to bottom,
        transparent 0%,
        transparent 40%,
        rgba(0, 0, 0, 0.3) 80%,
        rgba(42, 63, 21, 0.6) 100%
    ) !important;
    pointer-events: none !important;
    z-index: 1 !important;
    transition: opacity 0.6s ease !important;
}

.service-solutions-card:hover .service-solutions-bottom-card-content::after {
    background: linear-gradient(
        to bottom,
        transparent 0%,
        transparent 30%,
        rgba(0, 0, 0, 0.4) 70%,
        rgba(42, 63, 21, 0.7) 100%
    ) !important;
}

/* Premium Image Styling */
.service-solutions-img {
    width: 100% !important;
    height: 100% !important;
    min-height: 380px !important;
    object-fit: cover !important;
    display: block !important;
    transition: all 0.7s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
    filter: brightness(0.95) contrast(1.05) !important;
}

.service-solutions-card:hover .service-solutions-img {
    transform: scale(1.1) rotate(1deg) !important;
    filter: brightness(1) contrast(1.1) !important;
}

/* ULTRA LUXURY "Learn More" Button */
.learn-more-btn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 12px !important;
    padding: 22px 24px !important;
    background: linear-gradient(
        135deg,
        #2a3f15 0%,
        #34530a 25%,
        #5a8716 50%,
        #34530a 75%,
        #2a3f15 100%
    ) !important;
    background-size: 200% 200% !important;
    color: #ffffff !important;
    font-weight: 800 !important;
    font-size: 15px !important;
    text-align: center !important;
    cursor: pointer !important;
    transition: all 0.5s ease !important;
    text-transform: uppercase !important;
    letter-spacing: 2px !important;
    position: relative !important;
    overflow: hidden !important;
    border-top: 2px solid rgba(212, 175, 55, 0.3) !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) !important;
}

/* Golden shimmer effect */
.learn-more-btn::before {
    content: '' !important;
    position: absolute !important;
    top: -50% !important;
    left: -50% !important;
    width: 200% !important;
    height: 200% !important;
    background: linear-gradient(
        45deg,
        transparent 30%,
        rgba(255, 215, 0, 0.3) 50%,
        transparent 70%
    ) !important;
    transform: rotate(45deg) !important;
    animation: shimmer 3s infinite !important;
}

@keyframes shimmer {
    0% { transform: translateX(-100%) translateY(-100%) rotate(45deg); }
    100% { transform: translateX(100%) translateY(100%) rotate(45deg); }
}

.learn-more-btn:hover {
    background: linear-gradient(
        135deg,
        #1f2e0f 0%,
        #2a3f15 30%,
        #34530a 50%,
        #2a3f15 70%,
        #1f2e0f 100%
    ) !important;
    background-size: 200% 200% !important;
    transform: translateY(-3px) !important;
    box-shadow:
        0 8px 20px rgba(52, 83, 10, 0.5),
        0 0 30px rgba(212, 175, 55, 0.3),
        inset 0 1px 0 rgba(255, 255, 255, 0.1) !important;
    border-top-color: rgba(255, 215, 0, 0.6) !important;
    letter-spacing: 2.5px !important;
}

.learn-more-btn img {
    filter: brightness(0) invert(1) drop-shadow(0 0 5px rgba(255, 215, 0, 0.5)) !important;
    position: relative !important;
    z-index: 1 !important;
    transition: transform 0.3s ease !important;
}

.learn-more-btn:hover img {
    transform: translateX(5px) !important;
}

/* Responsive Design */
@media (max-width: 768px) {
    .service-solutions-card {
        border-radius: 16px !important;
    }

    .service-solutions-img {
        min-height: 280px !important;
    }

    .service-solutions-top-card-content {
        padding: 24px 20px !important;
    }

    .service-solutions-top-card-content h3 {
        font-size: 20px !important;
        letter-spacing: 1.5px !important;
    }

    .learn-more-btn {
        padding: 18px 20px !important;
        font-size: 14px !important;
    }
}
/* ====================================
   OUR PRODUCTS - ULTRA COMPACT SPACING
   0px before title, 3px after, 5px before content
   ==================================== */

/* Our Products Section - Ultra Compact */
.service-solutions-section {
    padding: 50px 40px 50px 40px !important;
    margin: 0 auto 50px auto !important;
}

/* Container - No margins */
.service-solutions-container {
    max-width: 1320px !important;
    margin: 0 auto !important;
    padding: 0 !important;
}

/* Top Container - No margins */
.service-solutions-top-container {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Title - CENTERED, 0px top, 3px bottom */
.service-solutions-top-left-container h2,
.service-solutions-section h2 {
    font-size: 42px !important;
    font-weight: 700 !important;
    color: #000000 !important;
    margin: 0 !important;
    padding: 0 0 3px 0 !important;
    text-align: center !important;
    line-height: 1.2 !important;
    width: 100% !important;
}

/* Service Container Main - 5px top margin */
.service-container-main {
    max-width: 1320px !important;
    margin: 5px auto 0 auto !important;
    padding: 0 !important;
}

/* Product Cards Container - No margins */
.service-solutions-bottom-container {
    margin: 0 !important;
    padding: 0 !important;
}

/* Remove any extra spacing from slick slider */
.service-solutions-autoplay {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Product Card Link - No extra margin */
.service-solutions-card-link {
    margin-top: 0 !important;
    margin-bottom: 20px !important;
}

/* Product Card - Compact spacing */
.service-solutions-card {
    margin: 0 !important;
}

/* Force center alignment for Our Products title container */
.service-solutions-top-left-container {
    width: 100% !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    text-align: center !important;
}

/* Mobile - Also reduce spacing */
@media (max-width: 768px) {
    .service-solutions-section {
        padding: 30px 20px 30px 20px !important;
    }

    .service-solutions-container {
        margin: 0 auto 8px auto !important;
    }

    .service-solutions-top-container {
        margin: 0 0 5px 0 !important;
    }

    .service-solutions-top-left-container h2 {
        font-size: 32px !important;
    }
}

/* Tablet - Also reduce spacing */
@media (max-width: 1024px) {
    .service-solutions-section {
        padding: 40px 30px 40px 30px !important;
    }

    .service-solutions-container {
        margin: 0 auto 8px auto !important;
    }
}
/* ====================================
   FINAL COMPREHENSIVE SPACING FIXES
   ULTRA AGGRESSIVE OVERRIDES
   ==================================== */

/* ========================================
   1. LANGUAGE SELECTOR - ULTRA FORCE VISIBLE
   ======================================== */
.desktop-nav .language-selector,
nav.desktop-nav .language-selector,
.language-selector {
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
    margin-left: 8px !important;
    flex-shrink: 0 !important;
    position: relative !important;
    z-index: 100 !important;
    height: auto !important;
    width: auto !important;
    max-width: none !important;
}

#google_translate_element,
.language-selector #google_translate_element,
div#google_translate_element {
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
    height: auto !important;
    width: auto !important;
}

.goog-te-combo,
#google_translate_element select,
#google_translate_element .goog-te-combo,
.skiptranslate select,
select.goog-te-combo {
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
    padding: 8px 16px !important;
    border: 2px solid #34530a !important;
    border-radius: 25px !important;
    font-family: Arial, sans-serif !important;
    font-size: 14px !important;
    font-weight: bold !important;
    color: #34530a !important;
    background: white !important;
    cursor: pointer !important;
    min-width: 150px !important;
    height: auto !important;
}

/* Hide Google Translate branding but keep select visible */
.goog-te-gadget .goog-te-combo {
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

.goog-te-gadget {
    line-height: normal !important;
    color: transparent !important;
}

.goog-te-gadget > span {
    display: inline-block !important;
}

.goog-te-gadget > span > a,
.goog-te-gadget img,
.goog-logo-link {
    display: none !important;
}

/* Force show on desktop */
@media (min-width: 1025px) {
    .desktop-nav .language-selector {
        display: inline-block !important;
    }
}

/* ========================================
   2. ALL SECTIONS - ULTRA COMPACT SPACING
   0px gap before title, 3px after title, 5px before content
   ======================================== */

/* Hero Section - Special case (top of page) */
.hero-slider-wrapper {
    padding: 0 !important;
    margin: 0 0 50px 0 !important;
}

/* Why Choose Us Section - PRECISE SPACING */
.why-choose-us-container {
    padding: 50px 40px 50px 40px !important;
    margin: 0 auto 50px auto !important;
    max-width: 100% !important;
}

.why-choose-us-container h2 {
    margin: 0 !important;
    padding: 0 0 3px 0 !important;
    text-align: center !important;
}

.why-choose-us-right-container {
    margin-top: 5px !important;
}

/* WHO WE ARE SECTION - PRECISE SPACING */
.clean-energy-section {
    padding: 50px 40px 50px 40px !important;
    margin: 0 auto 50px auto !important;
    max-width: 100% !important;
}

.clean-energy-container {
    background-image: url('../images/clean-energy/clean-energy-bg.png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    padding: 0 !important;
    max-width: 1320px !important;
    margin: 0 auto !important;
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: flex-end !important;
    gap: 30px !important;
}

/* WHO WE ARE - ALL 3 FRAMES IN ONE VIEW, NO SCROLLBAR */
.clean-energy-left-container {
    flex: 1 1 380px !important;
    max-width: 450px !important;
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 30px !important;
    align-self: flex-end !important;
}

.clean-energy-left-container h2 {
    font-size: 36px !important;
    font-weight: bold !important;
    color: #222 !important;
    margin: 0 !important;
    padding: 0 0 3px 0 !important;
    text-align: center !important;
}

.clean-energy-left-bottom-container {
    margin-top: 5px !important;
}

.clean-energy-right-container {
    flex: 1 1 800px !important;
    width: 100% !important;
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 15px !important;
    overflow: visible !important;
    align-items: end !important;
    align-content: end !important;
}

.clean-energy-financial-savings {
    width: 100% !important;
    min-width: unset !important;
    max-width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    padding: 20px !important;
    background: rgba(255, 255, 255, 0.9) !important;
    border-radius: 8px !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1) !important;
    overflow: visible !important;
}

.clean-energy-financial-savings img {
    width: 60px !important;
    height: 60px !important;
    object-fit: contain !important;
}

.clean-energy-financial-savings h3 {
    font-size: 16px !important;
    font-weight: bold !important;
    color: #222 !important;
    margin: 8px 0 !important;
    line-height: 1.3 !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
}

.clean-energy-financial-savings p {
    font-size: 13px !important;
    color: #666 !important;
    line-height: 1.4 !important;
    margin: 0 !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
}

/* OUR PRODUCTS SECTION - PRECISE SPACING */
.service-solutions-section {
    padding: 50px 40px 50px 40px !important;
    margin: 0 auto 50px auto !important;
    background: #ffffff !important;
    max-width: 100% !important;
}

.service-solutions-container {
    max-width: 1320px !important;
    margin: 0 auto !important;
    padding: 0 !important;
}

.service-solutions-top-container {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    margin: 0 !important;
    padding: 0 !important;
}

.service-solutions-top-left-container {
    margin: 0 !important;
    padding: 0 !important;
}

.service-solutions-top-left-container h2 {
    font-size: 42px !important;
    font-weight: 700 !important;
    color: #000000 !important;
    margin: 0 !important;
    padding: 0 0 3px 0 !important;
    text-align: center !important;
    line-height: 1.2 !important;
    width: 100% !important;
}

.service-solutions-top-left-container {
    width: 100% !important;
    display: flex !important;
    justify-content: center !important;
}

.service-solutions-top-container {
    justify-content: center !important;
}

.service-solutions-top-right-container {
    margin: 0 !important;
    padding: 0 !important;
    display: none !important;
}

.service-solutions-top-right-container p {
    margin: 0 !important;
    padding: 0 !important;
}

.service-solutions-section h2 {
    margin: 0 !important;
    padding: 0 0 3px 0 !important;
    line-height: 1.2 !important;
    text-align: center !important;
}

.service-container-main {
    max-width: 1320px !important;
    margin: 5px auto 0 auto !important;
    padding: 0 !important;
}

/* Product Cards - 8px gap from title */
.service-solutions-bottom-container {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* OUR SERVICES SECTION - PRECISE SPACING */
.our-expert-container {
    padding: 80px 0 50px 0 !important;
    margin: 0 auto 50px auto !important;
    background: linear-gradient(135deg, #f0fff4 0%, #ffffff 100%) !important;
    max-width: 100% !important;
    width: 100% !important;
}

.our-expert-container h2 {
    font-size: 42px !important;
    font-weight: 700 !important;
    color: #000000 !important;
    margin: 0 auto 60px auto !important;
    padding: 0 40px !important;
    text-align: center !important;
    line-height: 1.2 !important;
    max-width: 100% !important;
    width: 100% !important;
}

.our-expert-grid-container {
    max-width: 1320px !important;
    margin: 0 auto !important;
    padding: 0 40px !important;
}

/* HOW WE OPERATE SECTION - PRECISE SPACING */
.how-it-works-section {
    padding: 50px 40px 50px 40px !important;
    margin: 0 auto 50px auto !important;
    background: #ffffff !important;
    max-width: 100% !important;
}

.how-it-works-container {
    max-width: 1320px !important;
    margin: 0 auto !important;
}

.how-it-works-container h2 {
    font-size: 42px !important;
    font-weight: 700 !important;
    color: #000000 !important;
    margin: 0 !important;
    padding: 0 0 3px 0 !important;
    text-align: center !important;
    line-height: 1.2 !important;
}

.how-it-works-grid-container {
    max-width: 1320px !important;
    margin: 5px auto 0 auto !important;
}

/* PROJECTS/GALLERY SECTION - PRECISE SPACING */
.projects-container {
    padding: 50px 0 50px 0 !important;
    margin: 0 auto 50px auto !important;
    background: linear-gradient(135deg, #f8fef5 0%, #ffffff 100%) !important;
    max-width: 100% !important;
    width: 100% !important;
}

.projects-container h2 {
    font-size: 42px !important;
    font-weight: 700 !important;
    color: #000000 !important;
    margin: 0 auto !important;
    padding: 0 40px 40px 40px !important;
    text-align: center !important;
    line-height: 1.2 !important;
    max-width: 100% !important;
    width: 100% !important;
}

.projects-slider {
    max-width: 1320px !important;
    margin: 0 auto !important;
    padding: 0 20px !important;
}

/* Gallery - Force Horizontal Slider Layout */
.projects-container {
    position: relative !important;
}

.projects-slider {
    position: relative !important;
    padding: 0 20px !important;
    display: block !important;
    grid-template-columns: none !important;
}

.projects-slider * {
    grid-column: unset !important;
    grid-row: unset !important;
}

.projects-slider.slick-initialized {
    width: 100% !important;
}

.projects-slider .slick-list {
    overflow: visible !important;
    padding: 20px 0 !important;
}

.projects-slider .slick-track {
    display: flex !important;
    gap: 20px !important;
}

.projects-slider .slick-slide {
    margin: 0 10px !important;
    float: none !important;
    display: block !important;
}

.projects-card {
    display: block !important;
    width: 250px !important;
    margin: 0 auto !important;
}

.projects-card img {
    width: 250px !important;
    height: 250px !important;
    object-fit: cover !important;
    border-radius: 10px !important;
}

/* Slider Arrows for Gallery */
.projects-slider .slick-arrow {
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 50px !important;
    height: 50px !important;
    background: #34530a !important;
    border-radius: 50% !important;
    z-index: 10 !important;
    cursor: pointer !important;
    border: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all 0.3s ease !important;
}

.projects-slider .slick-arrow:before {
    color: white !important;
    font-size: 20px !important;
}

.projects-slider .slick-prev {
    left: -60px !important;
}

.projects-slider .slick-next {
    right: -60px !important;
}

.projects-slider .slick-arrow:hover {
    background: #5a8716 !important;
    transform: translateY(-50%) scale(1.1) !important;
}

/* TESTIMONIALS SECTION - PRECISE SPACING */
.testimonial-container {
    padding: 50px 40px 50px 40px !important;
    margin: 0 auto 50px auto !important;
    background: #ffffff !important;
    max-width: 100% !important;
}

.testimonial-right-container h2 {
    font-size: 42px !important;
    font-weight: 700 !important;
    color: #000000 !important;
    margin: 0 !important;
    padding: 0 0 3px 0 !important;
    line-height: 1.2 !important;
    text-align: center !important;
}

.testimonial-right-top-container {
    margin-bottom: 5px !important;
}

/* LATEST NEWS SECTION - PRECISE SPACING */
.latest-news-container {
    padding: 50px 40px 50px 40px !important;
    margin: 0 auto 50px auto !important;
    background: linear-gradient(135deg, #f0fff4 0%, #ffffff 100%) !important;
    max-width: 100% !important;
}

.latest-news-container h2 {
    font-size: 42px !important;
    font-weight: 700 !important;
    color: #000000 !important;
    margin: 0 !important;
    padding: 0 0 3px 0 !important;
    text-align: center !important;
    line-height: 1.2 !important;
}

.masonry-grid {
    max-width: 1320px !important;
    margin: 5px auto 0 auto !important;
}

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

/* Tablet View */
@media (max-width: 1200px) {
    .clean-energy-right-container {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

@media (max-width: 1024px) {
    /* All sections - consistent padding on tablet */
    .why-choose-us-container,
    .clean-energy-section,
    .service-solutions-section,
    .our-expert-container,
    .how-it-works-section,
    .projects-container,
    .testimonial-container,
    .latest-news-container {
        padding: 40px 30px 40px 30px !important;
    }

    .clean-energy-left-container {
        max-width: 100% !important;
    }

    .clean-energy-right-container {
        flex: 1 1 100% !important;
        grid-template-columns: repeat(3, 1fr) !important;
    }
}

/* Mobile View */
@media (max-width: 768px) {
    /* All sections - consistent padding on mobile */
    .why-choose-us-container,
    .clean-energy-section,
    .service-solutions-section,
    .our-expert-container,
    .how-it-works-section,
    .projects-container,
    .latest-news-container {
        padding: 30px 20px 30px 20px !important;
    }

    /* Testimonial section mobile fix */
    .testimonial-container {
        flex-direction: column !important;
        gap: 20px !important;
        padding: 30px 20px !important;
        max-width: 100% !important;
    }

    .testimonial-left-container,
    .testimonial-right-container {
        flex: 1 1 100% !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
    }

    .testimonial-left-container {
        max-height: 250px !important;
    }

    .testimonial-left-container img {
        width: 100% !important;
        height: auto !important;
        max-height: 250px !important;
        object-fit: cover !important;
    }

    .testimonial-right-container h2 {
        font-size: 28px !important;
        text-align: center !important;
    }

    .clean-energy-right-container {
        grid-template-columns: 1fr !important;
    }

    .clean-energy-left-container h2 {
        font-size: 28px !important;
    }

    .clean-energy-star-container img {
        max-height: 300px !important;
    }

    /* Mobile - Stack language selector */
    .language-selector {
        margin-left: 5px !important;
    }

    /* Section titles on mobile */
    .service-solutions-top-left-container h2,
    .our-expert-container h2,
    .how-it-works-container h2,
    .projects-container h2,
    .latest-news-container h2 {
        font-size: 32px !important;
        padding-bottom: 30px !important;
    }

    /* Mobile slider adjustments */
    .service-container-main,
    .projects-slider {
        padding: 0 40px !important;
    }

    .service-solutions-autoplay .slick-prev,
    .projects-slider .slick-prev {
        left: -5px !important;
    }

    .service-solutions-autoplay .slick-next,
    .projects-slider .slick-next {
        right: -5px !important;
    }

    .service-solutions-autoplay .slick-arrow,
    .projects-slider .slick-arrow {
        width: 40px !important;
        height: 40px !important;
    }
}
/* ====================================
   FINAL OVERRIDE - ULTRA AGGRESSIVE
   Our Products Center & Language Button
   ==================================== */

/* ========================================
   1. OUR PRODUCTS - FORCE CENTER
   ======================================== */

/* Force entire top container to center */
.service-solutions-top-container,
div.service-solutions-top-container {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    text-align: center !important;
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
}

/* Force left container to center */
.service-solutions-top-left-container,
div.service-solutions-top-left-container {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    margin: 0 auto !important;
    padding: 0 !important;
}

/* Force title to center - Multiple selectors */
.service-solutions-top-left-container h2,
.service-solutions-section h2,
div.service-solutions-top-left-container h2,
.service-solutions-container h2 {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    margin: 0 auto 0 auto !important;
    padding: 0 !important;
    font-size: 42px !important;
    font-weight: 700 !important;
    color: #000000 !important;
    line-height: 1.2 !important;
}

/* Hide right container completely */
.service-solutions-top-right-container,
div.service-solutions-top-right-container {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    opacity: 0 !important;
}

/* Content spacing - Reduce gap between heading and products */
.service-container-main,
div.service-container-main {
    margin: 15px auto 0 auto !important;
}

/* ========================================
   2. LANGUAGE SELECTOR - MAXIMUM FORCE VISIBLE
   ======================================== */

/* FORCE VISIBLE - All screen sizes first */
.desktop-nav .language-selector,
nav.desktop-nav .language-selector,
.language-selector,
div.language-selector,
.top-navbar .language-selector {
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative !important;
    margin-left: 10px !important;
    flex-shrink: 0 !important;
    z-index: 100000 !important;
    width: auto !important;
    height: auto !important;
    overflow: visible !important;
    max-width: none !important;
    min-width: 0 !important;
}

/* Desktop Navigation - Force visible */
@media (min-width: 1025px) {

    /* Language selector container - desktop specific */
    .desktop-nav .language-selector,
    nav.desktop-nav .language-selector,
    .language-selector,
    div.language-selector {
        display: inline-block !important;
        visibility: visible !important;
        opacity: 1 !important;
        position: relative !important;
        margin-left: 10px !important;
        flex-shrink: 0 !important;
        z-index: 100000 !important;
        width: auto !important;
        height: auto !important;
        overflow: visible !important;
    }

    /* Google translate element */
    #google_translate_element,
    div#google_translate_element,
    .language-selector #google_translate_element {
        display: inline-block !important;
        visibility: visible !important;
        opacity: 1 !important;
        width: auto !important;
        height: auto !important;
        overflow: visible !important;
    }

    /* Skiptranslate div */
    .skiptranslate,
    div.skiptranslate,
    #google_translate_element .skiptranslate {
        display: inline-block !important;
        visibility: visible !important;
        opacity: 1 !important;
        width: auto !important;
        height: auto !important;
    }

    /* Google translate gadget */
    .goog-te-gadget,
    div.goog-te-gadget,
    .skiptranslate .goog-te-gadget {
        display: inline-block !important;
        visibility: visible !important;
        opacity: 1 !important;
        color: transparent !important;
        line-height: normal !important;
        font-size: 0 !important;
    }

    /* The actual select dropdown - FORCE VISIBLE */
    select.goog-te-combo,
    .goog-te-combo,
    .goog-te-gadget select,
    #google_translate_element select,
    .skiptranslate select {
        display: inline-block !important;
        visibility: visible !important;
        opacity: 1 !important;
        position: relative !important;
        z-index: 100 !important;
        padding: 8px 14px !important;
        border: 2px solid #34530a !important;
        border-radius: 25px !important;
        font-family: Arial, sans-serif !important;
        font-size: 14px !important;
        font-weight: bold !important;
        color: #34530a !important;
        background: white !important;
        cursor: pointer !important;
        min-width: 145px !important;
        height: auto !important;
        width: auto !important;
        max-width: none !important;
    }

    /* Hide Google branding text but keep select */
    .goog-te-gadget > span {
        display: inline-block !important;
    }

    .goog-te-gadget > span > a,
    .goog-te-gadget img,
    .goog-logo-link {
        display: none !important;
        visibility: hidden !important;
    }

    /* Force combo box visible */
    .goog-te-gadget .goog-te-combo {
        display: inline-block !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    /* Remove any parent hiding */
    .skiptranslate {
        overflow: visible !important;
        clip: unset !important;
        clip-path: none !important;
        white-space: normal !important;
    }
}

/* ========================================
   3. GET A QUOTE BUTTON - CENTER TEXT
   ======================================== */

.get-a-quote-btn,
a.get-a-quote-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
}

.get-a-quote-btn span,
a.get-a-quote-btn span {
    display: inline-block !important;
    text-align: center !important;
}

/* ========================================
   4. ALL SECTION HEADERS - 0px TOP SPACING
   ======================================== */

/* All H2 headers - 0px top, 3px bottom */
.why-choose-us-container h2,
.clean-energy-left-container h2,
.service-solutions-section h2,
.our-expert-container h2,
.how-it-works-container h2,
.projects-container h2,
.testimonial-right-container h2,
.latest-news-container h2 {
    margin: 0 !important;
    padding: 0 0 3px 0 !important;
    text-align: center !important;
}

/* Content containers - 5px top spacing */
.why-choose-us-right-container,
.clean-energy-left-bottom-container,
.service-container-main,
.our-expert-grid-container,
.how-it-works-grid-container,
.projects-slider,
.masonry-grid {
    margin-top: 5px !important;
}

.testimonial-right-top-container {
    margin-bottom: 5px !important;
}

/* ========================================
   5. CONSISTENT SPACING - ALL SECTIONS LIKE "HOW WE OPERATE"
   0px top padding, 0px bottom padding, 30px margin-bottom
   ======================================== */

/* Hero Section */
.hero-slider-wrapper {
    padding: 0 !important;
    margin: 0 0 30px 0 !important;
}

/* Why Choose Us - Same as How We Operate */
.why-choose-us-container {
    padding: 0 40px 0 40px !important;
    margin: 0 auto 30px auto !important;
}

/* Who We Are - Same as How We Operate */
.clean-energy-section {
    padding: 0 40px 0 40px !important;
    margin: 0 auto 30px auto !important;
}

/* Our Products - Same as How We Operate */
.service-solutions-section,
div.service-solutions-section {
    padding: 0 40px 0 40px !important;
    margin: 0 auto 30px auto !important;
}

/* Our Services - Same as How We Operate */
.our-expert-container {
    padding: 0 40px 0 40px !important;
    margin: 0 auto 30px auto !important;
}

/* How We Operate - Reference Pattern */
.how-it-works-section,
div.how-it-works-section {
    padding: 0 40px 0 40px !important;
    margin: 0 auto 30px auto !important;
}

/* Our Gallery - Same as How We Operate */
.projects-container {
    padding: 0 40px 0 40px !important;
    margin: 0 auto 30px auto !important;
}

/* Testimonials - Same as How We Operate */
.testimonial-container {
    padding: 0 40px 0 40px !important;
    margin: 0 auto 30px auto !important;
}

/* Latest News - Same as How We Operate (last section, extra bottom padding) */
.latest-news-container {
    padding: 0 40px 30px 40px !important;
    margin: 0 auto 0 auto !important;
}

/* ========================================
   5. MOBILE - Language Selector
   ======================================== */

@media (max-width: 1024px) {
    #google_translate_element_mobile {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        width: 100% !important;
    }

    #google_translate_element_mobile select,
    #google_translate_element_mobile .goog-te-combo {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        width: 100% !important;
        padding: 10px 12px !important;
        border: 2px solid #34530a !important;
        border-radius: 8px !important;
    }
}
/* ====================================
   FORCE EXACT SAME SPACING - ALL SECTIONS
   MAXIMUM PRIORITY - ULTRA AGGRESSIVE
   ==================================== */

/* ========================================
   RESET EVERYTHING TO ZERO FIRST
   ======================================== */

* [class*="container"],
* [class*="section"],
.hero-slider-wrapper,
.why-choose-us-container,
.clean-energy-section,
.service-solutions-section,
.our-expert-container,
.how-it-works-section,
.projects-container,
.testimonial-container,
.latest-news-container {
    box-sizing: border-box !important;
}

/* ========================================
   FORCE EXACT SAME PATTERN - ALL SECTIONS
   0px top, 0px bottom, 40px left/right, 30px margin-bottom
   ======================================== */

/* Hero Section */
.hero-slider-wrapper {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
    padding-left: 0px !important;
    padding-right: 0px !important;
    margin-top: 0px !important;
    margin-bottom: 30px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* Why Choose Us */
.why-choose-us-container,
div.why-choose-us-container {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
    padding-left: 40px !important;
    padding-right: 40px !important;
    margin-top: 0px !important;
    margin-bottom: 30px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    max-width: 100% !important;
}

/* Who We Are / Clean Energy - SLIGHTLY REDUCED HEIGHT */
.clean-energy-section,
div.clean-energy-section {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
    margin-top: 0px !important;
    margin-bottom: 30px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    max-width: 100% !important;
}

/* Who We Are container - slight reduction */
.clean-energy-container,
div.clean-energy-container {
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 25px 20px 20px 20px !important;
}

/* Left section (title + image) - slight reduction */
.clean-energy-left-container,
div.clean-energy-left-container {
    flex: 1 1 350px !important;
    max-width: 400px !important;
    padding: 10px !important;
}

/* Star/main image - SLIGHTLY SMALLER */
.clean-energy-star-container,
div.clean-energy-star-container {
    max-height: 360px !important;
    overflow: hidden !important;
}

.clean-energy-star-container img {
    width: 100% !important;
    max-height: 360px !important;
    object-fit: contain !important;
}

/* Right section (3 frames) - slight reduction */
.clean-energy-right-container,
div.clean-energy-right-container {
    flex: 1 1 750px !important;
    padding: 10px !important;
    gap: 12px !important;
}

/* Individual frames - SLIGHTLY SMALLER */
.clean-energy-financial-savings,
div.clean-energy-financial-savings {
    padding: 14px !important;
    gap: 8px !important;
    margin: 0 !important;
}

/* Frame icons - keep original size */
.clean-energy-financial-savings img {
    width: 55px !important;
    height: 55px !important;
    max-width: 55px !important;
    max-height: 55px !important;
}

/* Frame titles - slightly smaller */
.clean-energy-financial-savings h3 {
    font-size: 15px !important;
    line-height: 1.3 !important;
    margin: 8px 0 6px 0 !important;
}

/* Frame descriptions - keep readable */
.clean-energy-financial-savings p {
    font-size: 13px !important;
    line-height: 1.4 !important;
    margin: 0 !important;
}

/* Our Products / Service Solutions */
.service-solutions-section,
div.service-solutions-section {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
    padding-left: 40px !important;
    padding-right: 40px !important;
    margin-top: 0px !important;
    margin-bottom: 30px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    max-width: 100% !important;
}

/* Our Services / Our Expert - NO TOP/BOTTOM PADDING + CENTERED */
.our-expert-container,
div.our-expert-container {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
    padding-left: 40px !important;
    padding-right: 40px !important;
    margin-top: 0px !important;
    margin-bottom: 30px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    max-width: 100% !important;
    text-align: center !important;
    display: block !important;
}

/* Our Services Title - FORCE CENTERED */
body .our-expert-container h2,
div.our-expert-container h2,
.our-expert-container > h2 {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    width: 100% !important;
    display: block !important;
}

/* Our Services Grid - CENTERED */
body .our-expert-grid-container,
div.our-expert-grid-container {
    margin-left: auto !important;
    margin-right: auto !important;
    max-width: 1320px !important;
}

/* How We Operate / How It Works */
.how-it-works-section,
div.how-it-works-section {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
    padding-left: 40px !important;
    padding-right: 40px !important;
    margin-top: 0px !important;
    margin-bottom: 30px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    max-width: 100% !important;
}

/* Our Gallery / Projects - SAME PADDING AS OUR SERVICES + CENTERED */
.projects-container,
div.projects-container {
    padding-top: 50px !important;
    padding-bottom: 50px !important;
    padding-left: 40px !important;
    padding-right: 40px !important;
    margin-top: 0px !important;
    margin-bottom: 30px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    max-width: 100% !important;
    text-align: center !important;
    display: block !important;
}

/* Our Gallery Title - FORCE CENTERED */
body .projects-container h2,
div.projects-container h2,
.projects-container > h2 {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    width: 100% !important;
    display: block !important;
}

/* Our Gallery Slider - CENTERED & VISIBLE */
body .projects-slider,
div.projects-slider {
    margin-left: auto !important;
    margin-right: auto !important;
    max-width: 1320px !important;
}

/* Gallery slider - show after initialization */
.projects-slider.slick-initialized {
    opacity: 1 !important;
    height: auto !important;
    overflow: visible !important;
    display: block !important;
    visibility: visible !important;
}

/* Gallery cards - always visible */
.projects-card,
.projects-card img,
.project-main-img {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Testimonials */
.testimonial-container,
div.testimonial-container {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
    padding-left: 40px !important;
    padding-right: 40px !important;
    margin-top: 0px !important;
    margin-bottom: 30px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    max-width: 100% !important;
}

/* Latest News - Last Section */
.latest-news-container,
div.latest-news-container {
    padding-top: 0px !important;
    padding-bottom: 40px !important;
    padding-left: 40px !important;
    padding-right: 40px !important;
    margin-top: 0px !important;
    margin-bottom: 0px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    max-width: 100% !important;
}

/* ========================================
   REMOVE ALL CONFLICTING MARGINS/PADDINGS
   ======================================== */

/* Remove utility classes that add spacing */
.mb-50 {
    margin-bottom: 0px !important;
}

.mt-50 {
    margin-top: 0px !important;
}

.pt-50 {
    padding-top: 0px !important;
}

.pb-50 {
    padding-bottom: 0px !important;
}

/* Remove any margin/padding from inner containers */
.service-solutions-container,
.how-it-works-container,
.clean-energy-container,
.our-expert-grid-container,
.projects-slider,
.testimonial-right-container {
    margin-top: 0px !important;
    padding-top: 0px !important;
}

/* ========================================
   SPECIFIC TITLE SPACING ADJUSTMENTS
   More space after "Our Services" and "Our Most Recent Posts"
   ======================================== */

/* Our Services - More space above and after title */
.our-expert-container h2 {
    margin-top: 20px !important;
    margin-bottom: 15px !important;
    padding-top: 0px !important;
    padding-bottom: 0px !important;
}

.our-expert-grid-container {
    margin-top: 15px !important;
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 30px !important;
}

/* Responsive grid for tablets and mobile */
@media (max-width: 1024px) {
    .our-expert-grid-container {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

@media (max-width: 768px) {
    .our-expert-grid-container {
        grid-template-columns: 1fr !important;
    }
}

/* Our Services Cards - SMALLER HEIGHT (Top to Bottom) */
.our-expert-grid-card,
div.our-expert-grid-card {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    min-height: 350px !important;
    max-height: 350px !important;
    background: white !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1) !important;
}

/* Our Services Image - SMALLER Height */
.our-expert-grid-card img,
.our-expert-grid-card .our-expert-img {
    width: 100% !important;
    height: 160px !important;
    min-height: 160px !important;
    max-height: 160px !important;
    object-fit: cover !important;
    display: block !important;
}

/* Our Services Content - SMALLER Height */
.our-expert-grid-card .our-expert-grid-content,
.our-expert-grid-content {
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    padding: 15px !important;
    height: 190px !important;
    min-height: 190px !important;
    max-height: 190px !important;
}

/* Our Services Title - SMALLER */
.our-expert-grid-content h3 {
    font-size: 18px !important;
    font-weight: bold !important;
    color: #333 !important;
    margin: 0 0 8px 0 !important;
    line-height: 1.3 !important;
    min-height: 46px !important;
    max-height: 46px !important;
    overflow: hidden !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
}

/* Our Services Description - FEWER LINES */
.our-expert-grid-content p {
    font-size: 13px !important;
    color: #666 !important;
    line-height: 1.5 !important;
    margin: 0 !important;
    flex: 1 !important;
    overflow: hidden !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 4 !important;
    -webkit-box-orient: vertical !important;
}

/* Our Most Recent Posts / Latest News - More space above and after title */
.latest-news-container h2 {
    margin-top: 20px !important;
    margin-bottom: 15px !important;
    padding-top: 0px !important;
    padding-bottom: 0px !important;
}

.masonry-grid {
    margin-top: 15px !important;
}

/* Our Gallery - More space above title */
.projects-container h2 {
    margin-top: 20px !important;
    padding-top: 0px !important;
}

/* ========================================
   OUR MOST RECENT POSTS - INCREASE CARD WIDTH
   Make cards wider horizontally
   ======================================== */

/* Blog/News Cards - Wider horizontally */
.latest-news-grid-card,
div.latest-news-grid-card {
    width: 100% !important;
    max-width: 450px !important;
    min-width: 350px !important;
    margin: 0 auto 20px auto !important;
}

/* Masonry grid - Adjust columns for wider cards */
.masonry-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(350px, 450px)) !important;
    gap: 30px !important;
    justify-content: center !important;
}

/* Blog card image */
.latest-news-grid-card img {
    width: 100% !important;
    height: 250px !important;
    object-fit: cover !important;
}

/* Blog card content */
.latest-news-grid-card .latest-news-grid-content {
    padding: 20px !important;
}

/* Blog card title */
.latest-news-grid-card h3 {
    font-size: 18px !important;
    font-weight: bold !important;
    margin: 0 0 10px 0 !important;
}

/* Blog card description */
.latest-news-grid-card p {
    font-size: 14px !important;
    line-height: 1.6 !important;
}

/* ========================================
   OUR PRODUCTS - HIDE TITLE TEXT (already on images)
   ======================================== */

/* Product Card Title Section - SHOW TITLES */
.service-solutions-card .service-solutions-top-card-content,
.service-solutions-top-card-content,
div.service-solutions-top-card-content {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    height: auto !important;
    width: auto !important;
    padding: 15px !important;
    margin: 0 !important;
}

/* Show title text */
.service-solutions-top-card-content h3,
div.service-solutions-top-card-content h3,
.service-solutions-card .service-solutions-top-card-content h3 {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Keep decorative elements hidden */
.service-solutions-top-card-content::before,
.service-solutions-top-card-content::after,
div.service-solutions-top-card-content::before,
div.service-solutions-top-card-content::after {
    content: none !important;
    display: none !important;
}

/* ========================================
   OUR PRODUCTS - REVERTED TO ORIGINAL (NO CUSTOM STYLING)
   ======================================== */

/* ========================================
   OUR PRODUCTS - KEEP ORIGINAL SIZE, FIX LEARN MORE ONLY
   ======================================== */

/* DON'T CHANGE CARD SIZES - Let original CSS handle frame sizes */

/* Learn More button - 40px green strip, PERFECTLY CENTERED */
.learn-more-btn,
span.learn-more-btn {
    height: 40px !important;
    min-height: 40px !important;
    max-height: 40px !important;
    background: #34530a !important;
    color: white !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    white-space: nowrap !important;
    text-align: center !important;
    padding: 0 !important;
    margin: 0 auto !important;
    gap: 6px !important;
    font-size: 14px !important;
    font-weight: bold !important;
    box-sizing: border-box !important;
    position: relative !important;
    left: 0 !important;
    right: 0 !important;
}

/* Arrow icon - WHITE & SMALLER */
.learn-more-btn img {
    filter: brightness(0) invert(1) !important;
    width: 16px !important;
    height: 16px !important;
    max-width: 16px !important;
    max-height: 16px !important;
    display: inline-block !important;
}

/* Product card link - ensure centered container */
.service-solutions-card > a,
a.service-solutions-link {
    display: block !important;
    text-decoration: none !important;
    width: 100% !important;
}

/* Responsive - tablet (2 columns) */
@media (max-width: 1024px) {
    .service-container-main {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 25px !important;
    }
}

/* Responsive - mobile (1 column) */
@media (max-width: 768px) {
    .service-container-main {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }
}

/* ========================================
   FOOTER - DECREASE TEXT SIZE (NOT TITLES)
   ======================================== */

/* Footer text/links - smaller (NOT titles) */
footer p,
footer li,
footer a:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6),
footer span:not(.footer-title),
.footer-container p,
.footer-container li,
.footer-container a,
.footer-links a,
.footer-text,
.footer-menu li,
.footer-menu a,
.footer-contact p,
.footer-contact a,
.footer-info p {
    font-size: 13px !important;
    line-height: 1.6 !important;
}

/* Keep footer titles normal size */
footer h1,
footer h2,
footer h3,
footer h4,
footer h5,
footer h6,
.footer-title,
.footer-heading {
    font-size: inherit !important;
}

/* ========================================
   RESPONSIVE - SAME PATTERN FOR ALL DEVICES
   ======================================== */

/* Tablet */
@media (max-width: 1024px) {
    .why-choose-us-container,
    .clean-energy-section,
    .service-solutions-section,
    .our-expert-container,
    .how-it-works-section,
    .projects-container,
    .testimonial-container {
        padding-top: 0px !important;
        padding-bottom: 0px !important;
        padding-left: 30px !important;
        padding-right: 30px !important;
        margin-bottom: 30px !important;
    }

    .latest-news-container {
        padding-top: 0px !important;
        padding-bottom: 30px !important;
        padding-left: 30px !important;
        padding-right: 30px !important;
    }
}

/* Mobile */
@media (max-width: 768px) {
    .why-choose-us-container,
    .clean-energy-section,
    .service-solutions-section,
    .our-expert-container,
    .how-it-works-section,
    .projects-container,
    .testimonial-container {
        padding-top: 0px !important;
        padding-bottom: 0px !important;
        padding-left: 20px !important;
        padding-right: 20px !important;
        margin-bottom: 30px !important;
    }

    .latest-news-container {
        padding-top: 0px !important;
        padding-bottom: 30px !important;
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
}

/* ========================================
   FINAL OVERRIDE - CENTER SERVICE CARDS & HIDE LANGUAGE POPUP
   MAXIMUM PRIORITY - LOADS LAST
   ======================================== */

/* Center service cards on services page */
body .our-expert-grid-container,
div.our-expert-grid-container {
    justify-content: center !important;
    justify-items: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    max-width: 1400px !important;
}

/* Hide language popup after footer - MAXIMUM PRIORITY */
.goog-te-ftab,
#goog-gt-ftab,
.VIpgJd-ZVi9od-aZ2wEe-wOHMyf,
.VIpgJd-ZVi9od-aZ2wEe-OiiCO,
div[style*="position: fixed"][style*="bottom"],
div[style*="position:fixed"][style*="bottom"],
iframe[id^="goog-gt-"],
.skiptranslate iframe {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    position: absolute !important;
    left: -99999px !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    pointer-events: none !important;
}

/* ========================================
   DEBUG - Visual Check (Remove after testing)
   ======================================== */

/* Uncomment this to visually see section boundaries
.why-choose-us-container { border: 2px solid red !important; }
.clean-energy-section { border: 2px solid blue !important; }
.service-solutions-section { border: 2px solid green !important; }
.our-expert-container { border: 2px solid orange !important; }
.how-it-works-section { border: 2px solid purple !important; }
.projects-container { border: 2px solid pink !important; }
.testimonial-container { border: 2px solid brown !important; }
.latest-news-container { border: 2px solid cyan !important; }
*/

/* ========================================
   FINAL CRITICAL FIX - MUST BE LAST
   Force 4 columns for service cards on home page
   ======================================== */
body .our-expert-grid-container,
div.our-expert-grid-container,
.our-expert-container .our-expert-grid-container {
    grid-template-columns: repeat(4, 1fr) !important;
}

@media screen and (max-width: 1024px) {
    body .our-expert-grid-container,
    div.our-expert-grid-container,
    .our-expert-container .our-expert-grid-container {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

@media screen and (max-width: 768px) {
    body .our-expert-grid-container,
    div.our-expert-grid-container,
    .our-expert-container .our-expert-grid-container {
        grid-template-columns: 1fr !important;
    }
}
/* Custom Fixes for Globeswift Expo Website */

/* Fix: Center the Recent Posts - Force Center Alignment */
.latest-news-container {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.latest-news-container h2 {
    width: 100%;
}

.masonry-grid {
    display: flex !important;
    flex-wrap: wrap;
    justify-content: center;
    gap: 30px;
    column-count: unset !important;
    max-width: 1320px;
    margin: 0 auto;
}

.latest-news-grid-card {
    flex: 0 0 calc(25% - 30px);
    max-width: calc(25% - 30px);
    margin-bottom: 0 !important;
    break-inside: unset !important;
}

/* Responsive adjustments */
@media (max-width: 1200px) {
    .latest-news-grid-card {
        flex: 0 0 calc(33.333% - 30px);
        max-width: calc(33.333% - 30px);
    }
}

@media (max-width: 968px) {
    .latest-news-grid-card {
        flex: 0 0 calc(50% - 30px);
        max-width: calc(50% - 30px);
    }
}

@media (max-width: 576px) {
    .latest-news-grid-card {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .masonry-grid {
        gap: 20px;
    }
}
/* ========================================
   PREMIUM BANNER FIX - ALL PAGES
   ========================================
   Removes awkward decorative images and creates
   clean professional banners matching website theme
   ======================================== */

/* ========== HIDE OLD DECORATIVE IMAGES ========== */
.about-page-left-img,
.about-page-right-img,
.service-page-left-img,
.service-page-right-img,
.contact-page-left-img,
.contact-page-right-img,
.blog-page-left-img,
.blog-page-right-img,
.gallery-page-left-img,
.gallery-page-right-img,
.certificate-page-left-img,
.certificate-page-right-img,
.news-page-left-img,
.news-page-right-img,
.product-page-left-img,
.product-page-right-img {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
}

/* ========== PREMIUM BANNER STYLING ========== */
.common-page-wrapper {
    position: relative;
    background: linear-gradient(135deg, #5a8716 0%, #7ab82d 100%) !important;
    padding: 15px 20px !important;
    text-align: center !important;
    overflow: hidden !important;
    margin: 0 !important;
    min-height: auto;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Decorative Floating Circles */
.common-page-wrapper::before {
    content: '';
    position: absolute;
    top: -50%;
    right: -10%;
    width: 500px;
    height: 500px;
    background: rgba(255, 255, 255, 0.05);
    border-radius: 50%;
    animation: floatBanner 6s ease-in-out infinite;
    z-index: 1;
}

.common-page-wrapper::after {
    content: '';
    position: absolute;
    bottom: -30%;
    left: -5%;
    width: 400px;
    height: 400px;
    background: rgba(255, 255, 255, 0.05);
    border-radius: 50%;
    animation: floatBanner 8s ease-in-out infinite reverse;
    z-index: 1;
}

@keyframes floatBanner {
    0%, 100% {
        transform: translateY(0px) translateX(0px);
    }
    50% {
        transform: translateY(-20px) translateX(10px);
    }
}

/* Banner Container */
.common-page-container {
    position: relative !important;
    z-index: 2 !important;
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 0 20px !important;
}

/* Banner Title */
.common-page-container h1,
.common-page-wrapper h1 {
    font-size: 56px !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    margin-bottom: 20px !important;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.2) !important;
    letter-spacing: 1px !important;
    position: relative !important;
    z-index: 2 !important;
}

/* Optional Subtitle (if added) */
.page-subtitle,
.common-page-container p {
    font-size: 20px !important;
    color: rgba(255, 255, 255, 0.95) !important;
    margin: 0 !important;
    font-weight: 400 !important;
    letter-spacing: 0.5px !important;
    text-shadow: 0 1px 5px rgba(0, 0, 0, 0.2) !important;
    position: relative !important;
    z-index: 2 !important;
}

/* Breadcrumb (if exists) */
.breadcrumb {
    background: rgba(255, 255, 255, 0.1) !important;
    border-radius: 50px !important;
    padding: 10px 20px !important;
    display: inline-block !important;
    margin-top: 20px !important;
}

.breadcrumb a {
    color: rgba(255, 255, 255, 0.9) !important;
    text-decoration: none !important;
}

.breadcrumb a:hover {
    color: #ffffff !important;
}

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

/* Tablet (768px - 1024px) */
@media (max-width: 1024px) {
    .common-page-wrapper {
        padding: 80px 30px !important;
        min-height: 250px;
    }

    .common-page-container h1,
    .common-page-wrapper h1 {
        font-size: 48px !important;
    }

    .page-subtitle,
    .common-page-container p {
        font-size: 18px !important;
    }
}

/* Mobile (481px - 768px) */
@media (max-width: 768px) {
    .common-page-wrapper {
        padding: 60px 20px !important;
        min-height: 200px;
    }

    .common-page-container h1,
    .common-page-wrapper h1 {
        font-size: 40px !important;
        margin-bottom: 15px !important;
    }

    .page-subtitle,
    .common-page-container p {
        font-size: 16px !important;
    }

    .common-page-wrapper::before,
    .common-page-wrapper::after {
        width: 300px;
        height: 300px;
    }
}

/* Small Mobile (up to 480px) */
@media (max-width: 480px) {
    .common-page-wrapper {
        padding: 50px 15px !important;
        min-height: 180px;
    }

    .common-page-container h1,
    .common-page-wrapper h1 {
        font-size: 32px !important;
        margin-bottom: 10px !important;
        letter-spacing: 0.5px !important;
    }

    .page-subtitle,
    .common-page-container p {
        font-size: 14px !important;
    }

    .common-page-wrapper::before,
    .common-page-wrapper::after {
        width: 200px;
        height: 200px;
    }
}

/* ========== ADDITIONAL ENHANCEMENTS ========== */

/* Subtle Pattern Overlay */
.common-page-wrapper::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image:
        repeating-linear-gradient(
            45deg,
            transparent,
            transparent 10px,
            rgba(255, 255, 255, 0.02) 10px,
            rgba(255, 255, 255, 0.02) 20px
        );
    z-index: 0;
    pointer-events: none;
}

/* Premium Glow Effect on Hover */
.common-page-wrapper:hover h1 {
    text-shadow: 0 4px 20px rgba(255, 255, 255, 0.3),
                 0 2px 10px rgba(0, 0, 0, 0.2) !important;
    transition: text-shadow 0.3s ease;
}

/* Fade-in Animation */
.common-page-wrapper {
    animation: fadeInBanner 0.8s ease-out;
}

@keyframes fadeInBanner {
    from {
        opacity: 0;
        transform: translateY(-20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ========== FIX FOR SPECIFIC PAGES ========== */

/* Services Page */
.service-page-wrapper .common-page-wrapper {
    background: linear-gradient(135deg, #5a8716 0%, #7ab82d 100%) !important;
}

/* Products Page */
.product-page-wrapper .common-page-wrapper {
    background: linear-gradient(135deg, #5a8716 0%, #7ab82d 100%) !important;
}

/* Gallery Page */
.gallery-page-wrapper .common-page-wrapper {
    background: linear-gradient(135deg, #5a8716 0%, #7ab82d 100%) !important;
}

/* Certificates Page */
.certificate-page-wrapper .common-page-wrapper {
    background: linear-gradient(135deg, #5a8716 0%, #7ab82d 100%) !important;
}

/* Contact Page */
.contact-page-wrapper .common-page-wrapper {
    background: linear-gradient(135deg, #5a8716 0%, #7ab82d 100%) !important;
}

/* Blog/News Page */
.blog-page-wrapper .common-page-wrapper,
.news-page-wrapper .common-page-wrapper {
    background: linear-gradient(135deg, #5a8716 0%, #7ab82d 100%) !important;
}

/* ========== FORCE OVERRIDE ========== */

/* Remove any background images */
.common-page-wrapper,
.common-page-wrapper * {
    background-image: none !important;
}

/* Ensure clean look */
.common-page-wrapper img[class*="page-left"],
.common-page-wrapper img[class*="page-right"] {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    position: absolute !important;
    left: -9999px !important;
}

/* ========== CRITICAL FIX - FORCE PRODUCTS & GALLERY VISIBLE ========== */

/* Force Products section to be visible */
.service-solutions-section,
.service-container-main,
.service-solutions-bottom-container,
.service-solutions-autoplay {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    height: auto !important;
    min-height: 300px !important;
    overflow: visible !important;
}

/* Force Gallery section to be visible */
.projects-container,
.projects-slider {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    height: auto !important;
    min-height: 300px !important;
    overflow: visible !important;
}

/* Force product cards to display */
.service-solutions-card,
.service-solutions-card-link {
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 300px !important;
    margin: 10px !important;
    vertical-align: top !important;
}

/* Force gallery cards to display */
.projects-card {
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 250px !important;
    margin: 10px !important;
    vertical-align: top !important;
}

/* Show product images */
.service-solutions-bottom-card-content,
.service-solutions-img {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Show gallery images */
.project-main-img {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Fallback grid layout if slick fails */
.service-solutions-autoplay,
.projects-slider {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 20px !important;
    width: 100% !important;
}

/* ========================================
   FINAL FIX - WHO WE ARE BOTTOM ALIGNMENT
   MAXIMUM PRIORITY - LOADS LAST
   ALL 4 FRAMES ALIGNED AT BOTTOM
   ======================================== */

/* Container - align all items to bottom for equal height */
body .clean-energy-section .clean-energy-container,
div.clean-energy-section div.clean-energy-container,
.clean-energy-section > .clean-energy-container {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: stretch !important;
    justify-content: space-between !important;
    gap: 25px !important;
    max-width: 1320px !important;
    margin: 0 auto !important;
    padding: 20px !important;
}

/* Left container - image section - FULL HEIGHT */
body .clean-energy-section .clean-energy-left-container,
div.clean-energy-section div.clean-energy-left-container,
.clean-energy-section > .clean-energy-container > .clean-energy-left-container {
    flex: 0 0 auto !important;
    width: 400px !important;
    max-width: 400px !important;
    min-width: 400px !important;
    display: flex !important;
    flex-direction: column !important;
    align-self: stretch !important;
    align-items: center !important;
    justify-content: flex-start !important;
}

/* Title - CENTERED - SAME HEIGHT AS TOP OF CARDS */
body .clean-energy-section .clean-energy-left-container h2,
div.clean-energy-section div.clean-energy-left-container h2 {
    font-size: 36px !important;
    font-weight: bold !important;
    color: #222 !important;
    margin: 0 auto 15px auto !important;
    padding: 0 !important;
    text-align: center !important;
    width: 100% !important;
    height: auto !important;
    line-height: 1.2 !important;
}

/* Image wrapper containers - FILL REMAINING HEIGHT */
body .clean-energy-section .clean-energy-left-bottom-container,
body .clean-energy-section .clean-energy-content-container,
body .clean-energy-section .clean-energy-star-container {
    width: 100% !important;
    display: flex !important;
    flex: 1 !important;
    margin: 0 !important;
    padding: 0 !important;
    position: relative !important;
    flex-direction: column !important;
}

/* The main image - FLEXIBLE HEIGHT TO MATCH CARDS */
body .clean-energy-section .clean-energy-star-container img,
body .clean-energy-section .clean-energy-content-container img,
div.clean-energy-section div.clean-energy-star-container img,
div.clean-energy-section div.clean-energy-content-container img {
    width: 100% !important;
    height: 100% !important;
    max-height: none !important;
    min-height: auto !important;
    object-fit: cover !important;
    border-radius: 12px !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 2px solid #e8e8e8 !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.08) !important;
    flex: 1 !important;
}

/* Right container - 3 cards - STRETCH TO FULL HEIGHT */
body .clean-energy-section .clean-energy-right-container,
div.clean-energy-section div.clean-energy-right-container,
.clean-energy-section > .clean-energy-container > .clean-energy-right-container {
    flex: 1 !important;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    gap: 20px !important;
    align-items: stretch !important;
    align-self: stretch !important;
    justify-content: space-between !important;
}

/* Individual card frames - AUTO HEIGHT TO MATCH IMAGE */
body .clean-energy-section .clean-energy-financial-savings,
div.clean-energy-section div.clean-energy-financial-savings,
.clean-energy-section .clean-energy-right-container .clean-energy-financial-savings {
    flex: 1 !important;
    min-width: 0 !important;
    height: auto !important;
    max-height: none !important;
    min-height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;
    padding: 20px 15px !important;
    background: rgba(255, 255, 255, 0.95) !important;
    border-radius: 12px !important;
    border: 2px solid #e8e8e8 !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.08) !important;
    text-align: center !important;
    margin: 0 !important;
}

/* Card icons */
body .clean-energy-section .clean-energy-financial-savings img {
    width: 60px !important;
    height: 60px !important;
    max-width: 60px !important;
    max-height: 60px !important;
    margin: 0 auto 15px auto !important;
    object-fit: contain !important;
}

/* Card titles */
body .clean-energy-section .clean-energy-financial-savings h3 {
    font-size: 18px !important;
    font-weight: bold !important;
    color: #222 !important;
    margin: 0 0 12px 0 !important;
    line-height: 1.3 !important;
    padding: 0 5px !important;
}

/* Card descriptions */
body .clean-energy-section .clean-energy-financial-savings p {
    font-size: 14px !important;
    color: #666 !important;
    line-height: 1.5 !important;
    margin: 0 !important;
    padding: 0 5px !important;
}

/* Responsive - Tablet (stack vertically) */
@media (max-width: 1024px) {
    body .clean-energy-section .clean-energy-container,
    div.clean-energy-section div.clean-energy-container {
        flex-direction: column !important;
        align-items: center !important;
    }

    body .clean-energy-section .clean-energy-left-container,
    div.clean-energy-section div.clean-energy-left-container {
        width: 100% !important;
        max-width: 100% !important;
        min-width: auto !important;
        margin-bottom: 30px !important;
    }

    body .clean-energy-section .clean-energy-right-container,
    div.clean-energy-section div.clean-energy-right-container {
        width: 100% !important;
        flex-wrap: wrap !important;
    }

    body .clean-energy-section .clean-energy-financial-savings {
        flex: 0 0 calc(33.333% - 20px) !important;
        min-width: 250px !important;
    }
}

/* Responsive - Mobile (full width cards) */
@media (max-width: 768px) {
    body .clean-energy-section .clean-energy-right-container,
    div.clean-energy-section div.clean-energy-right-container {
        flex-direction: column !important;
    }

    body .clean-energy-section .clean-energy-financial-savings,
    div.clean-energy-section div.clean-energy-financial-savings {
        width: 100% !important;
        flex: 1 1 auto !important;
        height: auto !important;
        min-height: 250px !important;
        max-height: none !important;
    }

    body .clean-energy-section .clean-energy-star-container img,
    body .clean-energy-section .clean-energy-content-container img {
        height: 300px !important;
        max-height: 300px !important;
        min-height: 300px !important;
    }
}

/* ========================================
   OUR PRODUCTS - SAME AS SERVICES & GALLERY
   MAXIMUM PRIORITY - LOADS LAST
   ======================================== */

/* Our Products Section - MINIMAL TOP/BOTTOM PADDING + CENTERED */
body .service-solutions-section,
div.service-solutions-section {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
    padding-left: 40px !important;
    padding-right: 40px !important;
    margin-top: 0px !important;
    margin-bottom: 30px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    max-width: 100% !important;
    text-align: center !important;
    display: block !important;
}

/* Remove excessive spacing after "Our Products" title */
body .service-solutions-section .service-solutions-top-container,
div.service-solutions-section div.service-solutions-top-container {
    margin-bottom: 0px !important;
    padding-bottom: 0 !important;
    text-align: center !important;
}

body .service-solutions-section .service-solutions-top-left-container h2,
div.service-solutions-section div.service-solutions-top-left-container h2 {
    margin-bottom: 0px !important;
    padding-bottom: 0 !important;
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    width: 100% !important;
}

/* Container for product slider - CENTERED WITHIN 1320px */
body .service-solutions-section .service-container-main,
div.service-solutions-section div.service-container-main {
    max-width: 1320px !important;
    width: 100% !important;
    margin: 10px auto 0 auto !important;
    padding: 0 20px !important;
    box-sizing: border-box !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* Product slider wrapper - HIDE UNTIL SLICK INITIALIZED */
body .service-solutions-section .service-solutions-bottom-container,
div.service-solutions-section div.service-solutions-bottom-container {
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
}

/* Hide products slider before slick initialization to prevent FOUC */
.service-solutions-autoplay:not(.slick-initialized) {
    opacity: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
}

/* Show products slider after slick initialization */
.service-solutions-autoplay.slick-initialized {
    opacity: 1 !important;
    height: auto !important;
    overflow: visible !important;
    transition: opacity 0.3s ease-in !important;
}

/* Slick slider list - prevent overflow */
body .service-solutions-autoplay.slick-initialized .slick-list,
div.service-solutions-autoplay.slick-initialized .slick-list {
    overflow: hidden !important;
    padding: 20px 0 !important;
    margin: 0 !important;
}

/* Slick track - proper alignment */
body .service-solutions-autoplay .slick-track,
div.service-solutions-autoplay .slick-track {
    display: flex !important;
    align-items: center !important;
    margin: 0 !important;
}

/* Product slides - INCREASED HORIZONTAL SIZE */
body .service-solutions-autoplay .slick-slide,
div.service-solutions-autoplay .slick-slide {
    margin: 0 5px !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    padding: 0 5px !important;
}

/* Product card container - LARGER SIZE */
body .service-solutions-card-link,
div.service-solutions-card-link,
a.service-solutions-card-link {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
}

/* Product card - LARGER SIZE to match product page */
body .service-solutions-card,
div.service-solutions-card {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
}

/* Product image - maintain aspect ratio */
body .service-solutions-card .service-solutions-img,
div.service-solutions-card .service-solutions-img {
    width: 100% !important;
    height: auto !important;
    min-height: 280px !important;
    border-radius: 20px !important;
}

/* HIDE Slider arrows - NOT REQUIRED */
body .service-solutions-autoplay .slick-prev,
div.service-solutions-autoplay .slick-prev,
body .service-solutions-autoplay .slick-next,
div.service-solutions-autoplay .slick-next {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/* Responsive - Tablet */
@media (max-width: 1024px) {
    body .service-solutions-section .service-container-main,
    div.service-solutions-section div.service-container-main {
        padding: 0 20px !important;
    }
}

/* Responsive - Mobile */
@media (max-width: 768px) {
    body .service-solutions-section .service-container-main,
    div.service-solutions-section div.service-container-main {
        padding: 0 20px !important;
    }
}

/* ========================================
   OUR GALLERY - SAME AS PRODUCTS (CONTAINED WIDTH)
   MAXIMUM PRIORITY - LOADS LAST
   ======================================== */

/* Gallery slider wrapper - CONTAINED WIDTH like products */
body .projects-container .projects-slider,
div.projects-container div.projects-slider {
    max-width: 1320px !important;
    width: 100% !important;
    margin: 10px auto 0 auto !important;
    padding: 0 20px !important;
    box-sizing: border-box !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* HIDE Gallery slider arrows - NOT REQUIRED */
body .projects-slider .slick-prev,
div.projects-slider .slick-prev,
body .projects-slider .slick-next,
div.projects-slider .slick-next {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/* Responsive - Tablet */
@media (max-width: 1024px) {
    body .projects-container .projects-slider,
    div.projects-container div.projects-slider {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
}

/* Responsive - Mobile */
@media (max-width: 768px) {
    body .projects-container .projects-slider,
    div.projects-container div.projects-slider {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
}

/* ========================================
   FINAL GALLERY FIX - ULTRA HIGH PRIORITY
   MUST LOAD LAST - OVERRIDES EVERYTHING
   SAME STRUCTURE AS PRODUCTS
   ======================================== */

/* Gallery container wrapper - SAME AS PRODUCTS */
body .gallery-container-main,
div.gallery-container-main,
.projects-container .gallery-container-main {
    max-width: 1320px !important;
    width: 100% !important;
    margin: 10px auto 0 auto !important;
    padding: 0 20px !important;
    box-sizing: border-box !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* Gallery slider - FORCE 20px padding (NOT 60px or 40px) */
body .projects-slider,
div.projects-slider,
.gallery-container-main .projects-slider,
body .gallery-container-main .projects-slider,
div.gallery-container-main div.projects-slider {
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
    position: relative !important;
}

/* ========== SUMMARY ========== */
/*
This CSS file:
1. ✅ Hides all awkward decorative images (hands, solar panels, etc.)
2. ✅ Creates clean green gradient banners
3. ✅ Adds floating circle decorations
4. ✅ Makes banners responsive
5. ✅ Adds subtle animations
6. ✅ Matches website green theme perfectly
7. ✅ Works on ALL pages (About, Services, Products, Gallery, etc.)
8. ✅ Premium professional appearance
9. ✅ Mobile optimized
10. ✅ Easy to maintain
11. ✅ Forces Products & Gallery sections visible
12. ✅ WHO WE ARE SECTION - ALL 4 FRAMES BOTTOM ALIGNED
13. ✅ OUR PRODUCTS - REDUCED SPACING & SLIDER WIDTH FIXED
14. ✅ OUR GALLERY - CONTAINED WIDTH 1320px (NOT FULL SCREEN)
*/