:root{--bg:#0b0f14;--ink:#e9eef6;--muted:#a9b4c2;--steel:#6e8fb2;--steel2:#4e6f93;--line:rgba(255,255,255,.10);--radius:18px;--max:1100px;--shadow:0 20px 50px rgba(0,0,0,.45);font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}
*{box-sizing:border-box}body{margin:0;color:var(--ink);background:radial-gradient(900px 500px at 70% 10%,rgba(110,143,178,.18),transparent 60%),radial-gradient(700px 500px at 20% 30%,rgba(110,143,178,.10),transparent 55%),var(--bg)}
a{color:inherit;text-decoration:none}.wrap{max-width:var(--max);margin:0 auto;padding:0 20px}.tm{font-size:.7em;vertical-align:top;margin-left:1px;opacity:.9}
.top{position:sticky;top:0;z-index:50;background:rgba(11,15,20,.78);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.top__inner{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 20px}
.brand{display:flex;align-items:center;gap:12px}
.mark{width:34px;height:34px;border-radius:10px;background:linear-gradient(180deg,rgba(110,143,178,.9),rgba(78,111,147,.9));box-shadow:0 10px 30px rgba(110,143,178,.18)}
.brand__name{font-weight:900;letter-spacing:.06em}.brand__tag{font-size:.78rem;color:var(--muted)}
.nav{display:flex;gap:18px;align-items:center}.nav a{color:var(--muted);font-weight:800;font-size:.95rem}.nav a:hover{color:var(--ink)}.nav a.active{color:var(--ink)}
.burger{display:none;background:transparent;border:0;cursor:pointer}.burger span{display:block;width:22px;height:2px;background:var(--ink);margin:5px 0;border-radius:2px}
.mobile{padding:14px 20px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:12px;background:rgba(11,15,20,.92)}.mobile a{color:var(--muted);font-weight:900}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:10px 14px;border-radius:12px;border:1px solid var(--line);font-weight:900;letter-spacing:.02em;transition:transform .08s ease,background .2s ease,filter .2s ease}
.btn:active{transform:translateY(1px)}.btn--primary{background:linear-gradient(180deg,var(--steel),var(--steel2));border-color:transparent;color:#071018}
.btn--secondary{background:rgba(110,143,178,.14);border-color:rgba(110,143,178,.35);color:var(--ink)}.btn--ghost{background:transparent}
.hero{position:relative;overflow:hidden;padding:72px 0 22px}.hero__grid{display:grid;grid-template-columns:1.2fr .8fr;gap:26px;align-items:stretch}
.kicker{margin:0 0 12px;color:var(--muted);font-weight:900;letter-spacing:.18em;font-size:.78rem}
.hero h1{margin:0 0 14px;font-size:3rem;line-height:1.02}.steel{color:var(--steel)}
.lead{margin:0 0 18px;color:var(--muted);font-size:1.08rem;line-height:1.6;max-width:56ch}
.cta{display:flex;gap:12px;flex-wrap:wrap;margin:18px 0 18px}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:10px}
.stat{border:1px solid var(--line);background:rgba(255,255,255,.03);border-radius:14px;padding:12px}.stat__h{font-weight:900}.stat__p{color:var(--muted);font-size:.9rem;margin-top:4px}
.panel{border:1px solid var(--line);border-radius:var(--radius);background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.02));box-shadow:var(--shadow);overflow:hidden}
.panel__bar{display:flex;align-items:center;gap:6px;padding:10px 12px;border-bottom:1px solid var(--line)}
.dot{width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.12)}
.panel__title{margin-left:auto;font-size:.75rem;color:var(--muted);font-weight:900;letter-spacing:.12em}
.panel__body{padding:18px}.chip{display:inline-block;padding:6px 10px;border-radius:999px;border:1px solid rgba(110,143,178,.35);background:rgba(110,143,178,.12);color:var(--ink);font-weight:900;font-size:.72rem;letter-spacing:.12em}
.divider{height:1px;background:var(--line);margin:14px 0}.muted{color:var(--muted)}
.bg-grid{position:absolute;inset:-40px;background-image:linear-gradient(to right,rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(to bottom,rgba(255,255,255,.05) 1px,transparent 1px);background-size:60px 60px;opacity:.10;transform:rotate(10deg);pointer-events:none}
.section{padding:56px 0}.section.alt{background:rgba(255,255,255,.02);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.head h1,.head h2{margin:0 0 8px}.head p{margin:0;color:var(--muted);max-width:70ch}.head .big{font-size:1.1rem;line-height:1.7}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:18px}
.card{border:1px solid var(--line);background:rgba(255,255,255,.03);border-radius:var(--radius);padding:18px;transition:transform .12s ease,background .2s ease}
.card:hover{transform:translateY(-2px);background:rgba(255,255,255,.05)}.card h3{margin:0 0 6px}.card p{margin:0;color:var(--muted);line-height:1.6}
.callout{margin-top:22px;border:1px solid rgba(110,143,178,.28);background:rgba(110,143,178,.10);border-radius:var(--radius);padding:18px;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.callout h3{margin:0 0 6px}.callout p{margin:0;color:var(--muted);max-width:70ch}.callout__cta{display:flex;gap:10px;flex-wrap:wrap}
.grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:18px}
.box{border:1px solid var(--line);background:rgba(255,255,255,.03);border-radius:var(--radius);padding:18px}
.box h3{margin:0 0 6px}.box p{margin:0;color:var(--muted);line-height:1.6}
.row{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.page .section{padding:42px 0}.game{margin-top:18px;border:1px solid var(--line);background:rgba(255,255,255,.03);border-radius:var(--radius);padding:18px}
.game h2{margin:0 0 6px}.game p{margin:0;color:var(--muted);line-height:1.6}
.footer{border-top:1px solid var(--line);padding:22px 0}.footer__inner{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.footer__brand{font-weight:900;letter-spacing:.06em}.footer__muted{color:var(--muted)}
.footer__links{display:flex;gap:14px;flex-wrap:wrap;color:var(--muted);font-weight:900}.footer__links a:hover{color:var(--ink)}
.dropdown{position:relative;display:inline-block}.dropbtn{background:transparent;border:0;color:var(--muted);font-weight:900;font-size:.95rem;cursor:pointer;padding:8px 0}
.dropbtn:hover{color:var(--ink)}
.dropdown-content{display:none;position:absolute;right:0;top:38px;min-width:220px;border:1px solid var(--line);background:rgba(11,15,20,.95);backdrop-filter:blur(10px);border-radius:14px;overflow:hidden;box-shadow:var(--shadow)}
.dropdown-content a{display:block;padding:10px 12px;color:var(--muted);font-weight:800}
.dropdown-content a:hover{background:rgba(255,255,255,.06);color:var(--ink)}
.dropdown:hover .dropdown-content{display:block}
@media (max-width:940px){.hero__grid{grid-template-columns:1fr}.stats{grid-template-columns:1fr}.cards{grid-template-columns:1fr}.grid2{grid-template-columns:1fr}.nav{display:none}.burger{display:block}}

.orgGrid{
  margin-top:18px;
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:14px;
}
.orgCard{
  border:1px solid var(--line);
  background:rgba(255,255,255,.03);
  border-radius:var(--radius);
  padding:16px;
  transition: transform .12s ease, background .2s ease;
}
.orgCard:hover{transform: translateY(-2px); background:rgba(255,255,255,.05)}
.orgLogoWrap{
  height:72px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:14px;
  background:rgba(0,0,0,.25);
  border:1px solid rgba(255,255,255,.06);
  margin-bottom:12px;
}
.orgLogo{
  max-height:44px;
  max-width:100%;
  width:auto;
  height:auto;
  filter: drop-shadow(0 10px 20px rgba(0,0,0,.35));
}
.orgLogoFallback{
  width:44px;height:44px;border-radius:12px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.10);
}
.orgName{font-weight:900; letter-spacing:.02em}
.orgMeta{margin-top:4px; color:var(--muted); font-size:.85rem; font-weight:800}

@media (max-width: 940px){
  .orgGrid{grid-template-columns:repeat(2, 1fr)}
}

.brand__logo{
  display:block;
  height:22px;
  width:auto;
  max-width:220px;
  margin-bottom:2px;
}
@media (max-width: 940px){
  .brand__logo{max-width:180px}
}


.brand{gap:14px}
.brand__icon{
  width:44px;
  height:44px;
  border-radius:12px;
  background: rgba(110,143,178,.10);
  border:1px solid rgba(110,143,178,.35);
  padding:6px;
  box-shadow: 0 10px 30px rgba(110,143,178,.18);
}
.brand__text{display:flex;flex-direction:column;justify-content:center}
.brand__logo{
  display:block;
  height:34px;
  width:auto;
  max-width:320px;
  filter: drop-shadow(0 10px 20px rgba(0,0,0,.35));
}
.brand__tag{margin-top:2px}

@media (max-width: 940px){
  .brand__icon{width:40px;height:40px;padding:6px}
  .brand__logo{height:28px;max-width:240px}
}


/* Ensure the mobile menu actually hides when [hidden] is present */
.mobile[hidden]{display:none !important;}

/* --- Nafigg header logo fixes --- */
.brand{gap:14px; min-width: 260px}
.brand__icon{
  width:44px;height:44px;border-radius:12px;
  background: rgba(110,143,178,.10);
  border:1px solid rgba(110,143,178,.35);
  padding:6px;
  box-shadow: 0 10px 30px rgba(110,143,178,.18);
}
.brand__text{display:flex;flex-direction:column;justify-content:center}
.brand__logo{
  display:block;
  height:30px;
  width:auto;
  max-width:360px;
  filter: drop-shadow(0 10px 20px rgba(0,0,0,.35));
}
.brand__tag{margin-top:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:360px}

@media (max-width: 940px){
  .brand{min-width: 0}
  .brand__icon{width:40px;height:40px;padding:6px}
  .brand__logo{height:26px;max-width:240px}
  .brand__tag{max-width:240px}
}
