:root {
    --blur-amount: 2px;
    --blur-background: rgba(151, 151, 151, 0.23);
    --blur-secondary-background: rgba(44, 44, 44, 0.5);
    --form-background: #3e3e3e;
    --submenu-offset: 32px;
    --anim-ease: ease-out;
    --anim--submenu-delay: 0.125s;
    --box-shadow: 0 0 0.25rem 0 var(--wp--preset--color--primary-dark);
    --text-shadow: 0 0 0.25em black;
}

* {
    box-sizing: border-box;
}

a {
    text-decoration: none;
}

img {
    height: auto;
    max-width: 100%;
}

.wp-site-blocks {
    overflow-x: hidden;
}

/* Debug */

.logged-in .wp-block-button.is-style-asx > .wp-block-button__link::before {
    animation: none;
}

/* Header */

.header-fixed,
.header-sticky {
    position: relative;
    transition: all 0.75s ease-out;
    transition-property: backdrop-filter, background-color;
}

.header-fixed {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 10;
}

.has-modal-open .header-fixed {
    height: 100%;
}

.header-sticky {
    position: sticky;
    top: 0;
    z-index: 10;
}

.header-fixed::after,
.header-sticky::after {
    bottom: 0;
    content: '';
    height: 100%;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    transition: inherit;
    width: 100%;
    z-index: -1;
}

.header--blur {
    backdrop-filter: blur( var(--blur-amount) );
    background-color: var(--blur-background);
}

.header--blur::before {
    position: absolute;
    left: 0;
}

.header--blur::after {
    background-color: var(--blur-secondary-background);
}

#header-logo {
    padding-inline-end: 20px;
    position: relative;
    transform: scale(1.125);
    transform-origin: top left;
    transition: transform 0.4s ease-out;
}

@media screen and (min-width: 1152px) {
    #header-logo {
        transform: scale(1.33);
    }
}

.page--scrolled #header-logo {
    transform: scale(1);
}

/* Navigation */

.wp-block-navigation__submenu-icon {
	display: none !important;
}

.wp-block-navigation__responsive-container {
    padding: var(--wp--preset--spacing--40) !important;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
    padding-block-start: 0;
}

.wp-block-navigation-item.has-child > .wp-block-navigation-item__content::before {
    aspect-ratio: 1/1;
    background-color: var(--wp--preset--color--primary-light);
    border-radius: 100%;
    content: '';
    display: inline-block;
    height: 8px;
    margin-bottom: 2px;
    margin-right: 4px;
    width: 8px;
}

.wp-block-navigation .has-child .wp-block-navigation__submenu-container {
    backdrop-filter: blur( var(--blur-amount) );
    background-color: var(--blur-background);
    border-radius: 2px;
    color: white;
    top: calc( 100% + var(--submenu-offset) );
}

.wp-block-navigation .has-child .wp-block-navigation__submenu-container::before,
.wp-block-navigation .has-child .wp-block-navigation__submenu-container::after {
    content: '';
    left: 0;
    position: absolute;
    width: 100%;
}

.wp-block-navigation .has-child .wp-block-navigation__submenu-container::before {
    background-color: var(--blur-secondary-background);
    border-radius: inherit;
    height: 100%;
    top: 0;
}

.wp-block-navigation .has-child .wp-block-navigation__submenu-container::after {
    background-color: transparent;
    bottom: 100%;
    height: var(--submenu-offset);
}

.wp-block-navigation .is-menu-open .has-child .wp-block-navigation__submenu-container::before,
.wp-block-navigation .is-menu-open .has-child .wp-block-navigation__submenu-container::after {
    content: none !important;
}

.wp-block-navigation .has-child .wp-block-navigation-submenu__toggle[aria-expanded=true] ~ .wp-block-navigation__submenu-container {
    min-width: 13rem;
}

