/*
|--------------------------------------------------------------------------
| Sticky Header
|--------------------------------------------------------------------------
*/

#header{

    position:relative;

    width:100%;

    transition:
        transform .30s ease,
        background .30s ease,
        box-shadow .30s ease,
        backdrop-filter .30s ease;

    will-change:transform;

    z-index:9999;

}
/*
|--------------------------------------------------------------------------
| Sticky Header Height
|--------------------------------------------------------------------------
*/

body.bb-header-sticky [data-row="middle"]{

    min-height:var(--bb-header-sticky-height) !important;

}

body.bb-header-sticky [data-row="middle"] > .ct-container{

    min-height:var(--bb-header-sticky-height) !important;

    align-items:center;

}
/*
|--------------------------------------------------------------------------
| Sticky State
|--------------------------------------------------------------------------
*/

#bb-header-spacer{

    width:100%;

    display:none;

}

body.bb-header-sticky #header{

    position:fixed;

    top:0;
    left:0;
    right:0;

    width:100%;

    z-index:999999;

    /* CREM KIDS & PAWS */
    background:rgba(250,247,241,.95);

    backdrop-filter:
        blur(var(--bb-header-blur))
        saturate(110%);

    -webkit-backdrop-filter:
        blur(var(--bb-header-blur))
        saturate(110%);

    border-bottom:1px solid rgba(115,139,75,.10);

    box-shadow:
        0 6px 20px rgba(70,55,40,.06);

}


/*
|--------------------------------------------------------------------------
| Bottom Fade – Kids & Paws
|--------------------------------------------------------------------------
*/

body.bb-header-sticky #header::after{

    content:"";

    position:absolute;

    left:0;
    right:0;

    bottom:-32px;

    height:32px;

    pointer-events:none;

    background:linear-gradient(

        to bottom,

        rgba(250,247,241,.88),

        rgba(250,247,241,.48),

        rgba(250,247,241,0)

    );

}
/*
|--------------------------------------------------------------------------
| Hide On Scroll
|--------------------------------------------------------------------------
*/

body.bb-header-hide #header{

    transform:translateY(-100%);

}
/*
|--------------------------------------------------------------------------
| Announcement Bar
|--------------------------------------------------------------------------
*/

[data-row="top"]{

    overflow:hidden;

    transition:
        opacity .30s ease,
        transform .30s ease;

}

body.bb-header-sticky [data-row="top"]{

    opacity:0;

    transform:translateY(-100%);

    pointer-events:none;

}

/*
|--------------------------------------------------------------------------
| Header Middle
|--------------------------------------------------------------------------
*/

[data-row="middle"]{

    position:relative;

    transition:
        padding .30s ease;

}

/*
|--------------------------------------------------------------------------
| Logo
|--------------------------------------------------------------------------
*/

.site-branding{

    display:flex;

    align-items:center;

}

.site-branding img,
.custom-logo{

    display:block;

    width:auto;

    transition:

        max-height .30s ease,

        transform .30s ease,

        opacity .30s ease;

}

/* doar logo-ul se mic?oreaz? */

body.bb-header-sticky .site-branding img,
body.bb-header-sticky .custom-logo{

    max-height:var(--bb-header-logo-sticky-size);

}

/*
|--------------------------------------------------------------------------
| Navigation
|--------------------------------------------------------------------------
*/

.ct-header nav > ul{

    align-items:center;

}

.ct-header nav > ul > li > a{

    transition:

        padding .30s ease,

        color .30s ease;

}

/* doar padding-ul linkurilor */

body.bb-header-sticky .ct-header nav > ul > li > a{

    padding-top:14px;

    padding-bottom:14px;

}

/*
|--------------------------------------------------------------------------
| Header Icons
|--------------------------------------------------------------------------
*/

.ct-header .ct-icon{

    transition:

        transform .30s ease,

        color .30s ease;

}

body.bb-header-sticky .ct-header .ct-icon{

    transform:scale(.90);

}
/*
|--------------------------------------------------------------------------
| Header Animation
|--------------------------------------------------------------------------
*/

#header{

    backface-visibility:hidden;

    -webkit-backface-visibility:hidden;

    transform:translateZ(0);

}

/*
|--------------------------------------------------------------------------
| Smooth Rendering
|--------------------------------------------------------------------------
*/

.site-branding,
.ct-header nav,
.ct-header .ct-icon{

    backface-visibility:hidden;

    -webkit-backface-visibility:hidden;

}

/*
|--------------------------------------------------------------------------
| Responsive
|--------------------------------------------------------------------------
*/

@media (max-width:768px){

    body.bb-header-sticky .site-branding img,
    body.bb-header-sticky .custom-logo{

        transform:scale(.92);

    }

    body.bb-header-sticky .ct-header nav > ul > li > a{

        padding-top:12px;

        padding-bottom:12px;

    }

    body.bb-header-sticky .ct-header .ct-icon{

        transform:scale(.95);

    }

}

/*
|--------------------------------------------------------------------------
| Reduce Motion
|--------------------------------------------------------------------------
*/

@media (prefers-reduced-motion:reduce){

    #header,
    #header *,
    body.bb-header-sticky #header{

        transition:none !important;

        animation:none !important;

    }

}