/* ==========================================================================
   SeniorSterk — opmaak
   Kleuren uit het SeniorSterk design system. Pas kleuren alleen hier aan.
   Alle maten in rem, zodat grotere tekst (browserinstelling) netjes meeschaalt.
   ========================================================================== */

@font-face {
	font-family: "Inter";
	src: url("../fonts/Inter-var.woff") format("woff");
	font-weight: 100 900;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "Atkinson Hyperlegible";
	src: url("../fonts/AtkinsonHyperlegible-Regular.woff") format("woff");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "Atkinson Hyperlegible";
	src: url("../fonts/AtkinsonHyperlegible-Bold.woff") format("woff");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

:root {
	--polderblauw: #1C3D6E;
	--polder-diep: #0F2647;
	--polder-rand: #3A5A88;
	--polder-zacht: #24497F;
	--krachtoranje: #E2632B;
	--oranje-tekst: #B4461A;
	--oranje-licht: #FCF4EE;
	--zand: #F6EFE3;
	--inkt: #141C28;
	--inkt-zacht: #4A5464;
	--ijsblauw: #DBE6F3;
	--ijs-dof: #A9BCD6;
	--lijn: #CFC6B6;
	--lijn-zacht: #E6DFD2;
	--wit: #FFFFFF;
	--fout: #A3261B;
	--fout-licht: #FBEAE8;

	--font-display: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
	--font-tekst: "Atkinson Hyperlegible", "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;

	--radius: 0.75rem;
	--radius-groot: 1.25rem;
	--gutter: 1rem;
	--breed: 72rem;
	--sectie: clamp(3rem, 8vw, 6rem);

	color-scheme: light;
}

/* ---------- Basis ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
@media (prefers-reduced-motion: no-preference) {
	html { scroll-behavior: smooth; }
}
body {
	margin: 0;
	background: var(--zand);
	color: var(--inkt);
	font-family: var(--font-tekst);
	font-size: 1.25rem;           /* 20px */
	line-height: 1.55;
	overflow-wrap: break-word;
	-webkit-font-smoothing: antialiased;
}
img, svg { display: block; max-width: 100%; height: auto; }
a { color: var(--polderblauw); text-decoration-thickness: 0.1em; text-underline-offset: 0.18em; }
a:hover { color: var(--oranje-tekst); }
:focus-visible {
	outline: 0.25rem solid var(--krachtoranje);
	outline-offset: 0.2rem;
	border-radius: 0.25rem;
}
p { margin: 0 0 1rem; }
ul, ol { padding: 0; margin: 0; }
h1, h2, h3 { margin: 0; }
[id] { scroll-margin-top: 6rem; }
main:focus { outline: none; }
.visually-hidden, .screen-reader-text {
	position: absolute !important; width: 1px; height: 1px; overflow: hidden;
	clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap;
}

.ss-skiplink {
	position: absolute; left: 1rem; top: -10rem; z-index: 100;
	background: var(--krachtoranje); color: var(--inkt);
	padding: 0.75rem 1.25rem; font-weight: 700; border-radius: var(--radius);
}
.ss-skiplink:focus { top: 1rem; color: var(--inkt); }

.ss-wrap {
	width: 100%;
	max-width: var(--breed);
	margin-inline: auto;
	padding-inline: var(--gutter);
}
@media (min-width: 40em) { :root { --gutter: 2rem; } }
.ss-wrap--smal { max-width: 50rem; }
.ss-hero__raster > *, .ss-twee > *, .ss-feiten > *, .ss-stappen > *, .ss-voet__raster > *, .ss-aanmelden > *, .ss-sven > *, .ss-prijzen__rij > * { min-width: 0; }

/* ---------- Typografie ---------- */
.ss-label {
	font-family: var(--font-display);
	font-weight: 700;
	font-size: 0.95rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--oranje-tekst);
	margin: 0 0 0.75rem;
}
.ss-label--licht { color: var(--ijsblauw); }

