:root{
    --custom-transition-long: .5s;
    --custom-header-background: var(--wp--preset--color--base);
}

html{
    scroll-behavior: smooth;
}

header.sticky{
    position: sticky;
    top: 0px;
    background-color: var(--custom-header-background);

    .wp-block-spacer{
        height: 0px !important;
    }
}

header.fixed{
    position: fixed;
    width: 100%;
    top: 0px;
    background-color: var(--custom-header-background);
    z-index: 100000;
    transition: var(--custom-transition-long);
    overflow:hidden;

    .wp-block-cb-carousel-v2 {
        position: absolute;
        top: 0px;
        margin: 0px;
        opacity:1;
        transition: opacity var(--custom-transition-long);

        .cb-wrapper img{
            height:100dvh;
            width:100dvw;
            object-fit: cover;
            object-position: top center;
        }

        .cb-pagination{
            position: relative;
            top: -10dvh;
            width: 100dvw;
        }
    }
    
    &>.wp-block-group>.wp-block-group:first-child {
        z-index:2;

        .wp-block-site-title {
            text-align: center;
            transform: scale(1);
            transform-origin: center;
            width: max-content;
            transition: var(--custom-transition-long);
        }
    }

    &.little{
        height: 4rem;
        color: inherit;
        
        .wp-block-cb-carousel-v2 {
            opacity: 0;
        }
    }
    
    &.big{
        height: 100dvh;
        color: var(--wp--preset--color--base);

         &>.wp-block-group>.wp-block-group:first-child {
            .wp-block-group:first-child{
                flex-direction: column;
                .wp-block-site-title {
                    transform: scale(1.25);
                    width: 100%;
                }
            }

            nav{
                .wp-block-navigation__responsive-container-close,.wp-block-navigation__responsive-container-open{
                    display:none !important;
                }
                .wp-block-navigation__responsive-container{
                    display:inherit;
                    
                    .wp-block-navigation__responsive-container-content{
                        height:100dvh;
                        width: 100dvw;
                        position: fixed;
                        display: grid;
                        top: 0px;
                        left: 0px;
                        justify-content: center;
                        pointer-events: none;
                        
                        ul.wp-block-navigation__container {
                            flex-direction: column;
                            padding: 1rem;
                            background-color: var(--wp--preset--color--accent-1);
                            color: var(--wp--preset--color--accent-3);
                            pointer-events: all;
                            box-shadow: 0px 0px .5rem 0px var(--wp--preset--color--luminous-vivid-amber), inset 0px 0px 0.5rem 0px rgba(0,0,0,1);
                            border: 0.5rem solid var(--wp--preset--color--luminous-vivid-amber);
                            border-style: double;
                        }
                    }
                }
            }
        }
    }
}