/* Blog-only heading refinements: Inter, compact lengths and sizing.
   Blog-only reading styles: applied only on article pages. Header, navigation,
   product pages and the blog listing intentionally remain unchanged. */
.longform-article { background:#fff; padding:clamp(42px,6vw,76px) 0 100px; }
.longform-article .longform-wrap { max-width:800px; }
.longform-article .article-back { font-size:14px; line-height:1.6; margin-bottom:24px; }
.longform-article .article-kicker { font-size:13px; letter-spacing:.055em; line-height:1.65; color:#466270; margin-bottom:14px; }
.longform-article .longform-wrap > h1 {
  font-family:var(--sans, 'Inter', system-ui, sans-serif); font-weight:800;
  font-size:clamp(36px,4vw,46px); line-height:1.17;
  letter-spacing:-.032em; max-width:30ch; margin:0 0 28px;
  text-wrap:balance; overflow-wrap:break-word; color:#071a31;
}
.longform-article .article-hero-image {
  width:100%; max-height:440px; object-fit:cover; border-radius:16px; margin:0 0 38px;
}
.longform-article .longform-wrap > h2 {
  font-family:var(--sans, 'Inter', system-ui, sans-serif); font-size:clamp(25px,2.6vw,30px);
  font-weight:800; line-height:1.32; letter-spacing:-.018em; margin:50px 0 16px;
  color:#102c4c; scroll-margin-top:24px; text-wrap:balance;
}
.longform-article .longform-wrap h3 {
  font-family:var(--sans, 'Inter', system-ui, sans-serif); font-size:clamp(18px,1.7vw,20px);
  line-height:1.42; font-weight:700; letter-spacing:-.01em;
  color:#17344a; margin:27px 0 10px; text-wrap:pretty;
}
.longform-article .longform-wrap p,
.longform-article .longform-wrap li {
  font-family:var(--sans, system-ui, sans-serif); font-size:18px;
  font-weight:400; line-height:1.84; letter-spacing:.005em;
  color:#304659; overflow-wrap:break-word;
}
.longform-article .longform-wrap p { margin:0 0 21px; }
.longform-article .longform-wrap strong { color:#142d42; font-weight:800; }
.longform-article .longform-wrap > ul,
.longform-article .longform-wrap > ol { padding-left:27px; margin:0 0 24px; }
.longform-article .longform-wrap li { padding-left:4px; margin:0 0 12px; }
.longform-article .longform-wrap li + li { margin-top:11px; }
.longform-article .article-callout {
  border:1px solid #d7e6e1; border-radius:17px; padding:30px 32px;
  background:#f1f8f5; margin:0 0 29px;
}
.longform-article .article-callout h2 {
  font-family:var(--sans, 'Inter', system-ui, sans-serif); font-size:21px; line-height:1.38;
  font-weight:800; letter-spacing:-.01em; margin:0 0 16px; color:#113b37;
}
.longform-article .article-callout ul { margin:0; padding-left:23px; }
.longform-article .article-callout li { font-size:17px; line-height:1.74; margin-bottom:9px; }
.longform-article .article-callout li:last-child { margin-bottom:0; }
.longform-article .blog-toc {
  background:#f8faf9; border:1px solid #e2eae8; border-radius:14px;
  padding:23px 26px; margin:0 0 46px;
}
.longform-article .blog-toc h2 {
  font-family:var(--sans, system-ui, sans-serif); font-size:18px;
  font-weight:800; letter-spacing:0; line-height:1.45;
  margin:0 0 12px; color:#153d43;
}
.longform-article .blog-toc ol {
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr));
  column-gap:28px; row-gap:9px; margin:0; padding-left:22px;
}
.longform-article .blog-toc li { font-size:14px; line-height:1.5; margin:0; padding-left:1px; color:#375766; }
.longform-article .blog-toc a { color:#125b58; text-decoration:underline; text-underline-offset:3px; text-decoration-color:#b1d1cd; }
.longform-article a:focus-visible { outline:3px solid #2563eb; outline-offset:3px; border-radius:2px; }
.longform-article .article-faq { margin-top:20px; border-top:1px solid #d9e5e2; }
.longform-article .article-faq h3 { padding-top:17px; }
.longform-article .article-table-wrap { margin:26px 0 30px; border-color:#d6e1df; }
.longform-article .article-comparison-table { min-width:600px; }
.longform-article .article-comparison-table caption {
  caption-side:top; font-family:var(--sans,system-ui,sans-serif);
  text-align:left; font-size:14px; line-height:1.5; font-weight:700;
  padding:13px 16px; color:#2b4e57; background:#f7faf8;
}
.longform-article .article-comparison-table th,
.longform-article .article-comparison-table td { font-size:15px; line-height:1.65; padding:15px 14px; color:#304659; }
.longform-article .article-comparison-table thead th,
.longform-article .article-comparison-table tbody th { color:#163b45; }
.longform-article .article-cta { margin-top:44px; padding-top:28px; }
@media(max-width:760px){
  .longform-article { padding:42px 0 74px; }
  .longform-article .longform-wrap { width:min(100% - 38px,800px); }
  .longform-article .longform-wrap > h1 { font-size:clamp(32px,7.2vw,38px); line-height:1.2; margin-bottom:24px; max-width:100%; }
  .longform-article .longform-wrap > h2 { font-size:clamp(24px,5.7vw,28px); line-height:1.32; margin:42px 0 15px; }
  .longform-article .longform-wrap h3 { font-size:18px; line-height:1.45; }
  .longform-article .article-callout h2 { font-size:20px; }
  .longform-article .longform-wrap p,
  .longform-article .longform-wrap li { font-size:17px; line-height:1.8; }
  .longform-article .article-callout { padding:23px 21px; }
  .longform-article .article-callout li { font-size:16.5px; }
  .longform-article .blog-toc { padding:20px 19px; margin-bottom:34px; }
  .longform-article .blog-toc ol { grid-template-columns:1fr; }
  .longform-article .blog-toc li { font-size:14px; line-height:1.5; }
  .longform-article .article-hero-image { margin-bottom:28px; max-height:none; }
}
@media(prefers-reduced-motion:reduce){
  .longform-article { scroll-behavior:auto; }
}
