.blog-index{padding-block:45px 55px}
.blog-intro{max-width:850px;margin-bottom:32px}
.blog-intro h1{font-size:clamp(38px,4vw,54px);letter-spacing:-1.8px}
.blog-featured{display:grid;grid-template-columns:1.15fr .85fr;gap:42px;padding:36px;background:#f7f7f7;border:1px solid #e5e5e5;align-items:center;margin-bottom:36px}
body.buyer-design #main .blog-featured h2{font-size:34px;letter-spacing:-1px;margin-block:16px}
.blog-featured-visual{display:flex;align-items:center;justify-content:center;background:#fff;min-height:260px;border:1px solid #e7e7e7}
.blog-featured-visual img{width:100%;height:245px;object-fit:contain;padding:20px}
body.buyer-design #main .article-meta{display:flex;align-items:center;flex-wrap:wrap;gap:9px;font-size:13px;line-height:1.7;color:#626262}
.article-meta>span:first-child{color:var(--red);font-weight:500}
.blog-filters{display:flex;gap:9px;flex-wrap:wrap;margin:0 0 24px}
.blog-filters button{border:1px solid #dedede;background:#fff;padding:10px 17px;min-height:44px;font-size:13px;line-height:1.5;color:#555}
.blog-filters button[aria-pressed=true]{background:#111;color:#fff;border-color:#111}
.blog-filters button:hover{border-color:#111}
.blog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.blog-card{border:1px solid #e5e5e5;background:#fff;display:flex;flex-direction:column;min-width:0}
.blog-card-visual{background:#f8f8f8;display:block;overflow:hidden}
.blog-card-visual img{height:180px;width:100%;padding:20px;object-fit:contain;transition:transform .2s}
.blog-card:hover .blog-card-visual img{transform:scale(1.04)}
.blog-card-content{padding:24px;display:flex;flex-direction:column;flex:1}
body.buyer-design #main .blog-card h3{font-size:23px;line-height:1.35;margin-block:14px}
.blog-card-content>a:last-child{margin-top:auto;align-self:start}
.blog-index>.blog-cta{margin-top:34px}
.blog-article{padding-block:32px 52px}
.article-back{display:inline-flex;align-items:center;gap:12px;font-size:14px;padding:8px 0;color:#626262;margin-bottom:22px}
.article-back:hover{color:var(--red)}
.blog-article-header{max-width:880px;border-bottom:1px solid #e5e5e5;padding-bottom:28px;margin-bottom:32px}
.blog-article-header h1{font-size:clamp(37px,4vw,53px);letter-spacing:-1.7px;margin-block:18px}
.article-layout{display:grid;grid-template-columns:minmax(0,760px) minmax(220px,1fr);gap:64px;align-items:start}
body.buyer-design #main .article-body h2{font-size:28px;letter-spacing:-.6px;line-height:1.35;margin-bottom:15px}
.article-body section+section{margin-top:32px}
body.buyer-design #main .article-body p,body.buyer-design #main .article-body li{font-size:17px;line-height:1.85}
.article-body ul{padding-left:24px}
.article-body li{padding-left:4px;margin-bottom:10px}
.article-sidebar{position:sticky;top:122px;background:#f7f7f7;border:1px solid #e5e5e5;padding:25px}
body.buyer-design #main .article-sidebar h2,body.buyer-design #main .article-sidebar h3{font-size:23px;line-height:1.35;letter-spacing:-.4px}
body.buyer-design #main .article-sidebar p{font-size:15px;line-height:1.8}
.article-sidebar .button{width:100%}
.blog-related{border-top:1px solid #e5e5e5;padding-top:30px;margin-top:38px}
body.buyer-design #main .blog-related>h2{font-size:28px;letter-spacing:-.6px}
.blog-related>div,.blog-related-list{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.blog-related a:not(.button){display:block;font-size:18px;line-height:1.6;padding:20px;border:1px solid #e5e5e5}
.blog-related a:hover{color:var(--red);border-color:#aaa}
body.buyer-design #main .article-sources{padding:22px 24px;border-left:2px solid var(--red);background:#f7f7f7;margin-top:30px}
body.buyer-design #main .article-sources h2,body.buyer-design #main .article-sources h3{font-size:20px;line-height:1.4;margin-bottom:12px}
body.buyer-design #main .article-sources p,body.buyer-design #main .article-sources li{font-size:14px;line-height:1.8}
.article-sources a{color:#333;text-decoration:underline;text-underline-offset:3px;font-size:14px;line-height:1.8;overflow-wrap:anywhere}
.article-sources a:hover{color:var(--red)}
@media(max-width:950px){
 .blog-featured{gap:28px;padding:28px}
 .blog-grid{grid-template-columns:1fr 1fr;gap:20px}
 .article-layout{grid-template-columns:minmax(0,1fr);gap:28px}
 .article-sidebar{position:static;max-width:650px}
}
@media(max-width:680px){
 .blog-index{padding-block:24px 20px}
 .blog-intro{margin-bottom:22px}
 .blog-intro h1{font-size:34px;letter-spacing:-1.2px;line-height:1.18;margin-bottom:16px}
 .blog-featured{grid-template-columns:1fr;gap:20px;padding:22px 20px;background:#fff;border-color:#e1e4e9;border-radius:16px;margin-bottom:24px}
 body.buyer-design #main .blog-featured h2{font-size:28px;letter-spacing:-.7px;margin-block:13px}
 .blog-featured-visual{grid-row:1;min-height:150px;border:0;border-radius:11px;background:#f6f7f9}
 .blog-featured-visual img{height:160px;padding:10px}
 .blog-filters{gap:8px;flex-wrap:nowrap;overflow-x:auto;padding-bottom:6px;margin-bottom:18px;scrollbar-width:none}
 .blog-filters::-webkit-scrollbar{display:none}
 .blog-filters button{white-space:nowrap;border-radius:10px;font-size:13px;padding:10px 14px;flex:none}
 .blog-grid{grid-template-columns:1fr;gap:14px}
 .blog-card{border-radius:15px;overflow:hidden;border-color:#e1e4e9}
 .blog-card-visual img{height:155px;padding:16px}
 .blog-card-content{padding:22px}
 body.buyer-design #main .blog-card h3{font-size:24px}
 .blog-article{padding-block:16px 24px}
 .article-back{margin-bottom:16px;min-height:44px}
 .blog-article-header{margin-bottom:24px;padding-bottom:24px;border-color:#e1e4e9}
 .blog-article-header h1{font-size:34px;letter-spacing:-1.1px;line-height:1.2}
 .article-body{background:#fff;border:1px solid #e1e4e9;border-radius:15px;padding:24px 20px}
 body.buyer-design #main .article-body h2{font-size:25px;line-height:1.35;letter-spacing:-.5px}
 body.buyer-design #main .article-body p,body.buyer-design #main .article-body li{font-size:16px;line-height:1.8}
 .article-body section+section{margin-top:26px}
 .article-sidebar{border-radius:15px;border-color:#e1e4e9;background:#fff;padding:24px 20px}
 .blog-related{margin-top:28px;padding-top:24px}
 .blog-related>div,.blog-related-list{grid-template-columns:1fr;gap:12px}
 .blog-related a:not(.button){background:#fff;border-radius:12px;border-color:#e1e4e9;font-size:17px;padding:18px}
 body.buyer-design #main .article-sources{padding:18px;border-radius:0 12px 12px 0;margin-top:24px}
 body.buyer-design #main .article-sources p,body.buyer-design #main .article-sources li{font-size:14px}
}
@media(prefers-reduced-motion:reduce){.blog-card-visual img{transition:none}.blog-card:hover .blog-card-visual img{transform:none}}
