/* 4th of July Theme — Red, white & blue patriotic */

:root {
    --color-ink: #002868;
    --color-paper: #f8f9fa;
    --color-rule: #dce3f0;
    --color-rule-light: #e8ecf4;
    --color-accent: #b22234;
    --color-accent-dark: #8b1a29;
    --color-muted: #5a6d8a;
    --color-navy: #0a1628;
    --color-navy-light: #002868;
    --color-card: #ffffff;
}

body { background: #f8f9fa; color: var(--color-ink); }

a { color: #002868; }
a:hover { color: #b22234; }

/* Masthead */
.masthead {
    background: #0a1628;
    border-bottom: 4px solid #b22234;
    position: relative;
}
.masthead-title a { color: #fff !important; }
.masthead-subtitle { color: rgba(255,255,255,0.7); }
.masthead::before {
    content: '';
    position: absolute;
    bottom: -8px; left: 0; right: 0;
    height: 4px;
    background: #002868;
}

/* Nav */
.category-nav { background: #002868; }
.category-nav .cat-link:hover { border-bottom-color: #fff; }
.category-nav .cat-link.active { color: #fff; border-bottom-color: #fff; }

/* Hero */
.hero-featured { background: #0a1628; }
.hero-featured::before { background: linear-gradient(135deg, transparent, rgba(178,34,52,0.08)); }
.hero-featured .grid-category { color: #b22234; }
.hero-featured .hero-headline a { color: #fff; }
.hero-featured .hero-headline a:hover { color: #ffd700; }

/* Sidebar */
.sidebar-story { border-color: var(--color-rule); }
.sidebar-story .sidebar-headline a { color: #002868; }
.sidebar-story .sidebar-headline a:hover { color: #b22234; }

/* Story Cards */
.story-card { border-color: var(--color-rule); }
.story-card .card-headline a { color: #002868; }
.story-card .card-headline a:hover { color: #b22234; }

/* Grid */
.grid-headline a { color: #002868; }
.grid-headline a:hover { color: #b22234; }
.grid-category { color: #b22234; font-weight: 700; }
.section-label { color: #b22234; }
.section-label::after { background: var(--color-rule); }

/* Newsletter */
.newsletter-box { background: #0a1628; }
.newsletter-box button { background: #b22234; }
.newsletter-box button:hover { background: #8b1a29; }

/* Article page */
.article-page-headline { color: #002868; }
.article-content h2, .article-content h3 { color: #002868; }
.article-content blockquote { border-color: #b22234; }

/* Pagination */
.pagination .active .page-link { background: #002868; border-color: #002868; }
.pagination .page-link:hover { background: #dce3f0; }

/* Footer */
.newspaper-footer { background: #002868; border-top-color: #b22234; }

/* Stars on title */
.masthead-title a::before { content: '\2605 '; color: #b22234; font-size: 0.6em; }
.masthead-title a::after { content: ' \2605'; color: #b22234; font-size: 0.6em; }

/* --- Fireworks --- */
.masthead { overflow: hidden; }
.fireworks-container { position: absolute; top: 0; left: 0; right: 0; bottom: 0; pointer-events: none; overflow: hidden; }
.firework-spark {
    position: absolute; width: 3px; height: 3px; border-radius: 50%;
    box-shadow: 0 0 6px 2px currentColor;
    animation: spark-fade ease-out forwards;
}
@keyframes spark-fade {
    0%   { transform: translate(0, 0) scale(1); opacity: 1; }
    100% { transform: translate(var(--sx), var(--sy)) scale(0); opacity: 0; }
}