.blog-container{max-width:48rem;margin:0 auto;padding:1rem;font-family:var(--font-serif);color:#f5f5f5;background-color:#121212}@media (min-width:768px){.blog-container{padding:2rem}}.blog-list{list-style:none;margin-top:2rem;padding:0;display:grid;gap:2rem}.blog-list a{display:block;text-decoration:none;color:inherit}.blog-list a:hover{color:var(--accent-hover)}.blog-image{width:100%;height:auto;border-radius:.5rem;margin-bottom:1rem}.blog-post,.blog-post p,.blog-post section{background-color:transparent;color:inherit}.blog-post section+section{margin-top:2rem}.blog-post h1{margin-bottom:1.5rem;color:#f5f5f5}.blog-post h2{margin-top:1.5rem;margin-bottom:.75rem;color:#f5f5f5}.blog-post p{white-space:pre-line;margin-bottom:1rem}.comments-section{margin-top:3rem;padding-top:2rem;border-top:1px solid hsla(0,0%,96%,.1);display:flex;flex-direction:column;gap:1.5rem}.comments-section h3{font-size:1.5rem;margin:0}.comments-list{list-style:none;margin:0;padding:0;display:grid;gap:1rem}.comment{padding:1rem;border-radius:.75rem;background:hsla(0,0%,100%,.03);border:1px solid hsla(0,0%,100%,.05)}.comment-meta{display:flex;flex-wrap:wrap;align-items:baseline;gap:.5rem;margin-bottom:.5rem;color:hsla(0,0%,96%,.7);font-size:.85rem;letter-spacing:.02em;text-transform:uppercase}.comment-author{font-weight:600;color:#f5f5f5}.comment-text{margin:0;color:hsla(0,0%,96%,.9);line-height:1.6}.comment-empty{color:hsla(0,0%,96%,.6);font-style:italic}.comment-form{display:flex;flex-direction:column;gap:.75rem}.comment-input{width:100%;padding:.75rem 1rem;border-radius:.75rem;border:1px solid hsla(0,0%,100%,.08);background:hsla(0,0%,7%,.9);color:#f5f5f5;resize:vertical;font-family:inherit;line-height:1.5}.comment-input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 2px hsla(0,0%,100%,.05)}.comment-submit{align-self:flex-end;padding:.6rem 1.5rem;border-radius:9999px;border:none;background:var(--accent);color:#0b0b0b;font-weight:600;cursor:pointer;transition:background .2s ease,transform .2s ease}.comment-submit:disabled{background:hsla(0,0%,96%,.2);color:hsla(0,0%,7%,.6);cursor:not-allowed}.comment-submit:not(:disabled):hover{transform:translateY(-1px);background:var(--accent-hover)}.comment-error{color:#ff8585;font-size:.9rem}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}