
:root{
  --bg:#0d0d0f;
  --card:#131318;
  --text:#f4f4f7;
  --muted:#b7b8c0;
  --accent:#e0d1ff;
  --accent-2:#9ad6ff;
  --shadow: 0 10px 30px rgba(0,0,0,.35);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;line-height:1.6}
a{color:inherit;text-decoration:none}
.wrap{max-width:1100px;margin:0 auto;padding:0 20px}
.site-header{position:sticky;top:0;z-index:10;background:rgba(13,13,15,.7);backdrop-filter:blur(8px);border-bottom:1px solid #1b1b22}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;height:64px}
.brand a{font-weight:800;letter-spacing:.2px}
.brand .tag{display:block;color:var(--muted);font-size:12px}
nav a{margin-left:18px;color:var(--muted)}
.hero{padding:80px 0;background:radial-gradient(1200px 500px at 20% -10%, rgba(224,209,255,.15), transparent), radial-gradient(1200px 600px at 80% 0%, rgba(154,214,255,.12), transparent)}
.hero h1{font-size:44px;line-height:1.2;margin:0 0 10px}
.hero p{color:var(--muted);max-width:720px}
.cta-row{margin-top:24px;display:flex;gap:12px}
.btn{display:inline-block;padding:12px 18px;border-radius:16px;background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#0d0d0f;font-weight:700;box-shadow:var(--shadow)}
.btn.ghost{background:#1a1a21;color:var(--text);border:1px solid #2a2a33}
.work{padding:60px 0}
.tabs{display:flex;gap:10px;margin-bottom:18px}
.tab{background:#1a1a21;color:var(--text);border:1px solid #2a2a33;border-radius:999px;padding:10px 16px;cursor:pointer}
.tab.active{background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#0d0d0f;font-weight:800}
.gallery{display:none;grid-template-columns:repeat(12,1fr);gap:12px}
.gallery.active{display:grid}
.tile{grid-column:span 4;background:#0f0f14;border-radius:16px;overflow:hidden;border:1px solid #24242e;box-shadow:var(--shadow)}
.tile img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s ease}
.tile:hover img{transform:scale(1.04)}
@media (max-width:900px){.tile{grid-column:span 6}}
@media (max-width:560px){.tile{grid-column:span 12}}
.about, .contact{padding:60px 0;border-top:1px solid #1b1b22;background:#0f0f14}
.two-col{display:grid;grid-template-columns:1.3fr 1fr;gap:30px}
@media (max-width:900px){.two-col{grid-template-columns:1fr}}
.facts{display:grid;gap:12px;padding:16px;background:#131318;border-radius:16px;border:1px solid #24242e}
h2{margin:0 0 8px}
.contact-list{list-style:none;padding:0;margin:10px 0 0;display:grid;gap:6px}
.site-footer{padding:26px 0;border-top:1px solid #1b1b22;color:#a5a6ae}
.site-footer .wrap{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
/* Lightbox */
.lb-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.85);display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .2s ease}
.lb-backdrop.active{opacity:1;pointer-events:auto}
.lb-backdrop img{max-width:92vw;max-height:88vh;border-radius:12px;box-shadow:var(--shadow)}
.lb-close{position:fixed;top:16px;right:16px;background:#fff;color:#000;border:none;border-radius:999px;padding:10px 14px;font-weight:800;cursor:pointer}
