/* ============================================================
   Sorbe single article (.sbar) — clean white, readable B2B layout.
   Scoped entirely under .sbar so nothing else on the site is affected.
============================================================ */
.sbar{
  --ink:#16161b; --body:#222222; --muted:#5d5d66; --line:#e4e4df; --soft:#f4f4f2;
  --red:#e01f26; --red-600:#b81920; --char:#2c2e33;
  --display:"Saira Condensed",Arial,sans-serif;
  --text:"IBM Plex Sans",system-ui,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,monospace;
  --maxw:1280px;
  background:#fff; color:var(--body); font-family:var(--text); -webkit-font-smoothing:antialiased;
}
.sbar *,.sbar *::before,.sbar *::after{ box-sizing:border-box; }
.sbar-wrap{ max-width:var(--maxw); margin:0 auto; padding:0 clamp(20px,4vw,48px); }

/* breadcrumbs */
.sbar-crumbs{ padding-top:clamp(22px,4vh,34px); }
.sbar-crumbs .sbar-wrap{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; font-family:var(--mono); font-size:12px; letter-spacing:.04em; text-transform:uppercase; color:var(--muted); }
.sbar-crumbs a{ color:var(--muted); text-decoration:none; transition:color .16s; }
.sbar-crumbs a:hover{ color:var(--red); }
.sbar-sep{ color:#c7c7c2; }
.sbar-crumbs__current{ color:var(--ink); }

/* header */
.sbar-header{ padding:clamp(18px,3vh,26px) 0 clamp(20px,4vh,30px); }
.sbar-cat{ display:inline-block; font-family:var(--mono); font-size:11.5px; letter-spacing:.08em; text-transform:uppercase; font-weight:600; color:var(--red); text-decoration:none; margin-bottom:14px; }
.sbar-title{ font-family:var(--display); font-weight:800; text-transform:uppercase; font-size:clamp(32px,5vw,60px); line-height:.98; color:var(--ink); margin:0 0 16px; max-width:18ch; }
.sbar-meta{ display:flex; flex-wrap:wrap; align-items:center; gap:9px; font-family:var(--mono); font-size:12.5px; letter-spacing:.03em; color:var(--muted); text-transform:uppercase; }
.sbar-meta__by{ color:var(--ink); }
.sbar-dot{ color:#c7c7c2; }

/* featured image */
.sbar-hero{ max-width:var(--maxw); margin:0 auto clamp(28px,5vh,48px); padding:0 clamp(20px,4vw,48px); }
.sbar-hero__img,.sbar-hero img{ width:100%; height:auto; display:block; border-radius:12px; object-fit:cover; max-height:560px; }

/* layout: content + sidebar */
.sbar-layout{ display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:clamp(32px,5vw,68px); align-items:start; padding-bottom:clamp(40px,7vh,72px); }
.sbar-content{ max-width:760px; }

/* ---- content typography (Gutenberg blocks) ---- */
.sbar-content > *{ margin:0 0 1.25em; }
.sbar-content p{ font-size:18px; line-height:1.8; color:var(--body); }
.sbar-content h2{ font-family:var(--display); font-weight:800; text-transform:uppercase; font-size:clamp(26px,3vw,38px); line-height:1.05; color:var(--ink); margin:1.6em 0 .55em; }
.sbar-content h3{ font-family:var(--display); font-weight:700; text-transform:uppercase; font-size:clamp(21px,2.2vw,28px); line-height:1.1; color:var(--ink); margin:1.4em 0 .5em; }
.sbar-content h4{ font-family:var(--text); font-weight:700; font-size:19px; color:var(--ink); margin:1.3em 0 .5em; }
.sbar-content a{ color:var(--red); text-decoration:underline; text-underline-offset:2px; }
.sbar-content a:hover{ color:var(--red-600); }
.sbar-content ul,.sbar-content ol{ padding-left:1.4em; }
.sbar-content li{ font-size:18px; line-height:1.8; color:var(--body); margin-bottom:.5em; }
.sbar-content ul li{ list-style:disc; }
.sbar-content ol li{ list-style:decimal; }
.sbar-content blockquote{ margin:1.6em 0; padding:8px 0 8px 24px; border-left:4px solid var(--red); font-size:21px; line-height:1.6; font-style:italic; color:var(--ink); }
.sbar-content blockquote cite{ display:block; margin-top:10px; font-size:14px; font-style:normal; color:var(--muted); font-family:var(--mono); }
.sbar-content img,.sbar-content figure img{ max-width:100%; height:auto; border-radius:10px; display:block; }
.sbar-content figure{ margin:1.6em 0; }
.sbar-content figcaption{ font-size:13px; color:var(--muted); margin-top:8px; text-align:center; }
.sbar-content table{ width:100%; border-collapse:collapse; margin:1.6em 0; font-size:15px; }
.sbar-content th,.sbar-content td{ border:1px solid var(--line); padding:11px 14px; text-align:left; vertical-align:top; }
.sbar-content thead th,.sbar-content table th{ background:var(--soft); font-family:var(--mono); font-size:12.5px; letter-spacing:.04em; text-transform:uppercase; color:var(--ink); }
.sbar-content tbody tr:nth-child(even){ background:#fafafa; }
.sbar-content pre{ background:#1f2125; color:#f3f3f1; padding:18px 20px; border-radius:10px; overflow:auto; font-family:var(--mono); font-size:14px; line-height:1.6; }
.sbar-content code{ font-family:var(--mono); font-size:.92em; background:var(--soft); padding:2px 6px; border-radius:4px; }
.sbar-content pre code{ background:none; padding:0; }
.sbar-content hr{ border:none; border-top:1px solid var(--line); margin:2em 0; }
.sbar-pagelinks{ margin-top:1.5em; font-family:var(--mono); font-size:13px; }

/* ---- sidebar ---- */
.sbar-side{ position:sticky; top:90px; display:flex; flex-direction:column; gap:28px; }
.sbar-widget{ border:1px solid var(--line); border-radius:10px; padding:20px; background:#fff; }
.sbar-widget__h{ font-family:var(--display); font-weight:800; text-transform:uppercase; font-size:18px; letter-spacing:.02em; color:var(--ink); margin:0 0 14px; }
.sbar-side__search{ display:flex; align-items:center; gap:8px; border:1px solid var(--line); border-radius:8px; padding:4px 4px 4px 12px; }
.sbar-side__search input{ flex:1; border:none; outline:none; font:inherit; font-size:14px; background:none; color:var(--ink); padding:8px 0; }
.sbar-side__search button{ border:none; background:var(--red); color:#fff; width:40px; height:40px; border-radius:6px; display:inline-flex; align-items:center; justify-content:center; cursor:pointer; flex:none; transition:background .18s; }
.sbar-side__search button svg{ width:18px; height:18px; }
.sbar-side__search button:hover{ background:var(--red-600); }
.sbar-cats{ list-style:none; margin:0; padding:0; }
.sbar-cats li + li{ border-top:1px solid var(--line); }
.sbar-cats a{ display:flex; align-items:center; justify-content:space-between; padding:11px 0; font-family:var(--mono); font-size:13px; letter-spacing:.03em; text-transform:uppercase; color:var(--ink); text-decoration:none; transition:color .16s; }
.sbar-cats a span{ color:var(--red); transition:transform .18s; }
.sbar-cats a:hover{ color:var(--red); }
.sbar-cats a:hover span{ transform:translateX(4px); }
.sbar-recent{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:14px; }
.sbar-recent__item a{ display:flex; gap:12px; align-items:center; text-decoration:none; }
.sbar-recent__thumb{ flex:none; width:62px; height:62px; border-radius:8px; overflow:hidden; background:var(--soft); }
.sbar-recent__thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.sbar-recent__txt{ display:flex; flex-direction:column; gap:4px; }
.sbar-recent__title{ font-family:var(--text); font-weight:600; font-size:14px; line-height:1.3; color:var(--ink); }
.sbar-recent__item a:hover .sbar-recent__title{ color:var(--red); }
.sbar-recent__date{ font-family:var(--mono); font-size:11px; letter-spacing:.03em; text-transform:uppercase; color:var(--muted); }
.sbar-recent__empty{ font-size:14px; color:var(--muted); }

/* ---- bottom CTA ---- */
.sbar-cta{ background:var(--char); color:#f5f5f3; }
.sbar-cta__inner{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:24px; padding:clamp(34px,5vh,52px) clamp(20px,4vw,48px); }
.sbar-cta__h{ font-family:var(--display); font-weight:800; text-transform:uppercase; font-size:clamp(24px,3vw,40px); line-height:1; margin:0; }
.sbar-cta__p{ font-size:14.5px; color:#b9b9bf; margin-top:8px; max-width:48ch; }
.sbar-cta__btn{ display:inline-flex; align-items:center; gap:10px; background:var(--red); color:#fff; font-family:var(--mono); font-size:13px; letter-spacing:.05em; text-transform:uppercase; padding:16px 28px; border-radius:6px; text-decoration:none; transition:background .18s, transform .18s; white-space:nowrap; }
.sbar-cta__btn span{ transition:transform .18s; }
.sbar-cta__btn:hover{ background:var(--red-600); transform:translateY(-1px); }
.sbar-cta__btn:hover span{ transform:translateX(4px); }

/* ---- responsive ---- */
@media (max-width:960px){
  .sbar-layout{ grid-template-columns:1fr; gap:40px; }
  .sbar-content{ max-width:none; }
  .sbar-side{ position:static; }
}
@media (max-width:560px){
  .sbar-content p,.sbar-content li{ font-size:17px; }
  .sbar-cta__inner{ flex-direction:column; align-items:flex-start; }
}
@media (prefers-reduced-motion: reduce){
  .sbar-cta__btn,.sbar-cats a span{ transition:none; }
}


/* ================= v0.81.0 FLUID LAYOUT: large screens only (>=1441px); widths <=1440px unchanged ================= */
@media (min-width:1441px){
  .sbar{--maxw:max(1280px,min(1600px,88vw))}
}