/* Interior edition: a magazine opening, navigable reading rail and evidence cards. */
.breadcrumb { display:flex; align-items:center; gap:10px; padding:12px 0; letter-spacing:.04em; }
.article-page .article-opening { display:grid; grid-template-columns:minmax(0,1.08fr) minmax(0,1fr); gap:0; margin:6px 0 48px; padding:0; border:1px solid var(--rule); border-radius:24px; overflow:hidden; background:var(--surface); align-items:stretch; }
.article-page .article-heading { position:relative; isolation:isolate; overflow:hidden; text-align:left; margin:0; max-width:none; padding:48px 42px; background:#101d24; color:#f5f8f6; display:flex; flex-direction:column; justify-content:center; }
.article-page .article-heading:before { content:''; position:absolute; inset:0; z-index:-1; background:radial-gradient(ellipse at 0 0,color-mix(in srgb,var(--accent) 43%,transparent),transparent 75%); }
.article-page .article-heading:after { content:''; position:absolute; width:260px; height:260px; border:1px solid #ffffff0c; border-radius:50%; right:-120px; bottom:-100px; box-shadow:0 0 0 35px #ffffff03,0 0 0 70px #ffffff03; pointer-events:none; z-index:-1; }
.article-page .article-heading>.eyebrow { color:#c4d6d9; font-size:9px; letter-spacing:.12em; }
.article-page .article-heading>.eyebrow:before { background:var(--accent); height:6px; width:6px; border-radius:50%; box-shadow:0 0 12px var(--accent); }
.article-page .article-heading h1 { margin:25px 0 23px; max-width:23ch; font-size:clamp(34px,3.5vw,53px); line-height:1.08; letter-spacing:-.045em; font-weight:500; }
.article-page .article-heading .deck { color:#c3d0d4; font-size:15px; line-height:1.8; margin:0; }
.article-page .article-heading .byline { margin:26px 0 0; padding-top:22px; width:100%; border-color:#ffffff24; justify-content:flex-start; }
.article-page .article-heading .avatar { color:#e5efed; background:#ffffff0b; border-color:#ffffff25; }
.article-page .article-heading .byline small { color:#b9c9cf; }
.article-page .article-media { margin:0; width:100%; max-width:none; display:flex; flex-direction:column; align-items:stretch; justify-content:center; background:var(--tint); padding:24px; }
.article-page .article-media-frame { width:100%; margin:auto; padding:0; border:0; border-radius:12px; background:transparent; }
.article-page .article-media-frame img { width:100%; height:auto; max-height:500px; object-fit:contain; background:transparent; }
.article-page .article-media figcaption { text-align:left; font-size:9px; line-height:1.75; padding-top:16px; border-top:1px solid var(--rule); margin:20px 0 0; }
.article-facts { display:flex; flex-wrap:wrap; gap:8px; margin-top:24px; }
.article-facts a,.article-facts span { display:inline-flex; gap:7px; align-items:center; padding:7px 10px; border:1px solid #ffffff26; border-radius:30px; color:#d4e3e7; font-size:9px; letter-spacing:.03em; }
.article-facts a:hover { background:#ffffff10; text-decoration:none; }
.article-page .article-layout { display:grid; grid-template-columns:230px minmax(0,770px); gap:64px; justify-content:center; align-items:start; margin-bottom:70px; }
.article-page .reading-guide { position:sticky; top:28px; padding:25px 20px; border:1px solid var(--rule); border-radius:16px; background:var(--surface); counter-reset:chapter; }
.article-page .reading-guide>.eyebrow { margin-bottom:20px; padding-bottom:16px; border-bottom:1px solid var(--rule); font-size:9px; }
.article-page .reading-guide>a { display:grid; grid-template-columns:20px 1fr; gap:9px; font-size:11px; line-height:1.6; border:0; padding:10px 0; margin:0; color:var(--muted); transition:color .2s; }
.article-page .reading-guide>a:before { counter-increment:chapter; content:counter(chapter,decimal-leading-zero); font-size:9px; padding-top:2px; color:var(--accent); opacity:.65; font-variant-numeric:tabular-nums; }
.article-page .reading-guide>a.is-reading { color:var(--ink); font-weight:600; }
.article-page .reading-guide>a.is-reading:before { opacity:1; }
.article-page .article-body { max-width:770px; min-width:0; font-size:18px; line-height:1.9; }
.article-page .article-body>p:first-child { font-size:22px; line-height:1.7; color:var(--ink); margin-top:0; }
.article-page .article-body>p:first-child:first-letter { float:left; font-family:var(--serif); font-size:70px; line-height:.84; padding:9px 10px 0 0; color:var(--accent); }
.article-page .article-body h2 { font-family:var(--sans); font-size:31px; line-height:1.2; letter-spacing:-.035em; margin:44px 0 22px; padding-top:24px; border-top:1px solid var(--rule); }
.article-page .article-body a { text-decoration-color:color-mix(in srgb,var(--accent) 45%,transparent); text-underline-offset:4px; }
.article-page .takeaway { position:relative; overflow:hidden; margin:42px 0; padding:34px 36px; border:1px solid color-mix(in srgb,var(--accent) 25%,var(--rule)); border-left:4px solid var(--accent); border-radius:0 18px 18px 0; background:color-mix(in srgb,var(--accent) 7%,var(--surface)); }
.article-page .takeaway:before { content:'“'; position:absolute; right:20px; top:5px; color:var(--accent); opacity:.12; font:120px Georgia,serif; line-height:1; pointer-events:none; }
.article-page .takeaway p { position:relative; font-family:var(--serif); font-size:27px; line-height:1.45; margin:16px 0 0; letter-spacing:-.025em; }
.article-page .sources { border:0; background:transparent; padding:0; margin-top:50px; }
.article-page .sources>p { font-family:var(--sans); font-size:12px; line-height:1.8; color:var(--muted); }
.article-page .sources ol { list-style:none; padding:0; display:grid; gap:10px; counter-reset:source; }
.article-page .sources li { counter-increment:source; margin:0; }
.article-page .sources li a { display:flex; gap:16px; align-items:baseline; padding:18px 20px; background:var(--surface); border:1px solid var(--rule); border-radius:12px; text-decoration:none; font:12px/1.65 var(--sans); overflow-wrap:anywhere; transition:border-color .2s,background .2s; }
.article-page .sources li a:before { content:counter(source,decimal-leading-zero); color:var(--accent); font-size:10px; flex-shrink:0; }
.article-page .sources li a:hover { background:var(--tint); border-color:var(--accent); }
.article-page .share-tools { display:flex; flex-wrap:wrap; gap:10px; padding-top:24px; margin-top:30px; border-top:1px solid var(--rule); }
.article-page .share-tools button { border-radius:30px; min-height:44px; padding:11px 18px; }
.related-grid>.story { padding:20px; background:var(--surface); border:1px solid var(--rule); border-radius:18px; }
.related-grid>.story img { height:240px; object-fit:contain; }
.section-lead { position:relative; overflow:hidden; display:grid; grid-template-columns:1fr 1fr; gap:40px; padding:44px; margin:8px 0 44px; border:1px solid var(--rule); border-radius:24px; background:var(--surface); }
.section-lead:before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse at left top,color-mix(in srgb,var(--accent) 10%,transparent),transparent 65%); pointer-events:none; }
.section-lead>div,.section-lead>a { position:relative; }
.section-lead h1 { font-family:var(--sans); font-size:clamp(44px,5.2vw,74px); line-height:1.02; font-weight:500; letter-spacing:-.06em; }
.section-lead .deck { font-size:16px; }
.section-photo { overflow:hidden; border-radius:14px; display:flex; align-items:center; background:var(--tint); }
.section-photo img { object-fit:contain; height:340px; width:100%; transition:transform .8s var(--motion-ease); }
.section-photo:hover img { transform:scale(1.02); }
.article-list { max-width:none; display:grid; grid-template-columns:1fr 1fr; gap:20px; padding-top:18px; }
.article-list>.story-row { display:flex; flex-direction:column; padding:22px; gap:0; border:1px solid var(--rule); border-radius:18px; background:var(--surface); }
.article-list .story-photo { width:100%; background:var(--tint); }
.article-list .story-photo img { height:245px; object-fit:contain; }
.article-list .story-copy { padding-top:20px; }
.article-list .story h3 { font-size:25px; line-height:1.2; }
.article-list .story p { font-size:13px; line-height:1.8; }
.article-list .story .meta { padding-top:17px; border-top:1px solid var(--rule); }
.page-head { position:relative; isolation:isolate; overflow:hidden; margin:28px 0 40px; padding:48px; border-radius:22px; background:#101d24; color:#f5f8f6; }
.page-head:before { content:''; position:absolute; inset:0; z-index:-1; background:radial-gradient(ellipse at right top,color-mix(in srgb,var(--accent) 40%,transparent),transparent 70%); }
.page-head .eyebrow { color:#c1d3d7; }
.page-head h1 { font-family:var(--sans); font-size:clamp(40px,5vw,68px); line-height:1.05; font-weight:500; margin:22px 0; max-width:24ch; }
.page-head .deck { color:#c1d0d5; font-size:16px; max-width:65ch; }
.filter-bar { padding:18px 22px; border:1px solid var(--rule); border-radius:14px; background:var(--surface); }
.filter-bar select { padding:10px 14px; border-radius:25px; }
.prose { padding:0 30px 45px; }
.prose h2 { padding-top:30px; border-top:1px solid var(--rule); }
.empty-state { border:1px solid var(--rule); border-radius:18px; padding:40px; background:var(--surface); }
@media(max-width:1050px) {
 .article-page .article-opening { grid-template-columns:1fr; }
 .article-page .article-heading { padding:40px; }
 .article-page .article-heading h1 { max-width:28ch; font-size:47px; }
 .article-page .article-media { padding:26px; }
 .article-page .article-media-frame img { max-height:430px; }
 .article-page .article-layout { grid-template-columns:1fr; gap:28px; }
 .article-page .reading-guide { position:static; display:flex; flex-wrap:wrap; gap:3px 20px; padding:20px 24px; }
 .article-page .reading-guide>.eyebrow { width:100%; margin-bottom:6px; }
 .article-page .reading-guide>a { display:flex; font-size:10px; }
 .article-page .article-body { max-width:770px; margin:auto; }
}
@media(max-width:700px) {
 .article-page .article-opening { border-radius:18px; margin-bottom:26px; }
 .article-page .article-heading { padding:30px 24px; }
 .article-page .article-heading h1 { font-size:34px; line-height:1.1; margin:22px 0; max-width:24ch; }
 .article-page .article-heading .deck { font-size:14px; }
 .article-page .article-heading .byline { margin-top:23px; padding-top:18px; }
 .article-page .article-media { padding:18px; }
 .article-page .article-media-frame img { max-height:340px; }
 .article-page .article-media figcaption { font-size:9px; }
 .article-page .article-body { font-size:17px; line-height:1.85; }
 .article-page .article-body>p:first-child { font-size:20px; }
 .article-page .article-body>p:first-child:first-letter { font-size:57px; }
 .article-page .article-body h2 { font-size:27px; margin-top:32px; }
 .article-page .reading-guide { padding:18px; gap:2px 14px; }
 .article-page .takeaway { padding:26px 24px; margin:32px 0; }
 .article-page .takeaway p { font-size:24px; }
 .article-list { grid-template-columns:1fr; gap:16px; }
 .article-list>.story-row { padding:17px; }
 .article-list .story-photo img { height:210px; }
 .article-list .story h3 { font-size:25px; }
 .section-lead { grid-template-columns:1fr; gap:24px; padding:26px; border-radius:18px; }
 .section-lead h1 { font-size:44px; margin:19px 0; }
 .section-lead .deck { font-size:14px; }
 .section-photo img { height:220px; }
 .page-head { padding:30px 25px; margin:20px 0 28px; border-radius:18px; }
 .page-head h1 { font-size:42px; }
 .page-head .deck { font-size:14px; }
 .filter-bar { padding:16px; flex-wrap:wrap; }
 .prose { padding:0 0 30px; }
 .related-grid>.story { padding:17px; }
}
@media(prefers-reduced-motion:reduce) { .section-photo:hover img { transform:none; } }
@media print {
 .article-page .article-opening { display:block; border:0; }
 .article-page .article-heading { background:white; color:black; padding:0; }
 .article-page .article-heading:before,.article-page .article-heading:after,.article-facts { display:none; }
 .article-page .article-heading .deck,.article-page .article-heading .byline small { color:black; }
 .article-page .article-layout { display:block; }
 .article-page .reading-guide { display:none; }
}

/* Stronger article type and source-image corners, informed by Frontier AI Analysis. */
.article-page .article-heading h1 { font-family:var(--sans); font-weight:650; letter-spacing:-.05em; }
.article-page .article-media-frame { position:relative; padding:14px; border:1px solid var(--rule); background:var(--surface); }
.article-page .article-media-frame:before,.article-page .article-media-frame:after { content:''; position:absolute; width:22px; height:22px; pointer-events:none; border-color:var(--accent); border-style:solid; opacity:.7; }
.article-page .article-media-frame:before { top:7px; left:7px; border-width:2px 0 0 2px; }
.article-page .article-media-frame:after { bottom:7px; right:7px; border-width:0 2px 2px 0; }
@media(max-width:700px) { .article-page .article-heading h1 { font-size:33px; } .article-page .article-media-frame { padding:10px; } }
