:root{
  --bg:#070a14;
  /* Blob colors — tweak here */
  --c1:#74b2ff;   /* sky blue */
  --c2:#b07dff;   /* purple */
  --c3:#5cf2cc;   /* aqua green */
  --c4:#ff7cb7;   /* pink */
  /* Animation timings — tweak here */
  --t1:10s; --t2:20s; --t3:30s; --t4:40s;
  --blur:45px;
}
*{box-sizing:border-box}html,body{height:100%}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,'Helvetica Neue',Arial,'Noto Sans',sans-serif;color:#0f1222;background:var(--bg);line-height:1.6;overflow-x:hidden}
.container{width:100%;max-width:1120px;margin:0 auto;padding:0 20px}
.row{display:flex;align-items:center;gap:16px}
.space-between{justify-content:space-between}
.site-header{position:sticky;top:0;z-index:20;/*background:rgba(7,10,20,.42);*/backdrop-filter:saturate(140%) blur(10px);padding-top: 20px;/*border-bottom:1px solid rgba(255,255,255,.08)*/}
.actions{display:flex;gap:8px}
.hero{min-height:calc(100vh - 72px);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:16px;position:relative;z-index:10}
.logo-center{display:flex;justify-content:center;margin:40px 0 24px}
.logo-large{max-width:360px;width:80%;height:auto;filter:drop-shadow(0 2px 8px rgba(0,0,0,.35))}
.date-pill{display:inline-flex;align-items:center;gap:10px;margin:12px 0;padding:10px 14px;border:1px solid rgba(142,167,255,.4);border-radius:999px;background:rgba(120,140,255,.12);color:#e8ebff;font-weight:600}
.coming{font-size:clamp(18px,2vw,22px);color:#C8CEF2;margin-top:4px}
.info-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:28px;width:100%}
.card{padding:18px;border:1px solid rgba(255,255,255,.08);border-radius:16px;background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.03));color:#dbe0ff;text-align:left}
.card h3{margin:.2rem 0 .4rem;color:#f1f3ff}
.card p{margin:0;color:#b7bee6}
.site-footer{padding:24px 0;color:#aab1d9;padding-bottom: 50px;/*border-top:1px solid rgba(255,255,255,.08);background:rgba(7,10,20,.42);*/backdrop-filter:saturate(140%) blur(8px)}
.site-footer a {color: #FFF;}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:10px 16px;border-radius:12px;border:1px solid rgba(255,255,255,.12);text-decoration:none;color:#f5f7ff;font-weight:700;background:rgba(255,255,255,.06);transition:transform .12s ease, background .12s ease}
.btn:hover{transform:translateY(-1px);background:rgba(255,255,255,.12)}

@media (max-width:900px){.info-cards{grid-template-columns:1fr} .logo-large{max-width:300px}}

/* Animated blurred lights */
.bg-lights{position:fixed;inset:0;z-index:0;overflow:hidden;background:radial-gradient(1200px 700px at 10% -10%, rgba(116,178,255,.15), transparent 60%), radial-gradient(1000px 600px at 110% 110%, rgba(255,124,183,.12), transparent 60%), var(--bg)}
.blob{position:absolute;width:40vmax;height:40vmax;border-radius:50%;filter:blur(var(--blur));opacity:.5;mix-blend-mode:screen;animation:float var(--t1) ease-in-out infinite, pulse 14s ease-in-out infinite}
.b1{background:radial-gradient(circle at 30% 30%, var(--c1), transparent 60%);left:-12%;top:-12%;--t1:var(--t1)}
.b2{background:radial-gradient(circle at 70% 40%, var(--c2), transparent 60%);right:-10%;top:6%;--t1:var(--t2);animation-direction:alternate}
.b3{background:radial-gradient(circle at 40% 70%, var(--c3), transparent 60%);left:6%;bottom:-14%;--t1:var(--t3);animation-direction:alternate-reverse}
.b4{background:radial-gradient(circle at 70% 80%, var(--c4), transparent 60%);right: -14%;bottom:-10%;--t1:var(--t4)}

@keyframes float {
  0%   { transform:translate(0,0) scale(1) rotate(0deg); }
  20%  { transform:translate(6%, -5%) scale(1.05) rotate(15deg); }
  40%  { transform:translate(-5%, 5%) scale(0.98) rotate(40deg); }
  60%  { transform:translate(4%, 3%) scale(1.03) rotate(65deg); }
  80%  { transform:translate(-3%, -4%) scale(1.01) rotate(80deg); }
  100% { transform:translate(0,0) scale(1) rotate(95deg); }
}
@keyframes pulse {
  0%,100% { opacity:.48 }
  50%     { opacity:.62 }
}
/* optional subtle film grain for depth */
.grain{position:absolute;inset:-200%;background-image:url('data:image/svg+xml;utf8,<svg xmlns=%22http://www.w3.org/2000/svg%22 width=%22400%22 height=%22400%22><filter id=%22n%22><feTurbulence type=%22fractalNoise%22 baseFrequency=%220.8%22 numOctaves=%222%22 stitchTiles=%22stitch%22/></filter><rect width=%22100%25%22 height=%22100%25%22 filter=%22url(%23n)%22 opacity=%220.04%22/></svg>');animation:grainShift 12s steps(6,end) infinite;mix-blend-mode:soft-light;pointer-events:none}
@keyframes grainShift {0%{transform:translate(0,0)} 25%{transform:translate(-2%,1%)} 50%{transform:translate(1%,-1%)} 75%{transform:translate(2%,2%)} 100%{transform:translate(0,0)}}
