/*
 * legacy-content-base.css — Editorial typography fundamentals for restored posts.
 *
 * The legacy theme styled `<p>`, `<ul>`, `<li>`, `<h1>–<h6>`, `<a>`,
 * `<blockquote>` via GLOBAL selectors in style.css. We only extracted the
 * .bk* block-level rules. Result: paragraphs without spacing, lists without
 * bullets, headings without hierarchy — the "wall of text" effect.
 *
 * This file rebuilds those fundamentals, scoped under `.entry-content` so
 * the rules don't bleed into hong2026 chrome (header, nav, footer, widgets).
 *
 * Reference: theme-work/hong/style.css lines 116–200, 448–490 (live site).
 *
 * Honors `.impeccable.md` bans:
 * - No border-left/right > 1px as accent stripe
 * - No gradient text
 *
 * Load order: priority 24 (between legacy-acf-blocks at 20 and hong-cta at 22).
 */

/* ─── Design tokens (scoped to .entry-content so they don't leak) ──── */
.entry-content {
  --lcb-ink:        #0a0a0a;  /* Headlines, primary */
  --lcb-text:       #1a1a1a;  /* Body text */
  --lcb-muted:      #6b6b67;  /* Captions, mono labels */
  --lcb-line:       #d4d4d0;  /* Dividers, borders */
  --lcb-accent:     #cc2518;  /* Red — list markers, link underlines */
  --lcb-code-bg:    #f4f4f1;  /* Code/pre background */
  --lcb-code-line:  #e5e5e0;  /* Code/pre border */
  --lcb-quote-bg:   #faf9f5;  /* Blockquote background */
}

/* ─── Paragraphs — the #1 fix for wall-of-text ──────────────────────── */
.entry-content p {
  margin: 0 0 1.2em;
  padding: 0;
  font-size: 17px;
  line-height: 1.65;
  color: var(--lcb-text);
}

.entry-content p:last-child {
  margin-bottom: 0;
}

/* ─── Headings — restore legacy hierarchy inside post content only ─── */
.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5,
.entry-content h6 {
  color: var(--lcb-ink);
  font-weight: 600;
  letter-spacing: -0.005em;
  text-wrap: balance;
}

.entry-content h1 {
  margin: 1.6em 0 0.5em;
  font-size: clamp(28px, 3.4vw, 40px);
  line-height: 1.15;
  font-weight: 700;
}

.entry-content h2 {
  margin: 1.7em 0 0.55em;
  font-size: clamp(22px, 2.6vw, 30px);
  line-height: 1.2;
}

.entry-content h3 {
  margin: 1.5em 0 0.5em;
  font-size: clamp(19px, 2.1vw, 24px);
  line-height: 1.25;
}

.entry-content h4 {
  margin: 1.3em 0 0.45em;
  font-size: 18px;
  line-height: 1.35;
}

.entry-content h5 {
  margin: 1.2em 0 0.4em;
  font-size: 16px;
  line-height: 1.4;
}

