body {
    #main-header {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;

        & .block {
            background-color: transparent;
            border-bottom: none;

            &::before {
                content: '';
                position: absolute;
                top: 62.43px;
                height: 1px;
                width: 100%;
                background-color: color-mix(in srgb, var(--wp--preset--color--footer-background) 50%, transparent);

            }


            &::after {
                content: '';
                position: absolute;
                top: 64.43px;
                height: 1px;
                width: 100%;
                background-color: color-mix(in srgb, var(--wp--preset--color--base) 5%, transparent);
            }

            & .content {
                & .site-brand {
                    & a {
                        color: var(--wp--preset--color--base);

                        & .logo {
                            --color--logo: var(--wp--preset--color--base);
                        }
                    }
                }

                & .avante-navigation {
                    & .main-navigation {
                        &>ul {
                            & li {
                                &>a {
                                    color: var(--wp--preset--color--base);

                                    &:hover {
                                        background-color: color-mix(in srgb, var(--wp--preset--color--primary) 15%, transparent);
                                    }
                                }
                            }
                        }
                    }

                    & .avante-custom-searchform {
                        & .section {
                            & .wp-block-search__input {
                                color: var(--wp--preset--color--base);
                                background-color: color-mix(in srgb, var(--wp--preset--color--primary) 15%, transparent);

                                &::placeholder {
                                    color: color-mix(in srgb, var(--wp--preset--color--base) 60%, transparent);
                                }
                            }

                            & .buttons-container {
                                & #searchsubmit {
                                    color: var(--wp--preset--color--base);

                                    &:hover {
                                        background-color: color-mix(in srgb, var(--wp--preset--color--primary) 15%, transparent);
                                    }
                                }
                            }
                        }
                    }
                }

                & .search-mobile__button {
                    &.active {
                        &:hover {
                            background-color: color-mix(in srgb, var(--wp--preset--color--primary) 15%, transparent);
                        }

                        &::before {
                            opacity: .2;
                        }

                        & .icon--wrapper {
                            & .bar {
                                background-color: var(--wp--preset--color--base);
                            }

                            &::before {
                                border-color: var(--wp--preset--color--base);
                            }

                            &::after {
                                background-color: var(--wp--preset--color--base);
                            }
                        }
                    }

                    & .icon--wrapper {
                        & .bar {
                            background-color: var(--wp--preset--color--base);
                        }

                        &::before {
                            border-color: var(--wp--preset--color--base);
                        }

                        &::after {
                            background-color: var(--wp--preset--color--base);
                        }
                    }
                }

                & .menu-mobile__button {
                    & .bar {
                        background-color: var(--wp--preset--color--base);

                        &::before,
                        &::after {
                            background-color: var(--wp--preset--color--base);
                        }
                    }
                }

                @media (width < 1199px) {
                    & .avante-custom-searchform {
                        background-color: color-mix(in srgb, var(--wp--preset--color--contrast) 50%, transparent);
                    }

                    & .main-navigation {
                        &.open {

                            & .glass-backdrop {
                                background-color: color-mix(in srgb, var(--wp--preset--color--contrast) 50%, transparent);
                            }
                        }

                        & .menu {
                            border: 2px solid color-mix(in srgb, var(--wp--preset--color--primary) 10%, transparent);
                        }
                    }
                }
            }
        }

        @media (width >=1200px) {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;

            & .block {
                background-color: transparent;
                border-bottom: none;

                &::before {
                    content: '';
                    position: absolute;
                    top: 82px;
                    height: 1px;
                    width: 100%;
                    background-color: color-mix(in srgb, var(--wp--preset--color--footer-background) 50%, transparent);

                }


                &::after {
                    content: '';
                    position: absolute;
                    top: 85px;
                    height: 1px;
                    width: 100%;
                    background-color: color-mix(in srgb, var(--wp--preset--color--base) 5%, transparent);
                }
            }
        }
    }

    .site-main {
        &>.block {
            position: sticky;
            top: 0;
            width: 100%;
            transform-origin: center top;
            transition: filter 0.6s ease, opacity 0.6s ease;

            &.is-bottom {
                filter: saturate(0.1) contrast(.7);
                pointer-events: none;
            }

            &:not(.in-view) *,
            &.is-bottom * {
                animation-play-state: paused !important;
            }

            &:last-of-type {
                margin-bottom: 0;
            }
        }

        & .block {
            & .content {
                padding: clamp(3rem, 10vw, 10rem) 0;

                @media (width >=1024px) {
                    align-items: center;
                }
            }
        }
    }

    & .pretext {
        display: inline;
        padding: .2rem .6rem;
        background: color-mix(in srgb, #cf2e2e 8%, transparent);
        color: #cf2e2e;
        font-weight: 600;
        letter-spacing: 2px;
        border: 1px solid color-mix(in srgb, #cf2e2e 20%, transparent);
        box-decoration-break: clone;
        font-size: var(--wp--preset--font-size--small);
        border-radius: .3rem;
    }

    & .object-reveal {
        opacity: 0;
        transform: translateY(6rem);
        position: relative;
        transition: opacity 0.8s ease, transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);

        &.is-visible {
            opacity: 1;
            transform: translateY(0);
        }
    }

    & .pretext-reveal {
        opacity: 0;
        transform: translateY(6rem);
        position: relative;
        transition: opacity 0.8s ease, transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);

        &.is-visible {
            opacity: 1;
            transform: translateY(0);
        }
    }

    /* Custom Pagination Layout */
    & .slideshow-bullets-wrapper {
        display: flex;
        align-items: center;
        justify-content: space-between;

        & .btn-pagination {
            background-color: transparent;
            border: none;
            color: var(--wp--preset--color--contrast);
            opacity: 0.4;
            width: 37px;
            height: 37px;
            display: grid;
            place-items: center;
            cursor: pointer;
            padding: 0;
            border-radius: .3rem;
            transition: all 0.3s ease;

            & svg {
                width: 18px;
                height: 18px;
            }

            &:hover {
                opacity: 1;
                background-color: color-mix(in srgb, var(--wp--preset--color--contrast) 4%, transparent);
                color: var(--wp--preset--color--focus);
            }
        }

        & .slideshow-bullets {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 1rem;

            & .bullet {
                width: .6rem;
                height: .6rem;
                border-radius: 50%;
                background-color: color-mix(in srgb, var(--wp--preset--color--contrast), transparent 90%);
                cursor: pointer;
                padding: 0;
                transition: all 0.3s ease;

                &.active {
                    background-color: var(--wp--preset--color--focus);
                }
            }
        }
    }
}

.is-chromium {
    & .pretext {
        border-radius: .8rem !important;
        corner-shape: squircle;
    }
}