/* STH Child Theme Styles - v1.0.0 */

/* -------------------------------------------------
   FONTS
---------------------------------------------------- */
@import url('https://fonts.googleapis.com/css2?family=Raleway:ital,wght@0,100..900;1,100..900&display=swap');

/* -------------------------------------------------
   VARIABLES
---------------------------------------------------- */
:root {
    /* brand color palette */
    --palette-transparent: 0;
    --palette-black: #000000;
    --palette-midnight: #232323;
    --palette-charcoal: #303030;
    --palette-gray-dark: #666666;
    --palette-gray-light: #9d9d9d;
    --palette-gray-lightish: #c0c0c0;
    --palette-gray-lighter: #dfdfdf;
    --palette-gray-lightest: #e8e8e8;
    --palette-light: #f8f8f8;
    --palette-white: #ffffff;
    --palette-crimson: #be0020;

    /* fonts */
    --font-family-sans:
        'Raleway',
        'ui-sans-serif',
        'system-ui',
        '-apple-system',
        'BlinkMacSystemFont',
        '"Segoe UI"',
        'Roboto',
        'Arial',
        '"Noto Sans"',
        'sans-serif',
        '"Apple Color Emoji"',
        '"Segoe UI Emoji"',
        '"Segoe UI Symbol"',
        '"Noto Color Emoji"';
    --font-family-serif:
        'ui-serif',
        'Georgia',
        'Cambria',
        '"Times New Roman"',
        'Times',
        'serif';

    /* type size (static) */
    --text-static-size-11: 0.6875rem;  /* 11px */
    --text-static-size-12: 0.75rem;    /* 12px */
    --text-static-size-13: 0.8125rem;  /* 13px */
    --text-static-size-14: 0.875rem;   /* 14px */
    --text-static-size-16: 1rem;       /* 16px */
    --text-static-size-20: 1.25rem;    /* 20px */
    --text-static-size-24: 1.5rem;     /* 24px */
    --text-static-size-30: 1.875rem;   /* 30px */
    --text-static-size-36: 2.25rem;    /* 36px */
    --text-static-size-42: 2.625rem;   /* 42px */
    --text-static-size-48: 3rem;       /* 48px */

    /* type size (fluid) */
    /*
        Calculator at https://utopia.fyi/type/calculator
        min-viewport: 480
        max-viewport: 1440
    */
    --text-fluid-size-xl: clamp(2.25rem, 2.0625rem + 0.625vw, 2.625rem);    /* 36px -> 42px */
    --text-fluid-size-lg: clamp(1.875rem, 1.6875rem + 0.625vw, 2.25rem);    /* 30px -> 36px */
    --text-fluid-size-md: clamp(1.5rem, 1.3125rem + 0.625vw, 1.875rem);     /* 24px -> 30px */
    --text-fluid-size-sm: clamp(1.25rem, 1.125rem + 0.4167vw, 1.5rem);      /* 20px -> 24px */
    --text-fluid-size-xs: clamp(1rem, 0.875rem + 0.4167vw, 1.25rem);        /* 16px -> 20px */

    /* line height */
    --lh-body: 1.6;
    --lh-body-tight: 1.3;
    --lh-hdg: 1.214;
    --lh-hdg-loose: 1.53;
}

/* -------------------------------------------------
   GLOBALS
---------------------------------------------------- */
html {
    background-color: var(--palette-black); /* overscroll */
}

body {
    font-family: var(--font-family-sans);
    font-size: var(--text-static-size-16);
    font-weight: 400;
    line-height: var(--lh-body);
    color: var(--palette-gray-dark);
}

/* lock scroll when mega nav is open */
body.sth-drawer-open,
body:has(#sth-mega-nav.is-open) {
    overflow: hidden;
}

h1, h2, h3, h4, h5, h6 {
    line-height: var(--lh-hdg);
    font-family: var(--font-family-sans);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.25px;
    text-wrap: balance;
}

h1 { font-size: var(--text-fluid-size-lg); }
h2 { font-size: var(--text-fluid-size-md); }
h3 { font-size: var(--text-fluid-size-sm); }
h4 { font-size: var(--text-fluid-size-xs); }
h5 { font-size: var(--text-fluid-size-xs); }
h6 { font-size: var(--text-fluid-size-xs); }

/* override storefront theme */
:is(p, ul, ol, table, blockquote, form) + :is(h1, h2, h3, h4, h5, h6) {
    margin-top: 1.5em;
}

/* form overrides */
input[type=text],
input[type=number],
input[type=email],
input[type=tel],
input[type=url],
input[type=password],
input[type=search],
textarea,
.input-text {
    background-color: var(--palette-white);
    color: var(--palette-charcoal);
    border: 1px solid var(--palette-gray-light);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.25);
    font-family: var(--font-family-sans);

    &:focus {
        background-color: var(--palette-white);
    }
}

*:focus:not(:focus-visible) {
    outline: none;
}

/* -------------------------------------------------
   WORDPRESS MAINTENANCE PAGE
---------------------------------------------------- */
body.page-template-page-maintenance {
    min-height: 100dvh !important;
}

body.page-template-page-maintenance > main {
    max-width: 600px;
    padding-inline: 40px;
    margin-left: auto;
    margin-right: auto;
    padding-top: 100px;
}

