




@media screen and  (max-width: 1023px){
    
    /* header.home .left-button{
        margin-left: 1px;
    }
    header.home .right-menu{
        gap: 0;
    }
    header.home .right-menu .trigger-menu{
        position: relative;
        top: auto;
        margin-top: -7px;
        justify-content: end;
        width: 40px;
        margin-right: -5px;
    } */

    .main-header.home{
        position: fixed;
    }
    .scroll header .bg-blur {
        --tw-backdrop-blur: blur(var(--blur-sm));
        -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
        backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
        background-color: color-mix(in oklab, var(--color-blush-light) 80%, transparent);
    } 
    
    
    
    .main-header{
        height: auto;
        padding-bottom: 3px;
    }
    .main-header .logo-home a{
        display: block;
        width: 100%;
        padding-left: 20px;
        padding-right: 20px;
        max-width: 400px;
    }
    .main-header .logo-home a img{
        width: 100%;
    }
    .main-header .logo-home{
        margin-top: 20px;
        margin-bottom: 6px;
    }
    .main-header.inner-page{
        /* height: auto; */
        /* padding: 20px 0 0; */
    }
    .main-header .left-button{
        margin-left: 1px;
    }
    .main-header .right-menu{
        gap: 0;
    }
    .main-header .right-menu .trigger-menu{
        position: relative;
        top: auto;
        margin-top: -7px;
        justify-content: end;
        width: 40px;
        margin-right: -5px;
    }
    .main-header.home img.black-logo{
        display: none;
    }
    .main-header.inner-page img.white-logo{
        display: none !important;
    }

    .scroll .main-header img.white-logo{
        display: none;
    }
    .scroll .main-header img.black-logo{
        display: block;
    }
    .scroll .main-header a{
        color: #000;
    }

    .home-template.scroll .main-header img.white-logo{
        display: block;
    }
    .home-template.scroll .main-header img.black-logo{
        display: none;
    }
    .home-template.scroll .main-header a{
        color: #fff;
    }
    .home-template.scroll .main-header.change-bg img.black-logo{
        display: block;
    }
    .home-template.scroll .main-header.change-bg img.white-logo{
        display: none;
    }
    .home-template.scroll .main-header.change-bg a{
        color: #000;
    }
    .home-template.scroll header .bg-blur{
        background-color: transparent;
    }
    .home-template.scroll .main-header.change-bg .bg-blur{
        background-color: color-mix(in oklab, var(--color-blush-light) 80%, transparent);
    }

    /* .main-header.black-logo img.white-logo{
        display: none;
    }
    .main-header.black-logo img.black-logo{
        display: block;
    } */
    
    /* .main-header.home.black-logo a{
        color: #000;
    } */
}

@media screen and (min-width: 768px) and (max-width: 1023px){
    .hide-on-tablet{ display: none; }
}

@media screen and (max-width: 767px){
    .hide-on-mobile{ display: none; }
}