/* Mobile reading layout. Desktop composition stays unchanged. */
@media (max-width: 720px) {
  html, body { width: 100%; max-width: 100%; overflow-x: clip; }
  body { font-size: 16px; }
  main, section, header, footer, article, aside, figure, div, nav, form { min-width: 0; }
  img, svg, canvas, table { max-width: 100%; }
  h1, h2, h3, p, li, summary, .button, .closing-promises span {
    line-break: strict;
    text-wrap: pretty;
    word-break: normal;
    overflow-wrap: break-word;
  }
  .section, .compact-expansion { padding: 56px 20px; }
  .section-head, .compact-expansion .section-head { margin-bottom: 28px; }
  .section-head h2, .overview .section-head h2, .agents .section-head h2 {
    font-size: clamp(1.45rem, 6vw, 1.85rem);
    line-height: 1.5;
    letter-spacing: -.025em;
    white-space: normal;
    word-break: normal;
    overflow-wrap: break-word;
    text-wrap: pretty;
  }
  .section-head > p:last-child:not(.eyebrow) { font-size: 1rem; margin-top: 16px; }
  .site-header, .site-header.scrolled { height: 62px; gap: 10px; }
  .brand small { display: inline; }
  .nav { overflow-y: auto; padding-bottom: max(24px, env(safe-area-inset-bottom)); }
  .nav a { font-size: 1rem; }
  .hero-main { padding: 36px 20px 24px; }
  .hero .eyebrow { font-size: .875rem; letter-spacing: .04em; margin-bottom: 18px; }
  .hero h1 { font-size: clamp(1.65rem, 7vw, 2.25rem); line-height: 1.4; letter-spacing: -.035em; word-break: normal; overflow-wrap: break-word; margin-bottom: 20px; }
  .hero-lead { font-size: 1rem; line-height: 1.85; margin-bottom: 24px; }
  .button { font-size: .9375rem; padding: 14px 16px; line-height: 1.55; height: auto; min-height: 52px; gap: 8px; }
  .hero-actions { gap: 10px; }
  .hero-visual { margin-top: 26px; box-shadow: none; }
  .hero-visual img { width: 100%; height: auto; }
  .hero-visual figcaption { font-size: .75rem; padding: 10px; }
  .proof-bar { margin: 0 20px 24px; padding: 16px; }
  .proof-bar p { font-size: .875rem; line-height: 1.85; }
  .proof-bar small { font-size: .8125rem; line-height: 1.8; margin-top: 10px; }
  .overview { min-height: auto; }
  .feature-row { grid-template-columns: 28px minmax(0, 1fr); padding: 20px 12px; gap: 10px; }
  .feature-row > b { font-size: 1.25rem; align-self: start; margin-top: 5px; }
  .feature-row h3 { font-size: 1.08rem; line-height: 1.55; word-break: normal; }
  .feature-row div > span, .feature-row > i { font-size: .8125rem; }
  .feature-row p { font-size: .875rem; line-height: 1.75; margin-top: 8px; }
  .fineprint, .cost-note { font-size: .75rem; line-height: 1.8; }
  .agents .agent-grid { gap: 24px; }
  .agents .agent-card, .agents .agent-card.manager { display: block; padding: 22px 16px; min-width: 0; }
  .agent-card h3 { font-size: 1.24rem; line-height: 1.6; margin: 0 0 18px; word-break: normal; }
  .agents .agent-card h3 small { font-size: 1rem; line-height: 1.6; margin-bottom: 8px; }
  .agents .agent-card .agent-details { display: block; margin-top: 0; }
  .conversation { padding: 16px; font-size: 1rem; line-height: 1.85; }
  .conversation b, .agent-abilities > span { font-size: .875rem; }
  .agents .agent-details .agent-abilities { margin-top: 14px; padding: 14px 16px; border: 0; }
  .agent-abilities li { font-size: .9375rem; line-height: 1.7; }
  .ribbon { position: static; display: inline-block; margin-bottom: 14px; font-size: .8125rem; }
  .all-customers { margin-top: 32px; }
  .all-customers strong { font-size: 1.2rem; word-break: normal; }
  .all-customers span { font-size: .8125rem; }
  .more-agents-inline { margin-top: 24px; padding: 18px 14px; }
  .more-agents-kicker, .more-agents-inline .role-list span { font-size: .9375rem; }
  .more-agents-inline .role-list p, .more-agents-inline .bridge-copy p { font-size: .875rem; line-height: 1.75; }
  .more-agents-inline .role-list b { font-size: .8125rem; }
  .foundation-layer { padding: 20px 14px; }
  .foundation-layer strong { font-size: 1.25rem; }
  .foundation-layer strong small { display: block; font-size: .875rem; margin-top: 4px; }
  .foundation-layer span, .foundation-points p { font-size: .9375rem; }
  .foundation-conclusion { padding: 18px; margin-top: 28px; font-size: .9375rem; }
  .route { padding: 22px 18px; }
  .route h3 { font-size: 1.3rem; line-height: 1.55; }
  .route header span, .route li b { font-size: .875rem; }
  .route li { grid-template-columns: 58px minmax(0, 1fr); gap: 10px; }
  .route li span { font-size: .9375rem; }
  .route-goal > strong { font-size: 1rem; padding: 20px; text-align: left; }
  .replace-tools > h3 { font-size: 1.2rem; padding: 20px 18px; }
  .replace-tools article { padding: 14px 18px; }
  .replace-tools b { font-size: .9375rem; }
  .replace-tools p { font-size: .875rem; margin-top: 3px; }
  .cost-comparison { padding: 22px 14px; box-shadow: none; }
  .cost-head { flex-direction: column; gap: 10px; }
  .cost-head h3 { font-size: 1.2rem; word-break: normal; overflow-wrap: break-word; }
  .cost-conditions p { font-size: .875rem; padding: 14px; }
  .cost-conditions strong { font-size: .9375rem; }
  .cost-chart { grid-template-columns: 18px minmax(0, 1fr); gap: 6px; height: 242px; }
  .chart-scale { height: 210px; font-size: .75rem; }
  .chart-plot { height: 242px; }
  .bar-group { grid-template-rows: 210px 32px; }
  .columns { height: 210px; gap: 3px; }
  .bar-group > span { font-size: .75rem; }
  .cost-legend { flex-wrap: wrap; gap: 8px 16px; font-size: .8125rem; }
  .cost-message { padding: 16px; }
  .cost-message span { font-size: .9375rem; }
  .expansion-grid { grid-template-columns: minmax(0, 1fr); }
  .expansion-grid > * { min-height: 0; padding: 18px; }
  .expansion-grid article b { font-size: 1rem; }
  .expansion-grid article p, .expansion-core span { font-size: .9375rem; }
  .asset-line { font-size: 1.125rem; text-align: left; }
  .proof-layout { gap: 28px; }
  .proof-copy h2 { font-size: 1.6rem; word-break: normal; }
  .proof-copy p { font-size: 1rem; }
  .proof-report > div { padding: 20px; }
  .proof-report span { font-size: .875rem; }
  .proof-report > p { font-size: .9375rem; padding: 18px; }
  .faq-list summary { font-size: 1rem; line-height: 1.6; padding: 20px 0; }
  .faq-list summary i { flex: 0 0 22px; }
  .faq-list details p { font-size: .9375rem; }
  .closing { padding: 56px 20px; }
  .closing h2 { font-size: clamp(1.55rem, 6.6vw, 1.9rem); line-height: 1.5; word-break: normal; }
  .closing h2 span { display: block; }
  .closing h2 span::after { content: none; }
  .closing-promises { margin: 24px 0; }
  .closing-promises span { text-align: left; font-size: .9375rem; padding: 12px; }
  .signature { font-size: .8125rem; }
  .contact-dialog { max-height: calc(100dvh - 32px); overflow-y: auto; }
  .contact-dialog h2 { font-size: 1.5rem; }
  .contact-dialog label { font-size: .875rem; }
  .contact-dialog input, .contact-dialog select { font-size: 16px; }
  .reveal { opacity: 1; transform: none; transition: none; }
}