body{margin:0}
.blog-wrap{max-width:1100px;margin:0 auto;padding:0 24px 24px;font-family:var(--font-body,"Manrope","Segoe UI",system-ui,sans-serif);color:var(--color-text,#0F172A)}
.skip-link{position:absolute;left:-9999px}.skip-link:focus{left:12px;top:12px;background:#fff;padding:8px 12px;border-radius:8px;z-index:200}
.blog-h1,.blog-head h1{font-family:var(--font-display,"Space Grotesk","Manrope",system-ui,sans-serif);font-weight:700;letter-spacing:-.02em;line-height:1.12;margin:.4em 0 .3em}
.blog-h1{font-size:clamp(2rem,4vw,2.8rem)}
.blog-head h1{font-size:clamp(1.8rem,3.6vw,2.6rem)}
.blog-sub{font-size:1.1rem;margin:28px 0 14px}
.blog-desc{font-size:1.08rem;line-height:1.6;color:var(--color-text-secondary,#334155);max-width:760px}
.blog-cat{display:inline-block;font-size:.76rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--color-primary,#B14842)}
.blog-meta{font-size:.85rem;color:var(--color-text-tertiary,#475569)}
.blog-cover{width:100%;height:auto;border-radius:20px;margin:18px 0 6px;aspect-ratio:3/2;object-fit:cover}
.blog-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:40px;margin-top:24px}
.blog-grid:has(.blog-toc){grid-template-columns:minmax(180px,230px) minmax(0,1fr)}
.blog-toc{position:sticky;top:84px;align-self:start;display:flex;flex-direction:column;gap:8px;font-size:.85rem}
.blog-toc-h{font-weight:800;font-size:.76rem;letter-spacing:.06em;text-transform:uppercase}
.blog-toc a{color:var(--color-text-secondary,#334155);text-decoration:none}.blog-toc a:hover{color:var(--color-primary,#B14842)}
.blog-body{max-width:740px;font-size:1.04rem;line-height:1.75}
.blog-body h2{font-family:var(--font-display,"Space Grotesk",sans-serif);font-size:1.5rem;margin:2em 0 .5em;scroll-margin-top:90px}
.blog-body h3{font-size:1.2rem;margin:1.6em 0 .4em;scroll-margin-top:90px}
.blog-body a{color:var(--color-primary,#B14842)}
.blog-body img{max-width:100%;height:auto;border-radius:14px}
.blog-body blockquote{margin:1.4em 0;padding:.4em 1.2em;border-left:3px solid var(--color-brand,#E86B5F);color:var(--color-text-secondary,#334155)}
.blog-body table{border-collapse:collapse;width:100%;font-size:.95rem}.blog-body th,.blog-body td{border:1px solid var(--color-border-subtle,#E2E8F0);padding:8px 10px;text-align:left}
.blog-body pre{overflow:auto;padding:14px;border-radius:12px;background:#0F172A;color:#E2E8F0}
.blog-faq details{border-top:1px solid var(--color-border-subtle,#E2E8F0);padding:12px 0}.blog-faq summary{font-weight:700;cursor:pointer}
.blog-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:20px}
.blog-card{display:flex;flex-direction:column;gap:8px;text-decoration:none;color:inherit;border:1px solid var(--color-border-subtle,#E2E8F0);border-radius:18px;padding:14px;background:var(--color-surface,#fff);transition:transform .2s,box-shadow .2s}
.blog-card:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(15,23,42,.1)}
.blog-card img{width:100%;height:auto;border-radius:12px;aspect-ratio:3/2;object-fit:cover}
.blog-card-t{font-weight:800;line-height:1.3}.blog-card-d{font-size:.88rem;color:var(--color-text-secondary,#334155);line-height:1.5}.blog-card-m{font-size:.76rem;color:var(--color-text-tertiary,#475569)}
.blog-related{margin-top:56px}
.blog-pager{display:flex;justify-content:space-between;margin-top:28px}.blog-pager a{font-weight:700;color:var(--color-primary,#B14842);text-decoration:none}
@media(max-width:860px){.blog-grid:has(.blog-toc){grid-template-columns:minmax(0,1fr)}.blog-toc{position:static}}
@media(prefers-reduced-motion:reduce){.blog-card{transition:none}.blog-card:hover{transform:none}}