/* Shared small-screen layout; the desktop visual system stays unchanged. */
@media (max-width: 800px) {
  .company-page, .portal { -webkit-text-size-adjust: 100%; }
  .company-page *, .portal * { box-sizing: border-box; }
  .site-shell { width: calc(100% - 32px); }
  .site-header .site-nav-row { height: 76px; gap: 12px; }
  .site-header .site-brand { flex: 0 1 164px; min-width: 0; }
  .site-header .site-brand img { width: 154px; max-width: 100%; height: 48px; }
  .site-header .site-brand > span { font-size: 7px; letter-spacing: .12em; }
  .site-header .site-burger { margin-left: auto; flex: 0 0 48px; width: 48px; height: 48px; }
  .site-header .site-menu.px-links { position: absolute; inset: 76px 0 auto; width: auto; height: calc(100dvh - 76px); max-height: calc(100dvh - 76px); min-height: 0; flex-direction: column; align-items: stretch; justify-content: flex-start; gap: 0; margin: 0; padding: 12px 20px 24px; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; transform: none; }
  .site-header .site-menu.px-links.open { display: flex; }
  .site-header .site-menu.px-links > * { flex: 0 0 auto; min-width: 0; max-width: 100%; }
  .site-header .site-menu a { white-space: normal; overflow-wrap: anywhere; }
  .site-menu > a, .site-dropdown summary { min-height: 48px; padding: 14px 0; font-size: 15px; }
  .site-dropdown > div a { min-height: 44px; display: flex; align-items: center; }
  .company-page main, .portal main { min-width: 0; }
  .site-product-breadcrumb { flex-wrap: wrap; gap: 7px 10px; padding-block: 16px; font-size: 12px; }
  .site-browser-badge { font-size: 8px; max-width: 100%; margin-left: 0; }
  .site-section { padding-block: 52px; }
  .site-page-intro { padding-block: 24px 44px; }
  .site-breadcrumb { margin-bottom: 28px !important; font-size: 11px; }
  .company-page h1 { font-size: clamp(38px, 10.5vw, 56px); line-height: 1.08; }
  .company-page h2, .site-closing h2 { font-size: clamp(30px, 8.2vw, 40px); line-height: 1.15; }
  .company-page .site-lead, .site-page-intro .site-lead { font-size: 17px; line-height: 1.7; }
  .site-section-heading, .site-split, .site-purpose-home, .site-form-layout, .site-mission-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .site-section-heading > div:nth-child(2), .site-section-heading > p { max-width: none; }
  .site-product-grid, .site-team-grid { grid-template-columns: minmax(0, 1fr); }
  .site-product-copy { padding: 24px; }
  .site-product-copy h3 { font-size: 34px; }
  .site-product-visual { height: clamp(280px, 80vw, 360px); }
  .site-product-filters { flex-wrap: wrap; }
  .site-product-filters button { min-height: 46px; font-size: 13px; }
  .site-button, .site-nav-cta { min-height: 48px; }
  .site-actions { flex-wrap: wrap; gap: 12px; }
  .site-actions > a { flex: 1 1 180px; justify-content: center; }
  .site-form-grid { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  .site-enquiry.px-form { padding: 24px 20px; }
  .site-form-field input, .site-form-field select, .site-form-field textarea { font-size: 16px; min-height: 48px; }
  .site-form-field label { font-size: 13px; }
  .site-consent { font-size: 12px; line-height: 1.7; }
  .site-consent input { width: 20px; height: 20px; }
  .site-send { flex-direction: column; }
  .site-send .site-button { flex: none; width: 100%; white-space: normal; }
  .site-closing > .site-shell { display: block; }
  .site-closing h2 { margin-bottom: 24px; }
  .site-footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 20px; }
  .site-footer-grid > div:first-child, .site-footer-grid > div:last-child { grid-column: 1 / -1; }
  .site-footer-grid > div > a { min-height: 32px; margin-bottom: 4px; }
  .site-footer-bottom { flex-direction: column; gap: 14px; align-items: flex-start; }
  .site-footer-bottom > div { flex-wrap: wrap; gap: 12px 20px; }
  .site-footer-bottom a { min-height: 32px; display: inline-flex; align-items: center; }
  .site-top.px-top { width: 44px; height: 44px; right: 16px; bottom: 16px; }
  .portal .px-float { display: none; }
  .home-hero-grid { grid-template-columns: minmax(0, 1fr); min-height: 0; padding-top: 24px; }
  .home-hero-copy { padding-top: 12px; }
  .company-page .home-hero-copy h1 { font-size: clamp(42px, 11vw, 60px); line-height: 1.05; }
  .home-hero-copy > p:not(.site-eyebrow) { font-size: 16px; line-height: 1.75; }
  .home-hero-visual { min-height: clamp(340px, 100vw, 440px); margin-top: 10px; }
  .home-hero-visual > img { max-width: 100%; height: clamp(370px, 105vw, 470px); }
  .home-robot-label { min-width: 0; width: min(265px, 90%); right: 0; bottom: 18px; }
  .home-orbit { inset: 20px 15px 35px; }
  .home-hero-caption { flex-wrap: wrap; font-size: 9px; gap: 9px 16px; }
  .home-hero-bottom { flex-wrap: wrap; gap: 14px; }
  .home-hero-bottom > span { white-space: normal; font-size: 10px; }
  .home-hero-bottom a { min-height: 40px; font-size: 12px; text-align: left; }

  /* Keep the narrative and interactive stage in a readable single column. */
  .portal .hero, .portal .mn-hero { width: 100%; display: grid; grid-template-columns: minmax(0, 1fr); min-height: 0; padding: 20px 16px 36px !important; gap: 28px; }
  .portal .hero-content, .portal .mn-copy, .portal .scene-panel { width: 100%; min-width: 0; margin: 0; }
  .product-page .px-title, .mn-copy .px-title { font-size: clamp(40px, 10.7vw, 58px); line-height: 1.05; letter-spacing: -.055em; }
  .product-page .px-eyebrow { font-size: 10px; line-height: 1.6; letter-spacing: .09em; gap: 9px; margin-bottom: 20px; }
  .product-page .px-eyebrow > span { min-width: 0; }
  .product-page .px-sub { font-size: 16px; line-height: 1.75; margin-top: 22px; }
  .portal .px-actions { gap: 12px; margin-top: 24px; }
  .portal .px-actions .px-btn, .portal .px-actions .px-ghost { flex: 1 1 100%; min-height: 50px; justify-content: space-between; font-size: 14px; }
  .product-page .px-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 28px; }
  .product-page .px-stats > div { min-width: 0; }
  .product-page .px-stats dt { font-size: 29px; }
  .product-page .px-stats dd { font-size: 9px; letter-spacing: .04em; line-height: 1.6; }
  .site-hardware-status { font-size: 12px; line-height: 1.7; }
  .px-finish { flex-wrap: wrap; gap: 10px; }
  .px-finish b { min-width: 0; }
  .px-section { width: 100%; padding: 52px 16px; }
  .px-head { grid-template-columns: minmax(0, 1fr); gap: 22px; margin-bottom: 28px; }
  .px-head > div { max-width: none; justify-self: stretch; }
  .px-section h2 { font-size: clamp(32px, 8.8vw, 44px); line-height: 1.12; }
  .px-head > div p, .mn-voice > div > p, .px-contact > div > p { font-size: 15px; line-height: 1.75; }
  .px-cards, .px-apps, .px-flow, .px-specs, .px-faq, .px-contact, .px-lab, .mn-voice { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .px-apps article, .px-specs > div { padding: 24px 20px; }
  .px-specs dt { font-size: 11px; line-height: 1.6; letter-spacing: .1em; }
  .px-specs dd { font-size: 18px; }
  .px-faq-list summary { font-size: 16px; line-height: 1.5; gap: 14px; min-height: 44px; display: flex; align-items: center; }
  .px-form { min-width: 0; padding: 24px 20px; }
  .px-field input, .px-field select, .px-field textarea { max-width: 100%; min-width: 0; min-height: 48px; font-size: 16px; }
  .px-field textarea { min-height: 120px; }
  .px-launch { flex-wrap: wrap; gap: 16px; padding: 24px 20px; }
  .px-launch input { min-width: 0; width: 100%; font-size: 16px; }
  .px-launch button { width: 100%; min-height: 48px; }
  .dexter-spec-wrap { overflow: visible; }
  .dexter-spec-table { min-width: 0; width: 100%; font-size: 12px; }
  .dexter-spec-table th, .dexter-spec-table td { padding: 12px 10px; overflow-wrap: anywhere; }

  /* MANAS: a full-width stage and comfortable gesture/speech controls. */
  .portal .mn-hero { gap: 16px; padding-bottom: 24px !important; }
  .portal .mn-hero > .mn-copy { display: contents; }
  .mn-copy > .px-eyebrow { order: 0; margin: 0; }
  .mn-copy > .px-title { order: 1; margin: 0; }
  .mn-hero > .mn-stage { order: 2; }
  .mn-copy > .px-actions { order: 3; margin: 0; }
  .mn-copy > .px-sub { order: 4; margin: 0; }
  .mn-copy > .px-stats { order: 5; margin: 0; }
  .mn-copy > .site-hardware-status { order: 6; margin: 0; }
  /* Phone demonstration is the full-body Namaste greeting only. */
  .manas-page #gestures, .manas-page #voice { display: none; }
  .manas-page .mn-copy a[href="#gestures"], .manas-page .mn-copy > .px-stats, .manas-page .mn-copy > .px-sub { display: none; }
  #manasGreetingStop { width: 100%; min-height: 48px; font-size: 14px; }
  #manasGreetingStop:disabled, #manasGreetingStatus:empty, .manas-page .px-marquee { display: none; }
  #manasGreetingLine, #manasGreetingStatus { order: 4; width: 100%; margin: 0; }
  #manasGreetingLine { font-size: 14px; line-height: 1.7; color: var(--muted); }
  #manasGreetingStatus { font-size: 12px; line-height: 1.7; color: var(--amber); }
  .manas-page #manasGreetingAudio { order: 4; width: 100%; max-width: 100%; min-height: 44px; margin: 0; color-scheme: dark; }
  .manas-page #manasGreetingVoice { order: 4; width: 100%; margin: 0; font-size: 13px; line-height: 1.6; }
  .mn-stage { width: 100%; height: clamp(490px, 135vw, 560px); min-height: 490px; border-radius: 18px; }
  #manasCanvas { inset: 96px 0 112px; width: 100%; height: calc(100% - 208px); }
  .mn-hud { left: 14px; right: 14px; font-size: 8px; letter-spacing: .1em; }
  .mn-watch, .mn-mark { display: none; }
  .mn-views { left: 12px; right: 12px; top: 42px; display: flex; justify-content: center; gap: 6px; }
  .mn-views button { min-height: 44px; padding: 8px 6px; font-size: 12px; }
  .mn-views button:not([data-view="full"]) { display: none; }
  .mn-views button[data-view="full"] { width: min(220px, 100%); }
  .mn-now { left: 12px; right: 12px; bottom: 34px; padding: 12px; }
  .mn-now strong { font-size: 12px; line-height: 1.5; }
  .mn-status { left: 14px; bottom: 10px; max-width: calc(100% - 28px); font-size: 10px; }
  .mn-library { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .mn-group { padding: 20px 16px; }
  .mn-group > div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .mn-group button { min-width: 0; min-height: 48px; justify-content: space-between; align-items: center; padding: 10px 12px; font-size: 13px; line-height: 1.35; border-radius: 10px; }
  .mn-group button b { overflow-wrap: anywhere; }
  .mn-group button small { flex-shrink: 0; font-size: 10px; }
  .mn-speed { display: flex; justify-content: space-between; margin-top: 20px; font-size: 12px; }
  .mn-speed select { min-height: 46px; font-size: 16px; }
  .mn-presets { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; margin: 0 0 20px; }
  .mn-presets button { min-height: 46px; font-size: 14px; padding: 10px 14px; text-align: left; border-radius: 10px; }
  #speakForm .px-btn, #speakStop { min-height: 48px; font-size: 14px; width: 100%; }
  #speakStop { margin-top: 10px; }
  #speakForm label:has(#manasOnlineVoice) { display: flex; align-items: flex-start; gap: 10px; font-size: 13px; line-height: 1.6; }
  #manasOnlineVoice { width: 20px; height: 20px; min-height: 0; flex: none; margin-top: 2px; }

  /* Dexter: scroll the page, rather than separate tiny control panes. */
  .dexter-page .hero { gap: 20px; }
  .dexter-page .hero > .hero-content { display: contents; }
  .dexter-page .hero-content > .px-eyebrow { order: 0; margin: 0; }
  .dexter-page .hero-content > .px-title { order: 1; margin: 0; }
  .dexter-page .hero > .scene-panel { order: 2; }
  .dexter-page .hero-content > .px-actions { order: 3; margin: 0; }
  .dexter-page .hero-content > .site-viewer-recovery { order: 4; }
  .dexter-page .hero-content > .px-sub { order: 5; margin: 0; }
  .dexter-page .hero-content > .px-finish { order: 6; }
  .dexter-page .hero-content > .dexter-trust { order: 7; }
  .dexter-page .hero-content > .px-stats { order: 8; margin: 0; }
  .dexter-page .hero-content > .site-hardware-status { order: 9; margin: 0; }
  .portal .robot-lab { max-width: 100%; }
  .portal .robot-lab .scene-viewport { width: 100%; height: clamp(310px, 95vw, 430px); min-height: 0; flex: none; }
  .portal .scene-header { padding: 14px 12px; gap: 10px; flex-wrap: wrap; }
  .portal .scene-header button { min-height: 44px; padding: 10px; font-size: 12px; }
  .activity-tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 10px; gap: 8px; }
  .activity-tabs button { min-height: 46px; padding: 10px 8px; font-size: 12px; justify-content: center; }
  .activity-tabs small { display: none; }
  .portal .lab-actions { display: flex; flex-wrap: wrap; padding: 12px; gap: 8px; }
  .portal .lab-actions .btn { width: 100%; min-height: 48px; justify-content: space-between; padding: 12px 16px; }
  .portal .lab-actions .btn, .portal .lab-actions .btn > span { font-size: 14px; }
  .portal .lab-actions > button:not(.btn) { flex: 1 1 100px; min-height: 44px; font-size: 13px; padding: 10px 12px; }
  .portal .lab-speed { width: 100%; justify-content: space-between; margin: 4px 0 0; font-size: 13px; }
  .portal .lab-speed select, .portal .lab-options select { min-height: 44px; font-size: 16px; }
  .portal .student-controls { flex-wrap: wrap; padding: 12px; gap: 10px; font-size: 13px; }
  .portal .student-controls select, .portal .student-controls button { min-height: 44px; font-size: 14px; }
  .portal .student-controls label { width: 100%; min-width: 0; justify-content: space-between; font-size: 13px; }
  #learningMode { min-width: 0; max-width: 100%; min-height: 48px; font-size: 16px; }
  .portal .lab-cycle, .portal .lab-lesson, .portal .lab-options { padding: 16px 12px; }
  .portal .lab-cycle-title { flex-wrap: wrap; align-items: flex-start; }
  .portal .lab-cycle-title b { font-size: 13px; }
  .portal .lab-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
  .portal .lab-steps li { font-size: 10px; }
  .portal .lab-steps li::before { font-size: 9px; }
  .portal .lab-lesson { gap: 10px; }
  .portal .lab-lesson p { font-size: 13px; }
  .portal .lab-options { flex-wrap: wrap; gap: 12px; }
  .portal .lab-options > label { min-height: 44px; font-size: 13px; flex-wrap: wrap; }
  .portal .lab-options input[type=checkbox] { width: 20px; height: 20px; }
  .portal .lab-telemetry { grid-template-columns: minmax(0, 1fr); gap: 14px; padding: 16px 12px; }
  .portal .lab-telemetry > div > span { font-size: 10px; }
  .portal .lab-telemetry p, .portal .lab-telemetry b { white-space: normal; font-size: 12px; line-height: 1.7; }
  .portal .robot-lab .scene-controls { flex-wrap: wrap; padding: 6px; justify-content: stretch; }
  .portal .robot-lab .scene-controls button { flex: 1 1 100px; min-height: 44px; font-size: 12px; }
  .portal .hero > .robot-lab.sensor-active, .portal .hero > .robot-lab.chess-active { display: block; height: auto; max-height: none; }
  .portal .hero > .sensor-active > .sensor-panel, .portal .hero > .chess-active > .chess-panel { overflow: visible; max-height: none; border-top: 1px solid #293e59; padding: 20px 12px; }
  .portal .hero > .sensor-active > .scene-viewport, .portal .hero > .chess-active > .scene-viewport { height: clamp(310px, 95vw, 430px); border-right: 0; }
  .sensor-panel button, .chess-panel button:not(.chess-square):not([data-chess-level]) { min-height: 44px; font-size: 13px; padding: 10px 12px; }
  .sensor-panel input, .sensor-panel select, .chess-panel select { min-height: 46px; font-size: 16px; max-width: 100%; }
  .sensor-panel label, .chess-settings label, .chess-robot-controls label { font-size: 13px; }
  .sensor-heading > p, .speech-options p, .sensor-privacy, .sensor-footnote, .sensor-command-status, .chess-level-note, .chess-status, .chess-footnote, .chess-motion-note { font-size: 12px; line-height: 1.75; }
  .sensor-target, .speech-options > label, .chess-settings, .chess-robot-controls { flex-wrap: wrap; align-items: flex-start; gap: 10px; }
  .speech-options > label { display: grid; grid-template-columns: minmax(0, 1fr); }
  .speech-options select { width: 100%; max-width: none; margin-left: 0; }
  .speech-options .speech-consent { display: flex; font-size: 12px; padding: 12px; }
  .speech-consent input { width: 20px; height: 20px; min-height: 0; }
  .speech-options .speech-consent[hidden] { display: none; }
  .speech-buttons { flex-wrap: wrap; }
  .speech-buttons button { flex: 1 1 100px; }
  .robot-command-form > div { flex-direction: column; gap: 8px; }
  .robot-command-form input { width: 100%; flex: none; min-height: 48px; font-size: 16px; }
  .robot-command-form button { width: 100%; }
  .sensor-examples { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .sensor-run-controls { gap: 12px; }
  .sensor-run-controls > button { width: 100%; }
  .sensor-run-controls label { display: flex; width: 100%; justify-content: space-between; font-size: 13px; white-space: normal; }
  .sensor-live { flex-wrap: wrap; font-size: 10px; gap: 10px; }
  .vision-result { align-items: flex-start; }
  .vision-result p { font-size: 12px; }
  .chess-levels { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .chess-levels button { min-height: 52px; font-size: 10px; padding: 10px; }
  .chess-levels b { font-size: 13px; }
  .chess-settings label, .chess-robot-controls label { width: 100%; justify-content: space-between; }
  .chess-settings > button { width: 100%; }
  .chess-record { font-size: 12px; }
  .chess-record summary { min-height: 44px; align-items: center; }
  .chess-record ol { max-height: none; overflow: visible; }
  .portal .lab-dialog { width: calc(100vw - 16px); height: calc(100dvh - 16px); overflow-y: auto; }
  .portal .lab-dialog .robot-lab { display: block; height: auto; min-height: 100%; overflow: visible; }
  .portal .lab-dialog .scene-viewport { height: clamp(310px, 95vw, 430px); min-height: 0; border-right: 0; }
  .portal .lab-dialog .sensor-panel, .portal .lab-dialog .chess-panel { overflow: visible; max-height: none; }
  .portal .speech-fallback button { min-height: 46px; width: 100%; margin: 0 0 8px; }
}
@media (max-width: 430px) {
  .site-services-grid, .site-process, .site-principles { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .site-services-grid p, .site-process p { font-size: 14px; }
  .site-person { display: block; }
  .site-person-photo, .site-person-initials { height: 300px; margin-bottom: 22px; }
  .site-person > p:not(.site-eyebrow) { font-size: 14px; }
  .site-person h3 { font-size: 28px; }
  .site-person .site-eyebrow { font-size: 10px; }
  .site-person .site-text-link { font-size: 13px; min-height: 44px; }
  .site-photo-stack { min-height: 360px; }
  .site-photo-caption { left: 20px; right: 20px; bottom: 24px; }
  .site-photo-caption strong { font-size: 28px; }
}