:root{
  --bg: #0b1020;
  --card: #101735;
  --accent: #7dd3fc;
  --text: #e5e7eb;
  --muted: #94a3b8;
  --ring: rgba(125, 211, 252, 0.35);
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji", "Segoe UI Symbol";
  color:var(--text);
  background: radial-gradient(1200px 600px at 80% -10%, #1d2448 0%, transparent 60%),
              radial-gradient(900px 500px at -10% 20%, #0f172a 0%, transparent 60%),
              var(--bg);
}
/* Title above the logo, centered */
.topbar{display:flex; justify-content:center; margin-top:16px;}
.brand{display:flex; flex-direction:column; align-items:center; gap:8px;}
.site-title{
  font-size:20px;
  font-weight:600;
  color:var(--accent);
  margin:0;
  text-align:center;
  letter-spacing:1px;
  text-transform:uppercase;
}
.logo-img{
  display:block;
  margin:0 auto;
  max-width:80px;
  height:auto;
}
/* existing styles below can remain as-is */
.container{max-width:1100px;margin:0 auto;padding:24px}
.brand-name{font-weight:700;letter-spacing:.3px}
.logo-bg{fill:var(--card)}
.logo-fg{stroke:var(--accent)}
.hero{padding:80px 0 40px;text-align:center}
.hero h1{font-size:clamp(32px,6vw,56px);margin:0 0 12px;line-height:1.05}
.tagline{font-size:clamp(16px,2.2vw,20px);color:var(--muted);max-width:760px;margin:0 auto 28px}
#countdown{display:flex;gap:16px;justify-content:center;margin:28px 0 16px}
#countdown div{background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.08);border-radius:14px;padding:18px 20px;min-width:92px}
#countdown span{display:block;font-size:32px;font-weight:800}
#countdown small{color:var(--muted);font-size:12px;letter-spacing:.2px}
.cta{display:flex;gap:12px;justify-content:center;margin:22px 0 8px;flex-wrap:wrap}
.button{appearance:none;border:none;border-radius:12px;padding:12px 18px;font-weight:600;text-decoration:none;display:inline-block}
.button.primary{background:linear-gradient(135deg, var(--accent), #38bdf8);color:#0b1220;box-shadow:0 0 0 0 var(--ring)}
.button.primary:hover{filter:brightness(1.05)}
.button.ghost{border:1px solid rgba(255,255,255,0.22);color:var(--text);background:transparent}
.button.ghost:hover{background:rgba(255,255,255,0.06)}
.services{padding:28px 0 64px}
.cards{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px}
.card{background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.08);border-radius:16px;padding:18px}
.card h3{margin:0 0 6px}
.card p{margin:0;color:var(--muted)}
.footer{border-top:1px solid rgba(255,255,255,0.08);padding:22px 0;text-align:center;color:var(--muted)}