/* ==========================================================================
   Vectus motion
   Everything here is skipped for visitors who ask their device for less motion.
   ========================================================================== */

/* ---------- Scroll reveals (only when the animation script is running) ---------- */
html.vx-js .vx-anim-fade-up,
html.vx-js .vx-anim-fade-in,
html.vx-js .vx-anim-slide-left,
html.vx-js .vx-anim-slide-right,
html.vx-js .vx-anim-zoom-in {
	opacity: 0;
	transition: opacity .8s cubic-bezier(.2,.7,.2,1), transform .8s cubic-bezier(.2,.7,.2,1);
	will-change: opacity, transform;
}
html.vx-js .vx-anim-fade-up { transform: translateY(32px); }
html.vx-js .vx-anim-slide-left { transform: translateX(-48px); }
html.vx-js .vx-anim-slide-right { transform: translateX(48px); }
html.vx-js .vx-anim-zoom-in { transform: scale(.94); }
html.vx-js .vx-anim-fade-up.vx-in,
html.vx-js .vx-anim-fade-in.vx-in,
html.vx-js .vx-anim-slide-left.vx-in,
html.vx-js .vx-anim-slide-right.vx-in,
html.vx-js .vx-anim-zoom-in.vx-in { opacity: 1; transform: none; }

/* Children appear one after another */
html.vx-js .vx-anim-stagger > * {
	opacity: 0;
	transform: translateY(26px);
	transition: opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1);
	transition-delay: calc(var(--vx-i, 0) * 110ms);
}
html.vx-js .vx-anim-stagger.vx-in > * { opacity: 1; transform: none; }
/* Keep card hover lift working after the reveal */
html.vx-js .vx-anim-stagger.vx-in > .vx-card:hover { transform: translateY(-4px); transition-delay: 0s; }

/* ---------- Home banner ---------- */
.wp-block-cover.vx-hero { overflow: hidden; }
.wp-block-cover.vx-hero .wp-block-cover__image-background { animation: vx-kenburns 16s cubic-bezier(.2,.7,.2,1) both; }
.wp-block-cover.vx-hero .wp-block-cover__inner-container > * { animation: vx-rise .9s cubic-bezier(.2,.7,.2,1) both; }
.wp-block-cover.vx-hero .wp-block-cover__inner-container > *:nth-child(1) { animation-delay: .15s; }
.wp-block-cover.vx-hero .wp-block-cover__inner-container > *:nth-child(2) { animation-delay: .3s; }
.wp-block-cover.vx-hero .wp-block-cover__inner-container > *:nth-child(3) { animation-delay: .45s; }
.wp-block-cover.vx-hero .wp-block-cover__inner-container > *:nth-child(4) { animation-delay: .6s; }
@keyframes vx-kenburns { from { transform: scale(1.12); } to { transform: scale(1); } }
@keyframes vx-rise { from { opacity: 0; transform: translateY(28px); } to { opacity: 1; transform: none; } }

/* ---------- Sticky header ---------- */
.vx-site-header {
	position: sticky;
	top: var(--wp-admin--admin-bar--height, 0px);
	z-index: 100;
	transition: box-shadow .3s ease;
}
body.vx-scrolled .vx-site-header { box-shadow: 0 6px 24px rgba(6,26,74,.08); }
@media (max-width: 600px) { .admin-bar .vx-site-header { top: 0; } }

/* ---------- Desktop dropdown (Services) ---------- */
@media (min-width: 901px) {
	.vx-nav .wp-block-navigation__submenu-container {
		transform: translateY(10px);
		transition: opacity .25s ease, transform .25s ease, visibility .25s;
	}
	.vx-nav .has-child:hover > .wp-block-navigation__submenu-container,
	.vx-nav .has-child:focus-within > .wp-block-navigation__submenu-container { transform: none; }
}

/* ---------- Mobile menu: rolls down, items fade in one by one, rolls up on close ---------- */
.vx-nav .wp-block-navigation__responsive-container.is-menu-open {
	animation: vx-roll-down .38s cubic-bezier(.2,.7,.2,1) both !important;
}
.vx-nav .wp-block-navigation__responsive-container.is-menu-open.vx-closing {
	animation: vx-roll-up .3s cubic-bezier(.4,0,.6,1) both !important;
}
@keyframes vx-roll-down { from { clip-path: inset(0 0 100% 0); } to { clip-path: inset(0 0 0 0); } }
@keyframes vx-roll-up { from { clip-path: inset(0 0 0 0); } to { clip-path: inset(0 0 100% 0); } }

.vx-nav .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item,
.vx-nav .is-menu-open .vx-menu-extra {
	animation: vx-item-in .45s cubic-bezier(.2,.7,.2,1) both;
}
.vx-nav .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item:nth-child(1) { animation-delay: .18s; }
.vx-nav .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item:nth-child(2) { animation-delay: .24s; }
.vx-nav .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item:nth-child(3) { animation-delay: .30s; }
.vx-nav .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item:nth-child(4) { animation-delay: .36s; }
.vx-nav .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item:nth-child(5) { animation-delay: .42s; }
.vx-nav .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item:nth-child(6) { animation-delay: .48s; }
.vx-nav .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item:nth-child(7) { animation-delay: .54s; }
.vx-nav .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item:nth-child(8) { animation-delay: .60s; }
.vx-nav .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item:nth-child(9) { animation-delay: .66s; }
.vx-nav .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item:nth-child(n+10) { animation-delay: .72s; }
@keyframes vx-item-in { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }

/* Close (X) icon spins and grows in, like Supply */
.vx-nav .is-menu-open .wp-block-navigation__responsive-container-close {
	animation: vx-x-in .4s cubic-bezier(.2,.7,.2,1) .1s both;
}
@keyframes vx-x-in { from { opacity: 0; transform: scale(.2) rotate(-45deg); } to { opacity: 1; transform: none; } }

/* ---------- Respect "reduce motion" ---------- */
@media (prefers-reduced-motion: reduce) {
	html.vx-js [class*="vx-anim-"], html.vx-js .vx-anim-stagger > * { opacity: 1 !important; transform: none !important; transition: none !important; }
	.wp-block-cover.vx-hero .wp-block-cover__image-background,
	.wp-block-cover.vx-hero .wp-block-cover__inner-container > *,
	.vx-nav .wp-block-navigation__responsive-container.is-menu-open,
	.vx-nav .is-menu-open .wp-block-navigation-item,
	.vx-nav .is-menu-open .wp-block-navigation__responsive-container-close { animation: none !important; }
}
.vx-nav .is-menu-open .vx-menu-extra { animation-delay: .7s; }
