/* ═══════════════════════════════════════════════════════════════════════
   TaxClue — BLOG DESIGN BLOCKS (pro library)
   Added 2026-09-08.

   ONE file, TWO consumers — this is deliberate and is what makes the
   editor WYSIWYG:
     1. templates/pages/blog/single.php  → the published article
     2. admin/modules/blog/edit.php      → TinyMCE `content_css`
   The public site is hardcoded light (main.php: html[data-theme="light"])
   and the TinyMCE writing surface is white, so a single light palette
   serves both. Do NOT add a dark variant here; if the site ever gets a
   dark mode, add it in blog-article-styles.css where the rest of the
   theme switching already lives.

   Rules are intentionally NOT scoped under .bp-content: inside the
   TinyMCE iframe the content has no wrapper. Every class is bp-* / tc-*
   prefixed, so global is safe.

   NO box-shadow anywhere — assets/css/no-shadow.css kills shadows
   site-wide with a (3,0,0) specificity chain. A shadow written here
   would simply never render; depth is done with borders and tint fills.

   Block HTML lives in admin/modules/blog/editor/editor-blocks.js
   (TEMPLATES). Class names here and there must stay in sync.
   ═══════════════════════════════════════════════════════════════════════ */

:root {
  --bpd-ink:      #0A132B;
  --bpd-ink-2:    rgba(10,19,43,.74);
  --bpd-ink-3:    rgba(10,19,43,.52);
  --bpd-ink-4:    rgba(10,19,43,.38);
  --bpd-line:     rgba(10,19,43,.10);
  --bpd-line-2:   rgba(10,19,43,.06);
  --bpd-paper:    #FFFFFF;
  --bpd-surface:  #F7F9FC;
  --bpd-cream:    #F8F5EE;

  /* Brand accent. NOTE: the site token is still spelled --gold but its
     VALUE is crimson (see blog-article-styles.css line 5:
     "--gold #E31937 · --gold-bright #F5405E"). Track the token so a
     future rebrand moves this file too, and keep the literal fallback
     for the TinyMCE iframe, which never loads quantum.css.
     --bpd-accent-ink is the darkened variant for accent-coloured TEXT
     on white; the bright brand red fails contrast at small sizes. */
  --bpd-accent:     var(--gold, #E31937);
  --bpd-accent-2:   var(--gold-bright, #F5405E);
  --bpd-accent-ink: #C11430;
  --bpd-accent-bg:  rgba(227,25,55,.06);
  --bpd-accent-ln:  rgba(227,25,55,.20);
  --bpd-on-accent:  #FFFFFF;

  --bpd-green:    #16A34A;
  --bpd-green-bg: rgba(22,163,74,.07);
  --bpd-red:      #DC2626;
  --bpd-red-bg:   rgba(220,38,38,.06);
  --bpd-blue:     #2563EB;
  --bpd-blue-bg:  rgba(37,99,235,.06);
  --bpd-amber:    #D97706;
  --bpd-amber-bg: rgba(217,119,6,.07);
  --bpd-purple:   #7C3AED;
  --bpd-purple-bg:rgba(124,58,237,.06);
  --bpd-teal:     #0D9488;
  --bpd-teal-bg:  rgba(13,148,136,.06);

  --bpd-r:        12px;
  --bpd-r-sm:     8px;
  --bpd-r-lg:     16px;
  --bpd-serif:    'Fraunces', 'Instrument Serif', Georgia, serif;
  --bpd-mono:     'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace;
}

/* Shared eyebrow used by most block headers */
.bp-eyebrow,
.bp-tldr-h, .bp-takeaways-h, .bp-example-h, .bp-formula-h,
.bp-ratetable-h, .bp-cal-h, .bp-pengrid-h, .bp-updatelog-h,
.bp-sources-h, .bp-svclinks-h, .bp-authornote-h, .bp-doccard-ico {
  font-family: var(--bpd-mono);
  font-size: 10.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1.4px;
}

/* ═══════════════════════════════════════════════════════════
   1. CALLOUTS — new bp-note variants
   The .bp-note base (padding, radius, 4px left border) already
   lives in blog-article-styles.css + tinymce-content.css; only
   the new colourways are declared here.
   ═══════════════════════════════════════════════════════════ */
/* Literal hexes, not the --bpd-* tints, on purpose: blog-light.css
   already fixes the four ORIGINAL note variants to a contrast-checked
   set (#EFF7F1/#0F6B3E for green, #FDF1F3/#C01530 for red — it records
   the ratios in its own comments). The four new variants reuse those
   exact values so a "Success" note and a "Tip" note are not two
   different greens sitting in the same article. */
.bp-note-success,
.bp-note-danger,
.bp-note-neutral,
.bp-note-legal { color: #2B3444; }

.bp-note-success { background: #EFF7F1; border-color: #0F6B3E; }
.bp-note-success .bp-note-title { color: #0F6B3E; }
.bp-note-danger  { background: #FDF1F3; border-color: #C01530; }
.bp-note-danger .bp-note-title  { color: #C01530; }
.bp-note-neutral { background: #F4F5F7; border-color: #64748B; }
.bp-note-neutral .bp-note-title { color: #475569; }
.bp-note-legal   { background: #F5F1FD; border-color: #6D28D9; }
.bp-note-legal .bp-note-title   { color: #6D28D9; }

/* ── Alert bar — one-line banner ── */
.bp-alert {
  display: flex; align-items: center; gap: 12px;
  padding: 12px 16px; margin: 20px 0;
  border: 1px solid var(--bpd-line);
  border-left: 4px solid var(--bpd-accent);
  border-radius: var(--bpd-r-sm);
  background: var(--bpd-accent-bg);
  font-size: 14.5px; line-height: 1.6; color: var(--bpd-ink-2);
}
.bp-alert-ico { font-size: 18px; line-height: 1; flex-shrink: 0; }
.bp-alert-txt { flex: 1; min-width: 0; }
.bp-alert-txt strong { color: var(--bpd-ink); font-weight: 700; }
.bp-alert-red   { background: var(--bpd-red-bg);   border-left-color: var(--bpd-red); }
.bp-alert-green { background: var(--bpd-green-bg); border-left-color: var(--bpd-green); }
.bp-alert-blue  { background: var(--bpd-blue-bg);  border-left-color: var(--bpd-blue); }

/* ── Deadline card ── */
.bp-deadline {
  display: flex; align-items: center; gap: 16px;
  padding: 14px 18px; margin: 22px 0;
  background: var(--bpd-paper);
  border: 1px solid var(--bpd-line);
  border-radius: var(--bpd-r);
}
.bp-deadline-date {
  width: 58px; flex-shrink: 0; text-align: center;
  border-radius: var(--bpd-r-sm);
  background: linear-gradient(160deg, var(--bpd-accent), var(--bpd-accent-2));
  color: var(--bpd-on-accent); padding: 8px 0;
}
.bp-deadline-date .d { display: block; font-size: 22px; font-weight: 800; line-height: 1; }
.bp-deadline-date .m {
  display: block; font-family: var(--bpd-mono);
  font-size: 10px; font-weight: 700; letter-spacing: 1.2px; margin-top: 3px;
}
.bp-deadline-body { flex: 1; min-width: 0; }
.bp-deadline-body strong { display: block; font-size: 15px; color: var(--bpd-ink); margin-bottom: 2px; }
.bp-deadline-body span { font-size: 13.5px; color: var(--bpd-ink-3); line-height: 1.55; }
.bp-deadline-tag {
  flex-shrink: 0; align-self: flex-start;
  font-family: var(--bpd-mono); font-size: 10px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 1px;
  padding: 4px 9px; border-radius: 20px;
  background: var(--bpd-accent-bg); color: var(--bpd-accent-ink);
  border: 1px solid var(--bpd-accent-ln);
}

/* ═══════════════════════════════════════════════════════════
   2. KEY CONTENT
   ═══════════════════════════════════════════════════════════ */

/* ── TL;DR ── */
.bp-tldr {
  margin: 24px 0; padding: 18px 22px;
  background: var(--bpd-cream);
  border: 1px solid var(--bpd-accent-ln);
  border-radius: var(--bpd-r);
}
.bp-tldr-h { color: var(--bpd-accent-ink); margin-bottom: 10px; }
.bp-tldr ul { margin: 0; padding-left: 20px; }
.bp-tldr li { font-size: 15px; line-height: 1.7; color: var(--bpd-ink-2); margin-bottom: 6px; }
.bp-tldr li::marker { color: var(--bpd-accent); }

/* ── Key takeaways ── */
.bp-takeaways {
  margin: 26px 0; padding: 20px 24px;
  background: var(--bpd-paper);
  border: 1px solid var(--bpd-line);
  border-top: 3px solid var(--bpd-accent);
  border-radius: var(--bpd-r);
}
.bp-takeaways-h { color: var(--bpd-ink); margin-bottom: 12px; letter-spacing: 1.6px; }
.bp-takeaways ul { margin: 0; padding: 0; list-style: none; }
.bp-takeaways li {
  position: relative; padding-left: 28px; margin-bottom: 10px;
  font-size: 15px; line-height: 1.7; color: var(--bpd-ink-2);
}
.bp-takeaways li:last-child { margin-bottom: 0; }
.bp-takeaways li::before {
  content: '✓'; position: absolute; left: 0; top: 1px;
  width: 18px; height: 18px; border-radius: 50%;
  background: var(--bpd-green-bg); color: var(--bpd-green);
  font-size: 11px; font-weight: 800;
  display: flex; align-items: center; justify-content: center;
}

/* ── Quick answer (featured-snippet bait) ── */
.bp-quickans {
  margin: 24px 0; padding: 20px 24px;
  background: var(--bpd-blue-bg);
  border: 1px solid rgba(37,99,235,.18);
  border-radius: var(--bpd-r);
}
.bp-quickans-q {
  font-family: var(--bpd-serif); font-size: 19px; font-weight: 700;
  color: var(--bpd-ink); line-height: 1.35; margin-bottom: 8px;
}
.bp-quickans-a { font-size: 15.5px; line-height: 1.75; color: var(--bpd-ink-2); }
.bp-quickans-a strong { color: var(--bpd-ink); }

/* ── Definition ── */
.bp-definition {
  margin: 22px 0; padding: 16px 20px;
  border-left: 4px solid var(--bpd-purple);
  background: var(--bpd-purple-bg);
  border-radius: 0 var(--bpd-r-sm) var(--bpd-r-sm) 0;
}
.bp-definition-term {
  font-size: 16px; font-weight: 700; color: var(--bpd-ink); margin-bottom: 5px;
}
.bp-definition-pos {
  font-family: var(--bpd-mono); font-size: 10.5px; font-weight: 600;
  font-style: italic; color: var(--bpd-purple); margin-left: 7px;
  text-transform: lowercase; letter-spacing: .4px;
}
.bp-definition-body { font-size: 14.5px; line-height: 1.7; color: var(--bpd-ink-2); }

/* ── Glossary ── */
.bp-glossary {
  margin: 24px 0; padding: 4px 0 0;
  border-top: 1px solid var(--bpd-line);
}
.bp-glossary dt {
  font-weight: 700; font-size: 14.5px; color: var(--bpd-ink);
  padding-top: 12px;
}
.bp-glossary dd {
  margin: 3px 0 12px; padding-bottom: 12px;
  font-size: 14px; line-height: 1.7; color: var(--bpd-ink-2);
  border-bottom: 1px solid var(--bpd-line-2);
}
.bp-glossary dd:last-child { border-bottom: none; }

/* ── Worked example ── */
.bp-example {
  margin: 26px 0; border: 1px solid var(--bpd-line);
  border-radius: var(--bpd-r); overflow: hidden; background: var(--bpd-paper);
}
.bp-example-h {
  padding: 10px 18px; color: var(--bpd-ink);
  background: var(--bpd-surface); border-bottom: 1px solid var(--bpd-line);
}
.bp-example-body { padding: 16px 18px; font-size: 14.5px; line-height: 1.75; color: var(--bpd-ink-2); }
.bp-example-body p:last-child { margin-bottom: 0; }
.bp-example-result {
  display: flex; align-items: baseline; justify-content: space-between; gap: 12px;
  padding: 12px 18px; border-top: 1px dashed var(--bpd-line);
  background: var(--bpd-accent-bg);
}
.bp-example-result span {
  font-family: var(--bpd-mono); font-size: 10.5px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 1.3px; color: var(--bpd-accent-ink);
}
.bp-example-result strong { font-size: 20px; font-weight: 800; color: var(--bpd-ink); }

/* ── Formula ── */
.bp-formula {
  margin: 24px 0; padding: 16px 20px;
  background: var(--bpd-surface);
  border: 1px solid var(--bpd-line);
  border-radius: var(--bpd-r);
}
.bp-formula-h { color: var(--bpd-ink-3); margin-bottom: 10px; }
.bp-formula-eq {
  font-family: var(--bpd-mono); font-size: 15px; font-weight: 600;
  color: var(--bpd-ink); line-height: 1.7; word-break: break-word;
  padding: 12px 14px; background: var(--bpd-paper);
  border: 1px solid var(--bpd-line); border-radius: var(--bpd-r-sm);
}
.bp-formula-note { margin-top: 10px; font-size: 13px; line-height: 1.65; color: var(--bpd-ink-3); }

/* ── Case law ── */
.bp-caselaw {
  margin: 26px 0; padding: 16px 20px;
  background: var(--bpd-paper);
  border: 1px solid var(--bpd-line);
  border-left: 4px solid var(--bpd-ink);
  border-radius: 0 var(--bpd-r) var(--bpd-r) 0;
}
.bp-caselaw-h {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  margin-bottom: 12px; padding-bottom: 10px;
  border-bottom: 1px solid var(--bpd-line-2);
}
.bp-caselaw-tag {
  font-family: var(--bpd-mono); font-size: 9.5px; font-weight: 800;
  text-transform: uppercase; letter-spacing: 1.3px;
  padding: 3px 8px; border-radius: 4px;
  background: var(--bpd-ink); color: #fff;
}
.bp-caselaw-cite { font-size: 13.5px; font-style: italic; color: var(--bpd-ink-2); }
.bp-caselaw-row { display: flex; gap: 14px; margin-bottom: 8px; font-size: 14.5px; line-height: 1.7; }
.bp-caselaw-row:last-child { margin-bottom: 0; }
.bp-caselaw-row .k {
  flex: 0 0 78px; font-family: var(--bpd-mono); font-size: 10.5px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 1.1px; color: var(--bpd-ink-4);
  padding-top: 4px;
}
.bp-caselaw-row .v { flex: 1; min-width: 0; color: var(--bpd-ink-2); }

/* ── Do / Don't ── */
.bp-dodont {
  display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin: 26px 0;
}
.bp-dodont-col {
  padding: 16px 18px; border-radius: var(--bpd-r); border: 1px solid var(--bpd-line);
}
.bp-dodont-do   { background: var(--bpd-green-bg); border-color: rgba(22,163,74,.20); }
.bp-dodont-dont { background: var(--bpd-red-bg);   border-color: rgba(220,38,38,.18); }
.bp-dodont-h {
  font-size: 13px; font-weight: 800; text-transform: uppercase;
  letter-spacing: 1px; margin-bottom: 10px;
}
.bp-dodont-do .bp-dodont-h   { color: var(--bpd-green); }
.bp-dodont-dont .bp-dodont-h { color: var(--bpd-red); }
.bp-dodont ul { margin: 0; padding-left: 18px; }
.bp-dodont li { font-size: 14px; line-height: 1.65; color: var(--bpd-ink-2); margin-bottom: 7px; }
.bp-dodont li:last-child { margin-bottom: 0; }

/* ── Checklist ── */
ul.bp-checklist { list-style: none; margin: 20px 0; padding: 0; }
ul.bp-checklist li {
  position: relative; padding-left: 30px; margin-bottom: 9px;
  font-size: 15px; line-height: 1.7; color: var(--bpd-ink-2);
}
ul.bp-checklist li::before {
  content: ''; position: absolute; left: 0; top: 4px;
  width: 17px; height: 17px; border-radius: 5px;
  border: 1.5px solid var(--bpd-accent); background: var(--bpd-accent-bg);
}
ul.bp-checklist li::after {
  content: '✓'; position: absolute; left: 4px; top: 3px;
  font-size: 11px; font-weight: 800; color: var(--bpd-accent-ink);
}

/* ── Big number ── */
.bp-bignum {
  margin: 26px 0; padding: 22px 24px; text-align: center;
  background: var(--bpd-cream);
  border: 1px solid var(--bpd-accent-ln);
  border-radius: var(--bpd-r-lg);
}
.bp-bignum-v {
  font-family: var(--bpd-serif); font-size: 40px; font-weight: 700;
  line-height: 1.05; color: var(--bpd-ink); letter-spacing: -.02em;
}
.bp-bignum-l {
  margin-top: 8px; font-size: 13.5px; line-height: 1.6; color: var(--bpd-ink-3);
  max-width: 460px; margin-left: auto; margin-right: auto;
}

/* ═══════════════════════════════════════════════════════════
   3. LAYOUT
   ═══════════════════════════════════════════════════════════ */
.bp-grid { display: grid; gap: 16px; margin: 24px 0; }
.bp-grid-2 { grid-template-columns: 1fr 1fr; }
.bp-grid-3 { grid-template-columns: repeat(3, 1fr); }
.bp-grid .bp-col {
  padding: 16px 18px; background: var(--bpd-paper);
  border: 1px solid var(--bpd-line); border-radius: var(--bpd-r);
}
.bp-grid .bp-col > :first-child { margin-top: 0; }
.bp-grid .bp-col > :last-child { margin-bottom: 0; }
.bp-grid .bp-col h4 { font-size: 15.5px; margin: 0 0 6px; color: var(--bpd-ink); }
.bp-grid .bp-col p { font-size: 14px; line-height: 1.7; color: var(--bpd-ink-2); }

/* ── Feature cards ── */
.bp-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin: 26px 0; }
.bp-card {
  padding: 18px; background: var(--bpd-paper);
  border: 1px solid var(--bpd-line); border-radius: var(--bpd-r);
}
.bp-card-ico {
  width: 38px; height: 38px; border-radius: 10px; margin-bottom: 12px;
  display: flex; align-items: center; justify-content: center;
  font-size: 18px; background: var(--bpd-accent-bg); border: 1px solid var(--bpd-accent-ln);
}
.bp-card-t { font-size: 15px; font-weight: 700; color: var(--bpd-ink); margin-bottom: 5px; }
.bp-card-d { font-size: 13.5px; line-height: 1.65; color: var(--bpd-ink-3); }

/* ── Split (media + text) ── */
.bp-split {
  display: grid; grid-template-columns: 1fr 1fr; gap: 20px;
  align-items: center; margin: 28px 0;
}
.bp-split-media img { width: 100%; margin: 0; border-radius: var(--bpd-r); display: block; }
.bp-split-body > :first-child { margin-top: 0; }
.bp-split-body > :last-child { margin-bottom: 0; }
.bp-split-body h4 { font-size: 18px; margin: 0 0 8px; color: var(--bpd-ink); }
.bp-split-body p { font-size: 14.5px; line-height: 1.75; color: var(--bpd-ink-2); }
.bp-split-flip .bp-split-media { order: 2; }

/* ── Timeline ── */
.bp-timeline { margin: 28px 0; padding-left: 4px; }
.bp-tl-item { position: relative; padding: 0 0 22px 30px; }
.bp-tl-item::before {
  content: ''; position: absolute; left: 4px; top: 6px;
  width: 11px; height: 11px; border-radius: 50%;
  background: var(--bpd-accent); border: 2px solid var(--bpd-paper);
  outline: 1px solid var(--bpd-accent-ln);
}
.bp-tl-item::after {
  content: ''; position: absolute; left: 9px; top: 20px; bottom: 0;
  width: 1px; background: var(--bpd-accent-ln);
}
.bp-tl-item:last-child { padding-bottom: 0; }
.bp-tl-item:last-child::after { display: none; }
.bp-tl-date {
  font-family: var(--bpd-mono); font-size: 10.5px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 1.2px;
  color: var(--bpd-accent-ink); margin-bottom: 4px;
}
.bp-tl-body strong { display: block; font-size: 15px; color: var(--bpd-ink); margin-bottom: 3px; }
.bp-tl-body span { font-size: 14px; line-height: 1.7; color: var(--bpd-ink-2); }

/* ── Accordion (native details/summary — no JS needed) ── */
.bp-acc {
  margin: 26px 0; border: 1px solid var(--bpd-line);
  border-radius: var(--bpd-r); overflow: hidden; background: var(--bpd-paper);
}
.bp-acc-item { border-bottom: 1px solid var(--bpd-line-2); }
.bp-acc-item:last-child { border-bottom: none; }
.bp-acc-item > summary {
  padding: 14px 44px 14px 18px; position: relative; cursor: pointer;
  font-size: 15px; font-weight: 600; color: var(--bpd-ink);
  list-style: none; user-select: none;
}
.bp-acc-item > summary::-webkit-details-marker { display: none; }
.bp-acc-item > summary::after {
  content: '+'; position: absolute; right: 18px; top: 50%;
  transform: translateY(-50%); font-size: 19px; font-weight: 400;
  color: var(--bpd-accent-ink); line-height: 1;
}
.bp-acc-item[open] > summary::after { content: '–'; }
.bp-acc-item[open] > summary { background: var(--bpd-surface); }
.bp-acc-body { padding: 0 18px 16px; font-size: 14.5px; line-height: 1.75; color: var(--bpd-ink-2); }
.bp-acc-body > :last-child { margin-bottom: 0; }

/* ── Spacer + section band ── */
hr.bp-spacer { border: none; background: none; height: 36px; margin: 0; }
.bp-band {
  display: flex; align-items: center; gap: 12px; margin: 40px 0 26px;
  padding-top: 18px; border-top: 1px solid var(--bpd-line);
}
.bp-band-ico {
  width: 30px; height: 30px; flex-shrink: 0; border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  background: var(--bpd-accent-bg); border: 1px solid var(--bpd-accent-ln);
  font-family: var(--bpd-serif); font-size: 15px; color: var(--bpd-accent-ink);
}
.bp-band-txt {
  font-family: var(--bpd-mono); font-size: 11px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 1.8px; color: var(--bpd-ink-3);
}

/* ═══════════════════════════════════════════════════════════
   4. DATA
   ═══════════════════════════════════════════════════════════ */
.bp-stats {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; margin: 26px 0;
  background: var(--bpd-line); border: 1px solid var(--bpd-line);
  border-radius: var(--bpd-r); overflow: hidden;
}
.bp-stat { background: var(--bpd-paper); padding: 16px 14px; text-align: center; }
.bp-stat-v {
  font-size: 22px; font-weight: 800; color: var(--bpd-ink);
  line-height: 1.1; letter-spacing: -.01em;
}
.bp-stat-l {
  margin-top: 6px; font-family: var(--bpd-mono); font-size: 9.5px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 1.2px; color: var(--bpd-ink-4);
}
.bp-stat-v.is-gold  { color: var(--bpd-accent-ink); }
.bp-stat-v.is-green { color: var(--bpd-green); }
.bp-stat-v.is-red   { color: var(--bpd-red); }

/* ── Meters ── */
.bp-meters {
  margin: 26px 0; padding: 18px 20px; background: var(--bpd-paper);
  border: 1px solid var(--bpd-line); border-radius: var(--bpd-r);
}
.bp-meter { margin-bottom: 14px; }
.bp-meter:last-child { margin-bottom: 0; }
.bp-meter-top {
  display: flex; justify-content: space-between; align-items: baseline;
  margin-bottom: 6px; font-size: 13.5px; color: var(--bpd-ink-2);
}
.bp-meter-top span:last-child {
  font-family: var(--bpd-mono); font-size: 12px; font-weight: 700; color: var(--bpd-accent-ink);
}
.bp-meter-track {
  height: 8px; border-radius: 20px; background: var(--bpd-line); overflow: hidden;
}
.bp-meter-track > span {
  display: block; height: 100%; border-radius: 20px;
  background: linear-gradient(90deg, var(--bpd-accent), var(--bpd-accent-2));
}

/* ── Framed rate table ── */
.bp-ratetable {
  margin: 26px 0; border: 1px solid var(--bpd-line);
  border-radius: var(--bpd-r); overflow: hidden; background: var(--bpd-paper);
}
.bp-ratetable-h {
  padding: 11px 18px; color: var(--bpd-ink);
  background: var(--bpd-surface); border-bottom: 1px solid var(--bpd-line);
}
.bp-ratetable table { margin: 0 !important; border: none; width: 100%; border-collapse: collapse; }
.bp-ratetable th {
  background: transparent; color: var(--bpd-ink-4);
  font-family: var(--bpd-mono); font-size: 10px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 1.1px;
  text-align: left; padding: 10px 18px;
  border: none; border-bottom: 1px solid var(--bpd-line);
}
.bp-ratetable td {
  padding: 11px 18px; font-size: 14px; color: var(--bpd-ink-2);
  border: none; border-bottom: 1px solid var(--bpd-line-2);
}
.bp-ratetable tr:last-child td { border-bottom: none; }
.bp-ratetable td:first-child { font-weight: 600; color: var(--bpd-ink); }
.bp-ratetable-f {
  padding: 9px 18px; border-top: 1px solid var(--bpd-line);
  font-size: 11.5px; color: var(--bpd-ink-4); background: var(--bpd-surface);
}

/* ── Option cards (comparison) ── */
.bp-optcards { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin: 26px 0; }
.bp-optcard {
  background: var(--bpd-paper); border: 1px solid var(--bpd-line);
  border-radius: var(--bpd-r); overflow: hidden;
}
.bp-optcard-h {
  padding: 12px 16px; font-size: 14.5px; font-weight: 700; color: var(--bpd-ink);
  background: var(--bpd-surface); border-bottom: 1px solid var(--bpd-line);
}
.bp-optcard ul { margin: 0; padding: 6px 0; list-style: none; }
.bp-optcard li {
  display: flex; justify-content: space-between; gap: 12px;
  padding: 9px 16px; font-size: 13.5px; border-bottom: 1px solid var(--bpd-line-2);
}
.bp-optcard li:last-child { border-bottom: none; }
.bp-optcard li .k { color: var(--bpd-ink-4); }
.bp-optcard li .v { color: var(--bpd-ink); font-weight: 600; text-align: right; }
.bp-optcard.is-pick { border-color: var(--bpd-accent-ln); }
.bp-optcard.is-pick .bp-optcard-h { background: var(--bpd-accent-bg); color: var(--bpd-accent-ink); }

/* ── Pricing ── */
.bp-pricing { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin: 28px 0; }
.bp-plan {
  padding: 20px 18px; text-align: center; background: var(--bpd-paper);
  border: 1px solid var(--bpd-line); border-radius: var(--bpd-r-lg);
}
.bp-plan.is-featured { border-color: var(--bpd-accent); background: var(--bpd-cream); }
.bp-plan-n {
  font-family: var(--bpd-mono); font-size: 10.5px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 1.4px; color: var(--bpd-ink-4);
}
.bp-plan-p {
  margin: 10px 0 14px; font-size: 28px; font-weight: 800;
  color: var(--bpd-ink); line-height: 1;
}
.bp-plan-p span { font-size: 12px; font-weight: 500; color: var(--bpd-ink-4); }
.bp-plan ul { margin: 0 0 16px; padding: 0; list-style: none; text-align: left; }
.bp-plan li {
  position: relative; padding-left: 20px; margin-bottom: 7px;
  font-size: 13.5px; line-height: 1.6; color: var(--bpd-ink-2);
}
.bp-plan li::before { content: '✓'; position: absolute; left: 0; color: var(--bpd-green); font-weight: 800; }
.bp-plan-cta {
  display: block; padding: 10px 14px; border-radius: var(--bpd-r-sm);
  font-size: 13px; font-weight: 700; text-decoration: none;
  background: var(--bpd-ink); color: #fff;
}
.bp-plan.is-featured .bp-plan-cta {
  background: linear-gradient(135deg, var(--bpd-accent), var(--bpd-accent-2)); color: var(--bpd-on-accent);
}

/* ── Compliance calendar ── */
.bp-cal {
  margin: 26px 0; border: 1px solid var(--bpd-line);
  border-radius: var(--bpd-r); overflow: hidden; background: var(--bpd-paper);
}
.bp-cal-h {
  padding: 11px 18px; color: var(--bpd-ink);
  background: var(--bpd-surface); border-bottom: 1px solid var(--bpd-line);
}
.bp-cal-row {
  display: flex; align-items: baseline; gap: 14px;
  padding: 11px 18px; border-bottom: 1px solid var(--bpd-line-2);
}
.bp-cal-row:last-child { border-bottom: none; }
.bp-cal-date {
  flex: 0 0 66px; font-family: var(--bpd-mono); font-size: 12px; font-weight: 700;
  color: var(--bpd-accent-ink);
}
.bp-cal-name { flex: 1; min-width: 0; font-size: 14px; font-weight: 600; color: var(--bpd-ink); }
.bp-cal-note { flex: 0 0 auto; font-size: 12.5px; color: var(--bpd-ink-4); }

/* ── Penalty grid ── */
.bp-pengrid {
  margin: 26px 0; border: 1px solid rgba(220,38,38,.20);
  border-radius: var(--bpd-r); overflow: hidden; background: var(--bpd-red-bg);
}
.bp-pengrid-h {
  padding: 11px 18px; color: var(--bpd-red);
  background: rgba(220,38,38,.06); border-bottom: 1px solid rgba(220,38,38,.15);
}
.bp-pen {
  display: flex; justify-content: space-between; align-items: baseline; gap: 14px;
  padding: 11px 18px; border-bottom: 1px solid rgba(220,38,38,.10);
}
.bp-pen:last-child { border-bottom: none; }
.bp-pen-k { font-size: 14px; color: var(--bpd-ink-2); }
.bp-pen-v {
  font-family: var(--bpd-mono); font-size: 13.5px; font-weight: 700;
  color: var(--bpd-red); white-space: nowrap;
}

/* ═══════════════════════════════════════════════════════════
   5. CONVERSION
   ═══════════════════════════════════════════════════════════ */
.bp-ctabanner {
  display: flex; align-items: center; gap: 22px; flex-wrap: wrap;
  margin: 32px 0; padding: 24px 26px;
  border-radius: var(--bpd-r-lg);
  background: linear-gradient(135deg, #0A132B 0%, #12264C 100%);
  border: 1px solid rgba(200,153,46,.22);
}
.bp-ctabanner-body { flex: 1; min-width: 220px; }
.bp-ctabanner-t {
  font-family: var(--bpd-serif); font-size: 21px; font-weight: 700;
  color: #F8F5EE; line-height: 1.3; margin-bottom: 5px;
}
.bp-ctabanner-s { font-size: 14px; line-height: 1.6; color: rgba(248,245,238,.62); }
.bp-ctabanner-acts { display: flex; gap: 10px; flex-wrap: wrap; }
.bp-btn-gold {
  padding: 11px 22px; border-radius: var(--bpd-r-sm);
  background: linear-gradient(135deg, var(--bpd-accent), var(--bpd-accent-2));
  color: var(--bpd-on-accent); font-size: 13.5px; font-weight: 700;
  text-decoration: none; white-space: nowrap;
}
.bp-btn-line {
  padding: 11px 22px; border-radius: var(--bpd-r-sm);
  border: 1px solid rgba(248,245,238,.28); color: #F8F5EE;
  font-size: 13.5px; font-weight: 600; text-decoration: none; white-space: nowrap;
}

/* ── Expert card ── */
.bp-expert {
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
  margin: 26px 0; padding: 16px 20px;
  background: var(--bpd-paper); border: 1px solid var(--bpd-line);
  border-radius: var(--bpd-r);
}
.bp-expert-av {
  width: 46px; height: 46px; flex-shrink: 0; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, var(--bpd-accent), var(--bpd-accent-2));
  color: var(--bpd-on-accent); font-size: 15px; font-weight: 800; letter-spacing: .5px;
}
.bp-expert-body { flex: 1; min-width: 160px; }
.bp-expert-body strong { display: block; font-size: 15px; color: var(--bpd-ink); }
.bp-expert-body span { font-size: 13px; color: var(--bpd-ink-3); }
.bp-expert-cta {
  padding: 9px 18px; border-radius: var(--bpd-r-sm);
  background: var(--bpd-ink); color: #fff;
  font-size: 12.5px; font-weight: 700; text-decoration: none; white-space: nowrap;
}

/* ── Testimonial ── */
.bp-testimonial {
  margin: 28px 0; padding: 22px 24px;
  background: var(--bpd-cream); border: 1px solid var(--bpd-accent-ln);
  border-radius: var(--bpd-r-lg);
}
/* Stars stay amber — a rating drawn in the brand red reads as an error state. */
.bp-testimonial-stars { font-size: 14px; color: #E8B84A; letter-spacing: 2px; margin-bottom: 10px; }
.bp-testimonial blockquote {
  margin: 0 0 14px; padding: 0; border: none; background: none;
  font-family: var(--bpd-serif); font-size: 17.5px; font-style: normal;
  line-height: 1.6; color: var(--bpd-ink);
}
.bp-testimonial-by { display: flex; align-items: center; gap: 11px; }
.bp-testimonial-av {
  width: 34px; height: 34px; border-radius: 50%; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  background: var(--bpd-ink); color: #fff; font-size: 12px; font-weight: 700;
}
.bp-testimonial-by strong { display: block; font-size: 13.5px; color: var(--bpd-ink); }
.bp-testimonial-by span { font-size: 12px; color: var(--bpd-ink-4); }

/* ── Trust strip ── */
.bp-trust {
  display: flex; flex-wrap: wrap; gap: 8px; margin: 22px 0;
  padding: 12px 14px; background: var(--bpd-surface);
  border: 1px solid var(--bpd-line); border-radius: var(--bpd-r);
}
.bp-trust-item {
  font-size: 12.5px; font-weight: 600; color: var(--bpd-ink-2);
  padding: 5px 11px; border-radius: 20px;
  background: var(--bpd-paper); border: 1px solid var(--bpd-line);
}

/* ── WhatsApp CTA ── */
.bp-wa {
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
  margin: 24px 0; padding: 14px 18px;
  background: var(--bpd-green-bg); border: 1px solid rgba(22,163,74,.20);
  border-radius: var(--bpd-r);
}
.bp-wa-ico { font-size: 24px; line-height: 1; flex-shrink: 0; }
.bp-wa-body { flex: 1; min-width: 160px; }
.bp-wa-body strong { display: block; font-size: 14.5px; color: var(--bpd-ink); }
.bp-wa-body span { font-size: 13px; color: var(--bpd-ink-3); }
.bp-wa-btn {
  padding: 9px 18px; border-radius: var(--bpd-r-sm);
  background: var(--bpd-green); color: #fff;
  font-size: 12.5px; font-weight: 700; text-decoration: none; white-space: nowrap;
}

/* ── Related service links ── */
.bp-svclinks {
  margin: 26px 0; padding: 16px 18px;
  background: var(--bpd-paper); border: 1px solid var(--bpd-line);
  border-radius: var(--bpd-r);
}
.bp-svclinks-h { color: var(--bpd-ink-4); margin-bottom: 10px; }
.bp-svclinks-row { display: flex; flex-wrap: wrap; gap: 8px; }
.bp-svclinks-row a {
  padding: 7px 14px; border-radius: 20px;
  background: var(--bpd-surface); border: 1px solid var(--bpd-line);
  font-size: 13px; font-weight: 600; color: var(--bpd-ink-2);
  text-decoration: none;
}
.bp-svclinks-row a:hover { border-color: var(--bpd-accent-ln); color: var(--bpd-accent-ink); }

/* ── Subscribe ── */
.bp-subscribe {
  margin: 28px 0; padding: 22px 24px; text-align: center;
  background: var(--bpd-surface); border: 1px dashed var(--bpd-accent-ln);
  border-radius: var(--bpd-r-lg);
}
.bp-subscribe-t {
  font-family: var(--bpd-serif); font-size: 20px; font-weight: 700; color: var(--bpd-ink);
}
.bp-subscribe-s { margin: 6px 0 14px; font-size: 14px; color: var(--bpd-ink-3); }
.bp-subscribe-btn {
  display: inline-block; padding: 10px 24px; border-radius: var(--bpd-r-sm);
  background: linear-gradient(135deg, var(--bpd-accent), var(--bpd-accent-2));
  color: var(--bpd-on-accent); font-size: 13.5px; font-weight: 700; text-decoration: none;
}

/* ═══════════════════════════════════════════════════════════
   6. EDITORIAL / TRUST
   ═══════════════════════════════════════════════════════════ */
.bp-updatelog {
  margin: 26px 0; padding: 16px 18px;
  background: var(--bpd-surface); border: 1px solid var(--bpd-line);
  border-radius: var(--bpd-r);
}
.bp-updatelog-h { color: var(--bpd-ink-4); margin-bottom: 10px; }
.bp-ul-row { display: flex; gap: 14px; margin-bottom: 8px; font-size: 13.5px; line-height: 1.65; }
.bp-ul-row:last-child { margin-bottom: 0; }
.bp-ul-date {
  flex: 0 0 92px; font-family: var(--bpd-mono); font-size: 11.5px;
  font-weight: 700; color: var(--bpd-accent-ink); padding-top: 1px;
}
.bp-ul-txt { flex: 1; min-width: 0; color: var(--bpd-ink-2); }

.bp-disclaimer {
  margin: 30px 0 0; padding: 14px 18px;
  background: var(--bpd-surface); border-top: 2px solid var(--bpd-line);
  border-radius: 0 0 var(--bpd-r-sm) var(--bpd-r-sm);
  font-size: 12.5px; line-height: 1.7; color: var(--bpd-ink-4);
}
.bp-disclaimer strong {
  display: block; font-family: var(--bpd-mono); font-size: 10px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 1.3px;
  color: var(--bpd-ink-3); margin-bottom: 5px;
}
.bp-disclaimer p { margin: 0; font-size: inherit; color: inherit; }

.bp-sources {
  margin: 26px 0; padding: 16px 18px;
  border: 1px solid var(--bpd-line); border-radius: var(--bpd-r); background: var(--bpd-paper);
}
.bp-sources-h { color: var(--bpd-ink-4); margin-bottom: 10px; }
.bp-sources ol { margin: 0; padding-left: 20px; }
.bp-sources li { font-size: 13.5px; line-height: 1.7; color: var(--bpd-ink-2); margin-bottom: 6px; }
.bp-sources li:last-child { margin-bottom: 0; }

.bp-authornote {
  display: flex; gap: 14px; margin: 26px 0; padding: 16px 18px;
  background: var(--bpd-cream); border-left: 4px solid var(--bpd-accent);
  border-radius: 0 var(--bpd-r) var(--bpd-r) 0;
}
.bp-authornote-av { font-size: 22px; line-height: 1.2; flex-shrink: 0; }
.bp-authornote-h { color: var(--bpd-accent-ink); margin-bottom: 5px; }
.bp-authornote p { margin: 0; font-size: 14px; line-height: 1.75; color: var(--bpd-ink-2); font-style: italic; }

.bp-verified {
  display: flex; align-items: center; gap: 13px; margin: 24px 0;
  padding: 12px 16px; background: var(--bpd-green-bg);
  border: 1px solid rgba(22,163,74,.18); border-radius: var(--bpd-r);
}
.bp-verified-ico { font-size: 20px; line-height: 1; flex-shrink: 0; }
.bp-verified-body strong { display: block; font-size: 13.5px; color: var(--bpd-ink); }
.bp-verified-body span { font-size: 12.5px; color: var(--bpd-ink-3); }

/* ═══════════════════════════════════════════════════════════
   7. MEDIA
   ═══════════════════════════════════════════════════════════ */
figure.bp-figure { margin: 28px 0; }
figure.bp-figure img { width: 100%; margin: 0; border-radius: var(--bpd-r); display: block; }
figure.bp-figure figcaption {
  margin-top: 9px; padding-left: 12px; border-left: 2px solid var(--bpd-accent-ln);
  font-size: 12.5px; line-height: 1.6; color: var(--bpd-ink-4);
}
.bp-figure-src { display: block; font-family: var(--bpd-mono); font-size: 10.5px; margin-top: 3px; }

.bp-gallery { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin: 28px 0; }
.bp-gallery figure { margin: 0; }
.bp-gallery img { width: 100%; margin: 0; border-radius: var(--bpd-r-sm); display: block; }
.bp-gallery figcaption { margin-top: 6px; font-size: 11.5px; color: var(--bpd-ink-4); line-height: 1.5; }

.bp-pullquote {
  margin: 32px 0; padding: 0 0 0 24px;
  border-left: 3px solid var(--bpd-accent);
}
.bp-pullquote p {
  margin: 0; font-family: var(--bpd-serif); font-size: 23px; font-weight: 700;
  line-height: 1.45; color: var(--bpd-ink); letter-spacing: -.01em;
}
.bp-pullquote cite {
  display: block; margin-top: 10px; font-style: normal;
  font-family: var(--bpd-mono); font-size: 11px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 1.3px; color: var(--bpd-accent-ink);
}

.bp-doccard {
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
  margin: 24px 0; padding: 14px 18px;
  background: var(--bpd-paper); border: 1px solid var(--bpd-line);
  border-radius: var(--bpd-r);
}
.bp-doccard-ico {
  width: 42px; height: 42px; flex-shrink: 0; border-radius: var(--bpd-r-sm);
  display: flex; align-items: center; justify-content: center;
  background: var(--bpd-red-bg); border: 1px solid rgba(220,38,38,.18);
  color: var(--bpd-red); letter-spacing: .5px; font-size: 10px;
}
.bp-doccard-body { flex: 1; min-width: 150px; }
.bp-doccard-body strong { display: block; font-size: 14.5px; color: var(--bpd-ink); }
.bp-doccard-body span { font-family: var(--bpd-mono); font-size: 11.5px; color: var(--bpd-ink-4); }
.bp-doccard-btn {
  padding: 9px 18px; border-radius: var(--bpd-r-sm);
  background: var(--bpd-ink); color: #fff;
  font-size: 12.5px; font-weight: 700; text-decoration: none; white-space: nowrap;
}

/* Responsive 16:9 video frame */
.bp-video {
  position: relative; margin: 28px 0; padding-bottom: 56.25%; height: 0;
  overflow: hidden; border-radius: var(--bpd-r); background: var(--bpd-surface);
}
.bp-video iframe {
  position: absolute; inset: 0; width: 100%; height: 100%;
  border: none; margin: 0; border-radius: var(--bpd-r);
}

/* ═══════════════════════════════════════════════════════════
   8. INLINE TEXT DESIGN (the "Text FX" menu)
   ═══════════════════════════════════════════════════════════ */
mark.hl-gold  { background: rgba(232,184,74,.32);  color: inherit; padding: 1px 4px; border-radius: 3px; }
mark.hl-green { background: rgba(22,163,74,.18);   color: inherit; padding: 1px 4px; border-radius: 3px; }
mark.hl-red   { background: rgba(220,38,38,.14);   color: inherit; padding: 1px 4px; border-radius: 3px; }
mark.hl-blue  { background: rgba(37,99,235,.14);   color: inherit; padding: 1px 4px; border-radius: 3px; }

.tc-badge {
  display: inline-block; vertical-align: middle;
  font-family: var(--bpd-mono); font-size: 9.5px; font-weight: 800;
  text-transform: uppercase; letter-spacing: 1.1px;
  padding: 3px 8px; border-radius: 4px; margin: 0 3px;
  background: var(--bpd-accent-bg); color: var(--bpd-accent-ink);
  border: 1px solid var(--bpd-accent-ln);
}
.tc-badge.is-new     { background: var(--bpd-green-bg);  color: var(--bpd-green);  border-color: rgba(22,163,74,.28); }
.tc-badge.is-updated { background: var(--bpd-blue-bg);   color: var(--bpd-blue);   border-color: rgba(37,99,235,.28); }
.tc-badge.is-hot     { background: var(--bpd-red-bg);    color: var(--bpd-red);    border-color: rgba(220,38,38,.28); }
.tc-badge.is-note    { background: var(--bpd-purple-bg); color: var(--bpd-purple); border-color: rgba(124,58,237,.28); }

.tc-amt {
  font-family: var(--bpd-mono); font-weight: 700; font-size: .95em;
  color: var(--bpd-accent-ink); white-space: nowrap;
  background: var(--bpd-accent-bg); padding: 1px 6px; border-radius: 4px;
}

kbd, .tc-kbd {
  font-family: var(--bpd-mono); font-size: .82em; font-weight: 600;
  padding: 2px 7px; border-radius: 5px;
  background: var(--bpd-surface); border: 1px solid var(--bpd-line);
  border-bottom-width: 2px; color: var(--bpd-ink-2); white-space: nowrap;
}

.tc-small { font-size: .82em; color: var(--bpd-ink-4); }
.tc-uline {
  background-image: linear-gradient(transparent 62%, rgba(232,184,74,.45) 0);
  padding-bottom: 1px;
}
abbr[title] { text-decoration: underline dotted var(--bpd-accent); cursor: help; text-underline-offset: 3px; }

/* ═══════════════════════════════════════════════════════════
   9. BLOCK STYLE MODIFIERS (the "Style" menu — toggled on the
      current block, so any p / li / h2 / div can take them)
   ═══════════════════════════════════════════════════════════ */
.is-lead {
  font-size: 18.5px !important; line-height: 1.7 !important;
  color: var(--bpd-ink-2) !important; font-weight: 400;
}
.has-dropcap::first-letter {
  float: left; font-family: var(--bpd-serif); font-size: 3.4em;
  line-height: .82; font-weight: 700; color: var(--bpd-accent-ink);
  padding: 4px 10px 0 0;
}
.is-center { text-align: center; }
.is-right  { text-align: right; }
.is-muted  { color: var(--bpd-ink-4) !important; font-size: .92em; }
.is-boxed {
  padding: 16px 18px; background: var(--bpd-surface);
  border: 1px solid var(--bpd-line); border-radius: var(--bpd-r);
}
.is-accent {
  padding: 4px 0 4px 16px; border-left: 3px solid var(--bpd-accent);
}
.is-tight { margin-top: 0 !important; margin-bottom: 6px !important; }
.is-mono  { font-family: var(--bpd-mono); font-size: .92em; }
.is-caps {
  text-transform: uppercase; letter-spacing: 1.4px;
  font-size: .8em; font-weight: 700; color: var(--bpd-ink-3);
}

/* ═══════════════════════════════════════════════════════════
   10. RESPONSIVE — everything multi-column collapses to one
   ═══════════════════════════════════════════════════════════ */
@media (max-width: 760px) {
  .bp-grid-3, .bp-cards, .bp-pricing, .bp-gallery { grid-template-columns: 1fr 1fr; }
  .bp-stats { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
  .bp-grid-2, .bp-grid-3, .bp-cards, .bp-pricing, .bp-gallery,
  .bp-dodont, .bp-optcards, .bp-split { grid-template-columns: 1fr; }
  .bp-split-flip .bp-split-media { order: 0; }
  .bp-stats { grid-template-columns: 1fr 1fr; }
  .bp-caselaw-row { flex-direction: column; gap: 2px; }
  .bp-caselaw-row .k { flex: none; padding-top: 0; }
  .bp-cal-row { flex-wrap: wrap; gap: 4px 12px; }
  .bp-cal-note { flex-basis: 100%; }
  .bp-ul-row { flex-direction: column; gap: 2px; }
  .bp-ul-date { flex: none; }
  .bp-ctabanner, .bp-expert, .bp-wa, .bp-doccard { flex-direction: column; align-items: flex-start; }
  .bp-bignum-v { font-size: 32px; }
  .bp-pullquote p { font-size: 19px; }
}

/* ═══════════════════════════════════════════════════════════
   11. LEGACY BLOCKS — light repair, EDITOR ONLY

   tinymce-content.css still styles the original bp-* blocks for a dark
   canvas (light text on a translucent navy fill), but edit.php forces
   the writing surface white. Result: pale-blue text on near-white in
   every note, step and intel widget you inserted.

   These rules are scoped to .tc-editor-surface — the class TinyMCE puts
   on its own <body> (body_class in edit.php) — so they exist only
   inside the editor. On the published article blog-light.css already
   owns these colours and this whole section is dead weight, which is
   exactly what we want: one file, but no second opinion about how the
   reader's page should look.

   Specificity is (0,2,0) vs tinymce-content.css's (0,1,0), and this
   file is second in content_css, so these win on both counts.
   ═══════════════════════════════════════════════════════════ */
.tc-editor-surface .bp-tip,
.tc-editor-surface .bp-warning,
.tc-editor-surface .bp-important { color: var(--bpd-ink-2); }
.tc-editor-surface .bp-tip       { background: var(--bpd-green-bg); border-left-color: var(--bpd-green); }
.tc-editor-surface .bp-warning   { background: var(--bpd-amber-bg); border-left-color: var(--bpd-amber); }
.tc-editor-surface .bp-important { background: var(--bpd-red-bg);   border-left-color: var(--bpd-red); }
.tc-editor-surface .bp-tip strong       { color: var(--bpd-green); }
.tc-editor-surface .bp-warning strong   { color: var(--bpd-amber); }
.tc-editor-surface .bp-important strong { color: var(--bpd-red); }

.tc-editor-surface .bp-note { color: var(--bpd-ink-2); }
.tc-editor-surface .bp-note-info      { background: var(--bpd-blue-bg);  border-color: var(--bpd-blue); }
.tc-editor-surface .bp-note-info .bp-note-title      { color: var(--bpd-blue); }
.tc-editor-surface .bp-note-warning   { background: var(--bpd-amber-bg); border-color: var(--bpd-amber); }
.tc-editor-surface .bp-note-warning .bp-note-title   { color: var(--bpd-amber); }
.tc-editor-surface .bp-note-important { background: var(--bpd-red-bg);   border-color: var(--bpd-red); }
.tc-editor-surface .bp-note-important .bp-note-title { color: var(--bpd-red); }
.tc-editor-surface .bp-note-tip       { background: var(--bpd-green-bg); border-color: var(--bpd-green); }
.tc-editor-surface .bp-note-tip .bp-note-title       { color: var(--bpd-green); }

.tc-editor-surface .bp-step {
  background: var(--bpd-paper); border-color: var(--bpd-line);
}
.tc-editor-surface .bp-step::before {
  background: linear-gradient(135deg, var(--bpd-accent), var(--bpd-accent-2));
  color: var(--bpd-on-accent);
}
.tc-editor-surface .bp-step-title { color: var(--bpd-ink); }
.tc-editor-surface .bp-step-desc  { color: var(--bpd-ink-3); }

.tc-editor-surface .bp-flow { background: var(--bpd-surface); border-color: var(--bpd-line); }
.tc-editor-surface .bp-flow-title { color: var(--bpd-accent-ink); }
.tc-editor-surface .bp-flow-node {
  background: linear-gradient(135deg, var(--bpd-accent), var(--bpd-accent-2));
  color: var(--bpd-on-accent);
}
.tc-editor-surface .bp-flow-body strong { color: var(--bpd-ink); }
.tc-editor-surface .bp-flow-body span   { color: var(--bpd-ink-3); }

.tc-editor-surface .bp-faq { background: var(--bpd-paper); border-color: var(--bpd-line); }
.tc-editor-surface .bp-faq-title { color: var(--bpd-ink); }
.tc-editor-surface .bp-faq-item  { border-bottom-color: var(--bpd-line-2); }
.tc-editor-surface .bp-faq-q { color: var(--bpd-ink); }
.tc-editor-surface .bp-faq-a { color: var(--bpd-ink-2); }

.tc-editor-surface .bp-toc { background: var(--bpd-surface); border-color: var(--bpd-line); border-left-color: var(--bpd-accent); }
.tc-editor-surface .bp-toc-title { color: var(--bpd-ink); }
.tc-editor-surface .bp-toc li { color: var(--bpd-ink-2); }
.tc-editor-surface .bp-toc a  { color: var(--bpd-accent-ink); }

.tc-editor-surface .bp-intel { background: var(--bpd-paper); border-color: var(--bpd-line); }
.tc-editor-surface .bp-intel-head { border-bottom-color: var(--bpd-line); }
.tc-editor-surface .bp-intel-head-icon { background: var(--bpd-accent-bg); }
.tc-editor-surface .bp-intel-head-title { color: var(--bpd-ink); }
.tc-editor-surface .bp-intel-head-sub   { color: var(--bpd-ink-4); }
.tc-editor-surface .bp-intel-grid { background: var(--bpd-line); }
.tc-editor-surface .bp-intel-cell { background: var(--bpd-paper); }
.tc-editor-surface .bp-intel-label { color: var(--bpd-ink-4); }
.tc-editor-surface .bp-intel-value { color: var(--bpd-ink); }
.tc-editor-surface .bp-intel-value.val-gold { color: var(--bpd-accent-ink); }
.tc-editor-surface .bp-intel-value.val-low  { color: var(--bpd-green); }
.tc-editor-surface .bp-intel-value.val-high { color: var(--bpd-red); }
.tc-editor-surface .bp-intel-footer { color: var(--bpd-ink-4); border-top-color: var(--bpd-line); }

.tc-editor-surface .bp-resource,
.tc-editor-surface .bp-calc-bridge { background: var(--bpd-paper); border-color: var(--bpd-line); }
.tc-editor-surface .bp-resource-text strong,
.tc-editor-surface .bp-calc-body strong { color: var(--bpd-ink); }
.tc-editor-surface .bp-resource-text span,
.tc-editor-surface .bp-calc-body span   { color: var(--bpd-ink-3); }
.tc-editor-surface .bp-resource-btn {
  background: linear-gradient(135deg, var(--bpd-accent), var(--bpd-accent-2));
  color: var(--bpd-on-accent);
}

.tc-editor-surface .law-ref {
  background: var(--bpd-purple-bg); border-color: rgba(124,58,237,.22); color: var(--bpd-purple);
}

/* Tables: tinymce-content.css paints a navy header row with white-ish
   body cells — on a white canvas the body cells vanish. */
.tc-editor-surface th {
  background: var(--bpd-surface); color: var(--bpd-ink);
  border-color: var(--bpd-line);
}
.tc-editor-surface td {
  color: var(--bpd-ink-2); border-color: var(--bpd-line);
}
.tc-editor-surface tr:hover td { background: rgba(10,19,43,.02); }
.tc-editor-surface blockquote {
  background: var(--bpd-cream); color: var(--bpd-ink-2);
  border-left-color: var(--bpd-accent);
}
.tc-editor-surface hr {
  background: linear-gradient(90deg, transparent, var(--bpd-line), transparent);
}
.tc-editor-surface hr.bp-spacer {
  /* A spacer must still be findable with the mouse while editing. */
  background: none; border-top: 1px dashed var(--bpd-line); height: 35px;
}
.tc-editor-surface mark { color: var(--bpd-ink); }

/* ═══════════════════════════════════════════════════════════
   12. PRINT — the article print stack (assets/css/print.css)
   flattens the older bp-* blocks; do the same for these so a
   saved PDF stays under a sane file size and stays legible.
   ═══════════════════════════════════════════════════════════ */
@media print {
  .bp-ctabanner, .bp-wa, .bp-subscribe, .bp-expert-cta,
  .bp-plan-cta, .bp-doccard-btn, .bp-svclinks { display: none !important; }
  .bp-tldr, .bp-takeaways, .bp-quickans, .bp-example, .bp-formula,
  .bp-caselaw, .bp-cal, .bp-pengrid, .bp-ratetable, .bp-stats,
  .bp-meters, .bp-sources, .bp-updatelog, .bp-testimonial,
  .bp-authornote, .bp-bignum, .bp-alert, .bp-deadline, .bp-acc {
    background: none !important;
    border: 1px solid #999 !important;
    break-inside: avoid;
  }
  .bp-acc-item[open] > summary, .bp-acc-body { display: block !important; }
  .bp-acc-item > summary::after { display: none !important; }
  .bp-video { display: none !important; }
}