.blog-index{background:var(--soft-grey);min-height:100vh;color:var(--ink)}.blog-index .site-header-slot{background:var(--ink);color:var(--white)}.blog-index-opening{background:var(--ink);color:var(--white);padding:88px 0 80px}.blog-index-opening h1{letter-spacing:-2px;font-size:clamp(64px,6vw,92px);line-height:1}.blog-index-opening p{max-width:640px;color:var(--soft-grey);margin-top:28px;font-size:20px;line-height:1.5}.blog-index-posts{grid-template-columns:repeat(3,minmax(0,1fr));gap:32px 24px;padding-top:48px;padding-bottom:104px;display:grid}.blog-index-posts>article{min-width:0}.blog-index-card{background:var(--white);cursor:pointer;border:1px solid #0f111214;border-radius:16px;flex-direction:column;height:100%;transition:transform .18s,box-shadow .18s,border-color .18s;display:flex;overflow:hidden;box-shadow:0 2px 4px #0f111205}.blog-index-card-cover{aspect-ratio:16/9;object-fit:cover;flex-shrink:0;width:100%;height:auto;display:block}.blog-index-card-copy{flex-direction:column;flex:1;padding:24px;display:flex}.blog-index-card:focus-visible{outline:3px solid var(--violet);outline-offset:4px}.blog-index-card-meta{color:var(--hard-grey);margin-bottom:12px;font-size:14px;line-height:1.5}.blog-index-card h2{letter-spacing:-2px;text-wrap:balance;font-size:30px;line-height:1.15}.blog-index-card-copy>p{color:var(--hard-grey);margin-top:16px;font-size:17px;line-height:1.6}.blog-index-card-bottom{align-items:center;gap:10px;margin-top:auto;padding-top:24px;font-size:14px;line-height:1.5;display:flex}.blog-index-card-avatar{object-fit:cover;border-radius:50%;flex-shrink:0;width:32px;height:32px}@media (hover:hover) and (pointer:fine){.blog-index-card:hover{border-color:#a85cff80;transform:translateY(-4px);box-shadow:0 12px 28px #0f111212}}@media (prefers-reduced-motion:reduce){.blog-index-card{transition:none}.blog-index-card:hover{transform:none}}@media (max-width:1000px){.blog-index-posts{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:620px){.blog-index-opening{padding:64px 0 56px}.blog-index-opening h1{font-size:clamp(44px,12vw,64px)}.blog-index-opening p{font-size:18px}.blog-index-posts{grid-template-columns:1fr;gap:24px;padding-top:32px;padding-bottom:64px}.blog-index-card-copy{padding:20px}.blog-index-card-meta{font-size:13px}.blog-index-card h2{font-size:32px}.blog-index-card-copy>p{margin-top:16px;font-size:17px}.blog-index-card-bottom{padding-top:20px;font-size:13px}}
