/* Homepage responsive design. Desktop composition above 1000px is unchanged. */

@media (max-width: 1000px) {
  .homepage-responsive { --mobile-header-height: 64px; }
  .site-header .header-inner { min-height: 63px; gap: 12px; }
  .site-header .brand { flex: 0 0 148px; }
  .site-header .brand img { width: 148px; }
  .mobile-toggle { min-width: 44px; min-height: 44px; justify-content: center; padding: 10px; border-radius: 3px; }
  .site-header .navigation { padding: 12px 24px 28px; max-height: calc(100dvh - 64px); overscroll-behavior: contain; }
  .site-header .nav-links > a { padding-block: 19px; font-size: 18px; }
  .site-header .nav-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 24px; }
  .site-header .nav-actions a { min-height: 48px; }
  .site-header .nav-contact { grid-column: 1 / -1; justify-content: flex-start; }
  .site-header .nav-download { width: auto; }
  .site-header .nav-login { order: 1; }
  .site-header .nav-download { order: 0; }
  html.mobile-menu-open { overflow: hidden; }
  .mobile-menu-open .site-header { box-shadow: 0 0 0 100vmax #05291d75; }
  .static-logo-section--eleven .static-logo-row { width: calc(100% - 64px); }
  .static-logo-section--eleven .static-primary-row { gap: 22px; }
  .static-logo-section--eleven .static-secondary-row { column-gap: 32px; }
  .logo-art { width: min(var(--logo-width), 11vw); }
  .concept-heading h2 { font-size: 34px; }
  .concept-flow { grid-template-columns: minmax(0,1fr) 44px minmax(0,1fr); column-gap: 12px; }
  .concept-forward svg { width: 44px; }
  .homepage-concept-compact .concept-forward { margin-top: 108px; }
  .concept-copy h3 { font-size: 25px; }
  .concept-description,.concept-feedback { font-size: 16px; }
  .homepage-concept-compact .concept-collaboration { grid-template-columns: 220px minmax(0,1fr); gap: 24px; }
  .homepage-concept-compact .concept-collaboration .concept-visual { width: 220px; }
  .stacked-jumps { top: 64px; }
}

