/* Rajveer Singh — premium visual effects.
   Layers: aurora glows + interactive particle network (canvas), cursor
   spotlight, scroll progress bar, scroll-reveal, 3D card tilt with glow,
   animated gradient headlines, button shine. Motion-heavy parts are disabled
   for visitors who prefer reduced motion. */

/* ---------- Background layer ---------- */
.rs-fx{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.rs-net{position:absolute;inset:0;width:100%;height:100%;display:block}

/* Aurora glows */
.rs-fx i{position:absolute;border-radius:50%;mix-blend-mode:multiply;will-change:transform;width:70vmax;height:70vmax}
.rs-fx i:nth-of-type(1){left:-20vmax;top:-26vmax;background:radial-gradient(circle,rgba(20,118,201,.55),rgba(20,118,201,0) 64%);animation:rsDrift1 22s ease-in-out infinite alternate}
.rs-fx i:nth-of-type(2){right:-24vmax;top:14vh;background:radial-gradient(circle,rgba(24,166,155,.50),rgba(24,166,155,0) 64%);animation:rsDrift2 27s ease-in-out infinite alternate}
.rs-fx i:nth-of-type(3){left:18vw;bottom:-38vmax;background:radial-gradient(circle,rgba(124,92,255,.40),rgba(124,92,255,0) 64%);animation:rsDrift3 31s ease-in-out infinite alternate}
@keyframes rsDrift1{0%{transform:translate3d(0,0,0) scale(1)}100%{transform:translate3d(18vw,14vh,0) scale(1.22)}}
@keyframes rsDrift2{0%{transform:translate3d(0,0,0) scale(1.12)}100%{transform:translate3d(-20vw,-10vh,0) scale(.9)}}
@keyframes rsDrift3{0%{transform:translate3d(0,0,0) scale(.95)}100%{transform:translate3d(-16vw,-18vh,0) scale(1.2)}}

/* Cursor spotlight (desktop pointers only; element is created hidden) */
.rs-cursor{position:fixed;left:0;top:0;width:560px;height:560px;margin:-280px 0 0 -280px;border-radius:50%;pointer-events:none;z-index:0;opacity:0;transition:opacity .5s;background:radial-gradient(circle,rgba(24,166,155,.26),rgba(20,118,201,.12) 42%,rgba(20,118,201,0) 70%);will-change:transform}
.rs-cursor.on{opacity:1}

/* Scroll progress */
.rs-progress-bar{position:fixed;top:0;left:0;right:0;height:3px;z-index:9999;pointer-events:none;transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,#1476c9,#18a69b,#7c5cff);box-shadow:0 0 12px rgba(24,166,155,.6)}

/* ---------- Scroll reveal (uses the individual `translate` property so it never fights card tilt) ---------- */
.rs-r{opacity:0;translate:0 34px;transition:opacity .9s cubic-bezier(.2,.7,.2,1),translate .9s cubic-bezier(.2,.7,.2,1);transition-delay:var(--rs-d,0ms)}
.rs-r.rs-in{opacity:1;translate:0 0}

/* ---------- Cards: 3D tilt + cursor-following glow ---------- */
[data-rs-tilt]{position:relative;transition:transform .18s ease-out,box-shadow .3s,border-color .3s;will-change:transform;transform-style:preserve-3d}
[data-rs-tilt]:hover{box-shadow:0 26px 60px rgba(8,45,90,.20);border-color:rgba(24,166,155,.55)}
.rs-glow{position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .3s;background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%),rgba(24,166,155,.26),rgba(20,118,201,.12) 40%,rgba(20,118,201,0) 66%)}

/* ---------- Animated gradient headline accents ---------- */
h1 em,h2 em,h3 em{font-style:italic;background:linear-gradient(95deg,#1476c9,#18a69b,#7c5cff,#1476c9);background-size:300% auto;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;animation:rsShine 7s linear infinite}
@keyframes rsShine{to{background-position:300% center}}

/* ---------- Button shine ---------- */
.btn,.elementor-button{position:relative;overflow:hidden}
.btn::after,.elementor-button::after{content:"";position:absolute;top:0;left:-130%;width:55%;height:100%;pointer-events:none;background:linear-gradient(100deg,transparent,rgba(255,255,255,.6),transparent);transform:skewX(-20deg);transition:left .7s ease}
.btn:hover::after,.elementor-button:hover::after{left:150%}

/* ---------- Gentle float for portraits / the homepage portrait frame ---------- */
.rs-avatar,.elementor-element-b000000b{animation:rsFloat 7s ease-in-out infinite}
@keyframes rsFloat{0%,100%{translate:0 0}50%{translate:0 -10px}}

@media (max-width:700px){
  .rs-fx i{width:100vmax;height:100vmax}
  .rs-cursor{display:none}
}
@media (prefers-reduced-motion:reduce){
  .rs-fx i,h1 em,h2 em,h3 em,.rs-avatar,.elementor-element-b000000b{animation:none}
  .rs-r{opacity:1;translate:none;transition:none}
  .rs-cursor,.rs-net{display:none}
  .btn::after,.elementor-button::after{display:none}
}
@media print{.rs-fx,.rs-cursor,.rs-progress-bar{display:none}}