/* Desktop underline animation */
.nav-link {
    position: relative;
    padding-bottom: 4px;
    transition: color 0.3s;
}

.nav-link::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    height: 2px;
    width: 0%;
    background: #2563eb;
    /* Blue-600 */
    transition: 0.3s;
    border-radius: 2px;
}

.nav-link:hover {
    color: #2563eb;
}

.nav-link:hover::after {
    width: 100%;
}

/* Mobile menu links */
.mobile-link {
    display: block;
    padding: 12px 16px;
    border-bottom: 1px solid #e5e7eb;
    transition: 0.3s;
}

.mobile-link:hover {
    background: #f3f4f6;
}


@keyframes fadeInUp {
    0% {
        opacity: 0;
        transform: translateY(20px);
    }

    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

.animate-fadeInUp {
    animation: fadeInUp 1s ease-out forwards;
}


@keyframes fadeInUp {
    0% {
        opacity: 0;
        transform: translateY(20px);
    }

    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

.animate-fadeInUp {
    animation: fadeInUp 1s ease-out forwards;
}

.skill-badge {
    background: #eef2ff;
    color: #4f46e5;
    padding: 6px 14px;
    border-radius: 999px;
    font-size: 0.9rem;
    font-weight: 600;
    border: 1px solid #c7d2fe;
    transition: all 0.3s;
}

.skill-badge:hover {
    background: #c7d2fe;
    cursor: default;
}



/* about page style  */


@keyframes fadeInUp {
    0% {
        opacity: 0;
        transform: translateY(20px);
    }

    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

.animate-fadeInUp {
    animation: fadeInUp 1s ease-out forwards;
}

.skill-badge {
    background: #eef2ff;
    color: #4f46e5;
    padding: 6px 14px;
    border-radius: 999px;
    font-size: 0.9rem;
    font-weight: 600;
    border: 1px solid #c7d2fe;
    transition: all 0.3s;
}

.skill-badge:hover {
    background: #c7d2fe;
    cursor: default;
}

@keyframes fadeInUp {
  0% { opacity: 0; transform: translateY(20px); }
  100% { opacity: 1; transform: translateY(0); }
}
.animate-fadeInUp { animation: fadeInUp 1s ease-out forwards; }

@keyframes fadeInUp {
  0% { opacity: 0; transform: translateY(20px); }
  100% { opacity: 1; transform: translateY(0); }
}
.animate-fadeInUp { animation: fadeInUp 1s ease-out forwards; }

@keyframes pulse-slow {
  0%, 100% { transform: scale(1); opacity: 0.3; }
  50% { transform: scale(1.05); opacity: 0.5; }
}
.animate-pulse-slow { animation: pulse-slow 6s ease-in-out infinite; }