/* Public renderer owns this final layer. Generators must not copy it into templates.
   Desktop >=1200px retains the approved composition; no page-level overflow hiding. */
.mobile-menu-toggle{display:none}
@media(max-width:1199px){
  body{min-width:0!important}
  /* Enhanced header must outrank legacy .co-*/
  /* .sg-page/.sd-page header rules without changing their desktop layouts. */
  body .header,body.mobile-ready .header{height:72px;position:sticky;top:0}
  body .header-inner,body.mobile-ready .header-inner{height:100%;width:92%;flex-direction:row;align-items:center;gap:16px;padding-block:0;position:relative}
  body .brand-logo,body.mobile-ready .brand-logo{width:clamp(180px,25vw,230px);height:auto}
  .mobile-menu-toggle{display:block;min-width:44px;min-height:44px;border:1px solid #dce5ef;background:#fff;color:#153e71;border-radius:4px;padding:8px}
  body .header nav[aria-label="主导航"]{position:absolute;top:72px;left:-4.35%;right:-4.35%;width:auto;margin:0;padding:16px 5%;display:flex;flex-direction:column;align-items:stretch;gap:8px;overflow:auto;max-height:calc(100svh - 88px);background:white;box-shadow:0 12px 20px #10284124;font-size:17px}
  body .header nav[aria-label="主导航"] a{display:flex;align-items:center;min-height:44px;padding:8px 12px;font-size:17px}
  body .header nav[aria-label="主导航"] .nav-products{flex-wrap:wrap}
  body .header nav[aria-label="主导航"] .dropdown{position:static;min-width:0;width:100%}
  body .header nav[aria-label="主导航"] .dropdown-toggle{min-width:44px;min-height:44px}
  body .header nav[aria-label="主导航"] .nav-contact{justify-content:center}
  /* Without script the navigation remains usable in normal document flow. */
  body:not(.mobile-ready) .header{height:auto;position:relative}
  body:not(.mobile-ready) .header-inner{flex-wrap:wrap;padding-block:12px}
  body:not(.mobile-ready) .header nav[aria-label="主导航"]{position:static;max-height:none;box-shadow:none;width:100%;flex-direction:row;flex-wrap:wrap;padding:0}
  .mobile-ready .header nav[aria-label="主导航"]:not(.mobile-open){display:none}
  .ps-page main{overflow:visible}
  .ps-category,.ps-local-nav{top:72px}
  .ps-category .wrap,.ps-local-nav .wrap{gap:24px;overflow-x:auto;white-space:nowrap}
  .ps-category a,.ps-local-nav a{flex-shrink:0;min-height:44px}
  .ps-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ps-hero-grid,.ps-featured,.ps-deploy,.ps-body-split>.wrap{gap:28px;min-width:0}
  .ps-flow{grid-template-columns:repeat(3,minmax(0,1fr))}
  .ps-layers{grid-template-columns:repeat(2,minmax(0,1fr))}
  .footer-main{gap:28px}
  .footer-links{gap:18px}
}
@media(max-width:767px){
  html{scroll-padding-top:88px}
  body{font-size:16px}
  main{overflow-wrap:anywhere}
  main :is(figure,article,section,div){min-width:0}
  .wrap,.ap-wrap,.co-wrap,.sg-wrap,.sd-wrap{width:90%}
  h2{font-size:28px}
  .overview>h2{font-size:clamp(24px,6vw,28px);text-wrap:balance}
  .ps-page .ps-section,.ps-body-visual,.ps-body-split,.ps-software-section,.ps-software-intro{padding-block:36px;scroll-margin-top:88px}
  .ps-category,.ps-local-nav{position:relative;top:auto}
  .ps-category a{font-size:16px;padding-block:14px}
  .ps-breadcrumb,.co-breadcrumb{flex-wrap:wrap;gap:6px 10px;font-size:13px}
  .ps-grid,.ps-featured,.ps-hero-grid,.ps-deploy,.ps-body-split>.wrap,.ps-models,
  .ps-page .ps-capabilities,.ps-page .ps-capabilities:has(article:nth-child(3):last-child),.ps-software-layout,.ps-software-page #software-operations .ps-software-points{grid-template-columns:minmax(0,1fr);gap:24px}
  .ps-detail-hero{padding:24px 0 32px}
  .ps-hero-grid{min-height:0}
  .ps-detail-hero h1{font-size:32px}
  .ps-detail-hero h2{font-size:22px}
  .ps-detail-hero p,.ps-featured p,.ps-body-split p{font-size:16px;line-height:1.85}
  .ps-featured{padding:20px}
  .ps-featured :is(h2,h3){font-size:28px}
  .ps-card>div{padding:20px}
  .ps-card img,.ps-card-image img.ps-scene{height:210px;aspect-ratio:auto;object-fit:contain}
  .ps-featured img{height:230px}
  .ps-hero-grid figure img,.ps-hero-grid figure img.ps-scene,.ps-software-page .ps-hero-grid figure img{height:auto;max-height:280px;aspect-ratio:auto;object-fit:contain}
  .ps-body-visual figure,.ps-body-split figure{padding:8px}
  .ps-body-visual img,.ps-body-split img,.ps-wide-image img,.ps-software-image img,.ps-software-page #software-operations .ps-software-image img{height:auto;max-height:360px;object-fit:contain}
  .ps-wide-image{padding-block:28px}
  .ps-flow,.ps-layers,.ps-software-flow{grid-template-columns:minmax(0,1fr)}
  .ps-flow li,.ps-flow li:first-child{padding:16px 0;border-right:0;border-bottom:1px solid #dce4ed}
  .ps-flow strong{font-size:18px}
  .ps-actions{flex-wrap:wrap}
  .ps-section-title h2,.ps-heading h2,.ps-deploy h2,.ps-body-split h2{font-size:26px}
  .ps-product-pagination{gap:12px}
  .hero.carousel{height:460px;min-height:0;max-height:none}
  .hero-content{padding-bottom:45px}
  .hero h1,.hero-slide h2{font-size:30px;line-height:1.45;letter-spacing:0;text-wrap:balance}
  .hero-en{font-size:13px}
  .hero-sub{font-size:17px;margin-top:16px}
  .hero-slide>img{object-position:60% center}
  .hero-controls .slide-tab{min-width:44px;min-height:44px}
  .numbers-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 12px;margin-top:28px}
  .numbers-grid strong{font-size:32px}
  .home-business-grid,.showcase-panel,.case-card,.iot-layout{grid-template-columns:minmax(0,1fr);gap:24px;min-height:0}
  .showcase-tabs{gap:8px;justify-content:space-between}
  .showcase-tabs button{font-size:15px;padding:12px 4px;min-height:44px}
  .showcase-image,.case-card figure{height:auto;aspect-ratio:16/10}
  .showcase-image img,.case-card figure img,.case-card figure.case-duku img{height:100%;object-fit:contain}
  .case-controls button,.case-controls .case-arrow{min-width:44px;min-height:44px}
  .case-controls button:not(.case-arrow){background:linear-gradient(#ccd8e3,#ccd8e3) center / 100% 4px no-repeat}
  .case-controls button[aria-current=true]{background:linear-gradient(#2168a6,#2168a6) center / 100% 4px no-repeat}
  .contact-inner{flex-direction:column;align-items:flex-start;gap:24px}
  .solutions-showcase,.customer-case{padding-block:36px}
  .case-copy h3,.showcase-copy h3{font-size:25px}
  .sg-tile,.sg-tile:nth-child(2){height:220px;clip-path:polygon(0 0,100% 0,100% 96%,96% 100%,0 100%)}
  .sg-tile-copy,.sg-tile:nth-child(2) .sg-tile-copy{left:18px;right:18px;bottom:20px}
  .sg-tile-copy>strong{font-size:23px}
  .sd-visual img{height:auto;max-height:300px;object-fit:contain}
  .hp-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .hp-heading .hp-number{flex:0 0 auto;white-space:nowrap}
  .hp-heading>div{flex:1;min-width:0}
  .hp-image{height:140px;padding:10px}
  .hp-card h3{font-size:14px;padding:12px;line-height:1.6}
  .hp-index a{padding:14px 10px;font-size:15px;gap:6px}
  .hp-hero p{font-size:16px}
  .team-mosaic{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .team-card:nth-child(n){transform:none}
  .team-dialog-inner{padding:8px}
  .team-dialog-header{gap:8px}
  .team-dialog-header h2{font-size:16px}
  .team-dialog button{min-width:44px;min-height:44px}
  .team-dialog-image{height:min(65svh,600px);padding-bottom:52px}
  .team-dialog-image img{max-width:100%}
  .team-dialog-image .team-prev,.team-dialog-image .team-next{position:absolute;bottom:0;font-size:38px}
  .team-dialog-image .team-prev{left:20%}
  .team-dialog-image .team-next{right:20%}
  .co-article-figure img{max-height:360px}
  .co-card-picture{max-height:220px}
  .ap-contact-grid{grid-template-columns:minmax(0,1fr);gap:24px}
  .footer-main{display:block;padding-block:32px}
  .footer-links{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:24px;gap:20px}
  .footer-links a{min-height:44px;display:flex;align-items:center;margin:0;font-size:13px}
  .footer-company strong{font-size:22px;letter-spacing:1px}
  .footer-bottom{flex-wrap:wrap}
  .mobile-table-scroll{max-width:100%;overflow-x:auto}
  .mobile-table-scroll table{min-width:560px}
}
@media(min-width:768px) and (max-width:1199px){
  .ps-hero-grid figure img,.ps-hero-grid figure img.ps-scene{height:auto;max-height:340px;object-fit:contain}
  .ps-card-image img.ps-scene{height:240px;object-fit:contain}
  .showcase-panel,.case-card{gap:28px}
  .numbers-grid{gap:12px}
}
@media(min-width:768px) and (max-width:900px){
  .ps-hero-grid,.ps-featured,.ps-body-split>.wrap,.ps-deploy{grid-template-columns:minmax(0,1fr)}
  .ps-models{grid-template-columns:repeat(2,minmax(0,1fr))}
  .footer-main{grid-template-columns:1fr}
}
