/*
Theme Name: Symmachia
Description: Block theme voor volleybalvereniging De Moriaan Symmachia Roosendaal.
Version: 1.0.1
Requires at least: 6.9
Requires PHP: 8.1
Text Domain: symmachia
*/

/* ---------- Basis ---------- */

.wp-site-blocks > * + *,
.wp-block-post-content > .sym-section,
.sym-main > * + * {
	margin-block-start: 0;
}

.sym-eyebrow {
	margin: 0;
	font-family: var(--wp--preset--font-family--barlow-condensed);
	font-weight: 700;
	font-size: 20px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--wp--preset--color--groen);
}

.sym-muted { color: var(--wp--preset--color--grijs); }
.sym-accent { color: var(--wp--preset--color--groen); }

/* Pijl-links: "Volledig programma →" */
.sym-links {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
	margin: 0;
	font-weight: 600;
	font-size: 15px;
}
.sym-links a:first-child { color: var(--wp--preset--color--groen); }

/* ---------- Knoppen ---------- */

/* Eén hoogte voor alle knopstijlen (core "Outline" voegt anders eigen padding toe) */
.wp-block-button .wp-block-button__link {
	box-sizing: border-box;
	min-height: 52px;
	display: inline-flex;
	align-items: center;
	padding: 0 26px;
}
.wp-block-button.is-style-outline .wp-block-button__link {
	background: transparent;
	color: inherit;
	border-color: currentColor;
	font-weight: 600;
}
.wp-block-button.is-style-subtle .wp-block-button__link {
	background: transparent;
	color: inherit;
	border-color: var(--wp--preset--color--rand-licht);
	font-weight: 600;
}
.wp-block-button.is-style-dark .wp-block-button__link {
	background: var(--wp--preset--color--zwart);
	border-color: var(--wp--preset--color--zwart);
	color: var(--wp--preset--color--wit);
}
.wp-block-button.sym-btn-small .wp-block-button__link { min-height: 44px; padding: 0 20px; font-size: 15px; }

/* ---------- Header ---------- */

.sym-header {
	position: sticky;
	top: var(--wp-admin--admin-bar--height, 0);
	z-index: 50;
	border-bottom: 1px solid var(--wp--preset--color--rand);
}
/* Achtergrond + blur op een eigen laag: backdrop-filter op de header zelf zou het
   mobiele menu (position: fixed) opsluiten binnen de hoogte van de header. */
.sym-header::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: rgba(11, 11, 12, 0.94);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
}
.sym-header__inner {
	max-width: 1200px;
	margin: 0 auto;
	padding: 14px 24px;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
}
.sym-brand { display: flex; align-items: center; gap: 12px; }
.sym-brand:hover { text-decoration: none; }
.sym-brand__text { display: flex; flex-direction: column; line-height: 1; }
.sym-brand__small {
	font-family: var(--wp--preset--font-family--barlow-condensed);
	font-weight: 600;
	font-size: 13px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--wp--preset--color--grijs);
}
.sym-brand__big {
	font-family: var(--wp--preset--font-family--barlow-condensed);
	font-weight: 800;
	font-size: 26px;
	letter-spacing: 0.02em;
	text-transform: uppercase;
}
.sym-header .wp-block-navigation { font-size: 15px; font-weight: 500; gap: 4px 24px; }
.sym-header .wp-block-navigation__responsive-container.is-menu-open {
	background: var(--wp--preset--color--zwart);
	color: var(--wp--preset--color--wit);
	font-size: 22px;
}
.sym-header .wp-block-buttons { margin: 0; }

/* ---------- Secties ---------- */

.sym-section { padding-top: 80px; padding-bottom: 80px; }
.sym-section--dark { background: var(--wp--preset--color--zwart); }
.sym-section--night { background: var(--wp--preset--color--nacht); }
.sym-section--light { background: var(--wp--preset--color--licht); color: var(--wp--preset--color--zwart); }
.sym-section--green { background: var(--wp--preset--color--groen); color: var(--wp--preset--color--zwart); padding-top: 64px; padding-bottom: 64px; }
.sym-section--bordered { border-bottom: 1px solid var(--wp--preset--color--rand); }

.sym-section-head {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: flex-end;
	gap: 16px;
}
.sym-section-head > * { margin: 0; }
.sym-section--light .sym-eyebrow { color: var(--wp--preset--color--donker); font-size: 18px; }

/* ---------- Hero ---------- */

