* { box-sizing:border-box; margin:0; padding:0; }
body.bg {
  min-height:100vh;
  background: radial-gradient(circle at 20% 20%, #0f172a 0%, #000000 70%);
  color:#e2e8f0;
  font-family: 'Segoe UI', system-ui, sans-serif;
  overflow-x:hidden;
  position:relative;
}
.hero {
  max-width:1100px;
  margin:0 auto;
  padding:2rem 1.25rem 6rem;
  text-align:center;
  position:relative;
  z-index:2;
}
h1 {
  font-size:2.4rem;
  font-weight:600;
  color:#6ee7b7;
  text-shadow:0 0 20px rgba(16,185,129,.6);
}
@media(min-width:600px){
  h1 { font-size:2.8rem; }
}
.tagline {
  color:#5eead4;
  margin-top:.5rem;
  font-size:1.05rem;
}
.pitch {
  margin:1rem auto 2rem;
  max-width:640px;
  font-size:1rem;
  line-height:1.5rem;
  color:#7dd3fc;
}
.cta-row {
  display:flex;
  flex-wrap:wrap;
  gap:1rem;
  justify-content:center;
  margin-bottom:2rem;
}
.btn {
  background:#0ea5e9;
  color:#fff;
  border:none;
  border-radius:.5rem;
  padding:.8rem 1rem;
  font-size:1rem;
  font-weight:500;
  text-decoration:none;
  min-width:180px;
  box-shadow:0 10px 30px rgba(14,165,233,.4);
  transition:all .2s;
}
.btn:hover {
  background:#0284c7;
  box-shadow:0 20px 40px rgba(14,165,233,.6);
}
.btn.alt{
  background:#475569;
  box-shadow:none;
}
.grid {
  margin:2rem auto;
  display:grid;
  grid-template-columns:1fr;
  gap:1rem;
  max-width:900px;
}
@media(min-width:700px){
  .grid { grid-template-columns:1fr 1fr; }
}
.card {
  background:rgba(15,23,42,0.6);
  border:1px solid rgba(14,165,233,.3);
  border-radius:1rem;
  padding:1rem 1.25rem;
  box-shadow:0 30px 80px rgba(0,0,0,.8), 0 0 80px rgba(14,165,233,.2) inset;
  backdrop-filter:blur(6px);
  text-align:left;
}
.card h2 {
  color:#38bdf8;
  font-size:1.05rem;
  margin-bottom:.5rem;
}
.card p {
  color:#bae6fd;
  font-size:.95rem;
  line-height:1.4rem;
}
.foot-note{
  margin-top:2rem;
  font-size:.8rem;
  color:#64748b;
}

/* Dashboard layout */
.panel-wrap{
  max-width:1100px;
  margin:0 auto;
  padding:2rem 1rem 4rem;
  display:grid;
  grid-template-columns:1fr;
  gap:1rem;
}
@media(min-width:800px){
  .panel-wrap{
    grid-template-columns:1fr 1fr;
  }
}
.panel{
  background:rgba(15,23,42,0.6);
  border:1px solid rgba(16,185,129,.2);
  border-radius:1rem;
  padding:1rem 1.25rem;
  box-shadow:0 30px 80px rgba(0,0,0,.8), 0 0 80px rgba(16,185,129,.2) inset;
  backdrop-filter:blur(6px);
}
.panel h2{
  color:#6ee7b7;
  font-size:1rem;
  margin-bottom:.5rem;
}
.panel p, .panel li{
  color:#cbd5e1;
  font-size:.9rem;
  line-height:1.4rem;
}
.statlist{
  list-style:none;
  padding-left:0;
}
.statlist li{
  margin-bottom:.4rem;
}
.map-placeholder{
  background:#1e293b;
  border:1px solid rgba(16,185,129,.4);
  border-radius:.5rem;
  color:#94a3b8;
  font-size:.8rem;
  text-align:center;
  padding:2rem 1rem;
  margin-top:.5rem;
}
.footer-note{
  grid-column:1 / -1;
  text-align:center;
}

/* Floating ambient emojis */
.float {
  position:absolute;
  font-size:2rem;
  opacity:.12;
  animation: floaty 22s linear infinite;
  pointer-events:none;
}
.float1 { left:10%; top:70%; }
.float2 { left:80%; top:20%; animation-duration:28s; }
.float3 { left:20%; top:30%; animation-duration:18s; }
.float4 { left:60%; top:80%; animation-duration:25s; }
@keyframes floaty {
  0% { transform:translateY(0) translateX(0) scale(1); }
  50%{ transform:translateY(-40px) translateX(20px) scale(1.1); }
 100%{ transform:translateY(0) translateX(0) scale(1); }
}

/* Mobile tweaks */
@media(max-width:600px){
  h1 { font-size:2rem; }
  .btn { width:100%; font-size:1rem; min-width:auto; }
  .panel-wrap { grid-template-columns:1fr; }
  .panel h2 { font-size:1rem; }
  .panel p, .panel li { font-size:.9rem; }
}