*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Roboto',sans-serif;line-height:1.7;color:#333;background:#f0f0f0;-webkit-font-smoothing:antialiased}
a{color:#333;text-decoration:none;transition:color .2s}
a:hover{color:#ef3636}
img{max-width:100%;height:auto;display:block}
.container{max-width:1100px;margin:0 auto;padding:0 20px}

/* HEADER */
.site-header{background:#fff;padding:15px 0;border-bottom:3px solid #ef3636}
.site-header .container{display:flex;align-items:center;justify-content:center}
.logo img{max-height:80px;width:auto}

/* MAIN NAV */
.main-nav{background:#333;position:sticky;top:0;z-index:100}
.main-nav .container{display:flex;flex-wrap:wrap;justify-content:center}
.main-nav a{color:#fff;font-size:.82rem;font-weight:500;padding:12px 14px;display:block;transition:background .2s}
.main-nav a:hover{background:#ef3636;color:#fff}

/* BREAKING NEWS */
.breaking-news{background:#fff;border-bottom:1px solid #eee;padding:8px 0}
.breaking-news .container{display:flex;align-items:center;gap:12px}
.bn-label{background:#ef3636;color:#fff;font-size:.78rem;font-weight:700;padding:4px 12px;white-space:nowrap;border-radius:2px}
.breaking-news ul{list-style:none;display:flex;gap:20px;overflow-x:auto;flex:1}
.breaking-news a{color:#333;font-size:.85rem}
.breaking-news a:hover{color:#ef3636}

/* LAYOUT */
.site-content{padding:25px 0}
.main-content{max-width:100%}

/* POST CARD */
.post-card{background:#fff;margin-bottom:20px;border-radius:4px;overflow:hidden;box-shadow:0 1px 2px rgba(0,0,0,.06);transition:box-shadow .2s}
.post-card:hover{box-shadow:0 3px 12px rgba(0,0,0,.1)}
.post-card-inner{display:flex;gap:20px;padding:20px}
.post-card .thumb{width:280px;flex-shrink:0}
.post-card .thumb img{width:100%;height:180px;object-fit:cover;border-radius:3px}
.post-card .info{flex:1;min-width:0}
.post-card .cat-tag{background:#ef3636;color:#fff;font-size:.7rem;font-weight:700;padding:2px 8px;border-radius:2px;text-transform:uppercase;display:inline-block;margin-bottom:8px}
.post-card .title{font-size:1.15rem;font-weight:600;line-height:1.4;margin-bottom:8px}
.post-card .title a{color:#333}
.post-card .title a:hover{color:#ef3636}
.post-card .excerpt{font-size:.88rem;color:#666;line-height:1.6;margin-bottom:10px}
.post-card .post-meta{font-size:.78rem;color:#999;display:flex;gap:15px;flex-wrap:wrap}
.read-more{display:inline-block;background:#ef3636;color:#fff;font-size:.8rem;font-weight:600;padding:5px 14px;border-radius:3px;margin-top:5px}
.read-more:hover{background:#d42e2e;color:#fff}

/* ARTICLE PAGE */
.article-page{background:#fff;border-radius:4px;padding:30px;box-shadow:0 1px 2px rgba(0,0,0,.06)}
.article-page .featured-img{margin:-30px -30px 25px;overflow:hidden}
.article-page .featured-img img{width:100%;max-height:500px;object-fit:cover}
.article-page .cat-tag{background:#ef3636;color:#fff;font-size:.75rem;font-weight:700;padding:3px 10px;border-radius:2px;text-transform:uppercase;display:inline-block;margin-bottom:12px}
.article-page h1{font-size:1.65rem;font-weight:700;line-height:1.35;margin-bottom:15px;color:#111}
.article-page .post-meta{font-size:.85rem;color:#999;display:flex;gap:15px;flex-wrap:wrap;padding-bottom:20px;margin-bottom:25px;border-bottom:1px solid #eee}
.article-page h2{font-size:1.3rem;font-weight:700;color:#222;margin:28px 0 14px;padding-top:8px}
.article-page h3{font-size:1.08rem;font-weight:600;color:#333;margin:22px 0 10px}
.article-page p{margin-bottom:16px;color:#444;font-size:.95rem;line-height:1.8}
.article-page figure{margin:22px 0;text-align:center}
.article-page figure img,.article-page p img{border-radius:4px;margin:0 auto}
.article-page ul,.article-page ol{margin:0 0 18px 24px;color:#444}
.article-page a{color:#ef3636}
.article-page a:hover{text-decoration:underline}

/* RELATED POSTS */
.related-posts{margin-top:35px;padding-top:25px;border-top:2px solid #ef3636}
.related-posts h2{font-size:1.1rem;font-weight:700;text-transform:uppercase;margin-bottom:20px;color:#222}
.related-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:15px}
.related-grid a{display:block;background:#f9f9f9;border-radius:4px;overflow:hidden;transition:box-shadow .2s}
.related-grid a:hover{box-shadow:0 3px 10px rgba(0,0,0,.1)}
.related-grid img{width:100%;height:130px;object-fit:cover}
.related-grid span{display:block;padding:10px;font-size:.85rem;font-weight:500;color:#333;line-height:1.3}

/* POST LIST */
.post-list{list-style:none}
.post-list li{padding:12px 0;border-bottom:1px solid #eee}
.post-list li:last-child{border-bottom:none}
.post-list a{font-size:1rem;font-weight:500;color:#333}
.post-list a:hover{color:#ef3636}

/* FOOTER */
.site-footer{background:#222;color:#999;padding:30px 0;text-align:center;font-size:.85rem;margin-top:30px}
.site-footer a{color:#ccc}

/* RESPONSIVE */
@media(max-width:768px){
  .post-card-inner{flex-direction:column}
  .post-card .thumb{width:100%}
  .post-card .thumb img{height:200px}
  .main-nav a{padding:10px 12px;font-size:.78rem}
  .article-page{padding:20px}
  .article-page .featured-img{margin:-20px -20px 20px}
  .article-page h1{font-size:1.35rem}
  .related-grid{grid-template-columns:repeat(2,1fr)}
}