.sym-hero { padding-top: 72px; }
.sym-hero__grid { align-items: center; }
.sym-hero__text { display: flex; flex-direction: column; gap: 24px; }
.sym-hero__text > * { margin: 0 !important; }
.sym-hero__lead { font-size: 20px; line-height: 1.5; color: var(--wp--preset--color--zacht); max-width: 520px; }
.sym-hero__media {
	position: relative;
	margin: 0;
	border-radius: 24px;
	border: 1px solid #2A2B2E;
	overflow: hidden; /* clips the stripes to the rounded corners */
}
.sym-hero__media img {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
}
/* The two green stripes from the design, stretched over the photo (preserveAspectRatio none).
   The paths run past both edges so the rounded frame clips them: no visible line ends. */
.sym-hero__media::after {
	content: "";
	position: absolute;
	inset: 0;
	background: var(--wp--preset--color--groen);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 300' preserveAspectRatio='none'%3E%3Cpath d='M-40 346 L440 214' stroke='%23000' stroke-width='18' opacity='0.7'/%3E%3Cpath d='M-40 71 L440 -61' stroke='%23000' stroke-width='4' opacity='0.4'/%3E%3C/svg%3E") 0 0 / 100% 100% no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 300' preserveAspectRatio='none'%3E%3Cpath d='M-40 346 L440 214' stroke='%23000' stroke-width='18' opacity='0.7'/%3E%3Cpath d='M-40 71 L440 -61' stroke='%23000' stroke-width='4' opacity='0.4'/%3E%3C/svg%3E") 0 0 / 100% 100% no-repeat;
	pointer-events: none;
}

/* ---------- Kaarten (wedstrijden / agenda) ---------- */

.sym-panel {
	background: var(--wp--preset--color--zwart);
	border: 1px solid var(--wp--preset--color--rand);
	border-radius: 20px;
	padding: 28px;
	display: flex;
	flex-direction: column;
	gap: 20px;
}
.sym-panel > * { margin: 0 !important; }
.sym-panel h2 { font-size: var(--wp--preset--font-size--x-large); }
.sym-panel__head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 8px; }
.sym-panel__head > * { margin: 0; }
.sym-live { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; color: var(--wp--preset--color--grijs); }
.sym-live::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--wp--preset--color--groen); }

.sym-matches > * { margin: 0 !important; }
.sym-match {
	display: grid;
	grid-template-columns: 110px 1fr;
	gap: 16px;
	padding: 16px 0;
	border-top: 1px solid var(--wp--preset--color--rand);
}
.sym-match:last-child { border-bottom: 1px solid var(--wp--preset--color--rand); }
.sym-match > * { margin: 0 !important; display: flex; flex-direction: column; gap: 2px; }
.sym-match p { margin: 0; }
.sym-match__when p:first-child { font-weight: 700; color: var(--wp--preset--color--groen); }
.sym-match__what p:first-child { font-weight: 600; }
.sym-match p + p { font-size: 14px; color: var(--wp--preset--color--grijs); }

/* Agenda (blok uit symmachia-club) */
.sym-agenda { display: flex; flex-direction: column; gap: 12px; list-style: none; margin: 0; padding: 0; }
.sym-agenda__item { display: flex; gap: 16px; align-items: center; }
.sym-agenda__date {
	flex: 0 0 64px;
	height: 64px;
	border-radius: 14px;
	background: var(--wp--preset--color--tegel);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	line-height: 1;
}
.sym-agenda__day { font-family: var(--wp--preset--font-family--barlow-condensed); font-weight: 800; font-size: 28px; }
.sym-agenda__month { font-size: 12px; font-weight: 700; text-transform: uppercase; color: var(--wp--preset--color--grijs); }
.sym-agenda__item:first-child .sym-agenda__date { background: var(--wp--preset--color--groen); color: var(--wp--preset--color--zwart); }
.sym-agenda__item:first-child .sym-agenda__month { color: inherit; }
.sym-agenda__body { display: flex; flex-direction: column; gap: 2px; }
.sym-agenda__title { font-weight: 600; }
.sym-agenda__meta { font-size: 14px; color: var(--wp--preset--color--grijs); }
.sym-agenda__empty { color: var(--wp--preset--color--grijs); margin: 0; }

/* ---------- Nieuws ---------- */

