/* Advanced Animations & Micro-interactions */
/* Accessibility: Respect prefers-reduced-motion */
@media (prefers-reduced-motion: reduce) {
  .anim-init, .v-tilt, .tilt-active, .hero-split span, #scroll-progress {
    animation: none !important;
    transition: none !important;
  }
}

/* Scroll progress bar */
#scroll-progress {
  position: fixed;
  top: 0; left: 0; height: 4px; width: 100%;
  transform-origin: left;
  transform: scaleX(0);
  background: linear-gradient(90deg,#149ddd,#9333ea,#10b981);
  z-index: 10000;
  pointer-events: none;
}

/* Stagger base state */
[data-animate],[data-animate-stagger] [data-animate] {opacity:0; transform:translateY(24px);}
[data-animate].in-view {opacity:1; transform:translateY(0); transition:opacity .7s cubic-bezier(.16,.8,.24,1),transform .7s cubic-bezier(.16,.8,.24,1);}

/* Specific animation variants */
[data-animate="fade-in"].in-view {opacity:1; transform:none;}
[data-animate="fade-up"].in-view {opacity:1; transform:translateY(0);}

/* Hero split text */
.hero-split {display:inline-block;}
.hero-split span {display:inline-block; opacity:0; transform:translateY(40px) rotate(6deg);}
.hero-split span.reveal {animation:heroLetter .8s cubic-bezier(.16,.8,.24,1) forwards;}
@keyframes heroLetter {to {opacity:1; transform:translateY(0) rotate(0);} }

/* Portfolio / service tilt cards */
.v-tilt {will-change: transform; transition: transform .45s cubic-bezier(.16,.8,.24,1), box-shadow .45s, background .5s;}
.v-tilt:hover {box-shadow:0 12px 32px -12px rgba(0,0,0,.35);} 
.v-tilt[data-interactive="active"] {transition: transform .12s linear, box-shadow .3s;}

/* Glow accent for high skill bars (added class from JS) */
.progress-bar.high-skill {position:relative;}
.progress-bar.high-skill:after {content:""; position:absolute; inset:0; background:linear-gradient(90deg,#149ddd,var(--accent-color)); mix-blend-mode:screen; opacity:.35; animation:skillPulse 2.4s ease-in-out infinite alternate; border-radius:2px;}
@keyframes skillPulse {from {filter:blur(0);} to {filter:blur(4px); opacity:.6;} }

/* Testimonials dark mode luminous edge */
#testimonials.dark-mode-active .testimonial-item p {box-shadow:0 0 0 1px rgba(255,255,255,.05),0 8px 28px -10px rgba(0,0,0,.6),0 0 18px -4px rgba(20,157,221,.4);} 

/* Language flip cards */
.language-item {perspective:1000px;}
.language-item .language-flag {font-size:40px;}
.language-item {transition:transform .6s; transform-style:preserve-3d; position:relative;}
.language-item:hover {transform:rotateY(12deg) translateY(-4px);} 

/* Contact button morph */
#contact-submit-btn {position:relative; overflow:hidden;}
#contact-submit-btn.morphing {animation:btnMorph .6s ease forwards;}
@keyframes btnMorph {50% {border-radius:50px; padding:10px 18px;} 100% {border-radius:50px;}}
#contact-submit-btn .btn-check-icon {position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-size:0; opacity:0; transition:opacity .3s;}
#contact-submit-btn.success .btn-check-icon {opacity:1; font-size:20px;}

/* Theme radial reveal */
html[data-theme-change="in-progress"] body:before {content:""; position:fixed; inset:0; background:var(--background-color); animation:radialReveal .7s ease forwards; pointer-events:none; z-index:9999;}
@keyframes radialReveal {from {clip-path:circle(0% at var(--theme-x,50%) var(--theme-y,50%));} to {clip-path:circle(150% at var(--theme-x,50%) var(--theme-y,50%));}}

/* Scroll based subtle fade for header background (class toggled via JS) */
.header.scrolled {backdrop-filter:saturate(180%) blur(12px); background:rgba(4,11,20,.72); box-shadow:0 4px 18px -8px rgba(0,0,0,.4);} 

/* Reduced motion fallback ensures immediate visibility */
@media (prefers-reduced-motion: reduce) { [data-animate] {opacity:1 !important; transform:none !important;} }