/* Статьи: спокойная типографика и цвета основного сайта. */
:root{color-scheme:dark;--bg:#302a49;--paper:#f4eefd;--muted:#c8bdd8;--gold:#e6c989;--line:rgba(233,218,199,.2)}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:#302a49;color:var(--paper);font-family:Inter,system-ui,sans-serif;font-size:16px;line-height:1.7;-webkit-font-smoothing:antialiased}
a{color:inherit;text-underline-offset:.22em}
a:hover{color:var(--gold)}
:focus-visible{outline:2px solid var(--gold);outline-offset:4px}
body>header,body>footer,main{width:min(100% - 48px,1160px);margin-inline:auto}
body>header{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:86px;border-bottom:1px solid var(--line)}
body>header a{text-decoration:none}
.brand{font-family:'Cormorant Garamond',Georgia,serif;font-size:1.8rem;font-weight:600;line-height:1.1}
body>header nav{font-size:.87rem;color:var(--muted)}
main{min-height:65vh;padding:34px 0 96px}
body>footer{padding:28px 0 42px;border-top:1px solid var(--line);font-size:.86rem;color:var(--muted)}
h1,h2,h3,h4{font-family:'Cormorant Garamond',Georgia,serif;font-weight:600;line-height:1.12;overflow-wrap:anywhere}
.eyebrow,.article-kicker{font-family:Inter,system-ui,sans-serif;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
main>h1{max-width:850px;font-size:clamp(3rem,7vw,6rem);line-height:.98;letter-spacing:-.025em;margin:.2em 0}
.intro{max-width:660px;font-size:1.1rem;color:var(--muted)}
.cards{list-style:none;margin:64px 0 0;padding:0;max-width:920px}
.cards li{border-top:1px solid var(--line);padding:25px 0 30px}
.cards h2{font-size:clamp(1.8rem,3vw,2.5rem);margin:6px 0}
.cards h2 a{text-decoration:none}
.cards p{margin:0;color:var(--muted);max-width:700px}
time{font-size:.8rem;color:var(--muted)}
.article-breadcrumbs{font-size:.8rem;color:var(--muted);margin:0 0 clamp(32px,5vw,64px)}
.article-breadcrumbs a{text-decoration:none}
.article-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(220px,330px);align-items:center;gap:clamp(40px,8vw,110px);padding:0 0 clamp(48px,6vw,78px);border-bottom:1px solid var(--line)}
.article-hero--no-cover{display:block}
.article-hero-copy{max-width:760px;min-width:0}
.article-kicker{display:block;margin:0 0 20px}
.article-title{font-size:clamp(2.8rem,5.8vw,5.6rem);letter-spacing:-.025em;margin:0 0 22px}
.article-intro{max-width:630px;margin:0 0 25px;color:#e0d7eb;font-size:clamp(1.08rem,1.7vw,1.25rem);line-height:1.65}
.article-meta{display:block}
.article-cover{margin:0;max-width:330px;width:100%;justify-self:end}
.article-cover img{display:block;width:100%;height:auto;max-height:440px;object-fit:contain;object-position:center;border-radius:4px}
.article-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(190px,240px);gap:clamp(40px,7vw,100px);align-items:start;padding-top:56px}
.article-content{grid-column:1;grid-row:1;min-width:0;max-width:740px;font-size:1.05rem;line-height:1.85;overflow-wrap:anywhere}
.article-content>:first-child{margin-top:0}
.article-content h2{font-size:clamp(2rem,3.4vw,2.9rem);margin:1.65em 0 .45em;scroll-margin-top:24px}
.article-content h3{font-size:1.8rem;margin:1.5em 0 .4em}
.article-content p,.article-content ul,.article-content ol{margin:0 0 1.3em}
.article-content li+li{margin-top:.35em}
.article-content a{color:var(--gold)}
.article-content img{display:block;max-width:100%;height:auto;margin:2rem auto;border-radius:4px}
.article-content blockquote{margin:2em 0;padding:.2em 0 .2em 24px;border-left:2px solid var(--gold);color:#ddd2e9;font-family:'Cormorant Garamond',Georgia,serif;font-size:1.5rem;line-height:1.45}
.article-content pre{overflow-x:auto;padding:1em;background:#26203a}
.article-content table{display:block;max-width:100%;overflow-x:auto;border-collapse:collapse}
.article-content th,.article-content td{min-width:8rem;padding:.6em .8em;border:1px solid var(--line);text-align:left;overflow-wrap:normal;word-break:normal}
.article-toc{grid-column:2;grid-row:1;position:sticky;top:28px;border-top:1px solid var(--gold);padding-top:18px;min-width:0}
.article-toc-title{font-size:.72rem;letter-spacing:.13em;text-transform:uppercase;color:var(--gold);margin:0 0 15px}
.article-toc-list{list-style:none;padding:0;margin:0;font-size:.86rem;line-height:1.45}
.article-toc-list li+li{margin-top:12px}
.article-toc-list a{color:var(--muted);text-decoration:none;overflow-wrap:anywhere}
.article-toc-list a:hover{color:var(--gold)}
.cta{display:inline-block;margin-top:30px;padding:13px 22px;border:1px solid var(--gold);border-radius:100px;color:var(--gold);font-size:.9rem;text-decoration:none}
.cta:hover{background:var(--gold);color:#302a49}
@media(max-width:760px){
  body>header,body>footer,main{width:calc(100% - 36px)}
  body>header{min-height:72px;gap:12px}
  .brand{font-size:1.45rem}
  body>header nav{font-size:.75rem;text-align:right}
  main{padding:26px 0 70px}
  .article-breadcrumbs{margin-bottom:34px}
  .article-hero{grid-template-columns:minmax(0,1fr);gap:28px;padding-bottom:38px}
  .article-title{font-size:clamp(2.65rem,11vw,4rem)}
  .article-cover{justify-self:start;max-width:260px}
  .article-cover img{max-height:340px;object-position:left}
  .article-layout{display:flex;flex-direction:column;gap:38px;padding-top:36px}
  .article-toc{order:-1;position:static;width:100%}
  .article-content{width:100%;max-width:100%;font-size:1rem;line-height:1.8}
  .article-content h2{font-size:2.15rem}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
