/* Bearing SEO Pages — mobile-first, builds on bbf.css. Two-column layout
   with a sticky left sidebar (TOC + recommended), mirroring the product page. */

.bsp-page{max-width:1180px;margin:0 auto;padding:0 16px}
.bsp-layout{display:grid;grid-template-columns:260px 1fr;gap:32px;margin-top:14px;align-items:start}
/* Offset from the site's fixed header + sticky sub-nav rather than a
   hardcoded figure, so this panel is never parked underneath them. */
.bsp-side{position:sticky;top:calc(var(--ehw-chrome-h, 120px) + 16px);max-height:calc(100vh - var(--ehw-chrome-h, 120px) - 32px);overflow-y:auto;overscroll-behavior:contain;display:flex;flex-direction:column;gap:18px;font-size:13.5px}
.bsp-side-title{margin:0 0 6px;font-size:12px;font-weight:700;color:var(--bbf-muted);text-transform:uppercase;letter-spacing:.5px}
.bsp-toc,.bsp-side-panel{background:#fff;border:1px solid var(--bbf-line);border-radius:6px;padding:12px 14px;box-shadow:0 1px 2px rgba(0,15,34,.06)}
.bsp-toc-list,.bsp-side-list{list-style:none;margin:0;padding:0;line-height:1.85}
.bsp-toc-list a,.bsp-side-list a{color:var(--bbf-primary);text-decoration:none;font-weight:600;display:block;border-radius:4px;padding:3px 8px;margin:0 -8px}
.bsp-toc-list a:hover,.bsp-side-list a:hover{background:var(--bbf-bg);text-decoration:none}
.bsp-side-list{font-weight:500;line-height:1.6}
.bsp-side-list li{padding:3px 0;border-bottom:1px dashed var(--bbf-line)}
.bsp-side-list li:last-child{border-bottom:0}
.bsp-side-list a{font-weight:500;padding:2px 6px;margin:0 -6px;font-size:13px}

.bsp-main{min-width:0}
.bsp-head{margin:6px 0 18px}
.bsp-body{margin-bottom:24px}
.bsp-body h2{margin-top:28px;font-size:22px;color:var(--bbf-primary)}
.bsp-body h3{margin-top:18px;font-size:17px}
.bsp-body p{line-height:1.65}
.bsp-body table.bbf-spec-table th[scope=row]{background:var(--bbf-bg);text-align:left;white-space:normal;width:38%}
.bsp-note{font-size:13px;color:var(--bbf-muted);font-style:italic;margin-top:8px;padding:8px 12px;background:var(--bbf-bg);border-left:3px solid var(--bbf-line);border-radius:4px}

.bsp-quote{margin:28px 0;padding:20px 24px;background:linear-gradient(180deg,#f8f9fa,#fff);border:1px solid var(--bbf-primary);border-radius:6px}
.bsp-quote h2{margin-top:0;color:var(--bbf-primary)}
.bsp-quote-help{margin:0 0 14px;font-size:14px;color:var(--bbf-muted);line-height:1.55}
.bsp-spec-table{margin:24px 0}
.bsp-spec-table h2{margin-top:0}

.bsp-links{margin-top:30px;padding-top:20px;border-top:1px solid var(--bbf-line)}
.bsp-links h3{font-size:15px;margin:16px 0 6px}
.bsp-parent{font-weight:600}
.bsp-links .bbf-related-links{columns:2;column-gap:28px;list-style:disc;padding-left:20px}

.bbf-faq-item.is-generic summary{color:var(--bbf-muted);font-weight:500}

@media(max-width:980px){
  .bsp-layout{grid-template-columns:1fr;gap:18px}
  .bsp-side{position:static;flex-direction:row;flex-wrap:wrap;gap:10px}
  .bsp-side > *{flex:1 1 220px}
  .bsp-side-title{font-size:11px}
}
@media(max-width:600px){
  .bsp-page{padding:0 12px}
  .bsp-links .bbf-related-links{columns:1}
  .bsp-body h2{font-size:19px}
  .bsp-quote{padding:16px 18px}
}

/* ═══════════════════════════════════════════════════════════════════════
   Specification summary — answer-first block (1.7.0)
   Sits under the H1, above the drawing. Deliberately understated: a heavy
   coloured panel reads as an advert and gets skipped by engineers scanning
   for a number.
   ═══════════════════════════════════════════════════════════════════════ */
.bsp-subhead {
    margin: .35rem 0 0;
    color: #5b5f64;
    font-size: .9375rem;
    line-height: 1.55;
}
.bsp-answer {
    border-left: 3px solid #345076;
    padding: 0 0 0 1.15rem;
    margin: 1.4rem 0 2rem;
}
.bsp-answer-lead {
    font-size: 1.0625rem;
    line-height: 1.65;
    color: #191c1d;
    margin: 0 0 1rem;
}
.bsp-answer-points {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: .55rem 1.5rem;
    margin: 0 0 .9rem;
}
.bsp-answer-point dt {
    font-size: .72rem;
    text-transform: uppercase;
    letter-spacing: .045em;
    color: #5b5f64;
    font-weight: 600;
    margin: 0 0 .1rem;
}
.bsp-answer-point dd {
    margin: 0;
    font-size: 1rem;
    color: #191c1d;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}
.bsp-answer-note {
    font-size: .8125rem;
    line-height: 1.5;
    color: #5b5f64;
    margin: 0;
}
@media (max-width: 640px) {
    .bsp-answer { padding-left: .9rem; }
    .bsp-answer-lead { font-size: 1rem; }
}

/* ── Precision Industrial System alignment ─────────────────────────────── */
.bsp-head h1,.bsp-head .bsp-title{font-size:clamp(32px,4.6vw,48px);font-weight:700;
  letter-spacing:-.02em;line-height:1.16}
.bsp-subhead{font-size:18px;line-height:28px;color:#43474d}
.bsp-body{font-size:16px;line-height:24px;color:#43474d}
.bsp-parent,.bsp-side-title{font-size:12px;font-weight:700;letter-spacing:.1em;
  text-transform:uppercase;color:#43474d}
.bsp-toc,.bsp-quote,.bsp-side,.bsp-note{border-radius:4px;border:1px solid #D1D5DB;box-shadow:none}
.bsp-quote{background:#f3f4f5}
.bsp-spec-table{width:100%;border-collapse:collapse;border:1px solid #D1D5DB;font-size:14px}
.bsp-spec-table th{background:#e1e3e4;color:#191c1d;font-size:12px;font-weight:700;
  letter-spacing:.1em;text-transform:uppercase;text-align:left;padding:12px;border-bottom:1px solid #c4c6ce}
.bsp-spec-table td{padding:12px;border-bottom:1px solid #D1D5DB}
.bsp-spec-table tbody tr:nth-child(even){background:#f8f9fa}
.bsp-answer-lead{font-size:18px;line-height:28px}
.bbf-faq-item{border-radius:4px;border:1px solid #D1D5DB}

/* ── Collapsible Materials & Grades branch in the contents ─────────────────
   Mirrors the product-page treatment. The module renders a panel per material
   class, so the branch is collapsed by default and the sidebar stays short. */
.bsp-toc-list .is-branch{position:relative;padding-left:18px}
.bsp-toc-list .is-branch>a{display:inline-block}
.bsp-toc-list .bbf-toc-twist{position:absolute;left:0;top:3px;width:16px;height:16px;
  padding:0;border:0;background:none;cursor:pointer;color:#5b5f64;line-height:1}
.bsp-toc-list .bbf-toc-twist::before{content:"";display:block;width:6px;height:6px;
  margin:4px 0 0 3px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;
  transform:rotate(-45deg);transition:transform .15s}
.bsp-toc-list .bbf-toc-twist[aria-expanded="true"]::before{transform:rotate(45deg);margin-top:2px}
.bsp-toc-list .bbf-toc-twist:hover{color:#345076}
.bsp-toc-list .bbf-toc-sub{list-style:none;margin:4px 0;padding:0 0 0 4px;
  border-left:1px solid #D1D5DB}
.bsp-toc-list .bbf-toc-sub[hidden]{display:none}
.bsp-toc-list .bbf-toc-sub a{font-size:12px;line-height:16px;color:#5b5f64}
.bsp-toc-list .bbf-toc-sub a:hover{color:#345076}

/* Contradictory-combination notice (class-bsp-content.php). The page stays
   live for the links pointing at it, but the reader is told plainly that the
   part does not exist — so the notice has to read as a caution, not as body
   copy it could be mistaken for. */
.bsp-notice{
  margin:0 0 22px;padding:14px 16px;
  border:1px solid #e6c98a;border-left:4px solid #C68119;
  border-radius:4px;background:#fdf8ef;
}
.bsp-notice p{margin:0;color:#6b4a08;font-size:14.5px;line-height:1.55}
.bsp-notice p+p{margin-top:8px}