.ss-kop1, .ss-kop2 {
	font-family: var(--font-display);
	font-weight: 900;
	letter-spacing: -0.025em;
	line-height: 1.04;
	color: var(--polderblauw);
	hyphens: manual;
}
.ss-kop1 { font-size: clamp(min(2.2rem, 10vw), 6vw, 3.4rem); margin-bottom: 1.5rem; }
.ss-kop2 { font-size: clamp(min(2rem, 9.5vw), 5vw, 3.1rem); margin-bottom: 1rem; }
.ss-kop2 > span { display: block; }
.ss-kop2--licht { color: var(--zand); }
.ss-kop3 {
	font-family: var(--font-display);
	font-weight: 800;
	font-size: 1.35rem;
	line-height: 1.2;
	color: var(--polderblauw);
	margin-bottom: 0.5rem;
}
.ss-oranje { color: var(--krachtoranje); }
.ss-inleiding { font-size: 1.35rem; max-width: 38em; margin-bottom: 2rem; }
.ss-noot { color: var(--inkt-zacht); font-size: 1.1rem; margin-top: 1rem; }
.ss-tekst > * + * { margin-top: 1rem; }
.ss-tekst h2 { font-family: var(--font-display); font-size: 1.7rem; color: var(--polderblauw); margin-top: 2rem; }
.ss-tekst h3 { font-family: var(--font-display); font-size: 1.35rem; color: var(--polderblauw); margin-top: 1.5rem; }
.ss-tekst ul, .ss-tekst ol { padding-left: 1.5rem; }
.ss-tekst li + li { margin-top: 0.4rem; }