.wp-block-navigation .has-child .wp-block-navigation__submenu-container .wp-block-navigation-item {
    animation-delay: var(--anim--submenu-delay);
    padding-block: 0.25rem;
    position: relative;

    &::before,
    &::after {
        animation-delay: inherit;
        animation-duration: 0.5s;
        animation-fill-mode: forwards;
        animation-timing-function: var(--anim-ease);
        background-color: var(--wp--preset--color--primary-light);
        content: '';
        display: none;
        position: absolute;
        top: 100%;
    }

    &::before {
        animation-name: submenu_item_bar;
        height: 2px;
        left: 0.5rem;
        width: 0;
    }

    &::after {
        animation-name: submenu_item_circle;
        border-radius: 100%;
        left: 0;
        height: 0.5rem;
        top: calc(100% - 3px);
        width: 0.5rem;
    }

    &:last-of-type {
        &::before,
        &::after {
            content: none;
        }
    }
}

.wp-block-navigation .has-child .wp-block-navigation-submenu__toggle[aria-expanded=true] ~ .wp-block-navigation__submenu-container .wp-block-navigation-item {
    &::before,
    &::after {
        display: block;
    }
}

@keyframes submenu_item_bar {
    0% {
        width: 0;
    }
    100% {
        width: calc(100% - 1rem);
    }
}

@keyframes submenu_item_circle {
    0% {
        left: 0;
    }
    100% {
        left: calc(100% - 1rem);
    }
}

/* ASX Button */

.wp-block-button.is-style-asx {
    & > .wp-block-button__link {
        background-color: transparent !important;
        border: 1px solid transparent;
        border-color: var(--wp--preset--color--primary-light);
        font-weight: 600;
        overflow: hidden;
        padding: 0.75rem 1.25rem;
        position: relative;
        transition: all 0.25s var(--anim-ease);
        transition-property: background-color, border-color, color;
        white-space: nowrap;

        & > .asx-price-icon,
        & > .asx-price-reveal {
            transition: opacity 0.25s var(--anim-ease);
        }

        & > .asx-price-icon {
            display: inline-block;
            margin-inline-start: 16px;
            margin-inline-end: 25px;
            margin-inline-end: 25.25px;
            max-width: 1.5rem;
            opacity: 0;
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            right: 0;
        }

        & > .asx-price-reveal {
            opacity: 1;
            white-space-collapse: preserve;
        }

        &:focus,
        &:hover {
            background-color: var(--wp--preset--color--primary-light) !important;
            border-color: var(--wp--preset--color--secondary-light) !important;
            color: var(--wp--preset--color--primary-dark) !important;

            & > .asx-price-icon {
                opacity: 1;
            }

            & > .asx-price-reveal {
                opacity: 0;
            }
        }

        &::before {
            animation: sheen_loop 8s infinite 2s;
            background-color: currentColor;
            box-shadow: 0 0 1rem 0.5rem currentColor;
            color: white;
            content: '';
            width: 1rem;
            height: 100%;
            top: 0%;
            left: -100%;
            transform: skew(25deg);
            opacity: 0.4;
            position: absolute;
        }
    }

    .is-menu-open.has-modal-open & {
        & .asx-price-reveal {
            opacity: 1;
        }

        & .asx-price-icon {
            opacity: 0;
        }
    }
}

@keyframes sheen_loop {
    0% {
        left: -100%;
    }
    10% {
        left: 150%;
    }
    100% {
        left: 150%;
    }
}

.wp-block-navigation__responsive-container {
    & .wp-block-button.is-style-asx {
        & > .wp-block-button__link {
            color: inherit;
        }
    }
}

/* Page Banner */

.yoast-breadcrumbs a {
    text-decoration: none !important;
    color: white !important;
}

#page-banner {
    position: relative;

    & h1 {
        margin-block: 0;
    }
}

/* Helpers */

.overflow-x-hidden {
    overflow-x: hidden;
}

