.blog-hero{background:linear-gradient(135deg,color-mix(in oklab,var(--primary) 8%,transparent),transparent);text-align:center;padding:8rem 0 3rem}.blog-hero h1{letter-spacing:-.02em;margin:0 0 1rem;font-size:clamp(2.25rem,4vw,3.5rem)}.blog-hero p{max-width:640px;color:color-mix(in oklab,var(--foreground) 70%,transparent);margin:0 auto;font-size:1.125rem}.blog-grid{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem;padding:4rem 0 6rem;display:grid}.blog-card{background:var(--card);border:1px solid color-mix(in oklab,var(--foreground) 8%,transparent);color:inherit;border-radius:16px;flex-direction:column;text-decoration:none;transition:transform .25s,box-shadow .25s,border-color .25s;display:flex;overflow:hidden}.blog-card:hover{box-shadow:0 18px 40px -20px color-mix(in oklab,var(--primary) 35%,transparent);border-color:color-mix(in oklab,var(--primary) 30%,transparent);transform:translateY(-4px)}.blog-card-cover{background:linear-gradient(135deg,var(--primary),color-mix(in oklab,var(--primary) 60%,var(--background)));height:160px;position:relative}.blog-card-cover .blog-card-category{background:var(--background);color:var(--primary);letter-spacing:.02em;border-radius:999px;padding:.35rem .75rem;font-size:.75rem;font-weight:600;position:absolute;top:1rem;left:1rem}.blog-card-body{flex-direction:column;flex:1;gap:.75rem;padding:1.5rem;display:flex}.blog-card-meta{color:color-mix(in oklab,var(--foreground) 55%,transparent);font-size:.85rem}.blog-card h2{letter-spacing:-.01em;margin:0;font-size:1.25rem;line-height:1.3}.blog-card-excerpt{color:color-mix(in oklab,var(--foreground) 75%,transparent);flex:1;font-size:.95rem;line-height:1.55}.blog-card-link{color:var(--primary);margin-top:auto;font-size:.95rem;font-weight:600}
