.blog-grid{grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:24px;display:grid}.blog-card{background:var(--glass);-webkit-backdrop-filter:blur(14px);border:1px solid var(--glass-border);border-radius:var(--radius);box-shadow:var(--shadow-sm);transition:transform .4s var(--ease-premium), box-shadow .4s var(--ease-premium), border-color .4s var(--ease-premium);flex-direction:column;text-decoration:none;display:flex;overflow:hidden}.blog-card:hover{box-shadow:var(--shadow-lg);border-color:#3271e459;transform:translateY(-4px)}.blog-cover{justify-content:center;align-items:center;height:188px;display:flex;position:relative;overflow:hidden}.blog-cover:after{content:"";background:radial-gradient(420px 200px at 80% 0,#ffffff47 0%,#0000 60%);position:absolute;inset:0}.blog-cover .blog-cover-emoji{filter:drop-shadow(0 8px 16px #0000002e);font-size:62px;line-height:1}.blog-cover img{object-fit:cover;width:100%;height:100%;transition:transform .6s var(--ease-premium);position:absolute;inset:0}.blog-card:hover .blog-cover img{transform:scale(1.04)}.blog-card-body{flex-direction:column;flex:1;padding:24px 24px 22px;display:flex}.blog-tags{flex-wrap:wrap;gap:6px;margin-bottom:12px;display:flex}.blog-tag{letter-spacing:.04em;text-transform:uppercase;color:var(--brand);background:var(--brand-soft);border-radius:999px;padding:4px 11px;font-size:11px;font-weight:700}.blog-card h2{color:var(--titles);letter-spacing:-.01em;transition:color .3s var(--ease-premium);margin:0 0 8px;font-size:18px;font-weight:800;line-height:1.35}.blog-card:hover h2{color:var(--brand)}.blog-card .blog-excerpt{color:var(--muted);-webkit-line-clamp:3;-webkit-box-orient:vertical;flex:1;margin:0 0 16px;font-size:13.5px;line-height:1.65;display:-webkit-box;overflow:hidden}.blog-meta{color:var(--muted);border-top:1px solid var(--border);align-items:center;gap:8px;padding-top:14px;font-size:12.5px;display:flex}.blog-dot{background:var(--muted);opacity:.6;border-radius:50%;flex-shrink:0;width:3px;height:3px}.blog-read{color:var(--brand);align-items:center;gap:5px;margin-left:auto;font-size:12.5px;font-weight:700;display:inline-flex}.blog-card:hover .blog-read svg{transform:translate(3px)}.blog-read svg{transition:transform .3s var(--ease-premium)}.blog-empty{text-align:center;background:var(--glass);-webkit-backdrop-filter:blur(14px);border:1.5px dashed var(--border);border-radius:var(--radius);padding:70px 24px}.blog-empty .blog-empty-emoji{margin-bottom:14px;font-size:46px;display:block}.blog-empty h2{color:var(--titles);margin:0 0 8px;font-size:19px;font-weight:800}.blog-empty p{color:var(--muted);margin:0 0 20px;font-size:14px}.blog-pagination{justify-content:center;gap:8px;margin-top:36px;display:flex}.blog-pagination a,.blog-pagination span.blog-page-cur{border:1px solid var(--glass-border);background:var(--glass);-webkit-backdrop-filter:blur(10px);min-width:40px;height:40px;color:var(--titles);box-shadow:var(--shadow-sm);transition:border-color .25s var(--ease-premium), color .25s var(--ease-premium), transform .25s var(--ease-premium);border-radius:999px;justify-content:center;align-items:center;font-size:13.5px;font-weight:600;text-decoration:none;display:inline-flex}.blog-pagination a:hover{border-color:var(--brand);color:var(--brand);transform:translateY(-2px)}.blog-pagination span.blog-page-cur{background:var(--brand);border-color:var(--brand);color:#fff}.blog-article{max-width:780px;margin:0 auto}.blog-article-cover{border-radius:var(--radius);border:1px solid var(--border);height:240px;box-shadow:var(--shadow-md);justify-content:center;align-items:center;margin-bottom:30px;display:flex;position:relative;overflow:hidden}.blog-article-cover:after{content:"";background:radial-gradient(560px 260px at 82% 0,#ffffff42 0%,#0000 60%);position:absolute;inset:0}.blog-article-cover .blog-cover-emoji{filter:drop-shadow(0 12px 22px #0003);font-size:96px;line-height:1}.blog-article-cover img{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.blog-article-cover.has-image{aspect-ratio:16/9;height:auto}.blog-article-cover.has-image:after{content:none}.blog-article h1{color:var(--titles);letter-spacing:-.02em;margin:0 0 16px;font-size:clamp(26px,3.4vw,34px);font-weight:800;line-height:1.25}.blog-article-meta{color:var(--muted);border-top:1px solid var(--border);border-bottom:1px solid var(--border);flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:34px;padding:13px 0;font-size:13.5px;display:flex}.blog-content{color:var(--text);font-size:15.5px;line-height:1.8}.blog-content p{margin:0 0 18px}.blog-content h2{color:var(--titles);letter-spacing:-.01em;margin:34px 0 12px;font-size:20px;font-weight:800}.blog-content h3{color:var(--titles);margin:26px 0 10px;font-size:16.5px;font-weight:700}.blog-content ul,.blog-content ol{margin:0 0 18px;padding-left:22px}.blog-content li{margin-bottom:8px}.blog-content li::marker{color:var(--brand)}.blog-content strong{color:var(--titles)}.blog-content a{color:var(--brand);font-weight:500;text-decoration:none}.blog-content a:hover{text-decoration:underline}.blog-content img{border-radius:12px;max-width:100%;height:auto}.blog-content blockquote{border-left:3px solid var(--brand);background:var(--glass);-webkit-backdrop-filter:blur(14px);box-shadow:var(--shadow-sm);border-top-right-radius:12px;border-bottom-right-radius:12px;margin:0 0 18px;padding:16px 20px}.blog-cta{background:var(--brand-grad);border-radius:var(--radius);color:#fff;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:22px;margin-top:48px;padding:36px;display:flex;box-shadow:0 14px 34px #3271e43d}.blog-cta h2{letter-spacing:-.01em;margin:0 0 6px;font-size:19px;font-weight:800}.blog-cta p{opacity:.92;max-width:480px;margin:0;font-size:13.5px;line-height:1.6}.blog-cta a{background:var(--card);color:var(--brand);transition:transform .3s var(--ease-premium);white-space:nowrap;border-radius:999px;align-items:center;gap:8px;padding:13px 24px;font-size:14px;font-weight:700;text-decoration:none;display:inline-flex;box-shadow:0 6px 18px #10182829}.blog-cta a:hover{transform:translateY(-2px)}.blog-back{color:var(--muted);transition:color .25s var(--ease-premium);align-items:center;gap:6px;margin-bottom:22px;font-size:13.5px;font-weight:600;text-decoration:none;display:inline-flex}.blog-back:hover{color:var(--brand)}@media (max-width:640px){.blog-grid{grid-template-columns:1fr}.blog-article-cover{height:180px}.blog-article-cover .blog-cover-emoji{font-size:72px}}
