/**
 * Net Zero Construction — unified Elementor header banner.
 *
 * Scope:
 * Header template: 145
 * Outer container: f0c6b12
 * Logo: 2a2ac6e
 * Menu: f41a7ff
 * CTA: 23da7be
 */

:root {
    --nzhb-ink: #111111;
    --nzhb-gold: #c9a84c;
    --nzhb-white: #ffffff;
}

/* Backup suppression while cached footer fragments are being refreshed. */
body a[href*="ppllabs.com"],
body img[src*="PPL-Logo" i],
body img[alt*="PPL Labs" i] {
    display: none !important;
}

/* Make the header a real banner in normal document flow. */
body .elementor-location-header.elementor-145 {
    position: relative !important;
    inset: auto !important;
    z-index: 1000 !important;
    width: 100% !important;
    margin: 0 !important;
    background: var(--nzhb-ink) !important;
    border-bottom: 1px solid rgba(201, 168, 76, 0.72);
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.16);
}

body .elementor-145 .elementor-element.elementor-element-f0c6b12 {
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 52px !important;
    background: var(--nzhb-ink) !important;
}

body .elementor-145 .elementor-element-f0c6b12 > .e-con-inner {
    display: flex !important;
    flex-flow: row nowrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 38px !important;
    width: 100% !important;
    max-width: 1400px !important;
    min-height: 116px !important;
    margin: 0 auto !important;
    padding: 18px 0 !important;
}

/* Logo: transparent, large, and readable. */
body .elementor-145 .elementor-element.elementor-element-af4dfe9 {
    flex: 0 1 340px !important;
    width: 340px !important;
    max-width: 340px !important;
}

