/* Shared responsive layer, loaded after the page styles. Keep desktop layouts
   intact; constrain content instead of hiding page-level horizontal overflow. */

@media (max-width: 1100px) {
  .product-hero > *, .hero > *, .pricing-grid > *, .heading-row > *,
  .tool-grid > *, .tool-workspace > *, .cleaner-plans > *,
  .guide-index > *, .detail-grid > *, .dash-stats > * { min-width: 0; }
  .heading-row h1, .editorial-heading h1, .tool-card h2,
  .reading-card h2, .reading-card h3 { overflow-wrap: anywhere; }
}

@media (max-width: 800px) {
  h1, h2, h3, .eyebrow, .overline, .breadcrumbs { overflow-wrap: anywhere; }
  .product-copy h1, .hero-copy h1, .lt-hero-copy > h1 {
    font-size: clamp(34px, 9vw, 56px); line-height: 1.08; letter-spacing: -1.5px;
  }
  .editorial-heading h1, .heading-row h1 {
    font-size: clamp(32px, 8vw, 44px); line-height: 1.12; letter-spacing: -1px;
  }
  .product-lead, .lead, .heading-row p, .editorial-deck { font-size: 16px; line-height: 1.75; }
  .eyebrow, .product-copy .eyebrow, .overline { font-size: 10px; line-height: 1.6; }
  .hero-actions { align-items: stretch; gap: 16px; }
  .home-primary, .home-secondary, .plan-button, .primary-button,
  .secondary-button, .tool-button, .offer-primary, .dash-primary {
    min-height: 48px; font-size: 14px; line-height: 1.5; max-width: 100%;
  }
  .home-primary, .tool-button, .plan-button, .primary-button, .dash-primary { gap: 12px; }
  .hero-caption, .plan-foot, .pricing-disclosure { font-size: 12px; }
  .product-ribbon p, .workflow-step p, .craft-grid p, .proof-section > div > p,
  .plan-card ul, .home-faq .faq-list p, .faq-list p, .tool-card p,
  .premium-workflow p, .premium-benefits li { font-size: 14px; line-height: 1.8; }
  .faq-list summary { font-size: 15px; min-height: 44px; align-items: center; }
  .pricing-grid-three { grid-template-columns: 1fr; max-width: 520px; }
  .plan-card h3, .plan-allowance { font-size: 15px; }
  .plan-price { flex-wrap: wrap; }
  .plan-top { flex-wrap: wrap; }
  .home-footer > div { flex-wrap: wrap; gap: 16px 24px; }
  footer a { display: inline-flex; align-items: center; min-height: 44px; }
  .footer-legal { display: flex; flex-wrap: wrap; gap: 0 18px; font-size: 12px; }

  /* 16px text avoids automatic zoom while editing forms on iOS. */
  .field input, .field select, .field textarea, .login-input,
  .library-controls input, .library-controls select, .prompt-output textarea {
    font-size: 16px; min-height: 44px; min-width: 0;
  }
  .field, .login-label, .panel-note, .field-help { font-size: 13px; }
  .fields.two { grid-template-columns: 1fr; }
  .tool-panel fieldset { min-width: 0; }
  .tool-panel, .prompt-output, .earnings-output, .measurement-panel { padding: 24px 20px; }
  .output-actions, .panel-heading, .checker-top, .result-actions { flex-wrap: wrap; }
  .checker-top { align-items: flex-start; }
  .consent, .allowance, .checker-bottom, .interpretation { font-size: 12px; }
  .consent input { width: 18px; height: 18px; }
  .checker-bottom { flex-wrap: wrap; text-align: center; }
  .money-lines dd, .measurement-grid > div, .account-card dd { min-width: 0; overflow-wrap: anywhere; }
  .measurement-grid dd { font-size: clamp(26px, 8vw, 40px); }
  .tool-feedback { max-width: 100%; }
  .premium-discovery-links > a { flex-wrap: wrap; }
  .lt-button { min-height: 48px; font-size: 14px; }
  .lt-lead { font-size: 16px; }
  .lt-benefits p, .lt-tool-card p, .lt-section-heading > p { font-size: 14px; }
  .lt-footer > div { flex-wrap: wrap; }
  .cleaner-plan { min-width: 0; padding: 22px 18px; }
  .cleaner-plan .premium-cta { white-space: normal; padding: 14px; }

  /* Wide comparisons scroll inside their own labelled, keyboard-focusable area. */
  .article-table-wrap { overflow-x: auto; overscroll-behavior-x: contain; }
  .article-table-wrap table { min-width: 520px; }
  .lt-plan-compare .article-table-wrap table { font-size: 14px; }
  .article-table-wrap th, .article-table-wrap td { font-size: 14px; padding: 12px; overflow-wrap: normal; }
  .article-body { min-width: 0; }
  .article-body p, .article-body li { font-size: 16px; }
  .article-offer { padding: 22px 18px; }
  .article-body .offer-primary { width: 100%; text-align: center; font-size: 15px; }
  .offer-actions { align-items: stretch; }
  .offer-actions > a { min-height: 44px; display: inline-flex; align-items: center; }
  .editorial-cta .secondary-button { white-space: normal; text-align: center; }
  .legal table { table-layout: fixed; overflow-wrap: anywhere; }

  .dash-sidebar nav a { min-height: 44px; font-size: 13px; }
  .dash-heading p, .clean-drop > span, .clean-hint, .detail-note { font-size: 13px; }
  .clean-drop button { min-height: 44px; font-size: 14px; }
  .library-controls { min-width: 0; }
  .library-controls > label { max-width: 100%; min-width: 0; }
  .track-table { min-width: 600px; }
  .track-table td { font-size: 13px; }
  .track-title, .track-table td:last-child button, .track-table td:last-child a {
    min-height: 44px; font-size: 13px; display: inline-flex; align-items: center;
  }
  .track-table-wrap { max-width: 100%; }
  .detail-heading > div { min-width: 0; }
  .detail-attempts li { flex-wrap: wrap; }
  .dashboard .dash-footer { flex-wrap: wrap; gap: 16px; }
}

