@media (max-width: 360px) {
  :root {
    --page-inline-padding: 0.9rem;
  }

  .page:not(.landing-page) {
    padding-top: calc(var(--safe-top) + 0.85rem);
  }

  .card-padding {
    padding: 0.9rem;
  }
}

@media (min-width: 481px) {
  body {
    background:
      radial-gradient(circle at top, rgba(255, 47, 117, 0.08), transparent 35%),
      var(--color-bg);
  }

  .app-shell {
    max-width: var(--mobile-max-width);
  }
}

/* Keep the mobile funnel width stable on tablets/desktops. */
@media (min-width: 768px) {
  :root {
    --mobile-max-width: 430px;
  }
}

@media (hover: hover) {
  .primary-button:hover,
  .green-button:hover,
  .test-link:hover {
    transform: translateY(-1px);
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    transition: none !important;
    scroll-behavior: auto !important;
  }
}