/* HSYWIRE site layer: interactions, product catalogue, variants, notes. Loaded after brand.css. */
:root{
  --ease:cubic-bezier(.2,.8,.2,1);
  --hw-ink:#16233a;
  --hw-line:#dde1e7;
  --hw-line-strong:#9aa3b0;
  --hw-muted:#5b6573;
  --hw-surface:#f7f8fa;
  --hw-mono:"IBM Plex Mono",ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;
}

/* ---------- logo spool (header + footer) ---------- */
@keyframes logoSpinIn{0%{transform:rotate(-180deg) scale(.5);opacity:0}60%{transform:rotate(10deg) scale(1.05);opacity:1}80%{transform:rotate(-3deg) scale(.98)}100%{transform:rotate(0) scale(1)}}
.header .logo-icon,.footer .logo-icon{transition:transform .5s cubic-bezier(.175,.885,.32,1.275)}
.header .logo-icon{animation:logoSpinIn 1s cubic-bezier(.175,.885,.32,1.275)}
.footer .logo-icon.spin-in{animation:logoSpinIn 1s cubic-bezier(.175,.885,.32,1.275)}
.logo:hover .logo-icon{transform:rotate(8deg) scale(1.08)}
.logo:active .logo-icon{transform:rotate(360deg) scale(.9);transition:transform .3s ease}

/* ---------- nav + CTA ---------- */
.nav-menu > li > a{position:relative}
.nav-menu > li > a::after{content:"";position:absolute;left:0;right:0;bottom:4px;height:1px;background:var(--color-primary);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease)}
.nav-menu > li > a:hover::after,.nav-menu > li > a:focus-visible::after,.nav-menu > li > a[aria-current="page"]::after{transform:scaleX(1)}
.nav-cta{background-image:linear-gradient(var(--color-secondary),var(--color-secondary));background-repeat:no-repeat;background-size:0% 100%;transition:background-size .4s var(--ease)}
.nav-cta:hover{background-size:100% 100%}

/* ---------- reveal on scroll (JS adds .hw-pre only to below-the-fold blocks) ---------- */
.hw-pre{opacity:0;transform:translateY(16px)}
.hw-in{opacity:1;transform:none;transition:opacity .6s var(--ease),transform .6s var(--ease)}

/* ---------- shared layout ---------- */
.hw-wrap{max-width:1200px;margin:0 auto;padding-inline:max(16px,5%);box-sizing:border-box}
.hw-crumb{font-size:13px;color:var(--hw-muted);padding-block:20px 0}
.hw-crumb a{color:var(--hw-muted);text-decoration:none}
.hw-crumb a:hover{color:var(--color-primary);text-decoration:underline}
.hw-crumb span[aria-hidden]{margin:0 8px;color:var(--hw-line-strong)}
.hw-eyebrow{font-family:var(--hw-mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--hw-muted)}
.hw-mono{font-family:var(--hw-mono);font-variant-numeric:tabular-nums}
.hw-h1{margin:6px 0 0;font-size:clamp(2rem,4vw,2.75rem);font-weight:300;line-height:1.1;color:var(--hw-ink);text-wrap:balance}
.hw-h2{margin:0;font-size:1.75rem;font-weight:400;line-height:1.2;color:var(--hw-ink)}
.hw-lead{margin:0;font-size:17px;line-height:1.65;color:var(--hw-muted);max-width:62ch}
.hw-section{padding-block:72px}
.hw-section + .hw-section{border-top:1px solid var(--hw-line)}

/* ---------- category head ---------- */
.hw-cathead{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:end;padding-block:36px 48px}
@media (max-width:860px){.hw-cathead{grid-template-columns:minmax(0,1fr);gap:20px}}
.hw-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));border-top:1px solid var(--hw-ink);border-bottom:1px solid var(--hw-line)}
.hw-fact{padding:18px 18px 18px 0;display:flex;flex-direction:column;gap:4px}
.hw-fact + .hw-fact{padding-left:18px;border-left:1px solid var(--hw-line)}
@media (max-width:560px){.hw-fact + .hw-fact{padding-left:0;border-left:0;border-top:1px solid var(--hw-line)}}
.hw-fact b{font-family:var(--hw-mono);font-weight:500;font-size:18px;color:var(--color-primary);font-variant-numeric:tabular-nums}
.hw-fact span{font-size:13px;color:var(--hw-muted)}

