.project-fallback {
  height: 100%;
  display: grid;
  place-content: center;
  gap: 10px;
  text-align: center;
  background:
    radial-gradient(circle at 50% 45%, rgba(55, 215, 255, .13), transparent 35%),
    linear-gradient(135deg, var(--panel), #050911);
}
.project-fallback strong { font-size: 32px; letter-spacing: -.04em; }

.btn.btn-primary {
  border-color: transparent;
  background: linear-gradient(110deg, var(--cyan), var(--purple));
  color: #041018;
}

.hero-grid > * { min-width: 0; }

@media (max-width: 480px) {
  .shell { width: calc(100% - 28px); }
  .brand { gap: 9px; }
  .brand img { width: 44px; height: 44px; }
  .brand strong { font-size: 13px; }
  .brand small { font-size: 7px; letter-spacing: .12em; }
  .menu-toggle { flex: 0 0 auto; }
  .hero h1 { font-size: clamp(42px, 13.5vw, 54px); }
  .lead { overflow-wrap: anywhere; }
  .actions { align-items: stretch; }
  .actions .btn { flex: 1 1 auto; }
}