/* Final CTA: a sealed Crate glimpsed through NullMask's keyhole. */

.final { overflow: hidden; }
.final__grid {
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
  gap: clamp(32px, 6vw, 96px);
  align-items: center;
}

.final__art { position: relative; width: 100%; max-width: 360px; justify-self: center; }
.final__keyhole { width: 100%; height: auto; overflow: visible; }
.final__scan { animation: scan 3.6s ease-in-out infinite; }
@keyframes scan {
  0%, 100% { transform: translateY(40px); }
  50% { transform: translateY(440px); }
}

.final__copy { display: grid; gap: 20px; justify-items: start; }
.final__copy .display { font-size: clamp(38px, 5.4vw, 76px); }
.final__copy .lede { color: var(--nm-dark-muted); max-width: 40ch; }
.final__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 8px; }

@media (max-width: 860px) {
  .final__grid { grid-template-columns: 1fr; }
  .final__art { max-width: 260px; order: 2; }
}
@media (max-width: 480px) {
  .final__actions { width: 100%; }
  .final__actions .btn { flex: 1 1 100%; }
}