.hero { grid-template-columns: minmax(0, 1fr) 350px; gap: 36px; align-items: center; }
.hero > .discord-community-widget { justify-self: center; }
@media (max-width: 900px) { .hero { grid-template-columns: minmax(0, 1fr); } }
.discord-community-widget {
  position: relative; width: min(100%, 350px); min-width: 0; padding: 14px; box-sizing: border-box;
  border: 1px solid rgba(72, 199, 216, .32); border-radius: 18px;
  background: rgba(8, 22, 37, .96); box-shadow: 0 16px 48px rgba(0, 0, 0, .25);
}
.discord-widget-label {
  margin: 0 0 12px; color: #d9b66b; font-size: 14px; font-weight: 700;
  letter-spacing: .08em; text-transform: uppercase; overflow-wrap: anywhere;
}
.discord-community-widget iframe { display: block; width: 100%; max-width: 350px; height: 500px; border: 0; border-radius: 8px; }
.discord-community-widget > a {
  display: block; margin-top: 12px; padding: 12px; border-radius: 8px; color: #effaff;
  background: #173b50; text-align: center; font-weight: 700; text-decoration: none; overflow-wrap: anywhere;
}
.discord-community-widget > a:hover { background: #215570; }
.discord-community-widget > a:focus-visible { outline: 3px solid #4bd7e5; outline-offset: 3px; }