:root{
  --bg-1: #0f1724;
  --bg-2: #0b1220;
  --accent: #4cc9f0;
  --muted: #9aa7b2;
  --card: rgba(255,255,255,0.03);
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial;
  background: radial-gradient(1200px 600px at 10% 10%, rgba(76,201,240,0.06), transparent), linear-gradient(180deg,var(--bg-1),var(--bg-2));
  color:#e6eef3;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  display:flex;align-items:center;justify-content:center;padding:32px;
}
.wrap{width:100%;max-width:1100px}
.card{
  display:flex;
  gap:32px;
  align-items:center;
  background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));
  border:1px solid rgba(255,255,255,0.04);
  padding:36px;border-radius:14px;backdrop-filter: blur(6px);
}
.visual img{width:420px;max-width:45vw;display:block}
.content{max-width:560px}
.brand{font-weight:800;font-size:20px;letter-spacing:0.6px;color:var(--accent)}
.brand span{font-weight:600;color:#dff6ff}
h1{margin:10px 0 6px;font-size:40px;line-height:1.02}
p{color:var(--muted);margin:0 0 18px}
.notify{display:flex;gap:12px}
.notify input{flex:1;padding:12px 14px;border-radius:10px;border:1px solid rgba(255,255,255,0.06);background:transparent;color:inherit}
.notify button{padding:12px 18px;border-radius:10px;border:none;background:var(--accent);color:#052028;font-weight:600;cursor:pointer}
.contact{margin-top:12px;color:var(--muted);font-size:14px}
.foot{margin-top:18px;color:var(--muted);font-size:13px;text-align:center}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media (max-width:800px){
  .card{flex-direction:column;align-items:center;text-align:center}
  .visual img{max-width:80vw;width:320px}
  .content{max-width:unset}
  h1{font-size:28px}
}
/* subtle floating animation for illustration */
.visual img{animation:float 6s ease-in-out infinite}
@keyframes float{0%{transform:translateY(0)}50%{transform:translateY(-10px)}100%{transform:translateY(0)}}