/*
 * Mobile sticky CTA bar (home, pricing, features). Phones only. It appears once the page's own
 * hero CTA has scrolled away, so the two never compete.
 */
.mobile-cta { display: none; }
@media (max-width: 860px) {
  .mobile-cta {
    display: flex; gap: 8px; position: fixed; z-index: 9990;
    left: 12px; right: 12px; bottom: calc(20px + env(safe-area-inset-bottom, 0px));
    height: 56px; padding: 6px; background: var(--surface, #fff); border-radius: var(--radius, 12px);
    border: 1px solid var(--hair, #DCE4DF); box-shadow: 0 8px 24px rgba(14, 26, 20, 0.14);
    transform: translateY(140%); opacity: 0; pointer-events: none;
    transition: transform 0.22s ease, opacity 0.22s ease;
  }
  .mobile-cta.is-visible { transform: none; opacity: 1; pointer-events: auto; }
  .mobile-cta a {
    flex: 1 1 0; min-width: 0; display: flex; align-items: center; justify-content: center;
    font-size: 14px; font-weight: 600; text-decoration: none; white-space: nowrap;
    overflow: hidden; text-overflow: ellipsis; padding: 0 8px; border-radius: var(--radius-sm, 8px);
  }
  .mobile-cta .mobile-cta-demo { color: var(--accent, #1B6147); border: 1px solid var(--accent-line, #BCDACB); }
  .mobile-cta .mobile-cta-signup { color: #fff; background: var(--accent, #1B6147); }
  /* Keep the last lines of the page (footer) reachable above the bar. */
  body.has-mobile-cta { padding-bottom: calc(92px + env(safe-area-inset-bottom, 0px)); }
}
@media (max-width: 860px) and (prefers-reduced-motion: reduce) {
  .mobile-cta { transition: none; }
}