/* V454 — Gallery + Technical family navigation refinement
   Desktop layout preserved. Tablet/mobile use a stacked list.
   Technical navigation is no longer sticky on any viewport. */

/* Technical navigation: stay in normal document flow. */
body.tech266 .tech266-jump{
  position:static !important;
  top:auto !important;
  z-index:auto !important;
  box-shadow:none !important;
}

@media (max-width:1100px){
  /* Gallery family navigation — no horizontal swipe on tablet/mobile. */
  body.ct-gallery-page .cg333-family-nav .cg271-shell{
    padding-left:18px !important;
    padding-right:18px !important;
  }
  body.ct-gallery-page .cg333-family-grid{
    display:grid !important;
    grid-template-columns:1fr !important;
    width:100% !important;
    overflow:visible !important;
    overscroll-behavior:auto !important;
    scroll-snap-type:none !important;
    border-left:1px solid rgba(39,35,31,.075) !important;
    border-top:1px solid rgba(39,35,31,.075);
  }
  body.ct-gallery-page .cg333-family-item{
    flex:none !important;
    width:100% !important;
    min-height:70px !important;
    padding:14px 18px 13px !important;
    border-right:1px solid rgba(39,35,31,.075) !important;
    border-bottom:1px solid rgba(39,35,31,.075) !important;
    scroll-snap-align:none !important;
  }
  body.ct-gallery-page .cg333-family-item:first-child{
    border-left:0 !important;
  }
  body.ct-gallery-page .cg333-family-item strong{
    font-size:12.5px !important;
  }
  body.ct-gallery-page .cg333-family-item span{
    max-width:none !important;
    font-size:10.8px !important;
    line-height:1.4 !important;
  }
  body.ct-gallery-page .cg333-family-item[aria-current="page"]:after{
    left:18px !important;
    right:18px !important;
  }

  /* Technical category navigation — same stacked language as gallery. */
  body.tech266 .tech266-jump{
    position:static !important;
    top:auto !important;
  }
  body.tech266 .tech266-jump-inner{
    display:grid !important;
    grid-template-columns:1fr !important;
    width:100% !important;
    padding:0 18px !important;
    overflow:visible !important;
    scroll-snap-type:none !important;
    border-left:0 !important;
  }
  body.tech266 .tech266-jump a{
    flex:none !important;
    width:100% !important;
    min-height:70px !important;
    padding:14px 18px 13px !important;
    border-left:1px solid rgba(39,35,31,.075) !important;
    border-right:1px solid rgba(39,35,31,.075) !important;
    border-bottom:1px solid rgba(39,35,31,.075) !important;
    scroll-snap-align:none !important;
  }
  body.tech266 .tech266-jump a:first-child{
    border-top:1px solid rgba(39,35,31,.075);
  }
  body.tech266 .tech266-jump a strong{
    font-size:12.5px !important;
  }
  body.tech266 .tech266-jump a span{
    max-width:none !important;
    font-size:10.8px !important;
    line-height:1.4 !important;
  }
  body.tech266 .tech266-jump a:after{
    left:18px !important;
  }
  body.tech266 .tech266-jump a[aria-current="true"]:after,
  body.tech266 .tech266-jump a:hover:after,
  body.tech266 .tech266-jump a:focus-visible:after{
    right:18px !important;
  }
  body.tech266 .tech266-system,
  body.tech266 .tech266-system-reverse{
    scroll-margin-top:84px !important;
  }
}

@media (max-width:600px){
  body.ct-gallery-page .cg333-family-nav .cg271-shell{
    padding-left:14px !important;
    padding-right:14px !important;
  }
  body.ct-gallery-page .cg333-family-item{
    min-height:66px !important;
    padding:13px 15px 12px !important;
  }
  body.ct-gallery-page .cg333-family-item strong{
    font-size:12px !important;
  }
  body.ct-gallery-page .cg333-family-item span{
    font-size:10.35px !important;
  }
  body.ct-gallery-page .cg333-family-item[aria-current="page"]:after{
    left:15px !important;
    right:15px !important;
  }

  body.tech266 .tech266-jump-inner{
    padding:0 14px !important;
  }
  body.tech266 .tech266-jump a{
    min-height:66px !important;
    padding:13px 15px 12px !important;
  }
  body.tech266 .tech266-jump a strong{
    font-size:12px !important;
  }
  body.tech266 .tech266-jump a span{
    font-size:10.35px !important;
  }
  body.tech266 .tech266-jump a:after{
    left:15px !important;
  }
  body.tech266 .tech266-jump a[aria-current="true"]:after,
  body.tech266 .tech266-jump a:hover:after,
  body.tech266 .tech266-jump a:focus-visible:after{
    right:15px !important;
  }
}