.sym-news .wp-block-post-template { gap: 24px; }
.sym-news .wp-block-post {
	background: var(--wp--preset--color--puur-wit);
	border-radius: 20px;
	overflow: hidden;
	display: flex;
	flex-direction: column;
}
.sym-news .wp-block-post-featured-image { margin: 0; aspect-ratio: 16 / 9; background: var(--wp--preset--color--zwart); }
.sym-news .wp-block-post-featured-image img { width: 100%; height: 100%; object-fit: cover; }
.sym-news__body { padding: 24px; display: flex; flex-direction: column; gap: 10px; }
.sym-news__body > * { margin: 0 !important; }
.sym-news .wp-block-post-date { font-size: 13px; font-weight: 600; color: var(--wp--preset--color--meta); }
.sym-news .wp-block-post-title {
	font-family: var(--wp--preset--font-family--inter);
	text-transform: none;
	font-weight: 700;
	font-size: 21px;
	line-height: 1.3;
}
.sym-news .wp-block-post-excerpt { font-size: 15px; line-height: 1.55; color: var(--wp--preset--color--donker); }
.sym-news .wp-block-post-excerpt__excerpt { margin: 0; }

/* ---------- Aanbod ---------- */

.sym-offer-card {
	position: relative;
	background: var(--wp--preset--color--kaart);
	border: 1px solid var(--wp--preset--color--rand);
	border-radius: 20px;
	padding: 28px;
	min-height: 200px;
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.sym-offer-card > * { margin: 0 !important; }
.sym-offer-card h3 { font-size: 28px; }
.sym-offer-card p { font-size: 15px; line-height: 1.5; color: var(--wp--preset--color--zacht); }
.sym-offer-card .sym-offer-card__link { margin-top: auto !important; font-weight: 600; color: var(--wp--preset--color--groen); }
/* Hele kaart klikbaar via de link onderaan */
.sym-offer-card .sym-offer-card__link a::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.sym-offer-card.is-style-highlight { background: var(--wp--preset--color--groen); border-color: var(--wp--preset--color--groen); color: var(--wp--preset--color--zwart); }
.sym-offer-card.is-style-highlight p,
.sym-offer-card.is-style-highlight .sym-offer-card__link { color: var(--wp--preset--color--zwart); font-weight: 500; }
.sym-offer-card.is-style-highlight .sym-offer-card__link { font-weight: 700; }

/* ---------- Lid worden ---------- */

.sym-cta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 24px; }
.sym-cta__text { max-width: 640px; display: flex; flex-direction: column; gap: 10px; }
.sym-cta__text > * { margin: 0 !important; }
.sym-cta__text h2 { font-size: clamp(40px, 6vw, 56px); line-height: 0.95; }
.sym-cta__text p { font-size: 18px; font-weight: 500; }
.sym-cta .wp-block-buttons { margin: 0; }

/* ---------- Sponsoren ---------- */

.sym-sponsors { display: flex; flex-direction: column; gap: 20px; }
.sym-sponsors__main { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 20px; }
.sym-sponsors__rest { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px; }
.sym-sponsor {
	background: var(--wp--preset--color--puur-wit);
	border-radius: 20px;
	min-height: 140px;
	padding: 20px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 6px;
	text-align: center;
}
.sym-sponsor--small { min-height: 120px; border-radius: 16px; }
.sym-sponsor__label { font-size: 12px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--wp--preset--color--meta); }
.sym-sponsor__name { font-size: 26px; font-weight: 700; }
.sym-sponsor--small .sym-sponsor__name { font-size: 17px; font-weight: 600; }
/* Every logo scales to fit the same box (up or down), so they look equally big. */
.sym-sponsor .sym-sponsor__logo { display: block; width: min(80%, 340px); height: 110px; object-fit: contain; }
.sym-sponsor--small .sym-sponsor__logo { width: min(85%, 220px); height: 72px; }

.sym-tile {
	background: var(--wp--preset--color--puur-wit);
	border-radius: 16px;
	padding: 20px;
	margin: 0;
	font-weight: 600;
	position: relative;
}
.sym-tile a::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.sym-underline a { text-decoration: underline; font-weight: 600; }

/* ---------- Footer ---------- */

.sym-footer { border-top: 1px solid var(--wp--preset--color--rand); padding-top: 72px; padding-bottom: 40px; }
.sym-footer__col { display: flex; flex-direction: column; gap: 10px; }
.sym-footer__col > * { margin: 0 !important; }
.sym-footer__col p { font-size: 15px; line-height: 1.6; color: var(--wp--preset--color--zacht); }
.sym-footer__col .sym-footer__title {
	font-family: var(--wp--preset--font-family--barlow-condensed);
	font-weight: 800;
	font-size: 26px;
	text-transform: uppercase;
	line-height: 1;
	color: var(--wp--preset--color--wit);
}
.sym-footer__col .sym-footer__label {
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--wp--preset--color--groen);
}
.sym-footer__bottom {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 12px;
	padding-top: 24px;
	margin-top: 48px;
	border-top: 1px solid var(--wp--preset--color--rand);
	font-size: 13px;
	color: var(--wp--preset--color--grijs);
}
.sym-footer__bottom > * { margin: 0 !important; }

