/* ===== aktifoks.com — base chrome (topbar, header, mega-nav, footer, typography) ===== */
:root{
  --bg:#0b0f16; --surface:#121826; --surface-2:#1a2233; --surface-3:#212b40;
  --border:#28324a; --text:#e8eef6; --muted:#94a2b6; --head:#ffffff;
  --accent:#16c784; --accent-2:#12a86e;   /* CTA accent — actions only */
  --gold:#f5c451; --danger:#e5534b;
  --wrap:1160px; --radius:14px;
  --font:'Segoe UI',Roboto,-apple-system,BlinkMacSystemFont,Arial,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font);line-height:1.68;font-size:17px;-webkit-font-smoothing:antialiased}
.wrap,.container{max-width:var(--wrap);margin:0 auto;padding:0 20px}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3,h4{color:var(--head);line-height:1.25;font-weight:800}
h1{font-size:clamp(1.7rem,4.4vw,2.55rem);margin:.1em 0 .35em;letter-spacing:-.5px}
h2{font-size:clamp(1.35rem,3vw,1.75rem);margin:2em 0 .5em;padding-bottom:.32em;border-bottom:1px solid var(--border)}
h3{font-size:1.2rem;margin:1.4em 0 .4em}
h4{font-size:1rem}
p,li{color:var(--text)}
small{color:var(--muted)}
img{max-width:100%}

/* ---- topbar (age + responsible gambling; NO advertiser disclosure per policy) ---- */
.topbar{background:#05070c;border-bottom:1px solid var(--border)}
.disclosure{max-width:var(--wrap);margin:0 auto;padding:7px 20px;font-size:.82rem;color:#c3cddb;display:flex;gap:10px;align-items:center;justify-content:center;text-align:center;flex-wrap:wrap}
.disclosure .age{background:var(--gold);color:#241c00;font-weight:900;border-radius:6px;padding:1px 8px;font-size:.78rem}
.disclosure a{color:var(--accent)}
.disc-short{display:none}

/* ---- header + mega nav ---- */
.hdr{background:rgba(18,24,38,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:60}
.hdr-in{display:flex;align-items:center;justify-content:space-between;height:66px;gap:18px}
.logo{font-weight:900;font-size:1.4rem;color:#fff;letter-spacing:-.5px;white-space:nowrap}
.logo b{color:var(--accent);font-weight:900}
.nav-links{display:flex;align-items:center;gap:6px}
.nav-item{position:relative}
.nav-row{display:flex;align-items:center}
.nav-top{color:var(--text);font-weight:600;font-size:.96rem;padding:10px 12px;border-radius:8px}
.nav-top:hover{color:var(--accent);text-decoration:none}
.caret{background:none;border:0;color:var(--muted);cursor:pointer;font-size:.8rem;padding:6px 4px;display:none}
.submenu{position:absolute;top:calc(100% + 6px);left:0;background:var(--surface-2);border:1px solid var(--border);border-radius:12px;padding:14px;min-width:230px;box-shadow:0 18px 40px rgba(0,0,0,.45);opacity:0;visibility:hidden;transform:translateY(6px);transition:.16s}
.submenu--wide{min-width:440px}
.nav-item:hover .submenu{opacity:1;visibility:visible;transform:translateY(0)}
.submenu-cols{display:flex;gap:26px}
.submenu-h{display:block;color:var(--muted);font-size:.72rem;text-transform:uppercase;letter-spacing:.6px;margin:0 0 8px;font-weight:700}
.submenu a{display:block;color:var(--text);padding:6px 8px;border-radius:7px;font-size:.92rem}
.submenu a:hover{background:var(--surface-3);color:var(--accent);text-decoration:none}
.state-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 10px}
.join-btn{background:var(--accent);color:#052015;font-weight:800;padding:9px 18px;border-radius:9px;margin-left:8px}
.join-btn:hover{background:var(--accent-2);text-decoration:none;color:#052015}
.burger{display:none;background:none;border:1px solid var(--border);color:#fff;border-radius:9px;padding:7px 12px;font-size:1.15rem;cursor:pointer}

/* ---- footer ---- */
.foot{background:var(--surface);border-top:1px solid var(--border);margin-top:48px;padding:34px 0 20px;overflow:hidden}
.mega{font-weight:900;color:transparent;-webkit-text-stroke:1px #28324a;letter-spacing:-2px;line-height:.9;text-align:center;margin:0 0 26px;user-select:none}
.foot-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:26px}
.foot-grid p{font-size:.9rem;color:var(--muted)}
.foot h4{color:#fff;font-size:.95rem;margin:0 0 10px}
.foot a{display:block;color:var(--muted);font-size:.9rem;margin:6px 0}
.foot a:hover{color:var(--accent)}
.badges{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.badges span{background:var(--surface-3);border:1px solid var(--border);border-radius:999px;padding:4px 12px;font-size:.76rem;color:var(--text)}
.foot-legal{border-top:1px solid var(--border);margin-top:26px;padding-top:16px}
.foot-legal p{font-size:.82rem;color:var(--muted);margin:.5em 0}
.foot-legal a{display:inline;color:var(--accent)}

/* ---- breadcrumb ---- */
.breadcrumb{font-size:.85rem;color:var(--muted);margin-bottom:14px}
.breadcrumb a{color:var(--muted)}

@media(max-width:900px){
  .nav-links{position:fixed;inset:66px 0 auto 0;background:var(--surface);flex-direction:column;align-items:stretch;padding:12px 18px;border-bottom:1px solid var(--border);gap:2px;display:none;max-height:calc(100vh - 66px);overflow:auto}
  .nav-links.open{display:flex}
  .burger{display:block}
  .caret{display:block}
  .nav-row{justify-content:space-between}
  .nav-top{flex:1}
  .submenu{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;background:var(--surface-2);display:none;margin:2px 0 8px}
  .nav-item.open .submenu{display:block}
  .submenu--wide{min-width:0}
  .submenu-cols{flex-direction:column;gap:12px}
  .join-btn{margin:8px 0 0;text-align:center}
  .foot-grid{grid-template-columns:1fr 1fr}
  .disc-full{display:none}.disc-short{display:inline}
}
