/* Landing page mobile refinements (masquerading.com / masqueradingpets.com) */
@media (max-width: 639px) {
  #hero-section {
    padding-top: 3.5rem;
    padding-bottom: 2.75rem;
  }

  #hero-section > .absolute.top-4 {
    top: 0.75rem;
    right: 0.75rem;
    max-width: calc(100% - 1.5rem);
    padding: 0.35rem 0.65rem;
    gap: 0.35rem;
  }

  #hero-section #mask-status-off,
  #hero-section #mask-status-on {
    font-size: 0.625rem;
    letter-spacing: 0.05em;
  }

  #hero-section #mask-toggle-btn {
    height: 1.5rem;
    width: 2.75rem;
  }

  #hero-section #mask-toggle-knob {
    height: 1rem;
    width: 1rem;
  }

  #hero-title {
    font-size: clamp(1.85rem, 10vw, 2.75rem) !important;
    min-width: 0 !important;
    line-height: 0.95 !important;
    margin-bottom: 1rem;
  }

  #hero-subtitle {
    font-size: 1.125rem !important;
    line-height: 1.35;
    margin-bottom: 0.75rem;
  }

  #hero-description {
    font-size: 1rem !important;
    margin-bottom: 1.25rem;
  }

  #hero-desc-line1 {
    font-size: 1.0625rem !important;
  }

  #hero-section .hero-image-card {
    border-radius: 0.75rem;
  }

  #hero-section .mt-12.grid {
    margin-top: 1.5rem;
    gap: 0.5rem;
    margin-bottom: 1.5rem;
  }

  #hero-section .rounded-2xl.border-2.px-6 {
    padding: 0.875rem 1rem;
  }

  #hero-section .rounded-2xl.border-2 p.text-xl {
    font-size: 1.0625rem;
  }

  #hero-section .rounded-2xl.border-2 p.text-base {
    font-size: 0.875rem;
  }

  #hero-section a.rounded-full.px-10 {
    padding: 0.75rem 1.5rem;
    font-size: 0.9375rem;
    width: 100%;
    max-width: 20rem;
  }

  #main-content section {
    padding-top: 2.75rem;
    padding-bottom: 2.75rem;
  }

  #main-content .font-heading.text-5xl,
  #main-content .font-heading.text-6xl,
  #main-content .font-heading.text-7xl {
    font-size: clamp(1.75rem, 7.5vw, 2.5rem) !important;
    line-height: 1.05;
  }

  #main-content .text-xl.sm\:text-2xl,
  #main-content .text-2xl.sm\:text-3xl {
    font-size: 1rem !important;
    line-height: 1.45;
  }

  #main-content .text-lg {
    font-size: 0.9375rem;
  }

  #main-content a.rounded-full.px-10.py-5.text-xl,
  #main-content a.rounded-full.px-8.py-3 {
    padding: 0.7rem 1.25rem;
    font-size: 0.875rem;
  }

  #pricing article[style*="min-height"] {
    min-height: auto !important;
  }

  #pricing .text-4xl {
    font-size: 1.75rem;
  }

  #faq button.p-8 {
    padding: 1rem;
  }

  #faq .font-heading.text-2xl {
    font-size: 1.125rem;
  }

  #faq .w-12.h-12 {
    width: 2.25rem;
    height: 2.25rem;
  }

  #signup-banner-heading {
    font-size: 1.5rem !important;
  }

  #lanyard-section .lanyard-flip-card {
    max-width: 280px;
  }
}