/* Rude Academy — Kids / Values widget. Extracted verbatim from source index.html. */

.kids {
	background: var(--ink);
	color: var(--bone);
	padding: 120px 0;
}
.kids .section__head { border-bottom-color: var(--line-dark); }
.kids .eyebrow { color: var(--gold); }
.kids .programs__intro {
	color: rgba(255,255,255,0.72);
	max-width: 680px;
}

.kids__grid {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 20px;
}
.value {
	grid-column: span 1;
	background: rgba(255,255,255,0.04);
	border: 1px solid var(--line-dark);
	border-radius: 14px;
	padding: 32px 24px;
	transition: background 0.2s, border-color 0.2s;
}
.value:hover {
	background: rgba(232,181,0,0.08);
	border-color: var(--gold);
}

.value__num {
	font-family: "Archivo Black", sans-serif;
	color: var(--gold);
	font-size: 14px;
	margin-bottom: 24px;
}
.value__name {
	font-family: "Archivo Black", sans-serif;
	font-size: 20px;
	line-height: 1.1;
	text-transform: uppercase;
	margin-bottom: 10px;
}
.value__desc {
	font-size: 14px;
	line-height: 1.5;
	color: rgba(255,255,255,0.7);
}

@media (max-width: 900px) {
	.kids__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 520px) {
	.kids__grid { grid-template-columns: 1fr; }
}
