/* Peakspan V2 — catalogue range pages (loaded after classic.css, new pages only) */

/* Spec tables */
.range-table-wrap{overflow-x:auto;border:1px solid rgba(255,255,255,.12);border-radius:14px;background:rgba(255,255,255,.02)}
.range-table{width:100%;border-collapse:collapse;font-size:.88rem;min-width:640px}
.range-table th,.range-table td{padding:12px 16px;text-align:left;border-bottom:1px solid rgba(255,255,255,.08);white-space:nowrap}
.range-table td{font-variant-numeric:tabular-nums;color:#c7d5e6}
.range-table th{font-family:Sora,sans-serif;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:#8fa6c0;font-weight:600}
.range-table tbody tr:last-child td{border-bottom:none}
.range-table tbody tr:hover td{background:rgba(255,255,255,.03)}
.range-table td:first-child{color:#eaf1f8;font-weight:600}
.range-note{margin:14px 2px 0;font-size:.78rem;line-height:1.55;color:#8397ad}
.range-note a{color:#a9c1dd}

/* Series brochure copy */
.series-copy{margin:26px 0 0;padding:22px 26px;border-left:2px solid #ff493d;background:rgba(255,255,255,.03);border-radius:0 14px 14px 0}
.series-copy p{margin:0 0 10px;font-family:Sora,sans-serif;font-weight:400;font-style:italic;font-size:1.02rem;line-height:1.65;color:#bcd6f2}
.series-copy p:last-child{margin-bottom:0}
.series-copy cite{display:block;margin-top:12px;font-style:normal;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:#7e94ac}

/* Light product plates (supplier renders shown as catalogue plates) */
.range-plates{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin:26px 0 0}
.range-plates figure{margin:0;border-radius:14px;overflow:hidden;border:1px solid rgba(255,255,255,.12);background:#f4f5f7}
.range-plates img{display:block;width:100%;height:auto}
.range-plates figcaption{padding:10px 14px;font-size:.74rem;letter-spacing:.08em;text-transform:uppercase;color:#41506b;background:#eef0f3;font-family:Sora,sans-serif;font-weight:600}

/* Series cross-links */
.series-links{display:flex;flex-wrap:wrap;gap:12px;margin:26px 0 0}
.series-links a{display:inline-flex;align-items:center;gap:8px;padding:10px 18px;border-radius:999px;border:1px solid rgba(255,255,255,.18);color:#c7d5e6;text-decoration:none;font-size:.82rem;font-family:Sora,sans-serif;transition:border-color .2s,color .2s}
.series-links a:hover{border-color:rgba(255,255,255,.45);color:#fff}
.series-links a[aria-current="page"]{border-color:#4aa8ff;color:#fff}

/* Enquiry price line */
.price-block strong.price-inquiry{font-size:1.15rem}

@media (max-width:640px){
  .range-table th,.range-table td{padding:10px 12px}
  .series-copy{padding:18px 18px}
}

/* ---------- Gate 3: Popover API + CSS anchor positioning ---------- */
.spec-note{
  display:inline-flex;align-items:center;justify-content:center;
  width:17px;height:17px;margin-inline-start:7px;padding:0;vertical-align:middle;
  border:1px solid rgba(255,255,255,.34);border-radius:50%;background:transparent;
  color:#c7d5e6;font:600 10px/1 Sora,sans-serif;cursor:pointer;
  transition:border-color .2s,color .2s;
}
.spec-note:hover,.spec-note:focus-visible{border-color:#4aa8ff;color:#fff}
.spec-note:focus-visible{outline:2px solid #4aa8ff;outline-offset:2px}

[popover].spec-pop{
  position:absolute;
  position-area:block-end span-inline-start;
  position-try-fallbacks:block-start span-inline-start, block-end span-inline-end;
  margin:8px 0 0;inset:auto;
  max-width:min(34ch,86vw);padding:14px 16px;
  border:1px solid rgba(255,255,255,.16);border-radius:12px;
  background:#0d141d;color:#c7d5e6;
  /* the popover lives inside a th/td, so reset the table's typography */
  font:400 .82rem/1.55 Inter,system-ui,sans-serif;
  text-transform:none;letter-spacing:normal;white-space:normal;text-align:start;
  box-shadow:0 26px 60px rgba(0,0,0,.6);
  opacity:0;transform:translateY(-6px);
  transition:opacity .2s ease,transform .2s ease,display .2s allow-discrete,overlay .2s allow-discrete;
}
[popover].spec-pop:popover-open{opacity:1;transform:none}
@starting-style{[popover].spec-pop:popover-open{opacity:0;transform:translateY(-6px)}}
[popover].spec-pop::backdrop{background:transparent}
.spec-pop b{display:block;margin:0 0 5px;color:#eaf1f8;font-family:Sora,sans-serif;font-size:.74rem;letter-spacing:.1em;text-transform:uppercase}
/* No anchor positioning: fall back to a centred sheet rather than a mispositioned one */
@supports not (position-anchor:--spec-note){
  [popover].spec-pop{position:fixed;inset:auto 50% 22px auto;translate:50% 0;margin:0}
}
@media (prefers-reduced-motion:reduce){
  [popover].spec-pop{transition:none}
}