:root{
  --nexus:#00bfff; --prohub:#32cd32; --collective:#ff1493;
  --knowledge:#3b82f6; --music:#ff8c00; --events:#8b5cf6; --account:#6b7280;
  --bg:#f7f7f9; --bar:#f0f2f5; --text:#111827; --muted:#6b7280;
  --border:#e5e7eb; --hoverBg:#ffffff; --shadow:0 6px 24px rgba(0,0,0,.08);
}
[data-theme="dark"]{
  --bg:#0f1115; --bar:#1c1c1c; --text:#f9fafb; --muted:#b3b8c2;
  --border:#2a2d34; --hoverBg:#16181d; --shadow:0 8px 32px rgba(0,0,0,.35);
}
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;600;700;800&display=swap');
*{box-sizing:border-box} html,body{height:100%}
body{margin:0;background:var(--bg);color:var(--text);font:16px/1.5 Montserrat,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial}
.container{max-width:1200px;margin:0 auto;padding:0 20px}
/* NAV */
.navbar{position:sticky;top:0;z-index:100;background:var(--bar);box-shadow:var(--shadow)}
.nav{display:flex;align-items:center;padding:14px 0;gap:16px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--text);font-weight:800;letter-spacing:.3px}
.spacer{flex:1}
.menu{list-style:none;display:flex;gap:6px;margin:0;padding:0}
.menu>li{position:relative}
.menu>li>a{display:flex;align-items:center;gap:8px;padding:10px 14px;border-radius:10px;text-decoration:none;color:var(--text);font-weight:600}
.menu>li .dot{width:8px;height:8px;border-radius:50%;background:currentColor;opacity:.6}
.menu>li[data-sec="nexus"]>a:hover{color:var(--nexus);background:var(--hoverBg)}
.menu>li[data-sec="prohub"]>a:hover{color:var(--prohub);background:var(--hoverBg)}
.menu>li[data-sec="collective"]>a:hover{color:var(--collective);background:var(--hoverBg)}
.menu>li[data-sec="knowledge"]>a:hover{color:var(--knowledge);background:var(--hoverBg)}
.menu>li[data-sec="music"]>a:hover{color:var(--music);background:var(--hoverBg)}
.menu>li[data-sec="events"]>a:hover{color:var(--events);background:var(--hoverBg)}
.menu>li[data-sec="account"]>a:hover{color:var(--account);background:var(--hoverBg)}
.dropdown{position:absolute;left:0;top:100%;min-width:240px;background:var(--bar);border:1px solid var(--border);
  border-radius:12px;box-shadow:var(--shadow);padding:10px;margin-top:8px;display:none}
.menu>li:hover .dropdown, .menu>li:focus-within .dropdown{display:grid}
.dropdown a{padding:10px 12px;border-radius:10px;text-decoration:none;color:var(--text);font-weight:500}
.dropdown a:hover{background:var(--hoverBg)}
.hamb{display:none;border:1px solid var(--border);background:transparent;color:var(--text);padding:10px 12px;border-radius:10px}
.theme{border:1px solid var(--border);background:transparent;color:var(--text);padding:10px 12px;border-radius:10px;margin-left:6px}
@media(max-width:980px){
  .menu{display:none;position:fixed;inset:64px 14px auto 14px;flex-direction:column;background:var(--bar);
    border:1px solid var(--border);border-radius:14px;padding:10px;box-shadow:var(--shadow)}
  .menu.is-open{display:flex}
  .menu>li{width:100%}
  .menu>li>a{justify-content:space-between}
  .dropdown{position:static;display:none;border:none;box-shadow:none;padding:6px;margin:6px 0 0 0;background:transparent}
  .menu>li.open .dropdown{display:grid}
  .hamb{display:inline-flex;align-items:center;gap:8px}
}
/* HERO */
.hero{padding:64px 0 32px}
.hero .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:28px;align-items:center}
.hero h1{font-size:clamp(28px,4vw,44px);line-height:1.1;margin:0 0 12px}
.hero p{font-size:clamp(16px,2.2vw,18px);color:var(--muted)}
.hero .cta{display:flex;gap:12px;margin-top:18px}
.btn{display:inline-flex;align-items:center;gap:8px;padding:12px 16px;border-radius:12px;text-decoration:none;font-weight:700;border:1px solid var(--border)}
.btn.primary{background:var(--text);color:var(--bg)}
.btn.ghost{background:transparent;color:var(--text)}
.btn.small{padding:10px 12px;border-radius:10px;font-weight:700}
.btn.cx-nexus{background:var(--nexus);color:#001018;border-color:transparent}
.btn.cx-pro{background:var(--prohub);color:#001800;border-color:transparent}
.btn.cx-collect{background:var(--collective);color:#280010;border-color:transparent}
.btn.cx-outline{background:transparent;border-color:var(--text);color:var(--text)}
.hero img{width:100%;border-radius:16px;border:1px solid var(--border);box-shadow:var(--shadow);display:block}
@media(max-width:980px){.hero .wrap{grid-template-columns:1fr}}
/* SECTIONS */
.section{padding:28px 0}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media(max-width:980px){.grid{grid-template-columns:1fr}}
.card{background:var(--bar);border:1px solid var(--border);border-radius:14px;padding:18px;box-shadow:var(--shadow)}
.card h3{margin:0 0 8px}
.badge{display:inline-block;padding:4px 10px;border-radius:999px;font-size:12px;border:1px solid var(--border);margin-bottom:8px}
.kicker{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
footer{padding:40px 0;color:var(--muted)}

/* Persona grid */
.persona{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media(max-width:980px){.persona{grid-template-columns:1fr}}
.persona .card h4{margin:6px 0 6px}

/* Cookie banner */
.cc-wrap{position:fixed;inset:auto 16px 16px 16px;z-index:9999;background:var(--bar);border:1px solid var(--border);
  border-radius:14px;box-shadow:var(--shadow);padding:16px;display:none}
.cc-wrap.show{display:block}
.cc-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.cc-actions .btn{flex:0 0 auto}
.cc-prefs{display:flex;gap:14px;margin-top:10px;flex-wrap:wrap}
.cc-prefs label{display:flex;align-items:center;gap:8px;border:1px solid var(--border);padding:6px 10px;border-radius:10px}
.cc-small{font-size:12px}
.lang-switch {
  margin-left: 1rem;
  font-size: .9rem;
}

.lang-switch a {
  text-decoration: none;
  color: var(--text);
}

.lang-switch a:hover {
  text-decoration: underline;
}