*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: #000;
  color: #374151;
  font: 16px/1.4 system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}
.hero {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  padding: 100px 20px;
  text-align: center;
  animation: fade-in 1s ease both;
}
.hero__logo { margin: 0; font-size: inherit; line-height: 0; max-width: 100%; }
.hero__logo img { display: block; max-width: 100%; height: auto; }
.hero__text { margin: 0; }
@keyframes fade-in { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .hero { animation: none; } }