/* Hero Background */
.hero-bg {
	background-image: url('/images/fotis-fotopoulos-6sAl6aQ4OWI-unsplash.jpg');
	background-size: cover;
	background-position: center;
}

/* Fade-in Animation */
@keyframes fadeInUp {
	from {
		opacity: 0;
		transform: translateY(30px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.fade-in {
	animation: fadeInUp 0.6s ease-out forwards;
	opacity: 0;
}

.delay-100 { animation-delay: 0.1s; }
.delay-200 { animation-delay: 0.2s; }
.delay-300 { animation-delay: 0.3s; }
.delay-400 { animation-delay: 0.4s; }

/* ── Scroll Progress Bar ── */
.scroll-progress {
	position: absolute;
	top: 0;
	left: 0;
	height: 3px;
	width: 0%;
	background: linear-gradient(90deg, #2563EB, #9333EA);
	z-index: 60;
	transition: width 0.05s linear;
	box-shadow: 0 0 8px rgba(37, 99, 235, 0.4);
}

/* ── Nav Active State ── */
.nav-link {
	position: relative;
	padding-bottom: 4px;
}

/* Animated underline indicator */
.nav-link::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 50%;
	width: 0;
	height: 2px;
	background: linear-gradient(90deg, #2563EB, #9333EA);
	border-radius: 1px;
	transition: width 0.3s ease, left 0.3s ease;
}

/* Active state: full-width underline + blue text */
.nav-link.active {
	color: #2563EB;
}
.dark .nav-link.active {
	color: #60a5fa;
}
.nav-link.active::after {
	width: 100%;
	left: 0;
}