.entry-content h6 {
  margin: 1.2em 0 0.4em;
  font-size: 14px;
  line-height: 1.45;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

/* First heading inside a block shouldn't have huge top margin */
.entry-content .bk1 > *:first-child,
.entry-content .bk3-right > *:first-child,
.entry-content .bk4-right > *:first-child,
.entry-content .bkw-righti > *:first-child,
.entry-content .rep-sub > *:first-child,
.entry-content .b312 > *:first-child {
  margin-top: 0;
}

/* ─── Lists — restore bullets + indentation ────────────────────────── */
.entry-content ul,
.entry-content ol {
  margin: 0 0 1.2em;
  padding: 0 0 0 1.5em;
}

.entry-content ol li {
  list-style-type: decimal;
}

.entry-content ul li {
  list-style-type: disc;
}

.entry-content li {
  margin: 0 0 0.4em;
  padding-left: 0.25em;
  font-size: 17px;
  line-height: 1.55;
  color: var(--lcb-text);
}

.entry-content li::marker {
  color: var(--lcb-accent);
}

.entry-content li:last-child {
  margin-bottom: 0;
}

/* Nested lists tighten up */
.entry-content ul ul,
.entry-content ul ol,
.entry-content ol ul,
.entry-content ol ol {
  margin: 0.4em 0 0.4em;
  padding-left: 1.25em;
}

.entry-content li > p {
  margin: 0 0 0.5em;
}

.entry-content li > p:last-child {
  margin-bottom: 0;
}

/* ─── Inline text — links, emphasis, code ──────────────────────────── */
.entry-content a {
  color: var(--lcb-text);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  text-decoration-color: var(--lcb-accent);
}

.entry-content a:hover,
.entry-content a:focus-visible {
  color: var(--lcb-accent);
  text-decoration-color: currentColor;
}

.entry-content strong,
.entry-content b {
  font-weight: 600;
  color: var(--lcb-ink);
}

.entry-content em,
.entry-content i {
  font-style: italic;
}

.entry-content code {
  padding: 0.15em 0.4em;
  background: var(--lcb-code-bg);
  border: 1px solid var(--lcb-code-line);
  border-radius: 2px;
  font-family: 'JetBrains Mono', 'SF Mono', Menlo, monospace;
  font-size: 0.9em;
  color: var(--lcb-ink);
}

.entry-content pre {
  margin: 0 0 1.2em;
  padding: 18px 20px;
  background: var(--lcb-code-bg);
  border: 1px solid var(--lcb-code-line);
  border-radius: 4px;
  font-family: 'JetBrains Mono', 'SF Mono', Menlo, monospace;
  font-size: 14px;
  line-height: 1.55;
  overflow-x: auto;
}

.entry-content pre code {
  padding: 0;
  background: none;
  border: 0;
  border-radius: 0;
  font-size: inherit;
}

/* ─── Block quotes — clean, no AI-tell side stripe ─────────────────── */
.entry-content blockquote {
  position: relative;
  margin: 1.8em 0;
  padding: 24px 32px 24px 56px;
  background: var(--lcb-quote-bg);
  border-top: 1px solid var(--lcb-line);
  border-bottom: 1px solid var(--lcb-line);
  font-size: clamp(18px, 2.1vw, 22px);
  font-style: italic;
  line-height: 1.45;
  color: var(--lcb-text);
}

.entry-content blockquote::before {
  content: "“";
  position: absolute;
  left: 18px;
  top: 18px;
  font-size: 48px;
  line-height: 1;
  font-style: normal;
  color: var(--lcb-accent);
  font-weight: 500;
}

.entry-content blockquote p {
  margin: 0 0 0.5em;
  font-size: inherit;
  line-height: inherit;
}

.entry-content blockquote p:last-child {
  margin-bottom: 0;
}

.entry-content blockquote cite {
  display: block;
  margin: 12px 0 0;
  font: 500 12px/1 'JetBrains Mono', 'SF Mono', Menlo, monospace;
  font-style: normal;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--lcb-muted);
}

/* ─── Images — basic responsive behavior + caption rhythm ──────────── */
.entry-content img {
  display: block;       /* polish: kill inline-baseline whitespace under images */
  max-width: 100%;
  height: auto;
  margin: 0;            /* polish: let parent block control rhythm, not the img */
}

/* Polish: images inside ACF blocks need predictable rhythm — the block container
   already provides clamp(28–56px) margins; the img itself shouldn't add more. */
.entry-content .bk1 img,
.entry-content .bk4 img,
.entry-content .bk5 img,
.entry-content .bkw img {
  vertical-align: top;  /* defensive; display:block already covers it */
}

.entry-content figure {
  margin: 1.5em 0;
}

.entry-content figcaption {
  margin: 8px 0 0;
  font: 400 12px/1.5 'JetBrains Mono', 'SF Mono', Menlo, monospace;
  letter-spacing: 0.04em;
  color: var(--lcb-muted);
}

/* ─── Tables — basic structure inside content ──────────────────────── */
.entry-content table {
  width: 100%;
  margin: 1.5em 0;
  border-collapse: collapse;
  font-size: 15px;
  line-height: 1.5;
}

.entry-content table th,
.entry-content table td {
  padding: 12px 14px;
  border-bottom: 1px solid var(--lcb-line);
  text-align: left;
  vertical-align: top;
}

.entry-content table th {
  background: var(--lcb-code-bg);
  font-family: 'JetBrains Mono', 'SF Mono', Menlo, monospace;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--lcb-ink);
  border-bottom: 2px solid var(--lcb-ink);
}

.entry-content table tr:last-child td {
  border-bottom: 0;
}

/* ─── HR — section break ────────────────────────────────────────────── */
.entry-content hr {
  margin: 2em 0;
  border: 0;
  border-top: 1px solid var(--lcb-line);
}

/* ─── Definition lists ─────────────────────────────────────────────── */
.entry-content dl {
  margin: 0 0 1.2em;
}

.entry-content dt {
  margin-top: 0.8em;
  font-weight: 600;
  color: var(--lcb-ink);
}

.entry-content dt:first-child {
  margin-top: 0;
}

.entry-content dd {
  margin: 0.3em 0 0;
  padding-left: 1em;
  color: var(--lcb-text);
}

/* ─── Line length — wider than editorial-narrow because clinical readers
   want skimmable density; 88ch ≈ 780-820px which fills the .entry-content
   width on desktop without becoming Wikipedia-wide. Was 72ch (~600px). */
.entry-content .bk1 > p,
.entry-content .bk1 > ul,
.entry-content .bk1 > ol,
.entry-content .bk1 > h2,
.entry-content .bk1 > h3,
.entry-content .bk1 > h4 {
  max-width: 88ch;
}