/* ---------- Knoppen ---------- */
.ss-knop {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.6rem;
	min-height: 3.25rem;              /* 52px */
	padding: 0.6rem 1.4rem;
	border: 0.15rem solid transparent;
	border-radius: var(--radius);
	font-family: var(--font-display);
	font-weight: 800;
	font-size: 1.15rem;
	line-height: 1.2;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	max-width: 100%;
}
.ss-knop .ss-icoon { width: 1.4rem; height: 1.4rem; flex: none; }
.ss-knop > span { min-width: 0; }
.ss-knop--groot { min-height: 3.75rem; font-size: 1.3rem; padding-inline: 1.8rem; }
.ss-knop--breed { width: 100%; justify-content: flex-start; }
.ss-knop--oranje { background: var(--krachtoranje); color: var(--inkt); }
.ss-knop--oranje:hover { background: #F07A45; color: var(--inkt); }
.ss-knop--blauw { background: var(--polderblauw); color: var(--zand); }
.ss-knop--blauw:hover { background: var(--polder-diep); color: var(--wit); }
.ss-knop--licht { background: var(--wit); color: var(--polderblauw); border-color: var(--lijn); }
.ss-knop--licht:hover { border-color: var(--polderblauw); color: var(--polderblauw); }

/* ---------- Kop (header) ---------- */
.ss-kop {
	background: var(--zand);
	border-bottom: 1px solid var(--lijn);
	z-index: 50;
}
@media (min-height: 40em) {
	.ss-kop { position: sticky; top: 0; }
	.admin-bar .ss-kop { top: 46px; }
}
@media (min-height: 40em) and (min-width: 783px) {
	.admin-bar .ss-kop { top: 32px; }
}
.ss-kop__binnen {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5rem 0.75rem;
	padding-block: 0.6rem;
}
.ss-kop__logo { display: block; margin-right: auto; flex: 0 1 auto; min-width: 0; }
.ss-logo { width: 12rem; height: auto; }
.ss-logo--merk { display: none; width: 2.75rem; }
@media (max-width: 29.99em) {
	.ss-logo--vol { display: none; }
	.ss-logo--merk { display: block; }
}
.ss-kop__bel { min-height: 3rem; padding: 0.4rem 1rem; font-size: 1.05rem; }
.ss-kop__bel-nummer { display: none; }
.ss-kop__menuknop {
	display: inline-flex; align-items: center; gap: 0.4rem;
	min-height: 3rem; padding: 0.4rem 0.9rem;
	background: var(--wit); color: var(--polderblauw);
	border: 0.15rem solid var(--lijn); border-radius: var(--radius);
	font: 800 1.05rem/1.2 var(--font-display); cursor: pointer;
}
.ss-kop__menuknop .ss-icoon { width: 1.4rem; height: 1.4rem; }
.ss-kop__menuknop[aria-expanded="true"] { border-color: var(--polderblauw); }

.ss-menu { flex-basis: 100%; }
.js .ss-menu { display: none; }
.js .ss-menu.is-open { display: block; }
.ss-menu__lijst { list-style: none; display: flex; flex-direction: column; padding-bottom: 0.5rem; }
.ss-menu__lijst a {
	display: flex; align-items: center;
	min-height: 3.25rem; padding: 0.5rem 0.25rem;
	border-top: 1px solid var(--lijn);
	font-family: var(--font-display); font-weight: 700; font-size: 1.2rem;
	color: var(--polderblauw); text-decoration: none;
}
.ss-menu__lijst a:hover { color: var(--oranje-tekst); text-decoration: underline; }

@media (min-width: 40em) {
	.ss-kop__bel-nummer { display: inline; }
	.ss-kop__bel-woord { display: none; }
}
@media (min-width: 72em) {
	.ss-kop__binnen { gap: 1rem; padding-block: 0.8rem; }
	.ss-kop__menuknop { display: none; }
	.js .ss-menu, .ss-menu { display: block; flex-basis: auto; order: 2; }
	.ss-kop__bel { order: 3; }
	.ss-menu__lijst { flex-direction: row; gap: 0.25rem; padding: 0; }
	.ss-menu__lijst a { border: 0; min-height: 3rem; padding: 0.4rem 0.6rem; font-size: 1.05rem; border-radius: 0.5rem; white-space: nowrap; }
	.ss-menu__lijst a:hover { background: var(--wit); text-decoration: none; }
}

/* ---------- Hero ---------- */
.ss-hero {
	background: var(--polderblauw);
	color: var(--zand);
	padding-block: clamp(2.5rem, 7vw, 5.5rem);
}
.ss-hero__raster { display: grid; gap: 2.5rem; }
@media (min-width: 60em) {
	.ss-hero__raster { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 4rem; align-items: start; }
}
.ss-hero__kop {
	font-family: var(--font-display);
	font-weight: 900;
	font-size: clamp(min(2.5rem, 12vw), 11vw, 5.25rem);
	line-height: 0.98;
	letter-spacing: -0.035em;
	color: var(--zand);
	margin: 0.5rem 0 1.5rem;
}
.ss-hero__kop span { display: block; }
.ss-hero__intro { font-size: 1.4rem; max-width: 30em; color: var(--zand); }
.ss-hero__acties { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.5rem; margin-top: 2rem; }
.ss-hero__bel { margin: 0; font-size: 1.15rem; }
.ss-hero__bel a { color: var(--zand); font-weight: 700; white-space: nowrap; }
.ss-hero__bel a:hover { color: var(--krachtoranje); }
.ss-hero :focus-visible { outline-color: var(--krachtoranje); }

/* Gegevens als rijen tussen dunne lijnen */
.ss-rijen { margin: 0; border-top: 1px solid rgba(246, 239, 227, 0.3); }
.ss-rijen__rij {
	display: grid;
	grid-template-columns: minmax(0, 8.5rem) minmax(0, 1fr);
	gap: 0.25rem 1rem;
	align-items: baseline;
	padding-block: 0.9rem;
	border-bottom: 1px solid rgba(246, 239, 227, 0.3);
}
.ss-rijen dt { margin: 0; }
.ss-rijen dd {
	margin: 0;
	font-family: var(--font-display);
	font-weight: 700;
	font-size: 1.3rem;
	line-height: 1.3;
	min-width: 0;
}
.ss-rijen--licht { border-top-color: var(--lijn); }
.ss-rijen--licht .ss-rijen__rij { border-bottom-color: var(--lijn); }
.ss-rijen--licht dd { color: var(--inkt); }
.ss-rijen__noot { display: block; font-family: var(--font-tekst); font-weight: 400; font-size: 1.05rem; color: var(--inkt-zacht); }
@media (max-width: 26em) {
	.ss-rijen__rij { grid-template-columns: 1fr; }
}

/* Plekken per blok */
.ss-plekken { margin-top: 2rem; }
.ss-plekken__lijst { list-style: none; display: grid; gap: 0.6rem; }
@media (min-width: 36em) { .ss-plekken__lijst { grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr)); } }
.ss-plekken__item {
	display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline;
	gap: 0.25rem 0.75rem;
	padding: 0.75rem 1rem;
	border: 1px solid rgba(246, 239, 227, 0.35);
	border-radius: var(--radius);
	background: var(--polder-zacht);
}
.ss-plekken__moment { font-family: var(--font-display); font-weight: 800; font-size: 1.15rem; }
.ss-plekken__status { font-size: 1.05rem; color: var(--ijsblauw); }
.ss-plekken__item.is-bijna .ss-plekken__status { color: #FFC9A8; font-weight: 700; }
.ss-plekken__item.is-vol { background: transparent; border-style: dashed; }
.ss-plekken__item.is-vol .ss-plekken__moment { text-decoration: line-through; text-decoration-thickness: 0.08em; color: var(--ijs-dof); }
.ss-plekken__item.is-vol .ss-plekken__status { font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; color: var(--ijsblauw); }

/* ---------- Secties ---------- */
.ss-sectie { padding-block: var(--sectie); }
.ss-sectie--wit { background: var(--wit); }
.ss-sectie--blauw { background: var(--polderblauw); color: var(--zand); }
.ss-sectie--blauw .ss-kop3 { color: var(--zand); }
.ss-sectie--blauw a { color: var(--zand); }
.ss-sectie--blauw a:hover { color: var(--krachtoranje); }

.ss-twee { display: grid; gap: 1.5rem; margin-top: 2rem; }
@media (min-width: 48em) { .ss-twee { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.ss-twee--breed { gap: 2.5rem; margin-top: 1rem; }
@media (min-width: 48em) { .ss-twee--breed { gap: 4rem; } }

.ss-kaart {
	background: var(--wit);
	border: 1px solid var(--lijn);
	border-radius: var(--radius-groot);
	padding: clamp(1.25rem, 4vw, 2rem);
}
.ss-kaart--zacht { background: var(--oranje-licht); border-color: #F1D3C2; }
.ss-kaart p:last-child { margin-bottom: 0; }

/* Aanmelden */
.ss-aanmelden { display: grid; gap: 2rem; }
@media (min-width: 60em) {
	.ss-aanmelden { grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); gap: 3rem; align-items: start; }
	.ss-aanmelden__bel { position: sticky; top: 7rem; }
}
.ss-belblok {
	background: var(--zand);
	border: 1px solid var(--lijn);
	border-radius: var(--radius-groot);
	padding: clamp(1.25rem, 4vw, 2rem);
}
.ss-belblok__kop { font-family: var(--font-display); font-weight: 800; font-size: 1.4rem; line-height: 1.2; color: var(--polderblauw); margin-bottom: 0.5rem; }
.ss-belblok__lijst { list-style: none; display: grid; gap: 0.75rem; margin-top: 1.25rem; }
.ss-belblok__lijst .ss-knop { font-size: 1.1rem; }
.ss-belblok__lijst .ss-knop span { min-width: 0; overflow-wrap: anywhere; }

/* Stappen */
.ss-stappen { list-style: none; display: grid; gap: 1.25rem; counter-reset: stap; }
@media (min-width: 52em) { .ss-stappen { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.ss-stappen__stap {
	background: var(--wit);
	border: 1px solid var(--lijn);
	border-radius: var(--radius-groot);
	padding: 1.5rem;
}
.ss-stappen__stap p { margin: 0; }
.ss-stappen__nummer {
	display: inline-grid; place-items: center;
	width: 2.75rem; height: 2.75rem; margin-bottom: 1rem;
	border-radius: 50%;
	background: var(--polderblauw); color: var(--zand);
	font: 900 1.3rem/1 var(--font-display);
}
.ss-vinklijst { list-style: none; display: grid; gap: 0.6rem; }
.ss-vinklijst li { display: flex; gap: 0.6rem; align-items: flex-start; }
.ss-vinklijst .ss-icoon { width: 1.5rem; height: 1.5rem; flex: none; color: var(--krachtoranje); margin-top: 0.15rem; }

/* Waarom */
.ss-feiten { display: grid; gap: 1.25rem; margin-top: 2rem; }
@media (min-width: 52em) { .ss-feiten { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.ss-feit {
	border-top: 0.25rem solid var(--krachtoranje);
	padding-top: 1.25rem;
}
.ss-feit p { color: var(--zand); }
.ss-bron { font-size: 1rem; color: var(--ijsblauw) !important; margin: 0; }
.ss-bron a { color: var(--ijsblauw); }

/* Prijzen */
.ss-prijzen { border-top: 1px solid var(--lijn); }
.ss-prijzen__rij {
	display: grid;
	grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) minmax(0, 1fr);
	gap: 0.5rem;
	align-items: baseline;
	padding-block: 0.9rem;
	border-bottom: 1px solid var(--lijn);
}
.ss-prijzen__rij--kop { font-family: var(--font-display); font-weight: 700; font-size: 0.95rem; color: var(--oranje-tekst); letter-spacing: 0.04em; }
.ss-prijzen__rij [role="rowheader"] { font-weight: 700; }
.ss-prijs { font-family: var(--font-display); font-weight: 900; font-size: 1.6rem; color: var(--polderblauw); }

.ss-uitgelicht {
	margin-top: 3rem;
	padding: clamp(1.5rem, 4vw, 2.5rem);
	border-radius: var(--radius-groot);
	background: var(--zand);
	border-left: 0.4rem solid var(--krachtoranje);
}
.ss-uitgelicht__groot { font-family: var(--font-display); font-weight: 900; font-size: clamp(1.6rem, 4vw, 2.2rem); line-height: 1.1; color: var(--polderblauw); margin-bottom: 0.75rem; }

/* Over Sven */
.ss-sven { display: grid; gap: 2rem; align-items: start; }
@media (min-width: 52em) { .ss-sven { grid-template-columns: minmax(0, 22rem) minmax(0, 1fr); gap: 4rem; } }
.ss-sven__img { width: 100%; height: auto; border-radius: var(--radius-groot); object-fit: cover; aspect-ratio: 4 / 5; }
.ss-sven__monogram {
	aspect-ratio: 4 / 5;
	max-width: 22rem;
	border-radius: var(--radius-groot);
	background: var(--polderblauw);
	display: grid; place-items: center;
}
.ss-sven__monogram span { font: 900 clamp(4rem, 15vw, 7rem)/1 var(--font-display); color: var(--zand); letter-spacing: -0.04em; }
.ss-sven__monogram span::after { content: "."; color: var(--krachtoranje); }
.ss-sven__titel { font-family: var(--font-display); font-weight: 700; font-size: 1.2rem; color: var(--oranje-tekst); margin-top: -0.5rem; }
.ss-sven__contact { display: flex; flex-wrap: wrap; gap: 0.75rem; margin-top: 1.5rem; }

/* Vragen */
.ss-vragen { border-top: 1px solid var(--lijn); }
.ss-vraag { border-bottom: 1px solid var(--lijn); }
.ss-vraag summary {
	display: flex; justify-content: space-between; align-items: center; gap: 1rem;
	min-height: 3.5rem; padding-block: 1rem;
	font-family: var(--font-display); font-weight: 800; font-size: 1.25rem; line-height: 1.3;
	color: var(--polderblauw);
	cursor: pointer; list-style: none;
}
.ss-vraag summary::-webkit-details-marker { display: none; }
.ss-vraag summary > span { min-width: 0; }
.ss-vraag summary::after {
	content: "+"; flex: none;
	display: grid; place-items: center;
	width: 2.25rem; height: 2.25rem; border-radius: 50%;
	background: var(--zand); color: var(--polderblauw);
	font-size: 1.5rem; font-weight: 700;
}
.ss-vraag[open] summary::after { content: "−"; background: var(--polderblauw); color: var(--zand); }
.ss-vraag p { padding-bottom: 1.25rem; margin: 0; max-width: 40em; }

/* ---------- Voet ---------- */
.ss-voet { background: var(--polder-diep); color: var(--zand); padding-block: 3rem 1.5rem; font-size: 1.1rem; }
.ss-voet a { color: var(--zand); }
.ss-voet a:hover { color: var(--krachtoranje); }
.ss-voet__raster { display: grid; gap: 2rem; }
@media (min-width: 48em) { .ss-voet__raster { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) minmax(0, 1fr); } }
.ss-voet__merk img { width: min(15rem, 70vw); margin-bottom: 1rem; }
.ss-voet__lijst { list-style: none; display: grid; gap: 0.4rem; }
.ss-voet__lijst a { overflow-wrap: anywhere; }
.ss-voet__klein { color: var(--ijs-dof); font-size: 1rem; }
.ss-voet__onder { margin: 2.5rem 0 0; padding-top: 1.25rem; border-top: 1px solid rgba(246, 239, 227, 0.2); color: var(--ijs-dof); font-size: 1rem; }

/* ---------- Losse pagina's ---------- */
.ss-artikel + .ss-artikel { margin-top: 3rem; padding-top: 3rem; border-top: 1px solid var(--lijn); }
.ss-artikel .ss-tekst { max-width: 42em; }
.ss-artikel h2 a { text-decoration: none; }
.nav-links { display: flex; gap: 1rem; margin-top: 2rem; }

/* ==========================================================================
   Ninja Forms: groot, duidelijk en in de huisstijl.
   Alles binnen .ss-form, zodat het thema andere formulieren niet raakt.
   ========================================================================== */
.ss-form { min-width: 0; }
.ss-form .nf-form-cont { font-family: var(--font-tekst); font-size: 1.2rem; color: var(--inkt); }
.ss-form .nf-form-cont *, .ss-form .nf-field-label label { max-width: 100%; }
.ss-form .nf-form-title h3 { display: none; }              /* de sectiekop zegt het al */
.ss-form .nf-form-fields-required {
	font-size: 1.05rem; color: var(--inkt-zacht); margin-bottom: 1.25rem;
}
.ss-form .ninja-forms-req-symbol { color: var(--fout); font-weight: 700; }
.ss-form .nf-field-container { margin-bottom: 1.5rem; }
.ss-form .nf-field-label,
.ss-form .nf-field-label label,
.ss-form .nf-field-label .nf-label-span {
	font-family: var(--font-display);
	font-weight: 800;
	font-size: 1.2rem;
	line-height: 1.3;
	color: var(--polderblauw);
	margin-bottom: 0.5rem;
}
.ss-form .nf-field-description { font-size: 1.05rem; color: var(--inkt-zacht); margin-bottom: 0.5rem; }
.ss-form .nf-field-description p { margin: 0 0 0.25rem; }

.ss-form .nf-form-cont input.ninja-forms-field:not([type="radio"]):not([type="checkbox"]):not([type="submit"]):not([type="button"]),
.ss-form .nf-form-cont select.ninja-forms-field,
.ss-form .nf-form-cont textarea.ninja-forms-field,
.ss-form .nf-element:not([type="radio"]):not([type="checkbox"]):not([type="submit"]):not([type="button"]) {
	width: 100%;
	min-height: 3.25rem;             /* 52px */
	padding: 0.6rem 0.9rem;
	border: 0.15rem solid #8C8577;   /* 3:1 contrast tegen wit */
	border-radius: var(--radius);
	background: var(--wit);
	color: var(--inkt);
	font: 400 1.25rem/1.3 var(--font-tekst);
	box-shadow: none;
}
.ss-form .nf-form-cont textarea.ninja-forms-field { min-height: 7rem; resize: vertical; }
.ss-form .nf-form-cont .ninja-forms-field:focus,
.ss-form .nf-element:focus {
	border-color: var(--polderblauw);
	outline: 0.2rem solid var(--krachtoranje);
	outline-offset: 0.1rem;
}

/* Keuzerondjes en vinkjes als grote, aanklikbare kaarten */
.ss-form .list-radio-wrap ul,
.ss-form .listradio-wrap ul,
.ss-form .list-checkbox-wrap ul,
.ss-form .listcheckbox-wrap ul {
	list-style: none !important;
	margin: 0 !important;
	padding: 0 !important;
	display: grid;
	gap: 0.6rem;
}
@media (min-width: 64em) {
	.ss-form .list-radio-wrap ul,
	.ss-form .listradio-wrap ul { grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr)); }
}
.ss-form .list-radio-wrap li,
.ss-form .listradio-wrap li,
.ss-form .list-checkbox-wrap li,
.ss-form .listcheckbox-wrap li {
	position: relative;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}
.ss-form .list-radio-wrap li input,
.ss-form .listradio-wrap li input,
.ss-form .list-checkbox-wrap li input,
.ss-form .listcheckbox-wrap li input {
	position: absolute;
	left: 1rem;
	top: 50%;
	transform: translateY(-50%);
	width: 1.5rem;
	height: 1.5rem;
	margin: 0;
	accent-color: var(--polderblauw);
	cursor: pointer;
}
.ss-form .list-radio-wrap li label,
.ss-form .listradio-wrap li label,
.ss-form .list-checkbox-wrap li label,
.ss-form .listcheckbox-wrap li label {
	display: flex !important;
	align-items: center;
	min-height: 3.75rem;
	margin: 0 !important;
	padding: 0.75rem 1rem 0.75rem 3.25rem !important;
	border: 0.15rem solid var(--lijn);
	border-radius: var(--radius);
	background: var(--wit);
	font-family: var(--font-tekst);
	font-weight: 700;
	font-size: 1.2rem;
	line-height: 1.3;
	color: var(--inkt);
	cursor: pointer;
	width: 100%;
	min-width: 0;
	overflow-wrap: anywhere;
}
.ss-form .list-radio-wrap li label:hover,
.ss-form .listradio-wrap li label:hover,
.ss-form .list-checkbox-wrap li label:hover,
.ss-form .listcheckbox-wrap li label:hover { border-color: var(--polderblauw); }
.ss-form li input:checked + label,
.ss-form li label.nf-checked-label {
	border-color: var(--polderblauw);
	background: var(--ijsblauw);
	box-shadow: inset 0 0 0 0.1rem var(--polderblauw);
}
.ss-form li input:focus-visible + label { outline: 0.25rem solid var(--krachtoranje); outline-offset: 0.15rem; }
.ss-form li input:disabled + label { opacity: 0.55; cursor: not-allowed; text-decoration: line-through; }

/* Losse checkbox (bijv. toestemming) */
.ss-form .checkbox-wrap .nf-field-element,
.ss-form .checkbox-container .nf-field-element { display: inline-block; }
.ss-form .checkbox-wrap input[type="checkbox"] { width: 1.5rem; height: 1.5rem; accent-color: var(--polderblauw); }
.ss-form .checkbox-wrap .nf-field-label label { font-family: var(--font-tekst); font-weight: 400; font-size: 1.15rem; color: var(--inkt); }

/* Verzendknop */
.ss-form .submit-wrap input[type="submit"],
.ss-form .submit-wrap input[type="button"],
.ss-form .submit-wrap button {
	width: 100%;
	min-height: 3.75rem;
	padding: 0.75rem 1.5rem;
	border: 0;
	border-radius: var(--radius);
	background: var(--krachtoranje);
	color: var(--inkt);
	font: 800 1.3rem/1.2 var(--font-display);
	cursor: pointer;
	white-space: normal;
}
@media (min-width: 36em) {
	.ss-form .submit-wrap input[type="submit"],
	.ss-form .submit-wrap input[type="button"],
	.ss-form .submit-wrap button { width: auto; min-width: 18rem; }
}
.ss-form .submit-wrap input:hover { background: #F07A45; }
.ss-form .submit-wrap input:disabled { opacity: 0.6; cursor: wait; }

/* Foutmeldingen */
.ss-form .nf-error-msg,
.ss-form .nf-error-wrap .nf-error-msg,
.ss-form .nf-form-errors .nf-error-msg {
	display: block;
	margin-top: 0.5rem;
	padding: 0.6rem 0.9rem;
	border-left: 0.3rem solid var(--fout);
	background: var(--fout-licht);
	color: var(--fout);
	font-weight: 700;
	font-size: 1.1rem;
}
.ss-form .nf-error .ninja-forms-field,
.ss-form .nf-error.field-wrap .nf-field-element input,
.ss-form .nf-error.field-wrap .nf-field-element select,
.ss-form .nf-error.field-wrap .nf-field-element textarea { border-color: var(--fout) !important; }
.ss-form .nf-error .nf-field-element::after { display: none; }   /* standaard rode kruisjes weg */
.ss-form .nf-pass .nf-field-element::after { display: none; }

/* Bevestiging na verzenden */
.ss-form .nf-response-msg {
	padding: 1.5rem;
	border-radius: var(--radius-groot);
	background: var(--ijsblauw);
	border-left: 0.4rem solid var(--polderblauw);
	font-size: 1.25rem;
}
.ss-form .nf-response-msg p:last-child { margin-bottom: 0; }
.ss-form .nf-response-msg strong { font-family: var(--font-display); color: var(--polderblauw); }

/* Ninja Forms laadt soms een spinner: niet laten bewegen bij "minder beweging" */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
}

/* ---------- Afdrukken ---------- */
@media print {
	body { background: #fff; font-size: 12pt; }
	.ss-kop__menuknop, .ss-menu, .ss-skiplink, .ss-hero__acties, .ss-aanmelden__formulier { display: none !important; }
	.ss-kop { position: static; border: 0; }
	.ss-hero, .ss-sectie--blauw, .ss-voet { background: #fff !important; color: #000 !important; }
	.ss-hero *, .ss-sectie--blauw *, .ss-voet * { color: #000 !important; }
	.ss-vraag p { display: block; }
	a[href^="http"]::after { content: " (" attr(href) ")"; font-size: 9pt; }
}

/* Plugin SeniorSterk Aanmelden: meldingen en bedankbericht */
.ss-form .ssa-melding { background: var(--oranje-licht, #FCF4EE); border-left: 4px solid var(--krachtoranje, #E2632B); padding: 1rem 1.25rem; margin: 0 0 1.5rem; font-size: 1.15rem; }
.ss-form .nf-response-msg { background: var(--wit, #fff); border: 2px solid var(--polderblauw, #1C3D6E); border-radius: 12px; padding: 1.5rem; font-size: 1.2rem; }
.ss-form .nf-response-msg p { margin: 0 0 .75rem; }
.ss-form .ssa-bedankt-kop { font-size: 1.4rem; color: var(--polderblauw, #1C3D6E); }
.ss-form .ssa-belblok { background: var(--zand, #F6EFE3); border-radius: 12px; padding: 1.5rem; font-size: 1.15rem; }
.ss-form .ssa-belknop { display: inline-block; background: var(--polderblauw, #1C3D6E); color: #fff; padding: .8rem 1.25rem; border-radius: 10px; font-weight: 700; text-decoration: none; }
.ss-form .nf-form-errors .nf-error-msg, .ss-form .nf-before-form-content + .nf-form-errors { font-size: 1.15rem; }