.product-series {
  --series-blue: #1768a8;
  --series-ink: #102639;
  padding: clamp(48px, 7vw, 102px) 0;
  background: #fff;
  color: var(--series-ink);
}
.product-series [hidden] { display:none !important; }
.product-series-heading { max-width: 780px; margin-bottom: clamp(24px, 4vw, 54px); }
.product-series-heading::before { content:""; display:block; width:48px; height:3px; background:var(--series-blue); margin-bottom:15px; }
.product-series-heading h2 { font-size:clamp(28px,4vw,49px); line-height:1.14; margin:8px 0 12px; letter-spacing:-.025em; }
.product-series-heading > p:last-child, .product-series-copy p { color:#526477; line-height:1.7; }
.product-series-panel {
  display:grid; grid-template-columns:minmax(0, 1fr) minmax(0, 1.55fr);
  gap:clamp(20px, 5vw, 72px); align-items:center; margin-block:16px;
}
.product-series-copy h3 { font-size:clamp(23px, 3vw, 38px); line-height:1.18; margin:12px 0; color:var(--series-ink); }
.product-series-number { color:var(--series-blue); font-size:13px; font-weight:700; letter-spacing:.14em; }
.product-series-stage {
  aspect-ratio: 1.65; min-width:0; display:grid; place-items:center;
  background:radial-gradient(ellipse at 50% 62%, #e7eff6 0, #f6f9fc 56%, #fcfdfe 80%);
  border:1px solid #e8eef4; padding:clamp(12px, 3vw, 36px);
}
.product-series-stage img { width:100%; height:100%; min-height:0; object-fit:contain; mix-blend-mode:multiply; }
.product-series-link { display:inline-flex; align-items:center; gap:12px; color:var(--series-ink); font-weight:650; margin-top:12px; }
.product-series-link span { display:grid; place-items:center; width:44px; height:44px; border-radius:50%; background:var(--series-blue); color:white; }
.product-series-tabs { display:grid; grid-auto-flow:column; grid-auto-columns:minmax(135px,1fr); overflow-x:auto; margin-top:34px; padding:4px 4px 10px; }
.product-series-tabs button { display:grid; grid-template-rows:78px 34px 1fr; justify-items:center; text-align:center; background:none; border:0; color:#526477; font:inherit; font-size:13px; padding:0; min-width:0; cursor:pointer; }
.product-series-tabs button > span:last-child { padding:0 10px; }
.product-series-thumb { width:min(100px,88%); height:78px; border:1px solid transparent; padding:6px; }
.product-series-thumb img { width:100%; height:100%; object-fit:contain; }
.product-series-marker { position:relative; display:grid; place-items:center; align-self:center; width:100%; height:1px; background:#dce5ee; }
.product-series-marker::after { content:""; position:absolute; width:8px; height:8px; border-radius:50%; background:var(--series-blue); }
.product-series-tabs button[aria-selected="true"] { color:var(--series-ink); font-weight:700; }
.product-series-tabs button[aria-selected="true"] .product-series-thumb { border-color:#8cb7d9; background:#f3f8fc; }
.product-series-tabs button[aria-selected="true"] .product-series-marker::after { background:var(--industry-accent,#c9201a); width:15px; height:15px; border:3px solid white; box-shadow:0 0 0 1px var(--industry-accent,#c9201a); }
.product-series-tabs button:focus-visible, .product-series-link:focus-visible { outline:2px solid var(--series-blue); outline-offset:2px; }
@media(max-width:700px) {
  .product-series-panel { grid-template-columns:minmax(0, 1fr); gap:16px; }
  .product-series-stage { grid-row:1; }
  .product-series-tabs { margin-top:22px; grid-auto-columns:minmax(118px,1fr); }
}

/* Reserve the tallest slide so the selector never jumps when switching. */
.product-series-panels:has(> [hidden]) { display:grid; }
.product-series-panels:has(> [hidden]) > .product-series-panel { grid-area:1 / 1; }
.product-series .product-series-panel[hidden] { display:grid !important; visibility:hidden; pointer-events:none; }
@media (prefers-reduced-motion: no-preference) {
  .product-series-panel.is-entering .product-series-copy {
    animation:series-copy-in .32s cubic-bezier(.2,.72,.25,1) both;
  }
  .product-series-panel.is-entering .product-series-stage img {
    animation:series-image-in .48s cubic-bezier(.2,.72,.25,1) both;
  }
  .product-series-thumb, .product-series-marker::after, .product-series-link span {
    transition:background-color .2s ease,border-color .2s ease,transform .22s ease;
  }
  .product-series-link:is(:hover,:focus-visible) span { transform:translateX(3px); }
}
@media (hover:hover) {
  .product-series-tabs button:hover .product-series-thumb { border-color:#8cb7d9; }
}
@keyframes series-copy-in {
  from { opacity:.45; transform:translateY(7px); }
  to { opacity:1; transform:translateY(0); }
}
@keyframes series-image-in {
  from { opacity:.35; transform:translateX(10px) scale(.985); }
  to { opacity:1; transform:translateX(0) scale(1); }
}
