.promo {
  width: min(100%, 1100px);
  margin: 0 auto;
  padding: 24px 16px 40px;
}

.banner-wrap {
  position: relative;
  -webkit-mask-image:
    linear-gradient(to right, transparent 0%, black 8%, black 92%, transparent 100%),
    linear-gradient(to bottom, transparent 0%, black 8%, black 92%, transparent 100%);
  -webkit-mask-composite: source-in;
  mask-image:
    linear-gradient(to right, transparent 0%, black 8%, black 92%, transparent 100%),
    linear-gradient(to bottom, transparent 0%, black 8%, black 92%, transparent 100%);
  mask-composite: intersect;
}

.banner {
  display: block;
  width: 100%;
  height: auto;
  cursor: pointer;
  transition: filter 0.2s ease;
}

.banner:hover {
  filter: brightness(1.15);
}

.event-copy {
  margin-top: 26px;
  text-align: center;
  line-height: 1.4;
  letter-spacing: 0.03em;
}

.event-copy > div:first-child {
  font-size: clamp(1.5rem, 4vw, 2.25rem);
  font-weight: 700;
  color: var(--ink);
}

.event-copy > div:last-child {
  margin-top: 6px;
  font-size: clamp(1.1rem, 2.8vw, 1.5rem);
  font-weight: 500;
  color: var(--ink-soft);
}

.home-cta-group {
  margin-top: 28px;
  display: flex;
  justify-content: center;
  gap: 14px;
  flex-wrap: wrap;
}

.signup-slide {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.4s ease;
}

.signup-slide.open {
  max-height: 700px;
}

.signup-slide-inner {
  max-width: 600px;
  margin: 0 auto;
  padding: 32px 16px 40px;
}

@media (max-width: 640px) {
  .promo {
    padding: 16px 12px 28px;
  }

  .event-copy {
    margin-top: 18px;
  }

  .home-cta-group {
    margin-top: 22px;
  }
}

@media (max-width: 480px) {
  .home-cta-group {
    flex-direction: column;
  }

  .home-cta-group .hero-link {
    width: 100%;
  }

  .signup-slide-inner {
    padding: 24px 12px 32px;
  }
}