/* Blog article page: two columns (jump list + article), TL;DR box, tables and FAQ. */
.ar-page{background:#fff;color:#171717}
.ar-wrap{display:grid;grid-template-columns:210px minmax(0,760px);gap:48px;justify-content:center;max-width:1100px;margin:0 auto;padding:48px 24px 96px}
.ar-progress{position:fixed;top:0;left:0;height:3px;width:0;background:var(--forest);z-index:70;transition:width .1s linear}

.ar-side{position:sticky;top:110px;align-self:start;max-height:calc(100vh - 130px);overflow:auto;padding-bottom:12px}
.ar-back{display:grid;place-items:center;width:32px;height:32px;border:1px solid #e3e3e3;border-radius:50%;color:#171717;font-size:15px;background:#fff;transition:border-color .2s,background .2s}
.ar-back:hover{border-color:#171717;background:#f6f6f4}
.ar-side-title{font-family:var(--font);font-weight:700;font-size:13px;line-height:1.4;letter-spacing:-.01em;margin:22px 0 14px;color:#171717}
.ar-toc{border-left:1px solid #e5e5e5;display:flex;flex-direction:column}
.ar-toc a{display:block;font-size:13px;line-height:1.35;color:#7a7a7a;padding:5px 0 5px 13px;margin-left:-1px;border-left:2px solid transparent;transition:color .15s}
.ar-toc a:hover{color:#171717}
.ar-toc a.active{color:#171717;font-weight:600;border-left-color:#171717}
.ar-back-m{display:none;font-size:13px;font-weight:700;color:#5b5b5b;margin-bottom:18px}

.ar-main{min-width:0}
.ar-main h1{font-family:var(--font);font-size:36px;line-height:1.15;font-weight:800;letter-spacing:-.025em;color:#171717;margin:0;max-width:560px}
.ar-sub{font-size:16.5px;line-height:1.625;color:rgba(23,23,23,.62);margin:16px 0 0}
.ar-by{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-top:20px;font-size:13px}
.ar-avatar{width:20px;height:20px;border-radius:50%;background:var(--forest);color:#fff;font-size:7.5px;font-weight:800;display:grid;place-items:center;letter-spacing:.02em}
.ar-by b{font-family:var(--font);font-weight:700;color:#171717}
.ar-by span:last-child{color:rgba(23,23,23,.5)}
.ar-hero{margin:32px 0 40px}
.ar-hero img{display:block;width:100%;aspect-ratio:16/9;height:auto;object-fit:cover}

.ar-body{font-size:18px;line-height:1.625;color:#171717}
.ar-body p{margin:0 0 1.33em}
.ar-body h2{font-family:var(--font);font-size:24px;line-height:1.33;font-weight:700;letter-spacing:-.025em;margin:1.85em 0 1.05em;scroll-margin-top:110px}
.ar-body h3{font-family:var(--font);font-size:18px;line-height:1.5;font-weight:700;letter-spacing:-.025em;margin:1.65em 0 .7em;scroll-margin-top:110px}
.ar-body ul,.ar-body ol{margin:0 0 1.33em;padding-left:1.6em}
.ar-body li{margin:.55em 0;padding-left:.3em}
.ar-body ul li::marker{color:#cfcfcf}
.ar-body ol li::marker{color:#8a8a8a;font-weight:600}
.ar-body a{color:#171717;text-decoration:underline;text-underline-offset:2px;font-weight:500}
.ar-body a:hover{color:#a6814d}
.ar-body strong{font-weight:700}
.ar-body blockquote{margin:1.6em 0;padding:4px 0 4px 20px;border-left:3px solid rgba(23,23,23,.3);color:#333;font-style:italic}

.ar-tldr{margin:32px 0;border:1px solid rgba(23,23,23,.14);border-left:3px solid rgba(23,23,23,.3);background:rgba(23,23,23,.035);border-radius:6px;padding:24px 28px}
.ar-tldr-label{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:rgba(23,23,23,.7);margin-bottom:12px}
.ar-tldr ul{margin:0;padding-left:20px;font-size:15px;line-height:1.625}
.ar-tldr li{margin:8px 0;padding:0}

.ar-table{margin:28px 0 32px;overflow-x:auto}
.ar-table table{width:100%;border-collapse:collapse;font-size:14px;line-height:1.5}
.ar-table th{font-family:var(--font);text-align:left;font-weight:700;color:#171717;padding:0 14px 12px 0;border-bottom:1px solid #cfdcd7;vertical-align:bottom}
.ar-table td{padding:13px 14px 13px 0;border-bottom:1px solid #e7ebe9;vertical-align:top;color:#2b2b2b}
.ar-table tr:last-child td{border-bottom:0}

.ar-faq{margin:28px 0 36px;background:rgba(23,23,23,.05);border:1px solid rgba(23,23,23,.14);border-radius:6px;padding:6px 28px}
.ar-faq-item{padding:18px 0}
.ar-faq-item+.ar-faq-item{border-top:1px solid rgba(23,23,23,.14)}
.ar-body .ar-faq-q{font-family:var(--font);font-size:16px;line-height:1.45;font-weight:700;letter-spacing:-.01em;margin:0 0 6px}
.ar-body .ar-faq-a{font-size:15px;line-height:1.6;color:rgba(23,23,23,.68);margin:0}

.ar-cta{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:52px;padding:24px 28px;border:1px solid rgba(23,23,23,.14);border-radius:6px;background:#f7f6f2}
.ar-cta b{font-family:var(--font);font-size:18px;letter-spacing:-.02em;display:block;margin-bottom:4px}
.ar-cta p{margin:0;font-size:15px;line-height:1.55;color:rgba(23,23,23,.68)}
.ar-cta .btn{flex:none;margin:0}

@media(max-width:1000px){
  .ar-wrap{grid-template-columns:minmax(0,760px);padding-top:32px}
  .ar-side{display:none}
  .ar-back-m{display:inline-block}
}
@media(max-width:620px){
  .ar-wrap{padding:24px 20px 64px}
  .ar-main h1{font-size:29px}
  .ar-hero{margin:24px -20px 30px}
  .ar-body{font-size:17px}
  .ar-body h2{font-size:22px}
  .ar-tldr,.ar-faq{padding-left:20px;padding-right:20px}
  .ar-cta{flex-direction:column;align-items:flex-start}
  .ar-cta .btn{width:100%}
}
@media print{.ar-side,.ar-progress,.ar-cta,.ar-back-m{display:none!important}.ar-wrap{display:block;padding:0}}