.blog-hero { padding-block:76px 58px; }
.breadcrumbs { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:38px; color:var(--soft); font-size:11px; }
.breadcrumbs a { color:var(--muted); text-decoration:none; }
.breadcrumbs a:hover { color:var(--cyan); }
.blog-hero h1 { max-width:980px; }
.blog-hero > p { max-width:760px; margin-top:24px; color:var(--muted); font-size:16px; line-height:1.8; }
.blog-directory { padding-bottom:95px; }
.blog-section-heading { margin-bottom:27px; }
.blog-section-heading > span { display:block; margin-bottom:8px; color:var(--green); font-size:9px; font-weight:900; letter-spacing:1.3px; text-transform:uppercase; }
.blog-section-heading h2 { font-size:clamp(31px,4vw,48px); }
.blog-category { padding:31px 0 44px; border-top:1px solid var(--line); }
.category-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:18px; }
.category-heading h3 { font-family:"Space Grotesk"; font-size:23px; }
.category-heading span { color:var(--soft); font-size:10px; font-weight:800; }
.blog-card-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:13px; }
.blog-card { min-width:0; display:flex; flex-direction:column; padding:23px; border:1px solid var(--line); border-radius:10px; background:var(--panel); transition:transform .2s ease,border-color .2s ease,background .2s ease; }
.blog-card:hover { transform:translateY(-3px); border-color:rgba(49,215,255,.28); background:var(--panel-hover); }
.blog-card-meta { display:flex; justify-content:space-between; gap:15px; margin-bottom:18px; color:var(--soft); font-size:8px; font-weight:900; letter-spacing:.7px; text-transform:uppercase; }
.blog-card h3,.blog-card h4 { margin-bottom:12px; font-family:"Space Grotesk"; font-size:18px; line-height:1.35; letter-spacing:-.35px; }
.blog-card h3 a,.blog-card h4 a { color:var(--text); text-decoration:none; }
.blog-card p { margin-bottom:20px; color:var(--muted); font-size:12px; line-height:1.7; }
.blog-card-link { display:flex; align-items:center; justify-content:space-between; margin-top:auto; padding-top:14px; border-top:1px solid var(--line); color:var(--cyan); text-decoration:none; font-size:10px; font-weight:900; }
.article-header { max-width:980px; padding-block:58px 48px; }
.article-header h1 { max-width:930px; font-size:clamp(40px,5.5vw,68px); line-height:1.05; }
.article-meta { display:flex; flex-wrap:wrap; gap:10px 18px; margin-bottom:20px; color:var(--soft); font-size:9px; font-weight:900; letter-spacing:.8px; text-transform:uppercase; }
.article-meta span:first-child { color:var(--green); }
.article-lead { max-width:820px; margin-top:24px; color:var(--muted); font-size:18px; line-height:1.75; }
.article-layout { max-width:1100px; display:grid; grid-template-columns:240px minmax(0,760px); gap:70px; align-items:start; padding-bottom:80px; }
.article-toc { position:sticky; top:105px; padding:20px; border:1px solid var(--line); border-radius:9px; background:rgba(255,255,255,.035); }
.article-toc strong { display:block; margin-bottom:13px; color:var(--green); font-size:9px; letter-spacing:1px; text-transform:uppercase; }
.article-toc ol { display:grid; gap:10px; padding-left:17px; color:var(--soft); font-size:10px; line-height:1.5; }
.article-toc a { color:var(--muted); text-decoration:none; }
.article-toc a:hover { color:var(--cyan); }
.article-content { min-width:0; color:var(--muted); }
.article-content > p { margin-bottom:20px; font-size:16px; line-height:1.9; }
.article-content section { padding-top:28px; scroll-margin-top:95px; }
.article-content h2 { margin-bottom:19px; color:var(--text); font-size:clamp(27px,3vw,38px); line-height:1.2; letter-spacing:-1px; }
.article-content section p { margin-bottom:17px; font-size:15px; line-height:1.9; }
.article-content ul { display:grid; gap:10px; margin:20px 0 22px; padding-left:22px; color:rgba(248,251,255,.78); font-size:14px; line-height:1.7; }
.article-content li::marker { color:var(--green); }
.article-note { margin:24px 0; padding:20px; border-left:3px solid var(--cyan); border-radius:0 8px 8px 0; background:rgba(49,215,255,.06); }
.article-note strong { display:block; margin-bottom:7px; color:var(--cyan); font-size:9px; letter-spacing:1px; text-transform:uppercase; }
.article-note p { margin:0!important; font-size:13px!important; }
.article-cta { margin-top:48px; padding:30px; border:1px solid rgba(49,215,255,.22); border-radius:11px; background:linear-gradient(135deg,rgba(49,215,255,.1),rgba(143,124,255,.07)); }
.article-cta > span { color:var(--green); font-size:9px; font-weight:900; letter-spacing:1px; text-transform:uppercase; }
.article-cta h2 { margin:12px 0 22px; font-size:29px; }
.related-posts { padding-block:20px 95px; }
.not-found { min-height:70vh; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; }
.not-found p { margin:17px 0 25px; color:var(--muted); }
@media(max-width:960px){.blog-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.article-layout{grid-template-columns:1fr;gap:28px}.article-toc{position:static}.article-toc ol{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.blog-hero{padding-block:48px}.blog-card-grid{grid-template-columns:1fr}.article-header{padding-block:42px 34px}.article-lead{font-size:16px}.article-toc ol{grid-template-columns:1fr}.article-content>p{font-size:15px}.article-cta{padding:23px}.article-cta h2{font-size:25px}}