/* Ondernemersfonds Wielwijk - aanvullende stijlen */

html { scroll-behavior: smooth; }
:where(section, .wp-block-group)[id] { scroll-margin-top: 90px; }

/* Header plakt bovenaan */
.wp-site-blocks > header.wp-block-template-part {
	position: sticky;
	top: 0;
	z-index: 50;
	background: #fff;
	box-shadow: 0 1px 0 rgba(18, 49, 87, 0.08);
}
.admin-bar .wp-site-blocks > header.wp-block-template-part { top: 32px; }
@media (max-width: 782px) { .admin-bar .wp-site-blocks > header.wp-block-template-part { top: 0; } }

/* Kleurstreep in de huisstijl */
.ofw-streep {
	height: 6px;
	background: linear-gradient(90deg, #123157 0 33.3%, #16A9A6 33.3% 66.6%, #5DB142 66.6% 100%);
}

/* Label boven koppen */
.ofw-label {
	text-transform: uppercase;
	letter-spacing: 0.12em;
	font-weight: 700;
	font-size: 0.8rem !important;
}

/* Kaart-stijl voor groepen */
.wp-block-group.is-style-kaart {
	background: #fff;
	border-radius: 16px;
	box-shadow: 0 10px 30px -12px rgba(11, 33, 61, 0.18);
	height: 100%;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.wp-block-group.is-style-kaart:hover {
	transform: translateY(-3px);
	box-shadow: 0 16px 36px -14px rgba(11, 33, 61, 0.28);
}
.wp-block-column > .wp-block-group.is-style-kaart { height: 100%; }

/* Icoonbolletje in kaarten */
.ofw-icoon {
	width: 52px;
	height: 52px;
	border-radius: 50%;
	display: flex !important;
	align-items: center;
	justify-content: center;
	font-size: 1.5rem !important;
	line-height: 1 !important;
	padding: 0 !important;
	box-sizing: border-box;
	margin-bottom: 0.25rem;
}

/* Hero */
.ofw-hero .wp-block-cover__inner-container { max-width: 1180px; }
.ofw-hero h1 { color: #fff; }

/* Geen witruimte tussen header, inhoud en footer */
.wp-site-blocks > main,
.wp-site-blocks > footer { margin-block-start: 0; }
main > .wp-block-group.alignfull:first-child,
.wp-site-blocks > main { margin-block-start: 0; }
main.wp-block-group > .alignfull + .alignfull { margin-block-start: 0; }

/* Tweede knop: omlijnd */
.wp-block-button.is-style-outline > .wp-block-button__link {
	border: 2px solid currentColor;
	background: transparent;
	color: #123157;
}
.wp-block-button.is-style-outline > .wp-block-button__link:hover {
	background: #123157;
	border-color: #123157;
	color: #fff;
}
/* Knoppen op donkere achtergrond: lichte hover */
.ofw-hero .wp-block-button:not(.is-style-outline) > .wp-block-button__link:hover,
.has-donkerblauw-background-color .wp-block-button > .wp-block-button__link:hover {
	background: #fff;
	color: #123157;
}
.ofw-hero .wp-block-button.is-style-outline > .wp-block-button__link { color: #fff; }
.ofw-hero .wp-block-button.is-style-outline > .wp-block-button__link:hover {
	background: #fff;
	color: #123157;
}

/* Veelgestelde vragen */
.wp-block-details {
	border: 1px solid rgba(18, 49, 87, 0.12);
}
.wp-block-details summary {
	font-weight: 700;
	color: #123157;
	cursor: pointer;
}
.wp-block-details[open] summary { margin-bottom: 0.5rem; }

/* Nieuwsoverzicht */
.ofw-nieuws .wp-block-post {
	background: #fff;
	border-radius: 16px;
	overflow: hidden;
	box-shadow: 0 10px 30px -12px rgba(11, 33, 61, 0.18);
	display: flex;
	flex-direction: column;
}
.ofw-nieuws .wp-block-post-featured-image { margin: 0; }
.ofw-nieuws .wp-block-post-featured-image img { aspect-ratio: 16 / 10; object-fit: cover; }
.ofw-nieuws .ofw-nieuws-tekst { padding: 1.25rem 1.5rem 1.5rem; }

/* Footer */
.ofw-footer a { color: #fff; text-decoration: none; }
.ofw-footer a:hover { color: #7FD8D5; text-decoration: underline; }

/* Toegankelijkheid: zichtbare focus */
a:focus-visible,
button:focus-visible,
summary:focus-visible,
.wp-block-button__link:focus-visible {
	outline: 3px solid #16A9A6;
	outline-offset: 3px;
}

/* Mobiel */
@media (max-width: 600px) {
	.ofw-header-knop { display: none !important; }
}
@media (max-width: 480px) {
	.wp-site-blocks > header .wp-block-site-title + p { display: none; }
}

/* Lange e-mailadressen netjes laten afbreken */
.ofw-contactkaart p,
.ofw-footer p { overflow-wrap: anywhere; }
.ofw-contactkaart .ofw-regel-label {
	display: block;
	font-size: 0.8rem;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: #7FD8D5;
	font-weight: 700;
}
