.article-site .top{position:sticky;background:var(--bg);mix-blend-mode:normal;border-bottom:1px solid var(--line)}
.top nav{display:flex;align-items:center;gap:24px}
.articles-link{font-size:14px;text-decoration:none}
.articles-link:hover,.site-footer a:hover{color:var(--hot)}
.site-footer{display:flex;gap:28px;border-top:1px solid var(--line);padding:28px var(--gutter);font-size:14px;color:var(--mute)}
.site-footer a:first-child{margin-right:auto}
.article-main{padding:64px var(--gutter) 96px;max-width:1440px;margin:auto}
.article-main h1{font-size:clamp(42px,5.2vw,76px);font-weight:850;font-stretch:110%;letter-spacing:-.045em;line-height:1.08;margin:20px 0 28px;overflow-wrap:anywhere}
.index-heading{padding:32px 0 56px;border-bottom:1px solid var(--line)}
.index-heading>p:last-child{color:#cfcbc3;font-size:20px}
.article-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px;margin-top:40px}
.article-card{padding:28px 0;border-top:1px solid var(--line)}
.article-card h2{font-size:30px;line-height:1.2;letter-spacing:-.025em;margin:14px 0}
.article-card h2 a{text-decoration:none}
.article-card h2 a:hover{color:var(--hot)}
.article-card>p:last-child{color:#cfcbc3;max-width:52ch}
.articles-empty{grid-column:1/-1;padding:48px 32px 56px;border:1px solid var(--line);background:var(--bg-2)}
.articles-empty h2{font-size:clamp(28px,3vw,42px);font-weight:500;letter-spacing:-.025em;margin:24px 0 32px}
.articles-empty a{text-underline-offset:6px}
.breadcrumbs{display:flex;gap:14px;font-size:14px;color:var(--mute);margin-bottom:48px}
.article-heading{max-width:1050px;margin:0 auto 56px}
.article-description{font-size:clamp(20px,2vw,26px);color:#cfcbc3;max-width:60ch;line-height:1.5}
.article-meta{font-size:13px;color:#aaa69f;line-height:1.8}
.prose{max-width:68ch;margin:0 auto;font-size:19px;line-height:1.8;color:#d4d0c8;overflow-wrap:anywhere}
.prose h1,.prose h2,.prose h3,.prose h4{color:var(--ink);line-height:1.25;letter-spacing:-.025em;margin:2em 0 .7em}
.prose h2{font-size:32px}.prose h3{font-size:24px}
.prose p,.prose ul,.prose ol{margin:0 0 1.4em}
.prose li{margin:.4em 0}.prose li p{margin:.4em 0}
.prose a{text-decoration-color:var(--hot);text-underline-offset:4px}
.prose img{max-width:100%;height:auto;display:block;margin:2em auto}
.prose blockquote{margin:2em 0;padding:4px 0 4px 24px;border-left:2px solid var(--hot);font-size:22px}
.prose blockquote p:last-child{margin-bottom:0}
.prose pre{max-width:100%;overflow:auto;padding:24px;background:var(--bg-2);border:1px solid var(--line);line-height:1.6}
.prose code{font-family:var(--mono);font-size:.8em;background:var(--bg-2);padding:3px 5px}
.prose pre code{padding:0}
.prose table{display:block;max-width:100%;overflow:auto;border-collapse:collapse;font-size:16px;margin:2em 0}
.prose th,.prose td{padding:12px 16px;border:1px solid var(--line);text-align:left;min-width:140px}
.prose th{background:var(--bg-2);color:var(--ink)}
.prose hr{border:0;border-top:1px solid var(--line);margin:3em 0}
.article-faq,.article-howto{padding-top:24px;margin-top:56px;border-top:1px solid var(--line)}
.article-offers{max-width:68ch;margin:80px auto 0;border-top:2px solid var(--hot);padding-top:24px}
.article-offers>h2{font-size:32px;letter-spacing:-.025em}
.article-offers ul{list-style:none;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.article-offers h3{margin:0 0 12px;font-size:24px}
.article-offers h3 a{text-underline-offset:5px}
.article-offers p{color:#cfcbc3;font-size:16px}.article-offers .price{font:12px/1.8 var(--mono);color:var(--ink)}
.article-offers>.btn{margin-top:20px}
:focus-visible{outline:3px solid var(--hot);outline-offset:5px}
.offer-anchor{display:block;scroll-margin-top:100px}
@media(max-width:600px){
  .top nav{gap:16px}.top .brand{font-size:24px}.top .btn-top{font-size:12px;padding:9px 12px}.articles-link{font-size:13px}
  .article-main{padding-top:32px;padding-bottom:64px}.article-grid,.article-offers ul{grid-template-columns:1fr}
  .index-heading{padding:16px 0 28px}.articles-empty{padding:32px 24px}.article-grid{margin-top:28px}
  .breadcrumbs{margin-bottom:32px}.article-heading{margin-bottom:40px}.prose{font-size:17px}.prose h2{font-size:28px}
  .article-offers{margin-top:56px}.site-footer{gap:20px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important}}