/* NexusNext.ai · beperkte stylesheet voor de bewaarde oude pagina's: alleen tokens, navigatie en footer.
   De pagina zelf blijft op assets/styles.css. */
/* ============================================================
   NexusNext.ai · stylesheet (herbouw 2026-10, versie 2)
   Rustig, groot, echte schermen. Donker zoals de app; licht thema
   via data-theme="light". Geen gloed, geen gedraaide kaarten.
   ============================================================ */
:root{
  --bg:#0b0f14; --bg-soft:#10161e; --bg-card:#131a23; --bg-inset:#0e131a; --bg-deep:#070a0e;
  --line:rgba(255,255,255,.08); --line-strong:rgba(255,255,255,.14);
  --text:#f2f5f9; --text-dim:#a0acbc; --text-faint:#6b7789;
  --accent:#4d8dee; --accent-hi:#8fbbff; --accent-soft:rgba(77,141,238,.14); --accent-line:rgba(77,141,238,.4);
  --ok:#4cc38a; --ok-soft:rgba(76,195,138,.14); --warn:#e0b35a; --warn-soft:rgba(224,179,90,.14); --bad:#e07a6a; --bad-soft:rgba(224,122,106,.14);
  --on-accent:#06101f; --nav-bg:rgba(11,15,20,.72); --hover:rgba(255,255,255,.06); --fill:rgba(255,255,255,.035);
  --shadow:0 30px 80px rgba(0,0,0,.55),0 2px 6px rgba(0,0,0,.35); --shadow-sm:0 10px 30px rgba(0,0,0,.35);
  --r:12px; --r-lg:18px; --r-pill:980px;
  --font:"Inter",-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",system-ui,sans-serif;
  --mono:"JetBrains Mono","SF Mono","Cascadia Code",Consolas,ui-monospace,monospace;
  color-scheme:dark;
}
:root[data-theme="light"]{
  --bg:#f5f7fa; --bg-soft:#ffffff; --bg-card:#ffffff; --bg-inset:#f0f3f7; --bg-deep:#e6ebf2;
  --line:rgba(18,32,52,.09); --line-strong:rgba(18,32,52,.16);
  --text:#121a26; --text-dim:#4f5e75; --text-faint:#7f8ca0;
  --accent:#2b67cc; --accent-hi:#1d52ad; --accent-soft:rgba(43,103,204,.1); --accent-line:rgba(43,103,204,.34);
  --ok:#17915f; --ok-soft:rgba(23,145,95,.12); --warn:#b7841a; --warn-soft:rgba(183,132,26,.12); --bad:#cf5236; --bad-soft:rgba(207,82,54,.12);
  --on-accent:#fff; --nav-bg:rgba(245,247,250,.78); --hover:rgba(18,32,52,.05); --fill:rgba(18,32,52,.035);
  --shadow:0 30px 80px rgba(30,45,75,.18),0 2px 6px rgba(30,45,75,.08); --shadow-sm:0 10px 30px rgba(30,45,75,.12);
  color-scheme:light;
}
/* ---------- Navigatie ---------- */
nav.site{position:sticky;top:0;z-index:50;background:var(--nav-bg);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%)}
nav.site::after{content:"";position:absolute;left:0;right:0;top:100%;height:14px;background:linear-gradient(var(--bg),transparent);opacity:.9;pointer-events:none}
.nav-inner{display:flex;align-items:center;justify-content:space-between;height:60px;gap:20px}
.logo{display:flex;align-items:center;gap:10px;color:var(--text);font-weight:700;letter-spacing:.06em}
.logo .wm{font-size:1rem}.logo .wm b{color:var(--accent);font-weight:700}
.nav-links{display:flex;align-items:center;gap:2px}
.nav-links>a,.nav-drop>button{color:var(--text-dim);padding:8px 12px;border-radius:var(--r-pill);font-size:.94rem;font-weight:500;background:none;border:0;cursor:pointer;font-family:var(--font);display:inline-flex;align-items:center;gap:6px;transition:background .15s,color .15s}
.nav-links>a:hover,.nav-drop>button:hover,.nav-links>a.on,.nav-drop.open>button{color:var(--text);background:var(--hover)}
.nav-drop{position:relative}
.nav-drop>button:active{transform:scale(.97)}
.nav-menu-wrap{position:absolute;top:100%;left:0;padding-top:10px;display:none;z-index:60}
.nav-drop.open>.nav-menu-wrap,.nav-drop:hover>.nav-menu-wrap{display:block}
.nav-menu{background:var(--bg-card);border:1px solid var(--line-strong);border-radius:var(--r-lg);box-shadow:var(--shadow);padding:18px 20px;display:grid;grid-template-columns:repeat(3,230px);gap:10px 22px;transform-origin:top left;animation:menuIn .18s ease-out}
@keyframes menuIn{from{opacity:0;transform:translateY(-4px) scale(.98)}to{opacity:1;transform:none}}
.nav-col h5{margin:6px 0 4px;font-family:var(--mono);font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:var(--text-faint);font-weight:500}
.nav-col a{display:block;color:var(--text);padding:5px 8px;border-radius:8px;font-size:.92rem;margin-left:-8px}
.nav-col a:hover{background:var(--hover);color:var(--accent-hi)}
.nav-cta{margin-left:10px}
.nav-burger{display:none;background:none;border:1px solid var(--line-strong);border-radius:var(--r-pill);color:var(--text);padding:7px 11px;cursor:pointer}
.theme-toggle{background:none;border:1px solid var(--line);border-radius:50%;color:var(--text-dim);width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;margin-left:6px}
.theme-toggle:hover{color:var(--text);border-color:var(--line-strong)}
.mobile-menu{display:none;border-top:1px solid var(--line);background:var(--bg-card);padding:12px 20px 22px;max-height:calc(100vh - 60px);overflow:auto}
.mobile-menu.open{display:block}
.mobile-menu h5{margin:14px 0 4px;font-family:var(--mono);font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:var(--text-faint)}
.mobile-menu a{display:block;color:var(--text);padding:9px 0;border-bottom:1px solid var(--line)}
@media (max-width:1020px){.nav-links{display:none}.nav-burger{display:inline-flex}}

