/* Site-wide header dark-mode override.
 *
 * The theme's default header is transparent + white text + white logo,
 * designed to overlay a dark hero image. On pages with a LIGHT first
 * section (white/cream/light-grey), the white header becomes invisible.
 *
 * To handle this without editing the broken-SCSS-compiled main.css,
 * functions.php adds a `theme-dark-header` body class to every page
 * with a light hero. Selectors below force the dark-logo + dark-menu state
 * for any page carrying that class.
 *
 * Loaded AFTER main.css so these rules win the cascade.
 */

body.theme-dark-header #site-header .logo-dark {
    display: block !important;
}
body.theme-dark-header #site-header .logo-white {
    display: none !important;
}

body.theme-dark-header #site-header .site-nav ul.menu li a,
body.theme-dark-header #site-header .site-nav-menu ul li a,
body.theme-dark-header #site-header .site-nav-menu .menu li a,
body.theme-dark-header #site-header .site-nav-mobile ul.menu li a,
body.theme-dark-header #site-header .mobile-menu-list ul li a {
    color: #1a1a1a !important;
}

body.theme-dark-header #site-header .site-nav-mobile svg.mobile-menu-icon path {
    fill: #690000 !important;
}

body.theme-dark-header #site-header .site-nav .menu-item-has-children > a + .submenu-toggle-dropdown,
body.theme-dark-header #site-header .site-nav-menu .menu-item-has-children > a + .submenu-toggle-dropdown {
    background-image: url('../../assets/images/arrow-down-dark.svg') !important;
}

/* Scrolled state — applies on every page once the user scrolls past the hero.
 * The theme's compiled main.css scoped its scroll rules to the old wp_nav_menu
 * container class (`menu-main-menu-container`). The fixed wp_nav_menu() call
 * now outputs `.site-nav-menu` instead, so the old scrolled rules no longer
 * matched. These rules re-establish the dark-menu state for any scrolled header.
 *
 * Affects Home, Services, Projects — the three pages that don't already
 * carry `theme-dark-header`.
 */
#site-header.is-scrolled .site-nav-menu ul li a,
#site-header.is-scrolled .site-nav-menu .menu li a,
#site-header.is-scrolled .site-nav ul.menu li a {
    color: #1a1a1a !important;
}
#site-header.is-scrolled .site-nav-menu .menu-item-has-children > a + .submenu-toggle-dropdown,
#site-header.is-scrolled .site-nav .menu-item-has-children > a + .submenu-toggle-dropdown {
    background-image: url('../../assets/images/arrow-down-dark.svg') !important;
}
#site-header.is-scrolled .site-nav-mobile svg.mobile-menu-icon path {
    fill: #690000 !important;
}

/* ---------------------------------------------------------------
 * Projects page — give the .hero a real background image so the
 * design matches Services / About style instead of rendering as
 * a flat white block.
 * The theme has no _projects.scss; this is the equivalent.
 * --------------------------------------------------------------- */
body.page-projects .hero {
    position: relative;
}
body.page-projects .hero .bg-image {
    z-index: 0;
    position: absolute;
    inset: 0;
    width: 100%;
    max-height: 464px;
    background-size: cover;
    background-position: center;
    background-image: url('../../assets/images/pages/home/scaffolding-christchurch-hero.jpg');
}
@media (max-width: 768px) {
    body.page-projects .hero .bg-image {
        max-height: 480px;
        background-image: url('../../assets/images/pages/home/Christchurch_Scaffolders-1.jpg');
    }
}
body.page-projects .hero .bg-image .overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(0, 0, 0, 0.65) 0%, rgba(0, 0, 0, 0.25) 100%);
    z-index: 1;
}
body.page-projects .hero .wrapper {
    position: relative;
    z-index: 2;
}