/* Tablet layout: readable content instead of a shrunken desktop canvas. */
.site-dialog { margin: auto; max-height: 85svh; max-width: calc(100vw - 32px); }
.dialog-close { width: 44px; height: 44px; right: 8px; top: 6px; }
@media (min-width: 768px) and (max-width: 1199px) {
  :root { --u: 1px; --header-height: 76px; }
  .site-header { height: 76px; padding: 0 5%; }
  .site-header .logo-link { width: 170px; }
  .site-header .header-actions { margin-left: auto; gap: 24px; }
  .nav-separator { display: none; }
  .menu-toggle { display: flex; width: 28px; height: 28px; flex-direction: column; justify-content: center; gap: 7px; }
  .menu-toggle span { display: block; width: 28px; height: 1px; background: #fff; }
  .site-header .desktop-nav {
    display: none; position: absolute; top: 76px; left: 0; width: 100%;
    margin: 0; padding: 14px 5% 24px; background: #080b12f5; gap: 0; font-size: 18px;
  }
  .site-header .desktop-nav.open { display: flex; flex-direction: column; align-items: stretch; }
  .desktop-nav a { padding: 14px 0; border-bottom: 1px solid #252525; }
  .hero { height: 680px; }
  .hero-copy { left: 6%; top: 240px; width: 88%; }
  .hero h1, .hero h2 { font-size: clamp(40px, 4.4vw, 50px); }
  .hero-copy > p { font-size: 24px; line-height: 1.8; white-space: normal; max-width: 600px; margin-top: 24px; }
  .hero-more { margin-top: 44px; height: 48px; min-width: 164px; padding: 0 20px; font-size: 15px; gap: 24px; }
  .round-arrow { width: 24px; height: 24px; font-size: 18px; }
  .scroll-hint { left: calc(50% - 20px); top: auto; bottom: 28px; width: 40px; height: 50px; }
  .carousel-arrow { font-size: 48px; width: 38px; height: 60px; }
  .hero-pagination { bottom: 28px; }
  .hero-pagination .swiper-pagination-bullet { width: 7px; height: 7px; margin: 0 6px; }
  .applications, .news, .manufacturing { height: auto; padding: 64px 5%; }
  .section-heading { position: relative; inset: auto; width: 100%; height: auto; }
  .section-heading h2 { font-size: 32px; line-height: 1.6; white-space: normal; }
  .section-tag { height: 44px; min-width: 160px; padding: 0 26px; font-size: 15px; gap: 14px; margin-top: 26px; }
  .section-tag i { width: 7px; height: 7px; }
  .application-grid, .news-grid { position: relative; inset: auto; width: 100%; height: auto; margin-top: 42px; gap: 18px; }
  .application-card { height: 410px; border-radius: 16px; }
  .application-card > img { object-position: left center; }
  .application-copy { top: auto; bottom: 26px; padding: 0 14px; }
  .application-copy h3 { font-size: 20px; line-height: 1.6; }
  .application-copy p { font-size: 12px; line-height: 1.8; margin-top: 12px; }
  .application-copy .pill { min-width: 138px; height: 40px; margin-top: 22px; font-size: 14px; }
  .technology { --u: 1px; height: auto; min-height: 0; padding: 0; }
  .technology-scene { position: relative; top: auto; height: auto; padding: 64px 5%; }
  .technology .section-heading { position: relative; inset: auto; width: 100%; transform: none; will-change: auto; }
  .technology-backdrop { opacity: .65; background-position: 25% center; }
  .technology-cards-viewport { position: relative; inset: auto; width: 100%; overflow: visible; mask-image: none; -webkit-mask-image: none; }
  .technology-cards { width: 100%; margin: 50px 0 0; padding: 0 0 64px; gap: 24px; transform: none; will-change: auto; }
  .technology-cards .tech-card { --tech-edge-radius: 16px; height: 360px; padding: 28px; transform: none; }
  .technology-cards .tech-card:nth-child(even) { top: 64px; }
  .tech-number { font-size: 54px; line-height: 1.3; }
  .tech-card h3 { font-size: 21px; line-height: 1.6; margin-top: 10px; }
  .tech-card > p { font-size: 14px; line-height: 1.9; margin-top: 13px; }
  .tech-spec { top: auto; bottom: 28px; left: 28px; right: 24px; gap: 12px; font-size: 14px; line-height: 1.9; white-space: normal; }
  .tech-spec img { width: 24px; height: 24px; flex: none; margin-top: 2px; }
  .manufacturing-intro { font-size: 18px; line-height: 1.8; margin: 30px 0 0; }
  .manufacturing { padding-bottom: 28px; }
  .manufacturing .stats { position: relative; inset: auto; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px 32px; margin: 54px 0 0; }
  .stats .stat { position: relative; inset: auto; width: 100%; height: auto; }
  .stat-value { gap: 12px; }
  .stat-value strong { font-size: 60px; letter-spacing: -2px; }
  .stat-value small { font-size: 16px; }
  .stat > p { font-size: 15px; line-height: 1.7; margin-top: 22px; }
  .particle-wave { top: 290px; height: 460px; mask-image: linear-gradient(transparent, #000 8%, #000 76%, transparent); -webkit-mask-image: linear-gradient(transparent, #000 8%, #000 76%, transparent); }
  .factory .factory-intro { left: 6%; top: 16%; width: 70%; font-size: 20px; line-height: 1.9; }
  .factory .factory-thumbs { left: 6%; top: auto; bottom: 100px; width: 88%; height: 100px; gap: 12px; }
  .factory .factory-thumb, .factory .factory-thumb.active { width: calc((100% - 36px) / 4); height: 100px; }
  .factory .factory-thumb-visual { width: calc(100% - 10px); height: 80px; }
  .factory .factory-thumb.active .factory-thumb-visual { transform: translate(-50%, -50%) scale(1.14); }
  .factory-thumb > span { font-size: 13px; }
  .news-image { height: auto; aspect-ratio: 503 / 327; border-radius: 16px; }
  .news-copy { padding: 20px 16px; }
  .news-category { font-size: 12px; line-height: 26px; padding: 0 8px; }
  .news-copy h3 { font-size: 17px; line-height: 1.8; margin: 14px 0 18px; }
  .news-copy time { font-size: 12px; }
  .news-more { font-size: 13px; padding-top: 16px; margin-top: 16px; }
  .news-more > span { width: 23px; height: 23px; font-size: 15px; line-height: 23px; }
  .partners { height: 650px; padding-top: 64px; }
  .partner-marquee { top: 290px; gap: 14px; }
  .partner-set { gap: 12px; padding-right: 12px; }
  .partner-card { flex-basis: 210px; width: 210px; height: 100px; }
  .footer { display: grid; grid-template-columns: 1fr 1fr; height: auto; padding: 40px 6% 100px; }
  .footer::before { display: none; }
  .footer .pos { position: relative; inset: auto; width: 100%; height: auto; }
  .footer-brand, .footer-links, .copyright { grid-column: 1 / -1; }
  .footer-brand { gap: 32px; padding-bottom: 32px; align-items: center; }
  .footer-brand img { width: 170px; }
  .footer-brand p { font-size: 14px; line-height: 2; }
  .footer-links { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px 24px; margin-top: 36px; }
  .footer-title { font-size: 16px; }
  .footer-column ul { margin-top: 18px; font-size: 14px; line-height: 2; }
  .footer-contact { margin-top: 40px; font-size: 15px; }
  .footer-contact .phone { font-size: 26px; margin-top: 14px; }
  .address-label { margin: 24px 0 10px; }
  .footer-contact > span { font-size: 14px; }
  .qr-codes { margin-top: 40px; align-self: center; justify-content: flex-end; gap: 24px; font-size: 13px; }
  .qr-codes button { width: 108px; }
  .qr-codes span { margin-top: 10px; }
  .copyright { margin-top: 32px; display: block; font-size: 12px; line-height: 2; }
  .copyright > div { margin-top: 12px; gap: 10px; }
  .footer .footer-wordmark { position: absolute; top: auto; bottom: 0; left: 6%; width: 88%; height: auto; }
  .dialog-inner { padding: 42px; }
}
@media (max-width: 1199px) {
  .section-heading h2, .tech-card h3 { text-wrap: balance; }
  .site-header .header-actions { margin-left: auto; gap: 12px; }
  .site-header .search-toggle { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; }
  .site-header .search-toggle svg { width: 21px; height: 24px; }
  .site-header .menu-toggle { align-items: center; width: 44px; height: 44px; }
}
@media (max-width: 767px) {
  .hero h1, .hero h2 { font-size: clamp(28px, 8.4vw, 38px); }
  .hero-copy > p { font-size: clamp(17px, 4.8vw, 20px); }
  .tech-spec { right: 24px; white-space: normal; }
  .tech-spec > span { min-width: 0; }
  .tech-spec img { flex: none; }
  .technology-cards .tech-card { display: flex; flex-direction: column; height: auto; min-height: 340px; }
  .tech-card .tech-spec { position: static; inset: auto; margin-top: auto; padding-top: 24px; }
  .stat-value strong { font-size: clamp(32px, 10.7vw, 46px); }
  .stat-value { gap: 6px; }
  .stat-value small { font-size: clamp(10px, 3vw, 13px); }
  .manufacturing { padding-bottom: 28px; }
  .manufacturing .stats { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-bottom: 0; }
  .stats .stat { min-width: 0; }
  .stat-value strong { flex: none; white-space: nowrap; }
  .stat-certification .stat-value { flex-wrap: nowrap; }
  .stat-certification .stat-value strong { font-size: clamp(28px, 9.6vw, 40px); }
  .stat-certification .stat-value small { flex: none; }

}
@media (min-width: 1200px) {
  .tech-card > p { font-size: max(12px, calc(16 * var(--u))); line-height: max(21px, calc(33 * var(--u))); }
  .tech-spec { font-size: max(12px, calc(18 * var(--u))); }
  .footer-title { font-size: max(14px, calc(18 * var(--u))); }
  .footer-column ul, .copyright { font-size: max(12px, calc(16 * var(--u))); }
  .news-copy time, .news-more { font-size: max(12px, calc(14 * var(--u))); }
  .stat > p, .stat-value small { font-size: max(12px, calc(18 * var(--u))); }
}