:root {
  color-scheme: light;
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  height: 100%;
  font-family: "Inter", "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  background: #F7F9FC;
  color: #1C2333;
}

a { text-decoration: none; }

.site {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 72px 24px;
}

.hero {
  width: 100%;
  padding: 48px 52px;
  border-radius: 20px;
  background: linear-gradient(180deg, #FFFFFF 0%, #FDFEFF 100%);
  border: 1px solid #E6EAF2;
  box-shadow: 0 20px 60px rgba(20, 30, 60, 0.08);
}

.badge {
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.lead {
  color: #566079;
}

.contact {
  padding-top: 8px;
}

#blazor-error-ui { display: none; }

@media (max-width: 640px) {
  .hero { padding: 36px 28px; }
}