/* wm-cta: the end-of-page call to action. Adapted from Watermelon UI (MIT), cta-1 (tinted panel, primary/10 bg,
   primary/20 border, icon + heading + text left, button right; stacks on phones). Vanilla port by SilverLion:
   we drop cta-1's blurred gradient blobs (anti-AI-look rule) and add an optional quiet rise on view
   (pair with wm-scroll-reveal) and the button press. Colours from the host: --wm-cta-accent, --wm-cta-bg. */
.wm-cta { display: flex; flex-direction: column; align-items: flex-start; gap: 24px; padding: 32px 24px; border-radius: var(--wm-cta-radius, 16px);
  background: var(--wm-cta-bg, color-mix(in oklab, var(--wm-cta-accent, currentColor) 8%, transparent));
  box-shadow: inset 0 0 0 1px color-mix(in oklab, var(--wm-cta-accent, currentColor) 20%, transparent); }
.wm-cta h2 { margin: 0 0 8px; font-size: clamp(1.5rem, 1.1rem + 1.6vw, 2.25rem); line-height: 1.1; text-wrap: balance; }
.wm-cta p { margin: 0; max-width: 46ch; opacity: 0.8; }
.wm-cta-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.wm-cta-actions > * { min-height: 48px; display: inline-flex; align-items: center; transition: transform 0.16s cubic-bezier(0.23, 1, 0.32, 1); }
.wm-cta-actions > *:active { transform: scale(0.97); }
@media (min-width: 768px) { .wm-cta { flex-direction: row; align-items: center; justify-content: space-between; gap: 48px; padding: 64px 40px; } }
@media (max-width: 480px) { .wm-cta-actions, .wm-cta-actions > * { width: 100%; justify-content: center; } }
@media (prefers-reduced-motion: reduce) { .wm-cta-actions > * { transition: none; } }