/* -------------------------------------------------
   Use nested body ID to theme lock styles
   and increase specificity
---------------------------------------------------- */
#sth-theme {

    /* -------------------------------------------------
       SITE OVERRIDES
    ---------------------------------------------------- */
    .site {
        /* override storefront hidden value */
        /* required for sticky masthead */
        overflow-x: clip;
    }

    .content-area,
    .site-main {
        margin-bottom: 0 !important;
    }

    .site-footer {
        background-color: var(--palette-black) !important;
    }

    /* -------------------------------------------------
       GENERAL TYPOGRAPHY OVERRIDES
    ---------------------------------------------------- */
    /* force headers to inital alignment */
    .entry-header {
        text-align: start;
    }

    /* restore centering to some page heeaders */
    &.woocommerce-cart .entry-header,
    &.woocommerce-checkout .entry-header  {
        text-align: center;
    }

    .woocommerce-loop-product__title {
        font-size: var(--text-static-size-13);
        line-height: var(--lh-hdg-loose);
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 1px;
        text-wrap: balance;
    }

    /* button override defaults */
    .button {
        text-transform: uppercase !important;
        letter-spacing: 0.5px !important;
        font-weight: 600 !important;
        font-family: var(--font-family-sans) !important;
        font-size: var(--text-static-size-14) !important;

        &.iconic-ww-button {
            font-size: var(--text-static-size-11) !important;
            padding: 6px 12px !important;
            margin-bottom: 0 !important;
        }
    }

    /* helper */
    .sth-txt-balance {
        text-wrap: balance;
    }

    /* -------------------------------------------------
       CUSTOM NOTIFICATION BAR
    ---------------------------------------------------- */
    #sth-notification-bar {
        position: relative;
        z-index: 9500;
        padding: 10px 30px;
        background-color: var(--palette-crimson);
        color: var(--palette-white);
        font-family: var(--font-family-sans);
        font-size: var(--text-static-size-14);
        line-height: 1.4;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        text-align: center;
    }

    @media (max-width: 767px) {
        #sth-notification-bar {
            font-size: var(--text-static-size-13);
        }
    }

    /* -------------------------------------------------
       CUSTOM FEATURED PRODUCTS BLOCK
    ---------------------------------------------------- */
    .sth-featured-products {
        max-width: 100% !important;
        width: 100% !important;
    }

    .sth-featured-products a {
        text-decoration: none !important;
    }

    .sth-featured-products ul.wc-block-product-template {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    /* -------------------------------------------------
       WOOCOMMERCE PDP
    ---------------------------------------------------- */
    &.single-product {
        /* force styles on empty ppcp recaptcha div */
        #ppcp-recaptcha-v2-container:empty {
            margin: 0 !important;
        }

        /* product page title */
        .product_title {
            margin-bottom: 8px;
            font-size: var(--text-fluid-size-sm);
            font-weight: 700;
            letter-spacing: 1px;
            text-transform: uppercase;
        }

        /* price */
        .price {
            margin-block: 20px;
            font-size: var(--text-fluid-size-xs);
            color: var(--palette-charcoal);
            font-weight: 600;

            del,
            ins {
                font-weight: 600;
            }
        }

        .product_meta {
            padding-top: 20px;
            margin-bottom: 25px;
            border: none;

            /* hide SKU accessibility */
            .sku_wrapper {
                width: 1px !important;
                height: 1px !important;
                margin: -1px !important;
                border: 0 !important;
                padding: 0 !important;
                clip: rect(0, 0, 0, 0) !important;
                clip-path: inset(100%) !important;
                overflow: hidden !important;
                position: absolute !important;
                white-space: nowrap !important;
            }
        }

        /* hide edit link */
        .edit-link {
            display: none;
        }

        /* hide div entirely when in-stock */
        .woocommerce-variation-availability:has(.in-stock) {
            display: none !important;
        }

        /* space around stock / waitlist in products */
        p.stock.out-of-stock {
            border: 1px solid var(--palette-charcoal);
            border-bottom: none;
            padding: 16px 20px 4px 20px; /* matches variant margin-bottom */
            margin-bottom: 0;

            ~ .wcwl_elements {
                border: 1px solid var(--palette-charcoal);
                border-top: none;
                padding: 0 20px 16px;
                margin-bottom: 32px;
            }
        }

        .sth-pdp-price-snippet {
            font-size: var(--text-static-size-11);
            text-transform: uppercase;
            letter-spacing: 0.5px;
            font-weight: 600;
            color: var(--palette-black);
            margin-bottom: 20px;
        }

        /* upsells divider */
        .upsells.products,
        .related.products {
            clear: both;
            border-top: 1px solid var(--palette-gray-dark);
            padding-top: 40px;
        }
    }

    /* -------------------------------------------------
        WOOCOMMERCE PDP GALLERY
    ---------------------------------------------------- */
    &.single-product {
        .woocommerce-product-gallery__wrapper .zoomImg {
            display: none !important; /* hide zoom Image */
        }

        .woocommerce-product-gallery__image a,
        .woocommerce-product-gallery__image img {
            /* disable click / hover zoom */
            pointer-events: none;
            cursor: default;
        }

        @media (max-width: 767px) {
            .woocommerce-product-gallery__trigger {
                display: none !important; /* hide zoom button over image */
            }
        }

        .woocommerce-product-gallery__image img {
            width: 100%;
            height: auto;
        }

        .woocommerce-product-gallery .flex-viewport {
            margin-bottom: 6px;
        }

        .woocommerce-product-gallery .flex-control-thumbs {
            display: grid;
            grid-template-columns: repeat(5, 1fr);
            gap: 6px;
            margin-top: 6px;
            padding-bottom: 4px;

            @media (min-width: 600px) and (max-width: 767px) {
                grid-template-columns: repeat(6, 1fr);
            }

            &::before,
            &::after {
                content: none;
            }

            li {
                float: none;
                margin: 0;
                width: auto;

                img {
                    width: 100%;
                    height: auto;
                    aspect-ratio: 1;
                    object-fit: cover;
                    opacity: 0.6;
                    transition: opacity 0.2s ease;

                    &.flex-active,
                    &:hover {
                        opacity: 1;
                    }
                }
            }
        }
    }

    /* -------------------------------------------------
        WOOCOMMERCE PDP VARIATION SWATCHES
    ---------------------------------------------------- */
    &.single-product {
        .sth-swatches {
            margin-bottom: 1em;
        }

        .sth-swatches__label-row {
            display: flex;
            align-items: center;
            margin-bottom: 10px;
        }

        .sth-swatches__label {
            font-size: var(--text-static-size-13);
            line-height: var(--lh-hdg-loose);
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: 1px;
            color: var(--palette-charcoal);
        }

        .sth-swatches__buttons {
            display: flex;
            flex-wrap: wrap;
            gap: 6px;
        }

        .sth-swatch {
            min-width: 46px; /* allows for similar sized number only swatches */
            padding: 8px 12px;
            border: 1px solid var(--palette-gray-light);
            background: var(--palette-white);
            color: var(--palette-charcoal);
            font-family: var(--font-family-sans);
            font-size: var(--text-static-size-13);
            font-weight: 500;
            text-transform: uppercase;
            letter-spacing: 0.5px;
            cursor: pointer;
            position: relative;
            transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease;

            &.is-selected {
                background: var(--palette-charcoal);
                border-color: var(--palette-charcoal);
                color: var(--palette-white);
                font-weight: 700;
            }

            &.is-out-of-stock {
                background: var(--palette-gray-lightest) !important;
                color: var(--palette-gray-light) !important;
            }

            &:hover:not(.is-selected) {
                border-color: var(--palette-charcoal);
            }
        }

        /* Hide native variations table */
        .variations_form table.variations {
            display: none;
        }
    }

    /* -------------------------------------------------
        WOOCOMMERCE PDP ADD TO CART
    ---------------------------------------------------- */
    &.single-product {
        .woocommerce-variation-add-to-cart-disabled:has(.wc-variation-is-unavailable) {
            display: none !important;
        }

        .product.outofstock .woocommerce-variation-add-to-cart {
            display: none !important;
        }

        .woocommerce-variation-add-to-cart {
            display: flex;
            flex-flow: row nowrap;

            .quantity {
                float: none;
            }

            .single_add_to_cart_button {
                flex-grow: 1;
            }
        }

        .single_add_to_cart_button {
            /* inherits a bunch from .button */
            display: block;
            width: 100%;
            max-width: 320px;
            border: 1px solid var(--palette-charcoal);
            background-color: var(--palette-charcoal) !important;
            color: var(--palette-white) !important;
            opacity: 1 !important;
            font-size: var(--text-static-size-16) !important;
        }

        .woocommerce_waitlist button {
            margin-block: 0;
        }
    }

    /* -------------------------------------------------
        WOOCOMMERCE PDP HIGHLIGHTS
    ---------------------------------------------------- */
    &.single-product {
        .sth-product-highlights {
            margin-block: 25px;
        }

        .sth-product-highlights-title {
            margin-bottom: 20px;
        }

        .sth-product-highlights-content {
            display: grid;
            gap: 12px;
        }

        .sth-product-highlight {
            display: grid;
            gap: 16px;

            .sth-highlight-media {
                position: relative;

                .sth-highlight-image {

                }

                .sth-highlight-play {
                    position: absolute;
                    inset: 0;
                    padding: 0;
                    margin: 0;
                    border: 0;
                    background-color: transparent;
                    cursor: pointer;

                    /* position play button */
                    display: flex;
                    align-items: center;
                    justify-content: center;

                    &::before {
                        content: "";
                        width: 72px;
                        height: 72px;
                        border-radius: 50%;
                        background-color: var(--palette-black);
                        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M8 5v14l11-7z'/%3E%3C/svg%3E");
                        background-repeat: no-repeat;
                        background-position: 54% center;
                        background-size: 44%;
                        transition: background-color 0.15s ease, transform 0.15s ease;
                    }
                }
            }

            .sth-highlight-media--playing {
                aspect-ratio: 16 / 9; /* std youtube aspect */

                &.sth-highlight-media--playing.sth-highlight-media--portrait {
                    aspect-ratio: 9 / 16; /* shorts aspect ratio */
                    max-width: 360px;
                }

                iframe {
                    width: 100%;
                    height: 100%;
                    display: block;
                    border: 0;
                }
            }
        }
    }

    /* -------------------------------------------------
        WOOCOMMERCE PDP TRUSTIPLOT - CUSTOM WIDGET
    ---------------------------------------------------- */
    &.single-product {
        .sth-trustpilot {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            color: var(--palette-charcoal);
            text-decoration: none;
        }

        .sth-trustpilot__stars {
            display: block;
            height: 14px;
            width: auto;
        }

        .sth-tp-star--empty {
            fill: var(--sth-trustpilot-empty, var(--palette-gray-lighter));
        }

        .sth-tp-star--full {
            fill: var(--sth-trustpilot-full, var(--palette-charcoal));
        }

        .sth-trustpilot__count {
            font-size: var(--text-static-size-14);
            line-height: 1;
            color: var(--palette-charcoal);
        }
    }

    /* -------------------------------------------------
        WOOCOMMERCE PDP TRUSTIPLOT - NORMAL WIDGET
    ---------------------------------------------------- */
    &.single-product {
        .sth-trustpilot-pdp-secondary {
            background-color: var(--palette-gray-lightest);
            padding: 20px;
            margin-block: 20px;

            &:has(.trustpilot-widget iframe[style*="display: none"]) {
                display: none !important;
            }
        }

        h2.product_title:has(+ .sth-trustpilot-pdp-secondary .trustpilot-widget iframe[style*="display: none"]) {
            display: none !important;
        }
    }

    /* -------------------------------------------------
        WOOCOMMERCE PDP AFFIRM
    ---------------------------------------------------- */
    &.single-product {
        form.cart {
            &:has(+ .affirm-as-low-as) {
                margin-bottom: 5px !important;

                .single_add_to_cart_button {
                    margin-bottom: 0px !important;
                }
            }

            &:has(.out-of-stock) + .affirm-as-low-as {
                display: none !important;
            }

            + .affirm-as-low-as {
                font-size: var(--text-static-size-14);
                margin-bottom: 20px !important;
            }
        }
    }

    /* -------------------------------------------------
        WOOCOMMERCE PDP - ACCORDION TABS
    ---------------------------------------------------- */
    &.single-product {
        .sth-accordion {
            margin-top: 25px;
            border-top: 1px solid var(--palette-gray-light);
        }

        .sth-accordion__item {
            padding-inline: 10px;
            border-bottom: 1px solid var(--palette-gray-light);
        }

        .sth-accordion__trigger {
            display: flex;
            align-items: center;
            justify-content: space-between;
            width: 100%;
            padding: 18px 0;
            background: none;
            border: none;
            cursor: pointer;
            text-align: left;
            color: var(--palette-charcoal);
            font-family: var(--font-family-sans);
            font-size: var(--text-static-size-13);
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: 1.5px;
            gap: 16px;
        }

        .sth-accordion__chevron {
            flex-shrink: 0;
            width: 12px;
            height: 12px;
            transition: transform 220ms ease;
        }

        .sth-accordion__trigger[aria-expanded="true"] .sth-accordion__chevron {
            transform: rotate(180deg);
        }

        .sth-accordion__panel {
            font-size: var(--text-static-size-14);
            padding-bottom: 28px;
        }
    }

    /* -------------------------------------------------
        WOOCOMMERCE PDP SIZE CHART OVERRIDES
    ---------------------------------------------------- */
    &.single-product {
        .sth-has-size-chart {
            #chart_des {
                /* text size set via accordion */
                p:has(img) {
                    max-width: 420px;
                    margin-block: 40px;

                    img {
                        margin-bottom: 10px;
                    }
                }
            }
            .responsive {
                overflow-x: auto; /* force horizontal scroll on all screen sizes */
            }

            table {
                border-collapse: collapse !important;
                font-size: var(--text-static-size-12) !important;
                line-height: var(--lh-body-tight) !important;

                &:not(:has(td)) {
                    display: none; /* hide tables without cells */
                }
            }

            th, td {
                vertical-align: middle !important;
                padding: 8px 10px !important;
                border: 1px solid var(--palette-gray-lighter) !important;
            }

            th {
                background-color: var(--palette-gray-lightish) !important;
                font-weight: 600 !important;
            }

            td {
                background-color: var(--palette-white) !important;
            }

            tr:nth-child(2n+1) td {
                /* zebra striping */
                background-color: var(--palette-light) !important;
            }
        }
    }

    /* -------------------------------------------------
        WOOCOMMERCE CART - WHEN EMPTY
    ---------------------------------------------------- */
    &.woocommerce-cart {
        /* force hide smiley face */
        .wc-block-cart__empty-cart__title.with-empty-cart-icon:before {
            content: none;
            display: none;
        }

        .entry-header :has(~ .entry-content:has(.wp-block-woocommerce-empty-cart-block)) {
            display: none;
        }

        .hentry:has(.wp-block-woocommerce-empty-cart-block) .entry-header {
            display: none;
        }
    }

    /* -------------------------------------------------
       WOOCOMMERCE CART - WHEN FULL
    ---------------------------------------------------- */
    &.woocommerce-cart {
        /* block cart mods */
        .wc-block-cart .wp-block-woocommerce-cart-order-summary-block {
            border-bottom: none !important;
        }

        /* upsell products */
        .wc-block-product-template {
            margin-left: 0;
        }

        .wp-block-post-title a {
            text-decoration: none;
        }

        .wp-block-post-title {
            font-size: var(--text-static-size-13) !important;
            line-height: var(--lh-hdg-loose) !important;
            font-weight: 700 !important;
            text-transform: uppercase !important;
            letter-spacing: 1px !important;
            text-wrap: balance !important;
        }
    }

    /* -------------------------------------------------
       WOOCOMMERCE CHECKOUT
    ---------------------------------------------------- */
    &.woocommerce-checkout {

        /* custom shipping note */
        .wc-block-components-shipping-rates-control:has(.sth-checkout-shipping-note) {
            display: grid;

            .sth-checkout-shipping-note {
                order: -1;
                margin-bottom: 12px;
                padding: 10px 16px;
                background-color: var(--palette-gray-lighter);

                font-size: var(--text-static-size-14);
                line-height: var(--lh-body-tight);
                font-weight: 700;
                text-transform: uppercase;
                letter-spacing: 1px;
            }
        }
    }

    /* -------------------------------------------------
       CUSTOM STORE LOCATOR LIST
    ---------------------------------------------------- */
    ul.sth-locator-list,
    ol.sth-locator-list {
        column-count: 1;
        margin-inline: 0;
        list-style: none !important;
    }

    @media (min-width: 768px) {
        ul.sth-locator-list,
        ol.sth-locator-list {
            column-count: 2;
        }
    }

    @media (min-width: 1024px) {
        ul.sth-locator-list,
        ol.sth-locator-list {
            column-count: 3;
        }
    }

    /* -------------------------------------------------
       WOOCOMMERCE BREAD CRUMBS
    ---------------------------------------------------- */
    .storefront-breadcrumb {
        background-color: var(--palette-gray-lightest);
        color: var(--palette-gray-dark);
    }

    /* hide breadcrumbs on some pages */
    &.woocommerce-cart .storefront-breadcrumb,
    &.woocommerce-checkout .storefront-breadcrumb {
        padding: 0 !important;

        .woocommerce-breadcrumb {
            display: none;
        }
    }

    /* hide breadcrumbs on small screen product pages */
    @media (max-width: 960px) {
        &.single-product .storefront-breadcrumb {
            padding: 0 !important;

            .woocommerce-breadcrumb {
                display: none;
            }
        }
    }

    /* -------------------------------------------------
       OVERRIDE PSWP
    ---------------------------------------------------- */
    .pswp {
        z-index: 99999999999999; /* unreasonable z-index to clear other plugins cruft */
    }

    /* -------------------------------------------------
       OVERRIDE SALES BADGE PLUGIN
    ---------------------------------------------------- */
    .asnp-esb-badge-1 p:empty {
        display: none; /* why cant we have nice things */
    }

    /* -------------------------------------------------
       OVERRIDE WISHLISTS PLUGIN
    ---------------------------------------------------- */
    .iconic-ww-badge {
        border-radius: 100px; /* pill shape */
        padding-inline: 12px;
        background-color: var(--palette-gray-dark);
        color: var(--palette-white);
        font-size: var(--text-static-size-14);
        font-weight: 500;
        text-transform: uppercase;
        letter-spacing: 1.5px;
    }

    .iconic-ww-badge--private {
        background-color: var(--palette-crimson);
    }

    /* -------------------------------------------------
        WOOCOMMERCE ORDER SUMMARY
    ---------------------------------------------------- */
    .wc-block-components-order-summary .wc-block-components-order-summary-item__quantity {
        background-color: var(--palette-crimson) !important;
        border-color: var(--palette-crimson) !important;
        color: var(--palette-white) !important;
        font-weight: 600 !important;
    }

    /* -------------------------------------------------
       WOOCOMMERCE NOTICES
    ---------------------------------------------------- */
    .woocommerce-message,
    .woocommerce-info,
    .woocommerce-error,
    .woocommerce-noreviews,
    p.no-comments {
        background-color: var(--palette-charcoal) !important;
        color: var(--palette-light) !important;
        border-color: rgba(255, 255, 255, 0.2);
        font-size: var(--text-static-size-14);
        line-height: var(--lh-hdg-loose);
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 1px;
        outline: 0;

        a {
            color: currentcolor !important;
            font-size: inherit !important;
            line-height: inherit !important;
            font-weight: inherit !important;
            text-transform: inherit !important;
            letter-spacing: inherit !important;
            text-decoration: underline;

            &.wc-forward {
                display: table; /* force onto new line */
                float: none;
                padding: 0;
                margin: 0;
                border: 0;
            }
        }

        &::before {
            color: currentcolor !important;
        }
    }

    .woocommerce-message {

    }

    .woocommerce-info {

    }

    .woocommerce-error {
        background-color: var(--palette-crimson) !important;
    }

    /* -------------------------------------------------
       WOOCOMMERCE STOCK NOTICES
    ---------------------------------------------------- */
    .stock {
        display: block;
        font-size: var(--text-static-size-14);
        line-height: var(--lh-hdg-loose);
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 1px;
        text-wrap: balance;
        padding-inline: 0;
        background-color: var(--palette-transparent);
    }

    .stock::before {
        content: none; /* remove stock smiley faces */
    }

    .stock.out-of-stock {
        color: var(--sth-danger-dark);
    }

    .stock.in-stock {
        display: none; /* unnecessary */
        color: var(--sth-success-dark);
    }

    /* -------------------------------------------------
       CUSTOM SELECT THEME
    ---------------------------------------------------- */
    .sth-select {
        position: relative;
        display: inline-block;
    }

    .sth-select::after {
        content: '';
        position: absolute;
        top: 50%;
        right: 12px;
        width: 10px;
        height: 6px;
        transform: translateY(-50%);
        background-color: var(--palette-charcoal);
        -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath d='M0 0L10 0L5 6Z'/%3E%3C/svg%3E");
        mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath d='M0 0L10 0L5 6Z'/%3E%3C/svg%3E");
        mask-size: contain;
        mask-repeat: no-repeat;
        pointer-events: none;
    }

    .sth-select select {
        background-color: var(--palette-white);
        border: 1px solid var(--palette-charcoal);
        border-radius: 0;
        height: 38px;
        color: var(--palette-charcoal);
        font-family: var(--font-family-sans);
        font-size: var(--text-static-size-14);
        font-weight: 500;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        padding: 0 32px 0 12px;
        appearance: none;
        -webkit-appearance: none;
        -moz-appearance: none;
        cursor: pointer;
    }

    .sth-select select:hover,
    .sth-select select:focus {
        border-color: var(--palette-charcoal);
        outline: none;
    }

    .sth-select select.orderby {
        width: 220px;
    }

    /* -------------------------------------------------
       WOOCOMMERCE SORTING BAR
    ---------------------------------------------------- */
    .storefront-sorting {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        background: var(--palette-gray-lightest);
        padding: 15px;
    }

    @media (max-width: 600px) {
        .storefront-sorting {
            flex-direction: column-reverse;
            align-items: flex-start;
            gap: 10px;
        }
    }

    .storefront-sorting .woocommerce-ordering {
        padding: 0;
        margin: 0;
    }

    .storefront-sorting::before,
    .storefront-sorting::after {
        display: none;
    }

    .storefront-sorting .woocommerce-notices-wrapper:empty {
        display: none;
    }

    .storefront-sorting .woocommerce-result-count {
        margin: 0;
        padding: 0;
        padding-right: 12px;
        float: none;
        font-size: var(--text-static-size-14);
        color: var(--palette-charcoal);
    }

    .woocommerce-ordering .select2-container {
        min-width: 220px;
    }

    /* -------------------------------------------------
       WP BLOCK EDITOR FIXES & OVERRIDES
    ---------------------------------------------------- */
    .has-custom-border img.has-border-color {
        border-style: solid;
    }

    /* -------------------------------------------------
       CUSTOM MASTHEAD
    ---------------------------------------------------- */
    #sth-masthead-wrapper {
        position: sticky;
        top: 0;
        z-index: 9999;
    }

    #sth-masthead-wrapper:has(#sth-masthead.isOffscreen) {
        pointer-events: none;
    }

    #sth-masthead {
        background-color: var(--palette-black);
        position: relative;
        transition: transform 220ms ease;
    }

    #sth-masthead.isOffscreen {
        transform: translateY(-100%);
    }

    #sth-masthead-inner {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 30px 0px;
    }

    @media (max-width: 960px) {
        #sth-masthead-inner {
            display: grid;
            grid-template-columns: 1fr auto 1fr;
            align-items: center;
            padding: 20px 0;
        }
    }

    /* -------------------------------------------------
       CUSTOM MASTHEAD - LOGO
    ---------------------------------------------------- */
    #sth-logo img {
        display: block;
        max-width: 150px;
        height: auto;
    }

    @media (max-width: 960px) {
        #sth-logo {
            justify-self: center;
            position: static;
            transform: none;
        }

        #sth-logo img {
            max-width: 120px;
        }
    }

    /* -------------------------------------------------
       CUSTOM MASTHEAD - NAV GROUP
    ---------------------------------------------------- */
    #sth-nav-group {
        display: flex;
        align-items: center;
        gap: 24px;
    }

    @media (max-width: 960px) {
        #sth-nav-group {
            gap: 0;
            justify-self: end;
        }
    }

    /* -------------------------------------------------
       CUSTOM MASTHEAD - PRIMARY NAV
    ---------------------------------------------------- */
    /* override storefront CSS on nav-menu */
    #sth-primary-nav ul.nav-menu {
        overflow: visible;
        max-height: none;
    }

    #sth-primary-nav ul {
        display: flex;
        align-items: center;
        list-style: none;
        margin: 0;
        padding: 0;
        gap: 0;
    }

    #sth-primary-nav ul li {
        position: relative;
    }

    #sth-primary-nav ul li a {
        display: block;
        padding: 10px 14px;
        font-family: var(--font-family-sans);
        font-size: var(--text-static-size-14);
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 2.5px;
        color: var(--palette-white);
        text-decoration: none;
        white-space: nowrap;
    }

    #sth-primary-nav ul li a:hover {
        color: var(--palette-gray-light);
    }

    #sth-primary-nav button {
        background: none;
        border: none;
        cursor: pointer;
        display: inline-flex;
        align-items: center;
        gap: 6px;
        padding: 10px 14px;
        font-family: var(--font-family-sans);
        font-size: var(--text-static-size-14);
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 2.5px;
        color: var(--palette-white);
        white-space: nowrap;
        -webkit-appearance: none;
        appearance: none;
    }

    #sth-primary-nav button .mega-nav-caret svg {
        width: 12px;
        height: 12px;
        display: block;
        transition: transform 220ms ease;
    }

    #sth-primary-nav button:hover {
        color: var(--palette-gray-light);
    }

    #sth-primary-nav button[aria-expanded="true"] .mega-nav-caret svg {
        transform: rotate(180deg);
    }

    /* Hide default submenus - mega nav handles these */
    #sth-primary-nav ul ul {
        display: none;
    }

    @media (max-width: 960px) {
        #sth-primary-nav {
            display: none;
        }
    }

    /* -------------------------------------------------
       CUSTOM MASTHEAD - UTILITY NAV
    ---------------------------------------------------- */
    #sth-utility-nav {
        display: flex;
        align-items: center;
        gap: 12px;
    }

    #sth-utility-nav svg {
        display: block;
        height: 24px;
        width: 24px;
    }

    #sth-utility-nav a {
        color: var(--palette-white);
        text-decoration: none;
    }

    #sth-utility-nav a:hover {
        color: var(--palette-gray-light);
    }

    /* -------------------------------------------------
       CUSTOM MASTHEAD - CART INDICATOR
    ---------------------------------------------------- */
    #sth-cart-link {
        position: relative;
    }

    #sth-cart-count {
        display: none;
        position: absolute;
        top: -2px;
        right: -4px;
        width: 8px;
        height: 8px;
        background-color: var(--palette-crimson);
        border-radius: 50%;
    }

    #sth-cart-count.has-items {
        display: block;
    }

    /* -------------------------------------------------
       CUSTOM MASTHEAD - HAMBURGER
    ---------------------------------------------------- */
    #sth-hamburger {
        display: none;
    }

    @media (max-width: 960px) {
        #sth-hamburger {
            display: flex;
            flex-direction: column;
            justify-self: start;
            gap: 5px;
            background: none;
            border: none;
            cursor: pointer;
            padding: 5px;
            order: -1;
        }

        #sth-hamburger span {
            display: block;
            width: 22px;
            height: 2px;
            background-color: var(--palette-white);
            transition: all 0.2s ease;
        }
    }

    /* -------------------------------------------------
       CUSTOM MASTHEAD - MOBILE NAV
    ---------------------------------------------------- */
    #sth-mobile-nav {
        display: none;
    }

    @media (max-width: 960px) {
        #sth-mobile-nav {
            position: fixed;
            top: 0;
            left: 0;
            width: 85dvw;
            max-width: 360px;
            height: 100dvh;
            background-color: var(--palette-midnight);
            z-index: 10002;
            transform: translateX(-100%);
            transition: transform 250ms ease;
            overflow-y: auto;
            display: flex;
            flex-direction: column;
        }

        #sth-mobile-nav.is-open {
            transform: translateX(0);
        }

        /* Close button - sticky so it stays visible while scrolling */
        #sth-mobile-close {
            position: sticky;
            top: 0;
            z-index: 1;
            flex-shrink: 0;
            display: flex;
            align-items: center;
            justify-content: flex-end;
            background-color: var(--palette-midnight);
            border: none;
            border-bottom: 1px solid var(--palette-charcoal);
            cursor: pointer;
            padding: 20px;
            color: var(--palette-white);
            -webkit-appearance: none;
            appearance: none;
        }

        #sth-mobile-close svg {
            width: 20px;
            height: 20px;
            display: block;
        }

        #sth-mobile-close:hover {
            color: var(--palette-gray-light);
        }

        /* Menu list */
        #sth-mobile-nav .menu {
            list-style: none;
            margin: 0;
            padding: 0 0 40px 0;
            overflow: visible;
            max-height: none;
        }

        /* Every li is a flex row - link + optional toggle sit side by side */
        #sth-mobile-nav .menu li {
            display: flex;
            flex-wrap: wrap;
            align-items: stretch;
            list-style: none;
        }

        /* Border only on top level items */
        #sth-mobile-nav .menu > li {
            border-bottom: 1px solid var(--palette-charcoal);
        }

        /* Sub-menus drop below the flex row at full width */
        #sth-mobile-nav .menu .sub-menu {
            width: 100%;
            list-style: none;
            margin: 0;
            padding: 0;
            overflow: visible;
            max-height: none;
            background-color: var(--palette-charcoal);
        }

        /* Base link/button - fills available row space */
        #sth-mobile-nav .menu li > a,
        #sth-mobile-nav .menu li > button:not(.sth-mobile-toggle) {
            flex: 1;
            min-width: 0;
            display: block;
            background: none;
            border: none;
            cursor: pointer;
            text-align: left;
            text-decoration: none;
            -webkit-appearance: none;
            appearance: none;
            font-family: var(--font-family-sans);
            text-transform: uppercase;
            color: var(--palette-white);
        }

        /* Level 0 - Collection, Shop, Information */
        #sth-mobile-nav .menu > li > a,
        #sth-mobile-nav .menu > li > button:not(.sth-mobile-toggle) {
            padding: 14px 16px 14px 24px;
            font-size: var(--text-static-size-16);
            font-weight: 600;
            letter-spacing: 2px;
        }

        /* Level 1 - Men's, Women's - same weight as level 0 */
        #sth-mobile-nav .menu > li > .sub-menu > li > a,
        #sth-mobile-nav .menu > li > .sub-menu > li > button:not(.sth-mobile-toggle) {
            padding: 14px 16px 14px 36px;
            font-size: var(--text-static-size-16);
            font-weight: 600;
            letter-spacing: 2px;
        }

        /* Level 2 - New Arrivals, Leather Jackets, etc */
        #sth-mobile-nav .menu > li > .sub-menu > li > .sub-menu > li > a {
            padding: 8px 16px 8px 48px;
            font-size: var(--text-static-size-14);
            font-weight: 500;
            letter-spacing: 1.5px;
            color: var(--palette-gray-lightish);
        }

        #sth-mobile-nav > .menu > li > .sub-menu > li + li {
            border-top: 1px solid var(--palette-midnight);
        }

        /* Level 3 - Shoes, Boots, Wide Width, Vegan */
        #sth-mobile-nav .menu > li > .sub-menu > li > .sub-menu > li > .sub-menu > li > a {
            padding: 8px 16px 8px 60px;
            font-size: var(--text-static-size-12);
            font-weight: 400;
            letter-spacing: 1.5px;
            color: var(--palette-gray-lightish);
        }

        /* Hover */
        #sth-mobile-nav .menu > li > a:hover,
        #sth-mobile-nav .menu > li > button:not(.sth-mobile-toggle):hover {
            color: var(--palette-white);
        }

        #sth-mobile-nav .menu .sub-menu li > a:hover {
            color: var(--palette-gray-lightish);
        }

        #sth-mobile-nav .menu > li > .sub-menu > li > .sub-menu > li > a:hover {
            color: var(--palette-gray-lightish);
        }

        /* Disclosure rows - full-width button, caret pushed to the right edge */
        #sth-mobile-nav .menu li > button.sth-mobile-disclosure {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 12px;
        }
    }

    /* -------------------------------------------------
       CUSTOM MASTHEAD - MOBILE DISCLOSURE + CARET
    ---------------------------------------------------- */
    .sth-mobile-disclosure__caret {
        flex-shrink: 0;
        display: flex;
        align-items: center;
    }

    .sth-mobile-disclosure__caret svg {
        width: 20px;
        height: 20px;
        min-width: 20px;
        min-height: 20px;
        display: block;
        overflow: visible;
        transition: transform 220ms ease;
    }

    .sth-mobile-disclosure[aria-expanded="true"] .sth-mobile-disclosure__caret svg {
        transform: rotate(180deg);
    }

    .sth-mobile-disclosure:hover {
        color: var(--palette-white) !important;
    }

    /* -------------------------------------------------
       CUSTOM MASTHEAD - NAV OVERLAY
    ---------------------------------------------------- */
    #sth-mobile-overlay {
        display: none;
        position: fixed;
        inset: 0;
        background-color: rgba(0, 0, 0, 0.5);
        z-index: 9000;
    }

    #sth-mobile-overlay.is-active {
        display: block;
    }

    @media (max-width: 960px) {
        /* on mobile overlay sits above masthead and notification bar */
        #sth-mobile-overlay {
            z-index: 10001;
        }
    }

    /* -------------------------------------------------
       CUSTOM MASTHEAD - MEGA NAV
    ---------------------------------------------------- */
    #sth-mega-nav {
        display: none;
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        background-color: var(--palette-midnight);
        border-top: 1px solid var(--palette-charcoal);
        z-index: 9999;
    }

    #sth-mega-nav.is-open {
        display: block;
    }

    #sth-mega-nav-inner {
        padding: 20px 0;
    }

    /* Top level - Men's / Women's grid */
    #sth-mega-nav > .col-full > #sth-mega-nav-inner > .sub-menu {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 30px;
        list-style: none;
        margin: 0;
        padding: 0;
    }

    /* Men's / Women's column headers */
    #sth-mega-nav .sub-menu > li > a {
        display: block;
        font-family: var(--font-family-sans);
        font-size: var(--text-static-size-14);
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 2.5px;
        color: var(--palette-white);
        text-decoration: none;
        padding-bottom: 8px;
        margin-bottom: 4px;
        border-bottom: 1px solid var(--palette-charcoal);
    }

    /* Sub-items within each column */
    #sth-mega-nav .sub-menu > li > .sub-menu {
        display: block;
        columns: 2;
        column-gap: 30px;
        list-style: none;
        margin: 0;
        padding: 0;
    }

    #sth-mega-nav .sub-menu > li > .sub-menu > li {
        break-inside: avoid;
        display: block;
    }

    /* All sub-item links */
    #sth-mega-nav .sub-menu > li > .sub-menu a {
        display: block;
        font-family: var(--font-family-sans);
        font-size: var(--text-static-size-12);
        font-weight: 500;
        text-transform: uppercase;
        letter-spacing: 1.5px;
        color: var(--palette-gray-light);
        text-decoration: none;
        padding: 2px 0;
        line-height: 1.8;
        border: none;
    }

    #sth-mega-nav .sub-menu > li > a:hover,
    #sth-mega-nav .sub-menu > li > .sub-menu a:hover,
    #sth-mega-nav .sub-menu > li > .sub-menu > li > .sub-menu a:hover {
        color: var(--palette-white);
    }

    /* Second level parent links - Shoes & Boots, Accessories */
    #sth-mega-nav .sub-menu > li > .sub-menu > li.menu-item-has-children > a {
        color: var(--palette-gray-light);
        font-weight: 600;
        margin-top: 10px;
        border: none;
    }

    /* Third level items - indented under their parent */
    #sth-mega-nav .sub-menu > li > .sub-menu > li > .sub-menu {
        display: block;
        columns: 1;
        list-style: none;
        margin: 0;
        padding: 0 0 0 15px;
    }

    #sth-mega-nav .sub-menu > li > .sub-menu > li > .sub-menu li {
        display: block;
    }

    #sth-mega-nav .sub-menu > li > .sub-menu > li > .sub-menu a {
        color: var(--palette-gray-light);
        padding: 1px 0;
        font-weight: 400;
        border: none;
    }

    /* break_before class creates column break in menu markup */
    #sth-mega-nav .break_before {
        break-before: column;
    }

    @media (max-width: 960px) {
        /* force hidden on small screens */
        #sth-mega-nav {
            display: none !important;
        }
    }

    /* -------------------------------------------------
       CUSTOM FOOTER - TOP
    ---------------------------------------------------- */
    #colophon {
        padding-block: 0; /* override parent theme */
        margin-block: 0; /* override parent theme */
    }

    .sth-footer {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        gap: 40px;
        padding: 100px 0 50px 0;
    }

    .sth-footer-section {
        display: flex;
        flex-direction: column;
        gap: 40px;
    }

    .sth-footer-section-brand-logo {
        max-width: 260px !important;
        height: auto;
    }

    .sth-footer-section-label {
        margin-bottom: 6px !important;
        font-family: var(--font-family-sans);
        font-size: var(--text-static-size-14);
        line-height: 1.4;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 2.5px;
        color: var(--palette-white) !important;
        text-decoration: underline;
        text-underline-offset: 4px;
    }

    .sth-footer-nav {
        list-style: none;
        margin: 0;
        padding: 0;
    }

    .sth-footer-nav a {
        display: inline-block;
        font-family: var(--font-family-sans);
        font-size: var(--text-static-size-12);
        line-height: 1.4;
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 1.5px;
        color: var(--palette-gray-light) !important;
        text-decoration: none !important;
    }

    .sth-footer-nav a:hover {
        color: var(--palette-white) !important;
    }

    .sth-social-icons {
        display: flex;
        flex-flow: row wrap;
        gap: 5px;
        margin-top: 12px;
    }

    .sth-social-icons a {
        color: var(--palette-gray-light) !important;
        text-decoration: none;
        display: block;
        line-height: 0.1;
    }

    .sth-social-icons a:hover {
        color: var(--palette-white) !important;
    }

    .sth-footer #mc4wp-form-1 .mc4wp-form-fields label {
        width: 1px !important;
        height: 1px !important;
        margin: -1px !important;
        border: 0 !important;
        padding: 0 !important;
        clip: rect(0, 0, 0, 0) !important;
        clip-path: inset(100%)!important;
        overflow: hidden !important;
        position: absolute !important;
        white-space: nowrap !important;
    }

    .sth-footer #mc4wp-form-1 .mc4wp-form-fields input[type="email"],
    .sth-footer #mc4wp-form-1 .mc4wp-form-fields input[type="text"] {
        background-color: var(--palette-light);
        margin: 5px 0 15px;
        padding: 10px 12px !important;
        border: 0;
        outline: 0;
        resize: none;
        font-size: 13px;
        line-height: 17px;
        color: var(--palette-gray-dark);
        font-family: var(--font-family-sans);
        font-weight: 400;
        box-sizing: border-box;
    }

    .sth-footer #mc4wp-form-1 .mc4wp-form-fields input[type="submit"] {
        color: var(--palette-white) !important;
        border: 2px solid var(--palette-white) !important;
        position: relative;
        display: block;
        width: auto;
        height: 39px;
        line-height: 36px;
        margin: 0 0 18px !important;
        padding: 0 23px;
        font-size: var(--text-static-size-14);
        font-weight: 600;
        font-family: var(--font-family-sans);
        text-align: left;
        text-decoration: none;
        cursor: pointer;
        white-space: nowrap;
        outline: 0;
        font-style: normal;
        text-transform: uppercase;
        letter-spacing: 1px;
        border-radius: 4px;
        text-shadow: none;
        background-color: transparent;
        transition: all .1s linear;
        box-sizing: initial
    }

    @media (max-width: 960px) {
        .sth-footer {
            grid-template-columns: 200px 1fr 1fr;
            gap: 60px;
        }

        .sth-footer-section-brand-logo {
            max-width: 100% !important;
        }
    }

    @media (max-width: 768px) {
        .sth-footer {
            padding-block: 60px;
            grid-template-columns: 260px 1fr;
        }

        .sth-footer-section-brand {
            grid-column-start: 1;
            grid-column-end: 3;
        }

        .sth-footer-section-links {
            grid-column-start: 1;
            grid-column-end: 2;
        }

        .sth-footer-section-more {
            grid-column-start: 2;
            grid-column-end: 3;
        }

        .sth-footer-section-brand .sth-footer-section-col-node {
            align-self: center;
        }

        .sth-footer-section-brand-logo {
            max-width: 260px !important;
        }
    }

    @media (max-width: 768px) {
        .sth-footer {
            grid-template-columns: 1fr;
        }

        .sth-footer-section-brand,
        .sth-footer-section-links,
        .sth-footer-section-more {
            grid-column: initial;
        }
    }

    /* -------------------------------------------------
       CUSTOM FOOTER - BOTTOM
    ---------------------------------------------------- */
    #sth-footer-bottom {
        padding-block: 30px 60px;
        font-size: var(--text-static-size-12);
        color: var(--palette-gray-lightest);
        text-align: center;
    }

    #sth-footer-bottom a {
        color: inherit;
    }

    .sth-moreinfo {
        padding-block: 12px;
    }

    /* -------------------------------------------------
       CUSTOM CATEGORY BANNER
    ---------------------------------------------------- */
    &.tax-product_cat .woocommerce-products-header {
        display: none !important; /* hide header the banner replaces */
    }

    .sth-banner {
        display: flex;
        flex-direction: column;
        justify-content: center;
        min-height: 400px;
        margin-bottom: 30px;
        padding: 30px;
        background-color: var(--palette-midnight);
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
        position: relative;
    }

    .sth-banner::after {
        content: "";
        position: absolute;
        inset: 0;
        background: rgba(0, 0, 0, 0.5);
    }

    .sth-banner-title {
        position: relative;
        z-index: 1;
        margin-bottom: 10px;
    }

    .sth-banner-title h1 {
        color: var(--palette-white);
        font-size: var(--text-static-size-24);
        text-align: center;
        text-transform: uppercase;
        letter-spacing: 1px;
        text-wrap: balance;
    }

    .sth-banner-desc {
        position: relative;
        z-index: 1;
        color: var(--palette-white);
        font-size: var(--text-static-size-16);
        text-align: center;
        text-wrap: balance;
    }

    .sth-banner-desc-inner {
        max-width: 600px;
        margin: 0 auto;
    }

    @media (min-width: 1000px) {
        .sth-banner {
            min-height: 520px;
        }

        .sth-banner-title h1 {
            font-size: var(--text-static-size-30);
        }

        .sth-banner-desc {
            font-size: var(--text-static-size-20);
        }
    }

    /* -------------------------------------------------
       404 PAGE
    ---------------------------------------------------- */
    &.error404 {
        .page-content {
            margin-bottom: 1.618em;

            @media (min-width: 768px) {
                margin-bottom: 3.706325903em;
            }
        }
    }
}
