/* OFB-F006 — long-form educational content and contextual product bridges. */
.longform-article { max-width: var(--container-prose); margin-inline: auto; }
.longform-article > p:first-of-type { color: var(--color-text-muted); }
.longform-article h2 { margin-top: var(--space-9); scroll-margin-top: calc(var(--header-height) + var(--space-5)); }
.longform-article h3 { margin-top: var(--space-7); }
.longform-article blockquote { margin: var(--space-7) 0; padding: var(--space-5) var(--space-6); border-left: 4px solid var(--color-signal-amber); background: var(--color-signal-amber-soft); font-size: var(--type-scale-lead); }
.article-summary { margin: var(--space-7) 0; padding: var(--space-6); border: 1px solid var(--color-border); border-radius: var(--radius-card); background: var(--color-surface-subtle); }
.article-summary p:last-child { margin-bottom: 0; }
.article-toc { margin: var(--space-7) 0; padding: var(--space-6); border: 1px solid var(--color-border); border-radius: var(--radius-card); background: var(--color-surface); }
.article-toc strong { display: block; margin-bottom: var(--space-3); }
.article-toc ol { margin: 0; columns: 2; gap: var(--space-7); }
.article-toc li { break-inside: avoid; }
.article-figure { width: min(1120px, calc(100vw - 48px)); margin: var(--space-8) 50%; transform: translateX(-50%); }
.article-figure img { display: block; width: 100%; height: auto; border: 1px solid var(--color-border); border-radius: var(--radius-panel); box-shadow: var(--shadow-subtle); }
.article-figure figcaption { max-width: var(--measure-lead); margin: var(--space-3) auto 0; color: var(--color-text-muted); font-size: var(--type-scale-small); text-align: center; }
.article-figure--wide { width: min(1320px, calc(100vw - 32px)); }
.article-callout { margin: var(--space-8) 0; padding: var(--space-6); border: 1px solid var(--color-border); border-radius: var(--radius-card); background: var(--color-surface); box-shadow: var(--shadow-subtle); }
.article-callout h3 { margin-top: 0; }
.article-product-bridge { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: var(--space-7); width: min(1040px, calc(100vw - 48px)); margin: var(--space-9) 50%; padding: var(--space-7); transform: translateX(-50%); border: 1px solid #28344a; border-radius: var(--radius-panel); background: linear-gradient(145deg,#172236,#101827); color: var(--color-text-inverse-muted); box-shadow: var(--shadow-emphasis); }
.article-product-bridge h2 { margin: 0 0 var(--space-3); color: var(--color-text-inverse); }
.article-product-bridge p { margin-bottom: 0; }
.article-product-bridge .section-kicker { color: #e3a944; }
.article-product-bridge .button { white-space: nowrap; }
.start-here-card { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0,1.35fr) minmax(280px,.65fr); gap: var(--space-7); align-items: center; padding: var(--space-7); border-color: var(--color-border-strong); background: linear-gradient(135deg,var(--color-surface),var(--color-surface-subtle)); }
.start-here-card h2 { font-size: var(--type-scale-h1); }
.start-here-card__path { display: grid; gap: var(--space-3); padding: var(--space-5); border-radius: var(--radius-card); background: var(--color-surface); }
.education-bridge { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: var(--space-7); padding: var(--space-7); border: 1px solid var(--color-border); border-radius: var(--radius-panel); background: var(--color-surface-subtle); }
.education-bridge h2 { margin-top: 0; }
@media (max-width: 760px) { .article-toc ol { columns: 1; } .article-product-bridge,.education-bridge,.start-here-card { grid-template-columns: 1fr; } .article-product-bridge { width: calc(100vw - 32px); padding: var(--space-6); } }
