.blog-page{background:var(--color-black)}.blog-hero{padding:calc(var(--header-height) + var(--space-2xl)) var(--space-lg) var(--space-2xl);background:linear-gradient(135deg, var(--color-charcoal) 0%, var(--color-black) 100%);color:var(--color-white);text-align:center}.blog-hero h1{max-width:22ch;margin:0 auto var(--space-md);font-size:var(--text-4xl);margin-bottom:var(--space-md);font-weight:700}.blog-hero p{font-size:var(--text-lg);max-width:600px;color:var(--color-gray-light);margin:0 auto}.blog-posts{padding:var(--space-2xl) var(--space-lg)}.posts-grid{gap:var(--space-xl);grid-template-columns:repeat(auto-fit,minmax(min(100%,18rem),1fr));max-width:1200px;margin:0 auto;display:grid}.post-card{background:var(--color-charcoal);border:1px solid var(--color-medium-gray);border-radius:var(--radius-lg);padding:var(--space-lg);flex-direction:column;transition:box-shadow .2s,border-color .2s;display:flex}.post-card:hover{border-color:#d4af378c;box-shadow:0 4px 12px #00000014}.post-meta{gap:var(--space-md);margin-bottom:var(--space-md);font-size:var(--text-sm);display:flex}.post-category{background:var(--color-gold-glow);color:var(--color-gold);border-radius:var(--radius-sm);padding:4px 8px;font-weight:600}.post-date{color:#a8a8a8}.post-title{font-size:var(--text-xl);margin-bottom:var(--space-md);font-weight:700;line-height:1.4}.post-title a{color:var(--color-white);text-decoration:none;transition:color .2s}.post-title a:hover{color:var(--color-gold)}.post-excerpt{color:var(--color-gray-light);margin-bottom:auto;line-height:1.6}.post-footer{margin-top:var(--space-lg);padding-top:var(--space-lg);border-top:1px solid var(--color-medium-gray);font-size:var(--text-sm);justify-content:space-between;align-items:center;display:flex}.read-time{color:#a8a8a8}.read-more{color:var(--color-gold-light);font-weight:600;text-decoration:none;transition:color .2s}.read-more:hover{color:var(--color-white)}@media (max-width:768px){.blog-hero h1{font-size:var(--text-2xl)}.posts-grid{gap:var(--space-lg);grid-template-columns:1fr}.post-footer{align-items:flex-start;gap:var(--space-md);flex-direction:column}}