/* ---------- Gewone pagina's / berichten ---------- */

.sym-main { padding-top: 64px; padding-bottom: 80px; }
.sym-main .wp-block-post-content a { color: var(--wp--preset--color--groen); text-decoration: underline; }
.sym-archive .wp-block-post-template { gap: 24px; }
.sym-archive .wp-block-post {
	background: var(--wp--preset--color--kaart);
	border: 1px solid var(--wp--preset--color--rand);
	border-radius: 20px;
	overflow: hidden;
}
.sym-archive .wp-block-post-featured-image { margin: 0; }
.sym-archive .wp-block-post-title { font-family: var(--wp--preset--font-family--inter); text-transform: none; font-size: 21px; line-height: 1.3; }

.sym-header__inner > *,
.sym-cta > *,
.sym-section-head > div > * { margin: 0 !important; }
.sym-section-head > div { display: flex; flex-direction: column; gap: 8px; }

/* Nieuwsbericht zonder uitgelichte afbeelding: zwart vlak zoals in het ontwerp */
.sym-news .wp-block-post:not(:has(.wp-block-post-featured-image))::before {
	content: "";
	display: block;
	aspect-ratio: 16 / 9;
	background: var(--wp--preset--color--zwart);
}

/* ---------- Inschrijfformulier ---------- */

.sym-form { display: flex; flex-direction: column; gap: 24px; }
.sym-form__form { display: flex; flex-direction: column; gap: 24px; }
.sym-form__legend-note { margin: 0; font-size: 14px; color: var(--wp--preset--color--grijs); }
.sym-form__hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.sym-form__section {
	margin: 0;
	padding: 28px;
	background: var(--wp--preset--color--kaart);
	border: 1px solid var(--wp--preset--color--rand);
	border-radius: 20px;
	min-width: 0;
}
.sym-form__section > legend {
	float: left;
	width: 100%;
	padding: 0;
	margin-bottom: 20px;
	font-family: var(--wp--preset--font-family--barlow-condensed);
	font-weight: 800;
	font-size: 28px;
	text-transform: uppercase;
	line-height: 1;
}
.sym-form__section > legend + * { clear: both; }
.sym-form__intro { font-size: 15px; line-height: 1.6; color: var(--wp--preset--color--zacht); margin-bottom: 20px; }
.sym-form__intro > :first-child { margin-top: 0; }
.sym-form__intro > :last-child { margin-bottom: 0; }
.sym-form__intro ul { padding-left: 20px; }
.sym-form__intro a,
.sym-form__success a { color: var(--wp--preset--color--groen); text-decoration: underline; }

.sym-form__fields { display: grid; grid-template-columns: repeat(6, 1fr); gap: 20px 16px; }
.sym-form__field { grid-column: span 6; display: flex; flex-direction: column; gap: 6px; }
.sym-form__field.is-small { grid-column: span 2; }
@media (max-width: 600px) {
	.sym-form__section { padding: 20px; }
	.sym-form__field.is-small { grid-column: span 6; }
}
.sym-form__field fieldset { margin: 0; padding: 0; border: 0; min-width: 0; }
.sym-form__label { font-weight: 600; font-size: 15px; padding: 0; margin-bottom: 4px; }
.sym-form__req { color: var(--wp--preset--color--groen); }

.sym-form input[type="text"],
.sym-form input[type="email"],
.sym-form input[type="tel"],
.sym-form input[type="date"],
.sym-form select {
	width: 100%;
	box-sizing: border-box;
	min-height: 48px;
	padding: 10px 14px;
	font: inherit;
	color: var(--wp--preset--color--wit);
	background: var(--wp--preset--color--zwart);
	border: 1px solid var(--wp--preset--color--rand-licht);
	border-radius: 12px;
	color-scheme: dark;
}
.sym-form input:focus-visible,
.sym-form select:focus-visible,
.sym-form button:focus-visible {
	outline: 3px solid var(--wp--preset--color--groen);
	outline-offset: 2px;
}

