:root { color-scheme: dark; --bg:#051019; --panel:#0b202c; --text:#f5fbff; --muted:#9cb0bf; --accent:#2ad3bd; --line:rgba(255,255,255,.1); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--text); background:radial-gradient(circle at 80% 0%,rgba(42,211,189,.12),transparent 35%),var(--bg); font:16px/1.75 Inter,ui-sans-serif,system-ui,sans-serif; }
a { color:var(--accent); }
.article-header { min-height:70px; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:12px max(20px,calc((100vw - 1040px)/2)); border-bottom:1px solid var(--line); background:rgba(5,16,25,.88); backdrop-filter:blur(18px); }
.article-brand { color:var(--text); text-decoration:none; font-size:.85rem; font-weight:850; letter-spacing:.08em; }
.article-brand span { color:var(--accent); }
.article-header nav { display:flex; gap:18px; font-size:.78rem; }
.article-shell { width:min(100% - 36px,1040px); margin:auto; }
.article-hero { max-width:900px; padding:100px 0 62px; }
.eyebrow { color:var(--accent); font-size:.68rem; font-weight:900; letter-spacing:.16em; }
h1 { margin:17px 0 25px; font-size:clamp(3rem,7vw,6.5rem); line-height:.96; letter-spacing:-.065em; }
.article-lead { max-width:820px; color:#b7c8d3; font-size:1.18rem; }
.article-meta { display:flex; flex-wrap:wrap; gap:10px; margin-top:28px; color:#78909f; font-size:.72rem; }
.article-layout { display:grid; grid-template-columns:minmax(0,1fr) 250px; gap:70px; align-items:start; padding-bottom:100px; }
.article-body { min-width:0; }
.article-body h2 { margin:64px 0 18px; font-size:clamp(2rem,4vw,3.35rem); line-height:1.05; letter-spacing:-.045em; }
.article-body h3 { margin:38px 0 12px; font-size:1.3rem; }
.article-body p,.article-body li { color:#b2c3ce; }
.article-body strong { color:var(--text); }
.article-body blockquote { margin:35px 0; padding:23px 27px; border-left:3px solid var(--accent); border-radius:0 18px 18px 0; color:#d9f6f1; background:rgba(42,211,189,.07); }
.article-body li { margin:8px 0; }
.source-card { margin:24px 0; padding:20px; border:1px solid var(--line); border-radius:17px; background:rgba(11,32,44,.72); }
.source-card span { display:block; color:var(--accent); font-size:.62rem; font-weight:900; letter-spacing:.11em; }
.source-card p { margin:7px 0; font-size:.88rem; }
.article-aside { position:sticky; top:94px; display:grid; gap:10px; padding:20px; border:1px solid var(--line); border-radius:20px; background:rgba(11,32,44,.82); }
.article-aside strong { margin-bottom:5px; }
.article-aside a { font-size:.78rem; text-decoration:none; }
.article-cta { margin-top:70px; padding:34px; border:1px solid rgba(42,211,189,.35); border-radius:25px; background:linear-gradient(145deg,rgba(20,66,65,.8),rgba(8,28,38,.9)); }
.article-cta h2 { margin:0 0 12px; }
.article-button { display:inline-flex; min-height:52px; align-items:center; justify-content:center; margin-top:15px; padding:0 20px; border-radius:14px; color:#031411; background:var(--accent); font-weight:850; text-decoration:none; }
.article-footer { padding:44px max(20px,calc((100vw - 1040px)/2)); border-top:1px solid var(--line); color:#78909f; font-size:.72rem; }
@media(max-width:800px){.article-layout{grid-template-columns:1fr}.article-aside{position:static;order:-1}.article-header nav a:first-child{display:none}.article-hero{padding-top:70px}h1{font-size:clamp(3rem,15vw,5rem)}}
