/* ProteinText mobile-only presentation. Shared content and components live in shared.css. */
@media (max-width: 720px) {
  body { overflow-x: clip; }
  /* Single column, in DOM order: headline, conversation, button. */
  .hero { display: block; }
  .hero-demo { margin-top: 28px; }
  .hero-actions { margin-top: 28px; }
  .hero-cta { width: 100%; padding: 0 20px; }
  .hero-price { text-align: center; }
  .steps { grid-template-columns: 1fr; }
  .faq-grid { grid-template-columns: 1fr; }
}

@media (max-width: 600px) {
  body { overflow-x: clip; }
  .site-header { height: 60px; }
  .nav-wrap { width: calc(100% - 32px); }
  /* The header button competed with the hero button for the same first
     screen; the sticky bar carries the call to action further down. */
  .nav-link, .nav-cta { display: none; }
  .brand { gap: 9px; font-size: 18px; font-weight: 700; }
  .brand-mark { width: 29px; height: 25px; }

  .hero { width: calc(100% - 32px); padding: 44px 0 52px; }
  .hero h1 { font-size: clamp(38px, 11vw, 46px); letter-spacing: -0.05em; }
  .hero-lede { margin-top: 18px; font-size: 17px; }
  .hero-demo { margin-top: 26px; }
  .demo-card { padding: 18px 18px 22px; border-radius: 22px; }
  .demo-label { margin-bottom: 14px; }
  .bubble { margin: 9px 0; font-size: 15.5px; }
  .hero-actions { margin-top: 26px; }

  .section { padding: 60px 0; }
  .container, .container.narrow, .legal-document, .footer-wrap { width: calc(100% - 32px); }
  .section-heading { margin-bottom: 28px; }
  .steps { gap: 26px; }
  .faq-grid { gap: 26px; }
  .founder-strip { padding: 56px 0; }
  .founder-strip .container { text-align: left; }

  .signup-section { padding-bottom: 72px; }
  .signup-head { margin-bottom: 22px; text-align: left; }
  .signup-price { justify-content: flex-start; }
  .signup-card { padding: 24px 20px 22px; border-radius: 20px; }
  .consent-row { margin: 16px 0; padding: 13px 14px; }

  .legal-main { padding: 44px 0 68px; }
  .legal-document h2 { font-size: 25px; }
  .privacy-promise { padding: 20px; font-size: 18px; }
  .story-cta { padding: 26px 22px; }
  .story-cta .button { width: 100%; }

  .footer-wrap { flex-direction: column; align-items: flex-start; gap: 16px; }
  .site-footer { padding: 30px 0 calc(30px + var(--sticky-cta-space, 0px)); }

  .sticky-cta {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 30;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 11px 16px calc(11px + env(safe-area-inset-bottom));
    background: var(--paper);
    border-top: 1px solid var(--line);
    box-shadow: 0 -10px 30px rgba(38, 30, 18, 0.10);
    transform: translate3d(0, 110%, 0);
    transition: transform 260ms cubic-bezier(0.16, 1, 0.3, 1);
  }
  .sticky-cta[hidden] { display: flex; }
  .sticky-cta.is-shown { transform: translate3d(0, 0, 0); }
  .sticky-cta-info { display: grid; gap: 1px; overflow: hidden; }
  .sticky-cta-price { font-size: 16px; font-weight: 800; letter-spacing: -0.02em; }
  .sticky-cta-note { color: var(--muted); font-size: 13px; font-weight: 600; }
  .sticky-cta-button {
    flex: 0 0 auto;
    min-height: 48px;
    padding: 0 26px;
    display: grid;
    place-items: center;
    border-radius: 10px;
    background: var(--evergreen);
    color: #fff;
    font-size: 16px;
    font-weight: 800;
    text-decoration: none;
  }
}

@media (max-width: 400px) {
  body { font-size: 16px; }
  .hero h1 { font-size: clamp(34px, 11vw, 42px); }
  .signup-card { padding-inline: 18px; }
  .footer-links { gap: 12px 18px; }
  .sticky-cta-button { padding: 0 20px; }
}

@media (prefers-reduced-motion: reduce) {
  .sticky-cta { transition: none; }
}