/**
 * Hero Section Specific Overrides
 * Higher specificity to override any parent theme styles
 */

body .hero-section,
.wp-block-group.hero-section,
div.hero-section {
    background-color: var(--theme-background-color) !important;
    background-image: none !important;
    background: var(--theme-background-color) !important;
}

/* Target specifically when inside the WordPress editor */
.editor-styles-wrapper .wp-block-group.hero-section {
    background-color: var(--theme-background-color) !important;
    background-image: none !important;
    background: var(--theme-background-color) !important;
}

/* Also ensure any inner containers don't have gradients */
.hero-section .container-responsive {
    background-color: var(--theme-background-color) !important;
    background-image: none !important;
    background: var(--theme-background-color) !important;
}