@media (max-width: 700px) {
  html { scroll-padding-top: 80px; }
  body { font-size: 15px; }
  .container { width: calc(100% - 40px); }
  .site-header .header-inner { width: calc(100% - 32px); gap: 8px; }
  .site-header .brand { flex-basis: 136px; margin-right: auto; }
  .site-header .brand img { width: 136px; }
  .mobile-toggle > span:first-child { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .menu-bars { width: 20px; height: 12px; border-width: 1.5px; }
  .mobile-toggle[aria-expanded="true"] .menu-bars:after { border-width: 1.5px; }
  .site-header .navigation { padding-inline: 24px; }
  .site-header .nav-login { display: none; }
  .site-header .nav-download { grid-column: 1 / -1; }
  .navigation a:focus-visible,.mobile-toggle:focus-visible { outline-offset: -3px; }

  .hero-layout { gap: 22px; padding-block: 38px 28px; }
  .hero h1 { font-size: clamp(26px, 7.55vw, 44px); line-height: 1.55; letter-spacing: -.055em; }
  .hero-description { margin-top: 20px; font-size: 15px; line-height: 1.95; }
  .hero-description .desktop-break { display: block; }
  .hero-actions { margin-top: 24px; gap: 20px; flex-wrap: nowrap; }
  .hero .button { min-height: 48px; padding: 12px 18px; font-size: 14px; }
  .hero-contact { min-height: 44px; font-size: 13px; gap: 10px; white-space: nowrap; }
  .hero-art { width: min(100%, 340px); margin-top: 0; }
  .hero-art img { animation: none; }

  /* Three optically balanced logos per row; the final pair is centered. */
  .static-logo-section { padding-block: 24px; }
  .static-logo-section--eleven .static-logo-row { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); width: calc(100% - 40px); max-width: 500px; gap: 16px 10px; }
  .static-logo-row li { grid-column: span 2; height: 36px; }
  .static-logo-section--eleven .static-secondary-row { margin-top: 16px; }
  .static-secondary-row li:nth-last-child(2) { grid-column: 2 / span 2; }
  .static-secondary-row li:last-child { grid-column: 4 / span 2; }
  .logo-art { width: min(var(--mobile-logo-width), calc((100vw - 72px) / 3)); }
  .logo-art--eizo { --mobile-logo-width: 80px; }
  .logo-art--suzuki { --mobile-logo-width: 92px; }
  .logo-art--epson { --mobile-logo-width: 82px; }
  .logo-art--denso { --mobile-logo-width: 84px; }
  .logo-art--kawasaki { --mobile-logo-width: 98px; }
  .logo-art--mikuni { --mobile-logo-width: 74px; }
  .logo-art--shinmei { --mobile-logo-width: 96px; }
  .logo-art--kawamura { --mobile-logo-width: 66px; }
  .logo-art--iko { --mobile-logo-width: 104px; }
  .logo-art--kito { --mobile-logo-width: 82px; }
  .logo-art--tamron { --mobile-logo-width: 92px; }

  .homepage-concept-compact { padding-block: 48px; }
  .homepage-concept-compact .concept-heading { margin-bottom: 24px; }
  .concept-heading h2 { font-size: 28px; line-height: 1.6; }
  .concept-heading h2 span { display: block; }
  .concept-flow { display: flex; flex-direction: column; gap: 0; }
  .concept-pillar,.homepage-concept-compact .concept-collaboration { display: block; width: 100%; text-align: center; }
  .homepage-concept-compact .concept-visual,
  .homepage-concept-compact .concept-collaboration .concept-visual { width: 240px; }
  .homepage-concept-compact .concept-pillar .concept-copy { margin-top: 10px; }
  .concept-copy h3 { font-size: 24px; margin-top: 0; }
  .concept-description { margin: 8px auto 0; max-width: 28em; font-size: 15px; line-height: 1.9; }
  .concept-description br { display: none; }
  .homepage-concept-compact .concept-forward { display: grid; place-items: center; align-self: center; width: 44px; height: 44px; margin: 16px 0 4px; }
  .concept-forward svg { width: 44px; height: 32px; transform: rotate(90deg); }
  .homepage-concept-compact .concept-cycle-turns { width: 44px; height: 44px; margin: 16px auto 4px; }
  .concept-cycle-turns .concept-return-arrow { display: none; }
  .homepage-concept-compact .concept-cycle-turns .concept-down-arrow { width: 44px; height: 36px; transform: rotate(-38deg); }
  .homepage-concept-compact .concept-collaboration .concept-copy { margin-top: 10px; }
  .homepage-concept-compact .concept-feedback { margin-top: 12px; font-size: 14px; }

  .stacked-solutions { padding-block: 48px; }
  .stacked-solutions .section-heading { margin-bottom: 24px; }
  .solutions-heading h2 { display: block; font-size: 28px; margin-top: 0; line-height: 1.6; }
  .solutions-heading h2 > span { display: block; white-space: normal; }
  .stacked-jumps { display: flex; gap: 4px; margin-inline: -20px; padding: 6px 20px; margin-bottom: 28px; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none; }
  .stacked-jumps::-webkit-scrollbar { display: none; }
  .stacked-jumps a { flex: none; min-height: 44px; padding: 9px 12px; font-size: 13px; gap: 7px; }
  .stacked-jumps span { font-size: 11px; }
  .stacked-solution { scroll-margin-top: 64px; }
  .stacked-solution + .stacked-solution { margin-top: 36px; padding-top: 32px; }
  .stacked-heading { margin-bottom: 20px; gap: 0; }
  .stacked-heading .solution-category { font-size: 12px; }
  .stacked-heading h3 { font-size: 25px; line-height: 1.6; letter-spacing: -.035em; text-wrap: pretty; }
  .stacked-description { padding-top: 14px; }
  .stacked-description > p { font-size: 15px; line-height: 1.85; }
  .stacked-visuals { grid-template-columns: minmax(0,1fr); gap: 20px; }
  .stacked-visual figcaption { padding: 10px 12px; min-height: 58px; gap: 6px; }
  .stacked-visual h4 { font-size: 15px; line-height: 1.65; }
  .motion-toggle { width: 44px; height: 44px; }

  /* Reflow the product UI, keeping essential labels and examples readable. */
  .search-tab-controls { display: grid; grid-template-columns: minmax(0,1fr) 44px; }
  .search-tab { flex-direction: column; gap: 6px; padding: 12px 4px; min-height: 80px; font-size: 12px; }
  .search-tab > span { max-width: 7em; text-wrap: balance; }
  .search-tab svg { width: 20px; height: 20px; }
  .search-panel { padding: 18px 12px 12px; }
  .search-panel-copy { margin-bottom: 18px; }
  .search-panel-copy h4 { font-size: 18px; line-height: 1.65; }
  .search-panel-copy p { font-size: 14px; line-height: 1.85; margin-top: 8px; }
  .search-panel-copy .search-future { font-size: 12px; }
  .search-app-top { gap: 10px; padding-inline: 12px; font-size: 12px; }
  .search-app-top img { width: 76px; }
  .search-cad-layout { padding: 12px; gap: 16px; }
  .search-source { display: grid; grid-template-columns: 100px minmax(0,1fr); column-gap: 12px; padding: 12px; }
  .search-source .search-model-space { grid-column: 1; grid-row: 1 / 4; }
  .search-source .search-cad-model { height: 96px; }
  .search-source > .search-ui-label,.search-source > strong,.search-source-caption { grid-column: 2; margin-top: 0; }
  .search-source-caption { font-size: 11px; }
  .search-results-heading { margin-bottom: 10px; }
  .search-results-heading strong { font-size: 13px; }
  .search-cad-results { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
  .search-cad-result { padding: 8px; }
  .search-cad-result:last-child { display: none; }
  .search-cad-result .search-cad-model { height: 96px; }
  .search-cad-result strong { font-size: 12px; }
  .search-cad-result > span { font-size: 11px; }
  .search-query { margin: 12px 12px 0; padding: 10px; font-size: 13px; }
  .search-drawing-layout,.search-doc-layout { padding: 12px; gap: 14px; }
  .search-drawing-result strong,.search-doc-result strong { font-size: 13px; }
  .search-drawing-result div > span,.search-doc-result p { font-size: 12px; }
  .search-doc-location { font-size: 11px; }
  .search-drawing-result:last-child,.search-doc-result:last-child { display: none; }
  .search-drawing-preview { padding: 8px; }
  .search-preview-label { flex-wrap: wrap; gap: 4px; padding: 0 0 10px; font-size: 11px; }
  .search-preview-label > span { display: none; }
  .search-drawing { height: auto; aspect-ratio: 640 / 300; }
  .search-document-sheet { padding: 14px; }
  .search-document-sheet > strong { font-size: 13px; }
  .search-document-sheet p,.search-document-sheet > span { font-size: 12px; }
  .search-document-sheet > span { margin-block: 10px; }

  .document-app-bar { gap: 10px; padding-inline: 12px; font-size: 12px; }
  .document-app-bar img { width: 70px; }
  .document-app-location { font-size: 11px; padding-left: 10px; }
  .document-workspace { grid-template-columns: minmax(0,1fr); }
  .document-reference-panel { padding: 16px 12px; }
  .document-panel-heading { font-size: 14px; }
  .document-reference-list { display: flex; flex-wrap: wrap; gap: 6px; }
  .document-reference-list li { flex: 1 1 auto; padding: 7px 8px; gap: 6px; }
  .document-reference-list strong { font-size: 12px; white-space: nowrap; }
  .document-file-icon svg { width: 16px; height: 20px; }
  .document-reference-list li div > span,.document-source-check { display: none; }
  .document-instruction { margin-top: 12px; padding: 10px 12px; }
  .document-instruction > span { font-size: 11px; margin-bottom: 4px; }
  .document-instruction p { font-size: 13px; line-height: 1.75; }
  .document-editor-toolbar { height: 32px; padding-inline: 12px; gap: 12px; font-size: 11px; }
  .document-editor-page { padding: 18px 12px; }
  .document-title-row { margin-bottom: 14px; }
  .document-editor-page h4 { font-size: 18px; }
  .document-draft-badge { font-size: 11px; }
  .document-editor-page h5 { font-size: 13px; }
  .document-purpose p { font-size: 12px; }
  .document-proposed-section { margin-top: 14px; padding: 10px 8px; }
  .document-requirements { font-size: 12px; table-layout: fixed; }
  .document-requirements tbody th { width: 31%; }
  .document-requirements th,.document-requirements td { padding: 7px 6px; }
  .document-edit-note { font-size: 11px; }

  .review-study-visuals .review-ai-stage { height: auto; padding: 10px; }
  .review-ai-window,.review-document-workspace { height: auto; }
  .review-app-bar { padding-inline: 10px; gap: 6px; }
  .review-document-workspace { padding: 10px; }
  .review-test-document { padding: 12px; }
  .review-test-document h5 { font-size: 16px; margin-bottom: 12px; }
  .review-test-table { font-size: 11px; }
  .review-test-table th,.review-test-table td { padding: 7px 5px; }
  .review-item-column { width: 28%; }
  .review-condition-column { width: 30%; }
  .review-test-table tbody tr:last-child,.review-document-lines { display: none; }
  .review-selected-condition mark { font-size: 17px; }
  .review-selected-condition::after { display: none; }
  .review-ai-comment { position: relative; top: auto; right: auto; width: 100%; margin-top: 18px; padding: 14px; box-shadow: 0 3px 12px #254b3c0b; }
  .review-ai-comment::before { content: ''; position: absolute; top: -7px; left: 50%; width: 12px; height: 12px; border-top: 1px solid #d8b87e; border-left: 1px solid #d8b87e; background: white; transform: rotate(45deg); }
  .review-ai-comment h6 { font-size: 15px; }
  .review-comment-text { font-size: 14px; }
  .review-comment-source p { font-size: 12px; }
  .assembly-workflow-visuals .stacked-stage { height: auto; padding: 0; }
  /* Match each recording's proportions so its product UI stays fully visible. */
  .assembly-workflow-visuals .screen-canvas { position: relative; display: block; flex: none; width: 100%; padding: 0; overflow: hidden; }
  .assembly-workflow-visuals .screen-canvas.motion-canvas > img,.assembly-workflow-visuals .screen-canvas.motion-canvas > video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; object-position: center; border-radius: 0; }
  #visual-7 .screen-canvas { aspect-ratio: 1864 / 944; }
  #visual-8 .screen-canvas { aspect-ratio: 1908 / 928; }
  .review-team-caption,.assembly-support-copy { font-size: 14px; line-height: 1.85; padding: 14px; text-align: left; }

  .customers-compact,.news-compact { padding-block: 48px; }
  .customer-stories-header,.news-header { margin-bottom: 22px; }
  .customer-stories-header h2,.news-header h2 { font-size: 28px; line-height: 1.5; margin: 0; }
  .customer-story { grid-template-columns: minmax(0,1fr); gap: 18px; padding-block: 24px; }
  .customer-story-photo { grid-column: 1; }
  .customer-story-photo img { aspect-ratio: 2 / 1; }
  .customer-story-company { font-size: 13px; margin-bottom: 8px; }
  .customer-story-copy h3 { font-size: 19px; line-height: 1.75; }
  .customer-story-link { margin-top: 12px; min-height: 28px; }
  .customer-story-result { flex-direction: row; align-items: center; justify-content: space-between; border-left: 0; padding: 14px 16px; gap: 14px; background: #f1f6ee; border-radius: 3px; }
  .customer-story-result > span { font-size: 12px; }
  .customer-story-result .result-number { font-size: 44px; }
  .customer-story-result .result-unit { display: inline; font-size: 13px; margin-left: 4px; }
  .customer-story-result .result-text { font-size: 20px; text-align: right; }
  .customer-stories-actions,.news-actions { margin-top: 24px; }
  .customers-compact .customer-stories-more,.news-compact .news-more { min-height: 48px; width: 100%; justify-content: center; font-size: 14px; }
  .news-feed a { grid-template-columns: 96px minmax(0,1fr) 16px; gap: 8px 12px; padding: 20px 0; }
  .news-feed h3 { grid-column: 1 / 3; grid-row: 2; font-size: 16px; }
  .news-feed .action-arrow { grid-column: 3; grid-row: 1 / 3; }
  .news-feed time { font-size: 13px; }
  .news-feed-category { font-size: 11px; }

  .closing-strip { padding-block: 32px; }
  .closing-strip .closing-layout { display: block; }
  .closing-strip h2 { font-size: 24px; line-height: 1.65; text-align: center; text-wrap: balance; }
  .closing-strip .closing-actions { display: grid; grid-template-columns: 1fr; gap: 10px; margin-top: 22px; }
  .closing-strip .button { min-height: 48px; font-size: 14px; }
  .site-footer-v1 { padding-top: 36px; }
  .site-footer-v1 .footer-layout { grid-template-columns: minmax(0,1fr) 74px; gap: 26px 18px; }
  .site-footer-v1 .footer-brand img { width: 140px; }
  .site-footer-v1 .footer-company-name { margin-top: 20px; font-size: 13px; }
  .site-footer-v1 address { font-size: 11px; line-height: 1.85; }
  .footer-certification img { width: 52px; height: 65px; }
  .footer-certification figcaption { font-size: 10px; }
  .footer-links-v1 { width: 100%; grid-template-columns: 1fr 1fr; gap: 0 24px; }
  .footer-links-v1 a { display: flex; align-items: center; min-height: 44px; font-size: 14px; }
  .site-footer-v1 .footer-bottom { margin-top: 24px; padding-top: 20px; gap: 24px; }
  .footer-legal { display: grid; gap: 0; }
  .footer-legal a { display: flex; align-items: center; min-height: 40px; font-size: 12px; }
  body:has(.draft-bar) .site-footer-v1 { padding-bottom: 28px; }
  .draft-bar { position: static; transform: none; width: 100%; max-width: none; border-radius: 0; border: 0; border-top: 1px solid var(--line); box-shadow: none; padding: 16px 12px; gap: 12px; font-size: 11px; }
  .draft-bar b,.draft-bar button,.draft-bar a { font-size: 11px; }
  .draft-bar button,.draft-bar a { display: flex; align-items: center; min-height: 44px; }
}

@media (max-width: 360px) {
  .site-header .header-inner { width: calc(100% - 24px); gap: 4px; }
  .site-header .brand { flex-basis: 120px; }
  .site-header .brand img { width: 120px; }
  .hero-actions { gap: 12px; }
  .hero .button { padding-inline: 14px; font-size: 13px; }
  .hero-contact { font-size: 12px; }
  .solutions-heading h2 { font-size: 25px; }
  .stacked-heading h3 { font-size: 23px; }
  .search-source { grid-template-columns: 80px minmax(0,1fr); padding: 8px; gap: 8px; }
  .search-source .search-cad-model { height: 86px; }
  .search-tab { font-size: 11px; }
  .review-app-name > span { margin-left: 0; padding-left: 6px; font-size: 11px; }
  .review-document-workspace,.review-test-document { padding: 8px; }
  .review-test-document h5 { font-size: 14px; }
  .review-selected-condition mark { font-size: 15px; }
  .review-comment-count { font-size: 10px; }
  .review-ai-comment { padding: 12px; }
  .closing-strip h2 { font-size: 22px; }
}
@media (max-width: 700px) {
  .mobile-phrase { display: inline-block; }
}
@media (max-width: 1000px) {
  .site-header .nav-login,.site-header .nav-download { order: 0; }
  .mobile-toggle .menu-bars { position: relative; width: 20px; height: 20px; border: 0; transform: none; }
  .mobile-toggle .menu-bars::before,.mobile-toggle .menu-bars::after { content: ''; position: absolute; left: 0; width: 20px; height: 1.5px; background: #e0ede3; border: 0; transform: none; }
  .mobile-toggle .menu-bars::before { top: 6px; }
  .mobile-toggle .menu-bars::after { top: 13px; }
  .mobile-toggle[aria-expanded="true"] .menu-bars::before { top: 9px; transform: rotate(45deg); }
  .mobile-toggle[aria-expanded="true"] .menu-bars::after { top: 9px; transform: rotate(-45deg); }
}
@media (max-width: 700px) {
  .stacked-visual,.document-workflow { scroll-margin-top: 64px; }
}
