/* =========================================================
   HERO SCROLL TRANSITION  —  v217

   Owner feedback: "scroll par koi effect nahi, kabhi kabhi lag".
   Rebuilt as a real, always-visible, frame-driven animation:
   the hero lifts + fades, a neutral (colourless) frosted veil
   pulses, and the page glides to the profile section on an eased
   curve. Everything is opacity + transform only, so there is
   nothing heavy to repaint => no lag.
   ========================================================= */

#tpVeil{
  position:fixed;
  inset:0;
  z-index:120;
  pointer-events:none;
  opacity:0;
  background:rgba(240,244,250,.94);
  transform:translateZ(0);
  will-change:opacity;
  contain:strict;
}

/* driven frame by frame from JS, so no transitions needed here */
#heroIntro.tp-run,
section.hero.tp-run{will-change:transform,opacity}

/* Once the landing completes, hide the previous hero so its bottom edge
   cannot ghost through the fixed translucent navbar. Re-enabled at top. */
#heroIntro.tp-past{visibility:hidden!important}

/* landing section is perfectly centred, both axes */
.tp-home section.hero{
  min-height:100svh;
  box-sizing:border-box;
  display:flex;
  align-items:center;
  justify-content:center;
}
.tp-home section.hero > .container{width:100%}

/* momentary scroll lock while the animation plays (always released) */
html.tp-busy,body.tp-busy{overflow:hidden!important}

@media (prefers-reduced-motion:reduce){
  #tpVeil{display:none}
}