:root {
    --ni-primary: #c8102e;
    --ni-dark: #12151c;
    --ni-accent: #0d6efd;
    --ni-muted: #6c757d;
    --ni-bg: #f4f5f7;
}

body {
    font-family: 'Inter', system-ui, -apple-system, sans-serif;
    color: #1a1d24;
    background: var(--ni-bg);
    overflow-x: hidden;
}

a { text-decoration: none; }

.btn-primary,
.bg-primary { background-color: var(--ni-primary) !important; border-color: var(--ni-primary) !important; }
.btn-primary:hover { background-color: #a30d25 !important; border-color: #a30d25 !important; }
.text-primary { color: var(--ni-primary) !important; }

/* ---------------- Header ---------------- */
.site-logo .logo-text { font-family: 'Inter', sans-serif; font-weight: 800; font-size: 1.9rem; color: var(--ni-dark); letter-spacing: -0.5px; }
.logo-accent { color: var(--ni-primary); }
.header-search { max-width: 360px; width: 100%; }
.header-search .form-control {
    border-right: 0;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}
.header-search .form-control:focus { box-shadow: none; border-color: var(--ni-primary); }
.header-search .btn {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    padding-inline: 1rem;
}
.main-nav { background: var(--ni-primary); }
.main-nav .nav-link { color: rgba(255,255,255,0.9); font-weight: 600; font-size: 0.9rem; text-transform: uppercase; letter-spacing: 0.3px; padding: 0.75rem 0.9rem; }
.main-nav .nav-link:hover,
.main-nav .nav-link.active { color: #fff; }

/* Ticker */
.news-ticker { padding: 0.5rem 0; overflow: hidden; }
.ticker-label { background: var(--ni-dark); color: #fff; font-weight: 700; font-size: 0.75rem; padding: 0.25rem 0.7rem; border-radius: 3px; white-space: nowrap; margin-right: 1rem; }
.ticker-viewport { overflow: hidden; flex: 1; }
.ticker-track { display: inline-flex; white-space: nowrap; animation: ticker 40s linear infinite; }
.ticker-item { color: #333; font-size: 0.9rem; font-weight: 500; padding: 0 0.5rem; }
.ticker-item:hover { color: var(--ni-primary); }
.ticker-sep { color: var(--ni-primary); }
@keyframes ticker { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }

/* Breaking */
.breaking-news { background: #fff; border: 1px solid #eee; border-radius: 6px; overflow: hidden; }
.breaking-label { background: var(--ni-primary); color: #fff; font-weight: 700; padding: 0.6rem 1rem; white-space: nowrap; font-size: 0.85rem; }
.breaking-track-viewport { overflow: hidden; flex: 1; }
.breaking-track { display: inline-flex; white-space: nowrap; animation: ticker 35s linear infinite; padding: 0.6rem 0; }
.breaking-item { color: #222; font-weight: 600; padding: 0 2rem; position: relative; }
.breaking-item:hover { color: var(--ni-primary); }

/* ---------------- Section titles ---------------- */
.section-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1.25rem; border-bottom: 2px solid #e6e6e6; padding-bottom: 0.5rem; }
.section-title { font-size: 1.25rem; font-weight: 800; margin: 0; display: flex; align-items: center; }
.title-bar { display: inline-block; width: 5px; height: 22px; background: var(--ni-primary); margin-right: 10px; border-radius: 2px; }
.see-all { font-size: 0.85rem; font-weight: 600; color: var(--ni-primary); }
.page-title { font-size: 1.9rem; font-weight: 800; display: flex; align-items: center; }

/* ---------------- Article card ---------------- */
.article-card { background: #fff; border-radius: 8px; overflow: hidden; box-shadow: 0 1px 4px rgba(0,0,0,0.06); transition: transform .2s, box-shadow .2s; display: flex; flex-direction: column; }
.article-card:hover { transform: translateY(-3px); box-shadow: 0 8px 20px rgba(0,0,0,0.1); }
.article-card .card-img-link { position: relative; display: block; aspect-ratio: 16/9; overflow: hidden; }
.article-card .card-img-top { width: 100%; height: 100%; object-fit: cover; }
.card-category { position: absolute; top: 10px; left: 10px; background: var(--ni-primary); color: #fff; font-size: 0.7rem; font-weight: 700; text-transform: uppercase; padding: 0.2rem 0.55rem; border-radius: 3px; }
.article-card .card-body { padding: 0.9rem 1rem 1.1rem; flex: 1; display: flex; flex-direction: column; }
.article-card .card-title { font-size: 1.05rem; font-weight: 700; line-height: 1.35; margin-bottom: 0.5rem; }
.article-card .card-title a { color: #16181d; }
.article-card .card-title a:hover { color: var(--ni-primary); }
.article-card .card-text { font-size: 0.85rem; color: var(--ni-muted); flex: 1; }
.card-meta { font-size: 0.78rem; color: var(--ni-muted); margin-top: 0.5rem; }
.card-meta .meta-author { color: var(--ni-primary); font-weight: 600; }
.card-meta .meta-date { margin-top: 0.15rem; }
.meta-dot { margin: 0 0.35rem; }

/* Featured */
.featured-article { position: relative; border-radius: 8px; overflow: hidden; height: 100%; }
.featured-link { display: block; height: 100%; position: relative; }
.featured-article img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}
/* Fixed heights so the image always crops cleanly (no stretching) */
.featured-lg, .featured-lg .featured-link { height: 440px; }
.featured-md, .featured-md .featured-link { height: 300px; }
.featured-sm, .featured-sm .featured-link { height: 160px; }
.featured-overlay { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: flex-end; padding: 1.25rem; background: linear-gradient(to top, rgba(0,0,0,0.85) 0%, rgba(0,0,0,0.1) 70%, transparent 100%); color: #fff; }
.featured-category { align-self: flex-start; background: var(--ni-primary); font-size: 0.7rem; font-weight: 700; text-transform: uppercase; padding: 0.2rem 0.6rem; border-radius: 3px; margin-bottom: 0.5rem; }
.featured-title { font-size: 1.5rem; font-weight: 800; line-height: 1.25; color: #fff; }
.featured-sm .featured-title { font-size: 1rem; }
.featured-md .featured-title { font-size: 1.2rem; }
.featured-excerpt { font-size: 0.9rem; opacity: 0.85; }
.featured-meta { font-size: 0.78rem; opacity: 0.85; margin-top: 0.35rem; }

/* List item */
.list-item-img { flex: 0 0 110px; aspect-ratio: 4/3; border-radius: 6px; overflow: hidden; }
.list-item-img img { width: 100%; height: 100%; object-fit: cover; }
.list-item-body { flex: 1; }
.list-item-cat { font-size: 0.7rem; font-weight: 700; text-transform: uppercase; color: var(--ni-primary); }
.list-item-title { font-size: 0.98rem; font-weight: 700; line-height: 1.35; margin: 0.2rem 0; }
.list-item-title a { color: #16181d; }
.list-item-title a:hover { color: var(--ni-primary); }
.list-item-meta { font-size: 0.75rem; color: var(--ni-muted); }

/* Sidebar */
.sidebar-widget { background: #fff; border-radius: 8px; padding: 1.25rem; margin-bottom: 1.5rem; box-shadow: 0 1px 4px rgba(0,0,0,0.05); }
.sidebar-widget .section-title { font-size: 1.05rem; border-bottom: 2px solid #eee; padding-bottom: 0.5rem; margin-bottom: 1rem; }
.popular-rank { font-size: 1.6rem; font-weight: 800; color: #e2e2e2; line-height: 1; }
.popular-title { font-size: 0.92rem; font-weight: 700; margin: 0 0 0.2rem; }
.popular-title a { color: #16181d; }
.popular-title a:hover { color: var(--ni-primary); }
.popular-meta { font-size: 0.75rem; color: var(--ni-muted); }
.editor-pick-img { flex: 0 0 80px; aspect-ratio: 1; border-radius: 6px; overflow: hidden; }
.editor-pick-img img { width: 100%; height: 100%; object-fit: cover; }
.editor-pick-badge { font-size: 0.65rem; font-weight: 700; color: #d39e00; text-transform: uppercase; }
.editor-pick-title { font-size: 0.9rem; font-weight: 700; margin: 0.2rem 0; }
.editor-pick-title a { color: #16181d; }

/* Hot news list */
.hot-news-list { padding-left: 1.1rem; margin: 0; }
.hot-news-list li { margin-bottom: 0.6rem; font-weight: 600; }
.hot-news-list a { color: #16181d; }
.hot-news-list a:hover { color: var(--ni-primary); }

/* Tags */
.tag-cloud { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.tag-chip { display: inline-block; background: #eef0f3; color: #444; font-size: 0.78rem; padding: 0.25rem 0.6rem; border-radius: 20px; }
.tag-chip:hover { background: var(--ni-primary); color: #fff; }

/* Newsletter (sidebar / light context only) */
.newsletter-box:not(.newsletter-compact) { background: #fff; }
.newsletter-sidebar .newsletter-box { padding: 0; }
.newsletter-title { font-weight: 800; font-size: 1.1rem; }
.newsletter-desc { font-size: 0.85rem; color: var(--ni-muted); }
.newsletter-box:not(.newsletter-compact) .newsletter-form .input-group { border-radius: 8px; overflow: hidden; box-shadow: 0 1px 3px rgba(0,0,0,0.08); }
.newsletter-box:not(.newsletter-compact) .newsletter-form .form-control { border: 1px solid #dfe3e8; height: 46px; }
.newsletter-box:not(.newsletter-compact) .newsletter-form .form-control:focus { box-shadow: none; border-color: var(--ni-primary); }
.newsletter-box:not(.newsletter-compact) .newsletter-form .btn { height: 46px; font-weight: 600; padding-inline: 1.1rem; white-space: nowrap; }

/* Newsletter (footer / dark compact context) */
.newsletter-compact { background: transparent !important; padding: 0 !important; }
.newsletter-compact .newsletter-form .form-control {
    display: block !important;
    width: 100% !important;
    height: 44px !important;
    padding: 0.5rem 0.75rem !important;
    border: 1px solid rgba(255, 255, 255, 0.18) !important;
    background: rgba(255, 255, 255, 0.06) !important;
    color: #fff !important;
    border-radius: 8px !important;
}
.newsletter-compact .newsletter-form .form-control::placeholder { color: rgba(255, 255, 255, 0.45); }
.newsletter-compact .newsletter-form .form-control:focus {
    background: rgba(255, 255, 255, 0.1) !important;
    border-color: var(--ni-primary) !important;
    color: #fff !important;
    box-shadow: none !important;
}
.newsletter-compact .newsletter-form .btn {
    display: block;
    width: 100%;
    height: 44px;
    border-radius: 8px;
    font-weight: 600;
}
.newsletter-compact .alert { border-radius: 8px; }

/* ---------------- Single article ---------------- */
.single-article .article-category-badge { display: inline-block; background: var(--ni-primary); color: #fff; font-size: 0.75rem; font-weight: 700; text-transform: uppercase; padding: 0.25rem 0.7rem; border-radius: 3px; }
.article-title { font-family: 'Merriweather', serif; font-size: 2.1rem; font-weight: 700; line-height: 1.25; margin-top: 0.75rem; }
.author-avatar { border-radius: 50%; object-fit: cover; }
.author-name { font-weight: 600; color: #16181d; }
.article-meta { font-size: 0.85rem; color: var(--ni-muted); }
.article-featured-img { width: 100%; max-height: 460px; object-fit: cover; }
.article-content { font-size: 1.08rem; line-height: 1.85; color: #2a2d34; }
.article-content p { margin-bottom: 1.2rem; }
.article-tags { display: flex; flex-wrap: wrap; gap: 0.4rem; }

/* Social share */
.social-share .share-label { font-weight: 600; font-size: 0.9rem; }
.share-btn { width: 38px; height: 38px; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; color: #fff; border: none; }
.share-fb { background: #1877f2; } .share-tw { background: #000; } .share-wa { background: #25d366; } .share-li { background: #0a66c2; } .share-copy { background: #6c757d; }
.share-btn:hover { opacity: 0.85; color: #fff; }

/* Prev/Next */
.prev-next-link { display: block; padding: 0.75rem 1rem; background: #fff; border-radius: 6px; box-shadow: 0 1px 3px rgba(0,0,0,0.06); }
.pn-label { display: block; font-size: 0.75rem; color: var(--ni-primary); font-weight: 700; text-transform: uppercase; }
.pn-title { font-weight: 600; color: #16181d; font-size: 0.9rem; }

/* Comments */
.comment { display: flex; gap: 0.85rem; margin-bottom: 1.5rem; }
.comment-avatar { flex: 0 0 42px; height: 42px; border-radius: 50%; background: var(--ni-primary); color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 700; }
.comment-body { background: #fff; border-radius: 8px; padding: 0.85rem 1rem; flex: 1; box-shadow: 0 1px 3px rgba(0,0,0,0.05); }
.comment-head { display: flex; justify-content: space-between; margin-bottom: 0.35rem; }
.comment-reply { margin-left: 0; }

/* Breadcrumb */
.site-breadcrumb { background: #fff; border-bottom: 1px solid #eee; padding: 0.6rem 0; }
.site-breadcrumb .breadcrumb-item a { color: var(--ni-primary); }

/* Advertisement */
.advertisement { background: #fafafa; border: 1px dashed #ddd; border-radius: 6px; padding: 0.75rem; }
.ad-label { display: block; font-size: 0.65rem; color: #aaa; text-transform: uppercase; letter-spacing: 1px; margin-bottom: 0.35rem; }

/* Footer */
.footer-brand { font-weight: 800; font-size: 1.5rem; }
.footer-heading { font-weight: 700; text-transform: uppercase; font-size: 0.85rem; letter-spacing: 0.5px; margin-bottom: 1rem; }
.footer-links a { color: rgba(255,255,255,0.65); font-size: 0.9rem; line-height: 2; }
.footer-links a:hover { color: #fff; }
.social-btn { width: 36px; height: 36px; border-radius: 50%; background: rgba(255,255,255,0.12); color: #fff; display: inline-flex; align-items: center; justify-content: center; }
.social-btn:hover { background: var(--ni-primary); color: #fff; }
.social-btn-dark { background: #eef0f3; color: #333; }

/* Author profile */
.author-profile-img, .author-profile-img { border-radius: 50%; object-fit: cover; }

/* Back to top */
.back-to-top { position: fixed; bottom: 24px; right: 24px; width: 44px; height: 44px; border-radius: 50%; display: none; z-index: 1030; padding: 0; }
.back-to-top.show { display: inline-flex; align-items: center; justify-content: center; }

@media (max-width: 991px) {
    .article-title { font-size: 1.6rem; }
    .featured-lg, .featured-lg .featured-link { height: 300px; }
}