/* Bespoken menu: same style, smoother motion (see bespoken-menu.js). */

/* desktop dropdowns: drift and fade in, leave the same way. Only once the script has taken over (.bsk-smooth) */
.elementor-nav-menu--main .bsk-smooth .sub-menu{opacity:0; transform:translateY(10px); transform-origin:top center;
	transition:opacity .26s ease, transform .4s cubic-bezier(.16,1,.3,1); will-change:opacity, transform}
.elementor-nav-menu--main .bsk-smooth .sub-menu.bsk-sub-in{opacity:1; transform:none}
.elementor-nav-menu--main .bsk-smooth .sub-menu.bsk-sub-out{opacity:0; transform:translateY(6px); transition-duration:.2s, .22s}
/* the links inside follow a beat behind, one after another */
.elementor-nav-menu--main .bsk-smooth .sub-menu > li{opacity:0; transform:translateY(6px); transition:opacity .3s ease, transform .4s cubic-bezier(.16,1,.3,1)}
.elementor-nav-menu--main .bsk-smooth .sub-menu.bsk-sub-in > li{opacity:1; transform:none}
.elementor-nav-menu--main .bsk-smooth .sub-menu.bsk-sub-in > li:nth-child(1){transition-delay:.04s}
.elementor-nav-menu--main .bsk-smooth .sub-menu.bsk-sub-in > li:nth-child(2){transition-delay:.08s}
.elementor-nav-menu--main .bsk-smooth .sub-menu.bsk-sub-in > li:nth-child(3){transition-delay:.12s}
.elementor-nav-menu--main .bsk-smooth .sub-menu.bsk-sub-in > li:nth-child(4){transition-delay:.16s}
.elementor-nav-menu--main .bsk-smooth .sub-menu.bsk-sub-in > li:nth-child(n+5){transition-delay:.2s}
.elementor-nav-menu--main .bsk-smooth .sub-menu.bsk-sub-out > li{transition-delay:0s}

/* links ease between colours instead of snapping; dropdown links nudge a touch */
.elementor-nav-menu--main .elementor-item, .elementor-nav-menu--main .elementor-sub-item{transition:color .3s ease, background-color .3s ease, transform .35s cubic-bezier(.16,1,.3,1) !important}
.elementor-nav-menu--main .elementor-item .sub-arrow svg, .elementor-nav-menu--main .elementor-item .sub-arrow i{transition:transform .35s cubic-bezier(.16,1,.3,1)}
.elementor-nav-menu--main .elementor-item.highlighted .sub-arrow svg, .elementor-nav-menu--main .elementor-item.highlighted .sub-arrow i{transform:rotate(180deg)}
.elementor-nav-menu--main .sub-menu .elementor-sub-item:hover{transform:translateX(3px)}

/* sticky header: a soft shadow fades in once it's floating over the page */
[data-elementor-type="header"] .elementor-sticky{transition:box-shadow .4s ease}
[data-elementor-type="header"] .elementor-sticky--active.elementor-sticky--effects{box-shadow:0 8px 24px rgba(20,49,52,.08)}

@media (prefers-reduced-motion:reduce){
	.elementor-nav-menu--main .elementor-item, .elementor-nav-menu--main .elementor-sub-item{transition:none !important}
}