/*
Theme Name: Effectuate
Theme URI: https://effectuate.nl/
Author: Effectuate B.V.
Description: Licht blokthema voor Effectuate – document control en informatiebeheer. Geen page builder of slider-plugins nodig.
Version: 1.3.1
Requires at least: 6.5
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: effectuate
*/

/* ---------- Basis ---------- */
html { scroll-behavior: smooth; }
:where(section[id]) { scroll-margin-top: 90px; }

/* Kleine label-regel boven koppen (monospace) */
.eff-label {
	font-family: var(--wp--preset--font-family--mono);
	font-size: 0.82rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--wp--preset--color--accent);
	margin-bottom: 0.75rem !important;
}
.eff-code {
	font-family: var(--wp--preset--font-family--mono);
	font-size: 0.8rem;
	color: var(--wp--preset--color--accent);
}
.eff-muted { color: var(--wp--preset--color--muted); }
.eff-lead { font-size: 1.2rem; color: var(--wp--preset--color--muted); max-width: 600px; }

/* ---------- Header ---------- */
.eff-header {
	position: sticky;
	top: 0;
	z-index: 50;
	background: var(--wp--preset--color--base);
	border-bottom: 1px solid var(--wp--preset--color--line);
}
.admin-bar .eff-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .eff-header { top: 46px; } }
.eff-logo { margin: 0; font-weight: 700; font-size: 1.25rem; letter-spacing: -0.01em; }
.eff-logo a { color: var(--wp--preset--color--ink); text-decoration: none; display: inline-flex; align-items: center; gap: 10px; }
.eff-mark {
	display: inline-flex; align-items: center; justify-content: center;
	width: 34px; height: 34px; border-radius: 4px;
	background: var(--wp--preset--color--accent); color: #fff; font-size: 1.1rem;
}
.eff-header .wp-block-navigation a { color: var(--wp--preset--color--ink); text-decoration: none; }
.eff-header .wp-block-navigation a:hover { color: var(--wp--preset--color--accent); }

