/* Functional refinements within the approved ANYANG design system. */
.v5 .factory-browser{max-width:1120px}
.v5 .factory-browser figure[data-slide]{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);border-radius:22px}
.factory-image-link{display:block;position:relative;min-width:0;background:#e6e9e5;overflow:hidden}
.factory-image-link img{display:block;width:100%;height:320px;object-fit:contain}
.factory-image-link>span{position:absolute;left:14px;bottom:14px;padding:8px 12px;background:#fffef4f2;border:1px solid #dce2e3;border-radius:4px;color:#252e34;font-size:11px;opacity:0;transition:opacity .15s}
.factory-image-link:hover>span,.factory-image-link:focus-visible>span{opacity:1}
.v5 .factory-browser figcaption{padding:26px 30px}
.v5 .factory-browser figcaption h3{font-size:26px}
.v5 .factory-testing{font-size:12px;align-self:flex-start;margin-top:14px}
.v5 .factory-browser .factory-toolbar{margin-top:12px;align-items:center}
.v5 .factory-browser .factory-play-note{margin:0;line-height:1.7}
.factory-photo-index{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:8px;margin-top:13px}
.factory-photo-index button{position:relative;min-width:0;background:#e6e9e5;border:2px solid transparent;border-radius:6px;padding:2px;cursor:pointer;overflow:hidden}
.factory-photo-index img{display:block;width:100%;height:auto;aspect-ratio:1.5;object-fit:contain}
.factory-photo-index button>span{position:absolute;left:4px;bottom:4px;font-size:10px;line-height:1.4;padding:1px 4px;background:#fff;color:#252e34;border-radius:2px}
.factory-photo-index button:hover{border-color:#8b9ba3}
.factory-photo-index button[aria-pressed=true]{border-color:#0057a7;background:#fff}
.factory-photo-index button[aria-pressed=true]>span{background:#0057a7;color:#fff}
html.factory-viewer-open{overflow:hidden}
.factory-photo-viewer{width:min(1280px,94vw);max-width:none;height:90dvh;max-height:none;border:0;border-radius:14px;padding:0;background:#eef0ed;color:#252e34}
.factory-photo-viewer[open]{display:flex;flex-direction:column}
.factory-photo-viewer::backdrop{background:#14242bd9}
.factory-viewer-bar{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:12px 22px;background:#fff;border-bottom:1px solid #dce2e3}
.factory-viewer-bar #factory-photo-title{font:500 20px/1.3 var(--body);margin:0}
.factory-viewer-bar button{width:44px;height:44px;flex:none;border:0;background:none;font-size:30px!important;cursor:pointer}
.factory-full-photo{min-height:0;flex:1;padding:16px}
.factory-full-photo img{width:100%;height:100%;object-fit:contain}
.factory-download{font-size:12px;padding:12px 22px;background:#fff;color:#0057a7;text-align:center}
@media(min-width:801px){
 .v5 .v4-header .v4-mega{height:min(550px,calc(100dvh - var(--nav-height) - max(160px,20dvh)))}
 .v5 .mega-shell{grid-template-columns:230px minmax(0,1fr)}
 .v5 .mega-content{padding:22px 30px}
 .v5 .product-rail button{padding-top:6px;padding-bottom:6px}
 .v5 .mega-content.single-selection{grid-template-columns:minmax(0,min(40%,400px)) minmax(240px,1fr);gap:28px 36px}
 .v5 .mega-content.single-selection .mega-cards{align-self:start}
 .v5 .mega-content.single-selection .menu-selection-help{max-width:500px;padding:0;align-self:center}
 .v5 .mega-content.single-selection .cable-card-copy{padding:14px 18px}
 .v5 .mega-content.single-selection .cable-card h3{font-size:16px;margin:0}
 .v5 .mega-content.single-selection .cable-visual{aspect-ratio:1.78}
}
@media(min-width:801px) and (max-width:1080px){.v5 .mega-shell{grid-template-columns:200px minmax(0,1fr)}.v5 .mega-content.single-selection{grid-template-columns:minmax(0,1fr)}.v5 .mega-content.single-selection .cable-visual{aspect-ratio:3.2}}
@media(max-width:1100px){.factory-photo-index{grid-template-columns:repeat(5,minmax(0,1fr))}.factory-photo-index img{height:65px;aspect-ratio:auto}.v5 .factory-browser figcaption{padding:22px}.v5 .factory-browser figcaption h3{font-size:24px}}
@media(max-width:800px){.v5 .factory-browser figure[data-slide]{grid-template-columns:1fr}.factory-image-link img{height:280px}.v5 .factory-browser .factory-toolbar{align-items:stretch}.v5 .factory-browser .factory-play-note{text-align:center}.factory-photo-index img{height:55px}.factory-viewer-bar #factory-photo-title{font-size:17px}}
@media(max-width:480px){.factory-image-link img{height:220px}.v5 .factory-browser figcaption{padding:20px}.factory-photo-index{gap:5px}.factory-photo-index img{height:42px}.factory-photo-index button>span{font-size:9px}.factory-full-photo{padding:8px}.factory-viewer-bar{padding:8px 14px}.factory-image-link>span{opacity:1}}
@media(prefers-reduced-motion:reduce){.factory-image-link>span{transition:none}}

/* BEGIN ANYANG HOMEPAGE WORKSHOP LAYOUT 20261013 */
/* Workshop layout refinement. Append after refinements.css.
   Visual changes only: existing slides, wording, links and scripts are retained. */
#manufacturing {
  --workshop-blue: #0057a7;
  --workshop-paper: #eff0ed;
  --workshop-ink: #263740;
  --workshop-line: #d0d6d5;
  padding-block: 42px 46px;
  color: var(--workshop-ink);
}

#manufacturing > .section-heading {
  display: block;
  width: 100%;
  max-width: 1120px;
  margin: 0 auto 26px;
}
#manufacturing > .section-heading > .eyebrow {
  padding: 0;
  margin: 0 0 16px;
  font-size: 11px;
  line-height: 1.5;
  letter-spacing: .13em;
}
#manufacturing > .section-heading > div {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
  align-items: end;
  gap: 22px 52px;
}
#manufacturing > .section-heading h2 {
  margin: 0;
  font-size: clamp(30px, 2.8vw, 42px);
  line-height: 1.14;
  letter-spacing: -.035em;
}
#manufacturing > .section-heading p:not(.eyebrow) {
  max-width: none;
  margin: 0;
  font-size: 14px;
  line-height: 1.7;
  color: #5d686e;
}

#manufacturing .factory-browser {
  width: 100%;
  max-width: 1120px;
  margin: 0 auto;
  background: #fff;
  border: 1px solid var(--workshop-line);
  border-radius: 12px;
  overflow: hidden;
}
#manufacturing .carousel-slides {
  min-width: 0;
}
#manufacturing .factory-browser figure[data-slide]:not([hidden]) {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
  align-items: stretch;
  gap: 0;
  margin: 0;
  border: 0;
  border-radius: 0;
  background: #fff;
  overflow: visible;
}
#manufacturing [hidden] {
  display: none !important;
}
#manufacturing .factory-image-link {
  display: block;
  min-width: 0;
  aspect-ratio: 4 / 3;
  background: var(--workshop-paper);
  border-radius: 0;
  overflow: hidden;
}
#manufacturing .factory-image-link img {
  display: block;
  width: 100%;
  height: 100%;
  max-height: none;
  aspect-ratio: auto;
  object-fit: contain;
  object-position: center;
  border-radius: 0;
}
#manufacturing .factory-image-link > span {
  display: none;
}
#manufacturing .factory-browser figcaption {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  min-width: 0;
  padding: 28px;
  gap: 0;
  background: #fff;
  border-left: 1px solid var(--workshop-line);
}
#manufacturing .factory-browser figcaption .small {
  margin: 0;
  color: var(--workshop-blue);
  font-size: 10px;
  line-height: 1.5;
  letter-spacing: .1em;
}
#manufacturing .factory-browser figcaption h3 {
  margin: 12px 0 14px;
  color: var(--workshop-ink);
  font-size: clamp(24px, 2vw, 28px);
  line-height: 1.18;
  letter-spacing: -.025em;
}
#manufacturing .factory-browser figcaption p {
  margin: 0 0 21px;
  font-size: 14px;
  line-height: 1.65;
  color: #5d686e;
}
#manufacturing .factory-original {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: flex-start;
  min-height: 44px;
  max-width: 100%;
  margin: 0;
  padding: 11px 15px;
  color: #fff;
  background: var(--workshop-blue);
  border: 1px solid var(--workshop-blue);
  border-radius: 5px;
  font-size: 13px;
  line-height: 1.5;
  text-align: center;
}
#manufacturing .factory-original:hover {
  color: #fff;
  background: #004581;
  border-color: #004581;
}
#manufacturing .factory-testing {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  min-height: 44px;
  max-width: 100%;
  margin: 6px 0 0;
  padding: 9px 0;
  color: var(--workshop-blue);
  border: 0;
  border-radius: 0;
  font-size: 12px;
  line-height: 1.5;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 4px;
}

