#app #home .main {
    overflow: hidden;

    .homepage-component {

        #cta-v1,
        .parallax-section,
        #events-v3,
        #events-e4,
        #news-n5,
        .programs-v4,
        .about-v2,
        #LF4,
        div:has(> .see-all-container) {
            position: relative;
            box-sizing: border-box;
            padding-top: calc(var(--tilt-height, 50px) + 30px);

            &:before {
                content: '';
                position: absolute;
                top: 0;
                left: 0;
                overflow: hidden;
                width: 100%;
                height: var(--tilt-height, 50px);
                background-color: #fff;
                transform: rotate(180deg);
                z-index: 6;

                mask-image:
                    url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='1600' height='198' %3e%3cdefs%3e%3clinearGradient id='a' y2='100%25'%3e%3cstop offset='0%25'/%3e%3cstop /%3e%3c/linearGradient%3e%3c/defs%3e%3cpath fill='url(%23a)' d='M.005 121C311 121 409.898-.25 811 0c400 0 500 121 789 121v77H0s.005-48 .005-77z'/%3e%3c/svg%3e");
                mask-repeat: repeat-x;
                mask-size: 1600px var(--tilt-height, 50px);
                animation: var(--waves-animation-duration, 25s) waves linear infinite forwards;

                @media (prefers-reduced-motion: reduce) {
                    animation: none !important;
                }
            }

            &[style*="--bg-color:#fff"],
            &[style*="--bg-color:#ffffff"],
            &[style*="--bg-color:#FFF"],
            &[style*="--bg-color:#FFFFFF"],
            &[style*="--bg-color: #fff"],
            &[style*="--bg-color: #ffffff"],
            &[style*="--bg-color: #FFF"],
            &[style*="--bg-color: #FFFFFF"] {
                padding-top: 30px;

                &:before {
                    display: none;
                }
            }
        }

        #news-n5,
        #events-v3,
        #events-e4,
        .about-v2,
        #LF4,
        .programs-v4 {
            div:has(> .see-all-container) {
                &:before {
                    display: none;
                }
            }
        }

        #news-n5 {
            div:has(> .see-all-container) {
                padding-top: 0;
            }
        }

        div:has(> .see-all-container) div:has(> .see-all-container) {
            &:before {
                display: none;
            }
        }

        .programs-v4 .column-1,
        .parallax-section {
            padding-top: 0;
        }
    }
}

@keyframes waves {
    0% {
        mask-position: 0 100%;
    }

    50% {
        mask-position: -1600px 100%;
    }

    100% {
        mask-position: 0 100%;
    }
}

#app #cms-footer {
    position: relative;
    box-sizing: border-box;
    padding-top: calc(var(--tilt-height, 40px));

    &:before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        overflow: hidden;
        width: 100%;
        height: var(--tilt-height, 50px);
        background-color: #fff;
        transform: rotate(180deg);
        z-index: 6;

        mask-image:
            url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='1600' height='198' %3e%3cdefs%3e%3clinearGradient id='a' y2='100%25'%3e%3cstop offset='0%25'/%3e%3cstop /%3e%3c/linearGradient%3e%3c/defs%3e%3cpath fill='url(%23a)' d='M.005 121C311 121 409.898-.25 811 0c400 0 500 121 789 121v77H0s.005-48 .005-77z'/%3e%3c/svg%3e");
        mask-repeat: repeat-x;
        mask-size: 1600px var(--tilt-height, 50px);
        animation: var(--waves-animation-duration, 25s) waves linear infinite forwards;

        @media (prefers-reduced-motion: reduce) {
            animation: none !important;
        }
    }
}