/**
 * Menu Position Styles
 * Styles for the menu-above-hero feature
 * 
 * NOTE: This file is being gradually replaced by the new menu-above-hero.css file.
 * The new file contains improved styles that are only loaded on the front page.
 * This file is kept for backward compatibility during the transition period.
 * 
 * !IMPORTANT: The styles in this file should NOT be applied to the front page
 * when the menu-above-hero.css file is loaded.
 */

/* 
 * When menu below hero is enabled (default)
 * Remove any gaps between header and hero
 */
.menu-below-hero .site-header,
body.menu-below-hero .site-header,
header:not(.menu-above-hero) {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

.menu-below-hero .hero-section,
body.menu-below-hero .hero-section,
body:not(.menu-above-hero) .hero-section {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Fix for the grey space between header and hero */
.site-header {
    margin-bottom: 0 !important;
}

.hero-section {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

/* Fix for the gap below the hero section */
.hero-section + *,
.hero-section ~ .container:first-of-type,
.hero-section ~ section:first-of-type,
main > .container:first-of-type,
#primary > .container:first-of-type,
.site-main > .container:first-of-type {
    margin-top: 0 !important;
    padding-top: 0 !important;
}



/* Mobile styles */
@media (max-width: 767px) {
    /* These mobile styles have been moved to menu-above-hero.css for the front page */
    /* This section is kept empty intentionally as a reminder */
}