/* Prisma — EU-sovereign open information platform */
/* Copyright (c) 2026 BOHÉ Investments BV · MIT Licence */

:root{
  --dark:#1A1A2E;--gold:#C9A84C;
  /* Light mode tokens */
  --bg:#ffffff;--bg-alt:#F8F6F0;--border:#E5E7EB;--muted:#595959;--text:#1A1A2E;
  --card:#ffffff;--hero-text:#ffffffbb;--nav-link:#ffffffaa;
}
[data-theme="dark"]{
  --bg:#0f0f1a;--bg-alt:#1a1a2e;--border:#2e2e4a;--muted:#a0a0b8;--text:#e8e8f0;
  --card:#1e1e32;--hero-text:#ffffffcc;--nav-link:#ffffffcc;
}
@media(prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#0f0f1a;--bg-alt:#1a1a2e;--border:#2e2e4a;--muted:#a0a0b8;--text:#e8e8f0;
    --card:#1e1e32;--hero-text:#ffffffcc;--nav-link:#ffffffcc;
  }
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:system-ui,-apple-system,sans-serif;color:var(--text);background:var(--bg);line-height:1.6}
a{color:var(--gold);text-decoration:none}
a:hover{text-decoration:underline}
code{font-family:monospace;background:#f3f4f6;padding:2px 6px;border-radius:4px;font-size:.85em}

/* ── Nav ── */
nav{background:var(--dark);padding:0 2rem;display:flex;align-items:center;justify-content:space-between;height:58px;position:sticky;top:0;z-index:100}
.nav-logo{color:var(--gold);font-size:1.2rem;font-weight:700;letter-spacing:-.01em}
.nav-links{display:flex;gap:1.25rem;list-style:none}
.nav-links a{color:#ffffffaa;font-size:.83rem;transition:color .15s}
.nav-links a:hover{color:#fff;text-decoration:none}
.nav-right{display:flex;align-items:center;gap:.75rem}
.lang-toggle{display:flex;border:1px solid #ffffff22;border-radius:6px;overflow:hidden}
.lang-toggle button{background:transparent;border:none;color:#ffffff77;font-size:.75rem;padding:.25rem .6rem;cursor:pointer;transition:all .15s}
.lang-toggle button.active{background:var(--gold);color:var(--dark);font-weight:600}
.nav-cta{background:var(--gold);color:var(--dark)!important;padding:.3rem .9rem;border-radius:6px;font-weight:600;font-size:.83rem!important}
.nav-cta:hover{opacity:.9;text-decoration:none!important}
@media(max-width:768px){.nav-links,.lang-toggle{display:none}}

/* ── Hero ── */
.hero{background:var(--dark);color:#fff;padding:5rem 2rem 3.5rem;text-align:center}
.hero-badge{display:inline-flex;align-items:center;gap:.4rem;background:var(--bg)fff12;border:1px solid #ffffff1e;border-radius:20px;padding:.25rem .9rem;font-size:.72rem;color:var(--gold);margin-bottom:1.25rem}
.hero h1{font-size:clamp(1.7rem,4vw,2.6rem);font-weight:700;line-height:1.15;margin-bottom:.9rem}
.hero h1 span{color:var(--gold)}
.hero-sub{font-size:.95rem;color:#ffffffbb;max-width:520px;margin:0 auto 1.75rem}
.hero-actions{display:flex;gap:.6rem;justify-content:center;flex-wrap:wrap;margin-bottom:1.25rem}
.btn-primary{background:var(--gold);color:var(--dark);padding:.55rem 1.3rem;border-radius:8px;font-weight:700;font-size:.875rem}
.btn-outline{border:1px solid #ffffff33;color:#fff;padding:.55rem 1.3rem;border-radius:8px;font-size:.875rem}
.btn-primary:hover,.btn-outline:hover{opacity:.85;text-decoration:none}
.hero-tags{display:flex;gap:.4rem;justify-content:center;flex-wrap:wrap;margin-bottom:1.25rem}
.tag{font-size:.7rem;padding:.2rem .65rem;border-radius:20px;border:1px solid}
.tag-eu{background:#1e3a5f18;color:#93c5fd;border-color:#3b82f633}
.tag-os{background:#14532d18;color:#86efac;border-color:#22c55e33}
.tag-w3c{background:#3b076418;color:#c4b5fd;border-color:#a855f733}
.tag-nl{background:#78350f18;color:#fcd34d;border-color:#f59e0b33}
.nlnet-badge{display:inline-flex;align-items:center;gap:.4rem;background:#78350f22;border:1px solid #f59e0b44;border-radius:6px;padding:.3rem .8rem;font-size:.72rem;color:#fcd34d}
.why-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:.75rem;margin-top:1.5rem;text-align:left}
.why-card{background:var(--bg)fff0d;border:1px solid #ffffff15;border-radius:10px;padding:1rem}
.why-card h3{font-size:.875rem;font-weight:600;color:#fff;margin-bottom:.35rem}
.why-card p{font-size:.8rem;color:#ffffffaa;line-height:1.5}

/* ── Sections ── */
section{padding:3.5rem 2rem}
section.alt{background:var(--bg-alt)}
.container{max-width:960px;margin:0 auto}
.section-label{font-size:.7rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--gold);margin-bottom:.6rem}
h2{font-size:1.5rem;font-weight:700;margin-bottom:.6rem}
.lead{font-size:.9rem;color:var(--muted);margin-bottom:1.75rem;max-width:560px}

/* ── Use cases ── */
.uc-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1rem}
.uc-card{background:var(--bg);border:1px solid var(--border);border-radius:10px;padding:1.1rem}
section.alt .uc-card{background:var(--bg)}
.uc-card h3{font-size:.9rem;font-weight:600;margin-bottom:.3rem}
.uc-card p{font-size:.8rem;color:var(--muted);line-height:1.5}
.uc-tag{display:inline-block;font-size:.68rem;padding:.15rem .5rem;border-radius:4px;margin-top:.5rem;background:#E6F1FB;color:#0C447C;border:1px solid #85B7EB}

/* ── Components ── */
.comp-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1rem}
.comp-card{background:var(--bg);border:1px solid var(--border);border-radius:10px;padding:1.1rem;position:relative}
.comp-label{font-size:.65rem;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin-bottom:.35rem}
.comp-card h3{font-size:1rem;font-weight:700;margin-bottom:.3rem}
.comp-card p{font-size:.8rem;color:var(--muted);line-height:1.5;margin-bottom:.6rem}
.nlnet-chip{display:inline-block;background:#FAEEDA;color:#633806;border:1px solid #EF9F27;font-size:.68rem;padding:.15rem .5rem;border-radius:4px}

/* ── Stats ── */
.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:1rem;text-align:center}
.stat-num{font-size:2rem;font-weight:700;color:var(--gold)}
.stat-lbl{font-size:.75rem;color:var(--muted);margin-top:.15rem}

/* ── Standards ── */
.std-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:.75rem}
.std-card{background:var(--bg);border:1px solid var(--border);border-radius:8px;padding:.9rem}
section.alt .std-card{background:var(--bg)}
.std-name{font-size:.9rem;font-weight:700}
.std-role{font-size:.76rem;color:var(--muted);margin-top:.2rem}
.std-badge{display:inline-block;font-size:.65rem;padding:.15rem .5rem;border-radius:4px;margin-top:.4rem;background:#EAF3DE;color:#27500A;border:1px solid #97C459}

/* ── BSW table ── */
.bsw-wrap{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:.8rem;margin-top:.75rem}
th{text-align:left;padding:.55rem .75rem;background:var(--dark);color:var(--gold);font-weight:600;font-size:.75rem}
td{padding:.5rem .75rem;border-bottom:1px solid var(--border);vertical-align:top}
tr:last-child td{border-bottom:none}
tr:nth-child(even) td{background:var(--bg-alt)}
.s-ok{display:inline-block;font-size:.68rem;padding:.15rem .5rem;border-radius:4px;background:#EAF3DE;color:#27500A;border:1px solid #97C459;white-space:nowrap}
.s-wip{display:inline-block;font-size:.68rem;padding:.15rem .5rem;border-radius:4px;background:#E6F1FB;color:#0C447C;border:1px solid #85B7EB;white-space:nowrap}

/* ── Deploy / Get started ── */
.deploy-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1rem}
.deploy-card{background:var(--bg);border:1px solid var(--border);border-radius:10px;padding:1.1rem}
.deploy-card.featured{border-color:var(--gold)}
.deploy-card h3{font-size:.9rem;font-weight:700;margin-bottom:.3rem}
.deploy-card p{font-size:.78rem;color:var(--muted);margin-bottom:.75rem}
.code-block{background:#1A1A2E;border-radius:6px;padding:.75rem;margin-bottom:.5rem}
.code-block code{background:transparent;color:#93c5fd;font-size:.78rem;display:block;line-height:1.6}
.code-block code .c{color:#6b7280}
.req-chips{display:flex;gap:.3rem;flex-wrap:wrap;margin-top:.5rem}
.req-chip{display:inline-block;background:var(--bg-alt);border:1px solid var(--border);border-radius:4px;font-size:.7rem;padding:.2rem .5rem;color:var(--muted)}

/* ── Changelog ── */
.cl-list{display:flex;flex-direction:column;gap:0}
.cl-row{display:flex;gap:1rem;padding:.6rem 0;border-bottom:1px solid var(--border);font-size:.83rem;align-items:baseline}
.cl-row:last-child{border-bottom:none}
.cl-date{color:var(--muted);min-width:90px;font-size:.75rem}
.cl-ver{font-weight:700;min-width:56px}
.cl-desc{color:var(--text)}
.cl-badge{display:inline-block;font-size:.65rem;padding:.1rem .45rem;border-radius:3px;margin-left:.4rem;background:#EAF3DE;color:#27500A;border:1px solid #97C459}
.cl-badge.road{background:#E6F1FB;color:#0C447C;border-color:#85B7EB}

/* ── Repos ── */
.repo-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:.75rem}
.repo-card{background:var(--bg);border:1px solid var(--border);border-radius:8px;padding:.9rem;display:flex;flex-direction:column}
.repo-name{font-size:.85rem;font-weight:700;font-family:monospace}
.repo-desc{font-size:.75rem;color:var(--muted);margin:.25rem 0 auto}
.repo-link{font-size:.75rem;margin-top:.6rem}

/* ── Contact / CTA ── */
.cta-block{background:var(--dark);border-radius:12px;padding:1.75rem;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem}
.cta-block h3{color:var(--gold);font-size:1.1rem;margin-bottom:.35rem}
.cta-block p{color:#ffffffbb;font-size:.85rem}
.cta-links{display:flex;gap:.6rem;flex-wrap:wrap}

/* ── Overheid banner ── */
.gov-banner{background:#1A1A2E08;border:1px solid var(--gold)22;border-radius:8px;padding:.75rem 1rem;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:.5rem;margin-bottom:1.5rem}
.gov-banner p{font-size:.83rem;color:var(--text)}
.gov-banner a{font-size:.83rem;background:var(--dark);color:var(--gold);padding:.3rem .8rem;border-radius:6px}

/* ── Footer ── */
footer{background:var(--dark);color:#ffffff55;padding:1.5rem 2rem;text-align:center;font-size:.75rem}
footer a{color:#ffffff77}
footer .f-top{display:flex;justify-content:center;gap:1.5rem;flex-wrap:wrap;margin-bottom:.6rem}
footer .f-top a{color:#ffffffaa}

/* ── Arch diagram placeholder ── */
.arch-box{background:var(--bg-alt);border:1px dashed var(--border);border-radius:10px;padding:2rem;text-align:center;color:var(--muted);font-size:.83rem}
.arch-box code{display:block;margin-top:.5rem;font-size:.78rem;color:var(--gold)}

.skip-link{position:absolute;top:-40px;left:0;background:var(--gold);color:var(--dark);padding:.4rem .8rem;border-radius:0 0 6px 0;font-size:.83rem;font-weight:600;z-index:200;transition:top .15s}
.skip-link:focus{top:0}
*:focus-visible{outline:2.5px solid var(--gold);outline-offset:3px;border-radius:2px}
a:focus-visible,button:focus-visible{outline:2.5px solid var(--gold);outline-offset:3px}
.theme-toggle{background:transparent;border:1px solid #ffffff33;color:#ffffffcc;font-size:.78rem;padding:.25rem .6rem;border-radius:6px;cursor:pointer;display:flex;align-items:center;gap:.3rem}
.theme-toggle:hover{background:#ffffff15}