/* Raitop — industrial B2B catalogue.
   Flat, high-contrast, no gradients. White product surfaces, readable tables. */
:root{
  --navy:#14283F;        /* headers, footer, headings */
  --navy-2:#1E3A58;
  --blue:#1769AA;        /* primary action */
  --blue-d:#12558A;
  --blue-l:#EAF2F9;
  --teal:#087E8B;        /* sparing accent */
  --teal-l:#E6F3F4;
  --bg:#F7F9FC;          /* page background */
  --surface:#FFFFFF;     /* cards, product pages */
  --ink:#243040;         /* body text */
  --ink-2:#4A5A6E;
  --ink-3:#6B7A8D;
  --line:#DDE4EE;
  --line-2:#EDF1F7;
  --head-bg:#F2F6FB;     /* table header cells */
  --warn-bg:#FFF6E5; --warn-line:#E8C273; --warn-ink:#6B4C0B;
  --err:#B3261E; --err-bg:#FDECEA; --err-line:#F0C4C0;
  --ok:#1B6B3A; --ok-bg:#E9F6EE; --ok-line:#BFE3CC;
  --r:6px;
  --font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans CJK SC","Source Han Sans SC",sans-serif;
  --mono:ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font);
  font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:var(--blue-d);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3,h4{line-height:1.25;margin:0 0 .5em;color:var(--navy);letter-spacing:-.01em}