/* ---------- family cards ---------- */
.hw-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));border-top:1px solid var(--hw-line);border-left:1px solid var(--hw-line)}
.hw-card{display:flex;flex-direction:column;border-right:1px solid var(--hw-line);border-bottom:1px solid var(--hw-line);text-decoration:none;color:inherit;background:#fff;position:relative;transition:background .3s ease}
.hw-card::after{content:"";position:absolute;inset:-1px;border:1px solid var(--color-primary);opacity:0;transition:opacity .3s ease;pointer-events:none}
.hw-card:hover::after,.hw-card:focus-visible::after{opacity:1}
.hw-card-img{aspect-ratio:1/1;overflow:hidden;background:#fff;border-bottom:1px solid var(--hw-line)}
.hw-card-img img{width:100%;height:100%;object-fit:contain;display:block;transition:transform .6s var(--ease)}
.hw-card:hover .hw-card-img img{transform:scale(1.05)}
.hw-card-body{padding:18px 18px 20px;display:flex;flex-direction:column;gap:6px;flex:1}
.hw-card-no{font-family:var(--hw-mono);font-size:12px;color:var(--hw-muted)}
.hw-card-name{font-size:18px;font-weight:500;color:var(--color-primary);line-height:1.3}
.hw-card-spec{font-family:var(--hw-mono);font-size:13px;color:var(--hw-muted);font-variant-numeric:tabular-nums}
.hw-card-go{margin-top:auto;padding-top:10px;font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--color-primary);display:inline-flex;gap:8px;align-items:center}
.hw-card-go i{display:inline-block;width:18px;height:1px;background:currentColor;transition:width .35s var(--ease)}
.hw-card:hover .hw-card-go i{width:30px}

/* ---------- spec table ---------- */
.hw-spec{width:100%;border-collapse:collapse;font-size:15px}
.hw-spec caption{text-align:left;padding-bottom:10px}
.hw-spec th,.hw-spec td{padding:13px 12px;text-align:left;vertical-align:top;border-bottom:1px solid var(--hw-line);transition:background .25s ease}
.hw-spec tr:first-child th,.hw-spec tr:first-child td{border-top:1px solid var(--hw-ink)}
.hw-spec th{width:36%;font-weight:500;color:var(--hw-ink);padding-left:0}
.hw-spec td{font-variant-numeric:tabular-nums}
.hw-spec tr:hover th,.hw-spec tr:hover td{background:var(--hw-surface)}

/* ---------- product layout + gallery ---------- */
.hw-prod{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:56px;align-items:start;padding-block:32px 72px}
@media (max-width:900px){.hw-prod{grid-template-columns:minmax(0,1fr);gap:32px}}
.hw-gallery{display:flex;flex-direction:column;gap:12px;position:sticky;top:96px}
@media (max-width:900px){.hw-gallery{position:static}}
.hw-stage{position:relative;aspect-ratio:1/1;border:1px solid var(--hw-line);background:#fff;overflow:hidden}
.hw-stage img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0;transition:opacity .45s var(--ease),transform .8s var(--ease)}
.hw-stage img.is-on{opacity:1}
.hw-stage:hover img.is-on{transform:scale(1.03)}
.hw-thumbs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.hw-thumb{padding:0;border:1px solid var(--hw-line);background:#fff;aspect-ratio:1/1;cursor:pointer;position:relative;overflow:hidden}
.hw-thumb img{width:100%;height:100%;object-fit:contain;display:block}
.hw-thumb::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--color-primary);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease)}
.hw-thumb[aria-pressed="true"]{border-color:var(--color-primary)}
.hw-thumb[aria-pressed="true"]::after,.hw-thumb:hover::after{transform:scaleX(1)}
.hw-info{display:flex;flex-direction:column;gap:26px}
.hw-chips{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
.hw-chips li{border:1px solid var(--hw-line);padding:6px 12px;font-size:14px;color:var(--hw-ink)}
.hw-actions{display:flex;flex-wrap:wrap;gap:12px}
.hw-btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 26px;font-size:14px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;text-decoration:none;border:1px solid var(--color-primary);cursor:pointer;font-family:inherit;background-repeat:no-repeat;background-size:0% 100%;transition:background-size .4s var(--ease),color .3s ease}
.hw-btn--solid{background-color:var(--color-primary);color:#fff;background-image:linear-gradient(var(--color-secondary),var(--color-secondary))}
.hw-btn--line{background-color:#fff;color:var(--color-primary);background-image:linear-gradient(var(--color-primary),var(--color-primary))}
.hw-btn:hover{background-size:100% 100%;text-decoration:none}
.hw-btn--solid:hover{color:#fff}
.hw-btn--line:hover{color:#fff}
.hw-note{font-size:14px;color:var(--hw-muted);margin:0}

/* ---------- customisation band ---------- */
.hw-custom{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:48px}
@media (max-width:860px){.hw-custom{grid-template-columns:minmax(0,1fr);gap:24px}}
.hw-custom ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:24px;border-top:1px solid var(--hw-ink)}
.hw-custom li{padding:16px 16px 16px 0;border-bottom:1px solid var(--hw-line);display:flex;flex-direction:column;gap:4px}
.hw-custom li b{font-weight:500;color:var(--hw-ink)}
.hw-custom li span{font-size:14px;color:var(--hw-muted)}

/* ---------- inquiry ---------- */
.hw-inq{background:var(--color-primary);color:#fff;padding-block:72px}
.hw-inq .hw-h2{color:#fff}
.hw-inq-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:56px;align-items:start}
@media (max-width:860px){.hw-inq-grid{grid-template-columns:minmax(0,1fr);gap:28px}}
.hw-inq p{color:#d6e2ef;margin:0}
.hw-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 20px}
@media (max-width:560px){.hw-form{grid-template-columns:minmax(0,1fr)}}
.hw-field{display:flex;flex-direction:column;gap:6px;font-size:13px;letter-spacing:.04em}
.hw-field--full{grid-column:1/-1}
.hw-field input,.hw-field textarea,.hw-field select{font:inherit;font-size:16px;letter-spacing:0;color:#fff;background:transparent;border:0;border-bottom:1px solid rgba(255,255,255,.55);padding:10px 0;border-radius:0;transition:border-color .3s ease,background .3s ease}
.hw-field select option{color:#16233a}
.hw-field textarea{resize:vertical;min-height:96px}
.hw-field input:focus,.hw-field textarea:focus,.hw-field select:focus{outline:none;border-bottom-color:#fff;background:rgba(255,255,255,.06)}
.hw-field input:focus-visible,.hw-field textarea:focus-visible,.hw-field select:focus-visible{outline:2px solid #fff;outline-offset:2px}
.hw-form .hw-btn{grid-column:1/-1;justify-self:start;background-color:#fff;color:var(--color-primary);border-color:#fff;background-image:linear-gradient(#d6e2ef,#d6e2ef)}
.hw-form .hw-btn:hover{color:var(--color-primary)}
.hw-done{grid-column:1/-1;border:1px solid rgba(255,255,255,.55);padding:20px;display:flex;flex-direction:column;gap:6px}
.hw-done b{font-size:18px;font-weight:500}
.hw-err{color:#ffd7c2;font-size:14px;grid-column:1/-1;margin:0}

@media (prefers-reduced-motion:reduce){
  .header .logo-icon,.footer .logo-icon,.footer .logo-icon.spin-in{animation:none;transition:none}
  .hw-pre{opacity:1;transform:none}
  .hw-card-img img,.hw-stage img,.hw-btn,.nav-cta,.nav-menu > li > a::after,.hw-thumb::after,.hw-card-go i{transition:none}
}

/* ---------- single products page ---------- */
.hw-catalog{display:grid;grid-template-columns:240px minmax(0,1fr);gap:48px;align-items:start;padding-bottom:88px}
.hw-side{position:sticky;top:96px;display:flex;flex-direction:column;gap:28px}
.hw-sidenav{list-style:none;margin:0;padding:0;border-top:1px solid var(--hw-ink)}
.hw-sidenav a{display:grid;grid-template-columns:minmax(0,1fr);gap:8px;align-items:baseline;padding:14px 0;border-bottom:1px solid var(--hw-line);text-decoration:none;color:var(--hw-ink);position:relative;transition:color .25s ease,padding-left .35s var(--ease)}
.hw-sidenav a::before{content:"";position:absolute;left:0;top:-1px;bottom:-1px;width:2px;background:var(--color-primary);transform:scaleY(0);transform-origin:top;transition:transform .35s var(--ease)}
.hw-sidenav a:hover{color:var(--color-primary);padding-left:10px}
.hw-sidenav a.is-on{color:var(--color-primary);padding-left:14px;font-weight:500}
.hw-sidenav a.is-on::before{transform:scaleY(1)}
.hw-sidenav .hw-mono{font-size:12px;color:var(--hw-muted)}
.hw-sidenav .hw-count{font-size:12px}
.hw-sidebox{border:1px solid var(--hw-line);padding:18px;display:flex;flex-direction:column;gap:10px}
.hw-sidebox p{margin:0;font-size:14px;color:var(--hw-muted)}
.hw-sidebox .hw-btn{min-height:44px;padding:0 16px;font-size:13px}
.hw-catmain{display:flex;flex-direction:column;gap:72px}
.hw-catsec{scroll-margin-top:96px;display:flex;flex-direction:column;gap:24px}
.hw-cathd{display:flex;flex-direction:column;gap:8px;padding-top:20px;border-top:1px solid var(--hw-ink)}
.hw-catfacts{margin:4px 0 0;font-size:13px;color:var(--color-primary)}
.hw-grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:1100px){.hw-grid--3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:860px){
  .hw-catalog{grid-template-columns:minmax(0,1fr);gap:24px}
  .hw-side{position:sticky;top:0;z-index:5;background:#fff;margin-inline:calc(-1 * max(16px,5%));padding:8px max(16px,5%);border-bottom:1px solid var(--hw-line)}
  .hw-sidenav{display:flex;gap:8px;overflow-x:auto;border-top:0;scrollbar-width:none}
  .hw-sidenav li{flex:0 0 auto}
  .hw-sidenav a{display:flex;gap:8px;padding:10px 14px;border:1px solid var(--hw-line);white-space:nowrap}
  .hw-sidenav a:hover,.hw-sidenav a.is-on{padding-left:14px}
  .hw-sidenav a::before{left:0;right:0;top:auto;bottom:-1px;width:auto;height:2px;transform:scaleX(0);transform-origin:left}
  .hw-sidenav a.is-on::before{transform:scaleX(1)}
  .hw-sidenav .hw-count{display:none}
  .hw-sidebox{display:none}
}
@media (max-width:520px){.hw-grid--3{grid-template-columns:minmax(0,1fr)}}
@media (prefers-reduced-motion:reduce){.hw-sidenav a,.hw-sidenav a::before{transition:none}}
.hw-tbd{color:#9aa3b0;font-family:var(--hw-mono);font-size:13px}

/* ---------- quiet contact line (replaces the large inquiry block) ---------- */
.hw-quiet{border-top:1px solid var(--hw-line);padding-block:28px}
.hw-quiet-row{display:flex;flex-wrap:wrap;align-items:baseline;gap:10px 24px}
.hw-quiet p{margin:0;font-size:14px;color:var(--hw-muted);flex:1 1 360px;min-width:0}
.hw-link{font-size:14px;color:var(--color-primary);text-decoration:none;background:linear-gradient(currentColor,currentColor) no-repeat 0 100%/100% 1px;padding-bottom:2px;transition:background-size .35s var(--ease)}
.hw-link:hover{background-size:0% 1px;text-decoration:none}
@media (prefers-reduced-motion:reduce){.hw-link{transition:none}}

/* ---------- technical notes ---------- */
.hw-notes{list-style:none;margin:0;padding:0;border-top:1px solid var(--hw-ink)}
.hw-note-row{display:grid;grid-template-columns:80px minmax(0,1fr) 120px 130px;gap:20px;align-items:baseline;padding:22px 0;border-bottom:1px solid var(--hw-line);text-decoration:none;color:var(--hw-ink);position:relative;transition:padding-left .35s var(--ease),background .3s ease}
a.hw-note-row:hover{padding-left:14px;background:var(--hw-surface);text-decoration:none}
a.hw-note-row::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--color-primary);transform:scaleY(0);transform-origin:top;transition:transform .35s var(--ease)}
a.hw-note-row:hover::before{transform:scaleY(1)}
.hw-note-no{font-size:13px;color:var(--color-primary)}
.hw-note-t{display:flex;flex-direction:column;gap:4px}
.hw-note-t b{font-weight:500;font-size:18px;color:var(--color-primary)}
.hw-note-t span{font-size:14px;color:var(--hw-muted)}
.hw-note-d{font-size:12px;color:var(--hw-muted);text-align:right}
.hw-note-row.is-planned .hw-note-t b,.hw-note-row.is-planned .hw-note-no{color:var(--hw-muted)}
@media (max-width:760px){.hw-note-row{grid-template-columns:64px minmax(0,1fr)}.hw-note-row .hw-eyebrow,.hw-note-d{grid-column:2;text-align:left}}

.hw-arthead{display:flex;flex-direction:column;gap:14px;padding-block:28px 36px;border-bottom:1px solid var(--hw-ink);max-width:860px}
.hw-meta{display:flex;flex-wrap:wrap;gap:8px 36px;margin:6px 0 0}
.hw-meta div{display:flex;gap:8px;align-items:baseline}
.hw-meta dt{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--hw-muted)}
.hw-meta dd{margin:0;font-size:14px}
.hw-draft{font-size:12px;border:1px solid #c58a2b;color:#8a5a12;padding:3px 8px}
.hw-artbody{display:grid;grid-template-columns:200px minmax(0,1fr);gap:56px;padding-block:44px 88px}
@media (max-width:900px){.hw-artbody{grid-template-columns:minmax(0,1fr);gap:24px}}
.hw-toc{position:sticky;top:96px;align-self:start;display:flex;flex-direction:column;gap:10px}
@media (max-width:900px){.hw-toc{position:static}}
.hw-toc ol{margin:0;padding:0;list-style:none;border-top:1px solid var(--hw-line)}
.hw-toc a{display:block;padding:10px 0;border-bottom:1px solid var(--hw-line);font-size:14px;color:var(--hw-ink);text-decoration:none;transition:color .25s ease,padding-left .3s var(--ease)}
.hw-toc a:hover{color:var(--color-primary);padding-left:8px}
.hw-prose{display:flex;flex-direction:column;gap:56px;max-width:820px;min-width:0}
.hw-prose section{display:flex;flex-direction:column;gap:16px;scroll-margin-top:96px}
.hw-prose p{margin:0;font-size:16px;line-height:1.7;color:var(--text,#27313d);max-width:68ch}
.hw-spec--wide th{width:auto}
.hw-spec--wide thead th{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--hw-muted);font-weight:500;border-top:1px solid var(--hw-ink)}
.hw-spec--wide tbody tr:first-child th,.hw-spec--wide tbody tr:first-child td{border-top:0}
.hw-tablebox{overflow-x:auto;border-top:1px solid var(--hw-ink)}
.hw-gauge{width:100%;min-width:520px;border-collapse:collapse;font-size:15px}
.hw-gauge th,.hw-gauge td{padding:9px 12px;text-align:right;border-bottom:1px solid var(--hw-line);transition:background .2s ease}
.hw-gauge th:first-child,.hw-gauge td:first-child{text-align:left}
.hw-gauge thead th{font-size:12px;letter-spacing:.1em;color:var(--hw-muted);font-weight:500;position:sticky;top:0;background:#fff}
.hw-gauge tbody tr:hover th,.hw-gauge tbody tr:hover td{background:var(--hw-surface)}
.hw-gauge tr.is-hit th,.hw-gauge tr.is-hit td{background:#e8eef6;color:var(--color-primary)}
.hw-conv{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid var(--hw-ink);border-bottom:1px solid var(--hw-line)}
@media (max-width:640px){.hw-conv{grid-template-columns:minmax(0,1fr)}}
.hw-conv-col{display:flex;flex-direction:column;gap:12px;padding:22px 24px 22px 0}
.hw-conv-col + .hw-conv-col{padding-left:24px;border-left:1px solid var(--hw-line)}
@media (max-width:640px){.hw-conv-col + .hw-conv-col{padding-left:0;border-left:0;border-top:1px solid var(--hw-line)}}
.hw-conv select,.hw-conv input{font-size:22px;padding:8px 0;border:0;border-bottom:1px solid var(--hw-line-strong);background:transparent;color:var(--hw-ink);max-width:220px;border-radius:0;transition:border-color .3s ease}
.hw-conv select:focus,.hw-conv input:focus{outline:none;border-bottom-color:var(--color-primary)}
.hw-conv select:focus-visible,.hw-conv input:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}
.hw-conv-out{display:grid;grid-template-columns:auto 1fr;gap:6px 16px;align-items:baseline;font-size:13px;color:var(--hw-muted)}
.hw-conv-out b{font-size:20px;font-weight:500;color:var(--color-primary);transition:opacity .2s ease}
.hw-steps{margin:0;padding:0;list-style:none;counter-reset:s;border-top:1px solid var(--hw-ink)}
.hw-steps li{counter-increment:s;display:grid;grid-template-columns:40px minmax(0,1fr);padding:16px 0;border-bottom:1px solid var(--hw-line);font-size:16px;line-height:1.65}
.hw-steps li::before{content:counter(s,decimal-leading-zero);font-family:var(--hw-mono);font-size:13px;color:var(--color-primary);padding-top:3px}
.hw-steps li b{font-weight:500;color:var(--hw-ink)}
.hw-related-note{display:flex;flex-direction:column;gap:4px;padding:14px 16px;border:1px solid var(--hw-line);text-decoration:none;transition:border-color .3s ease,padding-left .35s var(--ease)}
.hw-related-note b{font-weight:500;color:var(--color-primary)}
.hw-related-note:hover{border-color:var(--color-primary);padding-left:22px;text-decoration:none}
@media (prefers-reduced-motion:reduce){.hw-note-row,.hw-toc a,.hw-related-note{transition:none}}

/* ---------- colour picker ---------- */
.hw-viewtabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.hw-viewtab span{position:absolute;left:0;right:0;bottom:6px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--hw-muted);text-align:center}
.hw-viewtab img{padding-bottom:18px;box-sizing:border-box}
.hw-colours{display:flex;flex-direction:column;gap:12px}
.hw-colours-head{display:flex;justify-content:space-between;align-items:baseline;border-bottom:1px solid var(--hw-ink);padding-bottom:8px}
.hw-colour-now{font-size:15px;font-weight:500;color:var(--color-primary)}
.hw-swatches{display:grid;grid-template-columns:repeat(auto-fill,minmax(40px,1fr));gap:6px}
.hw-swatch{position:relative;padding:0;border:1px solid var(--hw-line);background:#fff;aspect-ratio:1/1;cursor:pointer;overflow:hidden;transition:transform .25s var(--ease),border-color .25s ease}
.hw-swatch img{width:100%;height:100%;object-fit:cover;display:block}
.hw-swatch:hover{transform:translateY(-2px);border-color:var(--hw-line-strong)}
.hw-swatch[aria-pressed="true"]{border-color:var(--color-primary);box-shadow:inset 0 0 0 2px #fff;outline:2px solid var(--color-primary);outline-offset:0}
.hw-stage img{transition:opacity .45s var(--ease),transform .8s var(--ease)}
@media (prefers-reduced-motion:reduce){.hw-swatch{transition:none}.hw-swatch:hover{transform:none}}

.hw-gallery .hw-colours{padding-top:4px}
.hw-viewtabs{grid-template-columns:repeat(2,minmax(0,96px))}


/* ---------- homepage (original design kept; motion added) ---------- */
@keyframes panelIn{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
.hero-half{animation:panelIn .7s var(--ease) both;transition:flex .55s var(--ease)}
.hero-half:nth-child(2){animation-delay:.08s}.hero-half:nth-child(3){animation-delay:.16s}.hero-half:nth-child(4){animation-delay:.24s}
.hero-half-content{transition:transform .35s ease}
.hero-half:hover .hero-half-content{transform:translateY(calc(-14% - 6px))}
@media (max-width:640px){.hero-half:hover .hero-half-content{transform:translateY(-14%)}}
.hero-half-content .btn-ghost{background-image:linear-gradient(var(--color-primary),var(--color-primary));background-repeat:no-repeat;background-size:0% 100%;transition:background-size .45s var(--ease),color .3s ease}
.hero-half:hover .btn-ghost{background-color:var(--color-primary);background-image:linear-gradient(var(--color-primary),var(--color-primary));background-size:100% 100%;color:#fff;border-color:var(--color-primary)}
.header .logo-icon{will-change:transform}

/* ---------- variants: style tiles and size chips ---------- */
.hw-variants{display:flex;flex-direction:column;gap:12px}
.hw-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px}
.hw-tile{display:flex;flex-direction:column;padding:0;border:1px solid var(--hw-line);background:#fff;cursor:pointer;font:inherit;text-align:left;transition:border-color .25s ease,transform .25s var(--ease)}
.hw-tile img{width:100%;aspect-ratio:1/1;object-fit:contain;display:block;border-bottom:1px solid var(--hw-line)}
.hw-tile span{font-size:12px;padding:6px 8px;color:var(--hw-ink);line-height:1.3}
.hw-tile:hover{border-color:var(--hw-line-strong);transform:translateY(-2px)}
.hw-tile[aria-pressed="true"]{border-color:var(--color-primary);outline:2px solid var(--color-primary);outline-offset:-1px}
.hw-chipset{display:flex;flex-wrap:wrap;gap:8px}
.hw-chip{min-height:40px;padding:0 14px;border:1px solid var(--hw-line);background:#fff;font:inherit;font-size:14px;color:var(--hw-ink);cursor:pointer;font-variant-numeric:tabular-nums;transition:border-color .25s ease,background .25s ease,color .25s ease}
.hw-chip:hover{border-color:var(--hw-line-strong)}
.hw-chip[aria-pressed="true"]{background:var(--color-primary);border-color:var(--color-primary);color:#fff}
.hw-spec td.is-changed{animation:hwFlash .9s var(--ease)}
@keyframes hwFlash{from{background:#e8eef6}to{background:transparent}}

/* ---------- card colour dots ---------- */
.hw-card-dots{display:flex;align-items:center;gap:4px;margin-top:2px}
.hw-card-dots i{width:12px;height:12px;border:1px solid rgba(0,0,0,.08);background-size:cover;background-position:center;display:inline-block}
.hw-card-dots em{font-style:normal;font-family:var(--hw-mono);font-size:12px;color:var(--hw-muted);margin-left:4px}
.hw-card-attrs{font-family:var(--hw-mono);font-size:13px;color:var(--hw-muted)}

/* ---------- plain content pages ---------- */
.hw-page{padding-block:8px 88px}
.hw-page .hw-prose{max-width:820px}
.hw-prose h2{margin:24px 0 0;font-size:1.5rem;font-weight:400;color:var(--hw-ink);padding-top:20px;border-top:1px solid var(--hw-ink)}
.hw-prose h2:first-child{margin-top:0}
.hw-prose ul{margin:0;padding-left:1.2em;line-height:1.7}
.hw-dl-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--hw-ink);max-width:820px}
.hw-dl-list li{display:flex;justify-content:space-between;gap:16px;align-items:baseline;padding:18px 0;border-bottom:1px solid var(--hw-line)}
.hw-dl-list b{font-weight:500;color:var(--hw-ink)}
.hw-dl-list span{font-size:14px;color:var(--hw-muted)}
.hw-contact{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:56px;align-items:start;padding-block:8px 88px}
@media (max-width:860px){.hw-contact{grid-template-columns:minmax(0,1fr);gap:32px}}
.hw-contact .hw-form{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:560px){.hw-contact .hw-form{grid-template-columns:minmax(0,1fr)}}
.hw-form--light .hw-field input,.hw-form--light .hw-field textarea,.hw-form--light .hw-field select{color:var(--hw-ink);border-bottom-color:var(--hw-line-strong)}
.hw-form--light .hw-field input:focus,.hw-form--light .hw-field textarea:focus,.hw-form--light .hw-field select:focus{border-bottom-color:var(--color-primary);background:var(--hw-surface)}
.hw-form--light .hw-field input:focus-visible,.hw-form--light .hw-field textarea:focus-visible,.hw-form--light .hw-field select:focus-visible{outline-color:var(--color-primary)}
.hw-form--light .hw-field{color:var(--hw-ink)}
.hw-form--light .hw-btn{background-color:var(--color-primary);color:#fff;border-color:var(--color-primary);background-image:linear-gradient(var(--color-secondary),var(--color-secondary))}
.hw-form--light .hw-btn:hover{color:#fff}
.hw-form--light .hw-done{border-color:var(--hw-line);color:var(--hw-ink)}
.hw-form--light .hw-err{color:#b4361c}
.hw-addr{display:flex;flex-direction:column;gap:18px;border-top:1px solid var(--hw-ink);padding-top:18px}
.hw-addr div{display:flex;flex-direction:column;gap:2px}
.hw-addr span{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--hw-muted)}
.hw-pending{font-size:11px;letter-spacing:.06em;text-transform:uppercase;border:1px solid #c58a2b;color:#8a5a12;padding:2px 6px;align-self:flex-start}
.hw-mono-num{font-variant-numeric:tabular-nums}
/* prose spacing: flat markdown output */
.hw-prose{gap:16px}
.hw-prose > h2{margin-top:40px}
.hw-prose > h2:first-child{margin-top:0}
.hw-prose > .hw-tablebox,.hw-prose > .hw-conv,.hw-prose > .hw-steps{margin-block:8px}
.hw-prose h2.hw-h2{scroll-margin-top:96px}

/* ---- restructure preview (2026-10-16): sub-groups, aliases, market tags, finder ---- */
.hw-subsec{display:flex;flex-direction:column;gap:14px;margin-top:8px;scroll-margin-top:96px}
.hw-subhd{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap;padding-top:14px;border-top:1px solid var(--hw-line)}
.hw-h3{margin:0;font-size:18px;font-weight:500;color:var(--hw-ink)}
.hw-subhd p{margin:0;font-size:14px;color:var(--hw-muted)}
.hw-aka{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px;margin:0}
.hw-aka-i{font-size:15px;color:var(--hw-ink)}
.hw-aka-i i{font-style:normal;font-family:var(--hw-mono);font-size:11px;letter-spacing:.08em;color:var(--hw-muted);text-transform:uppercase;margin-left:2px}
.hw-aka-i.is-pending{color:var(--hw-muted)}
.hw-aka-i em{font-style:normal;color:var(--color-primary)}
.hw-tags{display:flex;gap:8px;margin:0;flex-wrap:wrap}
.hw-tag,.hw-card-mk{font-family:var(--hw-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;border:1px solid var(--hw-line-strong);padding:2px 8px;color:var(--hw-muted);width:max-content}
.hw-card-mk{margin-top:6px;display:block}
.hw-finder{display:flex;flex-wrap:wrap;align-items:flex-end;gap:16px 24px;padding-bottom:20px}
.hw-finder-q{display:flex;flex-direction:column;gap:6px;flex:0 1 280px;max-width:280px}
.hw-finder-q input{height:38px;border:1px solid var(--hw-line-strong);padding:0 12px;font:inherit;font-size:14px;background:#fff;color:var(--hw-ink)}
.hw-finder-q input:focus{outline:2px solid var(--color-primary);outline-offset:1px}
.hw-finder-mk{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.hw-none{margin:24px 0;color:var(--hw-muted)}
.hw-card[hidden],.hw-subsec[hidden],.hw-catsec[hidden]{display:none}
.hw-card-sub{font-family:var(--hw-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--color-primary)}
.hw-subsec--mini{margin-top:8px}

/* ---------- homepage: text block a little lower, more room above (owner 2026-10-18) ---------- */
.hero-half-content{transform:translateY(-6%) !important}
.hero-half:hover .hero-half-content{transform:translateY(-6%) !important}

/* ---------- homepage: category name hidden visually (kept for screen readers/SEO); description above, button below (owner 2026-10-18) ---------- */
.hero-half-content h2{position:absolute !important;width:1px;height:1px;margin:-1px !important;padding:0 !important;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;min-height:0 !important}
.hero-half-content p{min-height:0 !important}

/* ---------- homepage: show each hero image whole, never cropped, on any screen shape (owner 2026-10-18) ---------- */
.hero-half{background-size:contain !important;background-repeat:no-repeat !important;background-position:center center !important;background-color:#fff}

/* ---------- homepage: gentler hover zoom (owner 2026-10-18) ---------- */
@media (min-width:900px){
  .hero-split:hover .hero-half{flex:0.99}
  .hero-split:hover .hero-half:hover{flex:1.03}
}

/* ---------- homepage: no hairline between panels (owner 2026-10-18) ---------- */
.hero-split{background:#fff;overflow:hidden}
@media (min-width:900px){.hero-half{margin-right:-1px}.hero-half:last-child{margin-right:0}}
.hero-half{background-color:#fff !important}

/* ---------- products page: result count and view switch (grid / list / detail) ---------- */
.hw-toolbar{display:flex;align-items:center;gap:20px;padding-top:6px;padding-bottom:14px}
.hw-count{margin:0;font-size:14px;color:var(--hw-muted)}
.hw-count b{color:var(--hw-ink);font-weight:600}
.hw-view{display:flex;align-items:center;gap:8px;margin-left:auto}
.hw-vbtn{width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--hw-line-strong);background:#fff;color:var(--hw-ink);cursor:pointer;padding:0}
.hw-vbtn svg{fill:none;stroke:currentColor;stroke-width:1.5}
.hw-vbtn[aria-pressed="true"]{background:var(--color-primary);border-color:var(--color-primary);color:#fff}
.hw-vbtn:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}
.hw-card-sum,.hw-card-rows{display:none}
.hw-view-list .hw-grid,.hw-view-detail .hw-grid{grid-template-columns:1fr}
.hw-view-list .hw-card,.hw-view-detail .hw-card{flex-direction:row;align-items:stretch}
.hw-view-list .hw-card-img{width:96px;flex:none;border-bottom:0;border-right:1px solid var(--hw-line)}
.hw-view-list .hw-card-body{padding:12px 18px;flex-direction:row;flex-wrap:wrap;align-items:center;gap:4px 16px}
.hw-view-list .hw-card-sub,.hw-view-list .hw-card-dots,.hw-view-list .hw-card-mk{display:none}
.hw-view-list .hw-card-name{font-size:16px}
.hw-view-list .hw-card-name{flex:1 1 220px}
.hw-view-list .hw-card-attrs{flex:0 1 auto}
.hw-view-list .hw-card-go{margin:0 0 0 auto;padding:0;flex:none}
.hw-view-detail .hw-card-img{width:200px;flex:none;border-bottom:0;border-right:1px solid var(--hw-line)}
.hw-view-detail .hw-card-body{padding:18px 22px;gap:8px}
.hw-view-detail .hw-card-attrs{display:none}
.hw-view-detail .hw-card-sum{display:block;font-size:14px;line-height:1.55;color:var(--hw-ink);max-width:70ch}
.hw-view-detail .hw-card-rows{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:4px 24px;margin-top:4px}
.hw-view-detail .hw-card-row{display:flex;gap:10px;font-size:13px;border-top:1px solid var(--hw-line);padding:5px 0}
.hw-view-detail .hw-card-row b{font-weight:500;color:var(--hw-muted);flex:0 0 84px}
.hw-view-detail .hw-card-row span{color:var(--hw-ink);overflow-wrap:anywhere}
@media (max-width:640px){.hw-view-detail .hw-card,.hw-view-list .hw-card{flex-direction:column}.hw-view-list .hw-card-img,.hw-view-detail .hw-card-img{width:100%;border-right:0;border-bottom:1px solid var(--hw-line)}.hw-view-list .hw-card-img{width:100%}.hw-view-list .hw-card-attrs{margin-left:0}}

/* ---------- products page: scrolling strip of round type shortcuts (after the Syndicate category page) ---------- */
.hw-cats{position:relative;display:flex;align-items:center;gap:8px;padding-top:8px;padding-bottom:26px}
.hw-cats-track{display:flex;gap:30px;overflow-x:auto;scroll-behavior:auto;scrollbar-width:none;-ms-overflow-style:none;padding:6px 4px 4px;flex:1;min-width:0;cursor:grab}
.hw-cats-track::-webkit-scrollbar{display:none}
.hw-cats-track.is-drag{cursor:grabbing;user-select:none}
.hw-cats-btn{flex:none;width:36px;height:36px;border:1px solid var(--hw-line-strong);background:#fff;color:var(--color-primary);border-radius:50%;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;padding:0}
.hw-cats-btn svg{fill:none;stroke:currentColor;stroke-width:1.6}
.hw-cats-btn:hover{background:var(--color-primary);color:#fff;border-color:var(--color-primary)}
.hw-cats-btn:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}
.hw-cat{flex:none;display:flex;flex-direction:column;align-items:center;gap:8px;text-decoration:none;color:inherit;width:132px}
.hw-cat-img{width:112px;height:112px;border-radius:50%;overflow:hidden;background:#fff;border:1px solid var(--hw-line);display:flex;align-items:center;justify-content:center;transition:border-color .25s ease,transform .35s var(--ease)}
.hw-cat-img img{width:100%;height:100%;object-fit:contain;-webkit-user-drag:none}
.hw-cat:hover .hw-cat-img,.hw-cat:focus-visible .hw-cat-img{border-color:var(--color-primary);transform:translateY(-2px)}
.hw-cat-name{font-size:14px;font-weight:500;color:var(--color-primary);text-align:center;line-height:1.25;min-height:2.5em}
.hw-cat-n{font-family:var(--hw-mono);font-size:11px;letter-spacing:.06em;color:var(--hw-muted);text-transform:uppercase}
@media (max-width:640px){.hw-cats-btn{display:none}.hw-cats-track{gap:18px}}

/* ---------- products page: equal-size card effect in every view (owner 2026-10-19) ---------- */
.hw-view-list .hw-grid,.hw-view-detail .hw-grid{gap:14px;border:0}
.hw-view-list .hw-card,.hw-view-detail .hw-card{border:1px solid var(--hw-line);border-radius:6px;box-shadow:0 1px 2px rgba(20,40,70,.05);overflow:hidden;transition:box-shadow .25s ease,border-color .25s ease}
.hw-view-list .hw-card:hover,.hw-view-detail .hw-card:hover{box-shadow:0 6px 18px rgba(20,40,70,.10)}
.hw-view-list .hw-card::after,.hw-view-detail .hw-card::after{display:none}
.hw-view-detail .hw-card-img{width:220px;height:220px;flex:none;aspect-ratio:1/1;background:#fff;border-right:1px solid var(--hw-line)}
.hw-view-list .hw-card-img{width:96px;height:96px;flex:none}
.hw-view-detail .hw-card{min-height:220px}
.hw-view-list .hw-card-img img,.hw-view-detail .hw-card-img img{width:100%;height:100%;object-fit:contain}
@media (max-width:640px){.hw-view-detail .hw-card-img{width:100%;height:auto;aspect-ratio:1/1}.hw-view-list .hw-card-img{width:100%;height:auto;aspect-ratio:1/1}}

/* ---------- product page: models and sizes (one chip per value) ---------- */
.hw-models{padding-top:34px;padding-bottom:34px}
.hw-models-note{margin:6px 0 18px;color:var(--hw-muted);font-size:14px}
.hw-model-list{margin:0;display:flex;flex-direction:column}
.hw-model-row{display:grid;grid-template-columns:200px 1fr;gap:12px 24px;padding:14px 0;border-top:1px solid var(--hw-line)}
.hw-model-row dt{font-weight:500;color:var(--hw-ink);font-size:14px}
.hw-model-row dt span{color:var(--hw-muted);font-weight:400}
.hw-model-row dd{margin:0;display:flex;flex-wrap:wrap;gap:8px}
.hw-model-chip{font-family:var(--hw-mono);font-size:13px;padding:6px 12px;border:1px solid var(--hw-line-strong);background:#fff;color:var(--hw-ink);border-radius:4px}
@media (max-width:640px){.hw-model-row{grid-template-columns:1fr}}

/* ---------- detail/list cards: divider runs the full height of the card (owner 2026-10-19) ---------- */
.hw-view-list .hw-card-img,.hw-view-detail .hw-card-img{border-right:0 !important;border-bottom:0 !important;align-self:center}
.hw-view-list .hw-card-body,.hw-view-detail .hw-card-body{border-left:1px solid var(--hw-line)}
@media (max-width:640px){.hw-view-list .hw-card-body,.hw-view-detail .hw-card-body{border-left:0;border-top:1px solid var(--hw-line)}}

/* list view thumbnails a little larger so fine-line products stay readable */
.hw-view-list .hw-card-img{width:120px !important;height:120px !important}

/* ---------- colour chart, swatch groups, downloads ---------- */
.hw-swatch-groups{display:flex;flex-direction:column;gap:14px}
.hw-swatch-label{display:block;margin:0 0 6px;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--hw-muted)}
.hw-chart{padding-top:34px;padding-bottom:40px}
.hw-chart-head{display:flex;justify-content:space-between;gap:16px 32px;align-items:flex-end;flex-wrap:wrap;margin-bottom:20px}
.hw-chart-dl{display:flex;flex-direction:column;gap:6px;align-items:flex-start}
.hw-chart-group + .hw-chart-group{margin-top:28px}
.hw-chart-label{margin:0 0 12px;font-size:15px;font-weight:500;color:var(--hw-ink);display:flex;gap:10px;align-items:baseline}
.hw-chart-label span{font-weight:400;font-size:13px;color:var(--hw-muted)}
.hw-chart-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(128px,1fr));gap:12px}
.hw-chart-tile{display:flex;flex-direction:column;align-items:center;gap:2px;width:100%;padding:8px 6px 10px;border:1px solid var(--hw-line);background:#fff;cursor:pointer;font:inherit;color:var(--hw-ink);text-align:center;transition:transform .25s var(--ease),border-color .25s ease,box-shadow .25s ease}
.hw-chart-tile img{width:100%;aspect-ratio:1/1;object-fit:contain;display:block}
.hw-chart-tile:hover,.hw-chart-tile:focus-visible{transform:translateY(-2px);border-color:var(--hw-line-strong);box-shadow:0 6px 18px rgba(20,40,80,.08)}
.hw-chart-code{font-family:var(--hw-mono);font-size:12px;color:var(--hw-muted);margin-top:4px}
.hw-chart-name{font-size:13px;line-height:1.3}
@media (prefers-reduced-motion:reduce){.hw-chart-tile{transition:none}.hw-chart-tile:hover{transform:none}}
@media (max-width:640px){.hw-chart-grid{grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:8px}}
.hw-draft{font-style:normal;color:#a15c00;font-size:13px}
.hw-dl-h{margin:36px 0 12px;font-size:20px}
.hw-dl-list li{align-items:center}
.hw-dl-list li > div:first-child{display:flex;flex-direction:column;gap:3px}
.hw-dl-meta{font-size:13px;color:var(--hw-muted)}
.hw-dl-act{display:flex;gap:22px;align-items:baseline;flex-shrink:0}
@media (max-width:640px){.hw-dl-list li{flex-direction:column;align-items:flex-start}}

/* ---------- home hero: fixed geometry so the text blocks and buttons line up (desktop) ---------- */
@media (min-width:900px){
  .hero-split{height:calc(200vw / var(--n, 4));min-height:0;max-height:none}
  .hero-split .hero-half{min-height:0;background-position:center top !important}
  .hero-split .hero-half-content{position:absolute !important;left:0;right:0;top:30.5%;height:auto !important;justify-content:flex-start !important;transform:none !important;padding:0 1.2rem}
  .hero-split .hero-half:hover .hero-half-content{transform:none !important}
  .hero-split .hero-half-content p{min-height:6.3em !important;margin-bottom:1rem}
}

/* ---------- formal enquiry form + registration dialog ---------- */
.hw-rfq{display:flex;flex-direction:column;gap:22px}
.hw-fs{border:1px solid var(--hw-line);padding:22px 22px 24px;margin:0;min-width:0}
.hw-fs legend{padding:0 8px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--hw-muted)}
.hw-fsgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 20px}
@media (max-width:640px){.hw-fsgrid{grid-template-columns:minmax(0,1fr)}.hw-fs{padding:18px 14px}}
.hw-rfq .hw-field{position:relative}
.hw-rfq .hw-field > span,.hw-field--full > span{font-size:13px;color:var(--hw-ink)}
.hw-rfq .hw-field small{font-size:12px;color:var(--hw-muted)}
.hw-rfq .hw-field input,.hw-rfq .hw-field select,.hw-rfq .hw-field textarea{border:1px solid var(--hw-line-strong);border-radius:4px;padding:10px 12px;background:#fff;color:var(--hw-ink)}
.hw-rfq .hw-field input[type=file]{padding:8px}
.hw-rfq .hw-field input:focus,.hw-rfq .hw-field select:focus,.hw-rfq .hw-field textarea:focus{border-color:var(--color-primary);background:#fff;outline:2px solid color-mix(in srgb,var(--color-primary) 25%,transparent);outline-offset:0}
.hw-rfq [aria-invalid=true]{border-color:#b3261e !important}
.hw-ferr{font-style:normal;font-size:12.5px;color:#b3261e}
.hw-pick{display:flex;flex-direction:column;gap:8px;margin-top:6px}
.hw-pickgrp{border:1px solid var(--hw-line);border-radius:4px}
.hw-pickgrp summary{cursor:pointer;padding:10px 12px;font-size:14px;display:flex;gap:8px;align-items:baseline;list-style:none}
.hw-pickgrp summary::-webkit-details-marker{display:none}
.hw-pickgrp summary::before{content:'+';font-family:var(--hw-mono);color:var(--hw-muted);width:12px}
.hw-pickgrp[open] summary::before{content:'–'}
.hw-pickgrp summary span{color:var(--hw-muted);font-size:12px}
.hw-pickrow{display:flex;flex-wrap:wrap;gap:8px;padding:4px 12px 14px}
.hw-chk{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--hw-line-strong);border-radius:999px;padding:6px 12px;font-size:13px;cursor:pointer;background:#fff}
.hw-chk:has(input:checked){border-color:var(--color-primary);background:color-mix(in srgb,var(--color-primary) 8%,#fff)}
.hw-chk input{accent-color:var(--color-primary)}
.hw-consent{display:flex;gap:10px;align-items:flex-start;font-size:14px;line-height:1.5}
.hw-consent input{margin-top:3px;accent-color:var(--color-primary)}
.hw-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.hw-submitrow{display:flex;gap:18px;align-items:center;flex-wrap:wrap}
.hw-submitrow p{margin:0;font-size:12.5px;color:var(--hw-muted)}
.hw-rfq .hw-btn{grid-column:auto}
.hw-addr-note{font-size:13px;color:var(--hw-muted);margin:10px 0 0}
.hw-done{display:flex;flex-direction:column;gap:8px;border:1px solid var(--hw-line);padding:26px;background:var(--hw-surface,#f6f8fb)}
.hw-done b{font-size:18px;color:var(--hw-ink)}
.hw-reg{border:1px solid var(--hw-line-strong);border-radius:6px;padding:0;max-width:min(560px,94vw);width:100%}
.hw-reg::backdrop{background:rgba(10,24,45,.55)}
.hw-reg form{display:flex;flex-direction:column;gap:14px;padding:26px}
.hw-reg h2{margin:0;font-size:22px}
.hw-reg p{margin:0;color:var(--hw-muted);font-size:14px}
.hw-reg .hw-actions{display:flex;gap:12px;align-items:center}
.hw-dl-list .hw-lock{display:inline-block;margin-right:6px;font-size:12px;color:var(--hw-muted)}
.hw-dl-list a.is-locked{cursor:pointer}
.hw-dl-status{margin:0 0 18px;padding:12px 14px;border-left:3px solid var(--color-primary);background:var(--hw-surface,#f6f8fb);font-size:14px}
.hw-dl-status:empty{display:none}

.hw-consent-bar{position:fixed;left:16px;right:16px;bottom:16px;z-index:60;max-width:760px;margin:0 auto;background:#fff;border:1px solid var(--hw-line-strong);box-shadow:0 10px 30px rgba(10,24,45,.18);padding:16px 18px;display:flex;gap:16px;align-items:center;flex-wrap:wrap;justify-content:space-between}
.hw-consent-bar p{margin:0;font-size:14px;flex:1 1 320px}
.hw-consent-bar div{display:flex;gap:10px}
.hw-btn-line{background:#fff;border:1px solid var(--hw-line-strong);padding:10px 16px;cursor:pointer;font:inherit}

/* language switcher + draft translation bar */
.hw-lang{position:relative;display:inline-block;margin-left:14px;font-size:13px}
.hw-lang summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:0 12px;border:1px solid var(--hw-line-strong);border-radius:4px;background:#fff;color:var(--hw-ink);letter-spacing:.02em}
.hw-lang summary::-webkit-details-marker{display:none}
.hw-lang summary::after{content:"";width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform .2s}
.hw-lang[open] summary::after{transform:rotate(-135deg) translateY(-2px)}
.hw-lang summary:hover{border-color:var(--color-primary);color:var(--color-primary)}
.hw-lang summary:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}
.hw-lang ul{position:absolute;right:0;top:calc(100% + 6px);z-index:60;margin:0;padding:6px 0;list-style:none;min-width:160px;background:#fff;border:1px solid var(--hw-line-strong);border-radius:4px;box-shadow:0 8px 24px rgba(10,24,45,.14)}
.hw-lang li{margin:0}
.hw-lang a{display:block;padding:9px 16px;color:var(--hw-ink);text-decoration:none;font-size:14px}
.hw-lang a:hover,.hw-lang a:focus-visible{background:var(--hw-surface);color:var(--color-primary)}
.hw-lang a[aria-current]{color:var(--color-primary);font-weight:600}
@media (max-width:899px){.hw-lang{margin:10px 0 0}.hw-lang ul{right:auto;left:0}}
.hw-draftbar{background:#fff4d6;color:#7a5200;text-align:center;font-size:13px;padding:6px 12px;border-bottom:1px solid #f0c27a}

/* long German / Spanish compound words must never push the page wider than a phone */
h1, h2, h3, .hw-h1, .hw-h2, .hw-h3 { overflow-wrap: break-word; hyphens: auto; }

/* form buttons follow the page standard: solid primary button, fills with the secondary colour on hover (the enquiry form and the catalogue registration dialog are light, not dark, forms) */
.hw-rfq .hw-btn, .hw-reg .hw-btn { background-color: var(--color-primary); color: #fff; border-color: var(--color-primary); background-image: linear-gradient(var(--color-secondary), var(--color-secondary)); }
.hw-rfq .hw-btn:hover, .hw-reg .hw-btn:hover { color: #fff; }
.hw-rfq .hw-btn:focus-visible, .hw-reg .hw-btn:focus-visible { outline: 2px solid var(--color-secondary); outline-offset: 2px; }
.hw-rfq .hw-btn:disabled, .hw-reg .hw-btn:disabled { opacity: .6; cursor: not-allowed; }

/* catalogue registration dialog: light form, same fields as the enquiry form */
.hw-reg .hw-field { color: var(--hw-ink); }
.hw-reg .hw-field > span { font-size: 13px; color: var(--hw-ink); }
.hw-reg .hw-field input, .hw-reg .hw-field select { border: 1px solid var(--hw-line-strong); border-radius: 4px; padding: 10px 12px; background: #fff; color: var(--hw-ink); }
.hw-reg .hw-field input:focus, .hw-reg .hw-field select:focus { border-color: var(--color-primary); outline: 2px solid color-mix(in srgb, var(--color-primary) 25%, transparent); outline-offset: 0; background: #fff; }
.hw-reg [aria-invalid=true] { border-color: #b3261e !important; }
.hw-reg .hw-fsgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media (max-width: 560px) { .hw-reg .hw-fsgrid { grid-template-columns: 1fr; } }
.hw-reg .hw-consent { display: flex; gap: 10px; align-items: flex-start; font-size: 13px; color: var(--hw-ink); }
.hw-reg .hw-consent input { margin-top: 3px; }
.hw-reg .hw-ferr { font-style: normal; font-size: 12px; color: #b3261e; }
.hw-reg .hw-err { color: #b3261e; }
/* a button that looks like the page's text links (Cancel) */
button.hw-link { background-color: transparent; border: 0; border-radius: 0; padding: 0 0 2px; font-family: inherit; font-size: 14px; color: var(--color-primary); cursor: pointer; }
.hw-reg { margin: auto; }

.drawer-lang{margin:0 0 14px}
.drawer .hw-lang{margin:0;display:block}
.drawer .hw-lang summary{width:100%;justify-content:space-between}
.drawer .hw-lang ul{top:auto;bottom:calc(100% + 6px);left:0;right:0}

/* the Products item in the top menu is a real link (opens the category menu on hover, goes to the products page on click) */
a.nav-dropdown-trigger{text-decoration:none;display:inline-block}
a.nav-dropdown-trigger:hover{text-decoration:none}

/* decorative strip of product photos on the Our Factory and ODM pages (white-background photos, no captions) */
.hw-strip{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:0;border-top:1px solid var(--hw-line);border-bottom:1px solid var(--hw-line);margin:8px 0}
.hw-strip figure{margin:0;padding:18px 10px;display:flex;align-items:center;justify-content:center;border-right:1px solid var(--hw-line);background:#fff}
.hw-strip figure:last-child{border-right:0}
.hw-strip img{width:100%;height:96px;object-fit:contain}
@media (max-width:820px){.hw-strip{grid-template-columns:repeat(3,minmax(0,1fr))}.hw-strip figure{border-bottom:1px solid var(--hw-line)}.hw-strip figure:nth-child(3n){border-right:0}.hw-strip figure:nth-last-child(-n+3){border-bottom:0}}

/* ===== Our Factory / ODM / About: quieter editorial layout ===== */
.hw-page--sec{display:flex;flex-direction:column;gap:0;padding-block:0 96px;max-width:none}
.hw-page--sec > .hw-strip{margin:0 0 8px}
.hw-sec{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2.4fr);gap:48px;padding-block:44px;border-top:1px solid var(--hw-line)}
.hw-sec > h2{margin:0;padding:0;border:0;font-size:1.05rem;font-weight:500;letter-spacing:.01em;color:var(--hw-ink);position:sticky;top:96px;align-self:start}
.hw-sec-body{display:flex;flex-direction:column;gap:18px;min-width:0;max-width:760px}
.hw-sec-body p{margin:0;font-size:16px;line-height:1.75;max-width:64ch}
.hw-sec-body ul{list-style:none;margin:0;padding:0;border-top:1px solid var(--hw-line)}
.hw-sec-body ul li{padding:13px 0;border-bottom:1px solid var(--hw-line);line-height:1.65}
.hw-sec-body ul:has(li > b:first-child) li{display:grid;grid-template-columns:minmax(120px,190px) minmax(0,1fr);gap:8px 28px}
.hw-sec-body ul li > b{font-weight:500;color:var(--hw-ink)}
.hw-sec-body ol.hw-steps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 36px;margin:0;padding:0;list-style:none;counter-reset:st}
.hw-sec-body ol.hw-steps li{display:block;padding:18px 0 0;border:0;border-top:1px solid var(--hw-ink);counter-increment:st}
.hw-sec-body ol.hw-steps li::before{content:counter(st,decimal-leading-zero);display:block;font-family:var(--hw-mono);font-size:12px;letter-spacing:.08em;color:var(--hw-muted);margin-bottom:8px}
.hw-sec-body ol.hw-steps li > span::before,.hw-sec-body ol.hw-steps li::after{content:none}
.hw-figs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:0;border-top:1px solid var(--hw-ink)}
.hw-figs > div{padding:20px 0 22px;border-bottom:1px solid var(--hw-line)}
.hw-figs dt{font-size:13px;color:var(--hw-muted);margin:0 0 6px;order:2}
.hw-figs dd{margin:0;display:flex;align-items:baseline;gap:8px}
.hw-fig-n{font-size:clamp(2rem,3.4vw,2.8rem);line-height:1;font-weight:300;color:var(--hw-ink);letter-spacing:-.01em}
.hw-fig-u{font-family:var(--hw-mono);font-size:12px;color:var(--hw-muted)}
.hw-cta{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;padding:28px 32px;background:var(--hw-surface);border-left:3px solid var(--color-primary)}
.hw-cta p{margin:0;font-size:1.15rem;color:var(--hw-ink);max-width:none}
.hw-strip{background:var(--hw-surface);border-color:transparent}
.hw-strip figure{background:transparent;border-right-color:#e3e8ee}
.hw-strip img{height:120px;mix-blend-mode:multiply}
@media (max-width:900px){.hw-sec{grid-template-columns:minmax(0,1fr);gap:18px;padding-block:32px}.hw-sec > h2{position:static}.hw-figs{grid-template-columns:repeat(2,minmax(0,1fr))}.hw-sec-body ul:has(li > b:first-child) li{grid-template-columns:minmax(0,1fr);gap:2px}.hw-sec-body ol.hw-steps{grid-template-columns:minmax(0,1fr)}}
/* tidy: no doubled rules where a list or the figures start a section, steps without the old top rule */
.hw-sec-body > ul:first-child{border-top:0}
.hw-figs{border-top:0}
.hw-sec-body ol.hw-steps{border-top:0;counter-reset:st}
.hw-sec-body ol.hw-steps li{grid-template-columns:none;border-bottom:0}
.hw-sec-body ol.hw-steps li::before{color:var(--color-primary)}
.hw-sec-body > ul:last-of-type:not(:last-child){margin-bottom:0}
.hw-page--sec > p{margin:0 0 18px;font-size:16px;line-height:1.75;max-width:64ch}
.hw-page--sec > p:first-child{margin-top:8px}

/* photos on the Our Factory and ODM pages */
.hw-photos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin:8px 0 12px}
.hw-photos figure{margin:0}
.hw-photo{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--hw-surface)}
.hw-photo img{width:100%;height:100%;object-fit:cover;display:block}
.hw-photos figcaption{margin-top:10px;font-size:13px;color:var(--hw-muted);letter-spacing:.01em}
.hw-ref{position:absolute;left:10px;top:10px;padding:4px 8px;font-family:var(--hw-mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase;background:rgba(255,255,255,.92);color:var(--hw-muted);border:1px solid var(--hw-line)}
@media (max-width:820px){.hw-photos{grid-template-columns:minmax(0,1fr)}}
.hw-maplink{display:inline-block;margin-left:8px;font-size:13px}

/* Keep the selected wooden pick upright without altering its source image. */
img[src$="/mvom2mss8943o.png"]{rotate:90deg}

/* Keep category shortcuts below the sticky header. */
.hw-catmain .hw-card[id]{scroll-margin-top:96px}
