/* Reset legacy Bootstrap-centric styles and set modern defaults */
html { font-size: 16px; scroll-behavior: smooth; }
body { margin: 0; }

/* Simple nav link styling without Tailwind build step */
.nav-link { color: inherit; text-decoration: none; padding: 0.25rem 0.5rem; border-radius: 0.5rem; font-weight: 500; }
.nav-link:hover { color: #1aa6ff; }

/* Utility for animate-in on hero */
.animate-in { opacity: 0; transform: translateY(16px); animation: fadeSlideIn .8s ease-out forwards; }
@keyframes fadeSlideIn { to { opacity: 1; transform: translateY(0); } }

/* Animated gradient background for hero */
.animated-gradient { background: linear-gradient(120deg, rgba(26,166,255,0.15), rgba(79,191,255,0.12), rgba(13,131,214,0.12)); background-size: 200% 200%; animation: gradientMove 12s ease infinite; }
@keyframes gradientMove { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } }

/* Neon/gradient button for dark mode */
.btn-neon { position: relative; overflow: hidden; }
.btn-neon::before { content: ""; position: absolute; inset: -2px; background: linear-gradient(90deg,#22d3ee,#1aa6ff,#a78bfa); filter: blur(10px); opacity: .4; transition: opacity .3s ease; z-index: 0; }
.btn-neon > span { position: relative; z-index: 1; }
.dark .btn-neon { background: linear-gradient(90deg,#0f172a,#111827); border: 1px solid rgba(255,255,255,.08); }
.dark .btn-neon:hover::before { opacity: .7; }

/* Hover icon slide to right */
.icon-slide { transition: transform .25s ease; }
.group:hover .icon-slide { transform: translateX(4px); }

/* AOS-like stagger helpers */
[data-delay="100"]{transition-delay:.1s}
[data-delay="150"]{transition-delay:.15s}
[data-delay="200"]{transition-delay:.2s}
[data-delay="250"]{transition-delay:.25s}
[data-delay="300"]{transition-delay:.3s}
[data-delay="350"]{transition-delay:.35s}
[data-delay="400"]{transition-delay:.4s}

/* Progress bar styles */
.skill-bar { height: 10px; border-radius: 9999px; background: rgba(148,163,184,.25); overflow: hidden; }
.skill-bar > .fill { height: 100%; width: 0; background: linear-gradient(90deg,#1aa6ff,#4fbfff); border-radius: inherit; transition: width 1.2s ease; }
.dark .skill-bar { background: rgba(100,116,139,.35); }
.dark .skill-bar > .fill { background: linear-gradient(90deg,#22d3ee,#60a5fa); }

/* Project filter animation */
.project-card { transition: transform .4s ease, opacity .3s ease, filter .3s ease, box-shadow .3s ease; }
.project-card.hidden-card { opacity: 0; transform: scale(.95); pointer-events: none; }