.blog-page{min-height:100%;padding:var(--spacing);box-sizing:border-box;max-width:1100px;margin:0 auto}.blog-page .blog-body{gap:var(--spacing);flex-direction:column;display:flex}@media (width>=768px){.blog-page .blog-body{align-items:flex-start;gap:calc(var(--spacing) * 1.5);flex-direction:row}.blog-page .blog-body:not(.has-subnav){flex-direction:column}}.blog-page .blog-body:not(.has-subnav) .blog-panel{width:100%;max-width:800px;margin:0 auto}.blog-page .blog-panel{min-width:0;padding:calc(var(--spacing) * 1.25);border:1px solid var(--color-border);border-radius:var(--border-radius);background:var(--color-surface);box-shadow:0 8px 20px var(--color-shadow-ink);flex:1}@media (width<=600px){.blog-page .blog-panel{padding:var(--spacing)}}.blog-page .blog-subnav{flex-shrink:0;width:100%}@media (width>=768px){.blog-page .blog-subnav{width:220px;top:var(--spacing);position:sticky}}.blog-page .blog-subnav nav{padding:var(--spacing-half);border:1px solid var(--color-border);border-radius:var(--border-radius);background:var(--color-surface);box-shadow:0 8px 20px var(--color-shadow-ink);flex-direction:column;gap:2px;display:flex}.blog-page .blog-subnav .nav-heading{margin:var(--spacing-half) 0 var(--spacing-quarter);padding:0 var(--spacing);letter-spacing:.04em;text-transform:uppercase;color:var(--color-text-muted);font-size:.7rem;font-weight:700}.blog-page .blog-subnav .nav-link{padding:var(--spacing-half) var(--spacing);border-radius:calc(var(--border-radius) - 2px);color:var(--color-text-soft);transition:background-color var(--speed) ease, color var(--speed) ease;font-size:.85rem;font-weight:600;line-height:1.35;text-decoration:none;display:block}.blog-page .blog-subnav .nav-link:hover{color:var(--color-text);background:color-mix(in srgb, var(--color-primary) 6%, transparent)}.blog-page .blog-subnav .nav-link.active{color:var(--color-primary-strong);background:color-mix(in srgb, var(--color-primary) 12%, transparent)}.blog-page .blog-subnav .nav-link.nav-all{border-bottom:1px solid var(--color-border);border-radius:calc(var(--border-radius) - 2px) calc(var(--border-radius) - 2px) 0 0;padding-bottom:calc(var(--spacing-half) + 2px);margin-bottom:2px}.blog-page .blog-missing h1{margin:0 0 var(--spacing-half);font-size:1.5rem}.blog-page .blog-missing p{margin:0 0 var(--spacing);color:var(--color-text-soft)}.blog-page .blog-missing a{color:var(--color-primary-strong);font-weight:600}.blog-page .blog-index h1{margin:0 0 var(--spacing-half);font-size:1.75rem}.blog-page .blog-index .lead{margin:0 0 calc(var(--spacing) * 1.25);color:var(--color-text-soft);font-size:.95rem;line-height:1.5}.blog-page .blog-index .post-list{gap:var(--spacing);flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.blog-page .blog-index .post-card{padding:var(--spacing);border:1px solid var(--color-border);border-radius:var(--border-radius);background:var(--color-surface-alt);color:inherit;text-decoration:none;transition:border-color .15s,box-shadow .15s;display:block}.blog-page .blog-index .post-card:hover{border-color:color-mix(in srgb, var(--color-primary) 45%, var(--color-border));box-shadow:0 6px 16px var(--color-shadow-ink)}.blog-page .blog-index .post-card .post-date{margin:0 0 var(--spacing-quarter);color:var(--color-text-soft);font-size:.8rem;font-weight:600}.blog-page .blog-index .post-card h2{margin:0 0 var(--spacing-half);color:var(--color-text);font-size:1.15rem;line-height:1.3}.blog-page .blog-index .post-card p{color:var(--color-text-soft);margin:0;font-size:.9rem;line-height:1.45}.blog-page .blog-article{min-width:0}.blog-page .blog-article .blog-article-header{margin-bottom:calc(var(--spacing) * 1.25)}.blog-page .blog-article .blog-article-title-row{justify-content:space-between;align-items:flex-start;gap:var(--spacing);margin-bottom:var(--spacing-half);display:flex}.blog-page .blog-article .blog-article-header h1{min-width:0;color:var(--color-text);flex:1;margin:0;font-size:1.75rem;line-height:1.25}.blog-page .blog-article .blog-article-date{color:var(--color-text-soft);text-align:right;white-space:nowrap;flex-shrink:0;margin:.2rem 0 0;font-size:.85rem;font-weight:600;line-height:1.3}.blog-page .blog-article .blog-article-lead{color:var(--color-text-soft);margin:0;font-size:1.05rem;line-height:1.55}.blog-page .blog-article .blog-article-body{gap:calc(var(--spacing) * 1.15);flex-direction:column;display:flex}.blog-page .blog-article .blog-article-body>:first-child{margin-top:0}.blog-page .blog-article .blog-article-body>:last-child{margin-bottom:0}.blog-page .blog-article .blog-article-body p{color:var(--color-text);margin:0;font-size:.95rem;line-height:1.6}.blog-page .blog-article .blog-article-body h2{margin:calc(var(--spacing) * .25) 0 0;color:var(--color-text);font-size:1.2rem;line-height:1.3}.blog-page .blog-article .blog-article-body h3{margin:calc(var(--spacing) * .15) 0 0;color:var(--color-text);font-size:1.05rem;line-height:1.35}.blog-page .blog-article .blog-article-body ul,.blog-page .blog-article .blog-article-body ol{color:var(--color-text);margin:0;padding-left:1.25rem;font-size:.95rem;line-height:1.55}.blog-page .blog-article .blog-article-body li+li{margin-top:.35rem}.blog-page .blog-article .blog-article-body a{color:var(--color-primary-strong);font-weight:600}.blog-page .blog-article .blog-article-body .blog-intro{gap:var(--spacing);flex-direction:column;display:flex}.blog-page .blog-article .blog-article-body .blog-intro+.blog-section,.blog-page .blog-article .blog-article-body .blog-section+.blog-section,.blog-page .blog-article .blog-article-body .blog-section+.blog-callout,.blog-page .blog-article .blog-article-body .blog-callout+.blog-section{margin-top:calc(var(--spacing) * .35);padding-top:calc(var(--spacing) * 1.25);position:relative}.blog-page .blog-article .blog-article-body .blog-intro+.blog-section:before,.blog-page .blog-article .blog-article-body .blog-section+.blog-section:before,.blog-page .blog-article .blog-article-body .blog-section+.blog-callout:before,.blog-page .blog-article .blog-article-body .blog-callout+.blog-section:before{content:"";background:linear-gradient(to right, transparent 0%, var(--color-border) 18%, var(--color-border) 82%, transparent 100%);height:1px;position:absolute;top:0;left:0;right:0}.blog-page .blog-article .blog-article-body .blog-section{gap:var(--spacing-half);flex-direction:column;display:flex}.blog-page .blog-article .blog-article-body .blog-section h2{align-items:center;gap:var(--spacing-half);margin:0;font-size:1.15rem;line-height:1.3;display:flex}.blog-page .blog-article .blog-article-body .blog-section .blog-section-icon{background:color-mix(in srgb, var(--color-primary) 12%, transparent);width:2rem;height:2rem;color:var(--color-primary-strong);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:.9rem;display:inline-flex}.blog-page .blog-article .blog-article-body .blog-takeaway{align-items:flex-start;gap:var(--spacing-half);margin:var(--spacing-quarter) 0 0;padding:var(--spacing-half) 0 var(--spacing-half) var(--spacing);border-left:3px solid var(--color-primary);color:var(--color-text);font-size:.92rem;line-height:1.5;display:flex}.blog-page .blog-article .blog-article-body .blog-takeaway .blog-takeaway-icon{color:var(--color-primary-strong);flex-shrink:0;margin-top:.15rem;font-size:.85rem}.blog-page .blog-article .blog-article-body .blog-takeaway strong{font-weight:700}.blog-page .blog-article .blog-article-body .blog-callout{align-items:flex-start;gap:var(--spacing-half);color:var(--color-text);margin:0;padding:0;font-size:.95rem;line-height:1.55;display:flex}.blog-page .blog-article .blog-article-body .blog-callout .blog-callout-icon{color:var(--color-warning-dark);flex-shrink:0;margin-top:.15rem;font-size:1rem}.blog-page .blog-article .blog-article-body .blog-callout .blog-callout-body{min-width:0}.blog-page .blog-article .blog-article-body .blog-callout p{margin:0}.blog-page .blog-article .blog-article-body .blog-callout p+p{margin-top:var(--spacing-half)}
