.blog-hero{background:var(--gradient-ink);color:#fff;padding:88px 0 52px;position:relative;overflow:hidden}.blog-hero:before{content:"";background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='420' height='420' viewBox='0 0 420 420'%3E%3Cg fill='none' stroke='%23ffffff' stroke-opacity='0.05' stroke-width='1'%3E%3Cpath d='M0 300L140 160L300 260L420 120'/%3E%3Cpath d='M-40 420L140 160M300 260L200 420M140 160L120 0M300 260L280 60L420 120'/%3E%3C/g%3E%3C/svg%3E");background-size:420px;position:absolute;inset:0}.blog-hero .wrap{position:relative}.blog-hero h1{font-family:var(--font-display);color:#fff;margin:16px 0 14px;font-size:clamp(2rem,4vw,3rem)}.blog-hero .lead{color:var(--text-inverse-soft);max-width:62ch}.blog-demo{background:var(--red-50);border-bottom:1px solid var(--red-100);color:var(--red-800);text-align:center;padding:10px var(--gutter);font-size:.88rem}.blog-demo code{font-family:var(--font-mono);background:var(--red-100);border-radius:4px;padding:1px 6px;font-size:.84rem}.blog-index{padding:56px 0 88px;display:block}.blog-index-head{margin-bottom:28px}.blog-index-title{font-family:var(--font-display);font-size:clamp(1.7rem,3vw,2.3rem)}.blog-grid{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px;display:grid}.blog-card{background:var(--surface-card);border:1px solid var(--border-subtle);border-radius:var(--cut);box-shadow:var(--shadow-sm);transition:transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease);flex-direction:column;display:flex;overflow:hidden}.blog-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px)}.blog-card-cover{aspect-ratio:16/9;object-fit:cover;background:var(--surface-inset);width:100%}.blog-card-title{padding:24px 26px 0;font-size:1.13rem;line-height:1.28}.blog-card-link{color:inherit;transition:color var(--dur) var(--ease);text-decoration:none}.blog-card-link:hover{color:var(--brand-primary)}.blog-card-link:focus-visible{outline:2px solid var(--brand-primary);outline-offset:3px;border-radius:2px}.blog-card-brief{color:var(--text-secondary);padding:10px 26px 0;font-size:.95rem}.blog-card-meta{letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--text-muted);margin-top:auto;padding:18px 26px 22px;font-size:.76rem}.blog-empty{color:var(--text-secondary)}.blog-post{max-width:var(--container-md);padding-top:56px;padding-bottom:88px;display:block}.blog-post-head{border-bottom:1px solid var(--border-subtle);margin-bottom:30px;padding-bottom:26px}.blog-post-title{font-family:var(--font-display);font-size:clamp(1.9rem,3.6vw,2.7rem)}.blog-post-subtitle{color:var(--text-secondary);margin-top:14px;font-size:1.14rem}.blog-post-meta{letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--text-muted);margin-top:18px;font-size:.76rem}.blog-post-cover{border-radius:var(--cut);width:100%;margin-bottom:32px}.blog-crumbs{max-width:var(--container-md);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--text-muted);margin:0 auto;padding-top:28px;font-size:.8rem;font-weight:700}.blog-crumbs a{color:var(--brand-primary);text-decoration:none}.blog-crumbs a:hover{text-decoration:underline}.blog-crumbs span{color:var(--border-default);margin:0 8px}.blog-toc{background:var(--surface-inset);border:1px solid var(--border-subtle);border-radius:12px;margin-bottom:34px;padding:22px 26px}.blog-toc-title{letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--brand-primary);margin-bottom:12px;font-size:.72rem;font-weight:800}.blog-toc-list{gap:8px;font-size:.95rem;list-style:none;display:grid}.blog-toc-item a{color:var(--text-secondary);text-decoration:none}.blog-toc-item a:hover{color:var(--brand-primary)}.blog-content{color:var(--text-primary);font-size:1.06rem}.blog-content h2{font-family:var(--font-display);margin:40px 0 14px;scroll-margin-top:110px;font-size:1.6rem}.blog-content h3{margin:28px 0 10px;scroll-margin-top:110px;font-size:1.18rem}.blog-content p{margin-bottom:18px}.blog-content a{color:var(--brand-primary);text-underline-offset:3px;text-decoration:underline}.blog-content ul,.blog-content ol{gap:8px;margin:0 0 18px 1.25rem;display:grid}.blog-content img{border-radius:var(--cut);margin:28px 0}.blog-content blockquote{border-left:3px solid var(--brand-primary);background:var(--surface-inset);color:var(--text-strong);border-radius:0 8px 8px 0;margin:28px 0;padding:16px 22px}.blog-content hr{border:0;border-top:1px solid var(--border-subtle);margin:36px 0}.blog-content pre{background:var(--brand-ink);color:#fff;border-radius:12px;margin:28px 0;padding:18px 20px;overflow-x:auto}.blog-content code{font-family:var(--font-mono);font-size:.92em}.blog-content table{border-collapse:collapse;width:100%;margin:28px 0;font-size:.95rem}.blog-content th,.blog-content td{border:1px solid var(--border-subtle);text-align:left;padding:10px 14px}.blog-content th{background:var(--surface-inset);color:var(--text-strong);font-weight:700}.blog-tags{flex-wrap:wrap;gap:8px;margin-top:40px;list-style:none;display:flex}.blog-tag{border:1px solid var(--border-default);letter-spacing:var(--tracking-label);text-transform:uppercase;color:var(--text-secondary);border-radius:999px;padding:5px 14px;font-size:.76rem;font-weight:700}footer.blog-author{border-top:1px solid var(--border-subtle);color:var(--text-strong);background:0 0;align-items:center;gap:12px;margin-top:36px;padding:26px 0 0;font-size:1rem;font-weight:700;display:flex}.blog-author-img{object-fit:cover;border-radius:50%;width:44px;height:44px;margin-bottom:0}@media (max-width:640px){.blog-card-title,.blog-card-brief,.blog-card-meta{padding-left:20px;padding-right:20px}.blog-index{padding:40px 0 64px}}