/* ============================================================
   cta.css — final CTA section
   ============================================================ */

#contact {
  text-align: center;
  border-top: 1px solid var(--border);
}

.cta-box {
  background: var(--surface);
  border: 1px solid var(--border-accent);
  border-radius: var(--radius-lg);
  padding: 64px 48px;
  position: relative;
  overflow: hidden;
}

/* Indigo glow at top-center */
.cta-box::before {
  content: '';
  position: absolute;
  top: -80px;
  left: 50%;
  transform: translateX(-50%);
  width: 600px;
  height: 400px;
  border-radius: 50%;
  background: radial-gradient(ellipse at center, rgba(99, 102, 241, 0.12) 0%, transparent 70%);
  pointer-events: none;
}

/* Spotlight behind the CTA button */
.cta-box::after {
  content: '';
  position: absolute;
  bottom: 80px;
  left: 50%;
  transform: translateX(-50%);
  width: 240px;
  height: 80px;
  border-radius: 50%;
  background: radial-gradient(ellipse at center, rgba(99, 102, 241, 0.18) 0%, transparent 70%);
  pointer-events: none;
}

.cta-box h2 {
  font-size: 52px;
  font-weight: 700;
  letter-spacing: -2px;
  margin-bottom: 16px;
  position: relative;
}

.cta-subtext {
  font-size: 20px;
  color: var(--text-secondary);
  max-width: 480px;
  margin: 0 auto 36px;
  position: relative;
}

.cta-box .btn-primary {
  font-size: 16px;
  padding: 16px 36px;
  position: relative;
}

/* Guarantee lines */
.guarantee {
  font-size: 14px;
  color: var(--text-secondary);
  margin-top: 20px;
}

/* Scarcity line */
.cta-scarcity {
  font-size: 14px;
  color: var(--indigo);
  font-weight: 600;
  margin-top: 16px;
}

.guarantee + .guarantee {
  margin-top: 8px;
}

.guarantee .dot {
  opacity: 0.5;
}