body .elementor-145 .elementor-element.elementor-element-2a2ac6e,
body .elementor-145 .elementor-element.elementor-element-2a2ac6e > .elementor-widget-container,
body .elementor-145 .elementor-element.elementor-element-2a2ac6e a {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

body .elementor-145 .elementor-element.elementor-element-2a2ac6e img {
    display: block !important;
    width: 340px !important;
    max-width: 100% !important;
    height: auto !important;
}

/* Keep the menu and CTA aligned as one navigation group. */
body .elementor-145 .elementor-element.elementor-element-258ff74 {
    display: flex !important;
    flex: 1 1 auto !important;
    flex-flow: row nowrap !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 26px !important;
    width: auto !important;
    max-width: none !important;
}

body .elementor-145 .elementor-element.elementor-element-f41a7ff,
body .elementor-145 .elementor-element.elementor-element-f41a7ff > .elementor-widget-container,
body .elementor-145 .elementor-element-f41a7ff .ekit-wid-con,
body .elementor-145 .elementor-element-f41a7ff .elementskit-menu-container,
body .elementor-145 .elementor-element-f41a7ff .elementskit-navbar-nav {
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

body .elementor-145 .elementor-element-f41a7ff .elementskit-navbar-nav > li > a {
    min-height: auto !important;
    padding: 14px 17px !important;
    color: var(--nzhb-white) !important;
    background: transparent !important;
    font-size: 17px !important;
    line-height: 1.25 !important;
    transition: color 180ms ease !important;
}

body .elementor-145 .elementor-element-f41a7ff .elementskit-navbar-nav > li > a:hover,
body .elementor-145 .elementor-element-f41a7ff .elementskit-navbar-nav > li.current-menu-item > a,
body .elementor-145 .elementor-element-f41a7ff .elementskit-navbar-nav > li.current_page_item > a {
    color: var(--nzhb-gold) !important;
}

/* Contact CTA. */
body .elementor-145 .elementor-element.elementor-element-23da7be {
    flex: 0 0 auto !important;
    width: auto !important;
}

body .elementor-145 .elementor-element-23da7be .elementor-button {
    padding: 16px 25px !important;
    color: var(--nzhb-ink) !important;
    background: var(--nzhb-gold) !important;
    border: 1px solid var(--nzhb-gold) !important;
    border-radius: 4px !important;
    box-shadow: none !important;
    font-size: 17px !important;
    line-height: 1.2 !important;
    white-space: nowrap !important;
    transition: color 180ms ease, background-color 180ms ease !important;
}

body .elementor-145 .elementor-element-23da7be .elementor-button:hover,
body .elementor-145 .elementor-element-23da7be .elementor-button:focus-visible {
    color: var(--nzhb-gold) !important;
    background: transparent !important;
}

/* Tablet: use ElementsKit's hamburger while preserving the banner. */
@media (max-width: 1024px) {
    body .elementor-145 .elementor-element.elementor-element-f0c6b12 {
        padding: 0 28px !important;
    }

    body .elementor-145 .elementor-element-f0c6b12 > .e-con-inner {
        gap: 22px !important;
        min-height: 92px !important;
        padding: 14px 0 !important;
    }

    body .elementor-145 .elementor-element.elementor-element-af4dfe9 {
        flex-basis: 250px !important;
        width: 250px !important;
        max-width: 250px !important;
    }

    body .elementor-145 .elementor-element.elementor-element-2a2ac6e img {
        width: 250px !important;
    }

    body .elementor-145 .elementor-element.elementor-element-258ff74 {
        gap: 16px !important;
    }

    body .elementor-145 .elementor-element-f41a7ff .elementskit-menu-hamburger {
        color: var(--nzhb-gold) !important;
        background: transparent !important;
        border: 1px solid var(--nzhb-gold) !important;
        border-radius: 4px !important;
    }

    body .elementor-145 .elementor-element-f41a7ff .elementskit-menu-hamburger:hover,
    body .elementor-145 .elementor-element-f41a7ff .elementskit-menu-hamburger:focus,
    body .elementor-145 .elementor-element-f41a7ff .elementskit-menu-hamburger:active,
    body .elementor-145 .elementor-element-f41a7ff .elementskit-menu-hamburger[aria-expanded="true"] {
        color: var(--nzhb-gold) !important;
        background: rgba(201, 168, 76, 0.12) !important;
        border-color: var(--nzhb-gold) !important;
    }

    body .elementor-145 .elementor-element-f41a7ff .elementskit-menu-hamburger .ekit-menu-icon,
    body .elementor-145 .elementor-element-f41a7ff .elementskit-menu-hamburger i,
    body .elementor-145 .elementor-element-f41a7ff .elementskit-menu-hamburger::before,
    body .elementor-145 .elementor-element-f41a7ff .elementskit-menu-hamburger::after,
    body .elementor-145 .elementor-element-f41a7ff .elementskit-menu-close,
    body .elementor-145 .elementor-element-f41a7ff .elementskit-menu-close i {
        color: var(--nzhb-gold) !important;
        border-color: var(--nzhb-gold) !important;
    }

    body .elementor-145 .elementor-element-f41a7ff .elementskit-menu-hamburger svg,
    body .elementor-145 .elementor-element-f41a7ff .elementskit-menu-close svg {
        fill: var(--nzhb-gold) !important;
        stroke: var(--nzhb-gold) !important;
    }

    body .elementor-145 .elementor-element-f41a7ff .elementskit-menu-container {
        background: var(--nzhb-ink) !important;
    }

    body .elementor-145 .elementor-element-f41a7ff .elementskit-navbar-nav > li > a {
        padding: 13px 22px !important;
    }
}

/* Phone: simplify the right side and let the menu provide the contact link. */
@media (max-width: 767px) {
    body .elementor-145 .elementor-element.elementor-element-f0c6b12 {
        padding: 0 18px !important;
    }

    body .elementor-145 .elementor-element-f0c6b12 > .e-con-inner {
        gap: 14px !important;
        min-height: 78px !important;
        padding: 11px 0 !important;
    }

    body .elementor-145 .elementor-element.elementor-element-af4dfe9 {
        flex-basis: min(210px, 68vw) !important;
        width: min(210px, 68vw) !important;
        max-width: min(210px, 68vw) !important;
    }

    body .elementor-145 .elementor-element.elementor-element-2a2ac6e img {
        width: 210px !important;
    }

    body .elementor-145 .elementor-element.elementor-element-258ff74 {
        flex: 0 0 auto !important;
        gap: 0 !important;
    }

    body .elementor-145 .elementor-element.elementor-element-23da7be {
        display: none !important;
    }
}

/*
 * Chat branding
 * The aNinja/AdMagic launcher is rendered in a closed Shadow DOM, so its green
 * artwork cannot be restyled from WordPress. Position the approved round NZ
 * artwork directly above the working launcher. Pointer events pass through to
 * the real chat button, preserving its native open/close behavior.
 */
body .nzc-floating-logo.nzhb-chat-logo-overlay {
    position: fixed !important;
    right: 4px !important;
    bottom: 22px !important;
    left: auto !important;
    top: auto !important;
    z-index: 2147483000 !important;
    display: block !important;
    width: 76px !important;
    height: 76px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    pointer-events: auto !important;
    cursor: pointer !important;
    background: #000 !important;
    border: 2px solid var(--nzhb-gold) !important;
    border-radius: 50% !important;
    box-shadow: 0 7px 22px rgba(0, 0, 0, 0.3) !important;
}

body .nzc-floating-logo.nzhb-chat-logo-overlay:hover,
body .nzc-floating-logo.nzhb-chat-logo-overlay:focus-visible {
    outline: 2px solid var(--nzhb-gold) !important;
    outline-offset: 3px !important;
    transform: scale(1.04) !important;
}

body .nzc-floating-logo.nzhb-chat-logo-overlay img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    object-fit: cover !important;
    border-radius: 50% !important;
}

@media (max-width: 767px) {
    body .nzc-floating-logo.nzhb-chat-logo-overlay {
        right: 2px !important;
        bottom: 16px !important;
        width: 68px !important;
        height: 68px !important;
    }
}