/* Gedeelde stijl voor de content- en juridische pagina's van 34-0.
   Spiegelt de look van index.html (donker, groen accent). */
:root{
  --bg:#0a0d0a; --panel-solid:#141a14; --line:#1f2a1f;
  --green:#10b981; --txt:#e8efe8; --muted:#7d8a7d; --gold:#d9a441; --radius:14px;
}
*{box-sizing:border-box}
body{margin:0;background:radial-gradient(1200px 600px at 50% -10%,#0e1a12 0%,var(--bg) 60%);
  color:var(--txt);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  line-height:1.65;}
a{color:var(--green);text-decoration:none}
a:hover{text-decoration:underline}
.wrap{max-width:820px;margin:0 auto;padding:18px 18px 90px}

/* topbalk + navigatie */
.topbar{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:10px 0 18px;flex-wrap:wrap}
.logo{font-weight:900;font-size:26px;letter-spacing:-1px;color:var(--txt)}
.logo .dash{display:inline-block;width:22px;height:8px;background:var(--green);border-radius:3px;vertical-align:middle;margin:0 4px}
nav.links{display:flex;gap:6px;flex-wrap:wrap}
nav.links a{font-size:13px;font-weight:700;color:var(--muted);padding:6px 11px;border-radius:999px;border:1px solid transparent}
nav.links a:hover{color:var(--txt);border-color:var(--line);text-decoration:none}
nav.links a.cta{color:#03130d;background:var(--green);border-color:var(--green)}

/* tekst */
.prose h1{font-size:32px;font-weight:900;letter-spacing:-1px;line-height:1.1;margin:14px 0 6px}
.prose h2{font-size:21px;font-weight:800;margin:30px 0 8px}
.prose h3{font-size:16px;font-weight:800;margin:20px 0 6px}
.prose p,.prose li{color:#cdd8cd}
.prose .lead{font-size:18px;color:var(--muted);margin:0 0 8px}
.prose ul,.prose ol{padding-left:20px}
.prose li{margin:5px 0}
.prose strong{color:var(--txt)}
.updated{font-size:12px;color:var(--muted);margin:0 0 22px;letter-spacing:.3px}
.todo{background:#1c1607;border:1px dashed #3a2f12;color:var(--gold);border-radius:10px;padding:10px 13px;font-size:13px;margin:14px 0}

/* kaarten (voor 'over'/'uitleg') */
.cards{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin:14px 0}
.card{background:var(--panel-solid);border:1px solid var(--line);border-radius:var(--radius);padding:16px}
.card h3{margin:0 0 6px}
.card p{margin:0;font-size:14px;color:var(--muted)}
@media(max-width:680px){.cards{grid-template-columns:1fr}}

/* ad-plek */
.adslot{border:1px dashed #2f4030;border-radius:12px;padding:18px;text-align:center;color:var(--muted);
  font-size:12px;margin:24px 0;background:#0c120c}

/* advertentie-eenheid (toont placeholder tot een echte ad geladen is) */
.ad-unit{position:relative;min-height:110px;margin:26px 0;border:1px dashed #2f4030;border-radius:12px;
  background:#0c120c;display:flex;align-items:center;justify-content:center;overflow:hidden}
.ad-unit .ad-ph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  color:#52624f;font-size:12px;letter-spacing:1px;text-transform:uppercase;font-weight:700;pointer-events:none}
.ad-unit .ad-label{position:absolute;top:6px;left:10px;font-size:9px;letter-spacing:1px;text-transform:uppercase;
  color:#48563f;font-weight:700;z-index:2}
.ad-unit ins{display:block;width:100%;position:relative;z-index:1}
.ad-unit:has(ins[data-filled]) .ad-ph{display:none}
.ad-unit.tall{min-height:260px}
/* met Auto ads bepaalt Google zelf de plaatsing: lege reserve-vakken verbergen we
   (ze verschijnen alleen als er later via een eigen slot-ID een ad in geladen wordt) */
.ad-unit:not(:has(ins[data-filled])){display:none}

/* footer */
footer.site{border-top:1px solid var(--line);margin-top:40px;padding-top:18px;color:var(--muted);font-size:13px}
footer.site .fnav{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:12px}
footer.site .fnav a{color:var(--muted);font-weight:700}
footer.site .disc{font-size:11px;line-height:1.6}