h1{font-size:clamp(1.5rem,1.1rem + 1.5vw,2.15rem);font-weight:700}
h2{font-size:clamp(1.2rem,1.05rem + .7vw,1.5rem);font-weight:700}
h3{font-size:1.02rem;font-weight:650}
p{margin:0 0 1em}
ul,ol{margin:0 0 1em;padding-left:1.2em}
.wrap{max-width:1200px;margin:0 auto;padding:0 20px}
.muted{color:var(--ink-3);font-size:.9rem}
.skip{position:absolute;left:-999px}
.skip:focus{left:8px;top:8px;background:#fff;padding:10px 14px;z-index:99;border:2px solid var(--blue)}
:focus-visible{outline:2px solid var(--blue);outline-offset:2px}

/* ---------- utility bar: language + contact ---------- */
.util{background:var(--navy);color:#C7D4E4;font-size:.8rem}
.util-in{display:flex;align-items:center;gap:16px;min-height:36px;flex-wrap:wrap}
.util a{color:#DCE6F2}
.util a:hover{color:#fff}
.util .sep{color:#3C5372}
.langs{margin-left:auto;display:flex;align-items:center;gap:2px}
.langs .lbl{color:#8FA3BC;margin-right:6px}
.langs a{padding:3px 8px;border-radius:4px;font-weight:600;letter-spacing:.02em}
.langs a:hover{background:#22405F;text-decoration:none}
.langs a[aria-current="true"]{background:var(--blue);color:#fff}

/* ---------- header ---------- */
.site-head{background:var(--surface);border-bottom:1px solid var(--line);
  position:sticky;top:0;z-index:40}
.head-inner{display:flex;align-items:center;gap:16px;min-height:66px}
.brand{display:flex;align-items:center;flex:0 0 auto;text-decoration:none}
.brand:hover{text-decoration:none}
.brand img{height:38px;width:auto;display:block}
.head-search{display:flex;gap:8px;flex:1 1 auto;min-width:0;margin:0}
.head-search input{flex:1;min-width:0;padding:9px 12px;border:1px solid var(--line);
  border-radius:var(--r);font-size:.9rem;font-family:inherit;background:var(--bg);color:var(--ink)}
.head-search button{padding:9px 18px;border:1px solid var(--blue);background:var(--blue);color:#fff;
  border-radius:var(--r);font-size:.88rem;font-weight:600;cursor:pointer;font-family:inherit;flex:0 0 auto}
.head-search button:hover{background:var(--blue-d);border-color:var(--blue-d)}
.head-cta{flex:0 0 auto}
.nav-toggle{display:none;background:none;border:1px solid var(--line);
  border-radius:var(--r);width:42px;height:38px;padding:9px 10px;cursor:pointer;flex:0 0 auto}
.nav-toggle span{display:block;height:2px;background:var(--ink-2);margin:3px 0;border-radius:2px}
/* category bar: the catalogue is one tap away, and long translated labels just scroll */
.cat-bar{border-top:1px solid var(--line-2);background:var(--surface);position:relative;z-index:50}
.cat-bar-in{display:flex;gap:2px;list-style:none;margin:0 auto}
.cat-bar-in > li{position:static;display:flex;align-items:stretch}
.cat-bar a{white-space:nowrap;padding:10px 12px;font-size:.87rem;font-weight:500;color:var(--ink-2);
  border-bottom:2px solid transparent;display:block}
.cat-bar-in > li:first-child > a{padding-left:0}
.cat-bar a:hover{color:var(--blue-d);text-decoration:none;border-bottom-color:var(--blue)}
.cat-bar a[aria-current="page"]{color:var(--navy);font-weight:650;border-bottom-color:var(--teal)}

/* second level: the category list lives under Products, not across the bar */
.menu-toggle{border:0;background:none;cursor:pointer;padding:0 10px 0 2px;color:var(--ink-3);
  border-bottom:2px solid transparent}
.menu-toggle::after{content:"";display:block;width:7px;height:7px;border-right:2px solid currentColor;
  border-bottom:2px solid currentColor;transform:rotate(45deg) translate(-2px,-2px)}
.menu-toggle:hover{color:var(--blue-d)}
.submenu{display:none;position:absolute;left:0;right:0;top:100%;z-index:40;
  background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  box-shadow:0 14px 28px rgba(20,40,63,.10)}
.has-menu:hover .submenu,
.has-menu:focus-within .submenu,
.has-menu.open .submenu{display:block}
.has-menu:hover > a.top,.has-menu.open > a.top{color:var(--blue-d);border-bottom-color:var(--blue)}
.submenu-in{padding:20px 0 18px}
.submenu-head{font-size:.75rem;text-transform:uppercase;letter-spacing:.08em;color:var(--teal);
  margin:0 0 12px;font-weight:700}
.submenu-grid{list-style:none;margin:0;padding:0;column-width:250px;column-gap:30px}
.submenu-grid li{break-inside:avoid}
.submenu-grid a{display:flex;align-items:baseline;justify-content:space-between;gap:12px;
  padding:7px 0;border-bottom:1px solid var(--line-2);white-space:normal;font-weight:500;
  color:var(--ink)}
.submenu-grid a:hover{color:var(--blue-d);border-bottom-color:var(--line)}
.submenu-grid em{font-style:normal;font-size:.78rem;color:var(--ink-3);flex:0 0 auto}
.submenu-all{margin:16px 0 0}
.submenu-all a{padding:0;font-weight:650;color:var(--blue-d)}
.only-mobile,.cat-bar-in > li.only-mobile{display:none}

/* ---------- buttons ---------- */
.btn{display:inline-block;padding:10px 18px;border-radius:var(--r);background:var(--blue);
  color:#fff!important;font-weight:600;font-size:.92rem;border:1px solid var(--blue);cursor:pointer;
  text-decoration:none!important;font-family:inherit;text-align:center;line-height:1.35}
.btn:hover{background:var(--blue-d);border-color:var(--blue-d)}
.btn-sm{padding:7px 14px;font-size:.85rem}
.btn-ghost{background:var(--surface);color:var(--blue-d)!important;border-color:var(--line)}
.btn-ghost:hover{background:var(--blue-l);border-color:var(--blue)}
.btn-block{display:block;width:100%}

/* ---------- breadcrumb ---------- */
.crumbs{border-bottom:1px solid var(--line);background:var(--surface)}
.crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:10px 0;font-size:.82rem}
.crumbs li::after{content:"›";margin-left:6px;color:var(--ink-3)}
.crumbs li:last-child::after{content:""}
.crumbs a{color:var(--ink-2)}
.crumbs [aria-current]{color:var(--ink-3)}

/* ---------- hero ---------- */
.hero{background:var(--navy);color:#E6EDF6;border-bottom:3px solid var(--teal)}
.hero-inner{padding:44px 0 42px;display:grid;grid-template-columns:1.35fr 1fr;gap:40px;align-items:start}
.hero h1{color:#fff;margin-bottom:.4em}
.hero .lede{font-size:1.05rem;color:#C7D4E4;max-width:58ch}
.hero .muted{color:#93A7BF}
.hero-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}
.hero-actions .btn-ghost{background:transparent;color:#fff!important;border-color:#3C5372}
.hero-actions .btn-ghost:hover{background:#22405F;border-color:#5A7595}
.hero-facts{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:20px 22px}
.hero-facts h2{font-size:.76rem;text-transform:uppercase;letter-spacing:.08em;color:var(--teal);margin-bottom:12px}
.hero-facts ol{margin:0;padding-left:1.15em;font-size:.91rem;color:var(--ink-2)}
.hero-facts li{margin-bottom:.55em}
.hero-facts li strong{color:var(--navy)}
.hero-facts .muted{color:var(--ink-3)}

/* full-bleed picture hero */
.hero-shot{position:relative;background:var(--navy);overflow:hidden}
.hero-shot-img{position:absolute;inset:0;display:block}
.hero-shot-img img{width:100%;height:100%;object-fit:cover;object-position:60% 50%;display:block}
.hero-shot::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(90deg,rgba(11,24,38,.90) 0%,rgba(11,24,38,.72) 42%,
             rgba(11,24,38,.10) 74%,rgba(11,24,38,0) 100%)}
.hero-shot-in{position:relative;z-index:2;padding:52px 20px 54px;max-width:1200px}
/* The part-number box is the point of the hero, so the whole band is capped
   at a height that keeps it on screen on a 768 px-tall laptop. */
.hero-shot{max-height:min(74vh,560px)}
.hero-shot .eyebrow{font-size:.74rem;letter-spacing:.13em;text-transform:uppercase;
  color:#7FD3DC;font-weight:700;margin:0 0 .7em}
.hero-shot h1{color:#fff;max-width:22ch;margin-bottom:.3em}
.hero-shot .lede{color:#CFDDEC;font-size:1.02rem;max-width:56ch;margin-bottom:20px}
.hero-find{display:flex;gap:8px;max-width:560px;margin:0 0 16px}
.hero-find input{flex:1 1 auto;padding:12px 14px;border:1px solid #3C5372;border-radius:var(--r);
  background:rgba(8,18,30,.72);color:#fff;font-size:1rem}
.hero-find input::placeholder{color:#8FA6C0}
.hero-find input:focus{outline:2px solid var(--teal);outline-offset:1px;border-color:var(--teal)}
.hero-find .btn{flex:0 0 auto;white-space:nowrap}
.hero-shot .hero-actions{margin-top:0}
.hero-shot .btn-ghost{background:rgba(8,18,30,.45);color:#fff!important;border-color:#4A6A8E}
.hero-shot .btn-ghost:hover{background:#22405F;border-color:#7FD3DC}
.facts-band{background:var(--surface);border-bottom:1px solid var(--line);padding:26px 0}
.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}
@media (max-width:820px){
  .hero-shot-img img{object-position:50% 45%}
  .hero-shot::after{background:linear-gradient(180deg,rgba(11,24,38,.72) 0%,
    rgba(11,24,38,.86) 55%,rgba(11,24,38,.94) 100%)}
  .hero-shot-in{padding:44px 20px 46px}
  .hero-shot h1{max-width:none}
  .hero-find{flex-direction:column;max-width:none}
  .hero-find .btn{width:100%}
}

/* hero fact chips — what Raitop itself brings, four at a glance */
/* this <ul> also carries .wrap, so it must keep the auto side margins that
   centre the container — margin:0 here would pin the whole band to the left */
.hero-facts-grid{list-style:none;margin:0 auto;display:grid;gap:10px;
  grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
.hero-facts-grid li{background:#fff;border:1px solid var(--line);border-radius:var(--r);
  padding:14px 16px}
.hero-facts-grid strong{display:block;color:var(--navy);font-size:.92rem;line-height:1.3;
  margin-bottom:.3em}
.hero-facts-grid span{display:block;color:var(--ink-2);font-size:.83rem;line-height:1.45}

.supply-facts{display:grid;gap:0;margin:0}
.supply-facts>div{display:flex;gap:14px;padding:8px 0;border-bottom:1px solid var(--line-2);font-size:.9rem}
.supply-facts>div:last-child{border-bottom:0}
.supply-facts dt{flex:0 0 40%;color:var(--ink-3)}
.supply-facts dd{margin:0;color:var(--ink)}

.doc-list{list-style:none;padding:0;margin:0 0 12px}
.doc-list li{padding:9px 0;border-bottom:1px solid var(--line-2);font-size:.9rem}
.doc-list li:last-child{border-bottom:0}

.qc-block{max-width:1100px;margin:14px auto 50px;padding:30px 0 0;
  border-top:1px solid var(--line)}
.qc-block h2{margin-bottom:.3em}
.qc-block h3{margin:26px 0 12px;font-size:1rem;color:var(--navy)}
.qc-block .lede{color:var(--ink-2);max-width:74ch}
.qc-card h4{font-size:1rem;margin:.2em 0 .5em;color:var(--navy)}

/* quality & compliance */
.qc-banner{display:block;margin:22px 0 8px}
.qc-banner img{width:100%;height:auto;border-radius:var(--r);border:1px solid var(--line)}
.qc-banner-note{font-size:.84rem;margin:0 0 20px}
.qc-notice p{margin:0 0 .6em}
.qc-notice p:last-child{margin-bottom:0}
.qc-group{padding:28px 0 0}
.qc-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(265px,1fr));gap:16px}
.qc-card{border:1px solid var(--line);border-radius:var(--r);background:#fff;padding:16px 18px;
  display:flex;flex-direction:column}
.qc-card h3{font-size:1rem;margin:.2em 0 .5em;color:var(--navy)}
.qc-thumb{display:block;margin:-4px 0 10px;background:var(--surface);border:1px solid var(--line-2);
  border-radius:6px;overflow:hidden}
.qc-thumb img{width:100%;height:auto;display:block}
.qc-facts{margin:0 0 12px}
.qc-facts>div{display:flex;gap:10px;padding:5px 0;border-bottom:1px solid var(--line-2);font-size:.85rem}
.qc-facts>div:last-child{border-bottom:0}
.qc-facts dt{flex:0 0 42%;color:var(--ink-3)}
.qc-facts dd{margin:0;color:var(--ink)}
.qc-card .btn{margin-top:auto;align-self:flex-start}
.pill{display:inline-block;padding:2px 9px;border-radius:999px;font-size:.78rem;
  font-weight:650;background:var(--surface);color:var(--ink-2);border:1px solid var(--line)}
.pill-active{background:#E4F3EC;color:#14653F}
.pill-expired{background:#FBE9E9;color:#8A2222}
.pill-under_review{background:#FFF4E0;color:#8A5B12}
.qc-home{padding-top:10px}
.qc-home-banner{display:block;border-radius:var(--r);overflow:hidden;border:1px solid var(--line)}
.qc-home-banner img{width:100%;height:auto;display:block}
.qc-home-banner:hover{border-color:var(--blue)}
.qc-home-cta{text-align:center;margin:18px 0 0}

.pager{display:flex;align-items:center;gap:14px;justify-content:center;margin:26px 0 0}

.datasheet-note{font-size:.8rem;margin:8px 0 0;line-height:1.45}

.done-note{border-top:1px solid var(--line);padding-top:14px;margin-top:18px;
  color:var(--ink-2);font-size:.92rem}

/* reference prices */
.price-panel .price-headline{font-size:1.35rem;font-weight:700;color:var(--navy);margin:0 0 .35em}
.price-table{margin:0}
.price-table thead th{background:var(--head-bg);color:var(--navy);font-size:.8rem;
  text-transform:uppercase;letter-spacing:.04em}
.price-table td{font-variant-numeric:tabular-nums;font-weight:650;color:var(--navy)}
.price-note{font-size:.85rem;color:var(--ink-2);border-left:3px solid var(--teal);
  padding-left:11px;margin:12px 0 0}
.price-checked{font-size:.8rem;margin:8px 0 0}

/* Applications: uniform image cards, text overlaid as real HTML */
.app-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:16px}
.app-card{position:relative;display:block;border-radius:var(--r);overflow:hidden;
  background:var(--navy);aspect-ratio:4/3;isolation:isolate}
.app-card img{width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .35s ease}
.app-card::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(11,24,38,0) 30%,rgba(11,24,38,.55) 62%,
             rgba(11,24,38,.90) 100%)}
.app-card:hover{text-decoration:none}
.app-card:hover img{transform:scale(1.04)}
.app-card:focus-visible{outline:3px solid var(--teal);outline-offset:2px}
.app-card-copy{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:18px 20px 20px;
  color:#fff}
.app-card-copy strong{display:block;font-size:1.12rem;line-height:1.25;margin-bottom:.35em}
.app-card-copy span{display:block;font-size:.86rem;line-height:1.5;color:#CFDDEC}
.app-scene-note{font-size:.8rem;margin:14px 0 0}

/* application page */
.app-hero{position:relative;background:var(--navy);overflow:hidden}
.app-hero-img{position:absolute;inset:0;display:block}
.app-hero-img img{width:100%;height:100%;object-fit:cover;object-position:62% 50%}
.app-hero::after{content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(11,24,38,.92) 0%,rgba(11,24,38,.74) 44%,
             rgba(11,24,38,.14) 76%,rgba(11,24,38,0) 100%)}
.app-hero-in{position:relative;z-index:2;padding:60px 20px 62px}
.app-hero h1{color:#fff;max-width:20ch;margin-bottom:.3em}
.app-hero .lede{color:#CFDDEC;max-width:56ch;margin:0}
.app-hero .eyebrow{font-size:.74rem;letter-spacing:.13em;text-transform:uppercase;
  color:#7FD3DC;font-weight:700;margin:0 0 .7em}
.app-body{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:38px;
  padding:26px 20px 52px;align-items:start}
.app-aside{border:1px solid var(--line);border-radius:var(--r);background:var(--surface);
  padding:18px 20px;position:sticky;top:18px}
.app-aside h2{font-size:.95rem;margin-bottom:.7em}
.app-cats{list-style:none;padding:0;margin:0 0 16px}
.app-cats a{display:flex;justify-content:space-between;gap:10px;padding:7px 0;
  border-bottom:1px solid var(--line-2);font-size:.88rem}
.app-cats em{font-style:normal;color:var(--ink-3);font-size:.8rem}
@media (max-width:980px){
  .app-body{grid-template-columns:1fr;gap:24px}
  .app-aside{position:static}
}
@media (max-width:700px){
  .app-card{aspect-ratio:16/9}
  .app-hero::after{background:linear-gradient(180deg,rgba(11,24,38,.70) 0%,
    rgba(11,24,38,.88) 60%,rgba(11,24,38,.94) 100%)}
  .app-hero-in{padding:38px 20px 40px}
  .app-hero h1{max-width:none}
}

/* solutions by industry */
.ind-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px}
.ind-card{border:1px solid var(--line);border-radius:var(--r);padding:18px 20px;background:var(--surface);
  display:flex;flex-direction:column}
a.ind-card:hover{border-color:var(--blue);text-decoration:none}
.ind-card h3{margin-bottom:.3em;font-size:1rem}
.ind-card p{font-size:.88rem;color:var(--ink-2);margin-bottom:.9em}
.ind-go{margin-top:auto;font-size:.8rem;color:var(--blue-d);font-weight:650}

/* why work with Raitop */
.why-list{list-style:none;counter-reset:why;margin:0;padding:0;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(198px,1fr));gap:16px 18px}
.why-list li{counter-increment:why;border-top:3px solid var(--teal);padding-top:14px}
.why-list h3{font-size:.98rem;margin-bottom:.35em;color:var(--navy)}
.why-list h3::before{content:counter(why) ". ";color:var(--teal);font-weight:800}
.why-list p{font-size:.89rem;color:var(--ink-2);margin:0}

/* two-column close: how we quote + the data / certification rules */
.two-col{display:grid;grid-template-columns:.85fr 1.15fr;gap:34px;align-items:start}
.how-box{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:20px 22px}
.how-box h2{font-size:1.06rem;margin-bottom:.7em}
.how-box ol{margin:0;padding-left:1.15em;font-size:.91rem;color:var(--ink-2)}
.how-box li{margin-bottom:.6em}
.how-box li strong{color:var(--navy)}
.how-box .muted{font-size:.85rem;margin:14px 0 0}
.two-col .prose h2{margin-top:0;font-size:1.06rem}
.two-col .prose p{font-size:.91rem}

/* ---------- sections ---------- */
.sec{padding:42px 0}
.sec-alt{background:var(--surface);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.sec-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:20px;flex-wrap:wrap}
.sec-head p{margin:0;color:var(--ink-3);font-size:.92rem}

/* ---------- cards ---------- */
.cat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:14px}
.cat-card{border:1px solid var(--line);border-radius:var(--r);padding:18px 20px;background:var(--surface);
  display:flex;flex-direction:column}
a.cat-card:hover{border-color:var(--blue);text-decoration:none}
.cat-card h3{margin-bottom:.3em}
.cat-card p{font-size:.88rem;color:var(--ink-2);margin-bottom:.8em}
.cat-card .count{margin-top:auto;font-size:.8rem;color:var(--blue-d);font-weight:650}

.prod-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(235px,1fr));gap:14px}
.prod-card{border:1px solid var(--line);border-radius:var(--r);background:var(--surface);overflow:hidden;
  display:flex;flex-direction:column}
.prod-card:hover{border-color:var(--blue)}
.prod-card .thumb{aspect-ratio:4/3;background:var(--surface);display:grid;place-items:center;padding:12px;
  border-bottom:1px solid var(--line-2)}
.prod-card .thumb img{max-height:100%;width:auto;object-fit:contain}
.prod-card .thumb.none{color:var(--ink-3);font-size:.8rem;background:var(--bg)}
.prod-body{padding:13px 15px 15px;display:flex;flex-direction:column;flex:1}
.prod-body .pn{font-family:var(--mono);font-size:.96rem;font-weight:700;color:var(--navy);letter-spacing:-.02em;margin:0}
.prod-body .pn a{color:inherit}
.prod-body .cat{font-size:.72rem;text-transform:uppercase;letter-spacing:.05em;color:var(--teal);
  margin:0 0 4px;font-weight:650}
.kv{list-style:none;padding:0;margin:10px 0 0;font-size:.83rem;color:var(--ink-2)}
.kv li{display:flex;justify-content:space-between;gap:10px;padding:4px 0;border-bottom:1px solid var(--line-2)}
.kv li:last-child{border-bottom:0}
.kv span:first-child{color:var(--ink-3)}
.kv span:last-child{font-weight:650;text-align:right;color:var(--ink)}
.prod-actions{margin-top:12px;display:flex;gap:8px}
.prod-actions .btn{flex:1;padding:7px 10px;font-size:.82rem}

/* ---------- filters / listings ---------- */
.layout{display:grid;grid-template-columns:252px 1fr;gap:26px;align-items:start;padding:28px 0 48px}
.filters{border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;background:var(--surface);
  position:sticky;top:148px}
.filters h2{font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;color:var(--teal);margin-bottom:12px}
.filters fieldset{border:0;padding:0;margin:0 0 15px}
.filters legend{font-size:.82rem;font-weight:650;color:var(--ink-2);padding:0;margin-bottom:6px}
.filters select,.filters input{width:100%;padding:8px 10px;border:1px solid var(--line);
  border-radius:var(--r);font-size:.87rem;font-family:inherit;background:#fff;color:var(--ink)}
.filters .row{display:flex;gap:8px}
.results-head{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-bottom:16px;flex-wrap:wrap}
.results-head .count{font-size:.9rem;color:var(--ink-3)}
.results-head select{padding:6px 9px;border:1px solid var(--line);border-radius:var(--r);
  font-family:inherit;font-size:.86rem;background:#fff;color:var(--ink)}

/* ---------- product page ---------- */
.pdp{display:grid;grid-template-columns:minmax(0,400px) minmax(0,1fr);gap:34px;
  padding:26px 0 24px;align-items:start}
.pdp-media{border:1px solid var(--line);border-radius:var(--r);background:var(--surface);padding:22px}
.pdp-media img{margin:0 auto;max-height:360px;width:auto;object-fit:contain}
.pdp-media .noimg{aspect-ratio:4/3;display:grid;place-items:center;color:var(--ink-3);font-size:.88rem;
  background:var(--bg);border-radius:var(--r)}
.pdp h1{font-family:var(--mono);letter-spacing:-.03em;margin-bottom:.15em;font-size:clamp(1.6rem,1.2rem + 1.4vw,2.1rem)}
.pdp .subtitle{font-size:1.02rem;color:var(--ink-2);margin-bottom:.9em}
.badges{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:16px}
.badge{font-size:.73rem;padding:3px 9px;border-radius:3px;background:var(--blue-l);color:var(--blue-d);
  font-weight:650;letter-spacing:.01em}
.badge-grey{background:var(--head-bg);color:var(--ink-2)}
.badge-teal{background:var(--teal-l);color:#05666f}
.at-glance{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 20px}
.at-glance div{flex:1 1 130px;background:var(--surface);padding:11px 13px;border:1px solid var(--line);
  border-radius:var(--r)}
.at-glance dt{font-size:.71rem;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-3)}
.at-glance dd{margin:3px 0 0;font-size:.98rem;font-weight:700;color:var(--navy)}
.buybox{border:1px solid var(--line);border-left:3px solid var(--blue);border-radius:var(--r);
  padding:17px 19px;background:var(--surface);margin-bottom:20px}
.buybox p{font-size:.9rem;color:var(--ink-2);margin-bottom:13px}
.buybox p strong{color:var(--navy)}
.buybox .row{display:flex;gap:10px;flex-wrap:wrap}
.buybox .row>*{flex:1 1 160px}
table.spec{width:100%;border-collapse:collapse;font-size:.9rem;background:var(--surface)}
table.spec th,table.spec td{text-align:left;padding:9px 13px;border-bottom:1px solid var(--line-2);vertical-align:top}
table.spec th{width:46%;font-weight:600;color:var(--ink-2);background:var(--head-bg);
  border-right:1px solid var(--line-2)}
table.spec td{font-weight:650;color:var(--navy);font-variant-numeric:tabular-nums}
table.spec tr:last-child th,table.spec tr:last-child td{border-bottom:0}
.tablewrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r);background:var(--surface)}
.panel{border:1px solid var(--line);border-radius:var(--r);padding:19px 21px;margin-bottom:18px;background:var(--surface)}
.panel h2{font-size:1.08rem}
.sources{font-size:.82rem;color:var(--ink-3)}
.sources table{width:100%;border-collapse:collapse}
.sources td,.sources th{padding:6px 8px;border-bottom:1px solid var(--line-2);text-align:left;vertical-align:top}
.sources a{word-break:break-all}
/* mobile quote bar: the enquiry route stays one tap away on a phone */
.quote-bar{display:none}

/* ---------- forms ---------- */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}
.field{display:flex;flex-direction:column;gap:5px;margin-bottom:4px}
.field.full{grid-column:1/-1}
.field label{font-size:.86rem;font-weight:650;color:var(--ink-2)}
.field .hint{font-size:.78rem;color:var(--ink-3);font-weight:400}
.field input,.field select,.field textarea{padding:10px 12px;border:1px solid var(--line);
  border-radius:var(--r);font-size:.94rem;font-family:inherit;background:#fff;color:var(--ink);width:100%}
.field textarea{min-height:112px;resize:vertical}
.field .err{color:var(--err);font-size:.8rem}
.field input[aria-invalid="true"],.field select[aria-invalid="true"]{border-color:var(--err);background:var(--err-bg)}
.alert{padding:12px 16px;border-radius:var(--r);margin-bottom:18px;font-size:.9rem}
.alert-err{background:var(--err-bg);color:var(--err);border:1px solid var(--err-line)}
.alert-ok{background:var(--ok-bg);color:var(--ok);border:1px solid var(--ok-line)}
.alert-warn{background:var(--warn-bg);color:var(--warn-ink);border:1px solid var(--warn-line)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.items-table{width:100%;border-collapse:collapse;margin-bottom:10px}
.items-table th{text-align:left;font-size:.76rem;text-transform:uppercase;letter-spacing:.04em;
  color:var(--ink-3);padding:0 8px 6px 0;font-weight:650}
.items-table td{padding:0 8px 8px 0;vertical-align:top}
.items-table td:last-child,.items-table th:last-child{padding-right:0;width:42px}
.items-table th:first-child,.items-table td:first-child{width:56%}
.items-table input{width:100%}
.rm{background:#fff;border:1px solid var(--line);border-radius:var(--r);width:36px;height:40px;
  cursor:pointer;color:var(--ink-3);font-size:1.1rem;line-height:1}
.rm:hover{border-color:var(--err);color:var(--err)}

/* ---------- CTA + footer ---------- */
.cta-strip{background:var(--navy);color:#fff;padding:34px 0;border-top:3px solid var(--teal)}
.cta-inner{display:grid;grid-template-columns:1.6fr 1fr;gap:28px;align-items:center}
.cta-strip h2{color:#fff;margin-bottom:.3em}
.cta-strip p{color:#C7D4E4;font-size:.93rem;margin:0;max-width:64ch}
.cta-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.cta-actions .btn-ghost{background:transparent;color:#fff!important;border-color:#3C5372}
.cta-actions .btn-ghost:hover{background:#22405F;border-color:#5A7595}
.site-foot{background:#0F1E30;color:#A7B8CC;padding:40px 0 18px;font-size:.87rem}
.foot-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:28px}
.site-foot h3{color:#fff;font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;margin-bottom:10px}
.site-foot ul{list-style:none;padding:0;margin:0}
.site-foot li{margin-bottom:6px}
.site-foot a{color:#CBD8E6}
.site-foot .muted{color:#7D8FA5;font-size:.81rem}
.foot-logo{height:52px;width:auto;margin-bottom:14px}
.foot-brand{color:#fff;margin-bottom:.5em}
.foot-legal{border-top:1px solid #1E3247;margin-top:28px;padding-top:15px}
.foot-legal p{color:#74869C;font-size:.78rem;margin:0}

/* ---------- misc ---------- */
.empty{text-align:center;padding:46px 20px;color:var(--ink-3);border:1px dashed var(--line);
  border-radius:var(--r);background:var(--surface)}
.prose{max-width:74ch}
.prose h2{margin-top:1.6em}
.prose h3{margin-top:1.4em}
.prose table{width:100%;border-collapse:collapse;font-size:.9rem;margin:1em 0;background:var(--surface)}
.prose th,.prose td{border:1px solid var(--line);padding:8px 11px;text-align:left}
.prose th{background:var(--head-bg);color:var(--navy)}
.article-list{list-style:none;padding:0;display:grid;gap:12px}
.article-list li{border:1px solid var(--line);border-radius:var(--r);padding:17px 19px;background:var(--surface)}
.article-list h3{margin-bottom:.25em}
.article-list p{margin:0;font-size:.89rem;color:var(--ink-2)}

@media (max-width:980px){
  .hero-inner{grid-template-columns:1fr;gap:24px;padding:32px 0}
  .hero-facts-grid{grid-template-columns:1fr 1fr}
  .two-col{grid-template-columns:1fr;gap:26px}
  .layout{grid-template-columns:1fr;gap:18px}
  .filters{position:static}
  .pdp{grid-template-columns:1fr;gap:22px}
  .cta-inner{grid-template-columns:1fr}
  .cta-actions{justify-content:flex-start}
  .foot-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:860px){
  .brand img{height:32px}
  .head-search input{font-size:16px}          /* iOS must not zoom on focus */
}
@media (max-width:720px){
  .hero-facts-grid{grid-template-columns:1fr}
  .why-list{gap:18px}
  .nav-toggle{display:block}
  .head-cta{display:none}
  .head-inner{flex-wrap:wrap;min-height:58px;gap:10px;padding-top:8px;padding-bottom:8px}
  .head-search{order:3;flex:1 1 100%}
  .cat-bar{display:none}
  .cat-bar.open{display:block}
  .cat-bar-in{flex-direction:column;padding-bottom:10px}
  .cat-bar-in > li{display:block}
  .cat-bar a{padding:11px 0;border-bottom:1px solid var(--line-2);border-left:2px solid transparent}
  .cat-bar a:hover{border-bottom-color:var(--line-2)}
  .cat-bar-in > li:first-child > a{padding-left:0}
  /* A touch screen has no hover, and 14 categories would push About and Contact
     off the screen, so here the list is collapsed behind the Products row and the
     chevron button does the opening. Without JavaScript the Products link itself
     still reaches every category on the products page. */
  .menu-toggle{display:block;margin-left:auto;padding:11px 4px}
  .cat-bar-in > li.has-menu{display:flex;align-items:center;
    border-bottom:1px solid var(--line-2)}
  .cat-bar-in > li.has-menu > a.top{border-bottom:0;flex:1 1 auto}
  .submenu{display:none;position:static;border:0;box-shadow:none;background:transparent;
    flex:1 1 100%}
  .has-menu.open .submenu{display:block}
  .has-menu:hover .submenu,.has-menu:focus-within .submenu{display:none}
  .has-menu.open:hover .submenu,.has-menu.open:focus-within .submenu{display:block}
  .submenu-in{padding:0 0 6px}
  .submenu-head{display:none}
  .submenu-grid{grid-template-columns:1fr;gap:0}
  .submenu-grid a{padding:9px 0 9px 16px;font-size:.87rem;color:var(--ink-2)}
  .submenu-all{margin:0}
  .submenu-all a{padding:9px 0 9px 16px}
  .only-mobile,.cat-bar-in > li.only-mobile{display:block}
  .only-mobile a{font-weight:650;color:var(--blue-d)}
  .util-in{font-size:.76rem;gap:10px}
  .langs{margin-left:auto}
  .form-grid{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr}
  .items-table thead{display:none}
  .items-table tr{display:grid;grid-template-columns:1fr 92px 42px;gap:8px;margin-bottom:10px}
  .items-table td{padding:0}
  .items-table td.note-cell{grid-column:1/-1}
  /* phone: part number, specs and the quote button first */
  .pdp{padding-top:18px}
  .pdp-media{order:2}
  .pdp>div:last-child{order:1}
  .at-glance div{flex:1 1 calc(50% - 8px)}
  table.spec th{width:52%}
  .quote-bar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:50;gap:8px;
    padding:9px 12px calc(9px + env(safe-area-inset-bottom));background:var(--surface);
    border-top:1px solid var(--line)}
  .quote-bar .pn{flex:1;min-width:0;font-family:var(--mono);font-size:.82rem;font-weight:700;
    color:var(--navy);align-self:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .quote-bar .btn{flex:0 0 auto}
  body.has-quote-bar{padding-bottom:62px}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ---- WhatsApp -------------------------------------------------------------
   The mark belongs to Meta and is used only to label a link that opens
   WhatsApp, at its official green and without alteration. It is served from
   this site, so no request ever leaves the page. */
.wa-inline{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.wa-inline img{display:block;flex:none}
.btn-wa{display:inline-flex;align-items:center;gap:8px;
        background:#25D366!important;color:#06301A!important;border-color:#25D366!important;
        font-weight:600}
.btn-wa:hover{background:#1FBE5B!important;border-color:#1FBE5B!important}
.btn-wa img{display:block;flex:none}

.wa-float{position:fixed;right:18px;bottom:18px;z-index:60;
          display:inline-flex;align-items:center;gap:10px;
          padding:10px 16px 10px 12px;border-radius:999px;
          background:#25D366;color:#06301A;font-weight:600;font-size:.94rem;
          text-decoration:none;box-shadow:0 6px 22px rgba(4,26,14,.28);
          transition:background .15s,box-shadow .15s,transform .15s}
.wa-float:hover{background:#1FBE5B;color:#06301A;transform:translateY(-1px);
                box-shadow:0 10px 26px rgba(4,26,14,.34)}
.wa-float img{display:block;flex:none}

@media (max-width:760px){
  /* On a phone the number is redundant next to the mark, and a full-width pill
     would sit on top of the page content. */
  .wa-float{right:14px;bottom:14px;padding:12px;gap:0}
  .wa-float .wa-float-txt{display:none}
  .btn-wa span{font-size:.9rem}
}
@media print{.wa-float{display:none}}

/* ---- series ---------------------------------------------------------- */
.series-head{padding:26px 0 8px}
.series-head .eyebrow{color:var(--teal);font-size:.8rem;font-weight:600;
  letter-spacing:.06em;text-transform:uppercase;margin:0 0 6px}
.series-head h1{margin:0 0 8px}
.series-actions{display:flex;gap:10px;flex-wrap:wrap;margin:16px 0 0}
/* Individually bordered chips rather than a grid: a part-full last row would
   otherwise leave a stripe of bare grid-gap colour. */
.facts-row{list-style:none;margin:18px 0 26px;padding:0;display:flex;
  flex-wrap:wrap;gap:10px}
.facts-row li{background:var(--surface);border:1px solid var(--line);
  border-radius:8px;padding:10px 14px;display:flex;flex-direction:column;
  gap:3px;min-width:150px;flex:1 1 auto}
.facts-row .k{font-size:.76rem;color:var(--ink-2);text-transform:uppercase;
  letter-spacing:.04em}
.facts-row .v{font-weight:600;color:var(--ink)}
.series-prose{max-width:74ch;margin:22px 0}
.series-cta{margin:26px 0 40px}
.series-grid{display:grid;gap:12px;margin:22px 0 40px;
  grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
.series-card{display:flex;flex-direction:column;gap:4px;padding:14px 16px;
  border:1px solid var(--line);border-radius:8px;background:var(--surface);
  text-decoration:none;color:inherit;transition:border-color .14s,box-shadow .14s}
.series-card:hover{border-color:var(--blue);box-shadow:0 2px 10px rgba(20,40,63,.08)}
.series-card .name{font-weight:650;color:var(--blue-d)}
.series-card .sum{font-size:.85rem;color:var(--ink-2);line-height:1.45}

.series-nav{display:flex;justify-content:space-between;align-items:center;
  gap:12px;flex-wrap:wrap;margin:0 0 16px;padding:9px 13px;
  border:1px solid var(--line);border-radius:8px;background:var(--bg);
  font-size:.9rem}
.series-nav .steps{display:flex;gap:14px;flex-wrap:wrap}

/* ---- comparison ------------------------------------------------------- */
/* Wide tables scroll inside their own box; the page body never scrolls
   sideways, which is what breaks a phone layout. */
.tablewrap-x{overflow-x:auto;-webkit-overflow-scrolling:touch}
.cmp-table{width:100%;border-collapse:collapse;font-size:.88rem;min-width:720px}
.cmp-table th,.cmp-table td{border:1px solid var(--line);padding:8px 11px;
  text-align:left;vertical-align:top}
.cmp-table thead th{background:var(--bg);font-size:.8rem;
  text-transform:uppercase;letter-spacing:.03em;color:var(--ink-2);
  position:sticky;top:0;z-index:1}
.cmp-table tbody th{font-weight:600}
.cmp-fixed thead th{text-align:center;min-width:170px}
.cmp-fixed thead th img{display:block;margin:0 auto 6px;height:auto;max-width:120px}
.cmp-fixed thead th a{display:block}
.cmp-fixed thead th .muted{display:block;font-size:.78rem;font-weight:400}
.cmp-rowhead{background:var(--bg);white-space:nowrap;position:sticky;left:0;z-index:2}
.cmp-table tr.differs td{background:#FFFBEA}
.cmp-drop{font-size:.78rem;font-weight:400;text-transform:none;letter-spacing:0}
.cmp-tools{display:flex;gap:10px;flex-wrap:wrap;margin:18px 0}
.series-table tbody th{white-space:nowrap}

.cmp-tray{position:fixed;left:50%;transform:translateX(-50%);bottom:18px;
  z-index:55;display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  max-width:min(94vw,780px);padding:10px 16px;border-radius:999px;
  background:var(--navy);color:#E6EDF6;font-size:.88rem;
  box-shadow:0 8px 26px rgba(8,20,36,.32)}
.cmp-tray[hidden]{display:none}
.cmp-tray .cmp-lbl{color:#9FB4CC}
.cmp-tray .cmp-names{font-weight:600;overflow:hidden;text-overflow:ellipsis;
  white-space:nowrap;max-width:44ch}
.cmp-tray .btn-ghost{background:transparent;color:#DCE6F2!important;
  border-color:#3C5372}
.cmp-add.is-on{background:var(--blue-l);border-color:var(--blue);
  color:var(--blue-d)!important}
.row-tools{margin-top:10px;gap:8px}
.is-copied{background:var(--blue-l)!important;border-color:var(--blue)!important}
.notice-warn{background:#FFF7E6;border:1px solid #F0D9A8;border-radius:8px;
  padding:10px 14px;margin:14px 0}
.small{font-size:.85rem}

@media (max-width:760px){
  /* The tray and the WhatsApp button share the bottom edge: stack them. */
  .cmp-tray{left:10px;right:10px;transform:none;max-width:none;bottom:76px;
    border-radius:12px;justify-content:space-between}
  .cmp-tray .cmp-names{max-width:100%;white-space:normal}
  .facts-row li{min-width:120px}
  .series-nav{font-size:.85rem}
}

/* ---- home: six category cards with a real photograph ------------------- */
.cat-grid-6{grid-template-columns:repeat(auto-fit,minmax(290px,1fr))}
.cat-card-shot{display:flex;gap:14px;align-items:flex-start;padding:14px 16px}
.cat-shot{flex:none;width:92px;height:70px;display:flex;align-items:center;
  justify-content:center;background:#fff;border:1px solid var(--line);
  border-radius:6px;overflow:hidden}
.cat-shot img{max-width:100%;max-height:100%;width:auto;height:auto;
  object-fit:contain;display:block}
.cat-body{display:flex;flex-direction:column;gap:4px;min-width:0}
.cat-body strong{color:var(--blue-d);font-size:1rem;line-height:1.3}
/* Three lines maximum, whatever the language: a long tagline must not make one
   card taller than its neighbours. */
.cat-body .use{color:var(--ink-2);font-size:.87rem;line-height:1.45;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;
  line-clamp:3;overflow:hidden}
.cat-body .count{color:var(--blue);font-size:.83rem;font-weight:600;margin-top:2px}

/* ---- home: capability band ------------------------------------------- */
.cap-grid{list-style:none;margin:0 0 26px;padding:0;display:grid;gap:12px;
  grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
.cap-grid li{background:var(--surface);border:1px solid var(--line);
  border-radius:8px;padding:13px 16px;display:flex;flex-direction:column;gap:5px}
.cap-grid strong{color:var(--blue-d)}
.cap-grid span{color:var(--ink-2);font-size:.88rem;line-height:1.5}
.how-box-wide{max-width:76ch}

@media (max-width:640px){
  .cat-card-shot{gap:11px;padding:12px 13px}
  .cat-shot{width:74px;height:58px}
}
.prod-card .brand{margin:-4px 0 6px;font-size:.78rem;color:var(--ink-2);
  letter-spacing:.02em}
/* A quiet text control, so the two real calls to action keep their weight. */
.cmp-link{background:none;border:0;padding:6px 0 0;margin:0;cursor:pointer;
  font:inherit;font-size:.82rem;color:var(--blue);text-align:left}
.cmp-link:hover{text-decoration:underline}
.cmp-link.is-on{font-weight:650;color:var(--teal)}

/* ---- company facts ---------------------------------------------------- */
.biz-block{max-width:76ch;margin:34px 0 0}
.biz-block h2{margin:28px 0 10px}
.biz-facts{margin:0;display:grid;gap:1px;background:var(--line);
  border:1px solid var(--line);border-radius:8px;overflow:hidden}
.biz-facts>div{background:var(--surface);display:grid;
  grid-template-columns:minmax(150px,13em) 1fr;gap:12px;padding:10px 14px}
.biz-facts dt{color:var(--ink-2);font-size:.88rem}
.biz-facts dd{margin:0;line-height:1.55}
.biz-shots{display:grid;gap:14px;margin:20px 0;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.biz-shots figure{margin:0}
.biz-shots img{width:100%;height:auto;border-radius:8px;border:1px solid var(--line)}
.biz-shots figcaption{font-size:.82rem;color:var(--ink-2);margin-top:5px}
@media (max-width:620px){
  .biz-facts>div{grid-template-columns:1fr;gap:2px}
  .biz-facts dt{font-weight:600}
}

/* ---- results bar, chips, mobile filter drawer ------------------------- */
.results-bar{display:flex;align-items:center;justify-content:space-between;
  gap:14px;flex-wrap:wrap;padding:4px 0 12px}
.results-bar .count{font-weight:650;color:var(--ink)}
.sortbox{margin:0}
.sortbox select{padding:5px 9px;font-size:.87rem}
.pagecount{margin:-6px 0 10px;font-size:.85rem}
.chips{display:flex;flex-wrap:wrap;gap:7px;align-items:center;margin:0 0 14px}
.chip{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;
  border:1px solid var(--line);border-radius:999px;background:var(--surface);
  font-size:.82rem;text-decoration:none;color:var(--ink)}
.chip:hover{border-color:var(--blue);color:var(--blue-d)}
.chip-clear{background:var(--blue-l);border-color:var(--blue);color:var(--blue-d)}
.filter-toggle{display:none}

@media (max-width:900px){
  /* On a phone the filter column becomes a drawer opened by one button, so the
     results are the first thing on screen rather than twelve select boxes. */
  .filter-toggle{display:inline-block;margin:0 0 12px;width:100%}
  .layout > .filters{display:none}
  .layout > .filters.is-open{display:block;margin-bottom:16px}
  .results-bar{padding-top:0}
}
.app-send{margin:0 0 18px;padding-left:20px;color:var(--ink-2);font-size:.9rem;
  line-height:1.6}
.app-send li{margin:0 0 6px}
.app-parts{padding:10px 0 46px}
.app-parts h2{margin:0 0 6px}
.byline{color:var(--ink-2);font-size:.86rem;margin:-6px 0 16px}
.audience{background:var(--bg);border-left:3px solid var(--teal);
  padding:10px 14px;margin:0 0 20px;font-size:.93rem}
.link-list{list-style:none;margin:0;padding:0}
.link-list li{padding:7px 0;border-bottom:1px solid var(--line)}
.link-list .muted{font-size:.82rem;margin-left:6px}
.cat-series{margin:18px 0 6px}
.cat-series h2{font-size:1.05rem;margin:0 0 9px}
.series-chips{list-style:none;display:flex;flex-wrap:wrap;gap:7px;margin:0;padding:0}
.series-chips a{display:inline-flex;align-items:center;gap:6px;padding:4px 11px;
  border:1px solid var(--line);border-radius:999px;background:var(--surface);
  font-size:.84rem;text-decoration:none;color:var(--blue-d)}
.series-chips a:hover{border-color:var(--blue);background:var(--blue-l)}
.series-chips em{font-style:normal;color:var(--ink-2);font-size:.78rem}
.submenu-all{display:flex;gap:18px;flex-wrap:wrap}