/* Shared narrow-screen treatment for product detail pages. Desktop remains unchanged. */
@media (max-width: 820px) {
  html, body { min-width: 0 !important; overflow-x: hidden; }
  body[data-page="products"] { overflow-x: clip; }
  body[data-page="products"] .container { width: calc(100% - 36px) !important; max-width: none !important; }
  body[data-page="products"] .main-nav, body[data-page="products"] .header-inner .button-small { display: none !important; }
  body[data-page="products"] .nav-toggle { display: inline-flex !important; }

  body[data-page="products"] .product-detail-hero { padding: 0 0 24px; }
  body[data-page="products"] .product-detail-hero .inner-hero-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; padding: 10px 0 24px !important; }
  body[data-page="products"] .product-detail-hero .inner-hero-copy { display: contents; padding: 0; }
  body[data-page="products"] .product-detail-hero .breadcrumb { display: none; }
  body[data-page="products"] .product-detail-hero h1 { margin: 8px 0 7px; font-size: 22px !important; line-height: 1.36; }
  body[data-page="products"] .product-detail-hero .inner-hero-copy > p { font-size: 13px !important; line-height: 1.7; }
  body[data-page="products"] .product-detail-gallery { order: 2; width: 100%; min-height: 0; margin: 16px 0 0; aspect-ratio: 16 / 9; }
  body[data-page="products"] .product-detail-gallery .product-gallery-slide { background-position: center !important; background-repeat: no-repeat; background-size: cover !important; }
  body[data-page="products"] .product-detail-hero .inner-hero-actions { order: 3; display: flex !important; flex-flow: row nowrap !important; gap: 8px !important; margin-top: 12px !important; }
  body[data-page="products"] .product-detail-hero .inner-hero-actions .button { flex: 0 0 auto !important; width: auto !important; min-width: 0 !important; min-height: 26px !important; padding: 0 11px !important; font-size: 9px !important; white-space: nowrap; }
  body[data-page="products"] .product-hero-capabilities { order: 4; grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 0; margin-top: 13px; }
  body[data-page="products"] .product-hero-capabilities > div { min-width: 0; min-height: 29px; padding: 0 2px; }
  body[data-page="products"] .product-hero-capability-icon { width: 16px !important; height: 16px !important; }
  body[data-page="products"] .product-hero-capabilities span { min-width: 0; font-size: 7px !important; line-height: 1.15; white-space: normal; }

  body[data-page="products"] .product-visual-page .page-anchor-nav { display: none !important; }
  body[data-page="products"] .product-visual-page .page-anchor-nav.is-expanded, body[data-page="products"] .product-visual-page .page-anchor-nav:focus-within { transform: translate(0, -50%) !important; }
  body[data-page="products"] .product-visual-page .page-anchor-nav .container { display: flex; flex-direction: column; overflow: visible; align-items: stretch; width: auto !important; margin: 0; padding: 4px 0; }
  body[data-page="products"] .product-visual-page .page-anchor-nav a { display: flex; min-height: 26px; padding: 0 9px 0 22px; font-size: 10px !important; }
  body[data-page="products"] .product-visual-page .page-anchor-nav a::before { display: block; left: 8px; width: 5px; height: 5px; }
  body[data-page="products"] .product-visual-page .page-anchor-nav a::after { top: 5px; right: auto; bottom: 5px; left: 0; width: 2px; height: auto; }

  body[data-page="products"] .product-visual-page .section { padding: 18px 0 !important; }
  body[data-page="products"] .section-heading, body[data-page="products"] .heading-inline { margin: 0 auto 12px !important; }
  body[data-page="products"] .section-heading > span, body[data-page="products"] .heading-inline > div > span { gap: 10px; margin-bottom: 6px; font-size: 11px !important; }
  body[data-page="products"] .section-heading h2 { margin: 0; font-size: 20px !important; line-height: 1.42; }
  body[data-page="products"] .section-heading p, body[data-page="products"] .heading-inline > p { margin: 8px auto 0 !important; font-size: 12px !important; line-height: 1.65; }
  body[data-page="products"] .section-heading > span::before, body[data-page="products"] .section-heading > span::after, body[data-page="products"] .heading-inline > div > span::before, body[data-page="products"] .heading-inline > div > span::after { width: 32px; }

  body[data-page="products"] .product-architecture-showcase, body[data-page="products"] .product-hardware-showcase { display: flex; flex-direction: column; min-height: 0; }
  body[data-page="products"] .product-architecture-image, body[data-page="products"] .product-hardware-image { min-height: 0; aspect-ratio: 16 / 9; border: 0; background-position: center; background-repeat: no-repeat; background-size: cover !important; }
  /* VR党建交互机柜硬件配置图的后台裁切框与前端展示统一为 844:500。 */
  body[data-product-slug="vr-party-cabinet"] #hardware .product-hardware-image { aspect-ratio: 844 / 500; }
  /* VR红色骑行的后台裁切框与前端概览、硬件图片保持同一比例。 */
  body[data-product-slug="vr-red-cycling"] #overview .product-architecture-image { aspect-ratio: 844 / 540; }
  body[data-product-slug="vr-red-cycling"] #hardware .product-hardware-image { aspect-ratio: 844 / 500; }
  body[data-page="products"] .product-architecture-copy { padding: 18px; }
  body[data-page="products"] .product-architecture-copy h3 { font-size: 16px; }
  body[data-page="products"] .architecture-list { gap: 14px; }
  body[data-page="products"] .architecture-list > div { grid-template-columns: 30px minmax(0, 1fr); gap: 9px; padding: 0; }
  body[data-page="products"] .architecture-icon { width: 24px !important; height: 24px !important; }
  body[data-page="products"] .architecture-list b { font-size: 15px; }
  body[data-page="products"] .architecture-list p { font-size: 12px; line-height: 1.65; }

  body[data-page="products"] .product-visual-grid, body[data-page="products"] .product-content-showcase, body[data-page="products"] .product-scenario-grid, body[data-page="products"] .product-case-grid { display: flex; gap: 12px; overflow-x: auto; overflow-y: hidden; margin-right: -18px; padding: 0 18px 2px 0; scroll-snap-type: x mandatory; scrollbar-width: none; touch-action: auto; }
  body[data-page="products"] .product-visual-grid, body[data-page="products"] .product-content-showcase, body[data-page="products"] .product-scenario-grid, body[data-page="products"] .product-case-grid { align-items: flex-start; }
  body[data-page="products"] .product-visual-grid::-webkit-scrollbar, body[data-page="products"] .product-content-showcase::-webkit-scrollbar, body[data-page="products"] .product-scenario-grid::-webkit-scrollbar, body[data-page="products"] .product-case-grid::-webkit-scrollbar { display: none; }
  body[data-page="products"] .product-visual-card, body[data-page="products"] .product-content-visual-card, body[data-page="products"] .product-scenario-card, body[data-page="products"] .product-case-showcase { flex: 0 0 332px; min-height: 0; overflow: hidden; scroll-snap-align: start; opacity: 1 !important; transform: none !important; transition: none !important; }
  body[data-page="products"] .product-content-visual-card { display: block; }
  body[data-page="products"] .product-visual-card-image, body[data-page="products"] .product-content-visual-image, body[data-page="products"] .product-scenario-image, body[data-page="products"] .product-case-image { min-height: 0; aspect-ratio: 16 / 9; background-position: center !important; background-repeat: no-repeat; background-size: cover !important; }
  /* VR红色一体机核心功能的后台裁切框与前端卡片统一为 4:3。 */
  body[data-product-slug="vr-red-all-in-one"] #functions .product-visual-card-image { aspect-ratio: 4 / 3; }
  body[data-page="products"] .product-visual-card > div:last-child, body[data-page="products"] .product-content-visual-card > div:last-child, body[data-page="products"] .product-scenario-card > div:last-child, body[data-page="products"] .product-case-showcase > div:last-child { padding: 14px; }
  body[data-page="products"] .product-visual-card h3, body[data-page="products"] .product-content-visual-card h3, body[data-page="products"] .product-scenario-card h3, body[data-page="products"] .product-case-showcase h3 { margin: 0; font-size: 16px !important; line-height: 1.4; }
  body[data-page="products"] .product-visual-card p, body[data-page="products"] .product-content-visual-card p, body[data-page="products"] .product-scenario-card p, body[data-page="products"] .product-case-showcase p { display: -webkit-box; overflow: hidden; margin: 5px 0 0; font-size: 12px !important; line-height: 1.6; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
  body[data-page="products"] .product-mobile-slider-controls { display: flex; justify-content: center; gap: 5px; margin-top: 10px; }
  body[data-page="products"] .product-mobile-slider-controls button { width: 5px; height: 5px; margin: 0; padding: 0; border: 0; border-radius: 50%; background: #d8d8d8; }
  body[data-page="products"] .product-mobile-slider-controls button.is-active { width: 18px; border-radius: 5px; background: #ae752e; }

  body[data-page="products"] .page-cta { padding: 0 0 30px; background: #fbf8f4; }
  body[data-page="products"] .page-cta .container { display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 9px; min-height: 0; padding: 18px; border-radius: 8px; background: #0b345e; }
  body[data-page="products"] .page-cta .container > i { width: 30px; height: 30px; }
  body[data-page="products"] .page-cta .container:not(:has(> i)) { grid-template-columns: minmax(0, 1fr); }
  body[data-page="products"] .page-cta .container:not(:has(> i)) > :first-child, body[data-page="products"] .page-cta .container:not(:has(> i)) .button { grid-column: 1; }
  body[data-page="products"] .page-cta h2 { margin: 0 0 4px; font-size: 16px; line-height: 1.4; }
  body[data-page="products"] .page-cta p { font-size: 11px; line-height: 1.55; }
  body[data-page="products"] .page-cta .button, body[data-page="products"] .product-final-cta-actions { grid-column: 2; justify-self: start; min-height: 31px; margin: 0; padding: 0 11px; font-size: 11px; }

  /* Normalize product-specific desktop rules that otherwise re-expand mobile modules. */
  body[data-page="products"] .product-visual-page .product-detail-hero { min-height: 0 !important; }
  body[data-page="products"] .product-visual-page .section-heading h2,
  body[data-page="products"] .product-visual-page .heading-inline h2,
  body[data-page="products"] .product-visual-page #functions .heading-inline h2,
  body[data-page="products"] .product-visual-page #content .section-heading h2,
  body[data-page="products"] .product-visual-page #hardware .section-heading h2,
  body[data-page="products"] .product-visual-page #scenarios .section-heading h2,
  body[data-page="products"] .product-visual-page #cases .section-heading h2 { font-size: 19px !important; line-height: 1.42; }
  body[data-page="products"] .product-visual-page .section-heading > span,
  body[data-page="products"] .product-visual-page .heading-inline > div > span { margin-bottom: 5px; font-size: 10px !important; }
  body[data-page="products"] .product-visual-page .section-heading p,
  body[data-page="products"] .product-visual-page .heading-inline > p { margin-top: 6px !important; font-size: 11px !important; line-height: 1.6; }
  body[data-page="products"] .product-visual-page #overview .section-heading p { text-align: left; }

  body[data-page="products"] .product-quick-facts { display: grid; grid-template-columns: 1fr; gap: 0; margin-top: 14px; }
  body[data-page="products"] .product-quick-facts .wire-card, body[data-page="products"] .product-quick-facts .wire-card:last-child { min-height: 0; padding: 13px 14px; gap: 10px; border-right: 0; border-bottom: 1px solid rgba(190, 145, 81, .3); }
  body[data-page="products"] .product-quick-facts .wire-card:last-child { border-bottom: 0; }
  /* Keep every outlined icon compact and center its glyph within the ring. */
  body[data-page="products"] .product-fact-icon,
  body[data-page="products"] .product-content-icon,
  body[data-page="products"] #content .product-content-icon {
    display: grid;
    box-sizing: border-box;
    width: 28px;
    height: 28px;
    padding: 0;
    place-items: center;
  }
  body[data-page="products"] .product-fact-icon::after,
  body[data-page="products"] .product-content-icon::after,
  body[data-page="products"] #content .product-content-icon::after {
    width: 14px;
    height: 14px;
  }
  body[data-page="products"] .product-fact-icon .detail-icon-inner,
  body[data-page="products"] #content .product-content-icon .detail-icon-inner {
    width: 14px;
    height: 14px;
  }
  body[data-page="products"] .product-quick-facts .card-label { margin-bottom: 3px; font-size: 11px; }
  body[data-page="products"] .product-quick-facts h3 { font-size: 14px; line-height: 1.45; }

  body[data-page="products"] .product-structure-label { gap: 7px; font-size: 11px; }
  body[data-page="products"] .product-structure-label i { width: 24px; height: 24px; }
  body[data-page="products"] .product-structure-label i::after { width: 12px; height: 12px; }
  body[data-page="products"] .architecture-icon, body[data-page="products"] .hardware-spec-icon { width: 24px !important; height: 24px !important; }

  body[data-page="products"] .product-content-visual-card > div:last-child { display: grid; grid-template-columns: 28px minmax(0, 1fr); column-gap: 9px; align-items: center; }
  body[data-page="products"] .product-content-visual-card > div:last-child .product-content-icon { grid-column: 1; grid-row: 1; }
  body[data-page="products"] .product-content-visual-card > div:last-child h3 { grid-column: 2; grid-row: 1; margin: 0; }
  body[data-page="products"] .product-content-visual-card > div:last-child p { grid-column: 1 / -1; margin-top: 9px; }
  body[data-page="products"] .product-visual-card > div:last-child, body[data-page="products"] .product-content-visual-card > div:last-child, body[data-page="products"] .product-scenario-card > div:last-child, body[data-page="products"] .product-case-showcase > div:last-child { padding: 12px; }
  body[data-page="products"] .product-visual-card h3, body[data-page="products"] .product-content-visual-card h3, body[data-page="products"] .product-scenario-card h3, body[data-page="products"] .product-case-showcase h3 { font-size: 14px !important; line-height: 1.4; }
  body[data-page="products"] .product-visual-card p, body[data-page="products"] .product-content-visual-card p, body[data-page="products"] .product-scenario-card p, body[data-page="products"] .product-case-showcase p, body[data-page="products"] .product-case-fields { font-size: 11px !important; line-height: 1.55; }
  /* Keep every mobile card's copy block compact without reducing its image area. */
  body[data-page="products"] .product-visual-page #functions .product-visual-card > div:last-child,
  body[data-page="products"] .product-visual-page #scenarios .product-scenario-card > div:last-child { box-sizing: border-box; height: 90px; overflow: hidden; padding: 10px 12px !important; }
  body[data-page="products"] .product-visual-page #content .product-content-visual-card > div:last-child { box-sizing: border-box; height: 99px; overflow: hidden; padding: 10px 12px !important; }
  body[data-page="products"] .product-visual-page #cases .product-case-showcase > div:last-child { box-sizing: border-box; height: 100px; overflow: hidden; padding: 10px 12px !important; }
  body[data-page="products"] .product-visual-page #functions .product-visual-card h3,
  body[data-page="products"] .product-visual-page #scenarios .product-scenario-card h3,
  body[data-page="products"] .product-visual-page #cases .product-case-showcase h3 { margin: 0 0 5px !important; font-size: 14px !important; line-height: 1.4 !important; }
  body[data-page="products"] .product-visual-page #content .product-content-visual-card h3 { margin: 0 !important; font-size: 14px !important; line-height: 1.4 !important; }
  body[data-page="products"] .product-visual-page #functions .product-visual-card p,
  body[data-page="products"] .product-visual-page #content .product-content-visual-card p,
  body[data-page="products"] .product-visual-page #scenarios .product-scenario-card p,
  body[data-page="products"] .product-visual-page #cases .product-case-showcase p { margin-top: 5px !important; font-size: 11px !important; line-height: 1.55 !important; }
  body[data-page="products"] .product-visual-page #content .product-content-visual-card p { margin-top: 7px !important; }
  body[data-page="products"] .scenario-card-number, body[data-page="products"] #scenarios .product-scenario-card > div:last-child::before { top: 12px; right: 14px; font-size: 38px; }

  body[data-page="products"] .product-spec-table { min-height: 0; padding: 14px 16px; }
  body[data-page="products"] .product-spec-table > div { grid-template-columns: 24px minmax(0, 1fr); gap: 8px; padding: 10px 0; }
  body[data-page="products"] .product-spec-table b { font-size: 13px; }
  body[data-page="products"] .product-spec-table > div > b,
  body[data-page="products"] .product-spec-table > div > span { grid-column: 2; }
  body[data-page="products"] .product-spec-table span { display: block; margin-top: 3px; font-size: 11px; line-height: 1.55; }

  body[data-page="products"] .product-visual-page .page-cta .container { display: grid; grid-template-columns: 30px minmax(0, 1fr); align-items: start; gap: 8px; min-height: 0; padding: 16px; border-radius: 8px; }
  body[data-page="products"] .product-visual-page .page-cta .container > i, body[data-page="products"] .product-final-cta-icon { width: 26px; height: 26px; }
  body[data-page="products"] .product-visual-page .page-cta h2 { margin: 0 0 3px; font-size: 14px; line-height: 1.4; }
  body[data-page="products"] .product-visual-page .page-cta p { font-size: 10px; line-height: 1.5; }
  body[data-page="products"] .product-visual-page .product-final-cta-actions { display: block; grid-column: 2; justify-self: start; margin: 7px 0 0; }
  body[data-page="products"] .product-visual-page .page-cta .button { min-height: 28px; padding: 0 10px; font-size: 10px; }
}