/* MODULES */

/* Site Header */

.site-header {
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    z-index: 900;
}

.site-header--wrapper {
    display: flex;
    justify-content: space-between;
    align-items: center;
    column-gap: var(--wp--preset--spacing--32);
    height: var(--wp--custom--header-height);
}

.site-header--logo-link {
    display: block;
    margin-top: var(--wp--preset--spacing--16);
}

.site-header--logo {
    overflow: visible;
    display: block;
    height: auto;
    width: clamp(7.75rem, 5.0066rem + 11.7053vw, 15rem);
}

[class^="site-header--logo-path"] {
    transition: fill var(--wp--custom--fast-transition) ease-in-out;
}

.site-header--logo-path-logo {
    fill: #fff;
}

.site-header--logo-path-tagline {
    fill: #fff;
}

.site-header-light .site-header--logo-path-logo {
    fill: #cb1f44;
}

.site-header-light .site-header--logo-path-tagline {
    fill: #2f3659;
}

.device-nav-open .site-header--logo-path-logo,
.device-nav-open .site-header--logo-path-tagline {
    fill: var(--wp--preset--color--white);
}

.site-header--device-nav-logo {
    display: none;
}

.device-nav-open .site-header--device-nav-logo {
    display: block;
}

.device-nav-open .site-header--home-logo-colour {
    display: none;
}

.site-header--desktop-nav {
    width: 100%;
}

.device-nav-open .site-header--desktop-nav {
    display: none;
}

.device-nav-open .site-header--header-button {
    display: none;
}

.site-header--device-nav-toggle {
    position: relative;
    display: none;
    flex-shrink: 0;
    width: 20px;
    height: 14px;
    padding: 0;
    background-color: transparent;
    border: none;
    cursor: pointer;
}

.is-mobile .site-header--device-nav-toggle {
    display: block;
}

.device-nav-open .site-header--device-nav-toggle {
    display: block;
}

.site-header--device-nav-toggle .line {
    position: absolute;
    display: block;
    width: 100%;
    height: 2px;
    background-color: var(--wp--preset--color--white);
    border-radius: var(--wp--custom--border-radius-full);
    transition: transform var(--wp--custom--fast-transition) ease-in-out,
        opacity var(--wp--custom--fast-transition) ease-in-out,
        top var(--wp--custom--fast-transition) ease-in-out,
        bottom var(--wp--custom--fast-transition) ease-in-out,
        background-color var(--wp--custom--fast-transition) ease-in-out;
}

.site-header-light .site-header--device-nav-toggle .line {
    background-color: var(--wp--preset--color--dark-base-1);
}

.device-nav-open .site-header--device-nav-toggle .line {
    background-color: var(--wp--preset--color--white);
}

.site-header--device-nav-toggle .line.top {
    top: 0;
}

.site-header--device-nav-toggle .line.middle {
    top: 50%;
    transform: translateY(-50%);
}

.site-header--device-nav-toggle .line.bottom {
    bottom: 0;
}

.device-nav-open .site-header--device-nav-toggle .line.top {
    top: 50%;
    transform: translateY(-50%) rotate(45deg);
}

.device-nav-open .site-header--device-nav-toggle .line.middle {
    opacity: 0;
}

.device-nav-open .site-header--device-nav-toggle .line.bottom {
    top: 50%;
    transform: translateY(-50%) rotate(-45deg);
}

@media (max-width: 1300px) {
    .site-header--desktop-nav {
        display: none;
    }

    .site-header--header-button {
        display: none;
    }

    .site-header--device-nav-toggle {
        display: block;
    }
}

/* Desktop Nav */

.is-mobile .desktop-nav {
    display: none;
}

.desktop-nav--links {
    display: flex;
    align-items: center;
    justify-content: center;
    column-gap: var(--wp--preset--spacing--32);
    margin: 0;
    padding: 0;
    list-style: none;
}

.desktop-nav--links > li {
    position: relative;
}

