.blog-page{flex-direction:column;gap:1.5rem;max-width:1200px;margin:0 auto;padding:2.5rem 1.5rem;display:flex}.blog-hero{flex-direction:column;gap:.4rem;display:flex}.blog-hero h1{margin:0;font-size:2.6rem}.blog-hero p{color:var(--text-alt);margin:0;font-size:1.05rem}.blog-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.5rem;display:grid}.blog-card{border:1px solid var(--core-border);border-radius:var(--border-radius-medium,14px);background:var(--core-background,#fff);color:inherit;flex-direction:column;text-decoration:none;transition:box-shadow .2s,transform .2s;display:flex;overflow:hidden}.blog-card:hover{transform:translateY(-2px);box-shadow:0 8px 24px #00000014}.blog-card .blog-card-cover{aspect-ratio:16/9;object-fit:cover;background:#f0f0f0;width:100%}.blog-card .blog-card-cover.is-empty{background:linear-gradient(135deg,#dfe9f3 0%,#f5f7fa 100%)}.blog-card .blog-card-body{flex-direction:column;gap:.5rem;padding:1rem;display:flex}.blog-card .blog-card-body h3{margin:0;font-size:1.15rem;line-height:1.3}.blog-card .blog-card-body p{color:var(--text-alt);-webkit-line-clamp:3;-webkit-box-orient:vertical;margin:0;font-size:.9rem;line-height:1.45;display:-webkit-box;overflow:hidden}.blog-card .blog-card-body .blog-card-date{color:var(--sub-title);margin-top:auto;padding-top:.4rem;font-size:.75rem}.blog-card-tags{flex-wrap:wrap;gap:.35rem;display:flex}.blog-card-tag{color:var(--primary,#0097df);background:#0097df1a;border-radius:20px;padding:2px 10px;font-size:.72rem;font-weight:600}.blog-empty{text-align:center;border-radius:var(--border-radius-medium,14px);border:1px dashed var(--core-border);flex-direction:column;align-items:center;gap:.5rem;padding:4rem 1rem;display:flex}.blog-empty h2{margin:0}.blog-empty p{color:var(--text-alt);margin:0}.blog-empty a{color:var(--primary,#0097df)}.blog-article{max-width:860px}.blog-article .blog-breadcrumb a{color:var(--text-alt);font-size:.85rem;text-decoration:none}.blog-article .blog-breadcrumb a:hover{color:var(--primary,#0097df)}.blog-post{flex-direction:column;gap:1.5rem;display:flex}.blog-post-head{flex-direction:column;gap:.6rem;display:flex}.blog-post-head h1{margin:0;font-size:2.2rem;line-height:1.2}.blog-post-head .blog-post-excerpt{color:var(--text-alt);margin:0;font-size:1.05rem;line-height:1.5}.blog-post-head .blog-card-date{color:var(--sub-title);font-size:.8rem}.blog-post-head .blog-post-share{align-items:center;gap:.45rem;margin-top:.3rem;display:flex}.blog-post-head .blog-post-share>span{color:var(--sub-title);text-transform:uppercase;letter-spacing:.03em;margin-right:.2rem;font-size:.78rem;font-weight:600}.blog-post-head .blog-post-share button{border:1px solid var(--core-border);border-radius:var(--border-radius-circle);width:34px;height:34px;color:var(--text-alt);cursor:pointer;background:0 0;justify-content:center;align-items:center;font-size:.95rem;transition:color .15s,border-color .15s,background .15s;display:inline-flex}@media (width<=321px){.blog-post-head .blog-post-share button{width:38px;height:38px}}.blog-post-head .blog-post-share button:hover{color:var(--primary);border-color:var(--primary);background:#00000005}.blog-post-cover{aspect-ratio:16/9;object-fit:cover;border-radius:var(--border-radius-medium,14px);background:#f0f0f0;width:100%}.blog-post-content{color:var(--text,#333);font-size:1rem;line-height:1.7}.blog-post-content h1,.blog-post-content h2,.blog-post-content h3,.blog-post-content h4{color:var(--title,#111);margin:1.8rem 0 .7rem;line-height:1.25}.blog-post-content ul,.blog-post-content ol{padding-left:1.4rem}.blog-post-content li{margin:.3rem 0}.blog-post-content img,.blog-post-content video{border-radius:10px;max-width:100%}.blog-post-content blockquote{border-left:3px solid var(--primary,#0097df);background:#0097df0d;border-radius:6px;margin:1.2rem 0;padding:.4rem 1.1rem}.blog-post-content a{color:var(--primary,#0097df)}.blog-post-content table{border-collapse:collapse;max-width:100%}.blog-post-content table th,.blog-post-content table td{border:1px solid var(--core-border);padding:.45rem .8rem}.blog-post-content pre{background:#f5f7fa;border-radius:10px;padding:.9rem 1.1rem;overflow-x:auto}.blog-post-footer a{color:var(--text-alt);font-size:.85rem;text-decoration:none}.blog-post-footer a:hover{color:var(--primary,#0097df)}@media (width<=540px){.blog-page{padding:1.5rem .75rem}.blog-hero h1{font-size:2rem}.blog-grid{grid-template-columns:1fr}.blog-post-head h1{font-size:1.7rem}}