/* MZ UI V10 — visual/motion layer. Additive only: no content, colors or layout changed. */
html[data-ui="v10"]{--v10-gold:#f2cf83;--v10-gold-deep:#d9a94d}

/* scroll progress */
.v10-progress{position:fixed;top:0;left:0;height:3px;width:100%;z-index:200;transform-origin:0 50%;transform:scaleX(0);
  background:linear-gradient(90deg,#8a6420,var(--v10-gold-deep),var(--v10-gold),#fff3cf);box-shadow:0 0 18px rgba(242,207,131,.8);pointer-events:none}

/* ember canvas */
.v10-embers{position:fixed;inset:0;width:100%;height:100%;z-index:1;pointer-events:none;opacity:.9}

/* aurora behind everything */
.v10-aurora{position:fixed;inset:-20%;z-index:0;pointer-events:none;filter:blur(70px);opacity:.55;
  background:
   radial-gradient(40% 35% at 18% 22%,rgba(217,169,77,.22),transparent 70%),
   radial-gradient(35% 30% at 82% 70%,rgba(242,207,131,.16),transparent 70%),
   radial-gradient(30% 30% at 55% 105%,rgba(160,100,30,.20),transparent 70%);
  animation:v10-drift 18s ease-in-out infinite alternate}
@keyframes v10-drift{to{transform:translate3d(4%,-3%,0) scale(1.08)}}
main,footer,.site-header{position:relative;z-index:2}
.site-header{position:fixed}

/* custom cursor ring */
.v10-ring{position:fixed;left:0;top:0;width:38px;height:38px;margin:-19px 0 0 -19px;border-radius:50%;z-index:300;pointer-events:none;
  border:1px solid rgba(242,207,131,.7);mix-blend-mode:screen;transition:width .25s,height .25s,margin .25s,background .25s,border-color .25s;will-change:transform}
.v10-ring.is-link{width:68px;height:68px;margin:-34px 0 0 -34px;background:rgba(242,207,131,.12);border-color:#fff3cf}

/* hero headline word reveal */
.v10-word{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.12em}
.v10-word>span{display:inline-block;transform:translateY(110%) rotate(4deg);opacity:0;
  animation:v10-word .95s cubic-bezier(.2,.8,.2,1) forwards;animation-delay:calc(.25s + var(--i)*.08s)}
@keyframes v10-word{to{transform:none;opacity:1}}
.hero h1 em .v10-word>span{background:linear-gradient(100deg,#d9a94d 0%,#fff3cf 45%,#d9a94d 70%);background-size:220% 100%;
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;
  animation:v10-word .95s cubic-bezier(.2,.8,.2,1) forwards,v10-shine 6s linear 1.4s infinite;animation-delay:calc(.25s + var(--i)*.08s),1.4s}
@keyframes v10-shine{to{background-position:-220% 0}}

/* hero image parallax + breathing glow */
.hero-image img{will-change:transform;transition:transform .25s ease-out;animation:v10-breathe 7s ease-in-out infinite alternate}
@keyframes v10-breathe{from{filter:brightness(.95) saturate(1)}to{filter:brightness(1.12) saturate(1.15)}}
.hero-orbit{animation:v10-spin 60s linear infinite}
.hero-orbit.orbit-b{animation-duration:90s;animation-direction:reverse}
@keyframes v10-spin{to{rotate:360deg}}

/* scroll reveal */
html[data-ui="v10"].v10-js [data-v10]{opacity:0;transform:translateY(46px) scale(.98);filter:blur(10px);
  transition:opacity .9s cubic-bezier(.2,.8,.2,1),transform .9s cubic-bezier(.2,.8,.2,1),filter .9s;transition-delay:calc(var(--d,0)*70ms)}
html[data-ui="v10"].v10-js [data-v10].v10-in{opacity:1;transform:none;filter:none}

/* cards: glass, tilt, spotlight edge */
.service-card,.why-card,.work-card,.process-list>div,.tech-grid span,.faq-list details{transform-style:preserve-3d}
.v10-tilt{transition:transform .18s ease-out,box-shadow .3s,border-color .3s;will-change:transform}
.v10-tilt.is-tilting{transition:transform .06s linear}
.v10-tilt:hover{box-shadow:0 30px 70px -20px rgba(217,169,77,.35),0 0 0 1px rgba(242,207,131,.35)}
.v10-tilt::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .3s;
  background:radial-gradient(420px circle at var(--px,50%) var(--py,50%),rgba(242,207,131,.16),transparent 55%)}
.v10-tilt:hover::after{opacity:1}
.service-card,.why-card,.work-card{position:relative}

/* section titles underline sweep */
.section-heading h2 em,.section-intro h2,.about h2 em{background-image:linear-gradient(90deg,transparent,rgba(242,207,131,.25),transparent);
  background-size:0 2px;background-repeat:no-repeat;background-position:0 100%;transition:background-size 1.2s ease .3s}
[data-v10].v10-in .section-heading h2 em,.v10-in.section-intro h2{background-size:100% 2px}

/* tech chips float */
.tech-grid span{transition:transform .3s,color .3s,border-color .3s,box-shadow .3s}
.tech-grid span:hover{transform:translateY(-6px);box-shadow:0 14px 34px -10px rgba(217,169,77,.45)}

/* form focus glow */
.project-form input:focus,.project-form select:focus,.project-form textarea:focus{outline:none;border-color:var(--v10-gold)!important;box-shadow:0 0 0 4px rgba(217,169,77,.15),0 0 28px rgba(217,169,77,.25)}

/* header glass on scroll */
.site-header{transition:background .4s,backdrop-filter .4s,height .3s}
.site-header.v10-scrolled{background:rgba(5,5,5,.88)!important;backdrop-filter:blur(18px) saturate(1.4);-webkit-backdrop-filter:blur(18px) saturate(1.4)}

@media (hover:none),(pointer:coarse){.v10-ring{display:none}.v10-tilt::after{display:none}}
@media (prefers-reduced-motion:reduce){
  .v10-embers,.v10-aurora,.v10-ring{display:none}
  .v10-word>span{animation:none;transform:none;opacity:1}
  html[data-ui="v10"].v10-js [data-v10]{opacity:1;transform:none;filter:none;transition:none}
  .hero-image img,.hero-orbit{animation:none}
}