@charset "UTF-8";
@import url('/blog-reading.css?v=2');
.blog-article{--article-ink:#18334a;--article-muted:#496176;--article-teal:#24627a;color:var(--article-ink)}
.blog-article .article-breadcrumbs{font-size:14px;display:flex;flex-wrap:wrap;gap:12px;line-height:1.7;padding-top:30px}
.blog-article .article-header{padding-top:38px;padding-bottom:42px;background:none;border:0;height:auto;position:static;display:block}
.blog-article .article-header .eyebrow{color:var(--article-teal);font-size:13px;margin-bottom:20px}
.blog-article .article-header h1{max-width:24em;font-size:clamp(29px,3.7vw,48px);line-height:1.55;letter-spacing:.02em;margin:0 0 24px;text-wrap:pretty}
.blog-article .article-byline{display:flex;flex-wrap:wrap;align-items:center;gap:6px 20px;color:var(--article-muted);font-size:15px;margin-bottom:24px}
.blog-article .article-byline a{font-weight:700;color:var(--article-teal)}
.blog-article .article-dates{display:flex;flex-wrap:wrap;gap:18px 32px;padding:0;margin:0 0 30px;font-variant-numeric:tabular-nums}
.blog-article .article-dates div{display:grid;gap:5px}.blog-article .article-dates dt{font-size:12px;letter-spacing:.04em;color:var(--article-muted)}.blog-article .article-dates dd{font-size:15px;margin:0}
.blog-article .article-cover{display:block;width:min(100%,960px);height:auto;aspect-ratio:16/9;object-fit:cover;margin:0;border-radius:12px;background:#f4f3eb}
.blog-article .article-layout{display:grid;grid-template-columns:minmax(0,1fr) 240px;grid-template-areas:"body toc";gap:52px;align-items:start;padding-bottom:58px}
.blog-article .article-outline{grid-area:toc;min-width:0;position:sticky;top:105px;max-height:calc(100vh - 130px);overflow-y:auto;scrollbar-width:thin}
.blog-article .article-toc{border-top:3px solid var(--article-teal);background:#f7f9fa;padding:17px 18px 10px;border-radius:0 0 8px 8px}
.blog-article .article-toc summary{cursor:pointer;font-size:16px;line-height:1.7;font-weight:700;list-style-position:inside;color:var(--article-ink)}
.blog-article .article-toc nav{display:block;padding:10px 0 0}.blog-article .article-toc nav a{display:block;font-size:14px;line-height:1.8;margin:0;padding:9px 0;border-top:1px solid #dce5e8;text-decoration:none;overflow-wrap:anywhere}
.blog-article .article-toc nav a:hover{text-decoration:underline}.blog-article .article-toc a:focus-visible,.blog-article summary:focus-visible{outline:2px solid var(--article-teal);outline-offset:3px}
.blog-article .article-body{grid-area:body;min-width:0;font-size:18px;line-height:1.95}
.blog-article .article-body>p:first-of-type{margin-bottom:1.6em}
.blog-article .article-body h2{font-size:clamp(24px,2.4vw,31px);line-height:1.65;letter-spacing:.01em;margin:2.4em 0 .9em;padding-top:22px;border-top:1px solid #d3dfe5;scroll-margin-top:105px}
.blog-article .article-body h3{font-size:22px;line-height:1.7;margin:1.8em 0 .75em;scroll-margin-top:105px}
.blog-article .article-body h4{font-size:19px;line-height:1.7}
.blog-article .reading-figure{background:#fff;border:1px solid #e0e7e8;border-radius:12px;overflow:hidden}
.blog-article .reading-figure picture,.blog-article .reading-figure img{display:block;width:100%;height:auto}
.blog-article .reading-figure figcaption{font-size:14px;line-height:1.85;padding:13px 19px;color:#435d72;border-top:1px solid #e5ecee}
.blog-article .reading-case-study{display:grid;gap:24px;margin:32px 0 42px;padding:28px;background:#f4f7f9;border:1px solid #dce5eb;border-radius:16px;min-width:0}
.blog-article .reading-case-copy,.blog-article .reading-case-media{min-width:0}
.blog-article .reading-case-copy h3{margin:0 0 20px;font-size:21px;line-height:1.65}
.blog-article .reading-case-copy p{font-size:16px;line-height:1.9;margin-bottom:18px}
.blog-article .reading-case-copy p:last-child{margin-bottom:0}
.blog-article .reading-case-copy p:last-child a{display:inline-flex;padding:11px 15px;border:1px solid #24627a;border-radius:7px;background:#fff;font-weight:700}
.blog-article .reading-case-media{align-self:center}
.blog-article .reading-case-media .reading-figure{margin:0;width:100%}
.blog-article .reading-screenshot-link{display:block;color:#24627a;text-decoration:none}
.blog-article .reading-screenshot-link span{display:block;padding:10px 16px;font-size:13px;font-weight:700;background:#f7fafb;border-top:1px solid #e5ecee}
.blog-article .reading-screenshot-link:focus-visible{outline:3px solid #e6b92f;outline-offset:-3px}
@media(min-width:900px){.blog-article .reading-case-study{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px}.blog-article .reading-case-left .reading-case-copy{grid-column:2;grid-row:1}.blog-article .reading-case-left .reading-case-media{grid-column:1;grid-row:1}}
@media(max-width:600px){.blog-article .reading-case-study{padding:20px 16px;margin-inline:-4px;gap:20px}.blog-article .reading-case-copy h3{font-size:20px}.blog-article .reading-case-copy p{font-size:16px}.blog-article .reading-case-media .reading-figure figcaption{padding:12px 14px}}
.blog-article .reading-revision{background:#eff5f6;padding:20px 23px;margin:0 0 32px}
.blog-article .article-body .reading-revision p,.blog-article .article-body .reading-revision li{font-size:15px;line-height:1.9}
.blog-article .reading-comparison td,.blog-article .reading-comparison th{font-size:16px;line-height:1.85}
.blog-article .article-body pre{font-size:15px;line-height:1.75;tab-size:2}
.blog-article .article-body :not(pre)>code{font-size:.9em;background:#edf3f5;padding:2px 5px;border-radius:3px;overflow-wrap:anywhere}
.blog-article .article-editorial{margin-top:56px;background:#f7f9fa;padding:22px 25px;border-radius:10px}
.blog-article .article-editorial h2{margin-top:0;padding:0;border:0;font-size:22px}
.blog-article .article-editorial p{font-size:15px;line-height:1.95;margin-bottom:14px}.blog-article .article-editorial p:last-child{margin-bottom:0}
.blog-article .article-reading-next{padding-top:34px;padding-bottom:50px;border-top:1px solid #d3dfe5}
.blog-article .article-reading-next h2,.blog-article .article-consult h2{font-size:28px;line-height:1.6;margin:8px 0 20px}
.blog-article .article-reading-next ul{list-style:none;padding:0;margin:0 0 24px;display:grid;grid-template-columns:1fr 1fr;gap:22px}
.blog-article .article-reading-next li{background:#f5f8fa;border-radius:9px;font-size:17px;line-height:1.85}
.blog-article .article-reading-next li a{display:block;padding:22px 24px;color:var(--article-ink)}
.blog-article .article-consult{border-top:1px solid #d3dfe5;padding-top:38px;padding-bottom:75px}.blog-article .article-consult p{font-size:16px;line-height:1.9}
@media(max-width:1000px){.blog-article .article-layout{display:flex;flex-direction:column;gap:28px}.blog-article .article-outline{position:static;width:100%;max-height:none;overflow:visible}.blog-article .article-body{width:100%}.blog-article .article-toc{padding:16px 20px}.blog-article .article-toc nav{columns:2;column-gap:26px}.blog-article .article-toc nav a{break-inside:avoid}.blog-article .article-header{padding-top:28px;padding-bottom:30px}}
@media(max-width:600px){
 .blog-article .article-breadcrumbs{font-size:13px;gap:9px;padding-top:22px}
 .blog-article .article-header{padding-top:24px;padding-bottom:26px}.blog-article .article-header h1{font-size:29px;line-height:1.65;margin-bottom:20px}.blog-article .article-header .eyebrow{font-size:12px;margin-bottom:14px}
 .blog-article .article-byline{font-size:14px;gap:5px 13px;margin-bottom:21px}.blog-article .article-dates{gap:12px 23px;margin-bottom:24px}.blog-article .article-dates dt{font-size:12px}.blog-article .article-dates dd{font-size:14px}
 .blog-article .article-cover{border-radius:8px}.blog-article .article-layout{gap:24px;padding-bottom:34px}
 .blog-article .article-body{font-size:16px;line-height:2}.blog-article .article-body h2{font-size:24px;line-height:1.7;margin-top:2em;padding-top:20px}.blog-article .article-body h3{font-size:21px;line-height:1.7}
 .blog-article .article-toc nav{columns:1}.blog-article .article-toc nav a{font-size:15px}.blog-article .article-toc summary{font-size:16px}
 .blog-article .reading-revision{padding:18px 19px}.blog-article .article-body .reading-revision p,.blog-article .article-body .reading-revision li{font-size:14px;line-height:1.95}
 .blog-article .reading-figure{border-radius:9px;margin-top:24px}.blog-article .reading-figure figcaption{font-size:13px;padding:12px 15px}
 .blog-article .reading-comparison td,.blog-article .reading-comparison th{font-size:15px;line-height:1.95}.blog-article .reading-comparison td{grid-template-columns:minmax(0,30%) minmax(0,1fr);gap:13px}.blog-article .reading-comparison td::before{overflow-wrap:anywhere}
 .blog-article .article-body pre{font-size:14px;padding:16px}.blog-article .article-body .reading-detail-body{padding:17px}.blog-article .article-body .reading-details summary{padding:15px 17px}
 .blog-article .article-editorial{padding:20px;margin-top:35px}.blog-article .article-editorial h2{font-size:21px}.blog-article .article-editorial p{font-size:14px}
 .blog-article .article-reading-next ul{grid-template-columns:1fr;gap:16px}.blog-article .article-reading-next li{font-size:16px}.blog-article .article-reading-next li a{padding:20px}.blog-article .article-reading-next h2,.blog-article .article-consult h2{font-size:25px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
