@media only screen and (min-width: 1024px) {

    body .primary-nav__item-content {
        border-top: none;
    }

}

@media only screen and (min-width: 600px) {

    /* Target the outer <main> specifically - the inner .entry-content div
       emitted by wp:post-content (in FSE templates) sits mid-page, not at the
       top, so it must not pick up the header clearance. */
    body main.entry-content > :first-child {

        padding-top: calc(var(--logo--height) + 2 * var(--header--padding--vertical) + 4 * var(--global--spacing-unit) + 2 * var(--drop-down--padding--vertical) + var(--wp--preset--font-size--extra-small) * var(--global--line-height--extra-small) + var(--global--spacing-unit) + 8 * var(--global--spacing-unit));

    }

}



/* Header defaults */
.site-header__main-nav {

    position: relative;
    z-index: 1000;
    box-shadow: none;
    transition: box-shadow 0.6s ease, background-color 0.6s ease;

}

/* Becomes fixed when utility bar has scrolled away */
.site-header__main-nav.is-fixed {

    --header--color: var(--wp--preset--color--sr-black);
    position: fixed;
    top: calc(var(--wp-admin--admin-bar--height, 0px) + env(safe-area-inset-top));
    left: 0;
    right: 0;
    width: 100%;
    background-color: white;

    #logo-vertical-line {
        fill: var(--color--brand-1);
    }

    .primary-nav__item-button:hover, 
    .primary-nav__item-button:active, 
    .primary-nav__item-link:hover, 
    .primary-nav__item-link:active {
        color: var(--wp--preset--color--sr-black);
    }

}

.site-header__main-nav.is-scrolled {
  box-shadow: var(--global--box-shadow--extra-tight);
}

/* Push the page content down while header is fixed.
   Target the outer <main> specifically so the inner .entry-content div
   emitted by wp:post-content (in FSE templates) doesn't get a second offset. */
:root.has-fixed-header main.entry-content {
  padding-top: var(--fixed-header-offset, 0px);
}

/* Optional: improve in-page anchor/jump links so targets aren’t hidden under the fixed header */
:root.has-fixed-header :is(h1,h2,h3,h4,h5,h6,[id]) {
    scroll-margin-top: calc(var(--fixed-header-offset, 0px) + 16px);
}


@media only screen and (min-width: 1024px) {

    body .primary-nav__item.is-open .primary-nav__item-content {

        top: calc(var(--header--height));

    }

}

/* Revert the logo text to the default colour */
body.has-light-header[class] .is-scrolled .site-info svg :is(path, rect) {
    fill: revert;
}