/* Basic reset already covered by Tailwind. Additional customizations: */
:root{
  --blue-light:#00CFFF;
  --blue-med:#009FE3;
  --blue-deep:#0077B6;
}
html,body { height:100%; }
body {
  background: radial-gradient(800px 400px at 10% 10%, rgba(0,207,255,0.06), transparent),
              radial-gradient(900px 500px at 90% 90%, rgba(0,159,227,0.05), transparent),
              linear-gradient(180deg,#03040a 0%, #071026 50%, #02040a 100%);
  color: #e6f4ff;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
}
.glass {
  background: linear-gradient(180deg, rgba(255,255,255,0.03), rgba(255,255,255,0.02));
  border: 1px solid rgba(255,255,255,0.05);
  backdrop-filter: blur(10px) saturate(120%);
  box-shadow: 0 10px 40px rgba(3,6,18,0.6);
}
.button-neon{
  background: linear-gradient(90deg,var(--blue-light),var(--blue-med));
  color:#00101a;
  font-weight:700;
  box-shadow: 0 8px 30px rgba(0,159,227,0.18), inset 0 -3px 6px rgba(255,255,255,0.03);
  border-radius:14px;
  padding:12px 18px;
}
.logo-wrap img{ height:44px; filter: drop-shadow(0 6px 18px rgba(0,207,255,0.08)); }
.hero-gradient-text{
  background: linear-gradient(90deg,var(--blue-light), var(--blue-deep));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.card-tilt{ transform-style: preserve-3d; perspective:1200px; }
.card-inner{ transition: transform .35s cubic-bezier(.2,.9,.2,1); }
.card-inner:hover{ transform: rotateX(6deg) rotateY(-6deg) translateY(-6px) translateZ(8px); }
.input-glow { background: rgba(255,255,255,0.02); border:1px solid rgba(255,255,255,0.06); padding:12px 14px; border-radius:10px; color: #dff6ff; }
.footer-note { color: #9fb3c8; font-size:0.95rem; }