.wp-block-navigation-item > .wp-block-site-logo {
    display: none;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-site-logo {
    display: revert;
}

/* Form */

.gform_wrapper {
    --gf-color-in-ctrl: var(--form-background);
    --gf-ctrl-label-color-secondary: var(--wp--preset--color--base);
    --gf-radius: 3px;
    --gf-ctrl-border-color: transparent;
    width: 100%;
}

.gform_wrapper input[type=text],
.gform_wrapper input[type=email],
.gform_wrapper input[type=number],
.gform_wrapper input[type=tel],
.gform_wrapper select,
.gform_wrapper textarea {
    color: var(--gf-ctrl-label-color-secondary);
    font-family: var(--wp--preset--font-family--raleway);
    font-size: 1rem;
    letter-spacing: 0.1px;

    &:focus {
        outline: none;
    }

    &::-webkit-placeholder,
    &::placeholder {
        color: inherit;
        font-size: 14px;
        font-weight: 300;
    }
}

.gfield_label {
    position: static;
    padding-block: var(--gf-field-pad-y);
    padding-inline: var(--gf-field-pad-x);

    &.gfield_label_before_complex {
        padding: 0;
    }
}

.gfield {
    position: relative;

    & .ginput_container:not(.ginput_complex) {
        &::after {
            background-color: var(--wp--preset--color--base);
            border-radius: 2px;
            bottom: 0;
            content: '';
            display: block;
            height: 2px;
            left: 50%;
            position: absolute;
            transition: all var(--anim-ease) 0.25s;
            transition-property: left, width;
            width: 0;
        }

        &:focus-within {
            &::after {
                left: 0;
                width: 100%;
            }
        }
    }
}

.gfield:not(.hidden_label):not(.gfield--input-type-name) {
    position: relative;

    & input,
    & select,
    & textarea {
        &::-webkit-input-placeholder,
        &::placeholder {
            color: transparent;
        }
    }

    &.js-contains-input,
    &:focus-within {
        & .gfield_label:not(.gfield_label_before_complex) {
            font-size: 12px;
            transform: translateY(-50%);
        }
    }

    & .gfield_label {
        font-size: 14px;
        font-weight: 300;
        pointer-events: none;
        position: absolute;
        transition: all var(--anim-ease) 0.25s;
        transition-property: font-size, transform;

        &:not(.gfield_label_before_complex) {
            top: 0;
        }
    }
}

.gfield--type-honeypot {
	display: none;
	opacity: 0;
	pointer-events: none;
	position: absolute;
	visibility: hidden;
}

/* Form Submit */

.gform_footer {
    margin-block-start: 1rem;

    & .gform_button {
        --gf-color-primary: var(--wp--preset--color--secondary-dark);
        --gf-color-primary-darker: var(--wp--preset--color--secondary-light);
        background-image: url(../icons/arrow-right-short.svg);
        background-repeat: no-repeat;
        background-position: center right;
        background-position-x: calc(100% - 1rem);
        border: 1px solid transparent;
        border-radius: 100px;
        font-size: 0.8125rem;
        font-weight: 600;
        letter-spacing: 0.1px;
        line-height: 1;
        padding-inline-end: 2.5rem;
        transition: all var(--anim-ease) 0.2s;
        transition-property: background-color, background-position, border-color, color;

        &:hover,
        &:focus {
            background-position-x: calc(100% - 0.5rem);
            border-color: #856D47;
            color: var(--wp--preset--color--primary-dark);
        }
    }
}

.gform_validation_error_link {
    color: var(--wp--preset--color--primary-light);
}

.gform_hide_required_fields_indicator_wrapper .gform_required_legend {
    display: none;
}

/* Minimal Form Style */

.has-minimal-submit .gform_button {
    --form-background: var(--wp--preset--color--primary-light);
    background-color: transparent;
    border-color: var(--form-background);
    border-width: 1px;
}

.gfield.minimal-input {
    & .gfield_label {
        padding-inline: 0;
    }

    & .ginput_container {
        --gf-color-in-ctrl: transparent !important;
        position: relative;

        & input,
        & select,
        & textarea {
            border: none;
            padding-left: 0;

            &:focus {
                outline: none;
            }
        }

        &::before,
        &::after {
            border-radius: 2px;
            content: '';
            height: 2px;
            position: absolute;
            top: 100%;
        }

        &::before {
            background-color: var(--wp--preset--color--base);
            left: 50%;
            transition: all var(--anim-ease) 0.4s;
            transition-property: left, width;
            width: 0;
        }

        &::after {
            background-color: var(--wp--preset--color--base-alt);
            left: 0;
            opacity: 0.4;
            width: 100%;
        }

        &:focus-within {
            &::before {
                left: 0%;
                width: 100%;
            }
        }
    }
}

/* Light Form */

.has-light-form .gform_wrapper {
    --gf-color-in-ctrl: #e8e8e8;
    --gf-ctrl-label-color-secondary: #464646;

    & .ginput_container::after {
        background-color: var(--gf-ctrl-label-color-secondary);
    }
}

.has-minimal-submit.has-light-form .gform_button,
.has-minimal-submit .has-light-form .gform_button,
.has-light-form .has-minimal-submit .gform_button {
    background-image: url(../icons/arrow-right-short-dark.svg);
}

/* Animated Separator */

.wp-block-separator.is-style-animate,
.wp-block-separator.is-style-animate-left,
.wp-block-separator.is-style-animate-right {
    border-color: currentColor;
    color: var(--wp--preset--color--primary-light);
    overflow: visible;
    position: relative;
    width: 0;
}
.wp-block-separator.is-style-animate::after,
.wp-block-separator.is-style-animate-left::after,
.wp-block-separator.is-style-animate-right::after {
    background-color: currentColor;
    border-radius: 100%;
    content: '';
    display: block;
    height: 1rem;
    position: absolute;
    top: 0;
    transform: translateY(-50%);
    width: 1rem;
}

.wp-block-separator.is-style-animate {
    --animate-scale: 0.33;
    --element-width: calc( var(--scroll-top, 0) * var(--animate-scale, 1) );
    width: var(--element-width);
    width: calc(var(--element-width) - 20px);
}
.wp-block-separator.is-style-animate::after {
    left: calc(var(--element-width) - 20px);
}

.wp-block-separator.is-style-animate-left,
.wp-block-separator.is-style-animate-right {
    width: calc( var(--scroll-top, 0) * var(--animate-scale, 1));
}

.wp-block-separator.is-style-animate-left {
    --animate-scale: 0.5;
    margin-inline-start: auto;
}
.wp-block-separator.is-style-animate-right {
    --animate-scale: 0.25;
}
.wp-block-separator.is-style-animate-left::after {
    right: calc( var(--scroll-top, 0) * var(--animate-scale, 1) );
}
.wp-block-separator.is-style-animate-right::after {
    left: calc( var(--scroll-top, 0) * var(--animate-scale, 1) );
}

/* Contact Page */

.contact-info-block,
.wp-block-columns.contact-columns > .wp-block-column {
    border-radius: 3px;
}

.wp-block-columns.contact-columns > .wp-block-column {
    position: relative;

    &::after {
        background-image: url(../icons/arrow-corner--gold.svg);
        background-repeat: no-repeat;
        content: '';
        height: 1rem;
        position: absolute;
        right: 1.25rem;
        top: 1.25rem;
        width: 1rem;
    }
}

/* Splide Pagination */

.splide__pagination .splide__pagination__page {
    background-color: #D2B18066;
}

.splide__pagination .splide__pagination__page.is-active {
    background-color: #CDB286;
}

/* Block Toggles */

.announcement-slider__toggles {
    width: 100%;
}

.announcement-slider__toggle {
    background-color: #262626;
    color: #D9D9D9;
    border-radius: 3px;
    border-width: 0;
    padding: var(--wp--preset--spacing--30) var(--wp--preset--spacing--40);
    margin-inline-end: var(--wp--preset--spacing--30);
}

/* Announcement Slider */

.announcement-slider__track {
    overflow: hidden !important;
    overflow: visible !important;
}

.announcement-slide {
    overflow: visible;
    position: relative;

    &:hover {
        & .announcement-slide__background>img {
            transform: scale(1.125);
        }

        & > .announcement-slide__background::before {
            opacity: 0;
        }
    }

    &::after,
    &::before {
        content: '';
        display: none;
        pointer-events: none;
        position: absolute;
    }

    &::before {
        animation: move_ball_slide 0.8s cubic-bezier(0.25, 0.1, 0.25, 1) forwards;
        background-color: var(--wp--preset--color--primary-light);
        border-radius: 100%;
        height: 10px;
        transform: translateX(50%) translateY(-50%);
        width: 10px;
    }

    &::after {
        animation: grow_box_slide 0.8s cubic-bezier(0.25, 0.1, 0.25, 1) forwards;
        border: 2px solid var(--wp--preset--color--primary-light);
        border-left-width: 0;
        border-top-width: 0;
        bottom: -1rem;
        left: 1rem;
    }

    &.is-active {

        &::after,
        &::before {
            display: block;
        }
    }
}

.announcement-slide__link {
    bottom: 0;
    color: transparent !important;
    height: 100%;
    left: 0;
    position: absolute;
    width: 100%;
    z-index: 30;
}

.announcement-slide__content {
    align-items: flex-start;
    bottom: 0;
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: flex-end;
    left: 0;
    max-height: 100%;
    padding: var(--wp--preset--spacing--50) var(--wp--preset--spacing--50);
    position: absolute;
    width: 100%;
    z-index: 20;
}

.announcement-slide__content--start .announcement-slide__logo,
.announcement-slide__content--start .announcement-slide__type {
    text-align: left;
}

.announcement-slide__content--end .announcement-slide__logo,
.announcement-slide__content--end .announcement-slide__type {
    text-align: end;
}

.announcement-slide__title {
    font-size: 1.125rem;
}

.announcement-slide__background,
.announcement-slide__title,
.announcement-slide__excerpt {
    margin-bottom: 0;
    margin-block-end: 0;
}

.announcement-slide__background {
    height: 100%;
    overflow: hidden;

    &::before {
        background-color: #000;
        background-color: var(--wp--preset--color--contrast);
        bottom: 0;
        content: '';
        height: 100%;
        left: 0;
        opacity: 0.4;
        position: absolute;
        transition: opacity 0.25s ease-out;
        width: 100%;
        z-index: 10;
    }
}

.announcement-slide__background > img {
    height: 100%;
    max-height: 550px;
    max-width: 100%;
    object-fit: fill;
    object-fit: cover;
    transition: transform 0.25s ease-out;
    width: auto;
}

.announcement-slider .splide__pagination {
    bottom: unset;
    top: calc(100% + 1.5rem);
}

.announcement-slide__title,
.announcement-slide__type {
    text-shadow: var(--text-shadow);
}

.announcement-slide__logo,
.announcement-slide__type {
    align-self: center;
    text-align: center;
}

.announcement-slide__logo {
    filter: drop-shadow(var(--text-shadow));
    height: auto;
    max-width: 6.75rem;
}

.announcement-slide__type {
    font-family: var(--wp--preset--font-family--oswald);
    font-size: 125%;
    font-weight: bold;
    margin-block: 0.5em;
    order: -1;
}

.announcement-slide__spacer {
    display: block;
    margin: auto;
}

@media (prefers-reduced-motion: reduce) {
    .announcement-slide {
        &::after,
        &::before {
            opacity: 0;
            transition: opacity 1s cubic-bezier(0.25, 0.1, 0.25, 1);
        }

        &.is-active {

            &::after,
            &::before {
                opacity: 1;
            }
        }
    }
}

@keyframes grow_box_slide {
    0% {
        height: 0%;
        width: 0%;
    }

    50% {
        height: 0%;
        width: 100%;
    }

    100% {
        height: calc(100% + 2rem);
        width: 100%;
    }
}

@keyframes move_ball_slide {
    0% {
        right: calc(100% - 1rem);
        top: calc(100% + 1rem);
    }

    50% {
        right: calc(0% - 1rem);
        top: calc(100% + 1rem);
    }

    100% {
        right: -1rem;
        top: -1rem;
    }
}
