.blog-hero{--section-padding: clamp(4rem, 10vw, 6rem);position:relative;overflow:hidden;isolation:isolate;background:var(--hero-gradient);text-align:center}.blog-hero__backdrop{position:absolute;inset:-20%;pointer-events:none;z-index:0}.blog-hero__glow{position:absolute;border-radius:999px;filter:blur(100px);opacity:.3}.blog-hero__glow--brand{width:30vw;height:30vw;top:-10%;left:15%;background:radial-gradient(circle,rgba(58,102,255,.15),transparent 70%)}.blog-hero__glow--accent{width:25vw;height:25vw;right:15%;bottom:-10%;background:radial-gradient(circle,rgba(16,185,129,.1),transparent 70%)}@media(max-width:640px){.blog-hero__backdrop{display:none}}.blog-hero__content{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:1.25rem}.blog-hero__title{font-size:clamp(2.5rem,6vw,4rem);font-weight:800;letter-spacing:-.03em;line-height:1.1;margin:0}.blog-hero__description{max-width:55ch;font-size:clamp(1.05rem,2vw,1.2rem);line-height:1.6;margin:0}.blog-filters{position:sticky;top:var(--nav-height, 5rem);z-index:10;background:color-mix(in srgb,var(--surface-page) 92%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--border-soft);padding:1.25rem 0}.blog-filters__row{display:flex;align-items:center;gap:.5rem;max-width:var(--layout-max-width, 80rem);margin:0 auto;padding:0 var(--layout-gutter, 1.5rem);overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}.blog-filters__row::-webkit-scrollbar{display:none}.blog-filters__row+.blog-filters__row{margin-top:.75rem}.blog-filters__label{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--text-tertiary);white-space:nowrap;flex-shrink:0;padding-right:.25rem}.blog-filters__pills{display:flex;align-items:center;gap:.5rem;flex-wrap:nowrap}.filter-pill{display:inline-flex;align-items:center;justify-content:center;padding:.4rem 1rem;border-radius:.6rem;font-size:.82rem;font-weight:500;white-space:nowrap;text-decoration:none;cursor:pointer;transition:background .18s ease,color .18s ease,border-color .18s ease,box-shadow .18s ease;border:1px solid var(--border-soft);background:var(--surface-page);color:var(--text-secondary);flex-shrink:0}.filter-pill:hover{border-color:color-mix(in srgb,var(--text-brand) 50%,transparent);color:var(--text-brand);background:color-mix(in srgb,var(--text-brand) 5%,var(--surface-page))}.filter-pill--active{background:var(--text-brand);border-color:var(--text-brand);color:#fff;box-shadow:0 1px 4px color-mix(in srgb,var(--text-brand) 30%,transparent)}.filter-pill--active:hover{color:#fff;background:color-mix(in srgb,var(--text-brand) 88%,#000)}.filter-pill--tag{font-size:.78rem;padding:.35rem .85rem;border-radius:999px;background:transparent}.filter-pill--tag.filter-pill--active{border-radius:999px}.blog-grid{--section-padding: clamp(2rem, 6vw, 4rem)}.blog-grid__list{display:grid;gap:2rem;grid-template-columns:repeat(auto-fill,minmax(min(100%,340px),1fr))}.blog-grid__empty,.blog-grid__empty-filtered{text-align:center;padding:4rem 2rem;font-size:1.1rem}.blog-article{--layout-container-width: 56rem}.blog-article__cover{position:relative;width:100%;max-height:480px;overflow:hidden}.blog-article__cover-img{width:100%;height:100%;object-fit:cover;max-height:480px}.blog-article__cover-overlay{position:absolute;inset:0;background:linear-gradient(to top,var(--surface-page) 0%,transparent 50%);pointer-events:none}.blog-article__header{margin-top:-2rem;position:relative;z-index:1;display:flex;flex-direction:column;padding-bottom:2.5rem;margin-bottom:2.5rem;border-bottom:1px solid var(--border-soft)}.blog-article__back{display:inline-flex;align-items:center;gap:.4rem;font-size:.85rem;font-weight:500;color:var(--text-tertiary);text-decoration:none;transition:color .2s ease;margin-bottom:1.5rem;width:fit-content}.blog-article__back:hover{color:var(--text-brand)}.blog-article__category-badge{display:inline-block;width:fit-content;font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--text-brand);background:color-mix(in srgb,var(--text-brand) 10%,transparent);padding:.3rem .85rem;border-radius:999px;text-decoration:none;transition:background .2s ease;margin-bottom:1rem}.blog-article__category-badge:hover{background:color-mix(in srgb,var(--text-brand) 18%,transparent)}.blog-article__title{font-size:clamp(2.25rem,5vw,3rem);font-weight:800;letter-spacing:-.03em;line-height:1.1;margin:0;color:var(--text-primary)}.blog-article__subtitle{font-size:1.15rem;line-height:1.65;margin:.75rem 0 0;max-width:60ch}.blog-article__meta{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1rem;font-size:.82rem;color:var(--text-tertiary);margin-top:1.5rem;padding-top:1.5rem;border-top:1px solid var(--border-soft)}.blog-article__date,.blog-article__reading-time,.blog-article__author{display:inline-flex;align-items:center;gap:.3rem}.blog-article__meta>*:not(:last-child):after{content:"·";margin-left:.5rem;color:var(--border-strong)}.blog-article__body{padding-bottom:var(--section-padding-default)}.blog-article__body .content-body{max-width:none}.blog-article__tags{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;padding-bottom:2.5rem;border-top:1px solid var(--border-soft);padding-top:1.5rem}.blog-article__tags-label{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--text-tertiary);margin-right:.25rem}.blog-article__tag{display:inline-flex;align-items:center;padding:.25rem .65rem;border-radius:999px;font-size:.78rem;font-weight:500;color:var(--text-secondary);border:1px solid var(--border-soft);background:transparent}.blog-article__post-footer{display:flex;align-items:center;justify-content:space-between;gap:2rem;padding-top:1.5rem;padding-bottom:2rem;border-top:1px solid var(--border-soft)}.blog-article__post-footer-left{flex-shrink:0}.blog-article__post-footer-right{flex:1;max-width:480px}@media(max-width:768px){.blog-article__post-footer{flex-direction:column;align-items:flex-start;gap:1.25rem}.blog-article__post-footer-right{max-width:none;width:100%}}.callout{margin:1.5em 0;padding:1.25rem 1.5rem;border-radius:1rem;border-left:4px solid;font-size:.98rem;line-height:1.65}.callout--info{background:#3b82f614;border-left-color:var(--brand-400);color:var(--text-secondary)}.callout--warning{background:#facc1514;border-left-color:var(--color-warning-400);color:var(--text-secondary)}.callout--tip{background:#10b98114;border-left-color:var(--accent-400);color:var(--text-secondary)}.callout--danger{background:#ef444414;border-left-color:var(--color-error-500, #ef4444);color:var(--text-secondary)}:root[data-theme=dark] .callout--info{background:#3b82f61f}:root[data-theme=dark] .callout--warning{background:#facc151f}:root[data-theme=dark] .callout--tip{background:#10b9811f}:root[data-theme=dark] .callout--danger{background:#ef44441f}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .callout--info{background:#3b82f61f}:root:not([data-theme=light]) .callout--warning{background:#facc151f}:root:not([data-theme=light]) .callout--tip{background:#10b9811f}:root:not([data-theme=light]) .callout--danger{background:#ef44441f}}
