.blog-page{background:#0d0f13;color:#fff;min-height:100vh}
.blog-shell{width:min(1180px,calc(100% - 40px));margin:0 auto}
.blog-hero{padding:120px 0 64px}
.blog-hero h1,.article-hero h1{margin:0;font-size:clamp(3rem,8vw,7rem);line-height:.95;letter-spacing:-.05em}
.blog-hero p,.article-lead{max-width:720px;color:rgba(255,255,255,.68);font-size:clamp(1rem,1.5vw,1.2rem);line-height:1.65}
.blog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;padding-bottom:100px}
.blog-card{overflow:hidden;border:1px solid rgba(255,255,255,.08);border-radius:26px;background:#171a20}
.blog-card a{color:inherit;text-decoration:none}
.blog-card img{width:100%;aspect-ratio:16/10;object-fit:cover;display:block}
.blog-card-body{padding:26px}
.blog-card small,.article-meta{color:var(--accent,#f5c400);font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.blog-card h2{margin:10px 0 12px;font-size:1.6rem}
.blog-card p{margin:0;color:rgba(255,255,255,.66);line-height:1.6}
.article-hero{padding:110px 0 44px}
.article-cover{width:100%;max-height:760px;object-fit:cover;border-radius:28px;display:block}
.article-content{width:min(760px,calc(100% - 40px));margin:54px auto 100px;font-size:1.08rem;line-height:1.8;color:rgba(255,255,255,.82)}
.article-content h2{margin-top:2.2em;color:#fff}
.article-content a:not(.article-navigation a){color:var(--accent,#f5c400);text-decoration-thickness:1px;text-underline-offset:.22em}
.blog-back{display:inline-block;margin-top:22px;color:var(--accent,#f5c400);text-decoration:none;font-weight:700}
@media(max-width:900px){.blog-grid{grid-template-columns:1fr}}

.article-media{margin:42px 0}
.article-media img,.article-media video{width:100%;display:block;border-radius:22px;background:#000}
.article-media figcaption{margin-top:10px;color:rgba(255,255,255,.5);font-size:.9rem;line-height:1.5}
.article-video{aspect-ratio:16/9;object-fit:contain}
.article-video-frame{padding:10px;border:1px solid rgba(255,255,255,.1);border-radius:26px;background:linear-gradient(145deg,rgba(245,196,0,.12),rgba(255,255,255,.035))}
.article-video-frame .article-video{border-radius:18px}
.article-pullquote{margin:42px 0;padding:26px 28px;border-left:4px solid var(--accent,#f5c400);border-radius:0 18px 18px 0;background:rgba(245,196,0,.08);color:#fff;font-size:clamp(1.25rem,3vw,1.65rem);font-weight:700;line-height:1.45}
.article-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin:42px 0}
.article-gallery img{width:100%;display:block;border-radius:20px}
.article-info{margin:42px 0;padding:24px;border:1px solid rgba(255,255,255,.1);border-radius:20px;background:rgba(255,255,255,.04)}
.article-info dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 24px;margin:0}
.article-info dt{color:rgba(255,255,255,.5);font-size:.82rem;text-transform:uppercase;letter-spacing:.08em}
.article-info dd{margin:4px 0 0;font-weight:700}
@media(max-width:700px){.article-gallery,.article-info dl{grid-template-columns:1fr}}

.blog-card-meta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}
.blog-card-date{
  color:rgba(255,255,255,.46);
  font-size:.82rem;
  white-space:nowrap;
}
@media(max-width:520px){
  .blog-card-meta{
    align-items:flex-start;
    flex-direction:column;
    gap:6px;
  }
}


.home-blog-grid{padding-bottom:28px}
.story-blog .blog-card h2{font-size:clamp(1.35rem,2vw,1.7rem)}
.story-blog .button-row{margin-top:6px}
.article-navigation{
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  gap:14px;
  margin-top:46px;
  padding-top:28px;
  border-top:1px solid rgba(255,255,255,.1)
}
.article-navigation a{
  color:var(--accent,#f5c400);
  text-decoration:none;
  font-weight:700
}
@media(max-width:700px){
  .article-navigation{flex-direction:column}
}
