/* beta.34: shared chrome rules now live in assets/css/chrome.css (linked first).
   Only selectors this page overrides keep their local copies, so in-sheet cascade order is preserved. */
/* beta.20: author display must not override the hidden attribute */
[hidden] { display: none !important; }
/* ── beta.2 additions (documented in VERSION.txt; no rule above is altered) ── */
/* ════════════════════════════════════════════════════════════════
   LUXE x CLASSIC production header v1.0.0
   L1 Signature + L3 grafts (L2 ink stage removed in 1.0.0-beta.3). Namespace: lx-
   ════════════════════════════════════════════════════════════════ */
/* topbar (L1): contact / socials / translation */
/* translation dropdown (L1) */
/* header + nav (L1 metrics) */
/* links: mono caps + Classic underline + L3 tracking graft */
/* tracking-hover graft removed: the layout shift caused hover vibration */
/* mega: anchored to the sticky header, viewport-clamped */
/* hover bridges: keep the pointer connected across the gap between
   trigger and panel — kills the open/close flicker ("shivering") */
/* slim dropdown with family dots */
/* icon-circle search (expands into a pill) */
/* beta.2 (step 1): valid HTML — the pill is a div; the icon sits on a real
   <button>, the input lives in a <form role="search"> that GETs search.html */
/* theme toggle (L3 graft) */
/* RFQ (L1): gold with sheen sweep */
/* M3 segment divider: catalogue | company */
/* mobile burger + panel (approved pattern) */
@media (max-width: 1024px) {}
/* ===== page scaffolding ===== */
/* series cards (category page) */
/* product rows (subcategory page) */
/* spec card (product page) */
/* related row */
.rel-card { border: 1px solid var(--border); background: var(--surface); border-radius: 4px; padding: 0; text-decoration: none; display: flex; flex-direction: column; overflow: hidden; }
.rel-card__img { width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; display: block; transition: transform .5s cubic-bezier(.22,1,.36,1); }
.rel-card:hover .rel-card__img { transform: scale(1.04); }
.rel-card__body { padding: 14px 18px 18px; }
.rel-card .t { margin-top: 6px; }
@media (prefers-reduced-motion: reduce) {
.rel-card__img { transition: none; }
.rel-card:hover .rel-card__img { transform: none; }
}
.rel-card .t { font-weight: 600; font-size: 17px; margin-top: 6px; }
/* CTA band */
/* template note */
/* sticky-footer technique (body flex column; main grows) */
/* ===== F1 footer — header-matched hovers (gradient underline, sheen,
   icon circles). WP destination: footer.php partial. ===== */