.sym-form__choices { display: flex; flex-direction: column; gap: 8px; }
.sym-form__choices.is-inline { flex-direction: row; flex-wrap: wrap; }
.sym-form__choice {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	padding: 12px 14px;
	border: 1px solid var(--wp--preset--color--rand-licht);
	border-radius: 12px;
	background: var(--wp--preset--color--zwart);
	cursor: pointer;
	font-size: 15px;
	line-height: 1.4;
}
.sym-form__choice:has(input:checked) { border-color: var(--wp--preset--color--groen); }
.sym-form__choice input { flex: none; width: 20px; height: 20px; margin: 0; accent-color: var(--wp--preset--color--groen); }
.sym-form__choice.is-consent { font-weight: 600; }

.sym-form__help { margin: 0; font-size: 13px; color: var(--wp--preset--color--grijs); }
.sym-form__error { margin: 0; font-size: 14px; font-weight: 600; color: #FF8A80; }
.sym-form__field.has-error input,
.sym-form__field.has-error select,
.sym-form__field.has-error .sym-form__choice { border-color: #FF8A80; }

.sym-form__errors,
.sym-form__success {
	padding: 24px 28px;
	border-radius: 20px;
	border: 2px solid #FF8A80;
	background: #2A1716;
}
.sym-form__success { border-color: var(--wp--preset--color--groen); background: #1A2410; }
.sym-form__errors h2,
.sym-form__success h2 { margin: 0 0 12px; font-size: 28px; }
.sym-form__errors ul { margin: 0; padding-left: 20px; }
.sym-form__errors a { color: inherit; text-decoration: underline; }
.sym-form__success p { margin: 0 0 8px; }
.sym-form__testmode { font-size: 14px; color: var(--wp--preset--color--grijs); }
.sym-form button.wp-block-button__link { cursor: pointer; font-family: inherit; }

.sym-lead { font-size: 20px; line-height: 1.5; color: var(--wp--preset--color--zacht); }
.sym-main .wp-block-post-content a { overflow-wrap: anywhere; }
.sym-main .wp-block-post-content .sym-form__errors a { color: #FFD3CF; }
.sym-form__errors:focus,
.sym-form__success:focus { outline: 3px solid var(--wp--preset--color--wit); outline-offset: 3px; }

/* =========================================================
   Subpagina's
   ========================================================= */

.sym-page-hero { background: var(--wp--preset--color--zwart); border-bottom: 1px solid var(--wp--preset--color--rand); }
.sym-page-hero__inner { max-width: 1200px; margin: 0 auto; padding: 56px 24px 64px; display: flex; flex-direction: column; gap: 16px; }
.sym-page-hero__inner > * { margin: 0; }
.sym-page-hero__title {
	font-family: var(--wp--preset--font-family--barlow-condensed);
	font-weight: 800;
	text-transform: uppercase;
	line-height: 0.92;
	font-size: clamp(48px, 7vw, 88px);
	overflow-wrap: anywhere;
}
.sym-page-hero__lead { font-size: 20px; line-height: 1.5; color: var(--wp--preset--color--zacht); max-width: 640px; }
.sym-crumbs ol { display: flex; flex-wrap: wrap; gap: 4px 0; margin: 0; padding: 0; list-style: none; font-size: 14px; color: var(--wp--preset--color--grijs); }
.sym-crumbs li + li::before { content: "/"; margin: 0 10px; color: var(--wp--preset--color--rand-licht); }
.sym-crumbs a { color: var(--wp--preset--color--groen); }

.sym-page__content { padding-top: 64px; padding-bottom: 96px; }
.sym-page__content:has(> .alignfull:last-child) { padding-bottom: 0; }
.sym-page__content > .alignfull:last-child { margin-top: 80px; }
.sym-page__content > p,
.sym-page__content > ul,
.sym-page__content > ol { font-size: 17px; line-height: 1.65; color: var(--wp--preset--color--zacht); }
.sym-page__content > h2 { font-size: var(--wp--preset--font-size--x-large); margin-top: 56px; }
.sym-page__content > h3 { font-size: 26px; margin-top: 32px; }
.sym-page__content > h2:first-child,
.sym-page__content > h3:first-child { margin-top: 0; }
.sym-page__content li + li { margin-top: 6px; }
.sym-page__content a:where(:not(.wp-element-button)) { color: var(--wp--preset--color--groen); text-decoration: underline; text-underline-offset: 3px; overflow-wrap: anywhere; }
.sym-page__content strong { color: var(--wp--preset--color--wit); }
.sym-page__content .sym-lead { font-size: 21px; color: var(--wp--preset--color--wit); }

/* Kaartenraster (hergebruikt de aanbod-kaarten van de homepage) */
.sym-page__content .sym-offer-card a { text-decoration: none; }
.sym-page__content .sym-offer-card h3 { margin: 0; }
.sym-page__content .sym-offer-card ul { margin: 0; padding: 0; list-style: none; font-size: 15px; color: var(--wp--preset--color--zacht); }
.sym-page__content .sym-offer-card li { display: flex; justify-content: space-between; gap: 12px; padding: 8px 0; border-top: 1px solid var(--wp--preset--color--rand); margin: 0; }
.sym-page__content .sym-offer-card li strong { color: var(--wp--preset--color--wit); font-weight: 600; }

/* Infopaneel */
.sym-page__content .sym-panel { background: var(--wp--preset--color--kaart); }
.sym-panel h3 { font-size: 24px; }
.sym-panel p, .sym-panel li { font-size: 15px; line-height: 1.6; color: var(--wp--preset--color--zacht); }
.sym-panel ul { margin: 0; padding-left: 20px; }
.sym-panel .sym-footer__label { font-size: 13px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--wp--preset--color--groen); }

/* Personen */
.sym-person {
	background: var(--wp--preset--color--kaart);
	border: 1px solid var(--wp--preset--color--rand);
	border-radius: 20px;
	padding: 24px;
	display: flex;
	flex-direction: column;
	gap: 4px;
}
.sym-person > * { margin: 0 !important; }
.sym-person__role { font-size: 12px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--wp--preset--color--groen); }
.sym-person__name { font-size: 18px; font-weight: 600; }
.sym-person__mail { font-size: 15px; }
.sym-person__mail a { color: var(--wp--preset--color--zacht) !important; }

/* Documenten */
.sym-doc {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin: 0;
	padding: 18px 22px;
	background: var(--wp--preset--color--kaart);
	border: 1px solid var(--wp--preset--color--rand);
	border-radius: 16px;
	font-weight: 600;
}
.sym-page__content .sym-doc a { color: var(--wp--preset--color--wit); text-decoration: none; }
.sym-doc a::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.sym-doc:hover { border-color: var(--wp--preset--color--groen); }
.sym-doc em { font-style: normal; font-size: 12px; font-weight: 700; letter-spacing: 0.1em; color: var(--wp--preset--color--groen); flex: none; }

/* Afbeeldingen in content */
.sym-page__content .wp-block-image img { border-radius: 20px; }
.sym-page__content .wp-block-image figcaption { font-size: 14px; color: var(--wp--preset--color--grijs); }
.sym-single__image img { border-radius: 20px; width: 100%; }

/* Groene afsluiter */
.sym-page__content > .sym-section--green h2 { margin: 0; }

/* Paginering */
.sym-pagination { margin-top: 40px; font-weight: 600; }
.sym-pagination a { color: var(--wp--preset--color--groen); }

/* ---------- Submenu's ---------- */
.sym-header .wp-block-navigation .wp-block-navigation__submenu-container {
	background: var(--wp--preset--color--kaart);
	border: 1px solid var(--wp--preset--color--rand);
	border-radius: 14px;
	padding: 8px;
	min-width: 230px;
	color: var(--wp--preset--color--wit);
}
.sym-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content { padding: 8px 12px; border-radius: 8px; }
.sym-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover { background: var(--wp--preset--color--tegel); text-decoration: none; }
.sym-header .wp-block-navigation .current-menu-item > a,
.sym-header .wp-block-navigation .current-menu-ancestor > a { color: var(--wp--preset--color--groen); }
.sym-header .is-menu-open .wp-block-navigation__submenu-container { border: 0; padding: 0 0 0 16px; background: transparent; }

.sym-panel .sym-agenda { padding: 0; }

/* Containers: padding binnen de max-breedte houden */
.sym-header__inner,
.sym-page-hero__inner { box-sizing: border-box; }

/* Lopende tekst: leesbare breedte, links uitgelijnd op hetzelfde raster als de kaarten */
.sym-page__content > :is(p, ul, ol, h2, h3, h4, .wp-block-buttons, .sym-panel, .wp-block-image:not(.alignwide), .wp-block-post-content, .wp-block-symmachia-agenda) {
	max-width: 760px;
	margin-left: max(0px, calc((100% - 1152px) / 2)) !important;
	margin-right: auto !important;
}

/* Clublogo in de header: rond, en het hele merkblok is klikbaar via de tekstlink */
.sym-brand { position: relative; }
.sym-brand__logo { margin: 0; flex: none; }
.sym-brand__logo img { display: block; border-radius: 50%; }
.sym-brand__text::after { content: ""; position: absolute; inset: 0; }
.sym-brand__text:hover { text-decoration: none; }

/* =========================================================
   Lichte inhoud op subpagina's (zoals Clubnieuws/Sponsoren op de homepage)
   ========================================================= */

.sym-page__content {
	--sym-tekst: var(--wp--preset--color--donker);
	--sym-link: var(--wp--preset--color--groen-donker);
	--sym-kaart-rand: #E1E4DD;
	background: var(--wp--preset--color--licht);
	color: var(--wp--preset--color--zwart);
}
.sym-page__content > p,
.sym-page__content > ul,
.sym-page__content > ol { color: var(--sym-tekst); }
.sym-page__content .sym-lead,
.sym-page__content strong { color: var(--wp--preset--color--zwart); }
.sym-page__content a:where(:not(.wp-element-button)) { color: var(--sym-link); }

/* Kaarten, panelen, personen, documenten: wit op licht */
.sym-page__content :is(.sym-offer-card:not(.is-style-highlight), .sym-panel, .sym-person, .sym-doc) {
	background: var(--wp--preset--color--puur-wit);
	border-color: var(--sym-kaart-rand);
	color: var(--wp--preset--color--zwart);
}
.sym-page__content .sym-offer-card:not(.is-style-highlight) p,
.sym-page__content .sym-offer-card ul,
.sym-page__content .sym-panel :is(p, li) { color: var(--sym-tekst); }
.sym-page__content .sym-offer-card:not(.is-style-highlight) .sym-offer-card__link,
.sym-page__content .sym-offer-card:not(.is-style-highlight) .sym-offer-card__link a { color: var(--sym-link); }
.sym-page__content .sym-offer-card li { border-top-color: var(--sym-kaart-rand); }
.sym-page__content .sym-offer-card li strong { color: var(--wp--preset--color--zwart); }
.sym-page__content :is(.sym-person__role, .sym-panel .sym-footer__label, .sym-doc em) { color: var(--sym-link); }
.sym-page__content .sym-person__mail a { color: var(--sym-tekst) !important; }
.sym-page__content .sym-doc a { color: var(--wp--preset--color--zwart); }
.sym-page__content .sym-doc:hover { border-color: var(--sym-link); }
.sym-page__content .wp-block-image figcaption { color: var(--wp--preset--color--meta); }

/* Knoppen in lichte inhoud */
.sym-page__content > .wp-block-buttons .is-style-subtle .wp-block-button__link { border-color: #C9CCC5; }

/* Agenda (archiefpagina) */
.sym-page__content .sym-agenda__date { background: var(--wp--preset--color--puur-wit); border: 1px solid var(--sym-kaart-rand); }
.sym-page__content .sym-agenda__item:first-child .sym-agenda__date { border-color: var(--wp--preset--color--groen); }
.sym-page__content :is(.sym-agenda__month, .sym-agenda__meta, .sym-agenda__empty) { color: var(--wp--preset--color--meta); }
.sym-page__content .sym-agenda__item:first-child .sym-agenda__month { color: inherit; }
.sym-page__content a.sym-agenda__title { color: var(--wp--preset--color--zwart); }

/* Paginering en losse tekst in archieven */
.sym-page__content .sym-pagination a { color: var(--sym-link); }

/* Inschrijfformulier op licht */
.sym-page__content .sym-form__section { background: var(--wp--preset--color--puur-wit); border-color: var(--sym-kaart-rand); }
.sym-page__content :is(.sym-form__intro, .sym-form__legend-note) { color: var(--sym-tekst); }
.sym-page__content .sym-form__help { color: var(--wp--preset--color--meta); }
.sym-page__content .sym-form__req { color: var(--sym-link); }
.sym-page__content .sym-form :is(input[type="text"], input[type="email"], input[type="tel"], input[type="date"], select) {
	color: var(--wp--preset--color--zwart);
	background: var(--wp--preset--color--puur-wit);
	border-color: #B9BDB5;
	color-scheme: light;
}
.sym-page__content .sym-form__choice { background: var(--wp--preset--color--puur-wit); border-color: #C9CCC5; }
.sym-page__content .sym-form__choice:has(input:checked) { border-color: var(--sym-link); background: #F4FAEA; }
.sym-page__content .sym-form__choice input { accent-color: var(--sym-link); }
.sym-page__content .sym-form :is(input, select, button):focus-visible { outline-color: var(--sym-link); }
.sym-page__content .sym-form__error { color: #B3261E; }
.sym-page__content .sym-form__field.has-error :is(input, select, .sym-form__choice) { border-color: #B3261E; }
.sym-page__content .sym-form__errors { background: #FDECEA; border-color: #B3261E; color: #5C1410; }
.sym-page__content .sym-form__errors a,
.sym-main .wp-block-post-content .sym-page__content .sym-form__errors a { color: #5C1410; }
.sym-page__content .sym-form__success { background: #EEF7E0; border-color: var(--sym-link); color: var(--wp--preset--color--zwart); }
.sym-page__content .sym-form__success a { color: var(--sym-link); }
.sym-page__content .sym-form__testmode { color: var(--wp--preset--color--meta); }
.sym-page__content :is(.sym-form__errors, .sym-form__success):focus { outline-color: var(--wp--preset--color--zwart); }

/* Geen zwarte strook tussen paginakop en lichte inhoud */
.sym-page > * + * { margin-block-start: 0; }

/* Fotoparen op tekstbreedte, gelijke hoogte */
.sym-page__content > .sym-photos {
	max-width: 760px;
	margin-left: max(0px, calc((100% - 1152px) / 2)) !important;
	margin-right: auto !important;
}
.sym-photos .wp-block-image { margin: 0; }
.sym-photos .wp-block-image img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; }

/* Berichten: zelfde typografie als pagina's (inhoud zit hier één laag dieper) */
.sym-page__content > .wp-block-post-content > :is(p, ul, ol) { font-size: 17px; line-height: 1.65; color: var(--sym-tekst); }
.sym-page__content > .wp-block-post-content > h2 { font-size: var(--wp--preset--font-size--x-large); margin-top: 48px; }
.sym-page__content > .wp-block-post-content > h3 { font-size: 24px; margin-top: 32px; }
.sym-page__content > .wp-block-post-content li + li { margin-top: 6px; }
.sym-page__content > .wp-block-post-content .wp-block-image img,
.sym-page__content > .wp-block-post-content .wp-block-video video { border-radius: 20px; }
.sym-page__content > .sym-single__image { max-width: 760px; margin-left: max(0px, calc((100% - 1152px) / 2)) !important; margin-right: auto !important; }

/* Afbeeldingen in berichten */
.sym-inline-image img { max-width: 420px; width: 100%; }
.sym-qr img { max-width: 240px; border-radius: 12px !important; }
.sym-inline-logo img { max-width: 160px; border-radius: 0 !important; }
.wp-block-video video { width: 100%; background: var(--wp--preset--color--zwart); }
.sym-page__content > .wp-block-post-content > p.sym-lead { font-size: 21px; color: var(--wp--preset--color--zwart); }
.sym-single__image img { aspect-ratio: 3 / 2; object-fit: cover; object-position: center 30%; height: auto; }

/* Nieuwskaarten in lichte inhoud: titels zwart, zoals op de homepage */
.sym-page__content .sym-news .wp-block-post-title a { color: var(--wp--preset--color--zwart); text-decoration: none; }
.sym-page__content .sym-news .wp-block-post-title a:hover { text-decoration: underline; }

/* ---------- Mobiel menu (overlay) ---------- */
.sym-header .wp-block-navigation:not(.has-background) .wp-block-navigation__responsive-container.is-menu-open {
	background: var(--wp--preset--color--zwart);
	color: var(--wp--preset--color--wit);
	padding: 20px 24px 40px;
}
.sym-header .wp-block-navigation__responsive-container-close,
.sym-header .wp-block-navigation__responsive-container-open { color: var(--wp--preset--color--wit); }
.sym-header .wp-block-navigation__responsive-container-close svg,
.sym-header .wp-block-navigation__responsive-container-open svg { width: 30px; height: 30px; }
.sym-header .is-menu-open .wp-block-navigation__responsive-container-content { padding-top: 48px; gap: 4px; }
.sym-header .is-menu-open .wp-block-navigation__container { gap: 20px; }
.sym-header .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content {
	font-family: var(--wp--preset--font-family--barlow-condensed);
	font-weight: 800;
	font-size: 30px;
	line-height: 1.1;
	text-transform: uppercase;
	padding: 4px 0;
}
.sym-header .is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	font-size: 17px;
	color: var(--wp--preset--color--zacht);
	padding: 6px 0;
}
.sym-header .is-menu-open .wp-block-navigation-submenu__toggle { display: none; }