/* ==================== WENNAWOOD HOMEPAGE HEADERS STYLING ==================== */

.homepage-group-title.homepage-products-heading-2.h4 {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 2.5rem !important;
    font-weight: 700 !important;
    color: #8B7355 !important;
    text-align: center !important;
    margin: 3rem 0 2rem 0 !important;
    position: relative !important;
    padding: 1.5rem 2rem !important;
    background: linear-gradient(135deg, rgba(139, 115, 85, 0.05) 0%, rgba(178, 159, 148, 0.03) 100%) !important;
    border-radius: 16px !important;
    box-shadow: 0 4px 20px rgba(139, 115, 85, 0.1) !important;
    overflow: hidden !important;
    text-shadow: 0 2px 8px rgba(139, 115, 85, 0.1) !important;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
}

/* Decorative top border */
.homepage-group-title.homepage-products-heading-2.h4::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 4px !important;
    background: linear-gradient(90deg, #8B7355 0%, #B29F94 50%, #8B7355 100%) !important;
    border-radius: 16px 16px 0 0 !important;
}

/* Decorative accent elements */
.homepage-group-title.homepage-products-heading-2.h4::after {
    content: '' !important;
    position: absolute !important;
    top: 50% !important;
    left: 1rem !important;
    transform: translateY(-50%) !important;
    width: 6px !important;
    height: 6px !important;
    background: #B29F94 !important;
    border-radius: 50% !important;
    box-shadow: 
        12px 0 0 #B29F94,
        24px 0 0 #8B7355,
        calc(100% - 24px) 0 0 #8B7355,
        calc(100% - 12px) 0 0 #B29F94,
        calc(100% - 6px) 0 0 #B29F94 !important;
}

/* Hover effect */
.homepage-group-title.homepage-products-heading-2.h4:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 30px rgba(139, 115, 85, 0.15) !important;
    background: linear-gradient(135deg, rgba(139, 115, 85, 0.08) 0%, rgba(178, 159, 148, 0.05) 100%) !important;
    color: #654321 !important;
}

/* Mobile responsiveness */
@media (max-width: 768px) {
    .homepage-group-title.homepage-products-heading-2.h4 {
        font-size: 2rem !important;
        padding: 1.25rem 1.5rem !important;
        margin: 2rem 1rem 1.5rem 1rem !important;
        border-radius: 12px !important;
    }
    
    .homepage-group-title.homepage-products-heading-2.h4::before {
        border-radius: 12px 12px 0 0 !important;
    }
    
    .homepage-group-title.homepage-products-heading-2.h4::after {
        left: 0.75rem !important;
        box-shadow: 
            8px 0 0 #B29F94,
            16px 0 0 #8B7355,
            calc(100% - 16px) 0 0 #8B7355,
            calc(100% - 8px) 0 0 #B29F94,
            calc(100% - 6px) 0 0 #B29F94 !important;
    }
}

@media (max-width: 480px) {
    .homepage-group-title.homepage-products-heading-2.h4 {
        font-size: 1.75rem !important;
        padding: 1rem 1.25rem !important;
        margin: 1.5rem 0.5rem !important;
    }
    
    .homepage-group-title.homepage-products-heading-2.h4::after {
        display: none !important;
    }
}

/* ==================== ALTERNATIVE MINIMALIST VERSION ==================== */

/* Uncomment this section and comment out the above if you prefer a cleaner look */

/*
.homepage-group-title.homepage-products-heading-2.h4 {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 2.25rem !important;
    font-weight: 700 !important;
    color: #8B7355 !important;
    text-align: center !important;
    margin: 2.5rem 0 1.5rem 0 !important;
    position: relative !important;
    padding: 0.75rem 0 !important;
    border-bottom: 3px solid #B29F94 !important;
    text-shadow: 0 1px 3px rgba(139, 115, 85, 0.1) !important;
}

.homepage-group-title.homepage-products-heading-2.h4::before {
    content: '' !important;
    position: absolute !important;
    bottom: -3px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: 60px !important;
    height: 3px !important;
    background: #8B7355 !important;
}
*/

/* ==================== DARK MODE SUPPORT ==================== */

@media (prefers-color-scheme: dark) {
    .homepage-group-title.homepage-products-heading-2.h4 {
        color: #DEB887 !important;
        background: linear-gradient(135deg, rgba(178, 159, 148, 0.08) 0%, rgba(139, 115, 85, 0.05) 100%) !important;
        text-shadow: 0 2px 8px rgba(0, 0, 0, 0.3) !important;
    }
    
    .homepage-group-title.homepage-products-heading-2.h4:hover {
        color: #F4A460 !important;
        background: linear-gradient(135deg, rgba(178, 159, 148, 0.12) 0%, rgba(139, 115, 85, 0.08) 100%) !important;
    }
}

/* ==================== ACCESSIBILITY ENHANCEMENTS ==================== */

@media (prefers-reduced-motion: reduce) {
    .homepage-group-title.homepage-products-heading-2.h4,
    .homepage-group-title.homepage-products-heading-2.h4:hover {
        transition: none !important;
        transform: none !important;
    }
}

@media (prefers-contrast: high) {
    .homepage-group-title.homepage-products-heading-2.h4 {
        color: #654321 !important;
        background: rgba(139, 115, 85, 0.1) !important;
        border: 2px solid #8B7355 !important;
    }
    
    .homepage-group-title.homepage-products-heading-2.h4::before {
        background: #654321 !important;
    }
    
    .homepage-group-title.homepage-products-heading-2.h4::after {
        background: #654321 !important;
        box-shadow: 
            12px 0 0 #654321,
            24px 0 0 #654321,
            calc(100% - 24px) 0 0 #654321,
            calc(100% - 12px) 0 0 #654321,
            calc(100% - 6px) 0 0 #654321 !important;
    }
}