/* ---------------------------------------------------------------------------
   BSX: the authored page design system.
   Lives here rather than inline so every page shares one cached copy instead
   of carrying ~190KB of its own. Everything is scoped under .bsx, so pages
   that do not opt in are untouched.
   -------------------------------------------------------------------------- */
.bsx{
  --bsx-max:1180px;
  --bsx-gut:clamp(20px,4vw,40px);
  --bsx-rule:rgba(12,22,61,.10);
  --bsx-rule-dark:rgba(235,245,255,.16);
  --bsx-ink-dark:rgba(235,245,255,.72);
  --bsx-ease:cubic-bezier(.22,1,.36,1);
  --bsx-pad:clamp(64px,8vw,120px);
}

/* ---- browser surfaces: the parts nobody draws, themed from the palette ---- */
.bsx ::selection{background:var(--navy);color:var(--white)}
[data-bsx-dark] ::selection{background:var(--teal);color:var(--navy)}
.bsx{caret-color:var(--blue);scrollbar-color:var(--border-strong) transparent}
.bsx *:focus-visible{
  outline:2px solid var(--blue);outline-offset:3px;border-radius:4px;
}
[data-bsx-dark] *:focus-visible{outline-color:var(--teal)}
.bsx a{text-underline-offset:.22em;text-decoration-thickness:from-font}

/* ---- shell ---- */
section.bsx{position:relative;overflow:clip}
.bsx .bsx-w{
  max-width:var(--bsx-max);margin:0 auto;padding-inline:var(--bsx-gut);
  box-sizing:border-box;
}
.bsx-band{padding-block:var(--bsx-pad)}
.bsx-canvas{background:var(--white)}
.bsx-mist{background:var(--mist)}
.bsx-navy{background:var(--navy);color:var(--white)}

/* ---- type ---- */
.bsx h1,.bsx h2,.bsx h3,.bsx h4{
  font-family:var(--font-display);font-weight:700;color:var(--navy);
  text-wrap:balance;margin:0;
}
[data-bsx-dark] h2,[data-bsx-dark] h3,[data-bsx-dark] h4{color:var(--white)}
.bsx p{font-family:var(--font-system);margin:0;color:var(--slate);text-wrap:pretty}
[data-bsx-dark] p{color:var(--bsx-ink-dark)}
.bsx .bsx-d1{
  font-size:clamp(40px,6.4vw,84px);line-height:.98;letter-spacing:-.035em;
}
.bsx .bsx-d2{
  font-size:clamp(29px,3.5vw,50px);line-height:1.06;letter-spacing:-.028em;
}
.bsx .bsx-d3{font-size:clamp(19px,1.5vw,23px);line-height:1.28;letter-spacing:-.018em}
.bsx .bsx-lead{font-size:clamp(16.5px,1.35vw,19.5px);line-height:1.6;max-width:64ch}
.bsx .bsx-body{font-size:15.5px;line-height:1.62;max-width:68ch}
.bsx .bsx-sm{font-size:13.5px;line-height:1.55}
.bsx .bsx-num{font-variant-numeric:tabular-nums lining-nums;font-feature-settings:"tnum" 1}

/* section head: more space above a heading than below it */
.bsx .bsx-head{max-width:none}
.bsx .bsx-head .bsx-lead{margin-top:18px}
.bsx .bsx-headrow{
  display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);
  gap:clamp(24px,4vw,72px);align-items:end;
}
@media (max-width:900px){.bsx .bsx-headrow{grid-template-columns:1fr;align-items:start}}

/* ---- the section label: given a job instead of being a decorative kicker ---- */
.bsx .bsx-tag{
  display:inline-flex;align-items:center;gap:9px;font-family:var(--font-system);
  font-size:12.5px;font-weight:700;color:var(--slate);margin-bottom:20px;
}
[data-bsx-dark] .bsx-tag{color:var(--teal)}
.bsx .bsx-tag::before{
  content:"";width:26px;height:1px;background:currentColor;opacity:.55;flex:0 0 auto;
}

/* ---- links & buttons ---- */
.bsx .bsx-btn{
  display:inline-flex;align-items:center;gap:10px;font-family:var(--font-system);
  font-weight:700;font-size:15.5px;line-height:1;text-decoration:none;
  height:54px;padding-inline:26px;border-radius:10px;
  background:var(--blue);color:var(--white);border:1px solid var(--blue);
  transition:background 220ms var(--bsx-ease),transform 220ms var(--bsx-ease),
             box-shadow 220ms var(--bsx-ease);
  box-shadow:0 10px 22px -12px rgba(49,92,253,.66);
}
.bsx a.bsx-btn,.bsx a.bsx-btn:link,.bsx a.bsx-btn:visited,
.bsx a.bsx-btn:hover,.bsx a.bsx-btn:focus{color:var(--white)}
.bsx .bsx-btn:hover{background:var(--blue-hover);transform:translateY(-2px);
  box-shadow:0 16px 30px -14px rgba(49,92,253,.72)}
.bsx .bsx-btn--ghost{
  background:transparent;color:var(--navy);border-color:var(--border-strong);box-shadow:none;
}
.bsx a.bsx-btn--ghost,.bsx a.bsx-btn--ghost:link,.bsx a.bsx-btn--ghost:visited{color:var(--navy)}
.bsx .bsx-btn--ghost:hover{background:var(--white);border-color:var(--navy);
  transform:translateY(-2px);box-shadow:0 12px 24px -16px rgba(12,22,61,.5)}
[data-bsx-dark] .bsx-btn--ghost{border-color:rgba(235,245,255,.3)}
[data-bsx-dark] a.bsx-btn--ghost,
[data-bsx-dark] a.bsx-btn--ghost:link,
[data-bsx-dark] a.bsx-btn--ghost:visited{color:var(--white)}
[data-bsx-dark] .bsx-btn--ghost:hover{background:rgba(235,245,255,.09);
  border-color:var(--teal)}

.bsx .bsx-link{
  display:inline-flex;align-items:center;gap:8px;font-family:var(--font-system);
  font-weight:700;font-size:14.5px;color:var(--blue);text-decoration:none;
}
.bsx a.bsx-link,.bsx a.bsx-link:link,.bsx a.bsx-link:visited{color:var(--blue)}
.bsx .bsx-link svg{transition:transform 260ms var(--bsx-ease)}
.bsx .bsx-link:hover svg{transform:translateX(4px)}
.bsx .bsx-link:hover{text-decoration:underline}
[data-bsx-dark] a.bsx-link,[data-bsx-dark] a.bsx-link:link,
[data-bsx-dark] a.bsx-link:visited{color:var(--teal)}

/* ================= hero ================= */
.bsx-hero{padding-block:clamp(52px,7vw,92px) clamp(56px,7vw,104px)}
.bsx-hero__grid{
  display:grid;grid-template-columns:minmax(0,1.06fr) minmax(0,.94fr);
  gap:clamp(28px,4.5vw,68px);align-items:center;
}
@media (max-width:980px){.bsx-hero__grid{grid-template-columns:1fr}}
.bsx-pill{
  display:inline-flex;align-items:center;gap:9px;height:34px;padding-inline:14px;
  border-radius:999px;background:var(--mist);border:1px solid var(--mist-border);
  font-family:var(--font-system);font-size:13px;font-weight:600;color:var(--navy);
}
.bsx-pill i{
  width:7px;height:7px;border-radius:999px;background:var(--teal);flex:0 0 auto;
  box-shadow:0 0 0 4px rgba(40,220,209,.22);
}
.bsx-hero h1{margin-top:26px}
.bsx-hero__lead{margin-top:24px}
.bsx-hero__cta{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin-top:34px}
.bsx-hero__note{margin-top:26px;font-size:13.5px;line-height:1.6;max-width:56ch;color:var(--slate)}

/* capability rail — the hero chips become stops on the transfer path */
.bsx-rail{margin-top:40px;position:relative}
.bsx-rail__line{position:absolute;left:0;right:0;top:11px;height:1px;background:var(--bsx-rule)}
.bsx-rail__items{
  position:relative;display:flex;flex-wrap:wrap;gap:10px 26px;list-style:none;margin:0;padding:0;
}
.bsx-rail__items li{
  position:relative;padding-top:26px;font-family:var(--font-system);font-size:13.5px;
  font-weight:600;color:var(--navy);
}
.bsx-rail__items li::before{
  content:"";position:absolute;top:7px;left:0;width:9px;height:9px;border-radius:999px;
  background:var(--white);border:2px solid var(--blue);
}
.bsx-rail__items li:last-child{color:var(--slate);font-weight:600}
.bsx-rail__items li:last-child::before{border-color:var(--border-strong)}