.desktop-nav--links > li > a {
    position: relative;
    display: block;
    padding: var(--wp--preset--spacing--16) 0;
    font-size: var(--wp--preset--font-size--18);
    font-weight: 700;
    color: var(--wp--preset--color--white);
    text-decoration: none;
    text-shadow: 0px 2px 8px rgba(0, 0, 0, 0.5);
}

.site-header-light .desktop-nav--links > li > a {
    color: var(--wp--preset--color--dark-base-1);
    text-shadow: unset;
}

.desktop-nav--links > li > a::before {
    content: "";
    position: absolute;
    bottom: 0;
    display: block;
    height: 0.25rem;
    width: 0;
    background-color: var(--wp--preset--color--accent-1);
    border-radius: var(--wp--custom--border-radius-full);
    transition: width var(--wp--custom--fast-transition) ease-in-out;
}

.desktop-nav--links > li:hover > a::before {
    width: 100%;
}

.desktop-nav--links > li.menu-item-has-children > a::after {
    content: "";
    display: inline-block;
    width: 11px;
    height: 6px;
    margin-left: 0.5rem;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 11 6'%3E%3Cpath d='m10.85.85-5 5c-.09.09-.22.15-.35.15s-.26-.05-.35-.15l-5-5c-.2-.19-.2-.51 0-.7.19-.2.51-.2.7 0L5.5 4.8 10.15.15c.13-.13.31-.18.48-.13.17.05.31.18.35.35.05.17 0 .36-.13.48Z' fill='%23ffffff'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    vertical-align: middle;
    filter: drop-shadow(0px 2px 4px rgba(0, 0, 0, 0.5));
}

.site-header-light .desktop-nav--links > li.menu-item-has-children > a::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 11 6'%3E%3Cpath d='m10.85.85-5 5c-.09.09-.22.15-.35.15s-.26-.05-.35-.15l-5-5c-.2-.19-.2-.51 0-.7.19-.2.51-.2.7 0L5.5 4.8 10.15.15c.13-.13.31-.18.48-.13.17.05.31.18.35.35.05.17 0 .36-.13.48Z' fill='%230E2133'/%3E%3C/svg%3E");
    filter: unset;
}

.desktop-nav--links li .sub-menu {
    position: absolute;
    top: 100%;
    left: 50%;
    visibility: hidden;
    transform: translateY(1rem) translateX(-50%);
    opacity: 0;
    min-width: 250px;
    margin: 0;
    padding: var(--wp--preset--spacing--16) 0 0;
    list-style: none;
    transition: padding var(--wp--custom--fast-transition) ease-in-out,
        opacity var(--wp--custom--fast-transition) ease-in-out,
        transform var(--wp--custom--fast-transition) ease-in-out,
        visibility var(--wp--custom--fast-transition) ease-in-out;
}

.desktop-nav--links > li:hover .sub-menu {
    opacity: 1;
    transform: translateY(0) translateX(-50%);
    visibility: visible;
}

.desktop-nav--links li .sub-menu li {
    background-color: var(--wp--preset--color--white);
}

.desktop-nav--links li .sub-menu li:first-child {
    padding-top: var(--wp--preset--spacing--16);
    border-top-left-radius: var(--wp--custom--border-radius-small);
    border-top-right-radius: var(--wp--custom--border-radius-small);
}

.desktop-nav--links li .sub-menu li:last-child {
    padding-bottom: var(--wp--preset--spacing--16);
    border-bottom-left-radius: var(--wp--custom--border-radius-small);
    border-bottom-right-radius: var(--wp--custom--border-radius-small);
}

.desktop-nav--links li .sub-menu li a {
    display: block;
    padding: 0.875rem;
    font-weight: 600;
    text-align: center;
    text-decoration: none;
    text-box-trim: trim-both;
    text-box-edge: text;
    transition: background-color var(--wp--custom--fast-transition) ease-in-out;
}

.desktop-nav--links li .sub-menu li a:hover {
    background-color: var(--wp--preset--color--light-base-2);
}

