
/* =========================================================
   JY ROBOT SITE-WIDE MOBILE REPAIR V1
   Scope: <= 760px only. Desktop remains unchanged.
   ========================================================= */
.mobile-menu-toggle{display:none}

@media(max-width:760px){
  html,body{max-width:100%;overflow-x:hidden!important}
  *{box-sizing:border-box}

  /* ---------- Shared header ---------- */
  .site-header{
    position:sticky!important;top:0!important;z-index:95!important;
    height:auto!important;background:#fff!important;
    box-shadow:0 3px 18px rgba(17,24,32,.08)!important
  }
  .header-inner{
    width:100%!important;height:auto!important;margin:0!important;
    padding:10px 14px!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto 42px!important;
    grid-template-areas:"logo lang menu" "nav nav nav" "search search search"!important;
    column-gap:8px!important;row-gap:0!important;align-items:center!important
  }
  .logo{grid-area:logo!important;justify-self:start!important;min-width:0!important}
  .logo img{height:39px!important;width:auto!important;max-width:145px!important}
  .header-tools{display:contents!important}
  .lang{
    grid-area:lang!important;justify-self:end!important;
    border-left:0!important;padding-left:0!important;gap:2px!important;font-size:11px!important
  }
  .lang-current,.lang-link{
    height:32px!important;padding:0 6px!important;gap:4px!important;border-radius:6px!important
  }
  .lang-flag{font-size:14px!important}.lang-sep{display:none!important}

  .mobile-menu-toggle{
    grid-area:menu!important;display:flex!important;width:42px!important;height:42px!important;
    border:1px solid #dfe3e7!important;border-radius:8px!important;background:#fff!important;
    padding:0!important;align-items:center!important;justify-content:center!important;
    flex-direction:column!important;gap:4px!important;cursor:pointer!important
  }
  .mobile-menu-toggle span{
    display:block!important;width:18px!important;height:2px!important;
    background:#202830!important;border-radius:2px!important;transition:.18s ease!important
  }
  .header-inner.mobile-open .mobile-menu-toggle span:nth-child(1){transform:translateY(6px) rotate(45deg)!important}
  .header-inner.mobile-open .mobile-menu-toggle span:nth-child(2){opacity:0!important}
  .header-inner.mobile-open .mobile-menu-toggle span:nth-child(3){transform:translateY(-6px) rotate(-45deg)!important}

  .nav{
    grid-area:nav!important;display:none!important;width:100%!important;max-width:none!important;
    margin:10px 0 0!important;padding:8px 0 0!important;overflow:visible!important;
    grid-auto-flow:row!important;grid-auto-columns:auto!important;
    grid-template-columns:1fr 1fr!important;gap:0!important;
    border-top:1px solid #eceff1!important;font-size:14px!important;white-space:normal!important
  }
  .nav a{
    justify-content:flex-start!important;min-height:44px!important;
    padding:10px!important;border-bottom:1px solid #f0f2f3!important;
    font-size:14px!important;line-height:1.25!important;white-space:normal!important
  }
  .nav a.active{
    color:var(--red,#c63d36)!important;background:#fff7f7!important;
    border-bottom-color:#f0f2f3!important
  }
  .site-search{
    grid-area:search!important;display:none!important;width:100%!important;height:42px!important;
    margin:10px 0 2px!important
  }
  .site-search input{min-width:0!important}
  .site-search button{height:42px!important;width:46px!important;flex:0 0 46px!important}
  .header-inner.mobile-open .nav{display:grid!important}
  .header-inner.mobile-open .site-search{display:flex!important}

  /* ---------- Breadcrumb ---------- */
  .breadcrumb-wrap{overflow:hidden!important}
  .breadcrumb{
    width:100%!important;max-width:none!important;
    padding:13px 14px!important;font-size:12px!important;line-height:1.6!important;
    white-space:normal!important;overflow-wrap:anywhere!important
  }

  /* ---------- Product detail page ---------- */
  .page{
    width:100%!important;max-width:none!important;margin:14px auto 44px!important;
    padding:0 12px!important;display:block!important;min-width:0!important
  }
  .page>.sidebar{display:none!important}
  .product-card{
    width:100%!important;min-width:0!important;max-width:100%!important;
    display:flex!important;flex-direction:column!important;gap:20px!important;
    padding:14px!important;overflow:hidden!important
  }
  .product-card>*{width:100%!important;min-width:0!important;max-width:100%!important}
  .gallery{
    width:100%!important;min-width:0!important;display:flex!important;
    flex-direction:column!important;gap:10px!important
  }
  .main-image{
    order:1!important;width:100%!important;min-width:0!important;
    min-height:0!important;height:auto!important;aspect-ratio:1/1!important;
    padding:14px!important;overflow:hidden!important
  }
  .main-image img{
    display:block!important;width:100%!important;height:100%!important;
    max-width:100%!important;max-height:100%!important;object-fit:contain!important
  }
  .zoom-hint{
    right:8px!important;bottom:8px!important;font-size:10px!important;padding:6px 8px!important
  }
  .thumbs{
    order:2!important;width:100%!important;display:flex!important;flex-direction:row!important;
    gap:8px!important;overflow-x:auto!important;padding:1px 0 4px!important;
    -webkit-overflow-scrolling:touch!important
  }
  .thumb{width:72px!important;height:72px!important;flex:0 0 72px!important}

  .product-info{
    width:100%!important;min-width:0!important;max-width:100%!important;
    overflow:hidden!important
  }
  .product-info h1,h1{
    font-size:27px!important;line-height:1.15!important;overflow-wrap:anywhere!important
  }
  .eyebrow{font-size:11px!important;margin-bottom:9px!important}
  .desc{
    font-size:14px!important;line-height:1.65!important;padding-bottom:16px!important;margin-bottom:16px!important
  }
  .variant-selector{
    width:100%!important;min-width:0!important;padding:14px!important;margin-bottom:18px!important
  }
  .variant-selector-head{gap:10px!important;margin-bottom:12px!important}
  .variant-title{font-size:16px!important}.variant-count{font-size:11px!important}
  .variant-control{
    grid-template-columns:1fr!important;gap:7px!important;width:100%!important;min-width:0!important
  }
  .variant-control select{
    width:100%!important;max-width:100%!important;min-width:0!important;
    height:44px!important;font-size:14px!important
  }
  .quick-spec{grid-template-columns:minmax(105px,42%) minmax(0,1fr)!important;gap:10px!important;font-size:14px!important}
  .quick-spec b,.quick-spec span{min-width:0!important;overflow-wrap:anywhere!important}
  .ctas{max-width:none!important;width:100%!important;margin-top:18px!important}
  .btn{width:100%!important;height:46px!important;font-size:14px!important}

  .content,.support{
    grid-column:auto!important;width:100%!important;max-width:100%!important;
    min-width:0!important;margin-top:14px!important
  }
  .content{padding:22px 16px!important;overflow:hidden!important}
  .support{display:block!important;padding:20px 16px!important}
  .support-note{margin-top:18px!important;padding-left:14px!important}
  .section{padding-bottom:24px!important}
  .section h2{font-size:21px!important;line-height:1.25!important}
  .section p{font-size:14px!important}
  .feature-grid{grid-template-columns:1fr!important}
  .drawing-grid,.drawing,.drawing-card{width:100%!important;max-width:100%!important}
  .drawing-card img{width:100%!important;height:auto!important;max-width:100%!important}
  .table-wrap{
    width:100%!important;max-width:100%!important;overflow-x:auto!important;
    -webkit-overflow-scrolling:touch!important
  }
  table{min-width:760px!important;font-size:12px!important}
  th,td{padding:8px!important}

  /* ---------- Category pages ---------- */
  .category-page{
    width:100%!important;max-width:none!important;padding:0 12px!important;
    grid-template-columns:1fr!important;gap:0!important
  }
  .category-page>.sidebar{display:none!important}
  .category-hero{
    min-height:0!important;padding:20px 16px!important;margin-bottom:16px!important;
    flex-direction:column!important;align-items:flex-start!important;gap:16px!important
  }
  .category-hero h1{font-size:28px!important;line-height:1.12!important}
  .category-hero p{font-size:14px!important;line-height:1.65!important}
  .category-inquiry{width:100%!important}
  .category-inquiry .btn,.category-inquiry a{width:100%!important}
  .category-children{gap:7px!important;margin-bottom:16px!important}
  .category-chip{min-height:36px!important;padding:7px 10px!important;font-size:12px!important}
  .category-toolbar{gap:8px!important;padding:10px 0!important;margin-bottom:14px!important}
  .category-toolbar b{font-size:16px!important}
  .product-grid{grid-template-columns:1fr!important;gap:12px!important}
  .product-tile-media{aspect-ratio:4/3!important;padding:16px!important}
  .product-tile-body{padding:15px!important}
  .product-tile h2{font-size:18px!important}

  /* ---------- Modal / Lightbox ---------- */
  .modal{padding:10px!important}
  .modal-card{width:100%!important;max-height:92vh!important;overflow:auto!important;padding:20px 16px!important}
  .form-grid{grid-template-columns:1fr!important}
  .lightbox-scroll{padding:68px 12px 20px!important}
  .lightbox img{max-width:calc(100vw - 24px)!important;max-height:calc(100vh - 98px)!important}
  .lightbox-tools{left:12px!important;right:60px!important;transform:none!important;overflow-x:auto!important}
  .lightbox-tip{display:none!important}

  /* ---------- Footer ---------- */
  .footer-main{
    grid-template-columns:1fr!important;gap:26px!important;
    padding:32px 18px 26px!important
  }
  .footer-brand-card img{height:38px!important}
  .footer-bottom-inner{
    padding:14px 18px!important;gap:8px!important;
    flex-direction:column!important;align-items:flex-start!important
  }
}

@media(max-width:430px){
  .product-info h1,h1{font-size:25px!important}
  .main-image{aspect-ratio:1/1!important}
  .quick-spec{grid-template-columns:minmax(100px,43%) minmax(0,1fr)!important}
}
