/* Journals Hero - Image Only Design - FINAL OVERRIDE */
/* Remove all backgrounds and text, show only the hero image */
/* HIGHEST SPECIFICITY TO OVERRIDE wiseleaf-page-fixes.css */

html body section.journals-header,
html body .journals-header,
section.journals-header {
    /* FORCE remove all backgrounds with highest specificity */
    background: none !important;
    background-color: transparent !important;
    background-image: none !important;
    
    /* Override any gradient backgrounds */
    background: transparent !important;
    
    /* Set proper dimensions for hero image */
    min-height: 400px !important;
    height: 400px !important;
    width: 100% !important;
    
    /* Ensure background image properties are ready */
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    
    /* Remove padding and positioning */
    padding: 0 !important;
    margin: 0 !important;
    
    /* Position relative for any overlay elements */
    position: relative !important;
    
    /* Smooth transition */
    transition: all 0.3s ease !important;
}

/* Hide any text elements that might still exist */
html body .journals-header h1,
html body .journals-header p,
html body .journals-header * {
    display: none !important;
}

/* Ensure the hero image fills the space properly when applied by JS */
html body section.journals-header[style*="background-image"],
html body .journals-header[style*="background-image"],
section.journals-header[style*="background-image"] {
    background-color: transparent !important;
}

/* Responsive adjustments with high specificity */
@media (max-width: 768px) {
    html body section.journals-header,
    html body .journals-header,
    section.journals-header {
        min-height: 300px !important;
        height: 300px !important;
    }
}

@media (max-width: 480px) {
    html body section.journals-header,
    html body .journals-header,
    section.journals-header {
        min-height: 250px !important;
        height: 250px !important;
    }
}