:root { --ink:#11261d; --forest:#173f30; --moss:#678b72; --sand:#f4f0e7; --paper:#fffdf8; --gold:#e9b85d; --line:#d8ddd3; --muted:#4b5b51; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font:400 16px/1.6 ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
a { color:inherit; }
a:focus-visible, button:focus-visible { outline:3px solid var(--gold); outline-offset:3px; }
.skip-link { position:absolute; left:1rem; top:-4rem; background:var(--ink); color:#fff; padding:.6rem .9rem; z-index:10; }
.skip-link:focus { top:1rem; }
.site-header, main > section, footer { width:min(1120px, calc(100% - 2.5rem)); margin-inline:auto; }
.site-header { min-height:78px; display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.brand-link { display:inline-flex; align-items:center; text-decoration:none; }
.brand-logo { display:block; width:auto; height:42px; max-width:min(220px, 58vw); }
.wordmark { text-decoration:none; font-size:1.25rem; font-weight:800; letter-spacing:-.04em; white-space:nowrap; }
.wordmark span { color:var(--moss); }
nav { display:flex; align-items:center; flex-wrap:wrap; justify-content:flex-end; gap:.85rem 1rem; font-size:.92rem; font-weight:650; }
nav a { text-decoration:none; }
.nav-cta { border:1px solid var(--ink); padding:.42rem .75rem; border-radius:999px; }
.hero { position:relative; min-height:620px; display:grid; grid-template-columns:1.25fr .75fr; align-items:center; gap:5rem; padding:5.5rem 0; }
.hero::before { content:""; position:absolute; z-index:-1; width:56vw; height:610px; right:0; top:0; background:radial-gradient(circle at 82% 30%, #dce7d9, transparent 52%),var(--sand); border-radius:0 0 0 44%; }
.eyebrow { margin:0 0 .8rem; font-size:.76rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:var(--moss); }
h1,h2,h3 { font-family:ui-serif,Georgia,Cambria,"Times New Roman",serif; line-height:1.05; letter-spacing:-.04em; }
h1 { max-width:11.5em; margin:0; font-size:clamp(3rem,7vw,5.9rem); overflow-wrap:normal; word-break:normal; hyphens:none; }
h2 { margin:.1rem 0; max-width:14ch; font-size:clamp(2rem,4.2vw,3.5rem); }
h3 { margin:.5rem 0; font-size:1.5rem; }
.lede,.section-intro { max-width:48ch; font-size:1.16rem; color:var(--muted); }
.section-intro { margin:1rem 0 0; }
.actions { display:flex; flex-wrap:wrap; gap:.75rem; margin-top:2rem; }
.button { display:inline-flex; min-height:48px; align-items:center; justify-content:center; padding:.65rem 1rem; border-radius:4px; text-decoration:none; font-weight:750; }
.primary { background:var(--forest); color:#fff; }
.secondary { border:1px solid var(--forest); color:var(--forest); }
.signal-card { background:var(--forest); color:#fff; padding:2rem; box-shadow:16px 16px 0 var(--gold); }
.signal-card ol { list-style:none; padding:0; margin:1.5rem 0 0; counter-reset:signal; }
.signal-card li { counter-increment:signal; padding:1rem 0; border-top:1px solid rgba(255,255,255,.25); display:grid; gap:.2rem; }
.signal-card li::before { content:"0" counter(signal); color:var(--gold); font-weight:800; font-size:.78rem; }
.signal-card span { color:#d9e6db; font-size:.92rem; }
.signal-label { color:var(--gold); font-weight:800; text-transform:uppercase; letter-spacing:.1em; font-size:.78rem; }
.section { padding:6rem 0; border-top:1px solid var(--line); }
.split { display:grid; grid-template-columns:.8fr 1.2fr; gap:5rem; }
.body-copy { max-width:58ch; color:var(--muted); font-size:1.07rem; }
.body-copy p:first-child { margin-top:0; }
.section-heading { margin-bottom:2.4rem; }
.section-heading h2 { max-width:18ch; }
.role-grid,.use-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem; }
.role-grid-four { grid-template-columns:repeat(4,1fr); }
.use-grid-two { grid-template-columns:repeat(2,1fr); gap:1.4rem; }
.role-grid article,.use-grid article { border:1px solid var(--line); padding:1.5rem; }
.role-grid p,.use-grid p { color:var(--muted); margin-bottom:0; }
.role-number { color:var(--moss); font-weight:800; font-size:.8rem; }
.partner-list { margin:.85rem 0 0; padding-left:1.15rem; color:var(--muted); }
.partner-list li { margin:.45rem 0; }
.arch-diagram { margin:0 0 2.5rem; padding:0; min-width:0; max-width:100%; }
.arch-diagram picture { display:block; margin:0; max-width:100%; }
.arch-artwork { display:block; width:100%; max-width:100%; height:auto; margin:0; border:1px solid var(--line); }
.arch-diagram-caption { margin:1rem 0 0; color:var(--muted); font-size:1rem; line-height:1.5; max-width:62ch; }
.arch-delivery-paths { margin:1.25rem 0 0; min-width:0; max-width:52rem; }
.arch-routes-heading { margin:0 0 .65rem; color:var(--forest); font-size:1rem; font-weight:800; letter-spacing:.02em; }
.arch-route-list { list-style:none; margin:0; padding:0; display:grid; gap:.75rem; min-width:0; }
.arch-route { min-width:0; border-left:3px solid var(--forest); padding:.7rem .85rem .75rem; background:var(--sand); }
.arch-route-text { margin:0 0 .4rem; color:var(--ink); font-size:1rem; font-weight:700; line-height:1.4; overflow-wrap:anywhere; }
.arch-stack-path { margin:0; color:var(--forest); font-size:1rem; font-weight:650; line-height:1.35; display:flex; align-items:center; gap:.5rem; flex-wrap:wrap; }
.arch-route:has(.arch-stack-fallback) { border-left-style:dashed; }
.arch-stack-fallback { font-weight:700; }
.arch-route-swatch { display:inline-block; width:1.75rem; height:0; border-top:2px solid var(--forest); flex:0 0 auto; }
.arch-route-swatch.solid { border-top-style:solid; }
.arch-route-swatch.dashed { border-top-style:dashed; }
.gov-flow { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1.25rem; }
.gov-flow li { border-top:3px solid var(--gold); padding:1.15rem 0 0; min-width:0; }
.gov-flow h3 { margin:.35rem 0 .55rem; font-size:1.2rem; max-width:none; }
.gov-flow p { margin:0; color:var(--muted); font-size:.98rem; }
.gov-step { display:inline-block; color:var(--forest); font-weight:800; font-size:.8rem; letter-spacing:.06em; }
.about .section-heading { margin-bottom:1.4rem; }
.about .section-heading h2 { hyphens:none; overflow-wrap:normal; word-break:normal; }
.about-copy { max-width:62ch; }
.people-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.5rem; margin-top:2.5rem; }
.person-card { min-width:0; border:1px solid var(--line); padding:1.35rem 1.25rem 1.5rem; background:var(--paper); }
.person-portrait { aspect-ratio:1 / 1; overflow:hidden; margin:0 0 1rem; background:var(--sand); }
.person-card .person-portrait { width:min(9.5rem, 100%); max-width:9.5rem; }
.person-portrait img { display:block; width:100%; height:100%; object-fit:cover; }
.person-portrait-stijn img { object-position:center 18%; }
.person-portrait-norm img { object-position:center 22%; }
.person-card h3 { margin:.15rem 0 .35rem; font-size:1.35rem; max-width:none; }
.person-role { margin:0; font-weight:750; color:var(--forest); }
.person-specialty { margin:.35rem 0 0; font-size:.95rem; font-weight:650; color:var(--muted); }
.person-desc { margin:.75rem 0 1rem; color:var(--muted); font-size:1rem; }
.person-link { font-weight:750; color:var(--forest); text-decoration:underline; text-underline-offset:.18em; }
.person-link:focus-visible { outline:3px solid var(--gold); outline-offset:3px; }
.dark { width:100% !important; padding-inline:max(1.25rem, calc((100% - 1120px)/2)); background:var(--ink); color:#fff; }
.dark .eyebrow { color:var(--gold); }
.dark h2 { max-width:16ch; }
.dark .use-grid article { border-color:rgba(255,255,255,.23); }
.dark .use-grid p,.dark .partner-list { color:#d7e4d8; }
.trust { background:var(--sand); padding:4rem 2.5rem; margin-bottom:5rem !important; }
.trust h2 { max-width:17ch; }
.trust > p:last-child { max-width:65ch; color:var(--muted); }
.contact { background:var(--forest); color:#fff; padding:4.5rem 2.5rem; margin-bottom:4rem; }
.contact .eyebrow { color:var(--gold); }
.contact h1,.contact h2 { max-width:18ch; }
.contact p { max-width:60ch; color:#d9e6db; }
.contact .button.primary { background:var(--gold); color:var(--ink); }
.contact .contact-secondary { border-color:rgba(255,255,255,.55); color:#fff; }
.contact .actions { margin-top:1.5rem; }
footer { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:0 0 2rem; color:var(--muted); font-size:.9rem; }
.footer-copy { text-align:right; max-width:42ch; }
.footer-copy p { margin:0; }
.footer-legal { margin-top:.35rem; font-size:.78rem; line-height:1.35; color:var(--muted); }
.hello-page { background:linear-gradient(180deg, var(--sand) 0%, var(--paper) 34%, var(--paper) 100%); }
.hello-header { min-height:68px; }
.hello-main { width:min(720px, calc(100% - 2.5rem)); margin:0 auto 3rem; padding:1.5rem 0 0; }
.hello-person { margin:0 0 2.5rem; }
.hello-thanks { margin:0 0 1rem; font-size:1.05rem; color:var(--muted); }
.hello-portrait { width:min(9rem, 100%); max-width:9rem; margin:0 auto 1rem; }
.hello-person h1 { max-width:18ch; margin:0 0 .35rem; font-size:clamp(2.2rem, 8vw, 3.4rem); overflow-wrap:normal; word-break:normal; hyphens:none; }
.hello-bio { max-width:58ch; margin:1.1rem 0 0; color:var(--muted); font-size:1.05rem; }
.hello-bio p:first-child { margin-top:0; }
.hello-about { margin:0 0 1.75rem; padding-top:1.75rem; border-top:1px solid var(--line); }
.hello-about h2 { max-width:18ch; margin:0 0 .85rem; font-size:clamp(1.55rem, 4vw, 2rem); }
.hello-about p { max-width:58ch; color:var(--muted); font-size:1.02rem; }
.hello-limit { max-width:58ch; margin:0 0 1rem; color:var(--muted); font-size:.95rem; }
.hello-home-link { margin:0; }
.hello-home-link a { font-weight:750; color:var(--forest); }
@media (max-width:980px) {
  .role-grid-four { grid-template-columns:repeat(2,1fr); }
  .gov-flow { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:760px) {
  .site-header { padding:.9rem 0; align-items:flex-start; flex-direction:column; }
  .brand-logo { height:36px; }
  nav { justify-content:flex-start; gap:.55rem .85rem; }
  .hero { grid-template-columns:minmax(0,1fr); gap:3rem; min-height:0; padding:4rem 0; }
  .hero > div { min-width:0; }
  .hero::before { width:100vw; height:500px; }
  h1,.lede { width:340px; max-width:calc(100vw - 2.5rem); }
  h1 { font-size:2.25rem; overflow-wrap:normal; word-break:normal; hyphens:none; }
  .contact h1 { width:auto; max-width:100%; }
  .contact h1,.contact p,.contact .button { overflow-wrap:anywhere; }
  .actions { flex-direction:column; align-items:stretch; }
  .actions .button { width:100%; max-width:100%; min-height:48px; white-space:normal; text-align:center; }
  .contact .button { max-width:100%; text-align:center; }
  .split,.role-grid,.role-grid-four,.use-grid,.use-grid-two,.gov-flow,.people-grid { grid-template-columns:1fr; gap:2rem; }
  .hello-portrait { width:min(7rem, 100%); max-width:7rem; }
  .arch-diagram { min-width:0; }
  .arch-artwork { min-width:0; }
  .section { padding:4rem 0; }
  .trust,.contact { padding:2.5rem 1.25rem; }
  footer { align-items:flex-start; flex-direction:column; }
  .footer-copy { text-align:left; max-width:100%; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,::before,::after { animation-duration:.01ms !important; transition-duration:.01ms !important; } }
