.blog-index{width:min(100% - clamp(2rem,6vw,6rem),1360px);min-height:100vh;margin:0 auto;padding:10.5rem 0 7rem}.blog-index:before{z-index:-1;background:radial-gradient(circle at 76% 18%, #5d52ff38, transparent 26%), var(--midnight);content:"";height:min(700px,72vh);position:absolute;top:0;left:0;right:0}.blog-index-header{border-bottom:1px solid #cfd7ff3d;grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr);align-items:center;gap:clamp(2rem,5vw,5rem);min-height:470px;margin-bottom:4rem;padding-bottom:3rem;display:grid}.blog-index-copy{min-width:0}.blog-index-header h1{color:#0000;letter-spacing:-.075em;background:linear-gradient(112deg,#fff 32%,#aaa5ff 82%);-webkit-background-clip:text;background-clip:text;max-width:950px;margin-bottom:1rem;font-size:clamp(4rem,8vw,8rem);line-height:.92}.blog-index-header p{color:#ebefffad;max-width:620px;font-size:1.08rem}.blog-count{width:fit-content;color:var(--accent);white-space:nowrap;flex:none;margin-top:1.5rem;padding-bottom:.35rem;font-size:.78rem;font-weight:700;display:block}.blog-hero-visual{aspect-ratio:4/3;min-height:380px;transform:rotate(-1deg)}.featured-post{border-bottom:1px solid var(--border-color);grid-template-columns:minmax(0,1.35fr) minmax(340px,.65fr);gap:clamp(2rem,5vw,5rem);margin-bottom:4rem;padding-bottom:4rem;display:grid}.featured-post-media,.post-card-media{background:var(--card-bg);position:relative;overflow:hidden}.featured-post-media{aspect-ratio:16/9;box-shadow:var(--shadow-soft);border-radius:20px}.featured-post-media:after,.post-card-media:after{border-radius:inherit;content:"";pointer-events:none;border:1px solid #ffffff2e;position:absolute;inset:0}.featured-post-media img,.post-card-media img{object-fit:cover;width:100%;height:100%;transition:transform .8s cubic-bezier(.16,1,.3,1)}.featured-post:hover img,.post-card:hover img{transform:scale(1.045)}.post-image-placeholder{background:radial-gradient(circle at 65% 35%, #46cfff40, transparent 22%), radial-gradient(circle at 36% 66%, #776cff57, transparent 30%), var(--midnight);height:100%;color:var(--accent);font-family:var(--font-display);place-items:center;font-size:4.5rem;font-weight:650;display:grid}.featured-post-content{align-self:center}.post-category{color:color-mix(in srgb, var(--violet) 85%, var(--foreground));margin-bottom:1rem;font-size:.76rem;font-weight:750;display:block}.featured-post h2{margin-bottom:1.2rem;font-size:clamp(2.1rem,3.6vw,4rem);line-height:1.08}.featured-post-content>p{margin-bottom:1.4rem;font-size:1rem}.post-card-meta{color:var(--text-secondary);flex-wrap:wrap;gap:1rem;font-size:.76rem;display:flex}.post-card-meta span{align-items:center;gap:.42rem;display:flex}.read-link{width:fit-content;color:color-mix(in srgb, var(--violet) 82%, var(--foreground));align-items:center;gap:.55rem;margin-top:2rem;font-weight:750;display:flex}.read-link svg{transition:transform .3s}.featured-post:hover .read-link svg{transform:translate(-3px,-3px)}.post-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1.5rem,3vw,2.5rem);display:grid}.post-card{display:block}.post-card-media{aspect-ratio:16/10;border-radius:14px;margin-bottom:1.35rem}.post-card-body h2{margin-bottom:.7rem;font-size:1.4rem;line-height:1.34;transition:color .25s}.post-card:hover h2{color:var(--violet)}.post-card-body>p{-webkit-line-clamp:2;-webkit-box-orient:vertical;margin-bottom:1rem;font-size:.92rem;display:-webkit-box;overflow:hidden}.blog-empty{text-align:center;padding:6rem 1rem}.blog-empty span{border:1px solid var(--border-color);background:var(--card-bg);width:70px;height:70px;color:var(--violet);font-family:var(--font-display);border-radius:50%;place-items:center;margin:0 auto 1rem;font-size:2rem;font-weight:650;display:grid}@media (max-width:900px){.blog-index-header{grid-template-columns:1fr}.blog-hero-visual{max-width:760px;transform:none}.featured-post{grid-template-columns:1fr}.featured-post-content{max-width:760px}.post-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:620px){.blog-index{padding-top:8rem}.blog-index-header{align-items:start;min-height:400px}.blog-index-header h1{font-size:clamp(3.5rem,16vw,5.4rem)}.blog-hero-visual{min-height:285px}.featured-post{gap:1.5rem}.featured-post-media{border-radius:14px}.post-grid{grid-template-columns:1fr}}