.blog-main{padding-top: 7rem;padding-bottom: 4rem}.blog-wrap{max-width: 760px;margin: 0 auto;padding: 0 1.5rem}.breadcrumb{font-size: 0.85rem;color: var(--text-muted);margin-bottom: 1.5rem}.breadcrumb a{color: var(--text-secondary);text-decoration: none}.breadcrumb a:hover{color: var(--accent-light)}.breadcrumb span{margin: 0 0.4rem;opacity: 0.5}.article-eyebrow{display: inline-block;font-family: var(--font-display);font-weight: 700;font-size: 0.78rem;letter-spacing: 0.08em;text-transform: uppercase;color: var(--accent-light);margin-bottom: 0.75rem}.article-title{font-family: var(--font-display);font-weight: 800;line-height: 1.1;font-size: clamp(2rem,5vw,3rem);color: var(--text-primary);margin: 0 0 1rem}.article-meta{display: flex;flex-wrap: wrap;gap: 0.75rem;align-items: center;font-size: 0.9rem;color: var(--text-muted);margin-bottom: 2.5rem;padding-bottom: 1.5rem;border-bottom: 1px solid var(--border)}.article-meta .dot{opacity: 0.4}.article-body{font-family: var(--font-body);color: var(--text-secondary);font-size: 1.075rem;line-height: 1.75}.article-body>p:first-of-type{font-size: 1.2rem;color: var(--text-primary)}.article-body h2{font-family: var(--font-display);font-weight: 800;color: var(--text-primary);font-size: 1.6rem;line-height: 1.25;margin: 2.75rem 0 1rem;scroll-margin-top: 6rem}.article-body h3{font-family: var(--font-display);font-weight: 700;color: var(--text-primary);font-size: 1.25rem;margin: 2rem 0 0.75rem}.article-body p{margin: 0 0 1.25rem}.article-body ul,.article-body ol{margin: 0 0 1.5rem;padding-left: 1.4rem}.article-body li{margin-bottom: 0.6rem}.article-body a{color: var(--accent-light);text-decoration: underline;text-underline-offset: 2px}.article-body strong{color: var(--text-primary);font-weight: 600}.article-body blockquote{margin: 1.75rem 0;padding: 1rem 1.5rem;border-left: 3px solid var(--accent);background: var(--surface);border-radius: 0 12px 12px 0;color: var(--text-primary)}.article-body code{font-family: var(--font-mono);font-size: 0.9em;background: var(--surface-elevated);padding: 0.15em 0.4em;border-radius: 6px}.article-cta{margin: 3rem 0 1rem;padding: 2rem;border-radius: 20px;background: var(--surface);border: 1px solid var(--border);position: relative;overflow: hidden}.article-cta::before{content: '';position: absolute;inset: 0;opacity: 0.12;background: var(--gradient-1,linear-gradient(135deg,#4F46E5,#7C3AED,#EC4899))}.article-cta>*{position: relative}.article-cta h3{font-family: var(--font-display);font-weight: 800;color: var(--text-primary);font-size: 1.35rem;margin: 0 0 0.5rem}.article-cta p{color: var(--text-secondary);margin: 0 0 1.25rem}.blog-hero{text-align: center;max-width: 640px;margin: 0 auto 3rem;padding: 0 1.5rem}.blog-hero h1{font-family: var(--font-display);font-weight: 800;font-size: clamp(2.2rem,6vw,3.25rem);color: var(--text-primary);margin: 0 0 0.75rem}.blog-hero p{color: var(--text-secondary);font-size: 1.1rem}.blog-filters{max-width: 1080px;margin: 0 auto 2rem;padding: 0 1.5rem;display: flex;flex-wrap: wrap;justify-content: center;gap: 0.6rem}.blog-filter{font-family: var(--font-body);font-size: 0.85rem;font-weight: 600;color: var(--text-secondary);background: var(--surface);border: 1px solid var(--border);border-radius: 999px;padding: 0.5rem 1.1rem;min-height: 40px;cursor: pointer;transition: color 0.2s ease,background 0.2s ease,border-color 0.2s ease}.blog-filter:hover{color: var(--text-primary);border-color: var(--accent)}.blog-filter.is-active{color: #fff;background: var(--accent);border-color: var(--accent)}.blog-empty{text-align: center;color: var(--text-muted);font-size: 1rem;margin: 2rem auto 0;padding: 0 1.5rem}.blog-grid{max-width: 1080px;margin: 0 auto;padding: 0 1.5rem;display: grid;grid-template-columns: repeat(auto-fill,minmax(300px,1fr));gap: 1.5rem}.blog-card{display: flex;flex-direction: column;padding: 1.75rem;border-radius: 18px;background: var(--surface);border: 1px solid var(--border);text-decoration: none;transition: transform 0.2s ease,border-color 0.2s ease}.blog-card[hidden]{display: none}.blog-card:hover{transform: translateY(-3px);border-color: var(--accent)}.blog-card .cat{font-size: 0.72rem;letter-spacing: 0.08em;text-transform: uppercase;color: var(--accent-light);font-weight: 700;margin-bottom: 0.6rem}.blog-card h2{font-family: var(--font-display);font-weight: 700;font-size: 1.2rem;line-height: 1.3;color: var(--text-primary);margin: 0 0 0.6rem}.blog-card p{color: var(--text-secondary);font-size: 0.95rem;line-height: 1.6;margin: 0 0 1rem;flex: 1}.blog-card .read{font-size: 0.85rem;color: var(--text-muted)}@media (max-width: 768px){.blog-main{padding-top: 6rem}.article-body{font-size: 1.02rem}}