/* Article presentation; imported content, anchors and tools keep their contracts. */
.blog-reading { --article-paper:#f5f2ec; --article-ink:#09294d; --article-muted:#526378; --article-line:#cfd3d4; --article-accent:#bd0050; }
.blog-reading main { background:var(--article-paper); }
.blog-reading > .journey-crumbs { display:none; } /* The article retains its own breadcrumb. */
.article-masthead { display:flex; justify-content:space-between; align-items:center; gap:1rem; padding-top:1.3rem; padding-bottom:1rem; border-bottom:2px solid var(--article-ink); }
.article-masthead > a { font-family:Georgia,"Times New Roman",serif; font-size:1.8rem; line-height:1.3; letter-spacing:-.04em; color:var(--article-ink); text-decoration:none; min-height:44px; }
.article-masthead em { color:var(--article-accent); }
.article-masthead > span { color:var(--article-muted); font-size:.8rem; }
.blog-reading #main .article-opening .page-hero { background:transparent; border:0; padding:1.25rem 0 0; box-shadow:none; }
.blog-reading #main .article-opening .page-hero .wrap { padding-top:0; padding-bottom:0; }
body.blog-reading .article-opening .page-hero::before,
body.blog-reading .article-opening .page-hero::after { display:none; }
body.blog-reading .article-opening .page-hero h1 { max-width:1000px; color:var(--article-ink); font-family:Georgia,"Times New Roman",serif; font-size:clamp(2.3rem,4.6vw,4.25rem); font-weight:400; line-height:1.08; letter-spacing:-.045em; margin:1rem 0 1.25rem; text-wrap:balance; overflow-wrap:anywhere; }
body.blog-reading .article-opening .page-hero .lead { max-width:780px; margin:0; font-size:clamp(1.05rem,1.6vw,1.2rem); line-height:1.65; color:var(--article-muted); }
body.blog-reading .article-opening .breadcrumbs { font-size:.7rem; text-transform:none; letter-spacing:0; font-weight:600; margin-bottom:1.5rem; }
.blog-reading .article-meta { font-size:.8rem; font-weight:600; gap:.4rem 1.25rem; color:var(--article-muted); }
.article-reading-note { display:flex; align-items:center; flex-wrap:wrap; gap:.25rem 1.5rem; padding-top:.75rem; padding-bottom:1.5rem; font-size:.8rem; color:var(--article-muted); }
.article-reading-note a { display:inline-flex; align-items:center; gap:1rem; min-height:44px; color:var(--article-ink); text-underline-offset:.3em; }
.article-reading-note > span { margin-right:auto; }
.blog-reading .article-cover .blog-hero-image { margin:0; max-height:none; background:transparent; box-shadow:none; border:0; border-radius:0; }
.blog-reading .article-cover .blog-hero-image img { display:block; width:100%; height:auto; max-height:640px; object-fit:contain; aspect-ratio:auto; }
.blog-reading .article-reading-section { padding:3.5rem 0; background:#fff; margin-top:2rem; }
.blog-reading .article-reading-grid { display:grid; grid-template-columns:minmax(0,740px) minmax(0,250px); justify-content:space-between; align-items:start; gap:3.5rem; }
.blog-reading .article-reading-grid--solo { grid-template-columns:minmax(0,740px); justify-content:center; }
body.blog-reading .article-reading-grid > .blog-article { max-width:none; width:100%; color:#253c53; font-size:1.1rem; line-height:1.85; }
.blog-reading #article-body,
.blog-reading #article-sharing,
.blog-reading .blog-article :is(h2,h3)[id] { scroll-margin-top:130px; }
.blog-reading .blog-article > p { margin:0 0 1.35em; }
.blog-reading .blog-article > p:first-of-type { font-size:1.24rem; color:var(--article-ink); line-height:1.65; }
body.blog-reading .blog-article > h2 { font-family:Georgia,"Times New Roman",serif; font-size:clamp(1.8rem,2.5vw,2.4rem); font-weight:400; line-height:1.18; letter-spacing:-.03em; margin:2.3rem 0 1rem; padding-top:1rem; border-top:1px solid var(--article-line); color:var(--article-ink); }
.blog-reading .blog-article > h3 { color:var(--article-ink); font-size:1.25rem; line-height:1.4; }
.blog-reading .blog-article blockquote { background:var(--article-paper); border-left:3px solid var(--article-accent); border-radius:0; margin:2rem 0; padding:1.5rem 1.75rem; font-family:Georgia,"Times New Roman",serif; font-size:1.6rem; line-height:1.4; font-weight:400; }
.blog-reading .blog-article :is(img,video) { max-width:100%; height:auto; }
.blog-reading .blog-article table { display:block; max-width:100%; overflow-x:auto; }
.blog-reading .blog-article #quick-answer { background:var(--article-paper); border:0; border-left:3px solid var(--article-accent); border-radius:0; padding:1.25rem 1.5rem; margin-bottom:2rem; }
body.blog-reading .article-reading-grid > .toc { position:sticky; top:125px; max-height:calc(100svh - 150px); overflow:auto; border:0; border-top:2px solid var(--article-ink); border-radius:0; background:none; padding:1rem 0; box-shadow:none; }
body.blog-reading .article-reading-grid > .toc h2 { background:none; border:0; padding:0; margin:0 0 .75rem; color:var(--article-accent); font-size:.72rem; letter-spacing:.09em; }
body.blog-reading .article-reading-grid > .toc > a { border-bottom:1px solid var(--article-line); border-left:2px solid transparent; padding:.75rem .5rem; font-size:.84rem; line-height:1.5; font-weight:500; color:var(--article-muted); transition:color 160ms ease,border-color 160ms ease; }
body.blog-reading .article-reading-grid > .toc > a:hover { color:var(--article-accent); border-left-color:var(--article-accent); }
.blog-reading .toc > .stories-promo { display:none; } /* The community invitation remains below the article. */
.blog-reading #article-sharing { margin-top:3rem; }
.blog-reading #article-sharing .share-panel { background:var(--article-paper); padding:1.5rem; border:0; border-top:3px solid var(--article-ink); border-radius:0; margin:0; }
.blog-reading #article-sharing .share-panel h2 { font-family:Georgia,"Times New Roman",serif; font-weight:400; font-size:1.45rem; line-height:1.25; }
.blog-reading #article-sharing .share-panel > div > p:not(.share-kicker) { display:none; }
.blog-reading #article-sharing .share-kicker { color:var(--article-accent); font-size:.75rem; }
.blog-reading #article-sharing .share-button { border:1px solid var(--article-ink); border-radius:0; color:var(--article-ink); background:#fff; font-size:.8rem; transition:background 160ms ease,color 160ms ease; }
.blog-reading #article-sharing .share-button:hover { color:#fff; background:var(--article-ink); }
.article-next { display:flex; justify-content:space-between; align-items:center; gap:2rem; padding-top:3rem; padding-bottom:3rem; }
.article-next p { color:var(--article-accent); font-size:.8rem; font-weight:700; }
.article-next h2 { font-family:Georgia,"Times New Roman",serif; font-size:clamp(1.8rem,3vw,2.6rem); font-weight:400; line-height:1.15; letter-spacing:-.03em; color:var(--article-ink); }
.article-next > div:last-child { display:grid; }
.article-next a { display:flex; gap:2rem; justify-content:space-between; align-items:center; min-height:48px; padding:.7rem 0; border-bottom:1px solid var(--article-line); font-size:.9rem; color:var(--article-ink); text-decoration:none; }
.article-next a span { transition:transform 160ms ease; }
.article-next a:hover span { transform:translateX(4px); }
.blog-reading main :is(a,button):focus-visible { outline:3px solid #e9b600; outline-offset:4px; }
@media (max-width:900px) {
 body.blog-reading .article-reading-grid { grid-template-columns:minmax(0,1fr); gap:2rem; }
 body.blog-reading .article-reading-grid > .toc { position:static; max-height:none; grid-row:1; }
 .blog-reading .article-reading-section { padding-top:2rem; }
}
@media (max-width:600px) {
 .article-masthead > span { display:none; }
 .article-masthead { padding-top:1rem; padding-bottom:.6rem; }
 .article-next { flex-direction:column; align-items:stretch; }
 .article-next h2 { margin-bottom:0; }
 body.blog-reading .article-opening .page-hero { padding-top:1.25rem; }
 .blog-reading .article-meta { gap:.3rem .8rem; }
 .blog-reading .article-reading-section { margin-top:1rem; }
 .blog-reading .blog-article blockquote { padding:1rem; }
}
@media (prefers-reduced-motion:reduce) {
 .blog-reading main * { transition:none !important; }
}
@media print {
 .article-reading-note, .article-reading-grid > .toc, #article-sharing, .article-next { display:none !important; }
 .article-reading-grid { display:block; }
 .blog-reading .article-reading-section { padding:0; }
}