/* Extracted styles from user's supplied HTML */
body {
    box-sizing: border-box;
    font-family: 'Inter', sans-serif;
}

.gradient-bg {
    background: linear-gradient(135deg, #1e3a8a 0%, #312e81 50%, #1e1b4b 100%);
}

.glass-effect {
    background: rgba(255, 255, 255, 0.1);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.skill-bar {
    transition: width 2s ease-in-out;
    width: 0%; /* initial width managed here, animated via JS */
}

.project-card {
    transition: all 0.3s ease;
}

.project-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
}

.nav-link {
    transition: all 0.3s ease;
}

.nav-link:hover {
    color: #60a5fa;
}

.typing-animation {
    border-right: 2px solid #667eea;
    animation: blink 1s infinite;
}

@keyframes blink {
    0%, 50% { border-color: #667eea; }
    51%, 100% { border-color: transparent; }
}

.fade-in {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.6s ease;
}

.fade-in.visible {
    opacity: 1;
    transform: translateY(0);
}

.tech-icon {
    transition: all 0.3s ease;
}

.tech-icon:hover {
    transform: scale(1.1);
    color: #60a5fa;
}

/* Small utilities */
#typing-text { display: inline-block; padding-right: 6px; }