:root{--article-width:1220px}
.article-shell{background:#faf7f3;color:#241e2b;padding:clamp(110px,12vw,170px) clamp(18px,5vw,68px) clamp(80px,10vw,140px)}
.article-shell article{max-width:var(--article-width);margin-inline:auto}
.article-header{display:grid;gap:clamp(18px,2.5vw,30px)}
.article-kicker{width:max-content;color:#7b5ea1;font-size:13px;font-weight:900;letter-spacing:.08em;text-decoration:none;text-transform:uppercase}
.article-header h1{margin:0;max-width:1050px;font-size:clamp(28px,3.5vw,52px);line-height:1.16;letter-spacing:-.035em;text-wrap:balance}
html[dir=rtl] .article-header h1{line-height:1.28;letter-spacing:-.025em}
.article-deck{margin:0;max-width:850px;color:#5c5468;font-size:clamp(18px,1.7vw,24px);line-height:1.8;text-wrap:pretty}
.article-meta{display:flex;flex-wrap:wrap;gap:10px 22px;color:#71697c;font-size:14px;font-weight:700}
.article-cover{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:32px;outline:1px solid rgba(0,0,0,.1);box-shadow:0 30px 90px rgba(36,30,43,.13)}
.article-layout{display:grid;grid-template-columns:minmax(190px,260px) minmax(0,760px);justify-content:space-between;gap:clamp(38px,6vw,92px);margin-top:clamp(58px,8vw,104px)}
.article-toc{position:sticky;top:100px;align-self:start;display:grid;gap:14px;padding-inline-end:22px;border-inline-end:1px solid rgba(36,30,43,.1)}
.article-toc strong{color:#7b5ea1;font-size:13px}.article-toc a{color:#71697c;text-decoration:none;line-height:1.5;font-size:14px}.article-toc a:hover{color:#241e2b}
.article-content{min-width:0}.article-content section{scroll-margin-top:100px;margin-top:clamp(52px,7vw,84px)}.article-content section:first-of-type{margin-top:0}
.article-content h2{margin:0 0 22px;font-size:clamp(24px,2.2vw,32px);line-height:1.32;letter-spacing:-.025em;text-wrap:balance}.article-content p,.article-content li{color:#4f4859;font-size:clamp(17px,1.35vw,19px);line-height:2;text-wrap:pretty}.article-content p{margin:0 0 22px}.article-content ul{display:grid;gap:12px;padding-inline-start:24px;margin:20px 0 30px}
.answer-box{border-radius:26px;background:#17131d;color:#fff;padding:clamp(24px,4vw,42px);box-shadow:0 24px 70px rgba(36,30,43,.16)}.answer-box strong{color:#bfa8ef}.answer-box ul{margin:18px 0 0}.answer-box li{color:rgba(255,255,255,.78)}.article-content .answer-box + section{margin-top:clamp(72px,9vw,118px)}
.article-faq details{border-top:1px solid rgba(36,30,43,.12);padding:20px 0}.article-faq summary{cursor:pointer;font-size:19px;font-weight:900}.article-faq details p{margin:14px 0 0}
.article-cta{margin-top:clamp(64px,8vw,100px);border-radius:32px;background:radial-gradient(circle at 80% 0,rgba(143,111,201,.34),transparent 54%),#131017;color:#fff;padding:clamp(30px,5vw,58px)}.article-cta h2{color:#fff}.article-cta p{color:rgba(255,255,255,.7)}
.published-card{text-decoration:none;color:inherit;transition-property:transform,box-shadow;transition-duration:.28s;transition-timing-function:cubic-bezier(.22,1,.36,1)}.published-card:hover{transform:translateY(-6px);box-shadow:0 24px 70px rgba(36,30,43,.12)}.published-cover{overflow:hidden;padding:0!important}.published-cover img{width:100%;height:100%;object-fit:cover;outline:1px solid rgba(0,0,0,.1)}.published-card__body{align-self:center}.published-card__link{display:inline-flex;gap:8px;margin-top:20px;color:#7b5ea1;font-weight:900}.article-card.published-card{display:block}.article-card.published-card .published-cover{margin:-1px -1px 22px;min-height:190px;border-radius:22px 22px 0 0}.article-card.published-card .published-card__body{padding:0 2px}
@media(max-width:820px){.article-layout{grid-template-columns:1fr}.article-toc{position:static;border:0;border-bottom:1px solid rgba(36,30,43,.1);padding:0 0 26px}.article-header h1{font-size:clamp(24px,6vw,34px)}.article-cover{border-radius:22px}}
@media(prefers-reduced-motion:reduce){.published-card{transition:none}.published-card:hover{transform:none}}