/* =========================================================
   Sportcoachplein — klantenservice (archief, detail, contactformulier)
   ========================================================= */

/* ---------- Klantenservice ---------- */
.scp-grid--ks {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.25rem;
}
@media (max-width: 900px) { .scp-grid--ks { grid-template-columns: 1fr; } }
.scp-ks-kaart {
	display: block;
	background: var(--scp-creme);
	border-radius: var(--scp-radius);
	padding: 1.75rem;
	text-decoration: none;
	transition: transform var(--scp-overgang), box-shadow var(--scp-overgang);
}
.scp-ks-kaart:hover { transform: translateY(-6px); box-shadow: var(--scp-schaduw); }
.scp-ks-kaart__kop { display: flex; align-items: center; gap: 0.9rem; margin-bottom: 0.6rem; }
.scp-ks-kaart__kop h2 { margin: 0; font-size: 1.15rem; }
.scp-ks-kaart__icoon {
	flex: none;
	width: 48px; height: 48px;
	border-radius: 12px;
	background: var(--scp-wit);
	display: grid;
	place-items: center;
	font-size: 1.25rem;
	color: var(--scp-geel-donker);
	box-shadow: 0 4px 12px rgba(33, 26, 17, 0.06);
}
.scp-ks-kaart p { color: var(--scp-grijs); font-size: 0.95rem; }
.scp-ks-contact {
	margin-top: 3rem;
	background: var(--scp-geel);
	border-radius: var(--scp-radius-groot);
	padding: clamp(1.5rem, 4vw, 3rem);
	text-align: center;
}
.scp-ks-contact__acties { display: flex; gap: 0.75rem; justify-content: center; flex-wrap: wrap; }


/* ---------- Detailpagina met sidebar ---------- */
.scp-ks-layout {
	display: grid;
	grid-template-columns: 260px 1fr;
	gap: clamp(1.5rem, 4vw, 3.5rem);
	align-items: start;
}
@media (max-width: 800px) {
	.scp-ks-layout { grid-template-columns: 1fr; }
	.scp-ks-sidebar { position: static; margin-bottom: 0.5rem; }
	.scp-ks-sidebar ul {
		display: flex;
		gap: 0.5rem;
		overflow-x: auto;
		scrollbar-width: none;
		padding-bottom: 0.4rem;
	}
	.scp-ks-sidebar ul::-webkit-scrollbar { display: none; }
	.scp-ks-sidebar li { border-bottom: 0; flex: none; }
	.scp-ks-sidebar a {
		padding: 0.5rem 1.1rem;
		border: 2px solid var(--scp-grijs-border);
		border-radius: 999px;
		white-space: nowrap;
		font-size: 0.92rem;
	}
	.scp-ks-sidebar .is-actief a { border-color: var(--scp-geel); background: var(--scp-geel-licht); color: var(--scp-zwart); }
}
.scp-ks-sidebar {
	position: sticky;
	top: 100px;
}
.scp-ks-sidebar li { border-bottom: 1px solid var(--scp-grijs-border); }
.scp-ks-sidebar li:last-child { border-bottom: 0; }
.scp-ks-sidebar a {
	display: block;
	padding: 0.7rem 0.4rem;
	text-decoration: none;
	font-weight: 600;
}
.scp-ks-sidebar a:hover { color: var(--scp-geel-donker); }
.scp-ks-sidebar .is-actief a { color: var(--scp-geel-donker); }
.scp-ks-inhoud .scp-page-title { margin-top: 0; }

/* ---------- Contactformulier ---------- */
.scp-contactform { max-width: 640px; margin-top: 1.5rem; }
.scp-contactform__rij {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1rem;
}
@media (max-width: 600px) { .scp-contactform__rij { grid-template-columns: 1fr; } }
.scp-contactform label { display: block; font-weight: 700; margin-bottom: 0.3rem; }
.scp-contactform input,
.scp-contactform textarea {
	width: 100%;
	border: 2px solid var(--scp-grijs-border);
	border-radius: 14px;
	padding: 0.65rem 1rem;
	font: inherit;
	background: var(--scp-wit);
	transition: border-color var(--scp-overgang);
}
.scp-contactform input:focus,
.scp-contactform textarea:focus { border-color: var(--scp-geel); outline: none; }
.scp-contactform__melding {
	border-radius: 12px;
	padding: 0.9rem 1.2rem;
	font-weight: 600;
}
.scp-contactform__melding.is-succes { background: #E7F5E7; color: #1a7a2e; }
.scp-contactform__melding.is-fout { background: #FBEAEA; color: var(--scp-rood); }

/* Honeypot: onzichtbaar voor mensen */
.scp-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