#manufacturing .factory-browser .factory-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px 24px;
  margin: 0;
  padding: 16px 28px 8px;
  border-top: 1px solid var(--workshop-line);
}
#manufacturing .factory-browser .factory-play-note {
  margin: 0;
  font-size: 11px;
  line-height: 1.6;
  color: #5d686e;
  text-align: left;
}
#manufacturing .factory-toolbar .carousel-controls {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: nowrap;
  gap: 20px;
  margin: 0;
  padding: 0;
}
#manufacturing .carousel-arrows {
  display: flex;
  align-items: center;
  gap: 12px;
}
#manufacturing .carousel-arrows button {
  flex: 0 0 44px;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 1px solid #bdc8c9;
  border-radius: 50%;
  color: var(--workshop-blue);
  background: #fff;
}
#manufacturing .carousel-arrows button:hover {
  border-color: var(--workshop-blue);
  background: #eff4f8;
}
#manufacturing .carousel-arrows output {
  min-width: 57px;
  font-size: 11px;
  line-height: 1.5;
  letter-spacing: .1em;
  text-align: center;
  font-variant-numeric: tabular-nums;
}
#manufacturing .carousel-play {
  min-height: 44px;
  padding: 9px 0;
  border: 0;
  color: var(--workshop-blue);
  font-size: 12px;
  line-height: 1.5;
  text-decoration: underline;
  text-underline-offset: 4px;
  white-space: nowrap;
}
#manufacturing .factory-photo-index {
  display: grid;
  grid-template-columns: repeat(10, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
  padding: 4px 28px 22px;
  overflow: visible;
}
#manufacturing .factory-photo-index button {
  display: grid;
  place-items: center;
  position: relative;
  min-width: 44px;
  min-height: 44px;
  margin: 0;
  padding: 2px;
  background: var(--workshop-paper);
  border: 2px solid transparent;
  border-radius: 5px;
  overflow: hidden;
}
#manufacturing .factory-photo-index img {
  display: block;
  width: 100%;
  height: auto;
  max-height: 76px;
  aspect-ratio: 3 / 2;
  object-fit: contain;
}
#manufacturing .factory-photo-index button:hover {
  border-color: #8b9ba3;
}
#manufacturing .factory-photo-index button[aria-pressed="true"] {
  border-color: var(--workshop-blue);
  background: #fff;
}
#manufacturing .factory-photo-index button > span {
  left: 3px;
  bottom: 3px;
  padding: 1px 4px;
  font-size: 10px;
  line-height: 1.4;
}
#manufacturing :is(a, button):focus-visible {
  outline: 3px solid var(--workshop-blue);
  outline-offset: 3px;
}
#manufacturing .factory-image-link:focus-visible {
  outline-offset: -4px;
}

