/* Shared editorial layer: real selectors, not uncompiled prose utilities.
   Keep site navigation, product cards, forms and action buttons independent. */
:root {
  --reading-ink: #263445;
  --reading-heading: #1a2533;
  --reading-link: #79591e;
  --reading-line: #d6dce2;
  --reading-soft: #faf8f3;
  --reading-header: #745923;
}

main :is(.content-prose, .prose, .ir-body) {
  min-width: 0;
  color: var(--reading-ink);
  font-size: 1.0625rem;
  line-height: 1.8;
  overflow-wrap: break-word;
  word-break: normal;
}

main .content-prose[itemprop="articleBody"] {
  width: 100%;
  max-width: 78ch;
  margin-inline: auto;
}

.article-page .article-reading-grid > .content-prose,
.ir-reading > .content-prose {
  max-width: none;
}

.article-page .article-reading-grid--no-toc .content-prose {
  max-width: 52rem;
}

main :is(.content-prose, .prose, .ir-body, .case-section, .buyer-evidence, .article-faq) p {
  margin-block: 0 1.15em;
  line-height: 1.8;
}

main :is(.content-prose, .prose, .ir-body) :is(p, li) {
  font-size: inherit;
  line-height: inherit;
}

main :is(.content-prose, .prose, .ir-body) :is(h2, h3, h4) {
  color: var(--reading-heading);
  font-weight: 700;
  overflow-wrap: break-word;
  word-break: normal;
  text-wrap: pretty;
  scroll-margin-top: 9rem;
}

main :is(.content-prose, .prose, .ir-body) h2,
.article-page .content-prose h2 {
  margin-block: 2.5rem 1rem;
  font-size: clamp(1.5rem, 2.25vw, 1.95rem);
  line-height: 1.3;
}

main :is(.content-prose, .prose, .ir-body) h3,
.article-page .content-prose h3 {
  margin-block: 1.9rem .75rem;
  font-size: clamp(1.2rem, 1.6vw, 1.4rem);
  line-height: 1.4;
}

main :is(.content-prose, .prose, .ir-body) h4 {
  margin-block: 1.5rem .65rem;
  font-size: 1.075rem;
  line-height: 1.45;
}

main :is(.content-prose, .prose, .ir-body) > :first-child,
main :is(.content-prose, .prose) :is([data-phase67="summary"], [data-phase67="sources"], [data-phase67="reviewer"]) > :first-child {
  margin-top: 0;
}

main :is(.content-prose, .prose, .ir-body, .case-section, .buyer-evidence) :is(ul, ol) {
  margin-block: 1rem 1.5rem;
  padding-inline-start: 1.5rem;
  list-style-position: outside;
}

main :is(.content-prose, .prose, .ir-body, .case-section, .buyer-evidence) ul { list-style-type: disc; }
main :is(.content-prose, .prose, .ir-body, .case-section, .buyer-evidence) ol { list-style-type: decimal; }
main :is(.content-prose, .prose, .ir-body, .case-section, .buyer-evidence) li { margin-block: .55rem; padding-inline-start: .2rem; }
main :is(.content-prose, .prose, .ir-body) li::marker { color: var(--reading-link); font-weight: 600; }
main :is(.content-prose, .prose, .ir-body) li > :is(ul, ol) { margin-block: .6rem; }
main :is(.content-prose, .prose, .ir-body) li > p { margin-bottom: .5rem; }
main :is(.content-prose, .prose, .ir-body, .case-section) p:last-child { margin-bottom: 0; }

/* Visible text remains the link label. Buttons retain their own contrast rules. */
main :is(.content-prose, .prose, .ir-body) :is(p, li, td, dd, figcaption) a:not([class*="btn"]):not([class*="button"]):not([class*="bg-"]):not([class*="inline-flex"]):not([role="button"]),
main a.context-link {
  color: var(--reading-link);
  font-weight: 600;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: .2em;
  text-decoration-color: #b59a63;
}

main :is(.content-prose, .prose, .ir-body) :is(p, li, td, dd, figcaption) a:not([class*="btn"]):not([class*="button"]):not([class*="bg-"]):not([class*="inline-flex"]):not([role="button"]):hover,
main a.context-link:hover {
  color: #513b14;
  text-decoration-color: currentColor;
  text-decoration-thickness: 2px;
}

main :is(.content-prose, .prose, .ir-body) a:focus-visible,
main a.context-link:focus-visible,
main .content-table-scroll:focus-visible {
  outline: 3px solid #9b762d;
  outline-offset: 4px;
  border-radius: 3px;
}

main :is(.content-prose, .prose, .ir-body) blockquote {
  border-inline-start: 4px solid #b29455;
  background: var(--reading-soft);
  padding: 1.2rem 1.4rem;
  margin: 1.8rem 0;
  border-radius: 0 .5rem .5rem 0;
}

/* A scroll region contains ONLY a table, never the surrounding article. */
main .content-table-scroll,
.article-page .content-table-scroll {
  display: block;
  min-width: 0;
  max-width: 100%;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  -webkit-overflow-scrolling: touch;
  margin-block: 1.6rem 2rem;
  border: 1px solid var(--reading-line);
  border-radius: .65rem;
  background: #fff;
  scrollbar-width: thin;
  scrollbar-color: #a28b5c #f1f0ed;
}

