:root{
    --bg:#0b0b0f; --bg2:#11121a; --fg:#e8e8ef; --muted:#9aa0aa; --accent:#7c5cff; --accent2:#18e299; --card:rgba(255,255,255,.05);
    --radius:18px;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%;scroll-behavior:smooth}
body {
    font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
    color: var(--fg);
    min-height: 100vh;
    margin: 0;

    background:
            radial-gradient(80vw 60vh at 10% 10%, #1d1733 0%, transparent 70%),
            radial-gradient(70vw 50vh at 90% 0%, #0a2a26 0%, transparent 70%),
            linear-gradient(180deg, var(--bg) 0%, #0c0c12 60%, var(--bg2) 100%);
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
}


/* NAV */
.nav{position:sticky;top:0;z-index:50;background:rgba(11,11,15,.55);backdrop-filter:blur(10px);border-bottom:1px solid rgba(255,255,255,.06)}
.container{max-width:1100px;margin:auto;padding:0 20px}
.nav-inner{display:flex;align-items:center;justify-content:space-between;height:64px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--fg)}
.brand img{width:40px;height:40px;border-radius:10px;object-fit:cover}
.brand-title{font-weight:800;letter-spacing:.5px}
.menu{display:flex;gap:18px}
.menu a{color:var(--muted);text-decoration:none;font-weight:600;padding:10px 12px;border-radius:12px}
.menu a.active,.menu a:hover{color:var(--fg);background:var(--card)}
.hamb{display:none;border:1px solid rgba(255,255,255,.12);padding:8px 10px;border-radius:12px;cursor:pointer}

/* HERO */
.hero{padding:90px 0 70px;background:radial-gradient(900px 500px at 70% 20%, rgba(124,92,255,.25), transparent 60%)}
.hero-wrap{display:grid;grid-template-columns:1.2fr .8fr;gap:40px;align-items:center}
.logo-big{width:140px;height:140px;object-fit:cover;border-radius:22px;border:1px solid rgba(255,255,255,.1);box-shadow:0 10px 50px rgba(124,92,255,.2)}
h1{font-size:48px;line-height:1.05;margin:0 0 12px}
.tag{color:var(--muted);font-size:15px;margin-bottom:18px}
.cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:18px}
.btn{display:inline-flex;align-items:center;gap:10px;padding:12px 16px;border-radius:14px;border:1px solid rgba(255,255,255,.12);text-decoration:none;color:var(--fg);font-weight:700}
.btn.primary{background:linear-gradient(135deg,var(--accent),#4b8cff)}
.btn.ghost{background:var(--card)}

/* SECTIONS */
section{padding:70px 0;border-top:1px solid rgba(255,255,255,.06)}
h2{font-size:28px;margin:0 0 18px}
.grid{display:grid;gap:16px}
.card{background:var(--card);border:1px solid rgba(255,255,255,.06);border-radius:var(--radius);padding:18px}
.two{grid-template-columns:1fr 1fr}
.three{grid-template-columns:repeat(3,1fr)}

/* MEMBERS */
.member{display:flex;gap:14px;align-items:center}
.avatar{width:56px;height:56px;border-radius:14px;background:#222;flex:none;border:1px solid rgba(255,255,255,.08)}
.role{color:var(--muted);font-size:13px}

/* SHOWS */
.show{display:flex;justify-content:space-between;align-items:center;padding:16px;border-radius:14px;border:1px dashed rgba(255,255,255,.12);background:rgba(255,255,255,.03)}
.badge{font-size:12px;padding:6px 10px;border-radius:999px;background:rgba(124,92,255,.18);border:1px solid rgba(124,92,255,.4)}

/* GALLERY */
.gallery{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}
.gallery img{width:100%;height:180px;object-fit:cover;border-radius:14px;border:1px solid rgba(255,255,255,.08);cursor:pointer}
.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.85);display:none;align-items:center;justify-content:center;z-index:100}
.lightbox img{max-width:90vw;max-height:85vh;border-radius:18px;border:1px solid rgba(255,255,255,.18)}

/* CONTACT */
.contact{display:grid;grid-template-columns:1.2fr .8fr;gap:16px}
.input{width:100%;padding:12px 14px;border-radius:12px;border:1px solid rgba(255,255,255,.12);background:#0f1118;color:var(--fg)}
textarea.input{min-height:120px;resize:vertical}

/* FOOTER */
footer{padding:40px 0;color:var(--muted);text-align:center}
.hashtags{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}

/* RESPONSIVE */
@media (max-width:900px){
    .hero-wrap{grid-template-columns:1fr}
    .contact{grid-template-columns:1fr}
    .two,.three{grid-template-columns:1fr}
    .gallery{grid-template-columns:repeat(2,1fr)}
    .hamb{display:block}
    .menu{display:none;position:absolute;left:0;right:0;top:64px;background:rgba(11,11,15,.95);padding:12px 16px;border-bottom:1px solid rgba(255,255,255,.06)}
    .menu.open{display:flex;flex-direction:column}
}