/* Exeonix Website plugin. Alles staat onder .exo zodat het thema niet stoort. */
.exo{
  --navy:#0f2a43; --navy-deep:#0a1d30; --ink:#1a2631; --muted:#4d5f6e;
  --mist:#edf2f6; --line:#d3dde6; --teal:#0b7a75; --signal:#7cc9c4; --amber:#f2a33a;
  --font:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  font-family:var(--font); color:var(--ink); line-height:1.65; font-size:17px;
  -webkit-font-smoothing:antialiased; background:#fff;
}
.exo *,.exo *::before,.exo *::after{box-sizing:border-box}
.exo h1,.exo h2,.exo h3{font-family:var(--font); line-height:1.15; margin:0 0 .5em; color:var(--navy); letter-spacing:-.015em}
.exo h2{font-size:clamp(1.7rem,3.4vw,2.5rem); font-weight:750}
.exo h3{font-size:1.15rem; font-weight:700; letter-spacing:0}
.exo p{margin:0 0 1em; max-width:68ch}
.exo ul{margin:0; padding:0; list-style:none}
.exo a{color:var(--teal)}
.exo a:focus-visible,.exo button:focus-visible,.exo input:focus-visible,.exo textarea:focus-visible{outline:3px solid var(--amber); outline-offset:2px}
.exo-standalone{margin:0}
.exo-wrap{width:100%; max-width:1120px; margin:0 auto; padding:0 24px}
.exo-skip{position:absolute; left:-999px; top:8px; background:#fff; padding:8px 14px; z-index:100}
.exo-skip:focus{left:8px}

/* Buttons en links */
.exo .exo-btn{display:inline-block; padding:.8em 1.5em; border-radius:4px; font-weight:650; text-decoration:none; border:2px solid transparent; font-size:1rem; cursor:pointer; font-family:var(--font); line-height:1.2}
.exo .exo-btn-primary{background:var(--amber); color:#1b1304}
.exo .exo-btn-primary:hover{background:#f7b455}
.exo .exo-btn-ghost{color:#fff; border-color:rgba(255,255,255,.5)}
.exo .exo-btn-ghost:hover{border-color:#fff}
.exo .exo-link{font-weight:650; text-decoration:underline; text-underline-offset:4px}

/* Header */
.exo-header{position:sticky; top:0; z-index:50; background:#fff; border-bottom:1px solid var(--line)}
.exo-header-in{display:flex; align-items:center; justify-content:space-between; min-height:68px; gap:16px}
.exo .exo-logo{display:flex; align-items:center; gap:10px; color:var(--navy); text-decoration:none; font-weight:800; font-size:1.35rem; letter-spacing:-.02em}
.exo-logo svg{color:var(--teal)}
.exo-nav{display:flex; align-items:center; gap:28px}
.exo-nav ul{display:flex; gap:26px}
.exo .exo-nav ul a{color:var(--ink); text-decoration:none; font-weight:600; padding:6px 0; border-bottom:2px solid transparent}
.exo .exo-nav ul a:hover,.exo .exo-nav ul a[aria-current]{border-color:var(--teal)}
.exo-toggle{display:none; background:none; border:1px solid var(--line); border-radius:4px; padding:8px 14px; font:600 .95rem var(--font); color:var(--navy); cursor:pointer}

/* Hero */
.exo-hero{background:var(--navy); color:#fff; overflow:hidden}
.exo-hero-grid{display:grid; grid-template-columns:1.15fr 1fr; gap:32px; align-items:center; min-height:520px; padding-top:72px; padding-bottom:72px}
.exo .exo-hero h1{color:#fff; font-size:clamp(3.6rem,10vw,7.5rem); font-weight:800; letter-spacing:-.045em; line-height:.95; margin-bottom:.3em}
.exo-hero-lead{font-size:clamp(1.15rem,2.2vw,1.5rem); color:#d3e3ef; max-width:30ch}
.exo-actions{display:flex; flex-wrap:wrap; gap:14px; margin-top:32px}
.exo-hero-art{position:relative}
.exo-arcs{width:100%; height:auto; display:block; color:var(--signal)}
.exo-arc{fill:none; stroke:currentColor; stroke-width:1.5; opacity:.55; stroke-dasharray:1; animation:exo-draw 1.8s cubic-bezier(.3,.7,.2,1) both; animation-delay:calc(var(--i) * .18s)}
.exo-dot{fill:var(--amber)}
@keyframes exo-draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}

/* Pagina-kop (binnenpagina's) */
.exo-pagehead{background:var(--navy); color:#fff; padding:72px 0 64px}
.exo .exo-pagehead h1{color:#fff; font-size:clamp(2.4rem,6vw,4rem); font-weight:800; letter-spacing:-.03em}
.exo-lead{font-size:1.25rem; color:#d3e3ef; margin:0}

/* Secties */
.exo-section{padding:84px 0}
.exo-alt{background:var(--mist)}
.exo-split{display:grid; grid-template-columns:1fr 1fr; gap:56px}
.exo-three{display:grid; grid-template-columns:repeat(3,1fr); gap:40px}
.exo-points li{padding:0 0 20px 20px; border-left:3px solid var(--teal); margin-bottom:20px}
.exo-points li:last-child{margin-bottom:0}
.exo-points h3{margin-bottom:.25em}
.exo-points p{margin:0; color:var(--muted)}
.exo-statement{font-size:1.4rem; line-height:1.35; font-weight:650; color:var(--navy)}

/* Domeinen */
.exo-domains{display:grid; grid-template-columns:repeat(4,1fr); gap:32px; margin-top:32px}
.exo-domain{border-top:4px solid var(--teal); padding-top:18px}
.exo-domain li{padding:7px 0; border-bottom:1px solid var(--line)}

/* Founders */
.exo-founders{display:grid; grid-template-columns:1fr 1fr; gap:48px; margin:32px 0 24px}
.exo-founder{display:flex; gap:24px; align-items:flex-start}
.exo-avatar{flex:none; width:120px; height:120px; border-radius:50%; object-fit:cover}
.exo-avatar-mono{display:grid; place-items:center; background:var(--navy); color:#fff; font-weight:800; font-size:2rem; letter-spacing:.02em}
.exo-founder p{font-size:.98rem; color:var(--muted); margin:0}

/* Team, waarden, catalogus */
.exo-three h3{margin-bottom:.4em}
.exo-three p{color:var(--muted)}
.exo-tags{font-size:.95rem; color:var(--navy)!important}
.exo-values{display:grid; grid-template-columns:repeat(4,1fr); gap:32px; margin-top:32px}
.exo-value{border-left:3px solid var(--teal); padding-left:18px}
.exo-value p{color:var(--muted); font-size:.98rem; margin:0}
.exo-catalog li{padding:9px 0; border-bottom:1px solid var(--line)}
.exo-section h2+.exo-three,.exo-section h2+.exo-split{margin-top:32px}

/* CTA */
.exo-cta{background:var(--navy); color:#fff; padding:84px 0}
.exo .exo-cta h2{color:#fff; font-size:clamp(2.2rem,5vw,3.4rem)}
.exo-cta p{color:#d3e3ef; font-size:1.2rem}

/* Contact */
.exo-details dt{font-weight:700; color:var(--navy); margin-top:18px}
.exo-details dd{margin:0}
.exo-form p{margin:0 0 18px; max-width:none}
.exo-form label{display:block; font-weight:650; margin-bottom:6px; color:var(--navy)}
.exo-form input,.exo-form textarea{width:100%; padding:12px 14px; border:1px solid #9fb0bf; border-radius:4px; font:inherit; color:var(--ink); background:#fff}
.exo-hp{position:absolute!important; left:-9999px; height:0; overflow:hidden}
.exo-notice{padding:14px 16px; border-radius:4px; border-left:4px solid; margin-bottom:20px!important}
.exo-ok{background:#e6f4f2; border-color:var(--teal)}
.exo-err{background:#fdeeee; border-color:#c0392b}

/* Footer */
.exo-footer{background:var(--navy-deep); color:#c3d3df; padding:56px 0 0}
.exo-footer a{color:#fff!important; text-decoration:none}
.exo-footer a:hover{text-decoration:underline}
.exo-footer-in{display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:40px; padding-bottom:40px}
.exo-footer-brand{font-size:1.5rem; font-weight:800; color:#fff; margin-bottom:.3em}
.exo-footer li{padding:3px 0}
.exo-legal{display:flex; flex-wrap:wrap; gap:24px; padding-top:20px; padding-bottom:28px; border-top:1px solid rgba(255,255,255,.14); font-size:.9rem}

/* Responsive */
@media (max-width:960px){
  .exo-domains,.exo-values{grid-template-columns:repeat(2,1fr)}
  .exo-three{grid-template-columns:1fr}
}
@media (max-width:860px){
  .exo-toggle{display:block}
  .exo-nav{display:none; position:absolute; left:0; right:0; top:100%; background:#fff; border-bottom:1px solid var(--line); flex-direction:column; align-items:flex-start; padding:16px 24px 24px; gap:16px}
  .exo-nav.is-open{display:flex}
  .exo-nav ul{flex-direction:column; gap:8px}
  .exo-hero-grid{grid-template-columns:1fr; min-height:0; padding-top:48px; padding-bottom:32px}
  .exo-hero-art{max-width:320px; margin-left:auto}
  .exo-split,.exo-founders,.exo-footer-in{grid-template-columns:1fr}
  .exo-section,.exo-cta{padding:56px 0}
}
@media (max-width:560px){
  .exo-domains,.exo-values{grid-template-columns:1fr}
  .exo-founder{flex-direction:column}
}
@media (prefers-reduced-motion:reduce){
  .exo-arc{animation:none; stroke-dashoffset:0}
}