/* Shared mobile layout and touch controls. Desktop styles stay in their sections. */
@media (max-width: 600px) {
  body .wrap { padding-inline: 20px; }
  body .hero { padding-top: 30px; gap: 28px; }
  body .hero h1 { font-size: clamp(32px, 9vw, 42px); line-height: 1.15; letter-spacing: -1.4px; }
  body .hero h1 br { display: none; }
  body .hero-copy > p { font-size: 15px; }
  body .actions { align-items: stretch; gap: 12px; }
  body .actions .button { width: 100%; }
  body .actions .text-link { display: flex; align-items: center; justify-content: center; min-height: 44px; width: 100%; }
  body .page-hero h1 { font-size: clamp(30px, 8.5vw, 38px); line-height: 1.15; }
  body .page-hero p { font-size: 15px; }
  body .feature-grid { grid-template-columns: 1fr; gap: 26px; }
  body .feature-grid article { display: grid; grid-template-columns: 44px minmax(0, 1fr); column-gap: 16px; }
  body .feature-grid .feature-icon { grid-row: span 2; }
  body .feature-grid h3 { margin: 0 0 8px; }
  body .wordpress-tools-bottom .button { white-space: normal; width: 100%; }
  body .credits { margin-inline: 20px; padding-inline: 24px; }
  body .credits h2, body .section-heading h2, body .questions-intro h2 { font-size: 30px; }
  body .console-top { flex-wrap: wrap; padding: 16px; }
  body .console-top > span:not(.demo) { flex: 1; }
  body .demo { font-size: 10px; }
  body .metrics { gap: 12px; }
  body .metrics > div { min-width: 0; }
  body .metrics span { font-size: 10px; }
  body .workflow-controls { flex-wrap: wrap; }
  body .workflow-controls button, body .stack-tabs button, body .blog-filters button { min-height: 44px; }
  body .wordpress-tools-grid a { display: inline-flex; align-items: center; min-height: 44px; }
  body .pricing-controls { grid-template-columns: 1fr; gap: 18px; }
  body .pricing-controls label:nth-child(2) { grid-row: auto; grid-column: auto; }
  body .pricing-controls select { font-size: 16px; min-height: 48px; }
  body .pricing-table tr { padding: 22px; gap: 20px 16px; }
  body .pricing-contract, body .pricing-contract .button { width: 100%; }
  body .pricing-custom a { width: 100%; }
  body .brief-guide-contact { margin-top: 20px; }
  body .brief-field label { flex-wrap: wrap; gap: 3px 8px; }
  body .brief-success { padding: 16px; gap: 12px; }
  body .brief-success h3 { font-size: 18px; }
  body .docs-sidebar nav { grid-template-columns: 1fr; }
  body .docs-sidebar summary { min-height: 44px; display: list-item; }
  body .docs-content h1 { font-size: 34px; }
  body .docs-search-controls { flex-wrap: wrap; }
  body .docs-search-controls input { flex-basis: 100%; width: 100%; }
  body .docs-search-controls button { min-height: 44px; width: 100%; }
  body .docs-content section { scroll-margin-top: 92px; }
  body .blog-toc nav { max-height: 200px; overflow-y: auto; }
  body .blog-toc a { padding-block: 5px; }
  body .blog-conversion-actions, body .blog-conversion .button { width: 100%; }
  body .site-footer-grid nav a { min-height: 36px; display: flex; align-items: center; }
  body .site-footer-legal { flex-direction: column; align-items: start; gap: 2px; }
  body .site-footer-legal a { min-height: 40px; white-space: normal; }
  body .site-footer { padding-bottom: 80px; }
  body .site-footer-company, body .site-footer-contact { overflow-wrap: anywhere; }
  body .site-menu-toggle { min-width: 44px; min-height: 44px; justify-content: center; }
  body .site-primary-nav > a[aria-current=page] { background: var(--brand-surface); border-radius: 6px; padding-inline: 12px; }
}
@media (max-width: 359px) {
  body .site-brand img { width: 140px; }
  body .site-brand > span { font-size: 14px; }
  body .workflow-steps { grid-template-columns: 1fr; }
  body .workflow-step { min-height: 60px; }
  body .site-footer-grid { grid-template-columns: 1fr; }
  body .site-header-actions { flex-wrap: wrap; gap: 16px; }
}