/* ===== SCROLL PROGRESS BAR ===== */
.scroll-progress{
  position:fixed; top:0; left:0; height:3px; z-index:200;
  background:linear-gradient(90deg, var(--mint), var(--amber));
  width:0%; transition:width .1s linear;
  box-shadow:0 0 12px rgba(109,240,194,.5);
}

/* ===== CUSTOM CURSOR ===== */
.cursor-dot{
  position:fixed; top:0; left:0; width:8px; height:8px; border-radius:50%;
  background:var(--mint); pointer-events:none; z-index:9999;
  transition:transform .15s ease, opacity .15s ease;
  mix-blend-mode:screen;
}
.cursor-ring{
  position:fixed; top:0; left:0; width:36px; height:36px; border-radius:50%;
  border:1.5px solid rgba(109,240,194,.4); pointer-events:none; z-index:9998;
  transition:transform .08s ease, width .3s, height .3s, border-color .3s;
}
.cursor-ring.hover{
  width:56px; height:56px; border-color:var(--mint);
}
@media (hover:none){ .cursor-dot,.cursor-ring{ display:none; } }

/* ===== PARTICLE CANVAS ===== */
#particles{
  position:fixed; top:0; left:0; width:100%; height:100%; z-index:0; pointer-events:none;
}
body>*:not(#particles):not(.cursor-dot):not(.cursor-ring):not(.scroll-progress){
  position:relative; z-index:1;
}

