/* Scoped to the homepage and product routes. Desktop layouts remain unchanged. */
@media (max-width: 767px) {
  html body[data-mobile-optimized] #app main > section,
  html body[data-mobile-optimized] #app main .mobile-reading-section { padding-block:40px !important; min-height:0 !important; }
  html body[data-mobile-optimized] #app main h1,
  html body[data-mobile-optimized] #app main h1#taw-home-title { font-size:28px !important; line-height:1.375 !important; white-space:normal !important; text-wrap:balance !important; }
  html body[data-mobile-optimized] #app main h2 { font-size:24px !important; line-height:1.375 !important; text-wrap:balance !important; }
  html body[data-mobile-optimized] #app main .home-transition h2 { font-size:28px !important; }
  html[lang="ar"] body[data-mobile-optimized] #app main :is(h1,h2) { letter-spacing:0 !important; line-height:1.5 !important; }
  html body[data-mobile-optimized] #app .mobile-reading-panel { margin-block-start:20px !important; }
  html body[data-mobile-optimized] #app :is(.hero-actions,.sx-actions,.c9-actions,.cv-actions,.ep-actions,.fr-actions,.lb-actions,.sv-actions,.security-actions) { display:flex !important; flex-wrap:wrap; gap:10px; }
  html body[data-mobile-optimized] #app main .button { min-height:44px; justify-content:center; text-align:center; }
  html body[data-mobile-optimized] #app main button { min-height:44px; }
  html body[data-mobile-optimized] #app :is(.hero-actions,.sx-actions,.c9-actions,.cv-actions,.ep-actions,.fr-actions,.lb-actions,.sv-actions,.security-actions) > a { width:100%; }
  /* Original hero copy and proof stay visible; no alternate shortened lead. */
  html body[data-mobile-optimized] #app .taw-static-copy > :is(.taw-static-eyebrow,p:not(.mobile-hero-lead)),
  html body[data-mobile-optimized] #app .sovereignty-owner { display:block !important; }
  html body[data-mobile-optimized] #app :is(.story-hero-proof,.c9-trust,.cv-trust) { display:flex !important; flex-wrap:wrap; gap:12px; margin-top:20px; }
  html body[data-mobile-optimized] #app :is(.proof-track,.company-band-stats,.metric-tabs,.sx-proof-strip,.ep-proof-band) { display:grid !important; grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:12px !important; width:100%; }
  html body[data-mobile-optimized] #app :is(.proof-track,.company-band-stats,.metric-tabs,.sx-proof-strip,.ep-proof-band) > * { min-width:0 !important; min-height:0 !important; width:auto !important; padding:14px !important; border-radius:12px; }
  html body[data-mobile-optimized] #app .proof-track { padding-inline:16px; box-sizing:border-box; }
  html body[data-mobile-optimized] #app .company-band-stats strong { font-size:28px !important; }
  html body[data-mobile-optimized] #app :is(.dashboard-proof-band > .section-shell,.sv-app-stats,.adoption-stats) { display:grid !important; grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:12px !important; }
  html body[data-mobile-optimized] #app :is(.dashboard-proof-band > .section-shell,.sv-app-stats,.adoption-stats) > * { min-width:0 !important; min-height:0 !important; padding:14px !important; }
  html body[data-mobile-optimized] #app .dashboard-proof-band strong { font-size:26px !important; overflow-wrap:anywhere; }
  /* A visible next-card edge and native scrollbar make swiping discoverable. */
  html body[data-mobile-optimized] #app :is(.story-card-grid,.screening-pipeline,.story-objection-grid,.sx-objection-grid,.cv-six-grid,.cv-proof-grid,.ep-problem-grid,.fr-pillar-grid,.lb-feature-grid,.sv-app-problem-grid,.sv-app-feed-grid,.security-controls,.c9-consequences,.c9-feature-mosaic) {
    display:flex !important; flex-direction:row !important; flex-wrap:nowrap !important; align-items:stretch !important; justify-content:flex-start !important;
    width:100% !important; max-width:100% !important; min-width:0 !important; gap:16px !important;
    overflow-x:auto !important; overflow-y:hidden !important; scroll-snap-type:x mandatory; scroll-padding-inline:2px;
    overscroll-behavior-inline:contain; padding:2px 2px 16px !important; box-sizing:border-box; scrollbar-width:thin;
  }
  html body[data-mobile-optimized] #app :is(.story-card-grid,.screening-pipeline,.story-objection-grid,.sx-objection-grid,.cv-six-grid,.cv-proof-grid,.ep-problem-grid,.fr-pillar-grid,.lb-feature-grid,.sv-app-problem-grid,.sv-app-feed-grid,.security-controls,.c9-consequences,.c9-feature-mosaic) > * {
    flex:0 0 86% !important; width:86% !important; max-width:none !important; min-width:0 !important; height:auto !important; min-height:0 !important;
    position:relative !important; inset:auto !important; transform:none !important; margin:0 !important; padding:20px !important; box-sizing:border-box; scroll-snap-align:start;
  }
  html body[data-mobile-optimized] #app .screening-pipeline::before { content:none; }
  html body[data-mobile-optimized] #app [data-mobile-swipe]:focus-visible { outline:3px solid #087a49; outline-offset:4px; }
  html body[data-mobile-optimized] #app .dashboard-v3-console { display:flex; flex-direction:column; }
  html body[data-mobile-optimized] #app .dashboard-v3-detail { order:1; width:100%; max-width:384px; margin:0 auto 20px; border:1px solid #cfdfd4; border-radius:12px; box-shadow:0 12px 28px #092e2412; }
  html body[data-mobile-optimized] #app .dashboard-v3-stage { order:2; min-width:0; }
  /* Show readable detail of the real screen, with the rest reachable by touch. */
  html body[data-mobile-optimized] #app :is(.dashboard-v3-browser,.product-story-screen) { width:100% !important; max-width:384px !important; margin-inline:auto !important; min-height:0 !important; transform:none !important; clip-path:none !important; overflow:auto !important; border-radius:12px !important; }
  html body[data-mobile-optimized] #app :is(.dashboard-v3-browser,.product-story-screen) > img { display:block !important; width:680px !important; min-width:680px !important; max-width:none !important; height:auto !important; max-height:none !important; transform:none !important; }
  html body[data-mobile-optimized] #app .product-story-hero-visual { display:block !important; min-height:0 !important; margin-top:24px; }
  html body[data-mobile-optimized] #app .product-story-screen .screen-signal { display:flex !important; position:static !important; inset:auto !important; height:auto !important; min-height:44px; width:max-content !important; max-width:100% !important; margin:8px 0 !important; transform:none !important; white-space:normal !important; }
  html body[data-mobile-optimized] #app .product-story-hero-visual > :not(.product-story-screen) { position:relative !important; inset:auto !important; transform:none !important; max-width:100% !important; margin-block:12px; }
  html body[data-mobile-optimized] #app :is(.dashboard-v3-tabs,.app-dock) { display:flex !important; flex-wrap:nowrap !important; justify-content:flex-start !important; overflow-x:auto !important; scroll-snap-type:x proximity; gap:8px !important; padding-bottom:12px !important; }
  html body[data-mobile-optimized] #app :is(.dashboard-v3-tabs,.app-dock) > button { flex:0 0 auto; width:auto !important; min-height:44px !important; scroll-snap-align:start; }
  html body[data-mobile-optimized] #app .app-dock button small { display:block !important; white-space:normal; }
  html body[data-mobile-optimized] #app .app-dock button { max-width:230px; }
  @media (min-width:640px) {
    html body[data-mobile-optimized] #app main > section { padding-block:48px !important; }
    html body[data-mobile-optimized] #app main h1 { font-size:30px !important; }
    html body[data-mobile-optimized] #app :is(.hero-actions,.sx-actions,.c9-actions,.cv-actions,.ep-actions,.fr-actions,.lb-actions,.sv-actions,.security-actions) > a { width:auto; }
  }
}