* { box-sizing: border-box; }
body {
  margin: 0; min-height: 100vh; color: #e6edf3;
  font-family: "Segoe UI", Roboto, system-ui, -apple-system, sans-serif;
  background: radial-gradient(1200px 700px at 70% -10%, #16324a 0%, #0b0f14 55%);
  display: flex; align-items: center; justify-content: center; padding: 20px;
}
.wrap { width: 100%; max-width: 560px; }
.card {
  background: linear-gradient(180deg, #141c28, #10161f);
  border: 1px solid #24303f; border-radius: 18px; padding: 32px 26px;
  box-shadow: 0 20px 60px rgba(0,0,0,.45); text-align: center; margin-bottom: 18px;
  animation: rise .35s ease;
}
@keyframes rise { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.pulse {
  font-size: 44px; width: 84px; height: 84px; line-height: 84px; margin: 0 auto 14px;
  border-radius: 50%; background: rgba(0,226,255,.08); border: 1px solid rgba(0,226,255,.3);
  box-shadow: 0 0 0 0 rgba(0,226,255,.5); animation: ring 2.2s infinite;
}
@keyframes ring { 0% { box-shadow: 0 0 0 0 rgba(0,226,255,.45); } 70% { box-shadow: 0 0 0 22px rgba(0,226,255,0); } 100% { box-shadow: 0 0 0 0 rgba(0,226,255,0); } }
h1 { font-size: 24px; margin: 0 0 12px; }
h2 { font-size: 20px; margin: 0 0 18px; color: #00e2ff; }
h3 { font-size: 14px; text-transform: uppercase; letter-spacing: .8px; color: #8595a7; margin: 0 0 10px; }
.lead { color: #b7c3d0; line-height: 1.6; font-size: 15px; margin: 0 0 22px; }
.cta {
  border: none; border-radius: 12px; padding: 15px 22px; width: 100%;
  font-size: 16px; font-weight: 700; cursor: pointer; color: #041016;
  background: linear-gradient(90deg, #00e2ff, #16d1a0);
  transition: filter .15s, transform .05s;
}
.cta:hover { filter: brightness(1.08); }
.cta:active { transform: translateY(1px); }
.cta:disabled { opacity: .6; cursor: default; }
.fine { color: #6b7a8d; font-size: 12.5px; margin: 14px 0 0; }
.reveal { text-align: left; }
.section { margin-bottom: 20px; }
.grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 16px; }
.grid > div { display: flex; flex-direction: column; background: #1a2432; border: 1px solid #24303f; border-radius: 8px; padding: 8px 10px; }
.grid .k { font-size: 11px; color: #8595a7; }
.grid .v { font-size: 14px; font-weight: 600; word-break: break-word; }
.maplink { display: inline-block; margin-top: 12px; color: #00e2ff; text-decoration: none; font-weight: 600; }
.maplink:hover { text-decoration: underline; }
.takeaway { background: rgba(255,176,32,.08); border: 1px solid rgba(255,176,32,.35); color: #ffe6b8; border-radius: 10px; padding: 14px 16px; font-size: 13.5px; line-height: 1.55; }
.hidden { display: none; }
@media (max-width: 460px) { .grid { grid-template-columns: 1fr; } }