/* ===== FLOATING ORBS ===== */
.orb{
  position:absolute; border-radius:50%; pointer-events:none; filter:blur(80px); opacity:.18;
  animation: orbFloat 12s ease-in-out infinite alternate;
}
.orb-1{ width:400px; height:400px; background:var(--mint); top:-120px; right:-100px; animation-delay:0s; }
.orb-2{ width:350px; height:350px; background:var(--amber); bottom:-80px; left:-80px; animation-delay:-4s; }
.orb-3{ width:280px; height:280px; background:#7c6df0; top:40%; left:50%; animation-delay:-8s; }
@keyframes orbFloat{
  0%{ transform:translate(0,0) scale(1); }
  50%{ transform:translate(30px,-40px) scale(1.1); }
  100%{ transform:translate(-20px,30px) scale(.95); }
}

/* ===== HERO TYPING CURSOR ===== */
.typing-cursor{
  display:inline-block; width:3px; height:.85em; background:var(--mint);
  margin-left:4px; vertical-align:text-bottom;
  animation: blink 1s step-end infinite;
}
@keyframes blink{ 0%,100%{opacity:1;} 50%{opacity:0;} }

/* ===== MAGNETIC BUTTON EFFECT ===== */
.btn{ position:relative; overflow:hidden; }
.btn::before{
  content:''; position:absolute; inset:0;
  background:radial-gradient(circle at var(--mx,50%) var(--my,50%), rgba(255,255,255,.15), transparent 60%);
  opacity:0; transition:opacity .3s;
}
.btn:hover::before{ opacity:1; }

/* ===== GRADIENT TEXT ===== */
.gradient-text{
  background:linear-gradient(135deg, var(--mint), var(--amber));
  -webkit-background-clip:text; -webkit-text-fill-color:transparent;
  background-clip:text;
}

/* ===== GLOWING SECTION DIVIDERS ===== */
section::before{
  content:''; position:absolute; top:-1px; left:50%; transform:translateX(-50%);
  width:120px; height:2px;
  background:linear-gradient(90deg, transparent, var(--mint), transparent);
}

/* ===== ENHANCED PROJECT CARDS ===== */
.pcard{ transition:transform .4s cubic-bezier(.2,.8,.2,1), box-shadow .4s, border-color .3s; }
.pcard:hover{
  transform:translateY(-8px) rotateX(2deg) rotateY(-1deg);
  box-shadow:0 20px 60px rgba(0,0,0,.3), 0 0 40px rgba(109,240,194,.08);
}

/* ===== SKILL CARD HOVER GLOW ===== */
.skill-card{
  transition:transform .3s, box-shadow .3s, border-color .3s;
}
.skill-card:hover{
  transform:translateY(-4px);
  border-color:rgba(109,240,194,.3);
  box-shadow:0 12px 40px rgba(0,0,0,.2), 0 0 30px rgba(109,240,194,.06);
}

/* ===== CERT CARD HOVER ===== */
.cert-card{
  transition:transform .3s, box-shadow .3s, border-color .3s;
}
.cert-card:hover{
  transform:translateY(-3px);
  border-color:rgba(255,181,107,.3);
  box-shadow:0 8px 30px rgba(0,0,0,.2);
}

/* ===== TIMELINE GLOW DOT ===== */
.tl-item::before{
  transition:box-shadow .3s, background .3s;
}
.tl-item:hover::before{
  background:var(--mint);
  box-shadow:0 0 12px rgba(109,240,194,.5);
}

/* ===== ANIMATED COUNTER ===== */
.stat-card b{
  display:block;
  transition:color .3s;
}
.stat-card:hover b{ color:var(--mint); }

/* ===== REVEAL VARIANTS ===== */
.reveal-left{ opacity:0; transform:translateX(-40px); transition:opacity .7s cubic-bezier(.2,.8,.2,1), transform .7s cubic-bezier(.2,.8,.2,1); }
.reveal-left.in{ opacity:1; transform:translateX(0); }
.reveal-right{ opacity:0; transform:translateX(40px); transition:opacity .7s cubic-bezier(.2,.8,.2,1), transform .7s cubic-bezier(.2,.8,.2,1); }
.reveal-right.in{ opacity:1; transform:translateX(0); }
.reveal-scale{ opacity:0; transform:scale(.85); transition:opacity .7s cubic-bezier(.2,.8,.2,1), transform .7s cubic-bezier(.2,.8,.2,1); }
.reveal-scale.in{ opacity:1; transform:scale(1); }

/* ===== STAGGERED CHILDREN ===== */
.stagger-children > *{ transition-delay: calc(var(--i,0) * 100ms); }

/* ===== EDU ROW HOVER ===== */
.edu-row{
  transition:transform .3s, border-color .3s, box-shadow .3s;
}
.edu-row:hover{
  transform:translateX(6px);
  border-color:rgba(109,240,194,.3);
  box-shadow:0 6px 24px rgba(0,0,0,.15);
}

/* ===== CONTACT LINK GLOW ===== */
.contact-links a{
  position:relative; overflow:hidden;
}
.contact-links a::after{
  content:''; position:absolute; top:0; left:-100%; width:100%; height:100%;
  background:linear-gradient(90deg, transparent, rgba(109,240,194,.06), transparent);
  transition:left .5s;
}
.contact-links a:hover::after{ left:100%; }

/* ===== NAV LINK UNDERLINE ===== */
.nav-links a::after{
  content:''; position:absolute; bottom:2px; left:50%; width:0; height:2px;
  background:var(--mint); border-radius:1px; transition:width .3s, left .3s;
}
.nav-links a:hover::after{ width:60%; left:20%; }
.nav-links a.active::after{ width:60%; left:20%; }

/* ===== HERO PANEL SHIMMER ===== */
.hero-panel::before{
  content:''; position:absolute; top:-50%; left:-50%; width:200%; height:200%;
  background:conic-gradient(from 0deg, transparent, rgba(109,240,194,.04), transparent, rgba(255,181,107,.03), transparent);
  animation: panelShimmer 8s linear infinite;
}
@keyframes panelShimmer{ to{ transform:rotate(360deg); } }

/* ===== FOOTER PULSE ===== */
footer{
  position:relative;
}
footer::before{
  content:''; position:absolute; top:-1px; left:50%; transform:translateX(-50%);
  width:80px; height:2px;
  background:linear-gradient(90deg, transparent, var(--amber), transparent);
}

/* ===== SMOOTH BODY BG TRANSITION ===== */
body{ transition: background-image 1s ease; }

/* ===== PRELOADER ===== */
.loader-wrapper{
  position:fixed; inset:0; z-index:10000; background:var(--bg);
  display:flex; align-items:center; justify-content:center;
  transition: transform 0.8s cubic-bezier(0.77, 0, 0.175, 1), opacity 0.8s ease-in-out;
}
.loader-content{ text-align:center; width:200px; }
.loader-bar{
  width:100%; height:2px; background:rgba(109,240,194,0.2); position:relative; overflow:hidden;
  border-radius:2px; margin-bottom:12px;
}
.loader-bar::after{
  content:''; position:absolute; top:0; left:0; height:100%; width:var(--progress, 0%);
  background:var(--mint); transition:width 0.1s linear;
  box-shadow: 0 0 10px var(--mint);
}
.loader-text{ font-family:var(--mono); font-size:14px; color:var(--mint); letter-spacing:0.1em; }
body.loaded .loader-wrapper{ transform:translateY(-100%); opacity:0; pointer-events:none; }

/* ===== AMBIENT MOUSE GLOW ===== */
body::before{
  content:''; position:fixed; inset:0; pointer-events:none; z-index:0;
  background: radial-gradient(circle 600px at var(--mouse-x, 50%) var(--mouse-y, 50%), rgba(109,240,194,0.025), transparent 80%);
}

/* ===== GLASSMORPHISM ENHANCEMENT ===== */
.pcard, .skill-card, .cert-card, .edu-row, .contact-card, .hero-panel {
  background: rgba(18, 26, 46, 0.5) !important;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: 1px solid rgba(255, 255, 255, 0.06) !important;
  box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.2);
}
.pcard:hover, .skill-card:hover, .cert-card:hover, .edu-row:hover {
  background: rgba(18, 26, 46, 0.85) !important;
  border: 1px solid rgba(109, 240, 194, 0.3) !important;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.4), 0 0 20px rgba(109, 240, 194, 0.08);
}

/* ===== BUTTON RIPPLE EFFECT ===== */
.btn-ripple {
  position: absolute; border-radius: 50%; width: 1px; height: 1px; transform: scale(0);
  animation: ripple 0.6s ease-out; background: rgba(255, 255, 255, 0.4); pointer-events:none;
}
@keyframes ripple {
  to { transform: scale(300); opacity: 0; }
}

/* ===== ENHANCED REVEAL (3D FLIP) ===== */
.reveal-flip {
  opacity: 0;
  transform: perspective(1000px) rotateX(25deg) translateY(40px);
  transition: opacity 0.8s cubic-bezier(0.2, 0.8, 0.2, 1), transform 0.8s cubic-bezier(0.2, 0.8, 0.2, 1);
}
.reveal-flip.in {
  opacity: 1;
  transform: perspective(1000px) rotateX(0deg) translateY(0);
}

@media (prefers-reduced-motion: reduce){
  .cursor-dot,.cursor-ring{ display:none; }
  .orb{ animation:none; }
  .hero-panel::before{ animation:none; }
  .loader-wrapper{ display:none; }
}