@media (max-width: 480px) {
  .product-hero, .hero { padding: 30px 20px 36px; gap: 30px; }
  .hero-actions { flex-direction: column; }
  .hero-actions > a { width: 100%; justify-content: center; }
  .signal-console { padding: 18px; }
  .console-top { flex-wrap: wrap; padding-bottom: 18px; }
  .console-brand, .console-note, .signal-label { font-size: 9px; }
  .console-tabs button { font-size: 13px; min-height: 44px; }
  .console-detail p { font-size: 13px; }
  .console-caption { font-size: 10px; }
  .console-detail { min-height: 0; padding-bottom: 16px; }
  .product-ribbon, .home-section, .closing-section { margin-left: 20px; margin-right: 20px; }
  .proof-section { margin-left: 20px; margin-right: 20px; padding: 24px 20px; }
  .plan-card { padding: 24px 20px; }
  .cleaner-milestone { align-items: flex-start; }
  .cleaner-milestone-number { font-size: 32px; }
  .cleaner-milestone p, .cleaner-milestone a { font-size: 12px; }
  .tool-heading, .editorial-heading { padding-left: 20px; padding-right: 20px; }
  .tool-workspace, .premium-access, .premium-discovery { margin-left: 16px; margin-right: 16px; }
  .premium-access { padding: 26px 16px 0; }
  .premium-access h2 { font-size: 28px; }
  .article-body { padding-left: 20px; padding-right: 20px; }
  .article-toc, .article-callout { padding: 18px; }
  .offer-actions { flex-direction: column; }
  .editorial-cta { margin-left: 20px; margin-right: 20px; padding: 22px; }
  .dash-stats { grid-template-columns: 1fr; }
  .dash-stats > div, .dash-stats > div:first-child {
    padding: 12px 0; flex-direction: row; align-items: center;
    border-right: 0; border-bottom: 1px solid var(--line);
  }
  .dash-stats span { font-size: 13px; }
  .clean-card-heading { flex-wrap: wrap; }
  .clean-format { font-size: 10px; }
  .dash-sidebar nav { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
  .clean-automatic p, .clean-batch-note, .clean-foot { font-size: 12px; line-height: 1.8; }
}