/* ---------- Footer ---------- */
footer.site{border-top:1px solid var(--line);padding:56px 0 36px;background:var(--bg-soft);color:var(--text-dim);font-size:.9rem}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr 1fr;gap:28px}
@media (max-width:980px){.foot-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.foot-grid{grid-template-columns:1fr}}
.foot-grid h5{margin:0 0 10px;font-family:var(--mono);font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:var(--text-faint)}
.foot-grid a{display:block;color:var(--text-dim);padding:3px 0}
.foot-grid a:hover{color:var(--accent-hi)}
.foot-legal{margin-top:36px;padding-top:18px;border-top:1px solid var(--line);font-size:.8rem;color:var(--text-faint);line-height:1.7}
.foot-legal a{color:var(--text-dim)}

.logo{display:flex;align-items:center;gap:10px;color:var(--text);font-weight:700;letter-spacing:.06em;text-decoration:none}
.logo .wm{font-size:1rem}.logo .wm b{color:var(--accent);font-weight:700}
.skip{position:absolute;left:-999px;top:8px;background:var(--accent);color:var(--on-accent);padding:8px 12px;border-radius:8px;z-index:100}.skip:focus{left:8px}
.nav-cta.btn{border-radius:980px;padding:8px 14px;font-size:.9rem}

/* Kennismaken-knop in het menu van de oude pagina's */
nav.site .nav-links > a.nav-cta{display:inline-flex;align-items:center;background:var(--accent);color:var(--on-accent);font-weight:600;border:1px solid transparent;border-radius:980px;padding:8px 14px;font-size:.9rem;margin-left:10px}
nav.site .nav-links > a.nav-cta:hover{background:var(--accent-hi);color:var(--on-accent)}
