/* v27 blog: code-built editorial covers and a readable comparison article. */
:root { --blog-ink:#1d1d1f; --blog-muted:#6e6e73; --blog-line:#dedee2; --blog-lime:#b7ff22; }
.v27-blog-index,.v27-blog-article { background:#fff; color:var(--blog-ink); }
.v27-blog-wrap { width:min(1120px,calc(100% - 64px)); margin-inline:auto; }
.v27-blog-intro { padding:calc(var(--hero-clearance,110px) + 76px) 0 92px; background:#f5f5f7; }
.v27-blog-eyebrow { margin:0 0 20px; font-size:.75rem; line-height:1.4; font-weight:700; letter-spacing:.16em; }
.v27-blog-intro h1 { max-width:900px; font:700 clamp(3.2rem,6.1vw,5.6rem)/1.02 var(--heading,var(--font)); letter-spacing:-.065em; text-wrap:balance; }
.v27-blog-intro p:last-child { max-width:700px; margin:28px 0 0; font-size:clamp(1.125rem,2vw,1.375rem); line-height:1.55; color:var(--blog-muted); letter-spacing:-.025em; }
.v27-blog-list { padding:82px 0 110px; }
.v27-blog-list-heading { display:flex; align-items:end; justify-content:space-between; gap:24px; margin-bottom:34px; }
.v27-blog-list-heading h2 { font:700 clamp(2rem,3vw,2.75rem)/1.1 var(--heading,var(--font)); letter-spacing:-.05em; }
.v27-blog-list-heading p { max-width:350px; color:var(--blog-muted); font-size:.9375rem; line-height:1.5; }
.v27-blog-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:48px 24px; }
.blog-card { min-width:0; }
.blog-card__link { display:flex; flex-direction:column; height:100%; border-radius:28px; color:inherit; outline-offset:7px; transition:transform .32s cubic-bezier(.2,.72,.25,1); }
.blog-card__link:hover { transform:translateY(-5px); }
.blog-card__cover { display:block; aspect-ratio:16/10; width:100%; overflow:hidden; border-radius:24px; background:#f5f5f7; box-shadow:0 5px 18px #1d1d1f0b; transition:box-shadow .32s ease; }
.blog-card__link:hover .blog-card__cover { box-shadow:0 14px 30px #1d1d1f1a; }
.blog-card__content { display:flex; flex-direction:column; flex:1; padding:22px 2px 0; }
.blog-card__eyebrow { margin:0 0 10px; font-size:.75rem; line-height:1.4; color:var(--blog-muted); font-weight:700; letter-spacing:.075em; text-transform:uppercase; }
.blog-card__title { margin:0; font:700 clamp(1.35rem,2.1vw,1.75rem)/1.16 var(--heading,var(--font)); letter-spacing:-.045em; text-wrap:balance; }
.blog-card__description { margin:14px 0 0; color:var(--blog-muted); font-size:.9375rem; line-height:1.58; }
.blog-card__cta { display:inline-flex; align-items:center; gap:6px; margin-top:auto; padding-top:25px; font-size:.875rem; font-weight:700; }
.blog-card:first-child { grid-column:1/-1; }
.blog-card:first-child .blog-card__link { display:flex; flex-direction:column; overflow:hidden; border:1px solid #e7e7eb; box-shadow:0 4px 16px #1d1d1f0c; background:#fff; transition:transform .32s cubic-bezier(.2,.72,.25,1),box-shadow .32s ease; }
.blog-card:first-child .blog-card__link:hover { box-shadow:0 16px 34px #1d1d1f1a; }
.blog-card:first-child .blog-card__cover { aspect-ratio:2.85/1; height:auto; border-radius:0; box-shadow:none; }
.blog-card:first-child .blog-card__content { padding:30px clamp(30px,4.5vw,58px) 36px; }
.blog-card:first-child .blog-card__description { max-width:72ch; }
.blog-card:first-child .blog-card__title { font-size:clamp(2rem,3.6vw,3.1rem); line-height:1.09; }
.blog-card:first-child .blog-card__description { font-size:1.0625rem; }

/* Deterministic covers: title, category, brand and one accent rule only. */
.blog-card__cover, .v27-cover { position:relative; display:flex; flex-direction:column; justify-content:space-between; min-width:0; overflow:hidden; padding:clamp(26px,4vw,48px); color:#1d1d1f; background:#f5f5f7; }
.blog-card__cover::after, .v27-cover::after { content:""; position:absolute; left:clamp(26px,4vw,48px); bottom:clamp(26px,4vw,48px); width:68px; height:5px; border-radius:8px; background:#b7ff22; }
.blog-card__cover-brand, .v27-cover-brand { display:block; position:relative; z-index:1; margin:0; font-size:.6875rem; line-height:1.4; letter-spacing:.16em; font-weight:800; }
.blog-card__cover-category, .v27-cover-category { display:block; position:relative; z-index:1; margin-top:4px; font-size:.6875rem; line-height:1.4; letter-spacing:.13em; font-weight:700; text-transform:uppercase; color:#6e6e73; }
.blog-card__cover .blog-card__title, .v27-cover-title { position:relative; z-index:1; max-width:23ch; margin:auto 0; padding:18px 0 24px; font:700 clamp(2rem,3.25vw,3.45rem)/1.07 var(--heading,var(--font)); letter-spacing:-.055em; text-wrap:balance; overflow-wrap:normal; }
.blog-card__cover .blog-card__title { font-size:clamp(1.7rem,3.1vw,3.25rem); }
.blog-card:not(:first-child) .blog-card__cover { padding:27px; }
.blog-card:not(:first-child) .blog-card__cover::after { left:27px; bottom:27px; width:50px; height:4px; }
.blog-card:not(:first-child) .blog-card__cover .blog-card__title { font-size:clamp(1.35rem,1.8vw,1.65rem); }
.v27-cover { width:100%; height:100%; background:#f5f5f7; }
.v27-article-cover .v27-cover-title { font-size:clamp(2.25rem,4.35vw,4rem); }

/* Article: a narrow reading column with a sticky, separately labelled TOC. */
.v27-article-shell { display:grid; grid-template-columns:minmax(0,820px) minmax(190px,230px); gap:clamp(44px,5vw,80px); align-items:start; justify-content:center; width:min(1240px,calc(100% - 64px)); margin:0 auto; }
.v27-article-shell > article { min-width:0; }
.v27-blog-article .comparison-modern .compare-hero { width:100%; padding:calc(var(--hero-clearance,110px) + 56px) 0 40px; text-align:left; }
.v27-blog-article .comparison-modern .compare-hero h1 { max-width:790px; margin:0; font-size:clamp(2.7rem,4.25vw,4.25rem); line-height:1.055; letter-spacing:-.055em; }
.v27-article-breadcrumb { display:flex; align-items:center; gap:11px; margin:0; font-size:.8125rem; color:var(--blog-muted); }
.v27-article-breadcrumb a { text-decoration:underline; text-underline-offset:3px; }
.v27-article-kicker { margin:28px 0 15px; font-size:.75rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.v27-article-kicker span,.v27-article-byline span { display:inline-block; margin:0 5px; color:#8b8b91; }
.v27-blog-article .comparison-modern .compare-lead { max-width:720px; margin:26px 0 0; font-size:clamp(1.125rem,1.7vw,1.375rem); line-height:1.5; }
.v27-blog-article .comparison-modern .article-intro-text { max-width:730px; margin:18px 0 0; text-align:left; color:var(--blog-muted); font-size:1.0625rem; line-height:1.7; }
.v27-article-byline { margin:24px 0 0; color:var(--blog-muted); font-size:.8125rem; font-weight:600; }
.v27-article-cover { height:auto; aspect-ratio:16/9; margin:28px 0 0; border-radius:24px; overflow:hidden; }
.v27-article-cover .v27-cover { min-height:0; }
.v27-article-rail { position:relative; min-width:0; height:100%; padding-top:calc(var(--hero-clearance,110px) + 54px); }
.v27-rail-sticky { position:sticky; top:calc(var(--hero-clearance,110px) + 12px); padding-left:21px; border-left:1px solid var(--blog-line); }
.v27-rail-sticky > p { margin:0 0 17px; font-size:.8125rem; font-weight:800; }
.v27-rail-sticky nav { display:grid; gap:1px; }
.v27-rail-sticky nav a { padding:7px 0; font-size:.8125rem; line-height:1.35; color:var(--blog-muted); }
.v27-rail-sticky nav a:nth-child(n+2):nth-child(-n+6) { padding-left:12px; font-size:.75rem; }
.v27-rail-sticky nav a:hover,.v27-rail-sticky nav a:focus-visible { color:var(--blog-ink); text-decoration:underline; text-underline-offset:3px; }
.v27-rail-link { display:block; margin-top:20px; padding-top:18px; border-top:1px solid var(--blog-line); font-size:.8125rem; font-weight:700; }
.v27-mobile-toc { display:none; }
.v27-blog-article .v23-static-compare .article-comparison-container { width:100%; }
.v27-blog-article .v23-static-compare .article-process { padding-top:30px; }
.v27-blog-article .v23-static-compare .article-process,.v27-blog-article .v23-static-compare .article-results,.v27-blog-article .v23-static-compare .article-cost { padding-inline:0; }
.v27-blog-article .v23-static-compare .article-section-heading { margin-bottom:26px; text-align:left; }
.v27-blog-article .v23-static-compare .article-section-heading h2 { font-size:clamp(2rem,3vw,2.5rem); letter-spacing:-.045em; }
.v27-blog-article .v23-static-compare .article-comparison-panel { padding:40px 0 44px; }
.v27-blog-article .v23-static-compare .article-topic-fallback { margin-bottom:22px; text-align:left; font-size:1.5rem; }
.v27-blog-article .v23-static-compare .article-comparison-pair { gap:clamp(24px,3vw,42px); }
.v27-blog-article .v23-static-compare .article-comparison-label { margin-bottom:14px; font-size:.875rem; font-weight:800; text-align:left; }
.v27-blog-article .v23-static-compare .article-comparison-column { text-align:left; }
.v27-blog-article .v23-static-compare .article-comparison-art { width:min(100%,200px); margin:0 0 16px; }
.v27-blog-article .v23-static-compare .article-comparison-lead { max-width:100%; margin:0; font-size:clamp(1.25rem,1.85vw,1.5rem); text-align:left; }
.v27-blog-article .v23-static-compare .article-comparison-prose { margin:12px 0 0; font-size:.9375rem; line-height:1.58; }
.v27-blog-article .v23-static-compare .article-results { padding-top:50px; }
.v27-blog-article .article-brand-question { padding-block:50px; text-align:left; }
.v27-blog-article .article-brand-question p { max-width:100%; font-size:clamp(1.5rem,2.6vw,2rem); }
.v27-blog-article .article-cost-grid { gap:32px; }
.v27-blog-article .article-cost-copy,.v27-blog-article .article-cost-professional-copy { font-size:1rem; line-height:1.6; }
.v27-blog-article .article-cost-professional { gap:24px; padding:28px; }
.v27-article-next { width:min(1100px,calc(100% - 64px)); margin:0 auto 90px; padding-top:28px; border-top:1px solid var(--blog-line); }
.v27-article-next > p { margin:0 0 19px; font-size:1.5rem; font-weight:700; letter-spacing:-.04em; }
.v27-article-next > div { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.v27-article-next a { display:grid; grid-template-columns:1fr auto; gap:12px; align-items:end; min-height:140px; padding:24px; border-radius:20px; background:#f5f5f7; transition:transform .25s ease,box-shadow .25s ease; }
.v27-article-next a:hover { transform:translateY(-4px); box-shadow:0 10px 25px #1d1d1f12; }
.v27-article-next a span:first-child { grid-column:1/-1; color:var(--blog-muted); font-size:.75rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; }
.v27-article-next a strong { font-size:1.25rem; line-height:1.25; letter-spacing:-.03em; }
.v27-article-next a span:last-child { font-size:1.3rem; }

@media (max-width:1100px) {
  .v27-article-shell { grid-template-columns:minmax(0,820px); }
  .v27-article-rail { display:none; }
  .v27-mobile-toc { display:block; margin:28px 0 0; padding:0 18px; border:1px solid var(--blog-line); border-radius:16px; }
  .v27-mobile-toc summary { display:list-item; padding:16px 0; cursor:pointer; font-size:.875rem; font-weight:700; }
  .v27-mobile-toc nav { display:grid; gap:4px; padding:0 0 16px; }
  .v27-mobile-toc nav a { padding:7px 0; font-size:.875rem; color:var(--blog-muted); }
}
@media (max-width:740px) {
  .v27-blog-wrap,.v27-article-shell,.v27-article-next { width:calc(100% - 40px); }
  .v27-blog-intro { padding:calc(var(--hero-clearance,100px) + 24px) 0 58px; }
  .v27-blog-eyebrow { font-size:.6875rem; }
  .v27-blog-intro h1 { font-size:clamp(2.6rem,10.5vw,3.7rem); }
  .v27-blog-intro p:last-child { margin-top:20px; font-size:1.0625rem; }
  .v27-blog-list { padding:54px 0 74px; }
  .v27-blog-list-heading { display:block; margin-bottom:24px; }
  .v27-blog-list-heading p { margin-top:10px; }
  .v27-blog-grid { grid-template-columns:1fr; gap:40px; }
  .blog-card:first-child .blog-card__link { display:flex; flex-direction:column; }
  .blog-card:first-child .blog-card__cover { width:100%; height:auto; aspect-ratio:16/10; }
  .blog-card:first-child .blog-card__content { padding:25px; }
  .blog-card:first-child .blog-card__title { font-size:clamp(1.5rem,6.1vw,2rem); }
  .blog-card:first-child .blog-card__description { font-size:.9375rem; }
  .v27-blog-article .comparison-modern .compare-hero { padding-top:calc(var(--hero-clearance,100px) + 20px); padding-bottom:20px; }
  .v27-blog-article .comparison-modern .compare-hero h1 { font-size:clamp(2.125rem,8.4vw,3.25rem); line-height:1.09; }
  .v27-article-kicker { margin-top:23px; }
  .v27-blog-article .comparison-modern .compare-lead { margin-top:20px; font-size:1.0625rem; }
  .v27-blog-article .comparison-modern .article-intro-text { font-size:1rem; line-height:1.65; }
  .v27-article-cover { margin-top:27px; border-radius:18px; aspect-ratio:auto; min-height:310px; }
  .v27-article-cover .v27-cover { min-height:310px; }
  .blog-card__cover, .v27-cover { padding:26px; }
  .blog-card__cover::after, .v27-cover::after { left:26px; bottom:26px; width:54px; height:4px; }
  .blog-card__cover .blog-card__title, .v27-article-cover .v27-cover-title { font-size:clamp(1.75rem,7vw,2.7rem); }
  .v27-blog-article .comparison-modern .compare-hero .v27-cover-title { font-size:clamp(1.65rem,7vw,2.7rem); line-height:1.08; }
  .v27-blog-article .v23-static-compare .article-process { padding-top:25px; }
  .v27-blog-article .v23-static-compare .article-comparison-pair { gap:16px; }
  .v27-blog-article .v23-static-compare .article-topic-fallback { font-size:1.375rem; }
  .v27-blog-article .v23-static-compare .article-comparison-label { font-size:.75rem; min-height:0; }
  .v27-blog-article .v23-static-compare .article-comparison-lead { font-size:1.0625rem; }
  .v27-blog-article .v23-static-compare .article-comparison-prose { font-size:.8125rem; line-height:1.5; }
  .v27-blog-article .article-cost-grid,.v27-blog-article .article-cost-professional { grid-template-columns:1fr; }
  .v27-blog-article .article-cost-professional { padding:24px; }
  .v27-article-next { margin-bottom:64px; }
  .v27-article-next > div { grid-template-columns:1fr; }
}
@media (max-width:420px) {
  .v27-blog-article .v23-static-compare .article-comparison-pair { gap:12px; }
  .v27-blog-article .v23-static-compare .article-comparison-prose { font-size:.78125rem; }
  .v27-blog-article .v23-static-compare .article-comparison-art { width:min(100%,150px); }
}
@media (max-width:360px) {
  .blog-card__cover,.blog-card:first-child .blog-card__cover { aspect-ratio:auto; min-height:260px; }
}
@media (prefers-reduced-motion:reduce) {
  .blog-card__link,.blog-card__cover,.v27-article-next a { transition:none; }
}