/* ===== internal page hero ===== */
/* ===== forms ===== */
/* ===== two-col content ===== */
/* ===== blog ===== */
/* ===== single post ===== */
/* ===== faq ===== */
/* ===== tds table ===== */
/* ===== sitemap page ===== */
/* ===== 404 / maintenance ===== */
/* generic content blocks */
/* product photo gallery (beta.6): crossfade slider above "Also in this series" */
.pgal { margin-bottom: 30px; }
.pgal__stage { position: relative; }
.pgal__viewport { position: relative; aspect-ratio: 4 / 3; border-radius: 4px; border: 1px solid var(--border); overflow: hidden; background: var(--surface); cursor: zoom-in; }
.pgal__slide { position: absolute; inset: 0; margin: 0; opacity: 0; visibility: hidden; transform: scale(1.035); transition: opacity .5s cubic-bezier(.22,1,.36,1), transform .5s cubic-bezier(.22,1,.36,1), visibility 0s linear .5s; }
.pgal__slide.is-on { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
.pgal__slide img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pgal__slide figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 30px 18px 12px; font-family: var(--font-mono); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: #f7f4ef; background: linear-gradient(transparent, rgba(20,24,31,.78)); }
.pgal__nav { position: absolute; top: 50%; transform: translateY(-50%); width: 42px; height: 42px; border-radius: 50%; border: 1px solid var(--border-bright); background: var(--bg); color: var(--ink); display: flex; align-items: center; justify-content: center; cursor: pointer; transition: background .2s, color .2s, border-color .2s; z-index: 2; }
.pgal__nav:hover, .pgal__nav:focus-visible { background: var(--ink); color: #f7f4ef; border-color: var(--ink); }
.pgal__nav--prev { left: 14px; }
.pgal__nav--next { right: 14px; }
.pgal__nav svg { width: 16px; height: 16px; }
.pgal__bar { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 12px; flex-wrap: wrap; }
.pgal__thumbs { display: flex; gap: 10px; overflow-x: auto; padding: 2px; scrollbar-width: thin; min-width: 0; flex: 1 1 auto; }
.pgal__thumb { flex: 0 0 auto; width: 78px; border: 1px solid var(--border); border-radius: 3px; padding: 0; background: none; cursor: pointer; opacity: .68; transition: opacity .2s, border-color .2s; }
.pgal__thumb img { display: block; width: 100%; border-radius: 2px; }
.pgal__thumb:hover { opacity: 1; }
.pgal__thumb.is-on { opacity: 1; border-color: var(--gold); box-shadow: 0 0 0 1px var(--gold); }
.pgal__thumb:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
.pgal__count { font-family: var(--font-mono); font-size: 11px; color: var(--ink-dim); white-space: nowrap; }
.pgal__note { font-family: var(--font-mono); font-size: 10px; color: var(--gold); margin-top: 12px; }
@media (prefers-reduced-motion: reduce) {
.pgal__slide { transition: none; }
}
/* gallery zoom + lightbox (beta.12) */
.pgal__zoom { position: absolute; right: 10px; bottom: 10px; z-index: 2; display: inline-flex; align-items: center; gap: 6px; font-family: var(--font-mono); font-size: 9.5px; letter-spacing: .08em; text-transform: uppercase; color: #f7f4ef; background: rgba(20,24,31,.72); border: 0; padding: 5px 9px; border-radius: 3px; cursor: pointer; opacity: 0; transition: opacity .2s; }
.pgal__viewport:hover .pgal__zoom, .pgal__zoom:focus-visible { opacity: 1; }
.lightbox { position: fixed; inset: 0; z-index: 300; background: rgba(20,24,31,.85); display: flex; align-items: center; justify-content: center; padding: 40px; }
.lightbox[hidden] { display: none; }
.lightbox img { max-width: min(1080px, 92vw); max-height: 86vh; border-radius: 4px; box-shadow: 0 40px 90px -20px rgba(0,0,0,.55); }
.lightbox__close { position: absolute; top: 18px; right: 18px; width: 42px; height: 42px; border-radius: 50%; border: 1px solid rgba(247,244,239,.3); background: rgba(20,24,31,.5); color: #f7f4ef; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: background .2s, border-color .2s; }
.lightbox__close:hover, .lightbox__close:focus-visible { background: var(--gold); border-color: var(--gold); outline: none; }
.lightbox__close svg { width: 16px; height: 16px; }
@media (prefers-reduced-motion: reduce) {
.pgal__zoom { transition: none; }
}
/* muted-to-colour reveal on thumbnails (beta.15): rest desaturated, colour on hover/focus */
@media (hover: hover) {
.rel-card__img { filter: saturate(.4); transition: transform .5s cubic-bezier(.22,1,.36,1), filter .45s ease; }
.rel-card:hover .rel-card__img, .rel-card:focus-visible .rel-card__img { filter: saturate(1.08); }
}
@media (prefers-reduced-motion: reduce) {
.rel-card__img { transition: none; }
}
/* quote-list engine (beta.16) */
/* sticky RFQ bar (beta.16) */
.lxq-sticky {position:fixed;left:50%;bottom:0;transform:translateX(-50%);z-index:79;display:flex;align-items:center;gap:18px;background:var(--ink,#14181f);color:#fff;padding:10px 14px;border-radius:6px 6px 0 0;box-shadow:0 -8px 30px -10px rgba(20,24,31,.4);max-width:min(760px,94vw);width:max-content}
.lxq-sticky__p {display:flex;flex-direction:column;line-height:1.25}
.lxq-sticky__p b {font-size:14px}
.lxq-sticky__p i {font-family:var(--font-mono,ui-monospace,'Courier New',monospace);font-style:normal;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:#b9c1c9}
.lxq-sticky__b {display:flex;gap:8px;align-items:center}
.lxq-sticky .lxq-cta {background:#fff;color:var(--ink,#14181f);padding:9px 14px;font-size:13px;white-space:nowrap}
.lxq-sticky .lxq-cta:hover {background:var(--gold,#b0812b);color:#fff}
.lxq-cta--ghost {display:inline-block;border:1px solid rgba(255,255,255,.4);color:#fff;text-decoration:none;font-size:13px;padding:8px 13px;border-radius:4px;white-space:nowrap}
.lxq-cta--ghost:hover {border-color:#fff}
.lxq-sticky__x {background:none;border:0;color:#9aa3ab;font-size:19px;cursor:pointer;padding:2px 4px}
.lxq-sticky__x:hover {color:#fff}
html.lxq-bar-on .lxq-tab {bottom:84px}
@media (max-width:680px) {
.lxq-sticky {left:0;right:0;transform:none;width:auto;border-radius:0;gap:10px;justify-content:space-between;flex-wrap:wrap}
.lxq-sticky__p i {display:none}
.lxq-cta--ghost {display:none}
}
/* proof components: certifications + case (beta.16, labelled placeholders for real data) */
.lx-proof {display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:26px 0 10px}
.lx-proof__certs,.lx-proof__case {border:1px dashed var(--gold,#b0812b);border-radius:4px;padding:16px 18px}
.lx-proof__lab {font-family:var(--font-mono,ui-monospace,'Courier New',monospace);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold,#b0812b);margin:0 0 6px}
.lx-proof__ph {font-size:13px;color:var(--ink-dim,#5c6570);margin:0;line-height:1.5}
@media (max-width:760px) {
.lx-proof {grid-template-columns:1fr}
}
/* beta.19 fix: display:flex rules were overriding the hidden attribute,
   leaving the compare modal/bar and sticky bar permanently visible */
[hidden] {display:none!important}