/* Override legacy article .prose table display:block and inline min-width. */
main .content-table-scroll table.content-table,
main .content-table-scroll table {
  display: table !important;
  width: 100% !important;
  max-width: none;
  min-width: 0 !important;
  margin: 0;
  border: 0;
  border-collapse: collapse;
  border-spacing: 0;
  border-radius: 0;
  overflow: visible;
  table-layout: auto;
  background: #fff;
  box-shadow: none;
  font-size: .9375rem;
  line-height: 1.65;
}

main .content-table-scroll table.content-table--wide { min-width: 38rem !important; }

/* Some legacy product templates hide the header and turn cells into blocks on
   phones. Keep native row/column relationships in the shared scroll wrapper. */
main .content-table-scroll table thead { display: table-header-group; }
main .content-table-scroll table tbody { display: table-row-group; }
main .content-table-scroll table tfoot { display: table-footer-group; }
main .content-table-scroll table tr { display: table-row; width: auto; padding: 0; }

main .content-table-scroll .content-table :is(th, td) {
  display: table-cell;
  width: auto;
  min-width: 0;
  padding: .95rem 1.1rem;
  border: 1px solid var(--reading-line);
  text-align: start;
  vertical-align: top;
  color: var(--reading-ink);
  font-size: inherit;
  line-height: 1.65;
  white-space: normal;
  word-break: normal;
  overflow-wrap: break-word;
  background: #fff;
}

main .content-table-scroll .content-table thead th {
  background: var(--reading-header);
  color: #fff;
  border-color: #a18b5e;
  font-weight: 700;
  line-height: 1.5;
}

main .content-table-scroll .content-table thead :is(a, strong, span) { color: inherit; }
main .content-table-scroll .content-table tbody tr:nth-child(even) > :is(td, th) { background: #fbfaf7; }
main .content-table-scroll .content-table tbody th[scope="row"] { background: #f5f1e7; color: #674b19; font-weight: 650; }
main .content-table-scroll .content-table tbody tr:hover > :is(td, th) { background: #f5f3ed; }
main .content-table-scroll .content-table--compact :is(th, td):first-child { width: 29%; min-width: 7rem; }
main .content-table-scroll :is(th, td) > :is(p, ul, ol):last-child { margin-bottom: 0; }
main .content-table-scroll :is(th, td) :is(ul, ol) { padding-inline-start: 1.2rem; margin-block: .3rem; }
main .content-table-scroll :is(th, td) p { margin-bottom: .55rem; font-size: inherit; line-height: inherit; }
main .content-table-scroll caption { caption-side: top; padding: 1rem 1.1rem; color: var(--reading-heading); background: #f5f1e7; font-weight: 600; text-align: start; line-height: 1.6; }

/* A narrow desktop contents rail must not inherit a two-column utility grid. */
/* overflow-x:hidden also creates a vertical scroll container on body and stops
   sticky contents from following the viewport. Clip without adding a scroller. */
body:has(.article-page),
body:has(.ir-reading) { overflow-x: clip; overflow-y: visible; }
.article-page .article-toc { padding: 1.25rem; top: 8.5rem; max-height: calc(100dvh - 10rem); overflow-y: auto; }
.article-page .article-toc > div { display: grid; grid-template-columns: minmax(0, 1fr); gap: .2rem; }
.article-page .article-toc h2 { font-size: 1.05rem; line-height: 1.4; margin: 0 0 .75rem; }
.article-page .article-toc a { padding: .6rem .65rem; font-size: .9rem; line-height: 1.5; overflow-wrap: break-word; word-break: normal; }
.article-page .article-body h2 { padding-bottom: 0; }

@media (max-width: 1023px) {
  .article-page .article-toc { position: static; max-height: none; margin-bottom: 2rem; }
}

@media (max-width: 640px) {
  main :is(.content-prose, .prose, .ir-body) { font-size: 1rem; line-height: 1.8; }
  main :is(.content-prose, .prose, .ir-body) h2,
  .article-page .content-prose h2 { margin-top: 2rem; font-size: 1.5rem; }
  main :is(.content-prose, .prose, .ir-body) h3,
  .article-page .content-prose h3 { margin-top: 1.6rem; font-size: 1.2rem; }
  main .content-table-scroll,
  .article-page .content-table-scroll { margin-block: 1.3rem 1.6rem; }
  main .content-table-scroll .content-table :is(th, td) { padding: .8rem .8rem; }
  main .content-table-scroll .content-table--compact :is(th, td):first-child { min-width: 0; width: 32%; }
  .article-page .article-toc { padding: 1rem; }
}

@media print {
  main .content-table-scroll { overflow: visible; border-radius: 0; }
  main .content-table-scroll table.content-table--wide { min-width: 0 !important; }
  main .content-table-scroll .content-table :is(th, td) { padding: .45rem; font-size: 9pt; }
  main .content-table-scroll .content-table thead th { background: #eee; color: #111; border-color: #999; }
  main .content-table-scroll tr { break-inside: avoid; }
  .article-page .article-toc { display: none; }
  .article-page .article-reading-grid { display: block; }
}
