/* ==========================================================================
   PÁGINA INICIAL — SECÇÃO 4 / CURSOS
   Grelha de três .curso-card (o desenho do cartão vem de components.css).
   ========================================================================== */

.cursos {
	padding-block: clamp(4rem, 8vw, 7rem);
	background: var(--c-white);
	scroll-margin-top: 5rem;
}

.cursos .home-courses {
	margin: 0;
}

/* Na homepage o cartão assenta sobre off-white; o branco ganha relevo. */
.cursos .curso-card {
	box-shadow: 0 2px 10px rgba(17, 17, 17, 0.04);
}

.cursos .curso-card:hover {
	box-shadow: var(--sh-lg);
}

@media (max-width: 640px) {
	.cursos {
		padding-block: 3.25rem;
	}
}