.module__responsabilidades {
	background: var(--color-vibe-red-cream);
	border-radius: var(--radius-vibe);
	margin-top: 5rem;
	padding: 7rem 0;
	& .responsabilidades__titulo-descripcion {
		width: 75%;
		margin: 0 auto 7rem;
	}
	& .responsabilidades__items {
		width: 90%;
		margin: 0 auto;
		display: flex;
		flex-wrap: wrap;
		gap: 2rem;
		& .item {
			flex: 1 1 100%;
			padding: 4rem 2.5rem 3rem;
			border-radius: var(--radius-vibe);
			& h3 {
				font: 500 2.4rem/2.6rem var(--font-secondary);
                margin-bottom: 1.5rem;
				& strong {
					font-weight: 100;
				}
			}
			& p {
				font-size: 1.4rem;
				font-style: italic;
				color: var(--color-vibe-dark);
				line-height: 2.3rem;
			}
		}
		& .item:nth-child(4n + 1) {
			border: solid 0.2rem var(--color-vibe-yellow);
		}
		& .item:nth-child(4n + 2) {
			border: solid 0.2rem var(--color-vibe-red);
		}
		& .item:nth-child(4n + 3) {
			border: solid 0.2rem var(--color-vibe-green);
		}
		& .item:nth-child(4n + 4) {
			border: solid 0.2rem var(--color-vibe-blue);
		}
		& .item:nth-child(4n + 1) h3 {
			color: var(--color-vibe-yellow);
		}
		& .item:nth-child(4n + 2) h3 {
			color: var(--color-vibe-red);
		}
		& .item:nth-child(4n + 3) h3 {
			color: var(--color-vibe-green);
		}
		& .item:nth-child(4n + 4) h3 {
			color: var(--color-vibe-blue);
		}
	}
}

@media (min-width: 600px) {
	.module__responsabilidades .responsabilidades__items .item {
		flex: 1 1 calc(50% - 20px); /* 2 columnas */
	}
}

@media (min-width: 900px) {
	.module__responsabilidades .responsabilidades__items .item {
		flex: 1 1 calc(33.33% - 20px); /* 3 columnas */
	}
}

@media (min-width: 1200px) {
	.module__responsabilidades .responsabilidades__items .item {
		flex: 1 1 calc(25% - 20px); /* 4 columnas */
	}
}
