.tag {
    color: red;
}
.tag {
    color: red;
}
:root{
    --bg1:#0f2027;
    --bg2:#203a43;
    --accent:#7bd389;
    --card:#0f1720cc;
}
*{box-sizing:border-box}
html,body{height:100%;margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,'Helvetica Neue',Arial}
body{
    min-height:100vh;position:relative;overflow:hidden;font-synthesis:antialiased;text-rendering:optimizeLegibility;color:#e6f0ef;
    background:linear-gradient(135deg,#071018 0%, #0b2730 40%, #112a33 100%);
}

.wrap{width:100%;max-width:980px;margin:0 auto;padding:96px 24px;display:flex;align-items:center;justify-content:center}
.card{
    width:100%;max-width:720px;background:linear-gradient(180deg,rgba(6,12,16,0.6),rgba(8,16,20,0.35));
    border-radius:16px;padding:48px;text-align:center;backdrop-filter:blur(10px);
    box-shadow:0 18px 60px rgba(2,6,23,0.6);border:1px solid rgba(255,255,255,0.03);
    transform:translateZ(0);
}
.title{font-size:64px;margin:0 0 8px;letter-spacing:-1px;color:#f3f9f8}
.subtitle{margin:0 0 20px;color:rgba(210,230,227,0.85);font-size:18px}
.actions{display:flex;gap:12px;justify-content:center;margin-top:8px}
.btn{background:linear-gradient(90deg,rgba(255,255,255,0.02),rgba(255,255,255,0.01));border:1px solid rgba(255,255,255,0.06);padding:10px 18px;border-radius:10px;color:var(--accent);cursor:pointer;font-weight:600;text-decoration:none}
.btn.glow{box-shadow:0 8px 40px rgba(123,211,137,0.28),inset 0 0 18px rgba(123,211,137,0.06);transform:translateY(-3px)}

/* hover effect: change color and subtle lift */
.btn{transition:all 220ms ease}
.btn:hover{color:#fff;background:linear-gradient(90deg,rgba(123,211,137,0.14),rgba(123,211,137,0.06));transform:translateY(-4px);box-shadow:0 12px 36px rgba(0,0,0,0.25)}

.site-header{position:fixed;left:0;right:0;top:16px;display:flex;justify-content:center;pointer-events:none}
.nav{width:100%;max-width:980px;display:flex;justify-content:space-between;align-items:center;padding:0 24px;pointer-events:auto}
.brand{font-weight:700;color:#fff}
.nav-links a{color:rgba(255,255,255,0.75);margin-left:16px;text-decoration:none}
.site-footer{position:fixed;left:0;right:0;bottom:12px;text-align:center;color:rgba(255,255,255,0.6)}

/* canvas background will sit behind content */
#bg{position:fixed;inset:0;z-index:0}
.wrap,.site-header,.site-footer,.card{position:relative;z-index:1}

@media (max-width:720px){.wrap{padding:48px 16px}.title{font-size:40px}.card{padding:28px}}