@media (max-width: 1080px) and (min-width: 801px) {
  #manufacturing .factory-browser figcaption {
    padding: 24px;
  }
  #manufacturing .factory-browser figcaption h3 {
    font-size: 24px;
  }
  #manufacturing .factory-photo-index {
    gap: 6px;
    padding-inline: 24px;
  }
  #manufacturing .factory-browser .factory-toolbar {
    padding-inline: 24px;
  }
}
@media (max-width: 1000px) {
  #manufacturing {
    padding-block: 34px 36px;
  }
  #manufacturing > .section-heading {
    margin-bottom: 22px;
  }
  #manufacturing > .section-heading > .eyebrow {
    margin-bottom: 12px;
  }
  #manufacturing > .section-heading > div {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  #manufacturing > .section-heading h2 {
    font-size: clamp(28px, 4.5vw, 36px);
    line-height: 1.15;
  }
  #manufacturing > .section-heading p:not(.eyebrow) {
    font-size: 14px;
    line-height: 1.65;
  }
  #manufacturing .factory-browser figure[data-slide]:not([hidden]) {
    grid-template-columns: minmax(0, 1fr);
  }
  #manufacturing .factory-browser figcaption {
    padding: 22px;
    border-left: 0;
    border-top: 1px solid var(--workshop-line);
  }
  #manufacturing .factory-browser figcaption h3 {
    margin: 10px 0 12px;
    font-size: 24px;
  }
  #manufacturing .factory-browser figcaption p {
    margin-bottom: 17px;
  }
  #manufacturing .factory-browser .factory-toolbar {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
    padding: 15px 16px 9px;
  }
  #manufacturing .factory-toolbar .carousel-controls {
    justify-content: space-between;
    flex-wrap: nowrap;
    gap: 10px;
  }
  #manufacturing .factory-photo-index {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 6px;
    padding: 4px 16px 16px;
  }
}
@media (max-width: 400px) {
  #manufacturing .factory-browser figcaption {
    padding: 20px;
  }
  #manufacturing .factory-photo-index {
    gap: 4px;
  }
  #manufacturing .factory-photo-index button > span {
    font-size: 9px;
  }
  #manufacturing .carousel-arrows {
    gap: 7px;
  }
  #manufacturing .carousel-arrows output {
    min-width: 52px;
  }
}
@media (prefers-reduced-motion: reduce) {
  #manufacturing :is(a, button, img) {
    animation: none;
    transition: none;
  }
}