/* hero figure */
.bsx-hero__fig{position:relative;margin:0}
.bsx-hero__fig img{
  width:100%;height:auto;display:block;border-radius:20px;
  border:1px solid var(--mist-border);
  box-shadow:0 32px 70px -34px rgba(12,22,61,.42);
}
.bsx-corridor{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.bsx-corridor path{
  stroke:var(--blue);stroke-width:1.5;fill:none;opacity:.5;
  stroke-dasharray:var(--len,1400);stroke-dashoffset:var(--len,1400);
  animation:bsx-draw 2.1s var(--bsx-ease) .25s forwards;
}
@keyframes bsx-draw{to{stroke-dashoffset:0}}

/* ================= client wall ================= */
.bsx-clients{padding-block:clamp(30px,3.4vw,46px);border-block:1px solid var(--bsx-rule)}
.bsx-clients__row{display:flex;align-items:center;gap:clamp(18px,3vw,44px);flex-wrap:wrap}
.bsx-clients__label{
  font-family:var(--font-system);font-size:12px;font-weight:700;color:var(--slate);
  flex:0 0 auto;
}
.bsx-clients__names{
  display:flex;flex-wrap:wrap;gap:clamp(16px,2.6vw,38px);list-style:none;margin:0;padding:0;
}
.bsx-clients__names li{
  font-family:var(--font-display);font-size:clamp(15px,1.5vw,19px);font-weight:700;
  color:var(--navy);opacity:.42;letter-spacing:-.015em;
  transition:opacity 240ms var(--bsx-ease);
}
.bsx-clients__names li:hover{opacity:.95}

/* ================= impact ledger ================= */
.bsx-ledger{margin-top:clamp(38px,4.6vw,60px);border-top:1px solid var(--bsx-rule)}
.bsx-ledger__row{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
}
@media (max-width:760px){.bsx-ledger__row{grid-template-columns:repeat(2,minmax(0,1fr))}}
.bsx-ledger__cell{
  padding:26px 22px 26px 0;border-right:1px solid var(--bsx-rule);position:relative;
}
.bsx-ledger__cell:last-child{border-right:0}
@media (max-width:760px){
  .bsx-ledger__cell:nth-child(2n){border-right:0}
  .bsx-ledger__cell:nth-child(-n+2){border-bottom:1px solid var(--bsx-rule)}
}
.bsx-ledger__cell::before{
  content:"";position:absolute;top:-1px;left:0;width:34px;height:2px;background:var(--blue);
}
.bsx-ledger__n{
  display:block;font-family:var(--font-display);font-weight:700;color:var(--navy);
  font-size:clamp(40px,4.6vw,62px);line-height:1;letter-spacing:-.04em;
}
.bsx-ledger__l{
  display:block;margin-top:10px;font-family:var(--font-system);font-size:13.5px;
  line-height:1.45;color:var(--slate);max-width:20ch;
}
.bsx-ledger__foot{
  display:flex;flex-wrap:wrap;gap:16px 28px;align-items:center;justify-content:space-between;
  margin-top:26px;
}
.bsx-ledger__foot p{font-size:12.5px;line-height:1.55;max-width:62ch}

/* ================= disciplines index ================= */
.bsx-index{margin-top:clamp(40px,5vw,64px);border-top:1px solid var(--bsx-rule)}
.bsx-row{
  display:grid;grid-template-columns:52px minmax(0,1fr) minmax(0,1.25fr) auto;
  gap:clamp(14px,2.4vw,40px);align-items:start;
  padding-block:clamp(24px,2.8vw,34px);border-bottom:1px solid var(--bsx-rule);
  text-decoration:none;position:relative;transition:background 260ms var(--bsx-ease);
}
.bsx-row::after{
  content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:var(--blue);
  transform:scaleX(0);transform-origin:left;transition:transform 420ms var(--bsx-ease);
}
.bsx-row:hover::after{transform:scaleX(1)}
.bsx-row:hover{background:rgba(235,245,255,.55)}
.bsx-mist .bsx-row:hover{background:rgba(255,255,255,.6)}
.bsx-row__n{
  font-family:var(--font-display);font-size:14px;font-weight:700;color:var(--blue);
  padding-top:4px;font-variant-numeric:tabular-nums;
}
.bsx-row__t{display:block;color:var(--navy)}
.bsx-row__k{
  display:block;margin-top:8px;font-family:var(--font-system);font-size:12.5px;
  font-weight:600;color:var(--slate);
}
.bsx-row__b{font-size:14.5px;line-height:1.6}
.bsx-row__go{
  display:inline-flex;align-items:center;gap:8px;font-family:var(--font-system);
  font-size:13.5px;font-weight:700;color:var(--blue);white-space:nowrap;padding-top:3px;
}
.bsx-row__go svg{transition:transform 300ms var(--bsx-ease)}
.bsx-row:hover .bsx-row__go svg{transform:translateX(5px)}
@media (max-width:1024px){
  .bsx-row{grid-template-columns:38px minmax(0,1fr);row-gap:12px}
  .bsx-row__b{grid-column:2}
  .bsx-row__go{grid-column:2}
}

/* the AEO answer card that belongs to the SEO discipline */
.bsx-aeo{
  margin-top:16px;border:1px solid var(--mist-border);background:var(--white);
  border-radius:14px;padding:16px 18px;max-width:520px;
}
.bsx-aeo__top{display:flex;align-items:center;justify-content:space-between;gap:12px}
.bsx-aeo__k{font-family:var(--font-system);font-size:11.5px;font-weight:700;color:var(--slate)}
.bsx-aeo__s{
  display:inline-flex;align-items:center;gap:6px;font-family:var(--font-system);
  font-size:11.5px;font-weight:700;color:var(--success-text);
  background:var(--success-surface);border:1px solid var(--success-border);
  border-radius:999px;padding:3px 10px;
}
.bsx-aeo__q{
  margin-top:10px;font-family:var(--font-system);font-size:14.5px;line-height:1.5;
  color:var(--navy);font-weight:600;
}
.bsx-aeo__b{
  margin-top:12px;padding-top:11px;border-top:1px dashed var(--mist-border);
  display:flex;align-items:center;gap:8px;font-family:var(--font-display);
  font-size:14px;font-weight:700;color:var(--blue);
}

/* ================= service directory ================= */
.bsx-dir{
  margin-top:clamp(38px,4.6vw,58px);
  display:grid;grid-template-columns:repeat(auto-fill,minmax(258px,1fr));
  gap:0;border-top:1px solid var(--bsx-rule);border-left:1px solid var(--bsx-rule);
}
.bsx-dir__col{
  border-right:1px solid var(--bsx-rule);border-bottom:1px solid var(--bsx-rule);
  padding:26px 24px;
}
.bsx-dir__h{display:flex;align-items:baseline;gap:10px}
.bsx-dir__h b{
  font-family:var(--font-display);font-size:17px;font-weight:700;color:var(--navy);
  letter-spacing:-.015em;
}
.bsx-dir__c{
  font-family:var(--font-system);font-size:11.5px;font-weight:700;color:var(--slate);
  font-variant-numeric:tabular-nums;
}
.bsx-dir__list{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:1px}
.bsx-dir__list a{
  display:block;padding:7px 0;font-family:var(--font-system);font-size:14px;
  line-height:1.4;color:var(--slate);text-decoration:none;
  transition:color 200ms var(--bsx-ease),padding-left 240ms var(--bsx-ease);
}
.bsx-dir__list a:hover{color:var(--blue);padding-left:6px}
.bsx-dir__all{margin-top:14px;padding-top:13px;border-top:1px solid var(--bsx-rule)}

/* ================= leaks (dark chapter) ================= */
.bsx-leaks__grid{
  margin-top:clamp(40px,5vw,62px);display:grid;
  grid-template-columns:repeat(auto-fit,minmax(272px,1fr));gap:0;
  border-top:1px solid var(--bsx-rule-dark);
}
.bsx-leaks__col{
  padding:32px clamp(20px,2.4vw,34px) 8px 0;position:relative;
  border-right:1px solid var(--bsx-rule-dark);
}
.bsx-leaks__col:last-child{border-right:0}
@media (max-width:860px){
  .bsx-leaks__col{border-right:0;border-bottom:1px solid var(--bsx-rule-dark);padding-right:0}
  .bsx-leaks__col:last-child{border-bottom:0}
}
.bsx-leaks__col::before{
  content:"";position:absolute;top:-5px;left:0;width:9px;height:9px;border-radius:999px;
  background:var(--navy);border:2px solid var(--coral);
}
.bsx-leaks__col h3{font-size:19px;line-height:1.3;letter-spacing:-.02em}
.bsx-leaks__col ul{list-style:none;margin:18px 0 0;padding:0;display:grid;gap:11px}
.bsx-leaks__col li{
  font-family:var(--font-system);font-size:14.5px;line-height:1.5;
  color:var(--bsx-ink-dark);padding-left:20px;position:relative;
}
.bsx-leaks__col li::before{
  content:"";position:absolute;left:0;top:8px;width:9px;height:1px;background:var(--coral);
}

/* ================= what we ship ================= */
.bsx-ship{
  margin-top:clamp(38px,4.6vw,58px);display:grid;
  grid-template-columns:repeat(auto-fit,minmax(268px,1fr));gap:clamp(18px,2.4vw,30px);
}
.bsx-ship__item{
  display:flex;flex-direction:column;padding-top:22px;border-top:2px solid var(--navy);
  text-decoration:none;
}
.bsx-ship__k{font-family:var(--font-system);font-size:12px;font-weight:700;color:var(--blue)}
.bsx-ship__item h3{margin-top:12px;font-size:20px;line-height:1.28;letter-spacing:-.02em}
.bsx-ship__item p{margin-top:12px;font-size:14.5px;line-height:1.6;flex:1 1 auto}
.bsx-ship__item .bsx-link{margin-top:18px}

/* ================= specialist ================= */
.bsx-spec{
  margin-top:clamp(38px,4.6vw,58px);display:grid;
  grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
  gap:0 clamp(28px,4vw,64px);
}
.bsx-spec__item{padding-block:26px;border-top:1px solid var(--bsx-rule)}
.bsx-spec__item h3{font-size:18px;line-height:1.32;letter-spacing:-.02em}
.bsx-spec__item p{margin-top:10px;font-size:14.5px;line-height:1.6}
.bsx-spec__item .bsx-link{margin-top:14px}

/* ================= versus table ================= */
.bsx-vs{margin-top:clamp(38px,4.6vw,58px);width:100%;border-collapse:collapse;
  font-family:var(--font-system);text-align:left}
.bsx-vs caption{text-align:left;font-size:0;height:0;overflow:hidden}
.bsx-vs th,.bsx-vs td{padding:16px 20px;vertical-align:top;font-size:14.5px;line-height:1.5}
.bsx-vs thead th{
  font-family:var(--font-display);font-size:15.5px;font-weight:700;color:var(--navy);
  border-bottom:2px solid var(--navy);padding-bottom:14px;
}
.bsx-vs thead th:first-child{color:var(--slate);border-bottom-color:var(--border-strong)}
.bsx-vs tbody td{border-bottom:1px solid var(--bsx-rule);color:var(--slate)}
.bsx-vs tbody td:last-child{color:var(--navy);font-weight:600;background:rgba(235,245,255,.5)}
.bsx-mist .bsx-vs tbody td:last-child{background:rgba(255,255,255,.62)}
.bsx-vs tbody tr:hover td{background:rgba(235,245,255,.72)}
.bsx-mist .bsx-vs tbody tr:hover td{background:rgba(255,255,255,.9)}
.bsx-vs__badge{
  display:inline-flex;align-items:center;gap:6px;margin-left:10px;vertical-align:middle;
  font-family:var(--font-system);font-size:11px;font-weight:700;color:var(--blue);
  background:var(--info-surface);border:1px solid var(--info-border);
  border-radius:999px;padding:3px 9px;
}
.bsx-vs__wrap{overflow-x:auto}
@media (max-width:640px){.bsx-vs th,.bsx-vs td{padding:13px 12px;font-size:13.5px}}

/* ================= outcomes ================= */
.bsx-out{
  margin-top:clamp(38px,4.6vw,58px);display:grid;
  grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:0 clamp(28px,4vw,60px);
}
.bsx-out__item{padding-block:28px;border-top:1px solid var(--bsx-rule);display:flex;gap:18px}
.bsx-out__ic{
  flex:0 0 auto;width:40px;height:40px;border-radius:10px;display:grid;place-items:center;
  background:var(--white);border:1px solid var(--mist-border);color:var(--blue);
}
.bsx-out__item h3{font-size:18px;line-height:1.3;letter-spacing:-.02em}
.bsx-out__item p{margin-top:9px;font-size:14.5px;line-height:1.6}
.bsx-out__item .bsx-link{margin-top:13px}

/* ================= steps ================= */
.bsx-steps{margin-top:clamp(40px,5vw,64px);position:relative}
.bsx-steps__line{
  position:absolute;left:0;right:0;top:19px;height:1px;background:var(--bsx-rule);
}
@media (max-width:900px){.bsx-steps__line{display:none}}
.bsx-steps__grid{
  position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  gap:clamp(20px,2.6vw,36px);
}
@media (max-width:900px){.bsx-steps__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.bsx-steps__grid{grid-template-columns:1fr}}
.bsx-step__n{
  width:38px;height:38px;border-radius:999px;display:grid;place-items:center;
  background:var(--white);border:1.5px solid var(--blue);color:var(--blue);
  font-family:var(--font-display);font-size:13px;font-weight:700;
  font-variant-numeric:tabular-nums;
}
.bsx-mist .bsx-step__n{background:var(--mist)}
.bsx-step h3{margin-top:18px;font-size:18px;line-height:1.3;letter-spacing:-.02em}
.bsx-step p{margin-top:10px;font-size:14.5px;line-height:1.6}
.bsx-steps__cta{margin-top:clamp(32px,4vw,48px)}

/* ================= proof ================= */
.bsx-proof{margin-top:clamp(38px,4.6vw,58px);display:grid;gap:clamp(18px,2.4vw,28px);
  grid-template-columns:repeat(auto-fit,minmax(266px,1fr))}
.bsx-proof__lead{grid-column:1/-1}
@media (min-width:1000px){.bsx-proof__lead{grid-column:span 2}}
.bsx-q{
  display:flex;flex-direction:column;padding:26px 24px;border-radius:16px;
  background:rgba(235,245,255,.07);border:1px solid var(--bsx-rule-dark);
  transition:border-color 280ms var(--bsx-ease),transform 280ms var(--bsx-ease);
}
.bsx-q:hover{border-color:rgba(40,220,209,.5);transform:translateY(-3px)}
.bsx-q blockquote{
  margin:0;font-family:var(--font-display);font-weight:600;color:var(--white);
  font-size:16.5px;line-height:1.45;letter-spacing:-.015em;
}
.bsx-proof__lead blockquote{font-size:clamp(19px,2.1vw,27px);line-height:1.32;letter-spacing:-.025em}
.bsx-q__who{
  margin-top:auto;padding-top:20px;display:flex;align-items:center;gap:11px;
}
.bsx-q__av{
  width:34px;height:34px;border-radius:999px;display:grid;place-items:center;flex:0 0 auto;
  background:rgba(40,220,209,.14);border:1px solid rgba(40,220,209,.34);color:var(--teal);
  font-family:var(--font-display);font-size:12.5px;font-weight:700;
}
.bsx-q__n{font-family:var(--font-system);font-size:13.5px;font-weight:700;color:var(--white)}
.bsx-q__r{font-family:var(--font-system);font-size:12.5px;color:var(--bsx-ink-dark);margin-top:1px}

/* ================= faq ================= */
.bsx-faq{margin-top:clamp(34px,4vw,52px)}
.bsx-chips{display:flex;flex-wrap:wrap;gap:9px;margin-bottom:28px}
.bsx-chip{
  appearance:none;cursor:pointer;font-family:var(--font-system);font-size:13.5px;
  font-weight:700;height:40px;padding-inline:18px;border-radius:999px;
  background:var(--white);border:1px solid var(--border);color:var(--slate);
  transition:background 200ms var(--bsx-ease),color 200ms var(--bsx-ease),
             border-color 200ms var(--bsx-ease);
}
.bsx-chip:hover{border-color:var(--border-strong);color:var(--navy)}
.bsx-chip[aria-pressed="true"]{background:var(--navy);border-color:var(--navy);color:var(--white)}
.bsx-acc{border-top:1px solid var(--bsx-rule)}
/* each question is a real subheading; the button inside carries the styling */
.bsx .bsx-acc__row{margin:0;font-size:inherit;font-weight:inherit;letter-spacing:normal}
.bsx-acc__q{
  appearance:none;cursor:pointer;width:100%;display:flex;align-items:flex-start;gap:18px;
  justify-content:space-between;text-align:left;background:none;border:0;
  border-bottom:1px solid var(--bsx-rule);padding:20px 0;
  font-family:var(--font-display);font-size:16px;font-weight:700;line-height:1.4;
  color:var(--navy);letter-spacing:-.015em;transition:color 200ms var(--bsx-ease);
}
.bsx-acc__q:hover{color:var(--blue)}
.bsx-acc__i{
  flex:0 0 auto;width:26px;height:26px;border-radius:999px;display:grid;place-items:center;
  border:1px solid var(--border);color:var(--blue);margin-top:1px;
  transition:transform 300ms var(--bsx-ease),background 200ms var(--bsx-ease);
}
.bsx-acc__q[aria-expanded="true"] .bsx-acc__i{transform:rotate(45deg);background:var(--mist)}
.bsx-acc__a{padding:4px 0 24px;border-bottom:1px solid var(--bsx-rule)}
.bsx-acc__a p{font-size:15px;line-height:1.66;max-width:78ch}

/* ================= closing ================= */
.bsx-close{text-align:center}
.bsx-close .bsx-lead{margin:20px auto 0;max-width:60ch}
.bsx-close__cta{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;margin-top:34px}
.bsx-close__note{margin-top:22px;font-size:13px}
.bsx-close__bg{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.16;
  pointer-events:none;
}

/* ---- section figures: sized to sit with the text, never as a slab ---- */
.bsx-fig{margin:0}
.bsx-fig img{
  width:100%;height:auto;display:block;border-radius:14px;
  border:1px solid var(--mist-border);box-shadow:0 18px 40px -22px rgba(12,22,61,.34);
}
[data-bsx-dark] .bsx-fig img{
  border-color:rgba(235,245,255,.2);box-shadow:0 18px 40px -22px rgba(0,0,0,.6);
}

/* ---- the one authored entrance, on the index rows only ---- */
@media (prefers-reduced-motion:no-preference){
  .bsx-row{opacity:0;transform:translateY(10px);
    animation:bsx-in .62s var(--bsx-ease) forwards;
    animation-timeline:view();animation-range:entry 0% cover 22%;}
  @supports not (animation-timeline:view()){
    .bsx-row{opacity:1;transform:none;animation:none}
  }
}
@keyframes bsx-in{to{opacity:1;transform:none}}

/* the generic site-wide section entrance is replaced by the authored one */
section.bsx.bs-reveal{opacity:1!important;transform:none!important}


/* ===========================================================================
   Astra styles every <button> on the site: a grey fill, a blue :hover fill and
   white hover text, all at (0,1,1). Every unstyled control here inherited that,
   which is what turned a hovered FAQ question into a blue bar with blue text.
   Reclaim the element type explicitly.
   ========================================================================== */
.bsx button,
.bsx button:hover,
.bsx button:focus,
.bsx button:active{
  background:transparent;background-color:transparent;color:inherit;
  border:0;box-shadow:none;text-transform:none;letter-spacing:inherit;
}
.bsx button.bsx-chip{background:var(--white);border:1px solid var(--border);color:var(--slate)}
.bsx button.bsx-chip:hover{background:var(--white);border-color:var(--blue);color:var(--navy)}
.bsx button.bsx-chip[aria-pressed="true"],
.bsx button.bsx-chip[aria-pressed="true"]:hover{
  background:var(--navy);border-color:var(--navy);color:var(--white);
}
.bsx button.bsx-acc__q,
.bsx button.bsx-acc__q:focus{background:transparent;color:var(--navy)}
.bsx button.bsx-acc__q:hover{background:transparent;color:var(--blue)}
.bsx button.bsx-acc__q[aria-expanded="true"]{color:var(--blue)}

/* accent inside a heading, as the captured design had it */
.bsx .bsx-accent{color:var(--blue)}

/* ---- shared icon chip; fills with brand colour on hover ---- */
.bsx .bsx-ic{
  display:inline-grid;place-items:center;flex:0 0 auto;
  width:38px;height:38px;border-radius:10px;
  background:var(--white);border:1px solid var(--mist-border);color:var(--blue);
  transition:background 240ms var(--bsx-ease),color 240ms var(--bsx-ease),
             border-color 240ms var(--bsx-ease),transform 240ms var(--bsx-ease);
}
.bsx .bsx-ic--sm{width:30px;height:30px;border-radius:8px}
.bsx a:hover > .bsx-ic,
.bsx a:hover .bsx-ic,
.bsx .bsx-row:hover .bsx-ic,
.bsx .bsx-ship__item:hover .bsx-ic,
.bsx .bsx-out__item:hover .bsx-ic,
.bsx .bsx-step:hover .bsx-ic,
.bsx .bsx-spec__item:hover .bsx-ic{
  background:var(--blue);border-color:var(--blue);color:var(--white);
  transform:translateY(-2px);
}
[data-bsx-dark] .bsx-ic{
  background:rgba(235,245,255,.08);border-color:var(--bsx-rule-dark);color:var(--teal);
}

/* ---- pill button, used wherever a link needs to read as an action ---- */
.bsx .bsx-act{
  display:inline-flex;align-items:center;gap:9px;font-family:var(--font-system);
  font-weight:700;font-size:13.5px;line-height:1;text-decoration:none;
  height:42px;padding-inline:16px;border-radius:999px;
  background:var(--white);border:1px solid var(--border);color:var(--navy);
  white-space:nowrap;
  transition:background 240ms var(--bsx-ease),color 240ms var(--bsx-ease),
             border-color 240ms var(--bsx-ease),transform 240ms var(--bsx-ease),
             box-shadow 240ms var(--bsx-ease);
}
.bsx a.bsx-act,.bsx a.bsx-act:link,.bsx a.bsx-act:visited{color:var(--navy)}
.bsx .bsx-act svg{transition:transform 260ms var(--bsx-ease)}
.bsx .bsx-act:hover,.bsx .bsx-row:hover .bsx-act{
  background:var(--blue);border-color:var(--blue);transform:translateY(-2px);
  box-shadow:0 12px 24px -14px rgba(49,92,253,.7);
}
.bsx a.bsx-act:hover,.bsx .bsx-row:hover a.bsx-act{color:var(--white)}
.bsx .bsx-act:hover svg,.bsx .bsx-row:hover .bsx-act svg{transform:translateX(4px)}
[data-bsx-dark] .bsx-act{background:rgba(235,245,255,.06);border-color:var(--bsx-rule-dark)}
[data-bsx-dark] a.bsx-act,[data-bsx-dark] a.bsx-act:link,
[data-bsx-dark] a.bsx-act:visited{color:var(--white)}
[data-bsx-dark] .bsx-act:hover{background:var(--teal);border-color:var(--teal)}
[data-bsx-dark] a.bsx-act:hover{color:var(--navy)}

/* ================= hero ================= */
.bsx-hero h1{overflow-wrap:break-word}
.bsx-rail__items{gap:12px 14px}
.bsx-rail__items li{display:flex;align-items:center;padding-top:0}
.bsx-rail__items li::before{display:none}
.bsx-rail__stop{
  display:flex;align-items:center;gap:10px;padding:8px 15px 8px 8px;
  border-radius:999px;background:var(--white);border:1px solid var(--mist-border);
  font-family:var(--font-system);font-size:13.5px;font-weight:600;color:var(--navy);
  transition:border-color 260ms var(--bsx-ease),transform 260ms var(--bsx-ease),
             box-shadow 260ms var(--bsx-ease);
}
.bsx-rail__stop:hover{
  border-color:var(--blue);transform:translateY(-3px);
  box-shadow:0 12px 26px -16px rgba(12,22,61,.42);
}
.bsx-rail__line{top:50%}
@media (prefers-reduced-motion:no-preference){
  .bsx-rail__items li{opacity:0;transform:translateY(8px);
    animation:bsx-in .5s var(--bsx-ease) forwards}
  .bsx-rail__items li:nth-child(1){animation-delay:.30s}
  .bsx-rail__items li:nth-child(2){animation-delay:.40s}
  .bsx-rail__items li:nth-child(3){animation-delay:.50s}
  .bsx-rail__items li:nth-child(4){animation-delay:.60s}
  .bsx-rail__items li:nth-child(5){animation-delay:.70s}
}

/* ================= clients marquee ================= */
.bsx-clients{padding-block:clamp(46px,5vw,74px);border-block:1px solid var(--bsx-rule)}
.bsx-clients h2{margin-bottom:30px}
.bsx-marquee{
  position:relative;overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
}
.bsx-marquee__track{display:flex;width:max-content}
@media (prefers-reduced-motion:no-preference){
  .bsx-marquee__track{animation:bsx-slide 38s linear infinite}
  .bsx-marquee:hover .bsx-marquee__track,
  .bsx-marquee:focus-within .bsx-marquee__track{animation-play-state:paused}
}
@keyframes bsx-slide{from{transform:translateX(-50%)}to{transform:translateX(0)}}
.bsx-marquee__set{display:flex;gap:clamp(14px,2vw,26px);padding-right:clamp(14px,2vw,26px)}
.bsx-plate{
  display:flex;align-items:center;gap:12px;flex:0 0 auto;
  padding:14px 22px;border-radius:14px;background:var(--white);
  border:1px solid var(--border);
  transition:border-color 240ms var(--bsx-ease),transform 240ms var(--bsx-ease);
}
.bsx-plate:hover{border-color:var(--blue);transform:translateY(-2px)}
.bsx-plate__mark{
  width:32px;height:32px;border-radius:9px;display:grid;place-items:center;
  background:var(--mist);color:var(--blue);font-family:var(--font-display);
  font-size:12.5px;font-weight:700;flex:0 0 auto;letter-spacing:.02em;
}
.bsx-plate__n{
  font-family:var(--font-display);font-size:16.5px;font-weight:700;color:var(--navy);
  letter-spacing:-.015em;white-space:nowrap;
}

/* ================= impact ================= */
.bsx-ledger__ic{margin-bottom:16px}
.bsx-ledger__foot{
  margin-top:34px;padding-top:24px;border-top:1px solid var(--bsx-rule);
  align-items:center;
}

/* ================= disciplines ================= */
.bsx-row{align-items:center}
.bsx-row__go{padding-top:0}

/* ================= directory ================= */
.bsx-dir__h{align-items:center;gap:11px}
.bsx-dir__list a{display:flex;align-items:center;gap:10px;padding:8px 0}
.bsx-dir__list a:hover{padding-left:0}
.bsx-dir__col{transition:background 260ms var(--bsx-ease)}
.bsx-dir__col:hover{background:rgba(255,255,255,.62)}

/* ================= leaks ================= */
.bsx-leaks__grid{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:0 clamp(24px,3.2vw,52px);border-top:0;
}
@media (max-width:900px){.bsx-leaks__grid{grid-template-columns:1fr}}
.bsx-leaks__col{
  padding:30px 0 24px;border-right:0;border-bottom:0;
  border-top:1px solid var(--bsx-rule-dark);
}
.bsx-leaks__col::before{top:-5px}
.bsx-leaks__head{display:flex;align-items:center;gap:12px;margin-bottom:16px}
.bsx-leaks__col h3{font-size:18px;line-height:1.3}
.bsx-leaks__col ul{margin-top:0}

/* ================= ship ================= */
.bsx-ship__item{border-top:2px solid var(--blue)}
.bsx-ship__top{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.bsx-ship__item h3{margin-top:0}
.bsx-ship__item .bsx-act{margin-top:18px;align-self:flex-start}

/* ================= specialist ================= */
.bsx-spec__item{display:flex;flex-direction:column}
.bsx-spec__top{display:flex;align-items:center;gap:12px}
.bsx-spec__item h3{margin:0}
.bsx-spec__item p{flex:1 1 auto;margin-top:12px}
.bsx-spec__item .bsx-act{margin-top:16px;align-self:flex-start}

/* ================= versus ================= */
.bsx-vs__wrap{border:1px solid var(--bsx-rule);border-radius:18px;overflow:hidden}
.bsx-vs{margin-top:0}
.bsx-vs thead th{padding:22px 20px 16px;vertical-align:bottom;background:var(--white)}
.bsx-vs thead th:last-child{background:var(--mist);border-bottom-color:var(--blue)}
.bsx-vs__side{display:flex;align-items:center;gap:11px}
.bsx-vs__logo{
  width:34px;height:34px;border-radius:9px;display:grid;place-items:center;
  background:var(--navy);flex:0 0 auto;
}
.bsx-vs__logo img{width:19px;height:19px;display:block}
.bsx-vs__them{
  width:34px;height:34px;border-radius:9px;display:grid;place-items:center;
  background:var(--disabled-surface);color:var(--disabled-text);flex:0 0 auto;
}
.bsx-vs__mark{
  display:inline-grid;place-items:center;width:22px;height:22px;border-radius:999px;
  margin-right:11px;vertical-align:-6px;
  transition:transform 240ms var(--bsx-ease);
}
.bsx-vs__mark--no{background:var(--danger-surface);color:var(--danger-solid)}
.bsx-vs__mark--yes{background:var(--success-surface);color:var(--success-text)}
.bsx-vs tbody td{transition:background 220ms var(--bsx-ease)}
.bsx-vs tbody td:last-child{background:rgba(235,245,255,.55)}
.bsx-vs tbody tr:hover td:last-child{background:var(--info-surface)}
.bsx-vs tbody tr:hover td:first-child{background:rgba(65,90,121,.06)}
.bsx-vs tbody tr:hover .bsx-vs__mark--yes{transform:scale(1.14)}
.bsx-vs__cap{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:22px}
.bsx-vs__trophy{
  display:inline-flex;align-items:center;gap:9px;padding:9px 16px;border-radius:999px;
  background:var(--warning-surface);border:1px solid var(--warning-border);
  color:var(--warning-text);font-family:var(--font-system);font-size:12.5px;font-weight:700;
}
.bsx-vs__trophy--blue{
  background:var(--info-surface);border-color:var(--info-border);color:var(--info-text);
}
.bsx-vs__trophy--teal{
  background:var(--success-surface);border-color:var(--success-border);color:var(--success-text);
}

/* ================= outcomes ================= */
.bsx-out{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  gap:0 clamp(18px,2.4vw,32px);margin-top:0;
}
@media (max-width:1000px){.bsx-out{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.bsx-out{grid-template-columns:1fr}}
.bsx-out__item{
  display:flex;flex-direction:column;padding:24px 0 26px;
  border-top:2px solid var(--navy);
}
.bsx-out__top{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.bsx-out__item h3{font-size:17px;line-height:1.28}
.bsx-out__item p{flex:1 1 auto;margin-top:0}
.bsx-out__item .bsx-act{margin-top:16px;align-self:flex-start}
.bsx-outwrap{
  margin-top:clamp(34px,4vw,54px);border-radius:20px;overflow:hidden;
  border:1px solid var(--mist-border);background:var(--white);
}
.bsx-outwrap__pad{padding:clamp(20px,2.4vw,30px) clamp(20px,2.4vw,30px) 0}
.bsx-outwrap .bsx-fig img{border:0;border-radius:0;box-shadow:none}

/* ================= proof ================= */
.bsx-q__stars{display:flex;gap:3px;color:var(--gold);margin-bottom:16px}
.bsx-q__av{width:40px;height:40px;overflow:hidden;padding:0;border-radius:999px}
.bsx-q__av img{width:100%;height:100%;object-fit:cover;display:block}

/* ================= steps ================= */
.bsx-steps__fill{
  position:absolute;left:0;top:19px;height:2px;width:0;background:var(--blue);
  transition:width 560ms var(--bsx-ease);border-radius:2px;
}
@media (max-width:900px){.bsx-steps__fill{display:none}}
.bsx-step{position:relative}
.bsx-step__top{display:flex;align-items:center;gap:12px}
.bsx-step__n{
  position:relative;z-index:1;
  transition:background 240ms var(--bsx-ease),color 240ms var(--bsx-ease),
             transform 240ms var(--bsx-ease),border-color 240ms var(--bsx-ease);
}
.bsx-step:hover .bsx-step__n{
  background:var(--blue);color:var(--white);border-color:var(--blue);transform:scale(1.08);
}
.bsx-step h3{margin-top:16px}

/* ================= faq ================= */
.bsx-chip{display:inline-flex;align-items:center;gap:8px;padding-inline:16px}
.bsx-acc__q{font-weight:700;font-size:16.5px;gap:16px}
.bsx-acc__qi{display:flex;align-items:flex-start;gap:13px;text-align:left}
.bsx-acc__a{display:flex;gap:13px;padding:2px 0 26px}
.bsx-acc__a p{margin-top:3px}

/* ===========================================================================
   [hidden] is a UA rule at specificity (0,1,0) — display:flex on the same
   element outranks it, which left every FAQ answer open. Any element that gets
   a display here has to restate the hidden case.
   ========================================================================== */
.bsx [hidden]{display:none !important}

/* ---- hero: the display face has almost no descender room, so the space
        under it has to be set explicitly rather than inherited.
        `.bsx p{margin:0}` is (0,1,1), so a class-only selector loses to it —
        these have to name the element as well. ---- */
.bsx p.bsx-hero__lead{margin-top:34px}
.bsx p.bsx-hero__note{margin-top:32px}
.bsx .bsx-hero__cta{margin-top:36px}
.bsx .bsx-hero h1{margin-top:28px;padding-bottom:6px}
/* same trap, same fix */
.bsx p.bsx-aeo__q{margin-top:10px}
.bsx p.bsx-close__note{margin-top:24px}

/* ---- clients: heading and marquee read as one block ---- */
.bsx-clients{text-align:center}
.bsx-clients h2{margin-bottom:34px}
.bsx-marquee{
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);
}
.bsx-marquee__set{align-items:center}

/* ---- impact: icon belongs with the label, not floating over the number ---- */
.bsx-headrow{align-items:center}
.bsx-ledger__cell{display:flex;flex-direction:column;padding:28px 22px 28px 0}
.bsx-ledger__n{order:1}
.bsx-ledger__meta{order:2;display:flex;align-items:center;gap:9px;margin-top:12px}
.bsx-ledger__meta svg{color:var(--blue);flex:0 0 auto}
.bsx-ledger__l{margin-top:0}
.bsx-fig img{max-height:340px;object-fit:cover;object-position:center}

/* ---- disciplines: a row is no longer one big link, so body copy keeps its
        own colour and the action sits under the text it belongs to ---- */
.bsx-index{border-top:1px solid var(--bsx-rule)}
.bsx-drow{
  display:grid;grid-template-columns:56px minmax(0,.9fr) minmax(0,1.3fr);
  gap:clamp(16px,2.6vw,44px);align-items:start;
  padding-block:clamp(26px,3vw,38px);border-bottom:1px solid var(--bsx-rule);
  position:relative;transition:background 260ms var(--bsx-ease);
}
.bsx-drow::after{
  content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;
  background:var(--blue);transform:scaleX(0);transform-origin:left;
  transition:transform 420ms var(--bsx-ease);
}
.bsx-drow:hover::after,.bsx-drow:focus-within::after{transform:scaleX(1)}
.bsx-drow__n{
  font-family:var(--font-display);font-size:14px;font-weight:700;color:var(--blue);
  font-variant-numeric:tabular-nums;padding-top:5px;
}
.bsx-drow__h{display:block;color:var(--navy)}
.bsx-drow__k{
  display:block;margin-top:9px;font-family:var(--font-system);font-size:12.5px;
  font-weight:600;color:var(--slate);
}
.bsx-drow__b{font-size:14.5px;line-height:1.62;color:var(--slate)}
.bsx-drow__cta{margin-top:18px}
@media (max-width:1024px){
  .bsx-drow{grid-template-columns:40px minmax(0,1fr);row-gap:14px}
  .bsx-drow__body{grid-column:2}
}

/* ---- versus: the badge lives with the column it describes ---- */
.bsx-vs__cap{display:none}
.bsx-vs__badge2{
  display:inline-flex;align-items:center;gap:7px;margin-left:10px;
  font-family:var(--font-system);font-size:11px;font-weight:700;
  color:var(--warning-text);background:var(--warning-surface);
  border:1px solid var(--warning-border);border-radius:999px;padding:4px 10px;
}
.bsx-vs__side{flex-wrap:wrap}

/* ---- outcomes: image beside the list, not stacked underneath it ---- */
.bsx-outsplit{
  display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);
  gap:clamp(26px,4vw,60px);align-items:start;
  margin-top:clamp(34px,4vw,52px);
}
@media (max-width:1000px){.bsx-outsplit{grid-template-columns:1fr}}
.bsx-out{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:0 clamp(20px,2.6vw,34px);margin-top:0;
}
@media (max-width:560px){.bsx-out{grid-template-columns:1fr}}
.bsx-outaside{
  position:sticky;top:96px;border-radius:18px;overflow:hidden;
  border:1px solid var(--mist-border);background:var(--white);
}
.bsx-outaside .bsx-fig img{border:0;border-radius:0;box-shadow:none;max-height:none}
.bsx-outwrap,.bsx-outwrap__pad{display:contents}

/* ---- steps: one badge, not a number and an icon competing ---- */
.bsx-step__top{gap:0}
.bsx-step__badge{
  position:relative;z-index:1;width:52px;height:52px;border-radius:999px;
  display:grid;place-items:center;background:var(--white);
  border:1.5px solid var(--border);color:var(--blue);
  transition:background 260ms var(--bsx-ease),color 260ms var(--bsx-ease),
             border-color 260ms var(--bsx-ease),transform 260ms var(--bsx-ease);
}
.bsx-mist .bsx-step__badge{background:var(--mist)}
.bsx-step:hover .bsx-step__badge{
  background:var(--blue);border-color:var(--blue);color:var(--white);transform:scale(1.06);
}
.bsx-step__num{
  position:absolute;top:-6px;right:-6px;min-width:22px;height:22px;padding:0 6px;
  border-radius:999px;display:grid;place-items:center;
  background:var(--navy);color:var(--white);
  font-family:var(--font-display);font-size:11px;font-weight:700;
  font-variant-numeric:tabular-nums;
}
.bsx-steps__line,.bsx-steps__fill{top:26px}
.bsx-step h3{margin-top:20px}

/* ---- faq: an icon per question, and only one answer open at a time ---- */
.bsx-acc__q{align-items:center}
.bsx-acc__qwrap{display:flex;align-items:center;gap:13px;min-width:0}
.bsx-acc__qic{
  flex:0 0 auto;width:30px;height:30px;border-radius:9px;display:grid;
  place-items:center;background:var(--white);border:1px solid var(--mist-border);
  color:var(--blue);
  transition:background 220ms var(--bsx-ease),color 220ms var(--bsx-ease);
}
.bsx-acc__q[aria-expanded="true"] .bsx-acc__qic{background:var(--blue);color:var(--white)}
.bsx-acc__q:hover .bsx-acc__qic{background:var(--mist)}
.bsx-acc__q[aria-expanded="true"]:hover .bsx-acc__qic{background:var(--blue)}
.bsx-acc__a{padding-left:43px}

/* ================= answer block (the AEO/featured-snippet target) ======== */
.bsx-answer{
  display:flex;gap:16px;align-items:flex-start;
  border:1px solid var(--mist-border);background:var(--white);
  border-radius:18px;padding:clamp(22px,2.6vw,32px);
  border-left:3px solid var(--blue);
}
[data-bsx-dark] .bsx-answer{
  background:rgba(235,245,255,.06);border-color:var(--bsx-rule-dark);
  border-left-color:var(--teal);
}
.bsx-answer p{font-size:16.5px;line-height:1.66;max-width:74ch}
.bsx-answer .bsx-ic{margin-top:2px}

/* ================= anchor rail / on-page contents ======================== */
.bsx-toc{
  display:flex;flex-wrap:wrap;gap:9px;padding-block:clamp(20px,2.2vw,28px);
  border-block:1px solid var(--bsx-rule);
}
.bsx-toc a{
  display:inline-flex;align-items:center;gap:8px;height:38px;padding-inline:15px;
  border-radius:999px;background:var(--white);border:1px solid var(--border);
  font-family:var(--font-system);font-size:13px;font-weight:600;color:var(--slate);
  text-decoration:none;
  transition:border-color 220ms var(--bsx-ease),color 220ms var(--bsx-ease),
             transform 220ms var(--bsx-ease);
}
.bsx-toc a:hover{border-color:var(--blue);color:var(--navy);transform:translateY(-2px)}

/* ================= tabs ================= */
.bsx-tabs{margin-top:clamp(30px,3.6vw,46px)}
.bsx-tabs__rail{display:flex;flex-wrap:wrap;gap:9px;margin-bottom:28px}
.bsx-tabs__panel h3{font-size:21px;line-height:1.28;letter-spacing:-.02em}
.bsx-tabs__panel p{margin-top:12px;font-size:15px;line-height:1.62;max-width:70ch}
.bsx-tabs__grid{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.8fr);
  gap:clamp(24px,3.4vw,52px);align-items:start;
}
@media (max-width:900px){.bsx-tabs__grid{grid-template-columns:1fr}}

/* ================= check lists ================= */
.bsx-checks{list-style:none;margin:18px 0 0;padding:0;display:grid;gap:11px}
.bsx-checks li{
  display:flex;gap:11px;align-items:flex-start;
  font-family:var(--font-system);font-size:14.5px;line-height:1.55;color:var(--slate);
}
[data-bsx-dark] .bsx-checks li{color:var(--bsx-ink-dark)}
.bsx-checks li svg{flex:0 0 auto;margin-top:3px;color:var(--success-solid)}
[data-bsx-dark] .bsx-checks li svg{color:var(--teal)}

/* ================= deliverable cards ================= */
.bsx-cards{
  margin-top:clamp(32px,3.8vw,50px);display:grid;
  grid-template-columns:repeat(auto-fit,minmax(292px,1fr));gap:clamp(16px,2vw,24px);
}
.bsx-card{
  display:flex;flex-direction:column;padding:26px 24px;border-radius:16px;
  background:var(--white);border:1px solid var(--border);
  transition:border-color 260ms var(--bsx-ease),transform 260ms var(--bsx-ease),
             box-shadow 260ms var(--bsx-ease);
}
.bsx-card:hover{
  border-color:var(--blue);transform:translateY(-3px);
  box-shadow:0 20px 40px -26px rgba(12,22,61,.44);
}
[data-bsx-dark] .bsx-card{background:rgba(235,245,255,.06);border-color:var(--bsx-rule-dark)}
[data-bsx-dark] .bsx-card:hover{border-color:var(--teal)}
.bsx-card__top{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.bsx-card__chip{
  display:inline-flex;align-items:center;font-family:var(--font-system);
  font-size:11px;font-weight:700;color:var(--info-text);background:var(--info-surface);
  border:1px solid var(--info-border);border-radius:999px;padding:4px 10px;
  margin-left:auto;white-space:nowrap;
}
.bsx-card h3{font-size:17.5px;line-height:1.3;letter-spacing:-.018em}
.bsx-card p{margin-top:11px;font-size:14.5px;line-height:1.6;flex:1 1 auto}

/* ================= model cards ================= */
.bsx-models{
  margin-top:clamp(32px,3.8vw,50px);display:grid;
  grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:clamp(16px,2vw,24px);
}
.bsx-model{
  display:flex;flex-direction:column;padding:28px 26px;border-radius:18px;
  background:var(--white);border:1px solid var(--border);
}
[data-bsx-dark] .bsx-model{background:rgba(235,245,255,.06);border-color:var(--bsx-rule-dark)}
.bsx-model__top{display:flex;align-items:center;gap:12px}
.bsx-model h3{font-size:18px;line-height:1.3;letter-spacing:-.02em}
.bsx-model .bsx-checks{margin-top:16px}

/* ================= tiles ================= */
.bsx-tiles{
  margin-top:clamp(30px,3.6vw,46px);display:grid;
  grid-template-columns:repeat(auto-fit,minmax(236px,1fr));
  gap:0;border-top:1px solid var(--bsx-rule);border-left:1px solid var(--bsx-rule);
}
[data-bsx-dark] .bsx-tiles{border-color:var(--bsx-rule-dark)}
.bsx-tile{
  padding:24px 22px;border-right:1px solid var(--bsx-rule);
  border-bottom:1px solid var(--bsx-rule);
  transition:background 240ms var(--bsx-ease);
}
[data-bsx-dark] .bsx-tile{border-color:var(--bsx-rule-dark)}
.bsx-tile:hover{background:rgba(235,245,255,.55)}
.bsx-mist .bsx-tile:hover{background:rgba(255,255,255,.62)}
[data-bsx-dark] .bsx-tile:hover{background:rgba(235,245,255,.06)}
.bsx-tile__top{display:flex;align-items:center;gap:11px;margin-bottom:11px}
.bsx-tile h3{font-size:15.5px;line-height:1.34;letter-spacing:-.012em}
.bsx-tile p{font-size:14px;line-height:1.55}

/* ================= before / after pairs ================= */
.bsx-pairs{margin-top:clamp(30px,3.6vw,46px);display:grid;gap:clamp(14px,1.8vw,20px)}
.bsx-pair{
  display:grid;grid-template-columns:minmax(0,1fr) 44px minmax(0,1fr);
  align-items:stretch;gap:0;border-radius:16px;overflow:hidden;
  border:1px solid var(--bsx-rule);
}
@media (max-width:820px){
  .bsx-pair{grid-template-columns:1fr}
  .bsx-pair__arrow{display:none}
}
.bsx-pair__side{padding:22px 24px;background:var(--white)}
.bsx-pair__side--after{background:var(--mist)}
.bsx-mist .bsx-pair__side{background:var(--white)}
.bsx-mist .bsx-pair__side--after{background:rgba(49,92,253,.07)}
.bsx-pair__k{
  display:flex;align-items:center;gap:8px;font-family:var(--font-system);
  font-size:11.5px;font-weight:700;color:var(--slate);margin-bottom:10px;
}
.bsx-pair__side--after .bsx-pair__k{color:var(--blue)}
.bsx-pair h3{font-size:16.5px;line-height:1.32;letter-spacing:-.016em}
.bsx-pair p{margin-top:9px;font-size:14.5px;line-height:1.58}
.bsx-pair__arrow{
  display:grid;place-items:center;background:var(--white);color:var(--blue);
  border-inline:1px solid var(--bsx-rule);
}

/* ================= related links ================= */
.bsx-related{
  margin-top:clamp(30px,3.6vw,46px);display:grid;
  grid-template-columns:repeat(auto-fit,minmax(268px,1fr));gap:clamp(16px,2vw,22px);
}
.bsx-rel{
  display:flex;flex-direction:column;gap:10px;padding:24px 22px;border-radius:16px;
  background:var(--white);border:1px solid var(--border);text-decoration:none;
  transition:border-color 240ms var(--bsx-ease),transform 240ms var(--bsx-ease);
}
.bsx-rel:hover{border-color:var(--blue);transform:translateY(-3px)}
.bsx-rel__t{
  font-family:var(--font-display);font-size:16.5px;font-weight:700;color:var(--navy);
  letter-spacing:-.016em;line-height:1.3;
}
.bsx-rel p{font-size:14px;line-height:1.55;flex:1 1 auto}
.bsx-rel__go{
  display:inline-flex;align-items:center;gap:8px;font-family:var(--font-system);
  font-size:13.5px;font-weight:700;color:var(--blue);
}
.bsx-rel:hover .bsx-rel__go svg{transform:translateX(4px)}
.bsx-rel__go svg{transition:transform 260ms var(--bsx-ease)}

/* ================= generic two-column media row ================= */
.bsx-mrow{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.82fr);
  gap:clamp(24px,3.6vw,60px);align-items:center;
  padding-block:clamp(26px,3vw,40px);border-bottom:1px solid var(--bsx-rule);
}
.bsx-mrow:last-child{border-bottom:0}
@media (max-width:900px){.bsx-mrow{grid-template-columns:1fr}}
.bsx-mrow:nth-child(even) .bsx-mrow__media{order:-1}
@media (max-width:900px){.bsx-mrow:nth-child(even) .bsx-mrow__media{order:0}}
.bsx-mrow h3{font-size:20px;line-height:1.28;letter-spacing:-.02em}
.bsx-mrow p{margin-top:12px;font-size:15px;line-height:1.62}

/* ================= section figure sizing on inner pages ================= */
.bsx-fig--wide img{max-height:420px}
.bsx-fig--tall img{max-height:none}

/* ---- pairs on a dark band ---- */
[data-bsx-dark] .bsx-pair{border-color:var(--bsx-rule-dark)}
[data-bsx-dark] .bsx-pair__side{background:rgba(235,245,255,.05)}
[data-bsx-dark] .bsx-pair__side--after{background:rgba(49,92,253,.20)}
[data-bsx-dark] .bsx-pair__arrow{
  background:rgba(235,245,255,.05);border-inline-color:var(--bsx-rule-dark);
  color:var(--teal);
}
[data-bsx-dark] .bsx-pair h3{color:var(--white)}
[data-bsx-dark] .bsx-pair p{color:var(--bsx-ink-dark)}
[data-bsx-dark] .bsx-pair__k{color:var(--bsx-ink-dark)}
[data-bsx-dark] .bsx-pair__side--after .bsx-pair__k{color:var(--teal)}

/* ---- the metric ledger on a dark band ---- */
[data-bsx-dark] .bsx-ledger,
[data-bsx-dark] .bsx-ledger__cell{border-color:var(--bsx-rule-dark)}
[data-bsx-dark] .bsx-ledger{border-top-color:var(--bsx-rule-dark)}
[data-bsx-dark] .bsx-ledger__n{color:var(--white)}
[data-bsx-dark] .bsx-ledger__l{color:var(--bsx-ink-dark)}
[data-bsx-dark] .bsx-ledger__meta svg{color:var(--teal)}
[data-bsx-dark] .bsx-ledger__cell::before{background:var(--teal)}
[data-bsx-dark] .bsx-ledger__foot{border-top-color:var(--bsx-rule-dark)}
[data-bsx-dark] .bsx-ledger__foot p{color:var(--bsx-ink-dark)}

/* ---- tiles, cards and models on a dark band ---- */
[data-bsx-dark] .bsx-tiles,
[data-bsx-dark] .bsx-tile{border-color:var(--bsx-rule-dark)}
[data-bsx-dark] .bsx-tile h3{color:var(--white)}
[data-bsx-dark] .bsx-tile p{color:var(--bsx-ink-dark)}
[data-bsx-dark] .bsx-card h3,[data-bsx-dark] .bsx-model h3{color:var(--white)}
[data-bsx-dark] .bsx-card p,[data-bsx-dark] .bsx-model p{color:var(--bsx-ink-dark)}
[data-bsx-dark] .bsx-card__chip{
  background:rgba(40,220,209,.14);border-color:rgba(40,220,209,.34);color:var(--teal);
}
[data-bsx-dark] .bsx-rel{background:rgba(235,245,255,.06);border-color:var(--bsx-rule-dark)}
[data-bsx-dark] .bsx-rel__t{color:var(--white)}
[data-bsx-dark] .bsx-rel p{color:var(--bsx-ink-dark)}
[data-bsx-dark] .bsx-rel__go{color:var(--teal)}
[data-bsx-dark] .bsx-rel:hover{border-color:var(--teal)}

/* ---- steps and the on-page contents on a dark band ---- */
[data-bsx-dark] .bsx-step__badge{
  background:rgba(235,245,255,.06);border-color:var(--bsx-rule-dark);color:var(--teal);
}
[data-bsx-dark] .bsx-step:hover .bsx-step__badge{
  background:var(--teal);border-color:var(--teal);color:var(--navy);
}
[data-bsx-dark] .bsx-step__num{background:var(--teal);color:var(--navy)}
[data-bsx-dark] .bsx-steps__line{background:var(--bsx-rule-dark)}
[data-bsx-dark] .bsx-steps__fill{background:var(--teal)}
[data-bsx-dark] .bsx-toc a{
  background:rgba(235,245,255,.06);border-color:var(--bsx-rule-dark);color:var(--bsx-ink-dark);
}
[data-bsx-dark] .bsx-toc a:hover{border-color:var(--teal);color:var(--white)}
[data-bsx-dark] .bsx-toc{border-block-color:var(--bsx-rule-dark)}

/* ---- tabs and disclosure on a dark band ---- */
[data-bsx-dark] .bsx button.bsx-chip,
.bsx [data-bsx-dark] button.bsx-chip{
  background:rgba(235,245,255,.06);border-color:var(--bsx-rule-dark);color:var(--bsx-ink-dark);
}
[data-bsx-dark] .bsx button.bsx-chip[aria-pressed="true"],
.bsx [data-bsx-dark] button.bsx-chip[aria-pressed="true"]{
  background:var(--teal);border-color:var(--teal);color:var(--navy);
}
[data-bsx-dark] .bsx-tabs__panel h3{color:var(--white)}
[data-bsx-dark] .bsx-tabs__panel p{color:var(--bsx-ink-dark)}
[data-bsx-dark] .bsx-acc,[data-bsx-dark] .bsx-acc__q,
[data-bsx-dark] .bsx-acc__a{border-color:var(--bsx-rule-dark)}
[data-bsx-dark] .bsx button.bsx-acc__q{color:var(--white)}
[data-bsx-dark] .bsx button.bsx-acc__q:hover{color:var(--teal)}
[data-bsx-dark] .bsx-acc__qic{
  background:rgba(235,245,255,.06);border-color:var(--bsx-rule-dark);color:var(--teal);
}
[data-bsx-dark] .bsx-acc__i{border-color:var(--bsx-rule-dark);color:var(--teal)}
[data-bsx-dark] .bsx-acc__a p{color:var(--bsx-ink-dark)}

/* ---- the mrow media divider on a dark band ---- */
[data-bsx-dark] .bsx-mrow{border-bottom-color:var(--bsx-rule-dark)}
[data-bsx-dark] .bsx-mrow h3{color:var(--white)}
[data-bsx-dark] .bsx-mrow p{color:var(--bsx-ink-dark)}
[data-bsx-dark] .bsx-index,[data-bsx-dark] .bsx-drow{border-color:var(--bsx-rule-dark)}
[data-bsx-dark] .bsx-drow__h{color:var(--white)}
[data-bsx-dark] .bsx-drow__b,[data-bsx-dark] .bsx-drow__k{color:var(--bsx-ink-dark)}

/* small print inherits the band, not the light default */
[data-bsx-dark] .bsx-sm,[data-bsx-dark] .bsx-sm strong{color:var(--bsx-ink-dark)}
[data-bsx-dark] .bsx-checks li svg{color:var(--teal)}

/* ---- inline links inside body copy ----
   The Elementor kit colours every <a> with Action Blue at (0,1,1). On a navy
   band that lands at 2.95:1, so the dark bands claim their own link colour. */
.bsx p a, .bsx li a, .bsx .bsx-lead a, .bsx .bsx-answer a{
  color:var(--blue);text-decoration:underline;text-underline-offset:.2em;
}
.bsx p a:hover, .bsx li a:hover, .bsx .bsx-lead a:hover{color:var(--blue-hover)}
[data-bsx-dark] p a, [data-bsx-dark] li a,
[data-bsx-dark] .bsx-lead a, [data-bsx-dark] .bsx-answer a{color:var(--teal)}
[data-bsx-dark] p a:hover, [data-bsx-dark] li a:hover,
[data-bsx-dark] .bsx-lead a:hover{color:var(--white)}

/* ---- links only underline on hover ---- */
.bsx .bsx-dir__list a,
.bsx .bsx-rel,
.bsx .bsx-svc{text-decoration:none}
.bsx .bsx-dir__list a:hover{text-decoration:underline;text-underline-offset:.22em}
.bsx p a,.bsx li a,.bsx .bsx-lead a,.bsx .bsx-answer a{text-decoration:none}
.bsx p a:hover,.bsx li a:hover,.bsx .bsx-lead a:hover,
.bsx .bsx-answer a:hover{text-decoration:underline;text-underline-offset:.22em}

/* ---- section heads: let a title hold one line where it can ---- */
.bsx .bsx-headwide{max-width:none}
.bsx .bsx-headwide .bsx-d2{text-wrap:nowrap}
@media (max-width:1100px){.bsx .bsx-headwide .bsx-d2{text-wrap:balance}}
.bsx .bsx-headwide .bsx-lead{max-width:62ch}

/* ================= faq, cleaned up ================= */
.bsx .bsx-acc__a{display:block;padding:0 0 26px 43px}
.bsx .bsx-acc__a p{margin:0;font-size:15.5px;line-height:1.7;max-width:76ch;color:var(--slate)}
[data-bsx-dark] .bsx-acc__a p{color:var(--bsx-ink-dark)}

/* ================= three systems ================= */
.bsx-systems{
  margin-top:clamp(32px,3.8vw,50px);display:grid;
  grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:clamp(16px,2vw,24px);
}
.bsx-sys{
  display:flex;flex-direction:column;padding:28px 26px;border-radius:20px;
  background:var(--white);border:1px solid var(--border);
  transition:border-color 260ms var(--bsx-ease),transform 260ms var(--bsx-ease),
             box-shadow 260ms var(--bsx-ease);
}
.bsx-sys:hover{border-color:var(--blue);transform:translateY(-3px);
  box-shadow:0 22px 44px -28px rgba(12,22,61,.42)}
[data-bsx-dark] .bsx-sys{background:rgba(235,245,255,.06);border-color:var(--bsx-rule-dark)}
.bsx-sys__top{display:flex;align-items:center;gap:12px;margin-bottom:16px}
.bsx-sys__tag{
  font-family:var(--font-system);font-size:11.5px;font-weight:700;color:var(--blue);
  background:var(--info-surface);border:1px solid var(--info-border);
  border-radius:999px;padding:4px 11px;margin-left:auto;
}
[data-bsx-dark] .bsx-sys__tag{background:rgba(40,220,209,.14);border-color:rgba(40,220,209,.34);color:var(--teal)}
.bsx-sys h3{font-size:19px;line-height:1.28;letter-spacing:-.02em}
.bsx-sys p{margin-top:12px;font-size:14.5px;line-height:1.6;flex:1 1 auto}
.bsx-sys__stats{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;
  margin-top:20px;border-top:1px solid var(--bsx-rule);padding-top:16px;
}
[data-bsx-dark] .bsx-sys__stats{border-top-color:var(--bsx-rule-dark)}
.bsx-sys__stat{padding-right:10px}
.bsx-sys__n{
  display:block;font-family:var(--font-display);font-size:23px;font-weight:700;
  color:var(--navy);letter-spacing:-.03em;font-variant-numeric:tabular-nums;
}
[data-bsx-dark] .bsx-sys__n{color:var(--white)}
.bsx-sys__lbl{
  display:block;margin-top:5px;font-family:var(--font-system);font-size:10.5px;
  font-weight:700;color:var(--slate);line-height:1.35;
}
[data-bsx-dark] .bsx-sys__lbl{color:var(--bsx-ink-dark)}
.bsx-sys .bsx-act{margin-top:18px;align-self:flex-start}

/* ================= proof bento ================= */
.bsx-bento{
  margin-top:clamp(32px,3.8vw,50px);display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(14px,1.8vw,20px);
}
@media (max-width:980px){.bsx-bento{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.bsx-bento{grid-template-columns:1fr}}
.bsx-bento__wide{
  grid-column:span 2;padding:28px 26px;border-radius:18px;
  background:var(--white);border:1px solid var(--border);
}
@media (max-width:560px){.bsx-bento__wide{grid-column:span 1}}
[data-bsx-dark] .bsx-bento__wide{background:rgba(235,245,255,.06);border-color:var(--bsx-rule-dark)}
.bsx-bento__wide h3{font-size:18px;line-height:1.3;letter-spacing:-.02em;margin-top:14px}
.bsx-bento__wide p{margin-top:11px;font-size:14.5px;line-height:1.6}
.bsx-bento__m{
  padding:24px 22px;border-radius:18px;background:var(--mist);
  border:1px solid var(--mist-border);display:flex;flex-direction:column;
}
.bsx-mist .bsx-bento__m{background:var(--white)}
[data-bsx-dark] .bsx-bento__m{background:rgba(49,92,253,.16);border-color:var(--bsx-rule-dark)}
.bsx-bento__n{
  font-family:var(--font-display);font-size:clamp(28px,3vw,38px);font-weight:700;
  color:var(--navy);letter-spacing:-.035em;line-height:1;font-variant-numeric:tabular-nums;
}
[data-bsx-dark] .bsx-bento__n{color:var(--white)}
.bsx-bento__l{
  margin-top:10px;font-family:var(--font-system);font-size:12.5px;font-weight:600;
  line-height:1.45;color:var(--slate);
}
[data-bsx-dark] .bsx-bento__l{color:var(--bsx-ink-dark)}

/* ================= the funnel ================= */
.bsx-funnel{margin-top:clamp(32px,3.8vw,52px);display:grid;gap:0}
.bsx-fstage{
  display:grid;grid-template-columns:56px minmax(0,1fr) auto;gap:clamp(14px,2vw,28px);
  align-items:center;padding:20px 24px;position:relative;
  border:1px solid var(--bsx-rule);border-bottom:0;
  background:var(--white);
  transition:background 280ms var(--bsx-ease),transform 280ms var(--bsx-ease);
}
.bsx-fstage:first-child{border-radius:18px 18px 0 0}
.bsx-fstage:last-child{border-bottom:1px solid var(--bsx-rule);border-radius:0 0 18px 18px}
[data-bsx-dark] .bsx-fstage{background:rgba(235,245,255,.05);border-color:var(--bsx-rule-dark)}
/* each stage is narrower than the one above it, so the shape reads as a funnel */
.bsx-fstage:nth-child(1){width:100%}
.bsx-fstage:nth-child(2){width:94%;margin-inline:auto}
.bsx-fstage:nth-child(3){width:88%;margin-inline:auto}
.bsx-fstage:nth-child(4){width:82%;margin-inline:auto}
.bsx-fstage:nth-child(5){width:76%;margin-inline:auto}
@media (max-width:700px){.bsx-fstage{width:100%!important;grid-template-columns:44px minmax(0,1fr)}}
.bsx-fstage:hover{background:var(--mist);transform:translateY(-2px);z-index:1}
[data-bsx-dark] .bsx-fstage:hover{background:rgba(49,92,253,.18)}
.bsx-fstage__n{
  width:40px;height:40px;border-radius:999px;display:grid;place-items:center;
  background:var(--mist);color:var(--blue);font-family:var(--font-display);
  font-size:13px;font-weight:700;font-variant-numeric:tabular-nums;
  border:1px solid var(--mist-border);
  transition:background 260ms var(--bsx-ease),color 260ms var(--bsx-ease);
}
[data-bsx-dark] .bsx-fstage__n{background:rgba(40,220,209,.14);border-color:rgba(40,220,209,.34);color:var(--teal)}
.bsx-fstage:hover .bsx-fstage__n{background:var(--blue);color:var(--white);border-color:var(--blue)}
.bsx-fstage__t{
  font-family:var(--font-display);font-size:17px;font-weight:700;color:var(--navy);
  letter-spacing:-.018em;
}
[data-bsx-dark] .bsx-fstage__t{color:var(--white)}
.bsx-fstage__b{margin-top:5px;font-size:14px;line-height:1.55;color:var(--slate)}
[data-bsx-dark] .bsx-fstage__b{color:var(--bsx-ink-dark)}
.bsx-fstage__bar{
  width:clamp(60px,12vw,150px);height:8px;border-radius:999px;background:var(--mist);
  overflow:hidden;flex:0 0 auto;
}
[data-bsx-dark] .bsx-fstage__bar{background:rgba(235,245,255,.12)}
@media (max-width:700px){.bsx-fstage__bar{display:none}}
.bsx-fstage__fill{
  display:block;height:100%;border-radius:999px;background:var(--blue);
  transition:filter 260ms var(--bsx-ease);
}
[data-bsx-dark] .bsx-fstage__fill{background:var(--teal)}
.bsx-fstage:hover .bsx-fstage__fill{filter:brightness(1.15)}

/* ================= hover-reveal outcome cards ================= */
.bsx-reveal{
  margin-top:clamp(32px,3.8vw,50px);display:grid;
  grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:clamp(14px,1.8vw,22px);
}
.bsx-rc{
  position:relative;border-radius:18px;overflow:hidden;isolation:isolate;
  border:1px solid var(--border);background:var(--white);min-height:230px;
  display:flex;flex-direction:column;justify-content:flex-end;
  transition:border-color 300ms var(--bsx-ease),transform 300ms var(--bsx-ease),
             box-shadow 300ms var(--bsx-ease);
}
.bsx-rc:hover,.bsx-rc:focus-within{
  border-color:var(--blue);transform:translateY(-4px);
  box-shadow:0 26px 50px -30px rgba(12,22,61,.5);
}
[data-bsx-dark] .bsx-rc{background:rgba(235,245,255,.06);border-color:var(--bsx-rule-dark)}
/* an abstract corridor field, drawn rather than sourced */
.bsx-rc__art{
  position:absolute;inset:0;z-index:-1;
  background:
    radial-gradient(120% 90% at 12% 6%, rgba(49,92,253,.20), transparent 62%),
    radial-gradient(110% 80% at 92% 10%, rgba(40,220,209,.20), transparent 60%),
    repeating-linear-gradient(115deg, rgba(12,22,61,.05) 0 1px, transparent 1px 15px),
    var(--mist);
  transition:transform 620ms var(--bsx-ease),opacity 300ms var(--bsx-ease);
}
[data-bsx-dark] .bsx-rc__art{
  background:
    radial-gradient(120% 90% at 12% 6%, rgba(49,92,253,.34), transparent 62%),
    radial-gradient(110% 80% at 92% 10%, rgba(40,220,209,.26), transparent 60%),
    repeating-linear-gradient(115deg, rgba(235,245,255,.06) 0 1px, transparent 1px 15px),
    var(--navy-soft);
}
.bsx-rc:hover .bsx-rc__art{transform:scale(1.06)}
.bsx-rc__head{padding:22px 22px 0;display:flex;align-items:center;gap:11px}
.bsx-rc h3{font-size:16.5px;line-height:1.3;letter-spacing:-.018em}
.bsx-rc__body{
  padding:14px 22px 22px;
  /* the body sits folded away until the card is hovered or focused */
  max-height:0;opacity:0;overflow:hidden;
  transition:max-height 420ms var(--bsx-ease),opacity 300ms var(--bsx-ease),
             padding 420ms var(--bsx-ease);
  padding-block:0;
}
.bsx-rc:hover .bsx-rc__body,.bsx-rc:focus-within .bsx-rc__body{
  max-height:260px;opacity:1;padding-block:14px 22px;
}
@media (prefers-reduced-motion:reduce){
  .bsx-rc__body{max-height:none;opacity:1;padding-block:14px 22px}
}
.bsx-rc__spacer{flex:1 1 auto;min-height:70px}
.bsx-rc p{font-size:14px;line-height:1.58}

/* ================= a real cta card ================= */
.bsx-ctacard{
  margin-top:clamp(26px,3vw,38px);display:flex;flex-wrap:wrap;gap:22px;
  align-items:center;justify-content:space-between;
  padding:clamp(24px,3vw,34px);border-radius:20px;
  background:var(--navy);color:var(--white);
}
.bsx-ctacard h3{font-size:clamp(20px,2.2vw,27px);line-height:1.22;
  letter-spacing:-.024em;color:var(--white)}
.bsx-ctacard p{margin-top:10px;font-size:15px;line-height:1.6;
  color:var(--bsx-ink-dark);max-width:56ch}
.bsx-ctacard__txt{flex:1 1 380px;min-width:0}
.bsx-ctacard a.bsx-btn{background:var(--teal);border-color:var(--teal);color:var(--navy);
  box-shadow:0 12px 26px -14px rgba(40,220,209,.7)}
.bsx-ctacard a.bsx-btn:hover{background:var(--white);border-color:var(--white);color:var(--navy)}
.bsx-ctacard a.bsx-btn,.bsx-ctacard a.bsx-btn:link,
.bsx-ctacard a.bsx-btn:visited{color:var(--navy)}

/* ================= linked service cards ================= */
.bsx-svcs{
  margin-top:clamp(32px,3.8vw,50px);display:grid;
  grid-template-columns:repeat(auto-fit,minmax(276px,1fr));gap:clamp(14px,1.8vw,22px);
}
.bsx-svc{
  display:flex;flex-direction:column;padding:24px 22px;border-radius:16px;
  background:var(--white);border:1px solid var(--border);
  transition:border-color 250ms var(--bsx-ease),transform 250ms var(--bsx-ease),
             box-shadow 250ms var(--bsx-ease);
}
.bsx-svc:hover{border-color:var(--blue);transform:translateY(-3px);
  box-shadow:0 20px 40px -26px rgba(12,22,61,.42)}
[data-bsx-dark] .bsx-svc{background:rgba(235,245,255,.06);border-color:var(--bsx-rule-dark)}
.bsx-svc h3{margin-top:14px;font-size:16.5px;line-height:1.3;letter-spacing:-.018em}
.bsx-svc p{margin-top:10px;font-size:14px;line-height:1.58;flex:1 1 auto}
.bsx-svc__go{
  margin-top:16px;display:inline-flex;align-items:center;gap:8px;
  font-family:var(--font-system);font-size:13.5px;font-weight:700;color:var(--blue);
}
.bsx-svc__go svg{transition:transform 260ms var(--bsx-ease)}
.bsx-svc:hover .bsx-svc__go svg{transform:translateX(4px)}
[data-bsx-dark] .bsx-svc__go{color:var(--teal)}

/* ================= tab panel visual ================= */
.bsx-tabviz{
  border-radius:16px;border:1px solid var(--mist-border);background:var(--white);
  padding:22px;display:grid;gap:10px;align-content:start;
}
[data-bsx-dark] .bsx-tabviz{background:rgba(235,245,255,.05);border-color:var(--bsx-rule-dark)}
.bsx-tabviz__row{display:flex;align-items:center;gap:11px}
.bsx-tabviz__bar{
  flex:1 1 auto;height:9px;border-radius:999px;background:var(--mist);overflow:hidden;
}
[data-bsx-dark] .bsx-tabviz__bar{background:rgba(235,245,255,.12)}
.bsx-tabviz__bar i{
  display:block;height:100%;border-radius:999px;background:var(--blue);
  animation:bsx-grow 900ms var(--bsx-ease) both;
}
[data-bsx-dark] .bsx-tabviz__bar i{background:var(--teal)}
@keyframes bsx-grow{from{width:0}}
.bsx-tabviz__k{
  font-family:var(--font-system);font-size:11.5px;font-weight:700;color:var(--slate);
  min-width:86px;
}
[data-bsx-dark] .bsx-tabviz__k{color:var(--bsx-ink-dark)}

/* ---- keep figures a consistent height so sections stay cohesive ---- */
.bsx .bsx-fig img{max-height:300px;object-fit:cover;object-position:center}
.bsx .bsx-hero__fig img{max-height:none}
.bsx .bsx-mrow__media .bsx-fig img{max-height:250px}

/* ---- step rail sized to its own step count ----
   A fixed four-column grid left the connecting line running 500px past the
   last badge whenever a section had three steps. */
.bsx .bsx-steps__grid{
  grid-template-columns:repeat(var(--bsx-steps,4),minmax(0,1fr));
}
/* a badge sits at the START of its column, not centred in it, so the rail runs
   from the first badge's centre to the last badge's centre */
.bsx .bsx-steps__line,
.bsx .bsx-steps__fill{
  left:26px;
  right:calc(100% / var(--bsx-steps,4) - 26px);
  width:auto;
}
.bsx .bsx-steps__fill{right:auto;width:0;
  max-width:calc(100% - 26px - (100% / var(--bsx-steps,4) - 26px))}
@media (max-width:900px){
  .bsx .bsx-steps__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:560px){
  .bsx .bsx-steps__grid{grid-template-columns:1fr}
}

/* ===========================================================================
   Review round three
   ========================================================================== */

/* ---- reveal cards: a grid-row transition instead of a max-height guess ----
   max-height animates against an invented ceiling, so the card jumps when the
   real height is shorter and clips when it is taller. Animating a grid track
   from 0fr to 1fr moves to the content's own height, which is smooth both
   ways and needs no magic number. */
.bsx .bsx-reveal{grid-template-columns:repeat(auto-fit,minmax(258px,1fr))}
@media (min-width:1000px){
  /* five cards land as 3 + 2 rather than an orphaned 4 + 1 */
  .bsx .bsx-reveal{grid-template-columns:repeat(3,minmax(0,1fr))}
}
.bsx .bsx-rc{min-height:190px}
.bsx .bsx-rc__spacer{min-height:40px}
.bsx .bsx-rc__body{
  display:grid;grid-template-rows:0fr;
  max-height:none;overflow:hidden;opacity:0;
  padding-block:0;
  transition:grid-template-rows 420ms var(--bsx-ease),
             opacity 260ms var(--bsx-ease),
             padding-block 420ms var(--bsx-ease);
}
.bsx .bsx-rc__body > *{min-height:0;overflow:hidden}
.bsx .bsx-rc:hover .bsx-rc__body,
.bsx .bsx-rc:focus-within .bsx-rc__body{
  grid-template-rows:1fr;opacity:1;padding-block:12px 22px;
}
.bsx .bsx-rc__art{transition:transform 700ms var(--bsx-ease)}
@media (prefers-reduced-motion:reduce){
  .bsx .bsx-rc__body{grid-template-rows:1fr;opacity:1;padding-block:12px 22px}
  .bsx .bsx-rc,.bsx .bsx-rc__art{transition:none}
  .bsx .bsx-rc:hover{transform:none}
}

/* ---- leftover copy reads as a quiet footnote, not as a headline card ---- */
.bsx .bsx-meta{
  margin-top:20px;display:grid;gap:8px;padding-top:16px;
  border-top:1px solid var(--bsx-rule);
}
[data-bsx-dark] .bsx-meta{border-top-color:var(--bsx-rule-dark)}
.bsx .bsx-meta p{
  font-family:var(--font-system);font-size:13px;line-height:1.6;color:var(--slate);
  margin:0;max-width:82ch;
}
[data-bsx-dark] .bsx-meta p{color:var(--bsx-ink-dark)}
.bsx .bsx-meta b{color:var(--navy);font-weight:700}
[data-bsx-dark] .bsx-meta b{color:var(--white)}

/* ---- the claim ledger: a statement first, its figure second ----
   Four large numerals turned "0 compliance shortcuts" into a score nobody
   could read. Leading with the label makes each tile a sentence. */
/* the markup already runs icon, label, figure — so plain column order puts the
   claim first and its figure underneath, which is the way round that reads */
.bsx .bsx-bento__m{
  flex-direction:column;justify-content:flex-start;gap:0;
  padding:22px 20px;
}
.bsx .bsx-bento__m .bsx-bento__n{
  font-size:clamp(22px,2.2vw,28px);margin-top:12px;line-height:1;
}
.bsx .bsx-bento__m .bsx-bento__l{
  margin-top:0;font-size:14px;font-weight:700;line-height:1.35;color:var(--navy);
}
[data-bsx-dark] .bsx .bsx-bento__m .bsx-bento__l,
[data-bsx-dark] .bsx-bento__m .bsx-bento__l{color:var(--white)}
.bsx .bsx-bento__m .bsx-ic{margin-bottom:14px}
.bsx .bsx-bento__unit{
  font-family:var(--font-system);font-size:11.5px;font-weight:700;
  color:var(--slate);margin-left:8px;letter-spacing:.02em;
}
[data-bsx-dark] .bsx-bento__unit{color:var(--bsx-ink-dark)}

/* A touch screen has no hover, so a card whose body only opens on hover would
   hide its copy from every phone visitor. Show it outright there. */
@media (hover:none),(pointer:coarse){
  .bsx .bsx-rc__body{grid-template-rows:1fr;opacity:1;padding-block:12px 22px}
  .bsx .bsx-rc__spacer{min-height:24px}
  .bsx .bsx-rc{min-height:0}
}

/* ===========================================================================
   A real funnel
   Stacked trapezoids whose bottom edge is the next band's top edge, so the
   silhouette is one continuous inverted triangle rather than a list of rows.
   ========================================================================== */
.bsx-funnelv{
  margin-top:clamp(32px,3.8vw,52px);
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);
  gap:clamp(28px,4vw,56px);align-items:center;
}
@media (max-width:900px){.bsx-funnelv{grid-template-columns:1fr}}
.bsx-funnelv__shape{
  display:flex;flex-direction:column;gap:4px;max-width:520px;width:100%;
  margin-inline:auto;
}
.bsx-fb{
  position:relative;display:grid;place-items:center;
  min-height:clamp(58px,7vw,74px);
  clip-path:polygon(var(--tl) 0,var(--tr) 0,var(--br) 100%,var(--bl) 100%);
  transition:filter 260ms var(--bsx-ease),transform 260ms var(--bsx-ease);
  cursor:default;
}
.bsx-fb:hover{filter:brightness(1.06);transform:scale(1.015)}
.bsx-fb__t{
  font-family:var(--font-display);font-weight:700;letter-spacing:-.015em;
  font-size:clamp(14px,1.5vw,18px);text-align:center;padding-inline:14px;
  line-height:1.2;
}
/* the five accent steps, light to dark, all from the existing palette */
.bsx-fb--1{background:var(--gold)}
.bsx-fb--1 .bsx-fb__t{color:#5A4304}
.bsx-fb--2{background:var(--coral)}
/* white on coral is 3.2:1; navy on the same fill is 5.2:1 */
.bsx-fb--2 .bsx-fb__t{color:var(--navy)}
.bsx-fb--3{background:var(--teal)}
.bsx-fb--3 .bsx-fb__t{color:var(--navy)}
.bsx-fb--4{background:var(--blue)}
.bsx-fb--4 .bsx-fb__t{color:#FFFFFF}
.bsx-fb--5{background:var(--navy)}
.bsx-fb--5 .bsx-fb__t{color:#FFFFFF}

/* the legend beside it carries the reading of each band */
.bsx-funnelv__key{display:grid;gap:2px;align-content:center}
.bsx-fkey{
  display:grid;grid-template-columns:auto auto minmax(0,1fr);gap:12px;
  align-items:baseline;padding:13px 0;border-bottom:1px solid var(--bsx-rule);
}
.bsx-fkey:last-child{border-bottom:0}
[data-bsx-dark] .bsx-fkey{border-bottom-color:var(--bsx-rule-dark)}
.bsx-fkey__sw{
  width:12px;height:12px;border-radius:4px;align-self:center;flex:0 0 auto;
}
.bsx-fkey__n{
  font-family:var(--font-display);font-size:12px;font-weight:700;color:var(--slate);
  font-variant-numeric:tabular-nums;align-self:center;
}
[data-bsx-dark] .bsx-fkey__n{color:var(--bsx-ink-dark)}
.bsx-fkey__t{
  font-family:var(--font-display);font-size:15.5px;font-weight:700;color:var(--navy);
  letter-spacing:-.015em;
}
[data-bsx-dark] .bsx-fkey__t{color:var(--white)}
.bsx-fkey__b{
  grid-column:3;font-family:var(--font-system);font-size:13.5px;line-height:1.55;
  color:var(--slate);margin-top:4px;
}
[data-bsx-dark] .bsx-fkey__b{color:var(--bsx-ink-dark)}

/* ===========================================================================
   Feature cards: a visual on top, a solid panel beneath, copy on hover
   ========================================================================== */
.bsx-reveal{
  grid-template-columns:repeat(auto-fit,minmax(268px,1fr));
  gap:clamp(16px,2vw,24px);
}
@media (min-width:1000px){
  .bsx .bsx-reveal{grid-template-columns:repeat(3,minmax(0,1fr))}
}
.bsx .bsx-rc{
  display:flex;flex-direction:column;justify-content:flex-start;
  min-height:0;padding:0;border:0;border-radius:20px;overflow:hidden;
  background:transparent;box-shadow:none;
}
.bsx .bsx-rc:hover,.bsx .bsx-rc:focus-within{
  border:0;box-shadow:0 26px 52px -30px rgba(12,22,61,.45);transform:translateY(-4px);
}
/* the visual half */
.bsx .bsx-rc__art{
  position:relative;inset:auto;z-index:0;aspect-ratio:4/3;width:100%;
  border-radius:0;
}
/* the solid panel half, one accent per card */
.bsx .bsx-rc__panel{
  padding:20px 22px 22px;background:var(--mist);flex:1 1 auto;
  display:flex;flex-direction:column;
}





.bsx .bsx-rc__head{padding:0;display:flex;align-items:center;gap:11px}
.bsx .bsx-rc h3{font-size:17px;line-height:1.26;letter-spacing:-.018em;color:var(--navy)}
.bsx .bsx-rc__spacer{display:none}
.bsx .bsx-rc__body{
  display:grid;grid-template-rows:0fr;opacity:0;overflow:hidden;padding:0;
  transition:grid-template-rows 420ms var(--bsx-ease),opacity 260ms var(--bsx-ease),
             margin-top 420ms var(--bsx-ease);
  margin-top:0;
}
.bsx .bsx-rc__body > *{min-height:0;overflow:hidden}
.bsx .bsx-rc:hover .bsx-rc__body,
.bsx .bsx-rc:focus-within .bsx-rc__body{
  grid-template-rows:1fr;opacity:1;margin-top:12px;
}
.bsx .bsx-rc p{font-size:14px;line-height:1.58;color:var(--slate)}
@media (hover:none),(pointer:coarse),(prefers-reduced-motion:reduce){
  .bsx .bsx-rc__body{grid-template-rows:1fr;opacity:1;margin-top:12px}
}

/* ===========================================================================
   Images: a diagram must never be cropped
   object-fit:cover was slicing the top and bottom off every schematic. These
   are drawings, not photographs, so they are fitted whole.
   ========================================================================== */
.bsx .bsx-fig img{
  object-fit:contain;object-position:center;max-height:none;
  background:var(--white);border-radius:14px;
}
[data-bsx-dark] .bsx-fig img{background:rgba(235,245,255,.04)}
.bsx .bsx-mrow__media .bsx-fig img{max-height:none}
.bsx .bsx-hero__fig img{object-fit:cover}
.bsx .bsx-close__bg{object-fit:cover}
/* a media row with nothing to show gives its space back to the copy */
.bsx .bsx-mrow:has(.bsx-mrow__media:empty){grid-template-columns:1fr}
.bsx .bsx-mrow__media:empty{display:none}

/* ---- tab panel: the copy runs full width, no filler chart ---- */
.bsx .bsx-tabs__grid{grid-template-columns:1fr}
.bsx .bsx-tabs__panel .bsx-checks{
  columns:2;column-gap:clamp(20px,3vw,44px);margin-top:20px;
}
@media (max-width:760px){.bsx .bsx-tabs__panel .bsx-checks{columns:1}}
.bsx .bsx-tabs__panel .bsx-checks li{break-inside:avoid;margin-bottom:11px}

/* ---- one boundary note, not four labelled paragraphs ---- */
.bsx-bound{
  margin-top:22px;padding:18px 20px;border-radius:14px;
  background:var(--mist);border:1px solid var(--mist-border);
  border-left:3px solid var(--slate);
}
.bsx-mist .bsx-bound{background:var(--white)}
[data-bsx-dark] .bsx-bound{
  background:rgba(235,245,255,.05);border-color:var(--bsx-rule-dark);
  border-left-color:var(--teal);
}
.bsx-bound__k{
  display:flex;align-items:center;gap:9px;font-family:var(--font-system);
  font-size:11.5px;font-weight:700;color:var(--slate);margin-bottom:10px;
}
[data-bsx-dark] .bsx-bound__k{color:var(--teal)}
.bsx-bound ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.bsx-bound li{
  font-family:var(--font-system);font-size:14px;line-height:1.58;color:var(--slate);
  padding-left:16px;position:relative;
}
[data-bsx-dark] .bsx-bound li{color:var(--bsx-ink-dark)}
.bsx-bound li::before{
  content:"";position:absolute;left:0;top:9px;width:7px;height:1px;
  background:var(--slate);
}
[data-bsx-dark] .bsx-bound li::before{background:var(--teal)}

/* ===========================================================================
   Outcome cards
   The previous version gave two thirds of every card to a gradient that said
   nothing. The visual now carries the index numeral, so the space is doing
   work, and the body is always visible instead of hiding behind a hover.
   ========================================================================== */
.bsx .bsx-reveal{
  grid-template-columns:repeat(auto-fit,minmax(276px,1fr));
  gap:clamp(16px,2vw,24px);align-items:stretch;
}
@media (min-width:1040px){
  .bsx .bsx-reveal{grid-template-columns:repeat(3,minmax(0,1fr))}
}
.bsx .bsx-rc{
  display:flex;flex-direction:column;height:100%;border-radius:18px;
  overflow:hidden;border:1px solid var(--border);background:var(--white);
  box-shadow:none;transform:none;
  transition:border-color 260ms var(--bsx-ease),transform 260ms var(--bsx-ease),
             box-shadow 260ms var(--bsx-ease);
}
.bsx .bsx-rc:hover,.bsx .bsx-rc:focus-within{
  border-color:var(--blue);transform:translateY(-3px);
  box-shadow:0 22px 44px -28px rgba(12,22,61,.4);
}
[data-bsx-dark] .bsx-rc{background:rgba(235,245,255,.06);border-color:var(--bsx-rule-dark)}

/* the illustrated half: a ghosted numeral behind the icon, over corridor arcs */
.bsx .bsx-rc__art{
  position:relative;inset:auto;aspect-ratio:16/9;width:100%;display:grid;
  place-items:center;overflow:hidden;flex:0 0 auto;
  background:
    radial-gradient(115% 85% at 14% 8%, rgba(49,92,253,.16), transparent 60%),
    radial-gradient(110% 80% at 88% 12%, rgba(40,220,209,.18), transparent 58%),
    var(--mist);
  transition:none;
}
[data-bsx-dark] .bsx-rc__art{
  background:
    radial-gradient(115% 85% at 14% 8%, rgba(49,92,253,.34), transparent 60%),
    radial-gradient(110% 80% at 88% 12%, rgba(40,220,209,.24), transparent 58%),
    var(--navy-soft);
}
.bsx .bsx-rc__art svg.bsx-rc__arcs{
  position:absolute;inset:0;width:100%;height:100%;pointer-events:none;
}
.bsx .bsx-rc__art svg.bsx-rc__arcs path{
  fill:none;stroke:var(--blue);stroke-width:1.2;opacity:.22;
}
[data-bsx-dark] .bsx-rc__art svg.bsx-rc__arcs path{stroke:var(--teal);opacity:.3}
.bsx .bsx-rc__num{
  position:absolute;right:14px;bottom:-14px;font-family:var(--font-display);
  font-weight:700;font-size:clamp(64px,7vw,92px);line-height:1;
  letter-spacing:-.05em;color:var(--navy);opacity:.10;
  font-variant-numeric:tabular-nums;pointer-events:none;
}
[data-bsx-dark] .bsx-rc__num{color:var(--white);opacity:.14}
.bsx .bsx-rc__glyph{
  position:relative;width:56px;height:56px;border-radius:16px;display:grid;
  place-items:center;background:var(--white);border:1px solid var(--mist-border);
  color:var(--blue);
  box-shadow:0 12px 26px -16px rgba(12,22,61,.4);
  transition:transform 300ms var(--bsx-ease),background 260ms var(--bsx-ease),
             color 260ms var(--bsx-ease);
}
[data-bsx-dark] .bsx-rc__glyph{
  background:rgba(12,22,61,.6);border-color:rgba(235,245,255,.2);color:var(--teal);
}
.bsx .bsx-rc:hover .bsx-rc__glyph{
  transform:translateY(-3px) scale(1.05);background:var(--blue);color:var(--white);
}
/* the reading half */
.bsx .bsx-rc__panel{
  padding:20px 22px 22px;background:var(--white);flex:1 1 auto;
  display:flex;flex-direction:column;border-top:1px solid var(--bsx-rule);
}
.bsx .bsx-rc:nth-child(n) .bsx-rc__panel{background:var(--white)}
[data-bsx-dark] .bsx-rc__panel{background:transparent;border-top-color:var(--bsx-rule-dark)}
.bsx .bsx-rc__head{padding:0;display:block}
.bsx .bsx-rc h3{font-size:17px;line-height:1.28;letter-spacing:-.018em;color:var(--navy)}
[data-bsx-dark] .bsx-rc h3{color:var(--white)}
.bsx .bsx-rc__body{
  display:block;grid-template-rows:none;opacity:1;overflow:visible;
  margin-top:10px;padding:0;transition:none;
}
.bsx .bsx-rc p{font-size:14px;line-height:1.6;color:var(--slate)}
[data-bsx-dark] .bsx-rc p{color:var(--bsx-ink-dark)}
.bsx .bsx-rc__spacer{display:none}

/* ===========================================================================
   Tab panel: copy on the left, the workstream list as a real panel on the right
   ========================================================================== */
.bsx .bsx-tabs__grid{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.92fr);
  gap:clamp(24px,3.4vw,52px);align-items:start;
}
@media (max-width:900px){.bsx .bsx-tabs__grid{grid-template-columns:1fr}}
.bsx .bsx-tabs__panel .bsx-checks{columns:auto;margin-top:0}
.bsx-worklist{
  border:1px solid var(--mist-border);border-radius:18px;background:var(--white);
  overflow:hidden;
}
[data-bsx-dark] .bsx-worklist{background:rgba(235,245,255,.05);border-color:var(--bsx-rule-dark)}
.bsx-worklist__k{
  display:flex;align-items:center;gap:9px;padding:14px 20px;
  border-bottom:1px solid var(--bsx-rule);
  font-family:var(--font-system);font-size:11.5px;font-weight:700;color:var(--slate);
  background:var(--mist);
}
.bsx-mist .bsx-worklist__k{background:rgba(49,92,253,.06)}
[data-bsx-dark] .bsx-worklist__k{
  background:rgba(235,245,255,.05);border-bottom-color:var(--bsx-rule-dark);color:var(--teal);
}
.bsx-worklist ol{list-style:none;margin:0;padding:0}
.bsx-worklist li{
  display:grid;grid-template-columns:30px minmax(0,1fr);gap:12px;align-items:baseline;
  padding:13px 20px;border-bottom:1px solid var(--bsx-rule);
  font-family:var(--font-system);font-size:14.5px;line-height:1.5;color:var(--slate);
  transition:background 200ms var(--bsx-ease);
}
[data-bsx-dark] .bsx-worklist li{border-bottom-color:var(--bsx-rule-dark);color:var(--bsx-ink-dark)}
.bsx-worklist li:last-child{border-bottom:0}
.bsx-worklist li:hover{background:rgba(235,245,255,.6)}
[data-bsx-dark] .bsx-worklist li:hover{background:rgba(235,245,255,.05)}
.bsx-worklist li b{
  font-family:var(--font-display);font-size:11.5px;font-weight:700;color:var(--blue);
  font-variant-numeric:tabular-nums;
}
[data-bsx-dark] .bsx-worklist li b{color:var(--teal)}

/* ===========================================================================
   Objections: an even grid, not four rows with one lonely picture
   ========================================================================== */
.bsx-objs{
  margin-top:clamp(32px,3.8vw,50px);display:grid;
  grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:clamp(16px,2vw,24px);
}
@media (min-width:1000px){.bsx-objs{grid-template-columns:repeat(2,minmax(0,1fr))}}
.bsx-obj{
  display:flex;flex-direction:column;padding:26px 24px;border-radius:18px;
  background:var(--white);border:1px solid var(--border);height:100%;
  transition:border-color 250ms var(--bsx-ease),transform 250ms var(--bsx-ease),
             box-shadow 250ms var(--bsx-ease);
}
.bsx-obj:hover{
  border-color:var(--blue);transform:translateY(-3px);
  box-shadow:0 22px 44px -28px rgba(12,22,61,.4);
}
[data-bsx-dark] .bsx-obj{background:rgba(235,245,255,.06);border-color:var(--bsx-rule-dark)}
.bsx-obj__top{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.bsx-obj__q{
  font-family:var(--font-display);font-size:11.5px;font-weight:700;color:var(--slate);
  margin-left:auto;
}
[data-bsx-dark] .bsx-obj__q{color:var(--bsx-ink-dark)}
.bsx-obj h3{font-size:18px;line-height:1.3;letter-spacing:-.02em}
.bsx-obj p{margin-top:11px;font-size:14.5px;line-height:1.6;flex:1 1 auto}
.bsx-obj .bsx-act{margin-top:18px;align-self:flex-start}
.bsx-obj__fig{
  margin:0 0 16px;border-radius:12px;overflow:hidden;border:1px solid var(--mist-border);
}
.bsx-obj__fig img{width:100%;height:150px;object-fit:contain;display:block;background:var(--white)}

/* ===========================================================================
   Funnel: arrows between the bands, and the legend linked to the shape
   ========================================================================== */
.bsx-funnelv__shape{gap:0}
.bsx-fb{cursor:pointer}
.bsx-fb__arrow{
  display:grid;place-items:center;height:22px;color:var(--slate);opacity:.5;
  transition:opacity 240ms var(--bsx-ease),transform 240ms var(--bsx-ease);
}
[data-bsx-dark] .bsx-fb__arrow{color:var(--bsx-ink-dark)}
.bsx-fb__sub{
  display:block;font-family:var(--font-system);font-size:11px;font-weight:600;
  opacity:.82;margin-top:3px;line-height:1.25;
}
/* the hovered band and its legend row light up together */
.bsx-fb.is-on{filter:brightness(1.08);transform:scale(1.02);z-index:2}
.bsx-fkey.is-on{background:rgba(49,92,253,.07);border-radius:10px}
[data-bsx-dark] .bsx-fkey.is-on{background:rgba(235,245,255,.07)}
.bsx-fkey{
  padding-inline:10px;margin-inline:-10px;cursor:pointer;
  transition:background 200ms var(--bsx-ease);
}
.bsx-funnelv__shape:hover .bsx-fb__arrow{opacity:.85}
.bsx-funnelv__shape:hover .bsx-fb__arrow svg{transform:translateY(2px)}
.bsx-fb__arrow svg{transition:transform 300ms var(--bsx-ease)}

/* ===========================================================================
   MOBILE
   ========================================================================== */
@media (max-width:900px){

  /* ---- header ----
     The bar holds logo, nav and an actions group. Only the actions group needs
     reordering; touching the logo's order moved it to the far side of the bar. */
  .bs-bar__inner{gap:10px;align-items:center}
  .bs-bar__actions{
    margin-left:auto;display:flex;align-items:center;gap:8px;flex:0 0 auto;
  }
  .bs-bar__actions .bs-cta{
    order:1;height:40px;padding-inline:14px;font-size:13.5px;white-space:nowrap;
  }
  .bs-bar__actions .bs-burger{order:2;width:40px;height:40px;flex:0 0 auto}

  /* ---- hero: both actions on one line, then the figure ---- */
  .bsx .bsx-hero__cta{
    display:grid;grid-template-columns:1fr 1fr;gap:10px;align-items:stretch;
  }
  .bsx .bsx-hero__cta > .bsx-btn{
    width:100%;justify-content:center;height:50px;padding-inline:12px;
    font-size:14px;text-align:center;
  }
  .bsx .bsx-hero__cta > .bsx-btn svg{flex:0 0 auto}
  .bsx .bsx-hero__fig{margin-top:26px}

  /* =========================================================================
     The carousel
     A grid becomes a snap-scrolling row. Children keep their own styling; only
     the track changes, which is why one rule covers six different components.
     ======================================================================== */
  .bsx .bsx-systems,
  .bsx .bsx-steps__grid,
  .bsx .bsx-svcs,
  .bsx .bsx-reveal,
  .bsx .bsx-bento,
  .bsx .bsx-cards,
  .bsx .bsx-models,
  .bsx .bsx-dir,
  .bsx .bsx-spec,
  .bsx .bsx-out,
  .bsx .bsx-ship,
  .bsx .bsx-proof,
  .bsx .bsx-related{
    display:flex;flex-wrap:nowrap;
    overflow-x:auto;overscroll-behavior-x:contain;
    scroll-snap-type:x mandatory;
    scroll-padding-inline:var(--bsx-gut);
    gap:14px;
    margin-inline:calc(var(--bsx-gut) * -1);
    padding-inline:var(--bsx-gut);
    padding-bottom:6px;
    -ms-overflow-style:none;scrollbar-width:none;
  }
  .bsx .bsx-dir::-webkit-scrollbar,
  .bsx .bsx-spec::-webkit-scrollbar,
  .bsx .bsx-out::-webkit-scrollbar,
  .bsx .bsx-ship::-webkit-scrollbar,
  .bsx .bsx-proof::-webkit-scrollbar,
  .bsx .bsx-related::-webkit-scrollbar,
  .bsx .bsx-systems::-webkit-scrollbar,
  .bsx .bsx-steps__grid::-webkit-scrollbar,
  .bsx .bsx-svcs::-webkit-scrollbar,
  .bsx .bsx-reveal::-webkit-scrollbar,
  .bsx .bsx-bento::-webkit-scrollbar,
  .bsx .bsx-cards::-webkit-scrollbar,
  .bsx .bsx-models::-webkit-scrollbar{display:none}

  .bsx .bsx-systems > *,
  .bsx .bsx-steps__grid > *,
  .bsx .bsx-svcs > *,
  .bsx .bsx-reveal > *,
  .bsx .bsx-cards > *,
  .bsx .bsx-models > *,
  .bsx .bsx-dir > *,
  .bsx .bsx-spec > *,
  .bsx .bsx-out > *,
  .bsx .bsx-ship > *,
  .bsx .bsx-proof > *,
  .bsx .bsx-related > *{
    flex:0 0 84%;scroll-snap-align:start;min-width:0;
  }
  /* the eight services and the claim tiles read fine two to a frame */
  .bsx .bsx-svcs > *,
  .bsx .bsx-bento > *{flex:0 0 calc(50% - 7px);scroll-snap-align:start}
  .bsx .bsx-bento__wide{flex:0 0 84%}

  /* compact card interiors so two abreast still breathe */
  .bsx .bsx-svc{padding:18px 16px}
  .bsx .bsx-svc h3{font-size:15px;margin-top:12px}
  .bsx .bsx-svc p{font-size:13px;line-height:1.5}
  .bsx .bsx-svc__go{font-size:12.5px;margin-top:12px}
  .bsx .bsx-bento__m{padding:18px 16px}

  /* the step rail is a row of cards, so the connecting line goes */
  .bsx .bsx-steps__line,.bsx .bsx-steps__fill{display:none}
  .bsx .bsx-step{padding:20px 18px;border:1px solid var(--border);border-radius:16px;
    background:var(--white)}
  .bsx-mist .bsx-step{background:var(--white)}
  [data-bsx-dark] .bsx-step{background:rgba(235,245,255,.06);border-color:var(--bsx-rule-dark)}

  /* five things: smaller cards, art trimmed back */
  .bsx .bsx-rc__art{aspect-ratio:21/9}
  .bsx .bsx-rc__glyph{width:46px;height:46px;border-radius:13px}
  .bsx .bsx-rc__num{font-size:56px;right:12px;bottom:-10px}
  .bsx .bsx-rc__panel{padding:16px 18px 18px}
  .bsx .bsx-rc h3{font-size:16px}
  .bsx .bsx-rc p{font-size:13.5px}

  /* ---- dots, added by script for whichever tracks actually scroll ---- */
  .bsx-dots{
    display:flex;gap:7px;justify-content:center;align-items:center;
    margin-top:16px;
  }
  .bsx-dots button{
    width:7px;height:7px;padding:0;border-radius:999px;border:0;
    background:var(--border-strong);cursor:pointer;
    transition:width 260ms var(--bsx-ease),background 260ms var(--bsx-ease);
  }
  .bsx .bsx-dots button{background:var(--border-strong)}
  .bsx .bsx-dots button[aria-current="true"]{background:var(--blue);width:20px}
  [data-bsx-dark] .bsx-dots button{background:rgba(235,245,255,.28)}
  [data-bsx-dark] .bsx-dots button[aria-current="true"]{background:var(--teal)}
  .bsx-swipehint{
    display:flex;align-items:center;gap:7px;justify-content:center;
    margin-top:10px;font-family:var(--font-system);font-size:11.5px;
    font-weight:600;color:var(--slate);
  }
  [data-bsx-dark] .bsx-swipehint{color:var(--bsx-ink-dark)}

  /* =========================================================================
     Objections: a sticky deck. Each card parks under the header and the next
     one slides over it, so four cards cost about one card of scrolling.
     ======================================================================== */
  .bsx .bsx-objs{display:block;position:relative}
  .bsx .bsx-obj{
    position:sticky;top:96px;margin-bottom:14px;
    box-shadow:0 -6px 24px -14px rgba(12,22,61,.28);
  }
  .bsx .bsx-obj:nth-child(1){top:96px}
  .bsx .bsx-obj:nth-child(2){top:106px}
  .bsx .bsx-obj:nth-child(3){top:116px}
  .bsx .bsx-obj:nth-child(4){top:126px}
  .bsx .bsx-obj:nth-child(5){top:136px}
  .bsx .bsx-obj:last-child{margin-bottom:0}

  /* =========================================================================
     Funnel: the shape becomes a tab strip, one stage read at a time
     ======================================================================== */
  .bsx .bsx-funnelv{display:block}
  .bsx .bsx-funnelv__shape{
    display:flex;flex-wrap:nowrap;overflow-x:auto;gap:8px;max-width:none;
    scroll-snap-type:x mandatory;padding-bottom:4px;
    margin-inline:calc(var(--bsx-gut) * -1);padding-inline:var(--bsx-gut);
    -ms-overflow-style:none;scrollbar-width:none;
  }
  .bsx .bsx-funnelv__shape::-webkit-scrollbar{display:none}
  .bsx .bsx-fb{
    flex:0 0 auto;clip-path:none;min-height:0;border-radius:999px;
    padding:10px 16px;scroll-snap-align:start;
    opacity:.5;transition:opacity 240ms var(--bsx-ease),transform 240ms var(--bsx-ease);
  }
  .bsx .bsx-fb[aria-selected="true"]{opacity:1;transform:none}
  .bsx .bsx-fb__t{font-size:13.5px;white-space:nowrap}
  .bsx .bsx-fb__sub{display:none}
  .bsx .bsx-fb__arrow{display:none}
  /* only the chosen stage's reading is shown */
  .bsx .bsx-funnelv__key{margin-top:18px}
  .bsx .bsx-funnelv[data-bsx-tabbed] .bsx-fkey{display:none;border-bottom:0;padding:0}
  .bsx .bsx-funnelv[data-bsx-tabbed] .bsx-fkey.is-active{
    display:grid;background:var(--white);border:1px solid var(--mist-border);
    border-radius:16px;padding:18px 18px;
  }
  [data-bsx-dark] .bsx-funnelv[data-bsx-tabbed] .bsx-fkey.is-active{
    background:rgba(235,245,255,.06);border-color:var(--bsx-rule-dark);
  }
  .bsx .bsx-funnelv[data-bsx-tabbed] .bsx-fkey.is-active .bsx-fkey__t{font-size:17px}
  .bsx .bsx-funnelv[data-bsx-tabbed] .bsx-fkey.is-active .bsx-fkey__b{font-size:14px}

  /* ---- odds and ends that only bite on a narrow screen ---- */
  .bsx .bsx-tabs__rail{
    flex-wrap:nowrap;overflow-x:auto;scroll-snap-type:x mandatory;
    margin-inline:calc(var(--bsx-gut) * -1);padding-inline:var(--bsx-gut);
    -ms-overflow-style:none;scrollbar-width:none;
  }
  .bsx .bsx-tabs__rail::-webkit-scrollbar{display:none}
  .bsx .bsx-tabs__rail > *{flex:0 0 auto;scroll-snap-align:start}
  .bsx .bsx-chips{
    flex-wrap:nowrap;overflow-x:auto;scroll-snap-type:x mandatory;
    margin-inline:calc(var(--bsx-gut) * -1);padding-inline:var(--bsx-gut);
    -ms-overflow-style:none;scrollbar-width:none;
  }
  .bsx .bsx-chips::-webkit-scrollbar{display:none}
  .bsx .bsx-chips > *{flex:0 0 auto;scroll-snap-align:start}
  .bsx .bsx-toc{gap:7px}
  .bsx .bsx-toc a{height:34px;padding-inline:12px;font-size:12.5px}
  .bsx .bsx-ctacard{flex-direction:column;align-items:flex-start;gap:16px}
  .bsx .bsx-ctacard a.bsx-btn{width:100%;justify-content:center}
  .bsx .bsx-close__cta{display:grid;grid-template-columns:1fr;gap:10px}
  .bsx .bsx-close__cta .bsx-btn{width:100%;justify-content:center}
  .bsx .bsx-vs__wrap{margin-inline:calc(var(--bsx-gut) * -1);border-radius:0;border-inline:0}
  .bsx .bsx-worklist{margin-top:20px}
}

@media (max-width:560px){
  /* the pair stays two to a frame; the card interior tightens instead */
  .bsx .bsx-svcs > *{flex:0 0 calc(50% - 6px)}
  .bsx .bsx-svcs{gap:12px}
  .bsx .bsx-svc{padding:15px 13px}
  .bsx .bsx-svc h3{font-size:14px;margin-top:10px;letter-spacing:-.01em}
  .bsx .bsx-svc p{font-size:12.5px;line-height:1.45}
  .bsx .bsx-svc__go{font-size:12px;margin-top:10px}
  .bsx .bsx-svc .bsx-ic{width:32px;height:32px;border-radius:9px}
  .bsx .bsx-bento > *{flex:0 0 calc(50% - 6px)}
  .bsx .bsx-bento__wide{flex:0 0 88%}
}

/* a carousel should not animate for someone who asked it not to */
@media (prefers-reduced-motion:reduce){
  .bsx [class*="bsx-"]{scroll-behavior:auto}
}

@media (max-width:900px){
  /* A 7px dot is the right size to look at and the wrong size to hit, so the
     touch area is grown around it without changing what is drawn. */
  .bsx-dots{gap:0}
  .bsx-dots button{
    position:relative;width:7px;height:7px;margin:0 7px;
  }
  .bsx-dots button::after{
    content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
    width:44px;height:44px;
  }
  .bsx .bsx-dots button[aria-current="true"]{width:20px}

  /* display type at 1.06 leaves no room for descenders once it wraps to two
     lines on a narrow screen */
  .bsx .bsx-d2{line-height:1.14}
  .bsx .bsx-d1{line-height:1.04}

  /* the swipe rails need a little breathing room under the dots */
  .bsx .bsx-dots{margin-top:14px;margin-bottom:2px}
}

@media (max-width:900px){
  /* the homepage components carry their own borders for a grid layout; as a
     swipe rail each one has to become a self-contained card instead */
  .bsx .bsx-dir{border:0}
  .bsx .bsx-dir__col{
    border:1px solid var(--border);border-radius:16px;padding:20px 18px;
    background:var(--white);
  }
  .bsx .bsx-spec__item,
  .bsx .bsx-out__item,
  .bsx .bsx-ship__item{
    border:1px solid var(--border);border-radius:16px;padding:20px 18px;
    background:var(--white);border-top-width:1px;
  }
  [data-bsx-dark] .bsx-spec__item,
  [data-bsx-dark] .bsx-out__item,
  [data-bsx-dark] .bsx-ship__item,
  [data-bsx-dark] .bsx-dir__col{
    background:rgba(235,245,255,.06);border-color:var(--bsx-rule-dark);
  }
  .bsx .bsx-ship__item{border-top:2px solid var(--blue)}
  .bsx .bsx-out__item{border-top:2px solid var(--navy)}
  [data-bsx-dark] .bsx-out__item{border-top-color:var(--teal)}
  .bsx .bsx-proof__lead{grid-column:auto}

  /* the discipline index is a list, not a rail, so it just gets tighter */
  .bsx .bsx-drow{padding-block:20px;row-gap:10px}
  .bsx .bsx-drow__b{font-size:14px}
  .bsx .bsx-aeo{max-width:none}
}

/* ===========================================================================
   Check lists
   A column of identical ticks is decoration. The glyph now says something
   about the line it sits beside, so it sits in a chip that reads as a marker
   rather than as punctuation.
   ========================================================================== */
.bsx .bsx-checks--ic{gap:10px}
.bsx .bsx-checks--ic li{align-items:flex-start;gap:12px}
.bsx .bsx-checks__ic{
  display:grid;place-items:center;width:26px;height:26px;flex:0 0 auto;
  margin-top:-1px;border-radius:8px;
  background:var(--mist);border:1px solid var(--mist-border);
  color:var(--blue);
  transition:background 200ms var(--bsx-ease),color 200ms var(--bsx-ease);
}
.bsx .bsx-checks--ic li svg{margin-top:0;color:inherit}
.bsx-mist .bsx-checks__ic{background:var(--white);border-color:var(--mist-border)}
[data-bsx-dark] .bsx-checks__ic{
  background:rgba(235,245,255,.08);border-color:var(--bsx-rule-dark);color:var(--teal);
}
.bsx .bsx-checks--ic li:hover .bsx-checks__ic{background:var(--blue);color:var(--white)}
[data-bsx-dark] .bsx-checks--ic li:hover .bsx-checks__ic{
  background:var(--teal);color:var(--navy);
}

/* ===========================================================================
   Capability tiles become cards
   Twelve one-line rows in a hairline table read as a spreadsheet. As cards
   with the index set into the header they read as a body of work, and the
   numeral gives a reader somewhere to be while scanning.
   ========================================================================== */
.bsx .bsx-tiles{
  grid-template-columns:repeat(auto-fit,minmax(232px,1fr));
  gap:clamp(12px,1.4vw,16px);border:0;
}
@media (min-width:1080px){
  .bsx .bsx-tiles{grid-template-columns:repeat(4,minmax(0,1fr))}
}
.bsx .bsx-tile{
  position:relative;display:flex;flex-direction:column;
  padding:20px 20px 22px;border:1px solid var(--border);border-radius:16px;
  background:var(--white);overflow:hidden;
  transition:border-color 240ms var(--bsx-ease),transform 240ms var(--bsx-ease),
             box-shadow 240ms var(--bsx-ease),background 240ms var(--bsx-ease);
}
.bsx .bsx-tile::before{
  content:"";position:absolute;inset:0 0 auto 0;height:2px;
  background:linear-gradient(90deg,var(--blue),var(--teal));
  transform:scaleX(0);transform-origin:left center;
  transition:transform 320ms var(--bsx-ease);
}
.bsx .bsx-tile:hover{
  background:var(--white);border-color:var(--blue);transform:translateY(-3px);
  box-shadow:0 20px 40px -28px rgba(12,22,61,.42);
}
.bsx .bsx-tile:hover::before{transform:scaleX(1)}
.bsx-mist .bsx-tile:hover{background:var(--white)}
[data-bsx-dark] .bsx-tile{
  background:rgba(235,245,255,.06);border-color:var(--bsx-rule-dark);
}
[data-bsx-dark] .bsx-tile:hover{
  background:rgba(235,245,255,.09);border-color:var(--teal);
}
.bsx .bsx-tile__top{
  display:flex;align-items:center;gap:11px;margin-bottom:12px;
}
.bsx .bsx-tile__ic{
  display:grid;place-items:center;width:36px;height:36px;flex:0 0 auto;
  border-radius:11px;background:var(--mist);border:1px solid var(--mist-border);
  color:var(--blue);
  transition:background 240ms var(--bsx-ease),color 240ms var(--bsx-ease),
             transform 300ms var(--bsx-ease);
}
[data-bsx-dark] .bsx-tile__ic{
  background:rgba(235,245,255,.08);border-color:var(--bsx-rule-dark);color:var(--teal);
}
.bsx .bsx-tile:hover .bsx-tile__ic{
  background:var(--blue);color:var(--white);transform:translateY(-2px);
}
[data-bsx-dark] .bsx-tile:hover .bsx-tile__ic{background:var(--teal);color:var(--navy)}
.bsx .bsx-tile__n{
  margin-left:auto;font-family:var(--font-display);font-weight:700;
  font-size:13px;letter-spacing:-.02em;color:var(--navy);opacity:.24;
  font-variant-numeric:tabular-nums;
}
[data-bsx-dark] .bsx-tile__n{color:var(--white);opacity:.34}
.bsx .bsx-tile h3{font-size:15.5px;line-height:1.32;letter-spacing:-.014em}
.bsx .bsx-tile p{margin-top:8px;font-size:13.5px;line-height:1.55;flex:1 1 auto}

/* ===========================================================================
   Before / after: the arrow earns its column
   ========================================================================== */
.bsx .bsx-pair{
  transition:border-color 240ms var(--bsx-ease),box-shadow 240ms var(--bsx-ease);
}
.bsx .bsx-pair:hover{
  border-color:var(--blue);box-shadow:0 18px 38px -30px rgba(12,22,61,.45);
}
.bsx .bsx-pair__arrow{
  display:grid;place-items:center;color:var(--slate);opacity:.55;
  background:var(--white);border-inline:1px solid var(--bsx-rule);
  transition:opacity 240ms var(--bsx-ease),color 240ms var(--bsx-ease);
}
.bsx .bsx-pair:hover .bsx-pair__arrow{opacity:1;color:var(--blue)}
[data-bsx-dark] .bsx-pair__arrow{
  background:transparent;border-color:var(--bsx-rule-dark);color:var(--bsx-ink-dark);
}

/* ===========================================================================
   Anchor rail: say what the row of chips is
   ========================================================================== */
.bsx .bsx-toc{align-items:center}
.bsx .bsx-toc__k{
  display:inline-flex;align-items:center;gap:7px;margin-right:4px;
  font-family:var(--font-system);font-size:11px;font-weight:700;
  letter-spacing:.1em;text-transform:uppercase;color:var(--slate);
  white-space:nowrap;
}
.bsx .bsx-toc__k svg{color:var(--blue)}
[data-bsx-dark] .bsx-toc__k{color:var(--bsx-ink-dark)}
[data-bsx-dark] .bsx-toc__k svg{color:var(--teal)}

/* ===========================================================================
   MOBILE
   ========================================================================== */
@media (max-width:900px){

  /* ---- before / after pairs swipe ---- */
  .bsx .bsx-pairs{
    display:flex;flex-wrap:nowrap;overflow-x:auto;overscroll-behavior-x:contain;
    scroll-snap-type:x mandatory;scroll-padding-inline:var(--bsx-gut);gap:14px;
    margin-inline:calc(var(--bsx-gut) * -1);padding-inline:var(--bsx-gut);
    padding-bottom:6px;-ms-overflow-style:none;scrollbar-width:none;
  }
  .bsx .bsx-pairs::-webkit-scrollbar{display:none}
  .bsx .bsx-pairs > *{flex:0 0 86%;scroll-snap-align:start;min-width:0}
  /* inside a card the two states stack, and the arrow turns to face them */
  .bsx .bsx-pair{grid-template-columns:1fr;grid-template-rows:auto auto auto}
  .bsx .bsx-pair__arrow{
    display:grid;height:34px;border-inline:0;
    border-block:1px solid var(--bsx-rule);
  }
  .bsx .bsx-pair__arrow svg{transform:rotate(90deg)}
  [data-bsx-dark] .bsx-pair__arrow{border-block-color:var(--bsx-rule-dark)}
  .bsx .bsx-pair__side{padding:18px 18px}

  /* ---- "what the programme includes" swipes ---- */
  .bsx .bsx-mrows[data-bsx-swipe]{
    display:flex;flex-wrap:nowrap;overflow-x:auto;overscroll-behavior-x:contain;
    scroll-snap-type:x mandatory;scroll-padding-inline:var(--bsx-gut);gap:14px;
    margin-inline:calc(var(--bsx-gut) * -1);padding-inline:var(--bsx-gut);
    padding-bottom:6px;-ms-overflow-style:none;scrollbar-width:none;
  }
  .bsx .bsx-mrows[data-bsx-swipe]::-webkit-scrollbar{display:none}
  .bsx .bsx-mrows[data-bsx-swipe] > .bsx-mrow{
    flex:0 0 86%;scroll-snap-align:start;min-width:0;
    display:block;padding:20px 18px;border:1px solid var(--border);
    border-radius:16px;background:var(--white);
  }
  [data-bsx-dark] .bsx-mrows[data-bsx-swipe] > .bsx-mrow{
    background:rgba(235,245,255,.06);border-color:var(--bsx-rule-dark);
  }
  .bsx .bsx-mrows[data-bsx-swipe] .bsx-mrow__media{margin-top:16px}
  .bsx .bsx-mrows[data-bsx-swipe] .bsx-mrow__media img{height:150px;object-fit:contain}
  .bsx .bsx-mrows[data-bsx-swipe] h3{font-size:16.5px}
  .bsx .bsx-mrows[data-bsx-swipe] p{font-size:14px;line-height:1.55}

  /* ---- capability cards stack ----
     Each card parks a few pixels below the one before it and the next slides
     over the top, so twelve cards cost about two screens instead of twelve.
     ------------------------------------------------------------------- */
  .bsx .bsx-tiles[data-bsx-stack]{
    display:block;position:relative;
  }
  .bsx .bsx-tiles[data-bsx-stack] > .bsx-tile{
    position:sticky;
    top:calc(92px + var(--bsx-i) * 6px);
    margin-bottom:12px;
    box-shadow:0 -8px 26px -16px rgba(12,22,61,.32);
    background:var(--white);
  }
  [data-bsx-dark] .bsx-tiles[data-bsx-stack] > .bsx-tile{
    background:var(--navy-soft);
    box-shadow:0 -8px 26px -14px rgba(0,0,0,.55);
  }
  .bsx .bsx-tiles[data-bsx-stack] > .bsx-tile:last-child{margin-bottom:0}
  /* a card that has been overtaken should not keep competing for attention */
  .bsx .bsx-tiles[data-bsx-stack] > .bsx-tile::after{
    content:"";position:absolute;inset:0;border-radius:inherit;
    background:var(--navy);opacity:0;pointer-events:none;
    transition:opacity 200ms linear;
  }

  /* ---- anchor rail ---- */
  .bsx .bsx-toc__k{
    flex:0 0 100%;margin:0 0 10px;
  }

  /* ---- checks ---- */
  .bsx .bsx-checks__ic{width:24px;height:24px;border-radius:7px}
  .bsx .bsx-checks--ic li{font-size:14px}
}

@media (max-width:560px){
  .bsx .bsx-pairs > *{flex:0 0 90%}
  .bsx .bsx-mrows[data-bsx-swipe] > .bsx-mrow{flex:0 0 90%}
}

@media (prefers-reduced-motion:reduce){
  .bsx .bsx-tile::before,.bsx .bsx-tile__ic{transition-duration:1ms}
}

/* ===========================================================================
   Breadcrumb
   ========================================================================== */
.bsx .bsx-crumbband{padding-block:0}
.bsx .bsx-crumbs{padding-block:14px 0}
.bsx .bsx-crumbs ol{
  list-style:none;margin:0;padding:0;
  display:flex;flex-wrap:wrap;align-items:center;gap:2px;
}
.bsx .bsx-crumbs li{
  display:inline-flex;align-items:center;gap:2px;min-width:0;
}
.bsx .bsx-crumbs a,
.bsx .bsx-crumbs [aria-current]{
  font-family:var(--font-system);font-size:12.5px;font-weight:600;
  line-height:1.3;padding:5px 7px;border-radius:7px;text-decoration:none;
  color:var(--slate);
  transition:color 180ms var(--bsx-ease),background 180ms var(--bsx-ease);
}
.bsx .bsx-crumbs a:hover{color:var(--blue);background:var(--mist)}
.bsx .bsx-crumbs [aria-current]{color:var(--navy);font-weight:700}
.bsx .bsx-crumbs li span[aria-hidden]{
  display:inline-grid;place-items:center;color:var(--slate);opacity:.42;
}
.bsx .bsx-crumbs li span[aria-hidden] svg{transform:rotate(-90deg)}
[data-bsx-dark] .bsx-crumbs a{color:var(--bsx-ink-dark)}
[data-bsx-dark] .bsx-crumbs a:hover{color:var(--teal);background:rgba(235,245,255,.07)}
[data-bsx-dark] .bsx-crumbs [aria-current]{color:var(--white)}

/* ===========================================================================
   Keep reading
   Every link the page's own copy had no room for. It sits above the closing
   CTA so a reader who is not ready to book still has somewhere to go.
   ========================================================================== */
.bsx .bsx-nextrow{
  display:grid;grid-template-columns:minmax(0,220px) minmax(0,1fr);
  gap:clamp(18px,2.6vw,40px);align-items:start;
}
@media (max-width:820px){
  .bsx .bsx-nextrow{grid-template-columns:1fr;gap:16px}
}
.bsx h2.bsx-next__k{
  display:flex;align-items:center;gap:8px;margin:0;
  font-family:var(--font-system);font-size:11.5px;font-weight:700;
  letter-spacing:.11em;text-transform:uppercase;color:var(--slate);
}
.bsx .bsx-next__k svg{color:var(--blue);flex:0 0 auto}
[data-bsx-dark] .bsx h2.bsx-next__k{color:var(--bsx-ink-dark)}
[data-bsx-dark] .bsx .bsx-next__k svg{color:var(--teal)}

.bsx .bsx-next{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(268px,1fr));
  gap:8px 18px;
}
.bsx a.bsx-nextlink{
  display:flex;align-items:flex-start;gap:10px;
  padding:11px 12px 11px 10px;border-radius:11px;
  border:1px solid transparent;text-decoration:none;
  font-family:var(--font-system);font-size:14.5px;line-height:1.45;
  font-weight:600;color:var(--navy);
  transition:border-color 200ms var(--bsx-ease),background 200ms var(--bsx-ease),
             color 200ms var(--bsx-ease);
}
.bsx a.bsx-nextlink svg{
  flex:0 0 auto;margin-top:2px;color:var(--blue);
  transition:transform 260ms var(--bsx-ease);
}
.bsx a.bsx-nextlink:hover{
  background:var(--white);border-color:var(--mist-border);color:var(--blue);
}
.bsx a.bsx-nextlink:hover svg{transform:translateX(3px)}
[data-bsx-dark] .bsx a.bsx-nextlink{color:var(--white)}
[data-bsx-dark] .bsx a.bsx-nextlink svg{color:var(--teal)}
[data-bsx-dark] .bsx a.bsx-nextlink:hover{
  background:rgba(235,245,255,.07);border-color:var(--bsx-rule-dark);color:var(--teal);
}

@media (max-width:900px){
  .bsx .bsx-crumbs{padding-block:12px 0}
  .bsx .bsx-crumbs ol{
    flex-wrap:nowrap;overflow-x:auto;
    margin-inline:calc(var(--bsx-gut) * -1);padding-inline:var(--bsx-gut);
    -ms-overflow-style:none;scrollbar-width:none;
  }
  .bsx .bsx-crumbs ol::-webkit-scrollbar{display:none}
  .bsx .bsx-crumbs li{flex:0 0 auto}
  .bsx .bsx-next{grid-template-columns:1fr;gap:4px}
  .bsx a.bsx-nextlink{min-height:44px;align-items:center}
  .bsx a.bsx-nextlink svg{margin-top:0}
}

/* ===========================================================================
   Measure
   65-75 characters is the readable range; the column is set from that rather
   than from the grid, and only the article uses it.
   ========================================================================== */
.bsx .bsx-post__w{max-width:74ch;margin-inline:auto}
.bsx .bsx-post__head{padding-bottom:0}
.bsx .bsx-post__head .bsx-crumbs{padding-block:0 18px}
.bsx a.bsx-tag--link{
  text-decoration:none;
  transition:border-color 200ms var(--bsx-ease),color 200ms var(--bsx-ease);
}
.bsx a.bsx-tag--link:hover{border-color:var(--blue);color:var(--blue)}
.bsx .bsx-post__head h1{margin-top:16px;max-width:22ch}
.bsx p.bsx-post__stand{
  margin-top:18px;font-size:clamp(17px,1.5vw,19.5px);line-height:1.6;
  color:var(--slate);max-width:64ch;
}
[data-bsx-dark] .bsx-post__stand{color:var(--bsx-ink-dark)}
.bsx .bsx-post__meta{
  display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;margin-top:22px;
  padding-block:16px;border-block:1px solid var(--bsx-rule);
  font-family:var(--font-system);font-size:13px;color:var(--slate);
}
.bsx .bsx-post__meta span{display:inline-flex;align-items:center;gap:8px}
.bsx .bsx-post__meta span + span::before{
  content:"";width:3px;height:3px;border-radius:50%;background:currentColor;
  opacity:.45;margin-right:6px;
}
.bsx figure.bsx-post__hero{
  margin:26px 0 0;border-radius:18px;overflow:hidden;
  border:1px solid var(--mist-border);background:var(--mist);
}
.bsx .bsx-post__hero img{
  display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:contain;
}
.bsx .bsx-post__hero figcaption{
  padding:12px 18px;font-family:var(--font-system);font-size:12.5px;
  line-height:1.5;color:var(--slate);border-top:1px solid var(--mist-border);
  background:var(--white);
}

/* ===========================================================================
   Prose
   ========================================================================== */
.bsx .bsx-prose{padding-block:clamp(30px,3.4vw,44px)}
.bsx .bsx-prose p{
  margin-top:20px;font-size:17px;line-height:1.72;color:var(--slate);
  text-wrap:pretty;
}
.bsx .bsx-prose p:first-child{margin-top:0}
.bsx .bsx-prose h2{
  margin-top:clamp(38px,4vw,54px);font-size:clamp(23px,2.3vw,29px);
  line-height:1.24;letter-spacing:-.022em;color:var(--navy);scroll-margin-top:96px;
}
.bsx .bsx-prose h3{
  margin-top:clamp(26px,2.6vw,34px);font-size:19px;line-height:1.3;
  letter-spacing:-.016em;color:var(--navy);
}
.bsx .bsx-prose h2 + p,.bsx .bsx-prose h3 + p{margin-top:12px}
[data-bsx-dark] .bsx-prose p{color:var(--bsx-ink-dark)}
[data-bsx-dark] .bsx-prose h2,[data-bsx-dark] .bsx-prose h3{color:var(--white)}

/* the pull quote carries its own marks so the copy does not have to */
.bsx blockquote.bsx-pull{
  margin:clamp(28px,3vw,40px) 0 0;padding:4px 0 4px 26px;
  border-left:3px solid var(--blue);position:relative;
}
.bsx .bsx-pull p{
  margin:0;font-family:var(--font-display);font-size:clamp(19px,1.9vw,23px);
  line-height:1.42;font-weight:600;letter-spacing:-.018em;color:var(--navy);
}
.bsx .bsx-pull p::before{content:"\201C"}
.bsx .bsx-pull p::after{content:"\201D"}
[data-bsx-dark] .bsx-pull{border-left-color:var(--teal)}
[data-bsx-dark] .bsx-pull p{color:var(--white)}

/* ===========================================================================
   Data tables
   ========================================================================== */
.bsx .bsx-tablewrap{
  margin-top:clamp(26px,2.8vw,36px);overflow-x:auto;
  border:1px solid var(--border);border-radius:14px;background:var(--white);
  -webkit-overflow-scrolling:touch;
}
[data-bsx-dark] .bsx-tablewrap{
  background:rgba(235,245,255,.05);border-color:var(--bsx-rule-dark);
}
.bsx table.bsx-table{
  width:100%;border-collapse:collapse;font-family:var(--font-system);
  font-size:14px;line-height:1.5;min-width:460px;
}
.bsx .bsx-table th,.bsx .bsx-table td{
  padding:12px 16px;text-align:left;vertical-align:top;
  border-bottom:1px solid var(--bsx-rule);
}
[data-bsx-dark] .bsx-table th,[data-bsx-dark] .bsx-table td{
  border-bottom-color:var(--bsx-rule-dark);
}
.bsx .bsx-table thead th{
  font-size:11px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;
  color:var(--slate);background:var(--mist);white-space:nowrap;
  position:sticky;top:0;
}
[data-bsx-dark] .bsx-table thead th{
  background:rgba(235,245,255,.07);color:var(--teal);
}
.bsx .bsx-table tbody th{font-weight:650;color:var(--navy)}
[data-bsx-dark] .bsx-table tbody th{color:var(--white)}
.bsx .bsx-table td{color:var(--slate);font-variant-numeric:tabular-nums}
[data-bsx-dark] .bsx-table td{color:var(--bsx-ink-dark)}
.bsx .bsx-table tbody tr:last-child th,
.bsx .bsx-table tbody tr:last-child td{border-bottom:0}
.bsx .bsx-table tbody tr:hover th,
.bsx .bsx-table tbody tr:hover td{background:rgba(235,245,255,.55)}
[data-bsx-dark] .bsx-table tbody tr:hover th,
[data-bsx-dark] .bsx-table tbody tr:hover td{background:rgba(235,245,255,.05)}

/* ===========================================================================
   Inline lead magnet
   ========================================================================== */
.bsx aside.bsx-magnet{
  display:grid;grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;gap:18px;
  margin:clamp(30px,3.2vw,42px) 0 0;padding:22px 24px;border-radius:18px;
  background:linear-gradient(135deg,rgba(49,92,253,.07),rgba(40,220,209,.07)),
             var(--white);
  border:1px solid var(--mist-border);
}
[data-bsx-dark] .bsx-magnet{
  background:linear-gradient(135deg,rgba(49,92,253,.2),rgba(40,220,209,.12)),
             var(--navy-soft);
  border-color:var(--bsx-rule-dark);
}
.bsx .bsx-magnet__ic{
  display:grid;place-items:center;width:48px;height:48px;flex:0 0 auto;
  border-radius:14px;background:var(--white);border:1px solid var(--mist-border);
  color:var(--blue);
}
[data-bsx-dark] .bsx-magnet__ic{
  background:rgba(12,22,61,.55);border-color:var(--bsx-rule-dark);color:var(--teal);
}
.bsx .bsx-magnet__k{
  display:block;font-family:var(--font-system);font-size:10.5px;font-weight:700;
  letter-spacing:.11em;text-transform:uppercase;color:var(--blue);
}
[data-bsx-dark] .bsx-magnet__k{color:var(--teal)}
.bsx .bsx-magnet h3{
  margin-top:5px;font-size:17px;line-height:1.3;letter-spacing:-.016em;
  color:var(--navy);
}
[data-bsx-dark] .bsx-magnet h3{color:var(--white)}
.bsx .bsx-magnet p{
  margin-top:7px;font-size:13.5px;line-height:1.55;color:var(--slate);
}
[data-bsx-dark] .bsx-magnet p{color:var(--bsx-ink-dark)}
.bsx .bsx-magnet .bsx-btn{white-space:nowrap}

/* ===========================================================================
   Author, keep reading, notice
   ========================================================================== */
.bsx .bsx-author{
  display:flex;gap:18px;align-items:flex-start;padding:24px;border-radius:18px;
  border:1px solid var(--border);background:var(--white);
}
[data-bsx-dark] .bsx-author{
  background:rgba(235,245,255,.06);border-color:var(--bsx-rule-dark);
}
.bsx .bsx-author__ic{
  display:grid;place-items:center;width:54px;height:54px;flex:0 0 auto;
  border-radius:50%;background:var(--mist);border:1px solid var(--mist-border);
  color:var(--blue);
}
[data-bsx-dark] .bsx-author__ic{
  background:rgba(235,245,255,.08);border-color:var(--bsx-rule-dark);color:var(--teal);
}
.bsx .bsx-author__k{
  font-family:var(--font-system);font-size:10.5px;font-weight:700;
  letter-spacing:.11em;text-transform:uppercase;color:var(--slate);
}
.bsx h2.bsx-author__n{margin-top:4px;font-size:18px;letter-spacing:-.018em}
.bsx .bsx-author p{margin-top:9px;font-size:14.5px;line-height:1.6}

.bsx .bsx-rel{
  margin-top:clamp(24px,2.6vw,32px);display:grid;
  grid-template-columns:repeat(auto-fit,minmax(268px,1fr));
  gap:clamp(14px,1.8vw,20px);
}
.bsx a.bsx-relcard{
  display:flex;flex-direction:column;gap:9px;padding:20px 22px;border-radius:16px;
  background:var(--white);border:1px solid var(--border);text-decoration:none;
  transition:border-color 240ms var(--bsx-ease),transform 240ms var(--bsx-ease),
             box-shadow 240ms var(--bsx-ease);
}
.bsx a.bsx-relcard:hover{
  border-color:var(--blue);transform:translateY(-3px);
  box-shadow:0 20px 40px -28px rgba(12,22,61,.42);
}
[data-bsx-dark] .bsx-relcard{
  background:rgba(235,245,255,.06);border-color:var(--bsx-rule-dark);
}
.bsx .bsx-relcard__k{
  display:inline-flex;align-items:center;gap:7px;font-family:var(--font-system);
  font-size:10.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  color:var(--blue);
}
[data-bsx-dark] .bsx-relcard__k{color:var(--teal)}
.bsx .bsx-relcard__t{
  font-family:var(--font-display);font-size:16.5px;line-height:1.34;
  font-weight:650;letter-spacing:-.016em;color:var(--navy);
}
[data-bsx-dark] .bsx-relcard__t{color:var(--white)}
.bsx .bsx-relcard svg{margin-top:auto;color:var(--blue)}
[data-bsx-dark] .bsx-relcard svg{color:var(--teal)}

/* a case study that is a worked example says so at the top, in the body */
.bsx .bsx-notice{
  display:flex;gap:14px;align-items:flex-start;padding:18px 20px;
  border-radius:14px;background:var(--warn-surface,#FFF6E3);
  border:1px solid var(--warn-border,#F3D89B);
}
.bsx .bsx-notice svg{flex:0 0 auto;margin-top:2px;color:#8A6412}
.bsx .bsx-notice p{margin:0;font-size:14.5px;line-height:1.6;color:#5C4308}
.bsx .bsx-notice b{color:#3D2C05}

/* ===========================================================================
   MOBILE
   ========================================================================== */
@media (max-width:900px){
  .bsx .bsx-post__w{max-width:none}
  .bsx .bsx-prose p{font-size:16px;line-height:1.68;margin-top:17px}
  .bsx .bsx-post__head h1{max-width:none}
  .bsx .bsx-post__meta{gap:6px 12px;font-size:12.5px}
  .bsx .bsx-post__meta span + span::before{margin-right:4px}

  /* the magnet stacks and the button spans the card */
  .bsx aside.bsx-magnet{
    grid-template-columns:auto minmax(0,1fr);gap:14px;padding:18px;
  }
  .bsx .bsx-magnet .bsx-btn{grid-column:1 / -1;width:100%;justify-content:center}
  .bsx .bsx-magnet__ic{width:42px;height:42px;border-radius:12px}

  /* tables keep their own scroll rather than widening the page */
  .bsx .bsx-tablewrap{
    margin-inline:calc(var(--bsx-gut) * -1);border-radius:0;border-inline:0;
  }
  .bsx table.bsx-table{font-size:13.5px}
  .bsx .bsx-table th,.bsx .bsx-table td{padding:10px 14px}

  .bsx .bsx-author{flex-direction:column;gap:14px;padding:20px}
  .bsx .bsx-rel{grid-template-columns:1fr}
  .bsx blockquote.bsx-pull{padding-left:18px}
  .bsx .bsx-post__hero{border-radius:14px}
}

/* ===========================================================================
   Download / checklist cards
   ========================================================================== */
.bsx .bsx-dls{
  margin-top:clamp(30px,3.6vw,46px);display:grid;
  grid-template-columns:repeat(auto-fill,minmax(292px,1fr));
  gap:clamp(14px,1.8vw,20px);
}
.bsx article.bsx-dl{
  display:flex;flex-direction:column;padding:22px 22px 20px;border-radius:18px;
  background:var(--white);border:1px solid var(--border);position:relative;
  transition:border-color 240ms var(--bsx-ease),transform 240ms var(--bsx-ease),
             box-shadow 240ms var(--bsx-ease);
}
.bsx article.bsx-dl:hover{
  border-color:var(--blue);transform:translateY(-3px);
  box-shadow:0 22px 44px -28px rgba(12,22,61,.42);
}
[data-bsx-dark] .bsx-dl{
  background:rgba(235,245,255,.06);border-color:var(--bsx-rule-dark);
}
.bsx .bsx-dl.is-feat{border-color:var(--blue)}
.bsx .bsx-dl.is-feat::before{
  content:"";position:absolute;inset:0 0 auto 0;height:3px;border-radius:18px 18px 0 0;
  background:linear-gradient(90deg,var(--blue),var(--teal));
}
.bsx .bsx-dl.is-soon{opacity:.72}

.bsx .bsx-dl__top{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.bsx .bsx-dl__ic{
  display:grid;place-items:center;width:44px;height:44px;flex:0 0 auto;
  border-radius:13px;background:var(--mist);border:1px solid var(--mist-border);
  color:var(--blue);
  transition:background 240ms var(--bsx-ease),color 240ms var(--bsx-ease);
}
[data-bsx-dark] .bsx-dl__ic{
  background:rgba(235,245,255,.08);border-color:var(--bsx-rule-dark);color:var(--teal);
}
.bsx .bsx-dl:hover .bsx-dl__ic{background:var(--blue);color:var(--white)}
[data-bsx-dark] .bsx-dl:hover .bsx-dl__ic{background:var(--teal);color:var(--navy)}

.bsx .bsx-dl__chip{
  display:inline-flex;align-items:center;font-family:var(--font-system);
  font-size:10.5px;font-weight:700;letter-spacing:.06em;border-radius:6px;
  padding:4px 8px;margin-left:auto;white-space:nowrap;
  background:var(--mist);color:var(--slate);border:1px solid var(--mist-border);
}
.bsx .bsx-dl__chip.is-fmt{
  background:rgba(49,92,253,.1);color:var(--blue);border-color:rgba(49,92,253,.24);
}
.bsx .bsx-dl__chip.is-soon{
  background:var(--warn-surface,#FFF6E3);color:#7A5810;
  border-color:var(--warn-border,#F3D89B);letter-spacing:.02em;
}
[data-bsx-dark] .bsx-dl__chip{
  background:rgba(235,245,255,.08);color:var(--bsx-ink-dark);
  border-color:var(--bsx-rule-dark);
}
[data-bsx-dark] .bsx-dl__chip.is-fmt{color:var(--teal)}

.bsx .bsx-dl h3{font-size:17px;line-height:1.3;letter-spacing:-.018em}
.bsx .bsx-dl p{margin-top:9px;font-size:14px;line-height:1.55;flex:1 1 auto}
.bsx p.bsx-dl__meta{
  display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:14px;
  font-family:var(--font-system);font-size:11.5px;font-weight:600;
  color:var(--slate);flex:0 0 auto;
}
.bsx .bsx-dl__cat{
  display:inline-flex;padding:3px 8px;border-radius:999px;
  background:var(--mist);border:1px solid var(--mist-border);
  font-size:10.5px;font-weight:700;letter-spacing:.05em;color:var(--blue);
}
[data-bsx-dark] .bsx-dl__cat{
  background:rgba(235,245,255,.08);border-color:var(--bsx-rule-dark);color:var(--teal);
}
.bsx a.bsx-dl__go{
  display:inline-flex;align-items:center;gap:8px;margin-top:16px;
  padding-top:14px;border-top:1px solid var(--bsx-rule);
  font-family:var(--font-system);font-size:13.5px;font-weight:700;
  color:var(--blue);text-decoration:none;
  transition:gap 220ms var(--bsx-ease);
}
[data-bsx-dark] .bsx-dl__go{color:var(--teal);border-top-color:var(--bsx-rule-dark)}
.bsx .bsx-dl__go svg{transition:transform 260ms var(--bsx-ease)}
.bsx .bsx-dl:hover .bsx-dl__go svg{transform:translateX(3px)}

/* ===========================================================================
   Article cards
   ========================================================================== */
.bsx .bsx-pcs{
  margin-top:clamp(30px,3.6vw,46px);display:grid;
  grid-template-columns:repeat(auto-fill,minmax(300px,1fr));
  gap:clamp(18px,2.2vw,26px);
}
@media (min-width:1000px){
  .bsx .bsx-pcs--feat{grid-template-columns:repeat(3,minmax(0,1fr))}
}
.bsx article.bsx-pc{
  display:flex;flex-direction:column;border-radius:18px;overflow:hidden;
  background:var(--white);border:1px solid var(--border);
  transition:border-color 240ms var(--bsx-ease),transform 240ms var(--bsx-ease),
             box-shadow 240ms var(--bsx-ease);
}
.bsx article.bsx-pc:hover,.bsx article.bsx-pc:focus-within{
  border-color:var(--blue);transform:translateY(-3px);
  box-shadow:0 24px 48px -30px rgba(12,22,61,.45);
}
[data-bsx-dark] .bsx-pc{
  background:rgba(235,245,255,.06);border-color:var(--bsx-rule-dark);
}
.bsx .bsx-pc.is-feat{border-color:var(--mist-border)}

.bsx .bsx-pc__fig{
  display:block;aspect-ratio:16/9;overflow:hidden;background:var(--mist);
  border-bottom:1px solid var(--bsx-rule);
}
[data-bsx-dark] .bsx-pc__fig{background:var(--navy-soft);border-bottom-color:var(--bsx-rule-dark)}
.bsx .bsx-pc__fig img{
  width:100%;height:100%;object-fit:cover;display:block;
  transition:transform 420ms var(--bsx-ease);
}
.bsx .bsx-pc:hover .bsx-pc__fig img{transform:scale(1.03)}

.bsx .bsx-pc__body{
  display:flex;flex-direction:column;flex:1 1 auto;padding:20px 22px 22px;
}
.bsx .bsx-pc__chips{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:11px}
.bsx .bsx-pc__chip{
  display:inline-flex;font-family:var(--font-system);font-size:10.5px;
  font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:var(--blue);background:rgba(49,92,253,.09);
  border:1px solid rgba(49,92,253,.2);border-radius:999px;padding:4px 10px;
}
[data-bsx-dark] .bsx-pc__chip{
  color:var(--teal);background:rgba(40,220,209,.12);border-color:rgba(40,220,209,.28);
}
.bsx .bsx-pc h3{font-size:17.5px;line-height:1.3;letter-spacing:-.02em}
.bsx .bsx-pc h3 a{
  color:var(--navy);text-decoration:none;
  transition:color 200ms var(--bsx-ease);
}
.bsx .bsx-pc h3 a::after{content:"";position:absolute;inset:0}
.bsx article.bsx-pc{position:relative}
.bsx .bsx-pc:hover h3 a{color:var(--blue)}
[data-bsx-dark] .bsx-pc h3 a{color:var(--white)}
[data-bsx-dark] .bsx-pc:hover h3 a{color:var(--teal)}
.bsx .bsx-pc p{margin-top:10px;font-size:14px;line-height:1.58;flex:1 1 auto}
.bsx p.bsx-pc__meta{
  display:flex;align-items:center;gap:7px;margin-top:16px;
  font-family:var(--font-system);font-size:11.5px;font-weight:600;
  color:var(--slate);flex:0 0 auto;
}
.bsx .bsx-pc__meta svg{color:var(--blue);flex:0 0 auto}
[data-bsx-dark] .bsx-pc__meta svg{color:var(--teal)}

/* ===========================================================================
   MOBILE
   ========================================================================== */
@media (max-width:900px){
  /* both libraries swipe rather than stacking twenty cards deep */
  .bsx .bsx-dls,.bsx .bsx-pcs{
    display:flex;flex-wrap:nowrap;overflow-x:auto;overscroll-behavior-x:contain;
    scroll-snap-type:x mandatory;scroll-padding-inline:var(--bsx-gut);gap:14px;
    margin-inline:calc(var(--bsx-gut) * -1);padding-inline:var(--bsx-gut);
    padding-bottom:6px;-ms-overflow-style:none;scrollbar-width:none;
  }
  .bsx .bsx-dls::-webkit-scrollbar,
  .bsx .bsx-pcs::-webkit-scrollbar{display:none}
  .bsx .bsx-dls > *,.bsx .bsx-pcs > *{
    flex:0 0 84%;scroll-snap-align:start;min-width:0;
  }
  .bsx article.bsx-dl{padding:18px 18px 16px}
  .bsx .bsx-dl h3{font-size:16px}
  .bsx .bsx-dl__ic{width:40px;height:40px;border-radius:12px}
  .bsx a.bsx-dl__go{min-height:44px;margin-top:12px}
  .bsx .bsx-pc__body{padding:16px 18px 18px}
  .bsx .bsx-pc h3{font-size:16.5px}
}

@media (max-width:560px){
  .bsx .bsx-dls > *,.bsx .bsx-pcs > *{flex:0 0 88%}
}
@media (max-width:900px){

  /* ---------------------------------------------------------------------
     Breadcrumb: the current page is the longest item and the least useful
     to read in full, since the H1 says the same thing directly below it.
     -------------------------------------------------------------------- */
  .bsx .bsx-crumbs li:last-child{min-width:0;flex:0 1 auto}
  .bsx .bsx-crumbs [aria-current]{
    display:block;max-width:52vw;overflow:hidden;text-overflow:ellipsis;
    white-space:nowrap;
  }
  .bsx .bsx-crumbs a{
    white-space:nowrap;min-height:34px;display:inline-flex;align-items:center;
  }

  /* ---------------------------------------------------------------------
     Touch targets
     The visible chip stays its designed size; the hit area is grown with a
     centred pseudo-element so nothing shifts and nothing looks oversized.
     -------------------------------------------------------------------- */
  .bsx a.bsx-tag--link,
  .bs-footer__email,
  .bs-footer__social,
  .bs-footer__legal-links a,
  .bsx .bsx-crumbs a{position:relative}
  .bsx a.bsx-tag--link::after,
  .bs-footer__email::after,
  .bs-footer__social::after,
  .bs-footer__legal-links a::after,
  .bsx .bsx-crumbs a::after{
    content:"";position:absolute;left:50%;top:50%;
    transform:translate(-50%,-50%);
    width:100%;min-width:44px;height:44px;
  }

  .bsx a.bsx-tag--link{min-height:32px;padding-block:7px}
  .bs-footer__email{min-height:32px;display:inline-flex;align-items:center}
  .bs-footer__social{
    min-height:40px;min-width:40px;display:inline-flex;
    align-items:center;justify-content:center;
  }
  .bs-logo{min-height:40px;display:inline-flex;align-items:center}

  /* the in-article contents rail is a list of links, so it gets real rows */
  .bsx .bsx-toc a{min-height:40px}
}
/* ===========================================================================
   Client mark strip
   ========================================================================== */
.bsx .bsx-marks{display:grid;gap:clamp(20px,2.6vw,30px);justify-items:center}
.bsx p.bsx-marks__k{
  margin:0;text-align:center;max-width:46ch;
  font-family:var(--font-system);font-size:11.5px;font-weight:700;
  letter-spacing:.13em;text-transform:uppercase;
  color:var(--bsx-ink-dark);opacity:.72;
}
.bsx .bsx-marks__row{
  list-style:none;margin:0;padding:0;width:100%;
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  gap:clamp(16px,2.6vw,34px) clamp(14px,2vw,30px);
  align-items:center;justify-items:center;
}
@media (min-width:1040px){
  .bsx .bsx-marks__row{grid-template-columns:repeat(8,minmax(0,1fr))}
}
.bsx .bsx-marks__i{
  display:flex;align-items:center;justify-content:center;
  width:100%;min-width:0;min-height:64px;
}
.bsx .bsx-marks__i img{
  /* Rendered at intrinsic size on purpose. The files are already normalised
     so every mark covers about the same area of ink — forcing a shared
     height or a shared width here would undo that and put a long wordmark
     next to a square lockup at wildly different weights. The grid only has
     to give each cell enough room for the widest of them. */
  width:auto;height:auto;max-width:100%;display:block;
  opacity:.72;
  transition:opacity 260ms var(--bsx-ease),transform 260ms var(--bsx-ease);
}
.bsx .bsx-marks__i img:hover{opacity:1;transform:translateY(-2px)}
.bsx p.bsx-marks__note{
  margin:0;text-align:center;max-width:52ch;
  font-family:var(--font-system);font-size:12.5px;line-height:1.5;
  color:var(--bsx-ink-dark);opacity:.6;
}

/* the strip also appears on light bands on a few pages */
.bsx-canvas .bsx-marks__k,.bsx-mist .bsx-marks__k,
.bsx-canvas .bsx-marks__note,.bsx-mist .bsx-marks__note{color:var(--slate)}
.bsx-canvas .bsx-marks__i img,.bsx-mist .bsx-marks__i img{
  filter:brightness(0) saturate(100%) invert(28%) sepia(12%)
         saturate(1100%) hue-rotate(178deg) brightness(94%) contrast(90%);
}

/* ===========================================================================
   Homepage marquee: the same marks, moving
   ========================================================================== */
.bsx .bsx-plate--mark{
  display:flex;align-items:center;justify-content:center;
  min-width:clamp(150px,16vw,210px);padding-inline:clamp(14px,2vw,26px);
  background:none;border:0;box-shadow:none;
}
.bsx .bsx-plate--mark img{
  width:auto;height:auto;max-width:100%;display:block;
  opacity:.62;filter:grayscale(1);
  transition:opacity 300ms var(--bsx-ease),filter 300ms var(--bsx-ease);
}
.bsx .bsx-marquee:hover .bsx-plate--mark img{opacity:.8}
.bsx .bsx-plate--mark img:hover{opacity:1;filter:grayscale(0)}

@media (max-width:900px){
  /* fewer columns rather than smaller marks, so the cell stays wide enough
     for the widest of them and nothing has to be scaled down */
  .bsx .bsx-marks__row{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px 14px}
  .bsx .bsx-marks__i{min-height:56px}
  .bsx p.bsx-marks__k{font-size:10.5px;letter-spacing:.11em}
  .bsx .bsx-plate--mark{min-width:150px;padding-inline:14px}
}
@media (max-width:560px){
  .bsx .bsx-marks__row{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 10px}
}
@media (prefers-reduced-motion:reduce){
  .bsx .bsx-marks__i img,.bsx .bsx-plate--mark img{transition-duration:1ms}
}

/* ===========================================================================
   Listing hero
   ========================================================================== */
.bsx .bsx-lhero{padding-block:clamp(34px,5vw,72px) clamp(28px,4vw,52px)}
.bsx .bsx-lhero__in{
  display:flex;flex-direction:column;align-items:center;text-align:center;
  gap:0;
}
.bsx .bsx-lhero__crumbs{margin-bottom:clamp(14px,2vw,22px)}
.bsx .bsx-lhero__crumbs .bsx-crumbs{padding-block:0}
.bsx .bsx-lhero__crumbs .bsx-crumbs ol{justify-content:center}
.bsx .bsx-lhero h1{
  margin-top:16px;max-width:16ch;text-wrap:balance;
}
.bsx .bsx-lhero p.bsx-lead{
  margin-top:16px;max-width:58ch;margin-inline:auto;
}
.bsx .bsx-lhero__cta{margin-top:clamp(22px,3vw,32px)}

/* ===========================================================================
   Toolbar
   ========================================================================== */
.bsx .bsx-tool{padding-block:0 clamp(18px,2.4vw,26px)}
.bsx .bsx-tool__row{
  display:flex;flex-wrap:wrap;align-items:center;gap:14px 20px;
  padding-bottom:16px;
}
.bsx .bsx-search{
  position:relative;flex:1 1 320px;min-width:0;display:flex;align-items:center;
}
.bsx .bsx-search svg{
  position:absolute;left:16px;color:var(--slate);pointer-events:none;opacity:.7;
}
.bsx input.bsx-search__in{
  width:100%;height:48px;padding:0 16px 0 44px;border-radius:999px;
  border:1px solid var(--border);background:var(--white);
  font-family:var(--font-system);font-size:15px;color:var(--navy);
  transition:border-color 200ms var(--bsx-ease),box-shadow 200ms var(--bsx-ease);
}
.bsx input.bsx-search__in::placeholder{color:var(--ink-3,#7C8A88);opacity:.8}
.bsx input.bsx-search__in:focus{
  outline:none;border-color:var(--blue);
  box-shadow:0 0 0 4px rgba(49,92,253,.14);
}
.bsx p.bsx-tool__count{
  margin:0;flex:0 0 auto;font-family:var(--font-system);font-size:13px;
  font-weight:600;color:var(--slate);font-variant-numeric:tabular-nums;
}

.bsx .bsx-fchips{
  display:flex;flex-wrap:wrap;gap:8px;padding-top:4px;
}
.bsx button.bsx-fchip{
  height:38px;padding-inline:16px;border-radius:999px;cursor:pointer;
  border:1px solid var(--border);background:var(--white);
  font-family:var(--font-system);font-size:13.5px;font-weight:600;
  color:var(--slate);
  transition:border-color 200ms var(--bsx-ease),color 200ms var(--bsx-ease),
             background 200ms var(--bsx-ease);
}
.bsx button.bsx-fchip:hover{border-color:var(--blue);color:var(--navy)}
.bsx button.bsx-fchip.is-on{
  background:var(--navy);border-color:var(--navy);color:var(--white);
}

/* ===========================================================================
   Empty state
   ========================================================================== */
.bsx .bsx-empty{
  margin:0;padding:clamp(26px,4vw,44px) 0;text-align:center;
  font-family:var(--font-system);font-size:15px;color:var(--slate);
}
.bsx .bsx-empty--band{
  display:grid;justify-items:center;gap:10px;max-width:60ch;
  margin-inline:auto;text-align:center;
}
.bsx .bsx-empty--band svg{color:var(--blue);margin-bottom:4px}
.bsx .bsx-empty--band h2{
  font-size:clamp(21px,2.4vw,27px);line-height:1.26;letter-spacing:-.02em;
  text-wrap:balance;
}
.bsx .bsx-empty--band p{font-size:15.5px;line-height:1.62}

/* ===========================================================================
   Show more
   ========================================================================== */
.bsx .bsx-more{
  display:flex;flex-direction:column;align-items:center;gap:12px;
  margin-top:clamp(28px,3.6vw,44px);
}
.bsx p.bsx-more__end{
  margin:0;font-family:var(--font-system);font-size:13px;color:var(--slate);
}

/* ===========================================================================
   The one form
   ========================================================================== */
.bsx .bsx-lead__in{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,420px);
  gap:clamp(26px,4vw,56px);align-items:center;
}
@media (max-width:900px){
  .bsx .bsx-lead__in{grid-template-columns:1fr;gap:26px}
}
.bsx .bsx-lead__txt h2{margin-top:14px;max-width:18ch;text-wrap:balance}
.bsx p.bsx-lead__b{
  margin-top:14px;max-width:52ch;font-size:16px;line-height:1.62;
  color:var(--bsx-ink-dark);
}
.bsx form.bsx-form{
  display:grid;gap:14px;padding:clamp(22px,3vw,30px);border-radius:20px;
  background:rgba(235,245,255,.07);border:1px solid var(--bsx-rule-dark);
}
.bsx .bsx-field{display:grid;gap:7px}
.bsx .bsx-field__l{
  font-family:var(--font-system);font-size:12px;font-weight:700;
  letter-spacing:.06em;text-transform:uppercase;color:var(--bsx-ink-dark);
}
.bsx .bsx-field input{
  height:50px;padding-inline:16px;border-radius:12px;
  border:1px solid var(--bsx-rule-dark);background:rgba(12,22,61,.5);
  font-family:var(--font-system);font-size:15px;color:var(--white);
  transition:border-color 200ms var(--bsx-ease),box-shadow 200ms var(--bsx-ease);
}
.bsx .bsx-field input::placeholder{color:var(--bsx-ink-dark);opacity:.6}
.bsx .bsx-field input:focus{
  outline:none;border-color:var(--teal);
  box-shadow:0 0 0 4px rgba(40,220,209,.18);
}
.bsx .bsx-consent{
  display:grid;grid-template-columns:auto minmax(0,1fr);gap:11px;
  align-items:start;font-family:var(--font-system);font-size:13.5px;
  line-height:1.5;color:var(--bsx-ink-dark);cursor:pointer;
}
.bsx .bsx-consent input{
  width:20px;height:20px;margin:1px 0 0;accent-color:var(--teal);cursor:pointer;
}
.bsx .bsx-consent a{
  color:var(--teal);text-decoration:underline;text-underline-offset:2px;
  font-weight:600;
}
.bsx .bsx-consent a:hover{color:var(--white)}
.bsx .bsx-form .bsx-btn{width:100%;justify-content:center;margin-top:2px}
.bsx a.bsx-btn--teal,.bsx button.bsx-btn--teal{
  background:var(--teal);color:var(--navy);border-color:var(--teal);
}
.bsx button.bsx-btn--teal:hover{background:#3FE8DD;border-color:#3FE8DD}
.bsx .bsx-form__note{display:block;
  margin:0;min-height:1.2em;font-family:var(--font-system);font-size:13px;
  color:var(--bsx-ink-dark);
}
.bsx .bsx-form__note.is-ok{color:var(--teal)}
.bsx .bsx-form__note.is-bad{color:var(--coral)}

/* ===========================================================================
   Closing CTA on a blue band
   ========================================================================== */
.bsx .bsx-blue{background:var(--blue)}
.bsx .bsx-close--split{
  display:grid;grid-template-columns:minmax(0,1fr) auto;
  gap:clamp(20px,3vw,44px);align-items:center;text-align:left;
}
.bsx .bsx-close--split h2{max-width:20ch;text-wrap:balance}
.bsx .bsx-close--split p.bsx-lead{margin-top:12px;max-width:56ch}
.bsx a.bsx-btn--white{
  background:var(--white);color:var(--navy);border-color:var(--white);
  white-space:nowrap;
}
.bsx a.bsx-btn--white:hover{background:var(--mist);border-color:var(--mist)}

@media (max-width:900px){
  .bsx .bsx-close--split{grid-template-columns:1fr}
  .bsx a.bsx-btn--white{width:100%;justify-content:center}
  .bsx .bsx-tool__row{gap:12px}
  .bsx p.bsx-tool__count{order:3;width:100%}
  .bsx .bsx-fchips{
    flex-wrap:nowrap;overflow-x:auto;scroll-snap-type:x mandatory;
    margin-inline:calc(var(--bsx-gut) * -1);padding-inline:var(--bsx-gut);
    -ms-overflow-style:none;scrollbar-width:none;
  }
  .bsx .bsx-fchips::-webkit-scrollbar{display:none}
  .bsx button.bsx-fchip{flex:0 0 auto;scroll-snap-align:start}
  /* the listing grids stay grids on a phone; a swipe hides most of the list */
  .bsx #list .bsx-pcs,.bsx #list .bsx-dls{
    display:grid;grid-template-columns:1fr;overflow:visible;
    margin-inline:0;padding-inline:0;gap:14px;
  }
  .bsx #list .bsx-pcs > *,.bsx #list .bsx-dls > *{flex:none}
  .bsx .bsx-lhero h1{max-width:none}
}

/* ===========================================================================
   Centred hero extras
   ========================================================================== */
.bsx .bsx-lhero__chips{
  display:flex;flex-wrap:wrap;justify-content:center;gap:8px;
  margin-top:clamp(18px,2.4vw,26px);max-width:62ch;
}
.bsx .bsx-lhero__chip{
  display:inline-flex;align-items:center;padding:6px 13px;border-radius:999px;
  background:var(--mist);border:1px solid var(--mist-border);
  font-family:var(--font-system);font-size:12.5px;font-weight:600;
  color:var(--slate);
}
.bsx p.bsx-lhero__note{
  margin-top:14px;max-width:58ch;font-family:var(--font-system);
  font-size:14px;line-height:1.55;color:var(--slate);
}

/* ===========================================================================
   Why us: the comparison
   One column is held back and one carries the weight, because the section
   exists to make a choice obvious rather than to list sixteen sentences.
   ========================================================================== */
.bsx .bsx-vstable{margin-top:clamp(28px,3.6vw,44px);border-radius:18px}
.bsx .bsx-vstable table{min-width:560px}
.bsx .bsx-vstable thead th{
  font-size:12px;padding:16px 20px;letter-spacing:.08em;
  background:var(--mist);color:var(--slate);
}
.bsx .bsx-vstable th.bsx-vs__ushead{
  display:table-cell;background:var(--navy);color:var(--white);
}
.bsx .bsx-vstable th.bsx-vs__ushead svg{
  vertical-align:-3px;margin-right:8px;color:var(--teal);
}
.bsx .bsx-vstable td{
  padding:15px 20px;font-size:14.5px;line-height:1.5;vertical-align:top;
  width:50%;
}
.bsx td.bsx-vs__them{color:var(--slate);background:var(--white)}
.bsx td.bsx-vs__them svg{
  color:var(--coral);margin-right:10px;vertical-align:-2px;flex:0 0 auto;
}
.bsx td.bsx-vs__us{
  color:var(--navy);font-weight:600;
  background:linear-gradient(90deg,rgba(49,92,253,.08),rgba(40,220,209,.08));
  border-left:2px solid var(--blue);
}
.bsx td.bsx-vs__us svg{
  color:var(--blue);margin-right:10px;vertical-align:-2px;flex:0 0 auto;
}
.bsx .bsx-vstable tbody tr:hover td.bsx-vs__us{
  background:linear-gradient(90deg,rgba(49,92,253,.14),rgba(40,220,209,.12));
}

/* ===========================================================================
   People
   ========================================================================== */
.bsx .bsx-people{
  margin-top:clamp(28px,3.6vw,44px);display:grid;
  grid-template-columns:repeat(auto-fill,minmax(224px,1fr));
  gap:clamp(16px,2.2vw,26px);
}
.bsx article.bsx-person{
  display:flex;flex-direction:column;padding:22px;border-radius:18px;
  background:var(--white);border:1px solid var(--border);text-align:center;
  align-items:center;
  transition:border-color 240ms var(--bsx-ease),transform 240ms var(--bsx-ease);
}
.bsx article.bsx-person:hover{border-color:var(--blue);transform:translateY(-3px)}
.bsx .bsx-person__fig{
  width:100%;aspect-ratio:1;height:auto;border-radius:14px;overflow:hidden;
  background:var(--mist);border:1px solid var(--mist-border);
  display:grid;place-items:center;color:var(--blue);margin-bottom:14px;
}
.bsx .bsx-person__fig img{width:100%;height:100%;object-fit:cover;display:block}
.bsx .bsx-person h3{font-size:16.5px;letter-spacing:-.014em}
.bsx p.bsx-person__role{
  margin-top:5px;font-family:var(--font-system);font-size:13px;font-weight:600;
  color:var(--blue);
}
.bsx p.bsx-person__b{margin-top:10px;font-size:13.5px;line-height:1.55}
.bsx a.bsx-person__li{
  display:inline-flex;align-items:center;gap:7px;margin-top:14px;
  font-family:var(--font-system);font-size:13px;font-weight:600;
  color:var(--slate);text-decoration:none;
}
.bsx a.bsx-person__li:hover{color:var(--blue)}

@media (max-width:900px){
  .bsx .bsx-people{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
  .bsx .bsx-person__fig{width:76px;height:76px}
  .bsx .bsx-lhero__chips{gap:6px}
}

/* The card art is photographic, so it crops to the frame rather than sitting
   inside it, and takes a navy wash so nine different photographs still read
   as one row. */
.bsx .bsx-pc__fig{position:relative}
.bsx .bsx-pc__fig::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(12,22,61,.18),rgba(12,22,61,.46));
  transition:opacity 320ms var(--bsx-ease);
}
.bsx .bsx-pc:hover .bsx-pc__fig::after{opacity:.68}

/* ===========================================================================
   Listing toolbar, now inside the list section under its own heading
   ========================================================================== */
.bsx .bsx-tool{padding-block:0 clamp(18px,2.4vw,26px)}
.bsx h2.bsx-tool__h{
  margin:0 0 clamp(16px,2vw,22px);
  font-size:clamp(24px,2.8vw,34px);line-height:1.16;letter-spacing:-.022em;
}

/* Card titles are h3 and must stay that size whatever the outline repair
   decides. They were rendering at 54px because the page had no h2 above
   them and every card title got promoted. */
.bsx .bsx-pc h3,
.bsx .bsx-dl h3,
.bsx .bsx-person h3{
  font-size:17.5px;line-height:1.3;letter-spacing:-.018em;font-weight:700;
}
.bsx .bsx-pc h3 a{color:var(--navy);text-decoration:none}
.bsx .bsx-pc:hover h3 a{color:var(--blue)}
.bsx .bsx-dl h3{font-size:17px}

/* equal-height cards so a short excerpt does not leave a hole */
.bsx .bsx-pcs,.bsx .bsx-dls{align-items:stretch}
.bsx article.bsx-pc,.bsx article.bsx-dl{height:100%}
.bsx .bsx-pc p{margin-top:10px;font-size:14px;line-height:1.55;flex:1 1 auto}

/* ===========================================================================
   Why us: the cell needs a layout, not an icon dropped in front of the text
   ========================================================================== */
.bsx .bsx-vs__cell{
  display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;
  align-items:start;
}
.bsx .bsx-vs__cell svg{margin:2px 0 0;flex:0 0 auto}
.bsx td.bsx-vs__them svg,.bsx td.bsx-vs__us svg{margin-right:0}
.bsx .bsx-vstable td{padding:14px 20px}

/* ===========================================================================
   Keep reading, when it rides inside a dark closing CTA
   Navy links on a navy band rendered as arrows with no visible label.
   ========================================================================== */
.bsx .bsx-nextrow--incta{
  grid-column:1 / -1;margin-top:clamp(24px,3vw,34px);
  padding-top:clamp(20px,2.6vw,28px);
  border-top:1px solid rgba(235,245,255,.22);
}
[data-bsx-dark] .bsx-nextrow--incta .bsx-next__k,
.bsx-blue .bsx-nextrow--incta .bsx-next__k{color:rgba(255,255,255,.72)}
[data-bsx-dark] .bsx-nextrow--incta a.bsx-nextlink,
.bsx-blue .bsx-nextrow--incta a.bsx-nextlink{color:#fff}
[data-bsx-dark] .bsx-nextrow--incta a.bsx-nextlink svg,
.bsx-blue .bsx-nextrow--incta a.bsx-nextlink svg{color:rgba(255,255,255,.8)}
[data-bsx-dark] .bsx-nextrow--incta a.bsx-nextlink:hover,
.bsx-blue .bsx-nextrow--incta a.bsx-nextlink:hover{
  background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.24);color:#fff;
}

/* ===========================================================================
   People, including the slots that are still waiting on a photograph
   ========================================================================== */
.bsx .bsx-person.is-await .bsx-person__fig{
  background:repeating-linear-gradient(135deg,var(--mist) 0 8px,
             rgba(214,230,247,.55) 8px 16px);
}
.bsx .bsx-person.is-await h3{color:var(--slate);font-weight:600}
.bsx .bsx-person__li.is-await{
  display:inline-flex;align-items:center;gap:7px;margin-top:14px;
  font-family:var(--font-system);font-size:12.5px;font-weight:600;
  color:var(--ink-3,#7C8A88);
}
.bsx p.bsx-people__note{
  display:flex;align-items:center;justify-content:center;gap:9px;
  margin-top:clamp(20px,2.6vw,28px);
  font-family:var(--font-system);font-size:13px;color:var(--slate);
  text-align:center;
}
.bsx .bsx-people__note svg{color:var(--blue);flex:0 0 auto}

/* ===========================================================================
   About: the seven disciplines as big cards that swipe on a phone
   ========================================================================== */
.bsx .bsx-scards{
  margin-top:clamp(28px,3.6vw,44px);display:grid;
  grid-template-columns:repeat(auto-fill,minmax(300px,1fr));
  gap:clamp(16px,2.2vw,24px);
}
.bsx a.bsx-scard{
  display:flex;flex-direction:column;border-radius:18px;overflow:hidden;
  background:var(--white);border:1px solid var(--border);text-decoration:none;
  transition:border-color 240ms var(--bsx-ease),transform 240ms var(--bsx-ease),
             box-shadow 240ms var(--bsx-ease);
}
.bsx a.bsx-scard:hover{
  border-color:var(--blue);transform:translateY(-3px);
  box-shadow:0 24px 48px -30px rgba(12,22,61,.45);
}
.bsx .bsx-scard__fig{
  display:block;aspect-ratio:16/9;overflow:hidden;background:var(--mist);
  border-bottom:1px solid var(--bsx-rule);
}
.bsx .bsx-scard__fig img{
  width:100%;height:100%;object-fit:contain;display:block;
  transition:transform 420ms var(--bsx-ease);
}
.bsx a.bsx-scard:hover .bsx-scard__fig img{transform:scale(1.04)}
.bsx .bsx-scard__body{
  display:flex;flex-direction:column;flex:1 1 auto;padding:20px 22px 22px;
}
.bsx .bsx-scard__t{
  font-family:var(--font-display);font-size:19px;font-weight:700;
  letter-spacing:-.02em;color:var(--navy);
}
.bsx a.bsx-scard:hover .bsx-scard__t{color:var(--blue)}
.bsx .bsx-scard__d{
  margin-top:9px;font-family:var(--font-system);font-size:14.5px;
  line-height:1.58;color:var(--slate);flex:1 1 auto;
}
.bsx .bsx-scard__go{
  display:inline-flex;align-items:center;gap:8px;margin-top:16px;
  padding-top:14px;border-top:1px solid var(--bsx-rule);
  font-family:var(--font-system);font-size:13.5px;font-weight:700;
  color:var(--blue);
}
.bsx .bsx-scard__go svg{transition:transform 260ms var(--bsx-ease)}
.bsx a.bsx-scard:hover .bsx-scard__go svg{transform:translateX(3px)}

/* a card that names a worked example rather than a client result */
.bsx .bsx-pc__chip.is-note{
  color:var(--open,#8F5504);background:var(--warn-surface,#FFF6E3);
  border-color:var(--warn-border,#F3D89B);
}

/* ===========================================================================
   Contact: hero on the left, form on the right
   ========================================================================== */
.bsx .bsx-lhero__in--left{
  align-items:flex-start;text-align:left;
}
.bsx .bsx-lhero__in--left .bsx-crumbs ol{justify-content:flex-start}
.bsx .bsx-lhero__in--left h1{max-width:14ch}
.bsx .bsx-lhero__in--left p.bsx-lead{margin-inline:0}
.bsx .bsx-lhero__in--left .bsx-lhero__chips{justify-content:flex-start}
.bsx .bsx-lhero--incol,.bsx .bsx-lhero__in--left{padding-block:0}

@media (max-width:900px){
  .bsx .bsx-scards{
    display:flex;flex-wrap:nowrap;overflow-x:auto;overscroll-behavior-x:contain;
    scroll-snap-type:x mandatory;scroll-padding-inline:var(--bsx-gut);gap:14px;
    margin-inline:calc(var(--bsx-gut) * -1);padding-inline:var(--bsx-gut);
    padding-bottom:6px;-ms-overflow-style:none;scrollbar-width:none;
  }
  .bsx .bsx-scards::-webkit-scrollbar{display:none}
  .bsx .bsx-scards > *{flex:0 0 84%;scroll-snap-align:start;min-width:0}
  .bsx .bsx-scard__t{font-size:17.5px}
}
@media (max-width:560px){
  .bsx .bsx-scards > *{flex:0 0 88%}
}
/* ===========================================================================
   Type scale and band rhythm
   The vw coefficients were tuned on a large monitor. These land the same
   proportions on a 1366-wide laptop without capping out.
   ========================================================================== */
:root,.bsx{
  --bsx-pad:clamp(48px,5.4vw,92px);
}
.bsx .bsx-d1{font-size:clamp(36px,4.6vw,66px);line-height:1.02}
.bsx .bsx-d2{font-size:clamp(25px,2.7vw,40px);line-height:1.1}
.bsx-hero{padding-block:clamp(28px,3.4vw,54px) clamp(40px,4.6vw,72px)}
.bsx .bsx-lhero{padding-block:clamp(26px,3.2vw,48px) clamp(24px,3vw,40px)}

/* the breadcrumb now sits inside the hero */
.bsx .bsx-hero__crumbs{margin-bottom:clamp(10px,1.4vw,18px)}
.bsx .bsx-hero__crumbs .bsx-crumbs{padding-block:0}

.bsx .bsx-hero__lead{margin-top:14px}
.bsx .bsx-hero__cta{margin-top:clamp(20px,2.4vw,28px)}

/* ===========================================================================
   Short viewports: laptops, which is where the complaint came from
   ========================================================================== */
@media (min-width:1000px) and (max-height:900px){
  :root,.bsx{--bsx-pad:clamp(40px,4.2vw,64px)}
  .bsx .bsx-d1{font-size:clamp(34px,3.6vw,52px)}
  .bsx .bsx-d2{font-size:clamp(23px,2.2vw,32px)}
  .bsx-hero{padding-block:22px 36px}
  .bsx .bsx-lhero{padding-block:20px 28px}
  .bsx .bsx-hero__lead,.bsx .bsx-lhero p.bsx-lead{font-size:16px;margin-top:12px}
  .bsx .bsx-hero__cta{margin-top:20px}
  .bsx .bsx-lhero__cta{margin-top:20px}
  .bsx .bsx-lhero__chips{margin-top:16px}
}

/* ===========================================================================
   Blog article: the closing "keep reading" cards
   Three equal cards rather than a loose row, and the label reads as a section
   heading instead of a floating chip.
   ========================================================================== */
.bsx .bsx-rel{
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:clamp(14px,1.8vw,20px);
}
.bsx a.bsx-relcard{
  gap:8px;padding:18px 20px 20px;min-height:0;
}
.bsx .bsx-relcard__t{font-size:15.5px;line-height:1.36}
.bsx .bsx-relcard svg{margin-top:10px}

@media (max-width:900px){
  :root,.bsx{--bsx-pad:clamp(38px,7vw,56px)}
  .bsx .bsx-hero__crumbs{margin-bottom:10px}
}

/* ===========================================================================
   People, now with real photographs
   ========================================================================== */
.bsx .bsx-people{grid-template-columns:repeat(auto-fill,minmax(232px,1fr))}
.bsx article.bsx-person{
  text-align:left;align-items:stretch;padding:0;overflow:hidden;
}
.bsx .bsx-person__fig{
  width:100%;aspect-ratio:1;height:auto;border-radius:0;border:0;
  margin-bottom:0;background:var(--mist);
}
.bsx .bsx-person__fig img{
  width:100%;height:100%;object-fit:cover;display:block;
  filter:saturate(.92);
  transition:transform 480ms var(--bsx-ease),filter 360ms var(--bsx-ease);
}
.bsx article.bsx-person:hover .bsx-person__fig img{
  transform:scale(1.04);filter:saturate(1);
}
.bsx article.bsx-person > h3,
.bsx article.bsx-person > p{padding-inline:20px}
.bsx article.bsx-person > h3{margin-top:18px}
.bsx article.bsx-person > p:last-child{padding-bottom:20px}
.bsx p.bsx-person__b{margin-top:10px;font-size:13.5px;line-height:1.56}
.bsx p.bsx-person__focus{
  margin-top:12px;font-family:var(--font-system);font-size:11.5px;
  font-weight:700;letter-spacing:.05em;color:var(--blue);
}
[data-bsx-dark] .bsx-person__focus{color:var(--teal)}

/* ===========================================================================
   The animated call to action
   The icon leads, the arrow follows, and a sheen crosses once on hover. All
   of it is transform and opacity, so it stays cheap.
   ========================================================================== */
.bsx .bsx-teamcta{margin-top:clamp(24px,3vw,34px)}
.bsx a.bsx-btn--anim{
  position:relative;overflow:hidden;gap:10px;
  padding-inline:24px;
}
.bsx .bsx-btn__ic{
  display:inline-grid;place-items:center;
  transition:transform 420ms var(--bsx-ease);
}
.bsx a.bsx-btn--anim:hover .bsx-btn__ic{transform:translateX(-2px) rotate(-8deg)}
.bsx a.bsx-btn--anim svg:last-child{
  transition:transform 380ms var(--bsx-ease);
}
.bsx a.bsx-btn--anim:hover svg:last-child{transform:translateX(5px)}
.bsx a.bsx-btn--anim::after{
  content:"";position:absolute;inset:0 auto 0 -40%;width:35%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.34),transparent);
  transform:skewX(-18deg);opacity:0;pointer-events:none;
}
.bsx a.bsx-btn--anim:hover::after{
  animation:bsx-sheen 720ms var(--bsx-ease) forwards;
}
@keyframes bsx-sheen{
  from{left:-40%;opacity:0}
  25%{opacity:1}
  to{left:120%;opacity:0}
}

@media (max-width:900px){
  .bsx .bsx-people{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .bsx article.bsx-person > h3{margin-top:14px;font-size:15.5px}
  .bsx article.bsx-person > h3,
  .bsx article.bsx-person > p{padding-inline:14px}
  .bsx p.bsx-person__b{font-size:13px}
}
@media (prefers-reduced-motion:reduce){
  .bsx a.bsx-btn--anim:hover::after{animation:none}
  .bsx .bsx-person__fig img,.bsx .bsx-btn__ic{transition-duration:1ms}
}

/* ===========================================================================
   Contact hero
   ========================================================================== */
.bsx .bsx-chero{padding-block:clamp(30px,4vw,58px) clamp(28px,3.4vw,44px)}
.bsx .bsx-chero__in{
  display:flex;flex-direction:column;align-items:center;text-align:center;
}
.bsx .bsx-chero h1{margin-top:16px;max-width:18ch;text-wrap:balance}
.bsx .bsx-chero p.bsx-lead{margin-top:16px;max-width:62ch}
.bsx .bsx-chero__cta{
  display:flex;flex-wrap:wrap;justify-content:center;gap:12px;
  margin-top:clamp(22px,2.8vw,30px);
}
.bsx ul.bsx-chero__trust{
  list-style:none;margin:clamp(24px,3vw,34px) 0 0;padding:0;
  display:flex;flex-wrap:wrap;justify-content:center;gap:10px 28px;
}
.bsx .bsx-chero__trust li{
  display:flex;align-items:center;gap:9px;
  font-family:var(--font-system);font-size:14px;color:var(--slate);
}
.bsx .bsx-chero__trust svg{color:var(--blue);flex:0 0 auto}

/* ===========================================================================
   The form block
   ========================================================================== */
.bsx .bsx-formhead{text-align:center;max-width:60ch;margin:0 auto}
.bsx .bsx-formhead h2{margin-top:14px;text-wrap:balance}
.bsx .bsx-formhead p.bsx-lead{margin-top:12px}

/* the Elementor form, dressed to match the rest of the system */
.bsx-formwrap .elementor-field-group > label,
.elementor-widget-form .elementor-field-label{
  font-family:var(--font-system);font-size:12px;font-weight:700;
  letter-spacing:.06em;text-transform:uppercase;color:var(--slate);
  margin-bottom:7px;
}
.elementor-widget-form .elementor-field-textual{
  height:52px;padding-inline:16px;border-radius:12px;
  border:1px solid var(--border);background:var(--white);
  font-family:var(--font-system);font-size:15px;color:var(--navy);
  transition:border-color 200ms var(--bsx-ease),box-shadow 200ms var(--bsx-ease);
}
.elementor-widget-form textarea.elementor-field-textual{height:auto;padding-block:14px}
.elementor-widget-form .elementor-field-textual:focus{
  outline:none;border-color:var(--blue);
  box-shadow:0 0 0 4px rgba(49,92,253,.14);
}
.elementor-widget-form .elementor-field-type-acceptance{
  font-family:var(--font-system);font-size:13.5px;line-height:1.5;
  color:var(--slate);
}
.elementor-widget-form .elementor-field-type-acceptance a{
  color:var(--blue);text-decoration:underline;text-underline-offset:2px;
  font-weight:600;
}
.elementor-widget-form .elementor-button{
  height:54px;border-radius:999px;background:var(--blue);color:#fff;
  font-family:var(--font-system);font-size:15.5px;font-weight:700;
  letter-spacing:-.005em;border:0;
  transition:background 200ms var(--bsx-ease),transform 140ms var(--bsx-ease);
}
.elementor-widget-form .elementor-button:hover{background:var(--blue-hover,#2549D8)}
.elementor-widget-form .elementor-button:active{transform:scale(.99)}

/* ===========================================================================
   Audit cards: deliverables, scope, timeline
   ========================================================================== */
.bsx .bsx-acards{
  margin-top:clamp(26px,3.2vw,40px);display:grid;
  grid-template-columns:repeat(auto-fill,minmax(268px,1fr));
  gap:clamp(14px,1.8vw,20px);
}
.bsx article.bsx-acard{
  display:flex;flex-direction:column;padding:24px 22px;border-radius:18px;
  background:var(--white);border:1px solid var(--border);
  transition:border-color 240ms var(--bsx-ease),transform 240ms var(--bsx-ease);
}
.bsx article.bsx-acard:hover{border-color:var(--blue);transform:translateY(-3px)}
[data-bsx-dark] .bsx-acard{background:rgba(235,245,255,.06);border-color:var(--bsx-rule-dark)}
.bsx .bsx-acard__top{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.bsx .bsx-acard__ic{
  display:grid;place-items:center;width:40px;height:40px;flex:0 0 auto;
  border-radius:12px;background:var(--mist);border:1px solid var(--mist-border);
  color:var(--blue);
}
.bsx .bsx-acard__n{
  margin-left:auto;font-family:var(--font-system);font-size:11.5px;
  font-weight:700;letter-spacing:.06em;color:var(--slate);white-space:nowrap;
}
.bsx .bsx-acard h3{font-size:17px;line-height:1.3;letter-spacing:-.018em}
.bsx .bsx-acard p{margin-top:9px;font-size:14px;line-height:1.56;flex:1 1 auto}
.bsx p.bsx-acards__note{
  display:flex;align-items:flex-start;gap:9px;
  margin-top:clamp(18px,2.2vw,26px);max-width:70ch;
  font-family:var(--font-system);font-size:13.5px;line-height:1.55;
  color:var(--slate);
}
.bsx .bsx-acards__note svg{color:var(--blue);flex:0 0 auto;margin-top:2px}

/* ===========================================================================
   Who runs it
   ========================================================================== */
.bsx .bsx-auditor{
  display:grid;grid-template-columns:minmax(0,240px) minmax(0,1fr);
  gap:clamp(24px,3.6vw,48px);align-items:center;
}
.bsx .bsx-auditor__fig{
  border-radius:20px;overflow:hidden;background:var(--navy-soft);
  border:1px solid var(--bsx-rule-dark);
}
.bsx .bsx-auditor__fig img{width:100%;height:auto;display:block}
.bsx .bsx-auditor h2{margin-top:12px}
.bsx p.bsx-auditor__role{
  margin-top:6px;font-family:var(--font-system);font-size:14px;font-weight:700;
  color:var(--teal);
}
.bsx .bsx-auditor p.bsx-lead{margin-top:14px;max-width:60ch}
.bsx ul.bsx-auditor__facts{
  list-style:none;margin:clamp(18px,2.2vw,24px) 0 0;padding:0;
  display:flex;flex-wrap:wrap;gap:10px 26px;
}
.bsx .bsx-auditor__facts li{
  display:flex;align-items:center;gap:9px;
  font-family:var(--font-system);font-size:14px;color:var(--bsx-ink-dark);
}
.bsx .bsx-auditor__facts svg{color:var(--teal);flex:0 0 auto}

@media (max-width:820px){
  .bsx .bsx-auditor{grid-template-columns:1fr;gap:20px}
  .bsx .bsx-auditor__fig{max-width:200px}
  .bsx .bsx-chero__cta .bsx-btn{width:100%;justify-content:center}
  .bsx ul.bsx-chero__trust{gap:8px 0;flex-direction:column;align-items:flex-start;
    text-align:left}
}

/* case studies (layer 21) */
/* ===========================================================================
   Case study hero
   ========================================================================== */
.bsx .bsx-cshero{padding-block:clamp(26px,3.4vw,44px) clamp(30px,3.6vw,48px)}
.bsx .bsx-cshero .bsx-notice{max-width:78ch}
.bsx .bsx-cs__top{
  display:flex;flex-wrap:wrap;align-items:center;gap:8px;
  margin-top:clamp(20px,2.6vw,30px);
}
.bsx .bsx-cs__client{
  display:inline-flex;align-items:center;gap:7px;padding:6px 13px;
  border-radius:999px;background:var(--navy);color:var(--white);
  font-family:var(--font-system);font-size:12.5px;font-weight:700;
  letter-spacing:.01em;
}
.bsx .bsx-cs__client svg{color:var(--teal);flex:0 0 auto}
.bsx .bsx-cs__cat{
  display:inline-flex;align-items:center;padding:6px 12px;border-radius:999px;
  background:var(--mist);border:1px solid var(--mist-border);color:var(--blue);
  font-family:var(--font-system);font-size:12px;font-weight:700;
  text-transform:uppercase;letter-spacing:.06em;
}
.bsx .bsx-cshero h1{margin-top:14px;max-width:22ch;text-wrap:balance}
.bsx .bsx-cshero p.bsx-lead{margin-top:14px;max-width:64ch}
.bsx p.bsx-cs__meta{
  margin-top:12px;font-family:var(--font-system);font-size:13.5px;
  color:var(--slate);
}

.bsx .bsx-cs__results{
  margin-top:clamp(24px,3vw,34px);display:grid;gap:12px;
  grid-template-columns:repeat(auto-fit,minmax(170px,1fr));
}
.bsx .bsx-cs__rt{
  display:flex;flex-direction:column;gap:4px;padding:16px 18px;
  border-radius:14px;background:var(--white);border:1px solid var(--border);
}
.bsx .bsx-cs__rtv{
  font-family:var(--font-display);font-size:clamp(24px,2.6vw,30px);
  font-weight:700;color:var(--blue);line-height:1.05;
  font-variant-numeric:tabular-nums;
}
.bsx .bsx-cs__rtl{
  font-family:var(--font-system);font-size:11.5px;font-weight:700;
  text-transform:uppercase;letter-spacing:.07em;color:var(--slate);
}

/* ===========================================================================
   Results strip
   ========================================================================== */
.bsx .bsx-cs__stats{
  display:grid;gap:clamp(14px,1.8vw,22px);
  grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
}
.bsx .bsx-cs__stat{
  display:flex;flex-direction:column;gap:6px;padding:20px 22px;
  border-radius:16px;background:rgba(235,245,255,.06);
  border:1px solid var(--bsx-rule-dark);
}
.bsx .bsx-cs__statv{
  font-family:var(--font-display);font-size:clamp(28px,3.2vw,38px);
  font-weight:700;color:var(--teal);line-height:1;
  font-variant-numeric:tabular-nums;
}
.bsx .bsx-cs__statl{
  font-family:var(--font-system);font-size:11.5px;font-weight:700;
  text-transform:uppercase;letter-spacing:.07em;color:var(--bsx-ink-dark);
}
.bsx p.bsx-cs__foot{
  display:flex;gap:9px;align-items:flex-start;
  margin-top:clamp(18px,2.2vw,26px);max-width:76ch;
  font-family:var(--font-system);font-size:13px;line-height:1.6;
  color:var(--bsx-ink-dark);
}
.bsx .bsx-cs__foot svg{color:var(--teal);flex:0 0 auto;margin-top:2px}

/* ===========================================================================
   Attribution
   ========================================================================== */
.bsx p.bsx-cs__attrib{
  margin-top:10px;font-family:var(--font-system);font-size:14px;
  font-weight:700;color:var(--navy);
}
[data-bsx-dark] p.bsx-cs__attrib{color:var(--teal)}

/* ===========================================================================
   The engagement in brief
   ========================================================================== */
.bsx .bsx-cs__facts{
  margin-top:clamp(24px,3vw,34px);display:grid;gap:clamp(16px,2vw,26px);
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
}
.bsx .bsx-cs__facts>div{
  padding:22px 24px;border-radius:18px;background:var(--white);
  border:1px solid var(--border);
}
.bsx .bsx-cs__facts ul{list-style:none;margin:14px 0 0;padding:0;
  display:flex;flex-direction:column;gap:10px}
.bsx .bsx-cs__facts li{
  display:flex;gap:10px;align-items:flex-start;
  font-family:var(--font-system);font-size:14.5px;line-height:1.55;
  color:var(--slate);
}
.bsx .bsx-cs__facts li svg{flex:0 0 auto;margin-top:3px;color:var(--teal)}
.bsx .bsx-cs__svc li svg{color:var(--blue)}
.bsx .bsx-cs__svc a{
  color:var(--navy);font-weight:650;text-decoration:none;
  border-bottom:1px solid var(--mist-border);transition:color 200ms var(--bsx-ease),
  border-color 200ms var(--bsx-ease);
}
.bsx .bsx-cs__svc a:hover{color:var(--blue);border-bottom-color:var(--blue)}

/* ===========================================================================
   Related studies
   ========================================================================== */
.bsx .bsx-crels{
  margin-top:clamp(26px,3.2vw,38px);display:grid;gap:clamp(16px,2vw,24px);
  grid-template-columns:repeat(auto-fit,minmax(270px,1fr));
}
.bsx article.bsx-crel{
  display:flex;flex-direction:column;gap:10px;padding:22px 24px;
  border-radius:18px;background:var(--white);border:1px solid var(--border);
  transition:border-color 240ms var(--bsx-ease),transform 240ms var(--bsx-ease);
}
.bsx article.bsx-crel:hover{border-color:var(--blue);transform:translateY(-3px)}
.bsx .bsx-crel__res{
  font-family:var(--font-display);font-size:19px;font-weight:700;
  color:var(--blue);line-height:1.15;font-variant-numeric:tabular-nums;
}
.bsx .bsx-crel h3{
  font-family:var(--font-display);font-size:16.5px;font-weight:650;
  line-height:1.4;margin:0;
}
.bsx .bsx-crel h3 a{color:var(--navy);text-decoration:none}
.bsx .bsx-crel h3 a:hover{color:var(--blue)}
.bsx .bsx-crel p{
  margin:0;font-family:var(--font-system);font-size:11.5px;font-weight:700;
  text-transform:uppercase;letter-spacing:.07em;color:var(--slate);
}
.bsx p.bsx-crels__all{margin-top:clamp(20px,2.4vw,28px)}
.bsx a.bsx-tlink{
  display:inline-flex;align-items:center;gap:7px;
  font-family:var(--font-system);font-size:14.5px;font-weight:700;
  color:var(--blue);text-decoration:none;
}
.bsx a.bsx-tlink svg{transition:transform 200ms var(--bsx-ease)}
.bsx a.bsx-tlink:hover svg{transform:translateX(4px)}

/* the headline number, over the abstract, on the listing card */
.bsx .bsx-pcs .bsx-pc__fig{position:relative}
.bsx b.bsx-pc__res{
  position:absolute;left:12px;bottom:12px;padding:5px 11px;border-radius:999px;
  background:var(--navy);color:var(--teal);
  font-family:var(--font-display);font-size:13.5px;font-weight:700;
  letter-spacing:.01em;font-variant-numeric:tabular-nums;
}

@media (max-width:820px){
  .bsx .bsx-cs__results{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bsx .bsx-cs__stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bsx .bsx-cshero h1{max-width:none}
}
@media (max-width:480px){
  .bsx .bsx-cs__results,.bsx .bsx-cs__stats{grid-template-columns:1fr}
}

/* services hub (layer 22) */
/* ===========================================================================
   Services hub — the parent of every service URL, which had no page at all
   ========================================================================== */
.bsx .bsx-shero{padding-block:clamp(26px,3.4vw,44px) clamp(30px,3.6vw,48px)}
.bsx .bsx-shero h1{margin-top:12px;max-width:20ch;text-wrap:balance}
.bsx .bsx-shero p.bsx-lead{margin-top:14px;max-width:66ch}
.bsx .bsx-shero__cta{
  display:flex;flex-wrap:wrap;gap:12px;margin-top:clamp(22px,2.8vw,30px);
}

.bsx .bsx-scats{
  margin-top:clamp(28px,3.4vw,42px);display:grid;gap:clamp(18px,2.2vw,26px);
  grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
}
.bsx article.bsx-scat{
  display:flex;flex-direction:column;padding:26px 28px 24px;border-radius:20px;
  background:var(--white);border:1px solid var(--border);
  transition:border-color 240ms var(--bsx-ease),transform 240ms var(--bsx-ease);
}
.bsx article.bsx-scat:hover{border-color:var(--blue);transform:translateY(-3px)}
.bsx .bsx-scat__head{display:flex;gap:14px;align-items:flex-start}
.bsx .bsx-scat__ic{
  display:inline-flex;align-items:center;justify-content:center;
  width:44px;height:44px;flex:0 0 auto;border-radius:13px;
  background:var(--mist);border:1px solid var(--mist-border);color:var(--blue);
}
.bsx .bsx-scat h3{
  font-family:var(--font-display);font-size:21px;font-weight:700;
  line-height:1.25;margin:0;
}
.bsx .bsx-scat h3 a{color:var(--navy);text-decoration:none}
.bsx .bsx-scat h3 a:hover{color:var(--blue)}
.bsx p.bsx-scat__n{
  margin:3px 0 0;font-family:var(--font-system);font-size:11.5px;font-weight:700;
  text-transform:uppercase;letter-spacing:.07em;color:var(--slate);
}
.bsx .bsx-scat>p{
  margin:16px 0 0;font-family:var(--font-system);font-size:14.5px;
  line-height:1.6;color:var(--slate);
}
.bsx ul.bsx-scat__list{
  list-style:none;margin:18px 0 0;padding:18px 0 0;
  border-top:1px solid var(--bsx-rule);
  display:flex;flex-direction:column;gap:9px;flex:1 1 auto;
}
.bsx .bsx-scat__list a{
  display:flex;gap:9px;align-items:center;text-decoration:none;
  font-family:var(--font-system);font-size:14.5px;font-weight:600;
  color:var(--navy);transition:color 180ms var(--bsx-ease);
}
.bsx .bsx-scat__list a svg{color:var(--teal);flex:0 0 auto;
  transition:transform 180ms var(--bsx-ease)}
.bsx .bsx-scat__list a:hover{color:var(--blue)}
.bsx .bsx-scat__list a:hover svg{transform:translateX(3px);color:var(--blue)}
.bsx .bsx-scat>a.bsx-tlink{margin-top:20px}

@media (max-width:820px){
  .bsx .bsx-scats{grid-template-columns:1fr}
  .bsx .bsx-shero h1{max-width:none}
  .bsx .bsx-shero__cta .bsx-btn{width:100%;justify-content:center}
}