.article-hero { padding: 78px 0 56px; border-bottom: 1px solid var(--line); background: radial-gradient(circle at 75% 20%,rgba(255,90,47,.12),transparent 30%),linear-gradient(145deg,#0c0f1a,#080a12); }
.breadcrumbs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 28px; color: #737c91; font-size: .74rem; }
.breadcrumbs a:hover { color: var(--orange-2); }
.article-hero h1 { max-width: 900px; margin: 15px 0 22px; font-size: clamp(2.5rem,6vw,4.8rem); line-height: 1.02; }
.article-deck { max-width: 760px; color: var(--muted); font-size: 1.05rem; }
.article-meta { display: flex; flex-wrap: wrap; gap: 18px; margin-top: 26px; color: #7d859a; font-size: .75rem; }
.article-layout { display: grid; grid-template-columns: minmax(0,760px) 280px; gap: 70px; align-items: start; padding-block: 68px 100px; }
.article-body { font-size: 1rem; color: #d4d8e3; }
.article-body > p:first-child { font-size: 1.14rem; color: #eef0f6; }
.article-body h2 { margin: 48px 0 16px; color: #fff; font-size: 1.75rem; line-height: 1.18; letter-spacing: -.035em; }
.article-body h3 { margin: 32px 0 12px; color: #fff; font-size: 1.15rem; }
.article-body p { margin-bottom: 19px; }
.article-body ul,.article-body ol { margin: 0 0 24px; padding-left: 22px; }
.article-body li { margin-bottom: 9px; }
.article-body a { color: #ff9661; font-weight: 750; text-decoration: underline; text-decoration-color: rgba(255,150,97,.38); text-underline-offset: 3px; }
.article-body strong { color: #fff; }
.article-callout { margin: 28px 0; padding: 22px 24px; border: 1px solid rgba(255,90,47,.22); border-left: 3px solid var(--orange); border-radius: 12px; background: rgba(255,90,47,.055); }
.article-callout b { display: block; margin-bottom: 5px; color: #ffb087; }
.article-table { width: 100%; margin: 25px 0; border-collapse: collapse; font-size: .84rem; }
.article-table th,.article-table td { padding: 13px 14px; border: 1px solid var(--line); text-align: left; }
.article-table th { color: #fff; background: var(--panel-2); }
.article-table td { color: #b9c0d1; }
.article-sidebar { position: sticky; top: 100px; display: grid; gap: 16px; }
.side-box { padding: 22px; border: 1px solid var(--line); border-radius: 17px; background: var(--panel); }
.side-box h2 { margin: 0 0 14px; font-size: .92rem; }
.side-box p,.side-box li { color: var(--muted); font-size: .73rem; }
.side-box ul { margin: 0; padding-left: 17px; }
.side-box li { margin-bottom: 7px; }
.related-link { display: block; margin-top: 12px; color: var(--orange-2); font-size: .75rem; font-weight: 750; }
@media (max-width:900px) { .article-layout { grid-template-columns: 1fr; gap: 38px; } .article-sidebar { position: static; grid-template-columns: repeat(2,1fr); } }
@media (max-width:680px) { .article-hero { padding: 55px 0 42px; } .article-layout { padding-block: 45px 72px; } .article-sidebar { grid-template-columns: 1fr; } .article-body { font-size: .94rem; } .article-table { display: block; overflow-x: auto; } }