/* Initial navigation styling */
header {
    background-color: transparent;
    transition: background-color 0.3s ease, color 0.3s ease;
    position: fixed;
    z-index: 999;
    width: 100%;
    top: 0;
}

header a {
    color: white !important;
    /* Initial text color */
    transition: color 0.3s ease;
}

/* Scrolled state - triggered when page is scrolled */
body:not(.at-top) header {
    background-color: var(--wp--preset--color--text-white);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

body:not(.at-top) header a {
    color: var(--wp--preset--color--brand-black) !important;
    border-color: var(--wp--preset--color--brand-black) !important;
}

body:not(.at-top) button svg {
    color: var(--wp--preset--color--brand-black) !important;
    border-color: var(--wp--preset--color--brand-black) !important;
}

.reviews {
    position: absolute;
    right: 0;
    bottom: 0;
}

.hide-contact {
    display: none !important;
}

@media (max-width: 930px) {
    #contact-button {
        display: none !important;
    }
    .hide-contact {
        display: block !important;
    }

    body header a {
        color: var(--wp--preset--color--brand-black) !important;
        border-color: var(--wp--preset--color--brand-black) !important;
    }

    body header:has(.has-modal-open) button svg {
        color: var(--wp--preset--color--brand-black) !important;
        border-color: var(--wp--preset--color--brand-black) !important;
    }
}

/** HGover **/
.wp-block-button__link:hover {
    background-color: #d62828;
    /* darker shade */
    color: #ffffff !important;
    transform: scale(1.02);
    /* subtle zoom effect */
    transition: all 0.2s ease-in-out;
}


/** Swoosh on current page **/
.current-menu-item a,
.current_page_item a {
    position: relative;
    display: inline-block;
    /* shrink-wrap to text */
    z-index: 1;
    color: white;
    /* keep text readable */
    padding: 0.2em 0.4em;
    /* optional: space between text and image edge */
}

.current-menu-item a::before,
.current_page_item a::before {
    content: "";
    position: absolute;
    inset: 0;
    top: -4px;
    width: 100%;
    height: 100%;
    background-image: url('../images/swoosh.svg');
    background-size: cover;
    background-position: center;
    opacity: 0.6;
    /* Controls background opacity only */
    z-index: -1;
    /* Places background behind text */
    padding: 0.5em 0.5em;
}

/** Hover effects **/
.wp-block-navigation-item__label:hover {
    color: rgb(233, 61, 43) !important;
    -webkit-transition: color 100ms linear;
    -ms-transition: color 100ms linear;
    transition: color 100ms linear;
}

a:not(.wp-element-button):hover {
    color: rgb(233, 61, 43) !important;
    -webkit-transition: color 100ms linear;
    -ms-transition: color 100ms linear;
    transition: color 100ms linear;
}