/* Basic, modern placeholder styles */
:root{
  --bg: #0b1020;
  --bg-accent: #0f1630;
  --fg: #eaf2ff;
  --muted: #a9b8d1;
  --brand1: #1e90ff;
  --brand2: #6dd5fa;
  --btn-bg: #1e90ff;
  --btn-fg: #0b1020;
  --btn2-bg: transparent;
  --btn2-fg: #eaf2ff;
  --ring: rgba(109,213,250,0.5);
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  background: radial-gradient(1200px 600px at 10% 10%, var(--bg-accent), transparent),
              radial-gradient(1200px 600px at 90% 90%, var(--bg-accent), transparent),
              var(--bg);
  color:var(--fg);
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif;
  line-height:1.5;
  display:flex;
  align-items:center;
  justify-content:center;
}
.hero{
  width:min(920px, 92vw);
  padding:48px 28px;
  text-align:center;
}
.brand img{
  display:block;
  margin:0 auto 24px;
  height:auto;
  max-width:80%;
  filter: drop-shadow(0 20px 60px rgba(30,144,255,0.25));
}
h1{
  font-weight:800;
  font-size: clamp(28px, 3.2vw, 44px);
  margin:0 0 10px 0;
}
h1 span{
  background: linear-gradient(90deg, var(--brand1), var(--brand2));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.tag{
  margin:0 auto 28px;
  color:var(--muted);
  font-size: clamp(16px, 2.2vw, 18px);
}
.cta{
  display:flex;
  gap:16px;
  justify-content:center;
  flex-wrap:wrap;
  margin: 8px 0 28px;
}
.btn{
  text-decoration:none;
  padding:12px 18px;
  border-radius:12px;
  background: var(--btn-bg);
  color: var(--btn-fg);
  font-weight:700;
  border: 1px solid transparent;
  transition: transform .08s ease, box-shadow .2s ease, background .2s ease, color .2s ease;
  box-shadow: 0 10px 30px var(--ring);
}
.btn:hover{ transform: translateY(-1px); }
.btn:active{ transform: translateY(0); }
.btn-secondary{
  background: var(--btn2-bg);
  color: var(--btn2-fg);
  border-color: rgba(255,255,255,0.2);
  box-shadow:none;
  cursor:not-allowed;
}
.footer{
  margin-top:36px;
  color: var(--muted);
  font-size:14px;
}
/* Mobile tweaks */
@media (max-width:480px){
  .brand img{ max-width:92%; }
}