/* Portrait layout only. Desktop composition remains in the base styles. */
@media (max-width: 620px) {
  body { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
  .container { width: calc(100% - 32px); }
  .header-inner:has(#main-nav), html:not(.js-enabled) .header-inner:has(#main-nav) {
    min-height: 104px;
    padding-top: max(8px, env(safe-area-inset-top));
    gap: 4px 12px;
  }
  #main-nav, html:not(.js-enabled) #main-nav {
    justify-content: space-between;
    gap: 10px;
    min-width: 0;
    width: 100%;
    scrollbar-width: none;
  }
  #main-nav::-webkit-scrollbar { display: none; }
  #main-nav > a { font-size: 12px; padding-inline: 0; min-height: 44px; }
  .header-cta { min-height: 44px; }
  .js-enabled #main > section.section, .js-enabled #main > #faq, .js-enabled #main > #start {
    padding-block: 28px 32px;
  }
  .section-label { margin-bottom: 10px; font-size: 12px; }
  .section-heading h2, .faq-layout h2, .start-copy h2 {
    font-size: 28px;
    line-height: 1.35;
    letter-spacing: -.6px;
  }
  .js-enabled .section-heading { margin-bottom: 24px; }
  .section-heading > p { margin-top: 14px; font-size: 14px; line-height: 1.65; }
  .section-heading > .text-link { margin-top: 10px; font-size: 13px; }
  .hero-actions { flex-wrap: wrap; }
  #home .hero-actions { gap: 16px; }
  #home .hero-description { line-height: 1.55; }
  #home .hero-note { overflow-wrap: normal; }
  .discovery-inner { gap: 18px; padding-block: 24px; }
  .discovery-inner > p { font-size: 14px; }
  .discovery-inner > div { grid-template-columns: 60px minmax(0, 1fr); }
  .discovery-inner > div p { font-size: 12px; line-height: 1.65; }

  .demo-toolbar { padding: 16px; gap: 14px; }
  .demo-project small { font-size: 11px; }
  .scenario-control button { min-height: 44px; padding-inline: 6px; }
  .demo-sidebar { padding: 8px; }
  .demo-sidebar button { padding: 8px 6px; font-size: 12px; }
  .demo-content { padding: 20px 16px; min-height: 0; }
  .demo-content-heading { min-height: 0; margin-bottom: 16px; gap: 10px; }
  .demo-content h3 { font-size: 16px; line-height: 1.6; }
  .demo-eyebrow { margin-bottom: 6px; font-size: 11px; }
  .sample-badge { flex-shrink: 0; }
  .demo-columns { gap: 12px; }
  .answer-card { padding: 16px; min-height: 0; }
  .answer-card > p { font-size: 14px; line-height: 1.85; margin-top: 12px; }
  .answer-citations { margin-top: 14px; }
  .insight-card { padding: 16px; min-height: 0; }
  .insight-card h4 { margin-bottom: 8px; }
  .insight-card p { font-size: 13px; line-height: 1.75; }
  .insight-footer { padding-top: 12px; font-size: 11px; }
  .demo-bottom { padding: 12px 16px; font-size: 10px; }
  .demo-source-list li, .demo-task-list li { gap: 8px; padding: 14px 12px; }
  .demo-source-list li > div, .demo-task-list li > div { flex: 1; min-width: 0; }
  .demo-source-list strong, .demo-task-list strong { font-size: 13px; line-height: 1.65; }
  .demo-source-list small, .demo-task-list small { font-size: 11px; line-height: 1.65; }
  .demo-source-list .source-type, .demo-task-list .task-state { margin-left: 0; }
  .capability-notes { gap: 16px; }
  .capability-notes > div { padding-left: 12px; }
  .capability-notes h3 { font-size: 15px; }
  .capability-notes p { margin-top: 4px; line-height: 1.7; }

  .js-enabled .workflow-list { gap: 12px; margin-top: 24px; }
  .workflow-list li {
    padding: 16px 14px;
    min-width: 0;
    border: 1px solid rgba(177, 197, 231, .38);
    border-radius: 16px;
    background: rgba(255, 255, 255, .25);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .9);
  }
  .step-number { font-size: 12px; }
  .workflow-list h3 { font-size: 17px; margin: 12px 0 10px; }
  .workflow-list p { font-size: 13px; line-height: 1.8; }
  .step-deliverable { margin-top: 14px; font-size: 11px; line-height: 1.7; }

  .solution-grid { gap: 16px; }
  .solution { padding: 24px 20px; }
  .solution-top { margin-bottom: 18px; }
  .solution h3 { font-size: 24px; }
  .solution-subtitle { margin-top: 10px; margin-bottom: 14px; font-size: 13px; }
  .solution > p:not(.solution-subtitle) { font-size: 14px; line-height: 1.75; }
  .check-list { margin: 20px 0 24px; gap: 10px; font-size: 14px; }
  .solution .button { min-height: 48px; padding: 11px 16px; }
  .solution > small { font-size: 11px; line-height: 1.75; margin-top: 12px; }
  .solutions-note { margin-top: 18px; line-height: 1.75; }

  .faq-layout { gap: 20px; }
  .faq-layout > div > .text-link { margin-top: 10px; }
  .faq-list summary { min-height: 68px; padding-block: 16px; gap: 16px; font-size: 14px; line-height: 1.75; }
  .faq-list details p { font-size: 14px; line-height: 1.8; padding-bottom: 18px; }

  .start-panel { padding: 24px 20px; gap: 24px; }
  .back-button { margin: -8px 0 14px; min-height: 44px; }
  .start-copy h2 br { display: none; }
  .start-copy > p:not(.section-label) { margin-top: 12px; font-size: 14px; line-height: 1.7; }
  .start-note { margin-top: 16px; gap: 10px; }
  .start-note > p { font-size: 12px; line-height: 1.75; }
  .start-copy > .text-link { margin-top: 4px; min-height: 44px; }
  .form-area { padding: 16px; margin: 0 -8px; }
  .field { margin-bottom: 10px; }
  .field label { margin-bottom: 6px; font-size: 13px; }
  .field input, .field select, .field textarea { min-height: 48px; padding: 10px 12px; font-size: 16px; }
  .field textarea { min-height: 88px; }
  .field-row { gap: 12px; }
  .form-caption { font-size: 11px; line-height: 1.7; }
  .result-actions { gap: 8px; }
  .result-actions .button { min-height: 44px; }

  .site-footer { padding-block: 24px 20px; }
  .footer-top { gap: 10px 16px; }
  .footer-top > p { font-size: 11px; }
  .footer-top nav { width: 100%; justify-content: space-between; gap: 16px; }
  .footer-bottom { margin-top: 8px; padding-top: 14px; gap: 4px; font-size: 10px; }
}

@media (max-width: 620px) and (max-height: 820px) {
  .js-enabled #home .hero { padding-top: 16px; }
  #home .intro-label { margin-bottom: 10px; }
  #home .hero h1 { font-size: 34px; line-height: 1.1; }
  #home .hero-description { margin-top: 12px; font-size: 14px; line-height: 1.55; }
  #home .hero-actions { margin-top: 14px; gap: 12px; }
  #home .hero-note { margin-top: 10px; }
  #home .signal-scene { transform: scale(.55); margin-top: 4px; margin-bottom: -243px; }
}

@media (max-width: 359px) {
  .header-cta { font-size: 11px; gap: 8px; padding-inline: 10px; }
  .brand > span { font-size: 25px; }
  .brand { gap: 8px; }
  .section-heading h2, .faq-layout h2, .start-copy h2 { font-size: 26px; }
  .workflow-list li { padding: 14px 12px; }
  .workflow-list h3 { font-size: 16px; }
  .solution { padding: 22px 18px; }
  .demo-sidebar button { font-size: 11px; }
  .field-row { grid-template-columns: 1fr; gap: 0; }
  .footer-top > p { flex-basis: 100%; }
}
