/* ==========================================================
   NEWS — Ernest Bluff Daily
   "Your trusted local news source"

   Palette: Classic newspaper — black masthead, white body,
   red accent for urgency/breaking news
   Font: Playfair Display (editorial serif masthead),
   Roboto (clean body text)
   No image — solid dark masthead bar
   ========================================================== */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@700;900&display=swap');

.site-news {
    font-family: 'Roboto', 'Alegreya', sans-serif;

    /* Page background */
    --color-bg: #f5f5f0;
    --color-body-bg: #ffffff;

    /* Title bar — bold black masthead */
    --color-title-bar-bg: #1a1a1a;
    --color-title-bar-text: #ffffff;

    /* Header — no image, dark newsprint band */
    --color-header-bg: #2d2d2d;
    --header-image: url('/images/news.png');
    --header-height: 325px;

    /* Navigation — dark charcoal with red hover */
    --color-menu-bg: #333333;
    --color-menu-text: #f5f5f0;
    --color-menu-hover: #c0392b;
    --color-menu-hover-text: #ffffff;

    /* Container border */
    --color-container-border: #333333;

    /* Footer */
    --color-footer-bg: #1a1a1a;
    --color-footer-text: #b0b0b0;
    --color-helper-footer-bg: #111111;
    --color-helper-footer-text: #888888;
}


/* Title bar — editorial masthead styling */
.site-news .site-title-bar .title {
    font-family: 'Playfair Display', 'Alegreya', Georgia, serif;
    font-weight: 900;
    letter-spacing: 0.03em;
    font-size: clamp(1.4rem, 5vw, 2.4rem);
}

.site-news .site-title-bar .subtitle {
    font-family: 'Roboto', sans-serif;
    font-style: italic;
    font-weight: 300;
    letter-spacing: 0.05em;
    font-size: clamp(0.7rem, 2vw, 0.9rem);
    opacity: 0.8;
}


/* Header — thin red accent line below the dark band */
.site-news .header-image {
    background-size: cover;
    border-bottom: 4px solid #c0392b;
}


/* Menu buttons — underline hover effect */
.site-news .menu-button {
    font-family: 'Roboto', sans-serif;
    text-transform: uppercase;
    font-size: 1rem;
    letter-spacing: 0.06em;
    font-weight: 500;
}

.site-news .menu-button:hover {
    text-decoration: underline;
    text-underline-offset: 4px;
}


/* Menu — Desktop alignment fix (3 nav items) */
@media (min-width: 768px) {
    .site-news .menu-button {
        flex: 0 1 auto;
        max-width: 240px;
        min-width: 140px;
        padding: 0.25em 1.5em;
        font-size: 1.3em;
    }
}


/* Content area — newspaper column feel */
.site-news #content {
    line-height: 1.7;
}

.site-news #content h1,
.site-news #content h2,
.site-news #content h3 {
    font-family: 'Playfair Display', Georgia, serif;
    font-weight: 700;
}


/* Footer */
.site-news #site-footer {
    font-family: 'Roboto', sans-serif;
    font-size: 0.8rem;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}