.mid-cta {
  margin: 2rem 0;
  padding: 1.5rem;
  background: var(--color-surface);
  border: 2px solid var(--color-accent);
  border-radius: var(--radius-lg);
  text-align: center;
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.5s ease, transform 0.5s ease;
}
.mid-cta.is-visible {
  opacity: 1;
  transform: translateY(0);
}
.mid-cta__inner { max-width: 500px; margin: 0 auto; }
.mid-cta__hook {
  font-size: 1.1rem; font-weight: 600; margin-bottom: 1rem;
  color: var(--color-text);
}
.mid-cta__buttons {
  display: flex; gap: 0.75rem; justify-content: center;
  flex-wrap: wrap; margin-bottom: 0.75rem;
}
.mid-cta__btn {
  display: inline-block; padding: 0.65rem 1.5rem;
  border-radius: var(--radius-sm); font-weight: 600;
  text-decoration: none; font-size: 0.95rem;
  transition: background 0.2s, transform 0.1s;
}
.mid-cta__btn:active { transform: scale(0.98); }
.mid-cta__btn--primary {
  background: var(--color-accent); color: #fff !important;
}
.mid-cta__btn--primary:hover { background: var(--color-accent-hover); }
.mid-cta__btn--secondary {
  background: transparent; color: var(--color-accent);
  border: 2px solid var(--color-accent);
}
.mid-cta__btn--secondary:hover { background: var(--color-accent); color: #fff !important; }
.mid-cta__sub { font-size: 0.85rem; color: var(--color-text); opacity: 0.7; }
.mid-cta__sub a { color: var(--color-accent); }
/* Dark mode */
[data-theme="dark"] .mid-cta { background: var(--color-surface); border-color: var(--color-accent); }
[data-theme="dark"] .mid-cta__btn--primary { background: var(--color-accent); color: #fff !important; }
[data-theme="dark"] .mid-cta__btn--secondary:hover { background: var(--color-accent); color: #fff !important; }