/* ==========================================================================
   Efie Asem — Responsive Overrides
   ========================================================================== */

/* ---------- Laptops / small desktops ---------- */
@media (max-width: 1199.98px) {
	:root {
		--section-padding: 5.5rem;
	}

	.process-timeline {
		flex-wrap: wrap;
		justify-content: center;
	}

	.process-connector {
		display: none;
	}

	.process-step {
		flex: 0 0 auto;
		width: 30%;
	}
}

/* ---------- Tablets ---------- */
@media (max-width: 991.98px) {
	:root {
		--section-padding: 4.5rem;
	}

	.navbar-collapse {
		background-color: var(--color-white);
		margin-top: 1rem;
		padding: 1.5rem;
		border-radius: 8px;
		box-shadow: 0 20px 45px rgba(0, 0, 0, 0.12);
	}

	.navbar-nav .nav-link,
	#mainNav.scrolled .navbar-nav .nav-link {
		color: var(--color-black);
		margin: 0.35rem 0;
	}

	.nav-cta {
		display: inline-block;
		margin-top: 0.75rem;
	}

	.hero-title {
		font-size: clamp(2rem, 6vw, 3rem);
	}

	.process-step {
		width: 45%;
	}

	.about-image-wrap {
		max-width: 520px;
		margin: 0 auto;
	}
}

/* ---------- Mobile / landscape phones ---------- */
@media (max-width: 767.98px) {
	:root {
		--section-padding: 3.5rem;
	}

	.hero {
		text-align: center;
	}

	.hero-content {
		max-width: 100%;
	}

	.hero-actions {
		justify-content: center;
	}

	.hero-actions .btn {
		width: 100%;
	}

	.cta-actions {
		flex-direction: column;
	}

	.cta-actions .btn {
		width: 100%;
	}

	.process-step {
		width: 100%;
	}

	.whatsapp-float {
		width: 52px;
		height: 52px;
		font-size: 1.5rem;
		bottom: 20px;
		right: 20px;
	}

	#scrollTopBtn {
		width: 42px;
		height: 42px;
		bottom: 20px;
		left: 20px;
	}
}

/* ---------- Small phones ---------- */
@media (max-width: 575.98px) {
	.section-title {
		font-size: 1.6rem;
	}

	.service-card,
	.feature-card {
		padding: 1.75rem 1.25rem;
	}

	.value-card {
		padding: 1.25rem;
	}

	.build-img-wrap {
		height: 200px;
	}
}