/* Nahitaji – micro-interactions + scroll reveal (opt-in via data-animate) */

:root{
  --nx-ease-out: cubic-bezier(.22,1,.36,1);
  --nx-dur: 700ms;
}

/* Scroll reveal (opt-in) */
[data-animate]{
  opacity: 0;
  transform: translateY(14px);
  filter: blur(0.5px);
  transition:
    opacity var(--nx-dur) var(--nx-ease-out),
    transform var(--nx-dur) var(--nx-ease-out),
    filter var(--nx-dur) var(--nx-ease-out);
  transition-delay: var(--nx-delay, 0ms);
  will-change: opacity, transform, filter;
}

[data-animate="fade"]{ transform: none; }
[data-animate="up"]{ transform: translateY(18px); }
[data-animate="left"]{ transform: translateX(-18px); }
[data-animate="right"]{ transform: translateX(18px); }
[data-animate="zoom"]{ transform: scale(.96); }

/* when in view */
.nx-in[data-animate]{
  opacity: 1;
  transform: none;
  filter: none;
}

/* Hover micro-interactions (opt-in classes) */
.nx-hover-float{
  transition:
    transform 250ms var(--nx-ease-out),
    box-shadow 250ms var(--nx-ease-out),
    filter 250ms var(--nx-ease-out);
  will-change: transform, box-shadow;
}
.nx-hover-float:hover{
  transform: translateY(-4px);
  box-shadow:
    0 20px 45px -25px rgba(1, 53, 101, .45),
    0 10px 20px -15px rgba(0,0,0,.20);
}

/* Subtle "shine" sweep for cards/buttons */
.nx-shine{
  position: relative;
  overflow: hidden;
}
.nx-shine::after{
  content: "";
  position: absolute;
  inset: -30% -40%;
  background: linear-gradient(115deg, transparent 35%, rgba(255,255,255,.28) 45%, transparent 55%);
  transform: translateX(-40%) rotate(8deg);
  transition: transform 600ms var(--nx-ease-out);
  pointer-events: none;
}
.nx-shine:hover::after{
  transform: translateX(40%) rotate(8deg);
}

/* Hero ambient spotlight */
.hero-section{
  position: relative;
  overflow: hidden;
}
.hero-section::before{
  content: "";
  position: absolute;
  inset: -60%;
  background:
    radial-gradient(closest-side at 30% 35%, rgba(252, 200, 20, .18), transparent 60%),
    radial-gradient(closest-side at 75% 30%, rgba(255, 255, 255, .10), transparent 55%);
  transform: translate3d(0,0,0);
  animation: nx-hero-drift 14s var(--nx-ease-out) infinite alternate;
  pointer-events: none;
  opacity: .9;
}
@keyframes nx-hero-drift{
  from { transform: translate3d(-2%, -1%, 0) scale(1); }
  to   { transform: translate3d( 2%,  1%, 0) scale(1.02); }
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce){
  :root{ --nx-dur: 1ms; }
  .hero-section::before{ animation: none; }
  [data-animate]{ transition: none; opacity: 1; transform: none; filter: none; }
  .nx-hover-float, .nx-shine::after{ transition: none; }
}