/* Header Button */

.is-mobile .header-button {
    display: none;
}

.header-button--links {
    display: flex;
    column-gap: var(--wp--preset--spacing--32);
    align-items: center;
    margin: 0;
    padding: 0;
    list-style: none;
}

.header-button--links > li > a {
    display: block;
    padding: 0.813rem var(--wp--preset--spacing--16);
    background-color: var(--wp--preset--color--accent-1);
    border: 0.1rem solid var(--wp--preset--color--accent-1);
    border-radius: var(--wp--custom--border-radius-small);
    font-size: var(--wp--preset--font-size--16);
    font-weight: 700;
    color: var(--wp--preset--color--white);
    text-decoration: none;
    white-space: nowrap;
    text-box-trim: trim-both;
    text-box-edge: text;
    transition: background-color var(--wp--custom--fast-transition) ease-in-out,
        color var(--wp--custom--fast-transition) ease-in-out;
}

.header-button--links > li > a:hover {
    background-color: var(--wp--preset--color--white);
    color: var(--wp--preset--color--accent-1);
}

/* Device Nav */

.device-nav--fs-overlay {
    transform: translateY(-100%);
    opacity: 0;
    z-index: 899;
    padding: 0 var(--wp--preset--spacing--global);
    transition-property: transform, opacity;
    transition-duration: var(--wp--custom--fast-transition);
    transition-timing-function: ease-in-out;
}

.device-nav-open .device-nav--fs-overlay {
    transform: translateY(0);
    opacity: 1;
}

.device-nav--links {
    width: 100%;
    max-width: var(--wp--style--global--wide-size);
    margin: calc(
            var(--wp--custom--header-height) + var(--wp--preset--spacing--16)
        )
        auto 0;
    padding: var(--wp--preset--spacing--32) 0;
    background-color: var(--wp--preset--color--white);
    border-radius: var(--wp--custom--border-radius-small);
    list-style: none;
}

.device-nav--links > li > a {
    position: relative;
    display: block;
    padding: var(--wp--preset--spacing--16);
    font-size: var(--wp--preset--font-size--18);
    font-weight: 700;
    text-align: center;
    text-decoration: none;
    text-box-trim: trim-both;
    text-box-edge: text;
}

.device-nav--links > li.menu-item-has-children > a::after {
    content: "";
    display: inline-block;
    width: 11px;
    height: 6px;
    margin-left: 0.5rem;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 11 6'%3E%3Cpath d='m10.85.85-5 5c-.09.09-.22.15-.35.15s-.26-.05-.35-.15l-5-5c-.2-.19-.2-.51 0-.7.19-.2.51-.2.7 0L5.5 4.8 10.15.15c.13-.13.31-.18.48-.13.17.05.31.18.35.35.05.17 0 .36-.13.48Z' fill='%230E2133'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    vertical-align: middle;
    transition: transform var(--wp--custom--fast-transition) ease-in-out;
}

.device-nav--links > li.menu-item-has-children:has(.open) > a::after{
    transform: rotate(180deg);
} 

.device-nav--links li .sub-menu {
    overflow: hidden;
    max-height: 0;
    margin: 0;
    padding: 0;
    background-color: var(--wp--preset--color--light-base-2);
    opacity: 0;
    list-style: none;
    transition: max-height var(--wp--custom--fast-transition) ease-in-out,
        opacity var(--wp--custom--fast-transition) ease-in-out;
}

.device-nav--links .sub-menu.open {
    opacity: 1;
}

.device-nav--links li .sub-menu li:first-child {
    margin-top: var(--wp--preset--spacing--16);
}

.device-nav--links li .sub-menu li:last-child {
    margin-bottom: var(--wp--preset--spacing--16);
}

.device-nav--links li .sub-menu li a {
    display: block;
    padding: var(--wp--preset--spacing--16);
    font-weight: 600;
    text-align: center;
    text-decoration: none;
    text-box-trim: trim-both;
    text-box-edge: text;
}