.bpp-doc{
  --bpp-text:#111827;
  --bpp-muted:#5b6674;
  --bpp-border:#e5e7eb;
  --bpp-accent:#1d4ed8;
  --bpp-heading:#0f2a5a;
  --bpp-bg:#ffffff;
  --bpp-soft:#f7f9fc;
  --bpp-nav-offset:110px; /* fixed header height — adjust to your theme */

  color:var(--bpp-text);
  background:var(--bpp-bg);
  line-height:1.7;
  font-size:16px;
  -webkit-text-size-adjust:100%;
  scroll-behavior:smooth;
}
.bpp-doc *,.bpp-doc *::before,.bpp-doc *::after{box-sizing:border-box;}
.bpp-doc__inner{
  max-width:880px;
  margin:0 auto;
  padding:clamp(24px,5vw,56px) clamp(16px,5vw,40px) clamp(40px,6vw,72px);
}

/* Header */
.bpp-doc__header{border-bottom:1px solid var(--bpp-border);padding-bottom:20px;margin-bottom:28px;}
.bpp-doc__brand{
  font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:var(--bpp-accent);margin:0 0 8px;
}
.bpp-doc__title{
  font-size:clamp(24px,4vw,32px);line-height:1.25;margin:0 0 6px;
  color:var(--bpp-heading);font-weight:700;
}
.bpp-doc__meta{color:var(--bpp-muted);font-size:14px;margin:0;}

/* Callout */
.bpp-doc__callout{
  background:#eff6ff;border-left:4px solid var(--bpp-accent);border-radius:6px;
  padding:16px 20px;font-size:15px;margin:0 0 32px;
}
.bpp-doc__callout p{margin:0;}

/* Table of contents */
.bpp-doc__toc{
  background:var(--bpp-soft);border:1px solid var(--bpp-border);border-radius:10px;
  padding:22px clamp(18px,3vw,26px);margin:0 0 40px;
}
.bpp-doc__toc h2{
  font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--bpp-muted);
  margin:0 0 16px;font-weight:700;border:0;padding:0;
}
.bpp-doc__toc ol{
  counter-reset:bpp-toc;list-style:none;margin:0;padding:0;font-size:15px;
  columns:3;column-gap:36px;
}
.bpp-doc__toc li{
  display:flex;gap:8px;margin:0 0 14px;
  break-inside:avoid;-webkit-column-break-inside:avoid;page-break-inside:avoid;
}
.bpp-doc__toc li:last-child{margin-bottom:0;}
.bpp-doc__toc li::before{
  counter-increment:bpp-toc;content:counter(bpp-toc) ".";
  color:var(--bpp-muted);flex:0 0 auto;min-width:1.5em;
  font-variant-numeric:tabular-nums;
}
.bpp-doc__toc a{color:var(--bpp-text);text-decoration:none;line-height:1.45;}
.bpp-doc__toc a:hover,.bpp-doc__toc a:focus{color:var(--bpp-accent);text-decoration:underline;}

/* Sections */
.bpp-doc__body{counter-reset:bpp-sec;}
.bpp-doc__body section{margin:0 0 34px;scroll-margin-top:var(--bpp-nav-offset);}
.bpp-doc__body section:last-child{margin-bottom:0;}
.bpp-doc__body h2{
  font-size:clamp(17px,2.4vw,20px);color:var(--bpp-heading);font-weight:700;
  border-bottom:1px solid var(--bpp-border);padding-bottom:8px;margin:0 0 14px;
}
.bpp-doc__body h2::before{
  counter-increment:bpp-sec;content:counter(bpp-sec) ". ";
}
.bpp-doc__body p{margin:0 0 14px;overflow-wrap:anywhere;}
.bpp-doc__body p:last-child{margin-bottom:0;}
.bpp-doc a{color:var(--bpp-accent);}

/* Footer */
.bpp-doc__footer{
  margin-top:44px;padding-top:22px;border-top:1px solid var(--bpp-border);
  font-size:13.5px;color:var(--bpp-muted);
}
.bpp-doc__footer p{margin:0 0 10px;}
.bpp-doc__top{display:inline-block;font-size:13px;color:var(--bpp-muted);text-decoration:none;}
.bpp-doc__top:hover{color:var(--bpp-accent);}

/* Responsive */
@media (max-width:820px){ .bpp-doc__toc ol{columns:2;column-gap:28px;} }
@media (max-width:520px){
  .bpp-doc{font-size:15.5px;}
  .bpp-doc__toc ol{columns:1;}
  .bpp-doc__callout{padding:14px 16px;font-size:14.5px;}
}

/* Print */
@media print{
  .bpp-doc__toc,.bpp-doc__top{display:none;}
  .bpp-doc__inner{max-width:none;padding:0;}
  .bpp-doc__body section{break-inside:avoid;}
}