/* =========================================================================
   Vemar — motion system (loaded after main.css)
   ========================================================================= */

/* ---------- Preloader ---------- */
.vg-loader { position: fixed; inset: 0; z-index: 1000; display: grid; place-items: center; background: var(--vg-navy-deep, #071120); color: var(--vg-on-dark); transition: opacity .6s var(--vg-ease), visibility 0s linear .6s; }
.vg-loader.is-done { opacity: 0; visibility: hidden; }
.vg-loader__inner { display: grid; gap: 1.25rem; justify-items: center; }
.vg-loader__mark { width: 56px; height: 56px; animation: vg-loader-pulse 1.4s ease-in-out infinite; }
.vg-loader__name { font-family: var(--wp--preset--font-family--heading); font-weight: 700; letter-spacing: -0.02em; font-size: 1.1rem; }
.vg-loader__bar { width: 160px; height: 3px; border-radius: 3px; background: rgba(255,255,255,.12); overflow: hidden; }
.vg-loader__bar i { display: block; height: 100%; width: 0; background: var(--vg-primary); transition: width .7s var(--vg-ease); }
@keyframes vg-loader-pulse { 0%,100% { transform: scale(1); } 50% { transform: scale(1.06); } }
html:not(.vg-loaded) body { overflow: hidden; }

/* ---------- Split-text reveals ---------- */
.vg-split .vg-w { display: inline-block; overflow: hidden; vertical-align: bottom; padding-bottom: .08em; margin-bottom: -.08em; }
.vg-split .vg-w > span { display: inline-block; transform: translateY(110%); opacity: 0; transition: transform .8s cubic-bezier(.2,.65,.2,1), opacity .5s ease; transition-delay: calc(var(--i, 0) * 40ms); will-change: transform; }
.vg-split.is-in .vg-w > span { transform: none; opacity: 1; }
.vg-hero__title.vg-split .vg-w > span { transition-duration: 1s; transition-delay: calc(var(--i, 0) * 70ms); }
/* hero copy staggers in after the title */
.vg-motion .vg-hero .is-style-eyebrow, .vg-motion .vg-hero__lead, .vg-motion .vg-hero__meta, .vg-motion .vg-hero .vg-widget { opacity: 0; transform: translateY(18px); transition: opacity .8s ease, transform .9s cubic-bezier(.2,.65,.2,1); }
.vg-motion.vg-loaded .vg-hero .is-style-eyebrow { opacity: 1; transform: none; transition-delay: .1s; }
.vg-motion.vg-loaded .vg-hero__lead { opacity: 1; transform: none; transition-delay: .55s; }
.vg-motion.vg-loaded .vg-hero__meta { opacity: 1; transform: none; transition-delay: .7s; }
.vg-motion.vg-loaded .vg-hero .vg-widget { opacity: 1; transform: none; transition-delay: .5s; }

/* ---------- Scroll-driven word highlight ---------- */
.is-style-scroll-reveal { font-family: var(--wp--preset--font-family--heading); font-size: clamp(1.35rem, 1rem + 1.4vw, 2rem); line-height: 1.35; font-weight: 500; letter-spacing: -0.02em; color: var(--vg-text); }
.vg-scrollwords .vg-w > span { color: color-mix(in srgb, var(--vg-text) 22%, transparent); transition: color .35s ease; }
.vg-scrollwords .vg-w > span.is-on { color: var(--vg-text); }
.is-style-band-navy .vg-scrollwords .vg-w > span { color: rgba(255,255,255,.25); }
.is-style-band-navy .vg-scrollwords .vg-w > span.is-on { color: var(--vg-on-dark); }

/* ---------- Ghost marquee text ---------- */
.vg-marquee-text { overflow: hidden; padding: clamp(1rem, 3vw, 2.5rem) 0; user-select: none; pointer-events: none; }
.vg-marquee-text__track { display: flex; gap: 0; white-space: nowrap; width: max-content; will-change: transform; }
.vg-marquee-text__track > span { font-family: var(--wp--preset--font-family--heading); font-weight: 700; letter-spacing: -0.035em; line-height: 1; font-size: clamp(3.2rem, 9vw, 8.5rem); padding-right: .35em; color: color-mix(in srgb, var(--vg-text) 11%, transparent); }
[data-theme="dark"] .vg-marquee-text__track > span { color: color-mix(in srgb, var(--vg-text) 14%, transparent); }
.vg-marquee-text.is-outline .vg-marquee-text__track > span { color: transparent; -webkit-text-stroke: 1.5px color-mix(in srgb, var(--vg-text) 28%, transparent); }
.vg-marquee-text__track > span em { font-style: normal; color: color-mix(in srgb, var(--vg-primary) 55%, transparent); -webkit-text-stroke: 0; }
.vg-marquee-text__track > span .vg-dot { display: inline-block; width: .18em; height: .18em; border-radius: 50%; background: color-mix(in srgb, var(--vg-primary) 70%, transparent); margin: 0 .35em; vertical-align: middle; -webkit-text-stroke: 0; }

/* ---------- Parallax media ---------- */
.vg-motion .vg-bento .wp-block-image img, .vg-motion .vg-section .is-style-rounded-lg img, .vg-motion .vg-post-hero img, .vg-motion .vg-band__img { will-change: transform; transform: scale(1.12); }
.vg-motion .vg-hero-slides { will-change: transform; }
.vg-motion .vg-hero__grid > :first-child { will-change: transform, opacity; }

/* ---------- Image wipe + rise reveals ---------- */
.vg-wipe { clip-path: inset(0 0 100% 0 round var(--vg-r-lg)); transition: clip-path 1.1s cubic-bezier(.2,.65,.2,1); }
.vg-wipe.is-in { clip-path: inset(0 0 0 0 round var(--vg-r-lg)); }
.vg-rise { opacity: 0; transform: translateY(26px); transition: opacity .8s ease, transform .9s cubic-bezier(.2,.65,.2,1); transition-delay: var(--d, 0ms); }
.vg-rise.is-in { opacity: 1; transform: none; }
.vg-rise.vg-faq details { transition-property: opacity, transform, border-color, box-shadow; }

/* ---------- Card spotlight + sibling dimming ---------- */
.vg-cards .vg-card { position: relative; transition: transform .45s cubic-bezier(.2,.65,.2,1), box-shadow .45s, border-color .3s, opacity .4s ease, filter .4s ease; }
.vg-cards .vg-card::after { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; opacity: 0; transition: opacity .4s ease;
  background: radial-gradient(360px circle at var(--mx, 50%) var(--my, 50%), color-mix(in srgb, var(--vg-primary) 14%, transparent), transparent 60%); }
.vg-cards .vg-card:hover::after { opacity: 1; }
.vg-cards:hover .vg-card:not(:hover) { opacity: .55; filter: saturate(.85); }
.vg-cards .vg-card:hover { transform: translateY(-6px); box-shadow: var(--vg-shadow-lg); border-color: color-mix(in srgb, var(--vg-primary) 35%, var(--vg-border)); }
.vg-cards .vg-card > * { position: relative; z-index: 1; }
.vg-cards .vg-service__icon { transition: transform .4s cubic-bezier(.2,.65,.2,1), background-color .3s, color .3s; }
.vg-cards .vg-service:hover .vg-service__icon { transform: translateY(-3px) rotate(-6deg); background: var(--vg-primary); color: var(--vg-on-dark); }

/* ---------- Magnetic buttons ---------- */
.vg-motion .wp-block-button__link, .vg-motion .vg-btn, .vg-motion .vg-theme-toggle { transition: transform .35s cubic-bezier(.2,.65,.2,1), background-color .2s, color .2s, box-shadow .2s, border-color .2s; }

/* ---------- Smart header ---------- */
.vg-header { transition: transform .45s cubic-bezier(.2,.65,.2,1), border-color .3s, padding .3s; }
.vg-header.is-hidden { transform: translateY(-110%); }
.vg-header.is-hidden .wp-block-navigation__submenu-container { visibility: hidden !important; opacity: 0 !important; }

/* ---------- Links & small touches ---------- */
.vg-service__more, .vg-post-card .wp-block-post-title a { transition: color .25s ease; }
.vg-partner { transition: opacity .3s ease, filter .3s ease, transform .4s cubic-bezier(.2,.65,.2,1); }
.vg-partner:hover { transform: translateY(-2px); }
.vg-stat { transition: transform .5s cubic-bezier(.2,.65,.2,1); }
.vg-stat:hover { transform: translateY(-3px); }
.vg-office__code, .vg-badge { transition: background-color .25s, color .25s; }
.vg-office:hover .vg-office__code { background: var(--vg-primary); color: var(--vg-on-dark); }

@media (prefers-reduced-motion: reduce) {
  .vg-split .vg-w > span, .vg-rise, .vg-wipe { transition: none; transform: none; opacity: 1; clip-path: none; }
  .vg-motion .vg-hero .is-style-eyebrow, .vg-motion .vg-hero__lead, .vg-motion .vg-hero__meta, .vg-motion .vg-hero .vg-widget { opacity: 1; transform: none; transition: none; }
  .vg-cards:hover .vg-card:not(:hover) { opacity: 1; filter: none; }
  .vg-header { transition: none; }
}