/* Hallmark · macrostructure: Ecosystem Index / Long Document · theme: existing Samurai brand
   enrichment: approved product imagery · motion: none · nav/footer: preserved approved shell
   variation: topic bands + reading column, distinct from product Catalogue
   pre-emit critique: P5 H4 E4 S5 R5 V5 · contrast: pass · responsive: 320–1920px
   honest: pass · tokens: pass · icons: none new · inherited shell preserved */
:root { --blog-heading-red: oklch(48% .19 28); --blog-title-size: clamp(1.75rem, 3vw, 2.75rem); }
.blog-main { padding-block-start: calc(var(--header-height) + var(--space-2xl)); }
.blog-inner { width: min(calc(100% - var(--space-xl)), var(--content-max)); margin-inline: auto; }
.blog-main h1, .blog-main h2, .blog-main h3 { min-width: 0; overflow-wrap: anywhere; font-family: var(--font-display); font-style: normal; text-wrap: balance; }
.blog-main h1 { font-size: var(--blog-title-size); line-height: 1.18; letter-spacing: -.025em; max-width: 26ch; margin-block: var(--space-sm) var(--space-md); }
.blog-main h1 strong, .blog-main h2 { color: var(--blog-heading-red); }
.blog-main h2 { font-size: clamp(1.375rem, 2vw, 1.875rem); line-height: 1.3; margin-block: 0 var(--space-md); }
.blog-main h3 { font-size: var(--text-lg); line-height: 1.4; }
.blog-main p { margin-block: 0 var(--space-md); }
.blog-heading { padding-block: var(--space-md) var(--space-xl); }
.blog-heading p { max-width: var(--copy-max); font-size: var(--text-lg); }
.blog-meta { color: var(--color-ink-soft); font-size: var(--text-sm); font-weight: 500; }
.blog-category-nav { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-md); margin-block: var(--space-lg) 0; }
.blog-main a { text-underline-offset: 2px; }
.blog-main a:hover { color: var(--color-brand-deep); text-decoration: underline; }
.blog-main a:focus-visible { outline: 2px solid var(--color-brand-deep); outline-offset: 3px; }
.blog-main a:active { color: var(--blog-heading-red); }
.blog-main a[aria-disabled="true"] { opacity: .55; cursor: not-allowed; pointer-events: none; }
.blog-category-nav a, .blog-breadcrumb a, .blog-cta a { white-space: nowrap; min-height: 44px; display: inline-flex; align-items: center; }
.blog-feature { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: var(--space-xl); align-items: center; padding-block: var(--space-xl) var(--space-2xl); border-block-start: 1px solid var(--color-line); }
.blog-feature h2 { color: var(--color-ink); font-size: var(--text-2xl); }
.blog-thumb { height: 18rem; width: 100%; object-fit: contain; background: var(--color-paper-soft); }
.blog-topic { padding-block: var(--space-xl); border-block-start: 1px solid var(--color-line); }
.blog-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-xl); }
.blog-entry { display: grid; grid-template-columns: minmax(0, .38fr) minmax(0, 1fr); gap: var(--space-md); align-items: start; padding-block: var(--space-md); }
.blog-entry .blog-thumb { height: 10rem; }
.blog-entry h3 { margin-block: var(--space-xs); }
.blog-entry h3 a { display: block; }
.blog-entry p { font-size: var(--text-base); }
.blog-feature a img, .blog-entry a img { border: 1px solid var(--color-line); }
.blog-breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-xs); font-size: var(--text-sm); }
.article-heading { max-width: 64rem; padding-block: var(--space-md) var(--space-xl); }
.article-heading h1 { max-width: 31ch; }
.article-heading .blog-intro { max-width: var(--copy-max); font-size: var(--text-lg); font-weight: 500; }
.article-layout { display: grid; grid-template-columns: minmax(0, 18rem) minmax(0, 48rem); gap: var(--space-xl); padding-block-end: var(--space-3xl); justify-content: space-between; }
.article-toc { border-block-start: 2px solid var(--color-brand-deep); padding-block: var(--space-md); align-self: start; }
.article-toc h2 { font-size: var(--text-lg); color: var(--color-ink); }
.article-toc ol { padding-inline-start: var(--space-md); margin-block: 0; }
.article-toc a { display: block; padding-block: var(--space-xs); font-size: var(--text-base); }
.article-copy { font-size: var(--text-lg); line-height: 1.75; min-width: 0; max-width: 67ch; }
.article-copy section { padding-block: var(--space-xl); border-block-start: 1px solid var(--color-line); scroll-margin-top: calc(var(--header-height) + var(--space-xl)); }
.article-copy figure { margin: 0 0 var(--space-xl); }
.article-copy .article-image { width: 100%; max-height: 31rem; object-fit: contain; background: var(--color-paper-soft); }
.article-copy figcaption { margin-block-start: var(--space-xs); font-size: var(--text-sm); color: var(--color-ink-soft); }
.article-copy a:not(.btn) { text-decoration: underline; color: var(--color-brand-deep); }
.article-table-wrap { overflow-x: auto; margin-block: var(--space-lg); }
.article-table { border-collapse: collapse; width: 100%; min-width: 26rem; font-size: var(--text-base); }
.article-table th, .article-table td { padding: var(--space-sm); border-bottom: 1px solid var(--color-line); text-align: left; }
.article-table thead { background: var(--color-paper-tint); }
.article-table caption { text-align: left; margin-block-end: var(--space-sm); font-weight: 700; }
.article-faq h3 { margin-block: var(--space-lg) var(--space-xs); }
.article-links { margin: 0; padding-inline-start: var(--space-md); }
.article-links li { margin-block: var(--space-xs); }
.blog-cta { background: var(--color-paper-soft); padding: var(--space-lg); }
.blog-cta h2 { color: var(--color-ink); }
.blog-cta p { margin-bottom: var(--space-sm); }
.blog-cta a { font-weight: 700; }
.blog-related { padding-block: var(--space-xl) var(--space-2xl); background: var(--color-paper-soft); }
.blog-home { padding-block: var(--space-xl); }
.blog-home .blog-inner { max-width: var(--content-max); }
.blog-home-list { display: flex; flex-wrap: wrap; gap: var(--space-lg); }
.blog-home-list a { max-width: 30ch; font-weight: 700; }
@media (max-width: 60rem) {
  .article-layout { grid-template-columns: minmax(0, 1fr); gap: var(--space-md); }
  .article-toc { max-width: 67ch; }
  .article-toc ol { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 var(--space-lg); }
  .blog-list { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 40rem) {
  .blog-feature { grid-template-columns: minmax(0, 1fr); gap: var(--space-md); }
  .blog-feature .blog-thumb { height: 15rem; }
  .blog-entry { grid-template-columns: minmax(0, .3fr) minmax(0, 1fr); gap: var(--space-sm); }
  .blog-entry .blog-thumb { height: 8rem; }
  .article-toc ol { display: block; }
  .article-heading h1 { font-size: 1.75rem; }
  .article-copy { font-size: var(--text-lg); }
  .blog-main { padding-block-start: calc(var(--header-height) + var(--space-lg)); }
}
@media (prefers-reduced-motion: reduce) { .blog-main * { scroll-behavior: auto; } }