body[data-page=home] .blog-entry{position:absolute;left:0;bottom:0;pointer-events:auto;color:var(--text)}
.blog-wheel-link{display:flex;align-items:center;gap:14px;padding:0 6px 0 0;min-height:84px;color:var(--text)}
.blog-vertical{writing-mode:vertical-rl;transform:rotate(180deg);font:600 12px var(--mono);letter-spacing:.18em}
.blog-wheel-link svg{width:84px;height:84px;overflow:visible;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.blog-wheel-link .wheel-rim{fill:none;stroke:currentColor;stroke-width:9}
.blog-wheel-link .wheel-spokes{fill:var(--bg);stroke:currentColor;stroke-width:4;stroke-linejoin:round}
.blog-wheel-link .wheel-badge{fill:currentColor;stroke:none}
.blog-wheel-link text{fill:var(--bg);font:600 13px var(--body);letter-spacing:-.8px}
.blog-entry:is(:hover,:focus-within) .blog-wheel-link svg{transform:rotate(125deg)}
.blog-hover{position:absolute;bottom:100%;left:0;width:min(390px,calc(100vw - 48px));padding:0 0 22px;z-index:70}
.blog-hover>a{display:block;border:1px solid var(--text);border-radius:22px;background:var(--bg);box-shadow:6px 6px 0 var(--border);padding:18px;color:var(--text);animation:blog-peek .24s ease-out}
.blog-hover img{display:block;width:100%;height:150px;object-fit:cover;object-position:center 45%;border-radius:10px}
.blog-hover-kicker{display:block;font:10px var(--mono);text-transform:uppercase;letter-spacing:.1em;color:var(--muted);margin:18px 0 8px}
.blog-hover strong{display:block;font:500 36px/1.05 var(--display);letter-spacing:-.055em}
.blog-hover p{font:15px/1.5 var(--body);margin:12px 0 22px;max-width:320px}
.blog-hover .blog-read{display:flex;justify-content:space-between;font:13px var(--body);padding-bottom:9px;border-bottom:1px solid var(--border)}
@keyframes blog-peek{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:760px){.blog-wheel-link{min-height:56px;gap:10px}.blog-wheel-link svg{width:56px;height:56px}.blog-vertical{font-size:10px}.blog-hover{display:none!important}}
@media(prefers-reduced-motion:reduce){.blog-wheel-link svg{transition:none}.blog-hover>a{animation:none}.blog-entry:is(:hover,:focus-within) .blog-wheel-link svg{transform:none}}
