/* Scoped Story presentation; existing article prose, product templates and tokens are untouched. */
.article-intro { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,.9fr); align-items: center; gap: clamp(32px,5vw,72px); margin-bottom: 40px; }
.article-intro .article-header { text-align: left; margin: 0; }
.article-intro .story-meta { justify-content: flex-start; margin-top: 24px; }
.article-intro .article-header h1 { font-size: clamp(32px,3.4vw,48px); text-wrap: pretty; }
.article-lead-photo { margin: 0; background: var(--color-surface); border-radius: 12px; overflow: hidden; }
.article-lead-photo img { display: block; width: 100%; height: auto; max-height: 520px; object-fit: contain; }
.story-overview { max-width: 65ch; margin: 0 auto 32px; border-top: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border); }
.story-overview summary { min-height: 48px; padding-block: 14px; cursor: pointer; font-size: 14px; }
.story-overview summary:focus-visible,.story-overview__scroll:focus-visible { outline: 2px solid var(--color-text); outline-offset: 3px; }
.story-overview__scroll { overflow-x: auto; }
.article-diagram { display: block; width: 100%; min-width: 650px; height: auto; }
.story-card img[data-story-thumbnail] { object-fit: contain; background: var(--color-surface); }
@media(max-width:700px) {
  .article-intro { grid-template-columns: 1fr; gap: 24px; margin-bottom: 24px; }
  .article-intro .article-header h1 { font-size: 34px; }
  .article-lead-photo { max-width: 440px; width: 100%; margin-inline: auto; }
  .article-lead-photo img { max-height: 410px; }
  .story-card img[data-story-thumbnail] { height: 136px; width: 104px; object-fit: contain; }
}