/* Three variants, independent links; mobile keeps readable labels and prices. */
.overview-hero{padding:38px 0 22px}
.overview-hero h1{font-size:56px;line-height:1.08;letter-spacing:-2.3px;margin:12px 0 18px}
.hero-copy{font-size:18px;line-height:1.45;color:var(--ink);font-weight:500}
.variant-guide{border:0;margin-bottom:28px;max-width:720px}
.variant-guide summary{justify-content:flex-start;min-height:44px;padding:6px 0;gap:10px;font-size:14px;color:#55555d}
.variant-guide summary:hover{color:var(--ink)}
.variant-guide summary svg{width:15px;height:15px;color:var(--red)}
.variant-guide dl{margin:5px 0 0;padding:16px 20px;background:#fff;border:1px solid var(--line);border-radius:14px}
.variant-guide dl>div+div{margin-top:18px;padding-top:18px;border-top:1px solid #efeff1}
.variant-guide dt{font-size:15px;font-weight:600}
.variant-guide dd{margin:6px 0 0;font-size:14px;line-height:1.55;color:#55555d}
.variant-guide dd p+p{margin-top:8px}
.price-series{background:#fff;border:1px solid var(--line);border-radius:20px;margin-bottom:22px;overflow:hidden;scroll-margin-top:20px}
.price-series table{width:100%;border-collapse:collapse;text-align:left;table-layout:fixed}
.price-series thead th{font-weight:500;font-size:13px;color:var(--muted);padding:10px 12px;border-bottom:1px solid var(--line);text-align:center;vertical-align:top}
.price-series th:first-child{width:31%;padding-left:26px;text-align:left}
.price-series td{padding:12px;font-weight:600;font-size:17px;font-variant-numeric:tabular-nums}
.price-series tbody th{font-size:16px;font-weight:500;padding:12px}
.price-series tbody tr+tr{border-top:1px solid #efeff1}
.model-name{display:flex;align-items:center;gap:15px;min-height:58px;line-height:1.3}
.model-name img{width:38px;height:52px;object-fit:contain;flex-shrink:0;mix-blend-mode:multiply}
.variant-link,.variant-unavailable{display:flex;align-items:center;justify-content:center;gap:9px;width:100%;min-height:50px;padding:7px;background:#f8f8fa;border-radius:12px;white-space:nowrap}
.variant-link{transition:background-color .15s,color .15s}
.variant-link::after{content:"";width:5px;height:5px;margin-right:2px;border-top:1.5px solid var(--red);border-right:1.5px solid var(--red);transform:rotate(45deg);flex:0 0 auto}
.variant-link:hover,.variant-link:active{background:#fff0f1;color:var(--red)}
.variant-link:focus-visible{outline-offset:0}
.variant-unavailable{background:transparent}
.variant-label{display:none}
.variant-caption{display:block;margin-top:3px;font-size:12px;line-height:1.35;font-weight:400;color:var(--muted);white-space:normal}
.not-listed{color:var(--muted);font-weight:400}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.older-models{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:76px;padding:18px 24px;margin-bottom:22px;border:1px solid var(--line);border-radius:20px;background:#fff}
.older-models strong{display:block;font-size:17px;font-weight:600;line-height:1.3}
.older-models svg{width:20px;height:20px;color:var(--red);transform:rotate(-45deg)}
.older-models:hover{background:#fafafa}
@media(max-width:760px) and (min-width:681px){
  .price-series th:first-child{padding-left:18px;width:30%}
  .price-series td{padding:10px 6px;font-size:15px}
  .model-name{gap:9px;font-size:14px}
  .model-name img{width:28px;height:42px}
  .variant-link{gap:6px}
}
@media(max-width:680px){
  .overview-hero{padding:13px 0 8px}
  .overview-hero h1{font-size:32px;line-height:1.12;letter-spacing:-1.2px;margin:8px 0 12px}
  .hero-copy{font-size:16px;line-height:1.45}
  .variant-guide{margin-bottom:16px}
  .variant-guide summary{font-size:13px;gap:8px}
  .variant-guide dl{padding:14px 16px}
  .price-series{border-radius:16px;margin-bottom:16px}
  .price-series table,.price-series tbody{display:block}
  /* Keep column names available to assistive technology. */
  .price-series thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
  .price-series tbody tr{display:grid;grid-template-columns:minmax(0,1fr);padding:12px 16px;gap:0}
  .price-series tbody th:first-child{display:block;width:auto;padding:0 0 7px;min-width:0}
  .model-name{gap:11px;min-height:38px;font-size:16px;font-weight:600}
  .model-name img{width:27px;height:36px}
  .model-name .model-suffix{white-space:nowrap}
  .price-series td{display:block;padding:0;font-size:16px;min-width:0;line-height:1.3}
  .variant-link{justify-content:flex-start;min-height:44px;padding:9px 10px;background:#f8f8fa;border-radius:0;gap:10px}
  .price-series td:nth-child(2) .variant-link{border-radius:10px 10px 0 0}
  .price-series td:last-child .variant-link{border-radius:0 0 10px 10px}
  .price-series td+td .variant-link{border-top:1px solid #ededf0}
  .variant-label{display:block;min-width:0;margin-right:auto;font-size:13px;color:#55555d;font-weight:400;white-space:normal}
  .variant-label .variant-caption{margin-top:2px}
  .variant-price{white-space:nowrap;letter-spacing:-.3px}
  .variant-unavailable{min-height:36px;justify-content:flex-start;padding:6px 10px}
  .not-listed{margin-right:17px;font-size:15px}
  .older-models{padding:16px 18px;margin-bottom:14px;border-radius:16px}
  .older-models strong{font-size:16px}
}
@media(max-width:359px){
  .overview-hero h1{font-size:28px;letter-spacing:-1px}
  .hero-copy{font-size:15px}
  .price-series tbody tr{padding-inline:13px}
  .variant-label{font-size:12px}
}
@media(prefers-reduced-motion:reduce){.variant-link{transition:none}}