/* ---------- Secties ---------- */
.eff-section { padding-top: 96px; padding-bottom: 96px; }
.eff-soft { background: var(--wp--preset--color--soft); border-top: 1px solid var(--wp--preset--color--line); border-bottom: 1px solid var(--wp--preset--color--line); }
.eff-dark { background: var(--wp--preset--color--ink); color: #fff; }
.eff-dark .eff-label, .eff-dark .eff-code { color: #9DB4FF; }
.eff-dark .eff-muted { color: #C9D1E6; }
.eff-blue { background: var(--wp--preset--color--accent); color: #fff; }
.eff-blue a { color: #fff; }
.eff-blue .eff-label, .eff-blue .eff-muted { color: #DCE4FF; }
@media (max-width: 782px) { .eff-section { padding-top: 64px; padding-bottom: 64px; } }

/* Hero */
.eff-hero { padding-top: 88px; padding-bottom: 96px; }
.eff-hero h1 { font-size: clamp(2.2rem, 4.5vw, 3.4rem); line-height: 1.08; letter-spacing: -0.02em; }

/* Register-kaart in de hero */
.eff-register {
	background: var(--wp--preset--color--base);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 6px;
	box-shadow: 0 12px 32px rgba(11, 21, 51, 0.08);
	overflow: hidden;
}
.eff-register-head {
	padding: 14px 20px;
	border-bottom: 1px solid var(--wp--preset--color--line);
	font-family: var(--wp--preset--font-family--mono);
	font-size: 0.8rem;
	color: var(--wp--preset--color--muted);
}
.eff-register-head p { margin: 0; }
.eff-row { padding: 12px 20px; border-bottom: 1px solid #EDF0F6; gap: 16px !important; flex-wrap: nowrap !important; }
.eff-row:last-child { border-bottom: 0; }
.eff-row p { margin: 0; }
.eff-row .eff-code { width: 48px; flex: none; padding-top: 3px; }

/* Kaarten */
.eff-card {
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 6px;
	padding: 28px;
	height: 100%;
	background: var(--wp--preset--color--base);
	box-sizing: border-box;
}
.eff-card h3 { margin-top: 0.5rem; }
.eff-card p:last-child { margin-bottom: 0; }

/* Vier kolommen: op tablet twee per rij */
@media (min-width: 782px) and (max-width: 1100px) {
	.eff-grid-4 { flex-wrap: wrap !important; }
	.eff-grid-4 > .wp-block-column { flex-basis: calc(50% - 1em) !important; flex-grow: 0 !important; }
}

/* Chips */
.eff-chips { gap: 10px !important; }
.eff-chips p {
	margin: 0;
	padding: 8px 14px;
	border-radius: 4px;
	background: #1A2650;
}
.eff-chips.is-outline p { background: transparent; border: 1px solid #3A4770; font-weight: 500; }

/* Stappen */
.eff-steps { border-top: 2px solid var(--wp--preset--color--ink); padding-top: 24px; }
.eff-step-num { font-family: var(--wp--preset--font-family--mono); font-size: 1.75rem; color: var(--wp--preset--color--accent); margin-bottom: 0.25rem !important; }

/* Knoppen */
.wp-block-button.is-style-outline > .wp-block-button__link {
	border: 1px solid #B9C1D6;
	color: var(--wp--preset--color--ink);
	background: transparent;
}
.wp-block-button.is-style-outline > .wp-block-button__link:hover { border-color: var(--wp--preset--color--accent); color: var(--wp--preset--color--accent); }

/* Contactblok */
.eff-contact-item p { margin: 0; }
.eff-contact-item a { font-weight: 600; }

/* Footer */
.eff-footer { background: var(--wp--preset--color--ink); color: #C9D1E6; font-size: 0.875rem; }
.eff-footer a { color: #C9D1E6; }
.eff-footer p { margin: 0; }

/* ---------- Ritme en uitlijning ---------- */
.wp-site-blocks > *, .eff-main > * { margin-block-start: 0 !important; }
.eff-header-inner { padding-top: 14px; padding-bottom: 14px; gap: 16px; }
.eff-header .wp-block-button__link { padding: 10px 18px; font-size: 0.95rem; }
.eff-hero-cols { align-items: center !important; gap: 56px !important; }
.eff-hero-text { flex-basis: 62% !important; }
.eff-hero-card { flex-basis: 38% !important; }
.eff-intro { max-width: 680px; margin-bottom: 48px !important; }
.eff-col-narrow { flex-basis: 36% !important; }
.eff-col-wide { flex-basis: 64% !important; }
.eff-chips-label { margin-top: 2rem !important; }
.eff-contact-grid { gap: 32px !important; }
.eff-contact-item { min-width: 160px; }
.eff-footer-inner { padding-top: 28px; padding-bottom: 28px; gap: 12px; }
.eff-dark h2, .eff-blue h2 { color: #fff; }
@media (max-width: 781px) {
	.eff-hero-text, .eff-hero-card, .eff-col-narrow, .eff-col-wide { flex-basis: 100% !important; }
}

/* ---------- Logo en foto's ---------- */
.eff-logo img { display: block; height: 44px; width: auto; }
.eff-banner { margin: 0 !important; }
.eff-banner img { display: block; width: 100%; height: clamp(200px, 26vw, 380px); object-fit: cover; object-position: center; }
.wp-block-cover.eff-section { min-height: 0; padding-top: 96px; padding-bottom: 96px; }
.wp-block-cover.eff-section .wp-block-cover__inner-container { color: #fff; }
@media (max-width: 782px) { .wp-block-cover.eff-section { padding-top: 64px; padding-bottom: 64px; } }

/* ---------- Portret ---------- */
.eff-about-cols { gap: 56px !important; }
.eff-about-photo { flex-basis: 34% !important; }
.eff-about-text { flex-basis: 66% !important; }
.eff-portrait { margin: 0; }
.eff-portrait img { display: block; width: 100%; max-width: 380px; height: auto; aspect-ratio: 3 / 4; object-fit: cover; border-radius: 6px; box-shadow: 0 12px 32px rgba(11, 21, 51, 0.12); }
@media (max-width: 781px) {
	.eff-about-photo, .eff-about-text { flex-basis: 100% !important; }
	.eff-portrait img { max-width: 280px; }
}
