/* ============================================================
   Portfolio — global styles
   ============================================================ */

/* Smooth scroll */
html { scroll-behavior: smooth; }

/* Scrollbar */
::-webkit-scrollbar          { width: 6px; }
::-webkit-scrollbar-track    { background: #0a0a0f; }
::-webkit-scrollbar-thumb    { background: #4f46e5; border-radius: 3px; }

/* Animated gradient text */
.gradient-text {
  background: linear-gradient(135deg, #818cf8 0%, #6366f1 50%, #a78bfa 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* Glassmorphism card */
.glass-card {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.08);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

/* Glow ring */
.glow-ring {
  box-shadow: 0 0 0 1px rgba(99,102,241,.4), 0 0 40px rgba(99,102,241,.15);
}

/* Navbar scroll-aware blur */
#navbar.scrolled {
  background: rgba(10,10,15,0.85);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-bottom: 1px solid rgba(255,255,255,0.06);
}

/* Hero typing cursor */
.typing-cursor::after {
  content: '|';
  animation: blink 1s step-end infinite;
  color: #818cf8;
}
@keyframes blink { 0%,100%{opacity:1} 50%{opacity:0} }

/* Animated stat counter */
.stat-number { font-variant-numeric: tabular-nums; }

/* Skill progress bar */
.skill-bar-fill {
  height: 4px;
  border-radius: 9999px;
  background: linear-gradient(90deg, #6366f1, #818cf8);
  width: 0;
  transition: width 1.2s cubic-bezier(.4,0,.2,1);
}

/* Project card hover */
.project-card { transition: transform .25s ease, box-shadow .25s ease; }
.project-card:hover { transform: translateY(-4px); box-shadow: 0 20px 60px rgba(99,102,241,.15); }

/* Section reveal */
.reveal { opacity: 0; transform: translateY(28px); transition: opacity .6s ease, transform .6s ease; }
.reveal.visible { opacity: 1; transform: none; }

/* Timeline */
.timeline-line { position: relative; }
.timeline-line::before {
  content: '';
  position: absolute;
  left: 7px; top: 24px; bottom: 0;
  width: 2px;
  background: linear-gradient(to bottom, #6366f1, transparent);
}

/* Active nav link (scroll-spy) */
.nav-active { color: #d4a017 !important; }

/* Filter chip */
.filter-chip { transition: all .2s ease; }
.filter-chip.active {
  background: #6366f1;
  color: #fff;
  border-color: #6366f1;
}

/* Availability badge pulse */
@keyframes pulse-ring {
  0%  { transform: scale(.95); box-shadow: 0 0 0 0 rgba(34,197,94,.4); }
  70% { transform: scale(1);   box-shadow: 0 0 0 8px rgba(34,197,94,0); }
  100%{ transform: scale(.95); box-shadow: 0 0 0 0 rgba(34,197,94,0); }
}
.pulse-badge { animation: pulse-ring 2s ease infinite; }