/* Taak 98 · Over ons v3 (canvas OverOnsV2.dc.html, akkoord Jeordie 22-10). Alleen via design tokens (kleuren variant C). */

.eo-oo .eo-cp-hero{min-height:600px}
.eo-oo__sub{font:400 1.5rem/1.3 var(--eo-font-kop);color:var(--eo-off);max-width:700px;margin:0 auto}
.eo-oo h2{font-size:clamp(1.6rem,3vw,2.1rem);margin:0 0 16px}
.eo-oo__midden{text-align:center}
.eo-oo__lead{max-width:640px}

.eo-oo__split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:center}
.eo-oo__quote{margin:8px 0 24px;padding:4px 0 4px 24px;border-left:4px solid var(--eo-green)}
.eo-oo__quote p{font:400 1.75rem/1.3 var(--eo-font-kop);color:var(--eo-navy);margin:0}
.eo-oo__quote cite{display:block;margin-top:10px;font:600 .8125rem var(--eo-font);font-style:normal;color:var(--eo-green-dark);letter-spacing:.04em}
.eo-oo__foto{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--eo-line)}
.eo-oo__foto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

main.eo-oo .eo-cp-sectie.eo-oo__waarden{background:var(--eo-green);color:#fff}
main.eo-oo .eo-cp-sectie.eo-oo__groei{background:var(--eo-bg)}
.eo-oo .eo-oo__waarden :is(h2,h3){color:#fff}
.eo-oo__waarden .eo-eyebrow{color:var(--eo-bg)}
.eo-oo__kw{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;margin-top:24px}
.eo-oo__kw h3{font-size:1.35rem;margin:0 0 8px}
.eo-oo__kw p{margin:0}

/* Tijdlijn: verticaal, per jaar een rij (schaalt mee met de groei) */
.eo-oo__tl{list-style:none;margin:40px 0 0;padding:0;position:relative}
.eo-oo__tl::before{content:"";position:absolute;left:119px;top:8px;bottom:8px;width:2px;background:var(--eo-line)}
.eo-oo__rij{display:grid;grid-template-columns:120px minmax(0,1fr);gap:0 40px;padding:0 0 36px;position:relative}
.eo-oo__jaar{position:relative;margin:0;text-align:right;padding-right:24px;font:400 2.5rem/1 var(--eo-font-kop);color:var(--eo-navy)}
.eo-oo__jaar::after{content:"";position:absolute;right:-7px;top:12px;width:14px;height:14px;border-radius:50%;background:var(--eo-bg);border:3px solid var(--eo-navy);box-sizing:border-box;transition:background .25s var(--eo-ease),transform .25s var(--eo-ease)}
.eo-oo__rij:hover .eo-oo__jaar::after{background:var(--eo-green);border-color:var(--eo-green);transform:scale(1.25)}
.eo-oo__rij--nu .eo-oo__jaar{font-size:1.9rem;color:var(--eo-green-dark)}
.eo-oo__rij--nu .eo-oo__jaar::after{background:var(--eo-green);border-color:var(--eo-green)}
.eo-oo__it{display:flex;flex-direction:column;gap:14px;min-width:0}
.eo-oo__kaarten{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px}
.eo-oo__kaart{display:block;background:#fff;padding:18px 20px 20px;border-left:5px solid var(--eo-navy);color:inherit;text-decoration:none;transition:transform .25s var(--eo-ease),box-shadow .25s var(--eo-ease),border-color .25s var(--eo-ease)}
.eo-oo__kaart--dienst{border-left-color:var(--eo-green)}
a.eo-oo__kaart:hover,a.eo-oo__kaart:focus-visible{transform:translateY(-3px);box-shadow:0 10px 22px rgba(30,34,47,.12);color:inherit}
a.eo-oo__kaart:hover h3{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
.eo-oo__label{display:block;font:700 .75rem var(--eo-font);letter-spacing:.1em;text-transform:uppercase;color:var(--eo-navy);margin-bottom:6px}
.eo-oo__kaart--dienst .eo-oo__label{color:var(--eo-green-dark)}
.eo-oo .eo-oo__kaart h3{font-size:1.5rem;line-height:1.2;margin:0 0 6px}
.eo-oo__kaart p{font-size:1rem;line-height:1.55;margin:0}
.eo-oo__meer{display:inline-block;margin-top:10px;font:700 .8125rem var(--eo-font);color:var(--eo-green-dark)}
.eo-oo__locs{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}
.eo-oo__locs li{background:var(--eo-blue);color:#fff;font:600 .9375rem/1.2 var(--eo-font);transition:background .2s var(--eo-ease)}
.eo-oo__locs li>a,.eo-oo__locs li{padding:9px 14px}
.eo-oo__locs li:has(a){padding:0}
.eo-oo__locs a{display:block;color:#fff;text-decoration:none}
.eo-oo__locs a::after{content:" →";opacity:.7}
.eo-oo__locs li:has(a):hover{background:var(--eo-navy)}
.eo-oo__locs small{display:block;font:700 .6875rem var(--eo-font);letter-spacing:.1em;text-transform:uppercase;color:var(--eo-bg);opacity:.85;margin-bottom:3px}
.eo-oo__rij--nu .eo-oo__locs li{background:var(--eo-green);font-size:1.125rem}
.eo-oo__rij--nu .eo-oo__locs li:has(a):hover{background:var(--eo-green-dark)}

.eo-oo__stats{list-style:none;margin:40px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1px;background:var(--eo-line);border:1px solid var(--eo-line)}
.eo-oo__stats li{background:var(--eo-off);padding:22px 24px}
.eo-oo__stats b{display:block;font:400 2.75rem/1 var(--eo-font-kop);color:var(--eo-navy);margin-bottom:6px}
.eo-oo__stats span{font-size:.8125rem}

main.eo-oo .eo-cp-sectie.eo-oo__groep{background:#fff}
.eo-oo__gk{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin:32px 0 0;padding:0;list-style:none}
.eo-oo__gkaart{display:flex;flex-direction:column;height:100%;background:var(--eo-off);border-top:4px solid var(--eo-green);color:inherit;text-decoration:none;transition:transform .25s var(--eo-ease),box-shadow .25s var(--eo-ease)}
a.eo-oo__gkaart:hover,a.eo-oo__gkaart:focus-visible{transform:translateY(-4px);box-shadow:0 12px 24px rgba(30,34,47,.14);color:inherit}
.eo-oo__gbeeld{position:relative;aspect-ratio:3/2;overflow:hidden;background:var(--eo-blue);display:flex;align-items:center;justify-content:center}
.eo-oo__gbeeld img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.eo-oo__gnaam{font:700 .8125rem var(--eo-font);letter-spacing:.14em;text-transform:uppercase;color:var(--eo-bg)}
.eo-oo__gtekst{padding:20px;display:flex;flex-direction:column;gap:6px;flex:1}
.eo-oo .eo-oo__gtekst h3{font-size:1.25rem;margin:0}
.eo-oo__gtekst .eo-eyebrow{margin:0}
.eo-oo__gtekst p{font-size:.875rem;line-height:1.6;margin:0}
.eo-oo__gtekst .eo-oo__meer{margin-top:auto;padding-top:10px}

.eo-oo__cta{background:var(--eo-navy);color:#fff;padding:80px 0}
.eo-oo .eo-oo__cta h2{color:#fff}
.eo-oo__cta .eo-eyebrow{color:var(--eo-bg)}
.eo-oo__cta p{max-width:620px;margin:0 auto 24px}
.eo-oo__knoppen{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}

@media (max-width:1000px){.eo-oo__gk{grid-template-columns:1fr 1fr}}
@media (max-width:800px){
	.eo-oo__split,.eo-oo__kw{grid-template-columns:1fr;gap:28px}
	.eo-oo__stats{grid-template-columns:1fr 1fr}
	.eo-oo__tl::before{left:63px}
	.eo-oo__rij{grid-template-columns:64px minmax(0,1fr);gap:0 20px}
	.eo-oo__jaar{font-size:1.6rem;padding-right:14px}
	.eo-oo__jaar::after{top:6px}
	.eo-oo__rij--nu .eo-oo__jaar{font-size:1.25rem}
	.eo-oo__kaarten{grid-template-columns:1fr}
}
@media (max-width:600px){.eo-oo__gk{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.eo-oo__kaart,.eo-oo__gkaart,.eo-oo__jaar::after{transition:none}a.eo-oo__kaart:hover,a.eo-oo__gkaart:hover{transform:none}}