/* Desktop: use the caption column for controls and the contact sheet.
   display:contents changes layout only; hidden slides remain display:none. */
@media (min-width: 1001px) {
  #manufacturing .factory-browser {
    display: grid;
    grid-template-columns: minmax(0, 1.8fr) minmax(320px, 1fr);
    grid-template-rows: minmax(0, 1fr) auto auto;
    align-items: stretch;
  }
  #manufacturing .factory-browser > .carousel-slides,
  #manufacturing .factory-browser figure[data-slide]:not([hidden]) {
    display: contents;
  }
  #manufacturing .factory-image-link {
    grid-column: 1;
    grid-row: 1 / span 3;
    align-self: stretch;
    aspect-ratio: 4 / 3;
    min-height: 0;
  }
  #manufacturing .factory-browser figcaption {
    grid-column: 2;
    grid-row: 1;
    display: grid;
    grid-template-columns: max-content minmax(0, 1fr);
    align-content: center;
    align-items: center;
    column-gap: 12px;
    padding: 22px 24px 16px;
  }
  #manufacturing .factory-browser figcaption > :is(.small, h3, p) {
    grid-column: 1 / -1;
  }
  #manufacturing .factory-browser figcaption h3 {
    margin: 10px 0 12px;
    font-size: 26px;
  }
  #manufacturing .factory-browser figcaption p {
    margin-bottom: 17px;
  }
  #manufacturing .factory-original {
    grid-column: 1;
    align-self: center;
    padding-inline: 12px;
    font-size: 12px;
  }
  #manufacturing .factory-testing {
    grid-column: 2;
    align-self: center;
    margin: 0;
    padding: 0;
    font-size: 11px;
    line-height: 1.5;
  }
  #manufacturing .factory-browser .factory-toolbar {
    grid-column: 2;
    grid-row: 2;
    flex-direction: column;
    align-items: stretch;
    gap: 7px;
    padding: 12px 24px 8px;
    border-left: 1px solid var(--workshop-line);
  }
  #manufacturing .factory-toolbar .carousel-controls {
    width: 100%;
    justify-content: space-between;
    gap: 10px;
  }
  #manufacturing .carousel-arrows {
    gap: 7px;
  }
  #manufacturing .carousel-arrows output {
    min-width: 52px;
  }
  #manufacturing .factory-photo-index {
    grid-column: 2;
    grid-row: 3;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 6px;
    padding: 4px 24px 20px;
    border-left: 1px solid var(--workshop-line);
  }
}
@media (max-width: 1000px) {
  #manufacturing .factory-browser figure[data-slide]:not([hidden]) {
    grid-template-columns: minmax(0, 1fr);
  }
  #manufacturing .factory-browser figcaption {
    border-left: 0;
    border-top: 1px solid var(--workshop-line);
  }
  #manufacturing .factory-photo-index {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}
/* END ANYANG HOMEPAGE WORKSHOP LAYOUT 20261013 */
