/* ------------------------------------------------------------------
   Northern Tales — modern reception
   Distinct typographic and chromatic treatment per 6.6.
   Applied only on /moderna-tolkningar/ and /modern-reception/.
   ------------------------------------------------------------------ */

body.modern {
    --bg:        #e9ecef;
    --bg-raised: #dfe3e8;
    --fg:        #1f2933;
    --fg-muted:  #4b5866;
    --accent:    #31475c;
    --link:      #31475c;
    --link-hover:#1f2933;
    --rule:      rgba(31, 41, 51, 0.18);
    --rule-strong: rgba(31, 41, 51, 0.5);

    font-family: var(--font-sans);
}

@media (prefers-color-scheme: dark) {
    body.modern {
        --bg:        #222a31;
        --bg-raised: #2b343c;
        --fg:        #e3e8ed;
        --fg-muted:  #a8b2bc;
        --accent:    #b8cfe4;
        --link:      #b8cfe4;
        --link-hover:#e3e8ed;
        --rule:      rgba(227, 232, 237, 0.18);
        --rule-strong: rgba(227, 232, 237, 0.45);
    }
}

body.modern h1, body.modern h2, body.modern h3, body.modern h4 {
    font-family: var(--font-sans);
    font-weight: 600;
    letter-spacing: -0.005em;
    color: var(--accent);
}

body.modern .modern-banner {
    background: var(--accent);
    color: #fff;
    padding: 0.7rem 1rem;
    margin: 0 0 1.5rem;
    font-size: 0.95rem;
    letter-spacing: 0.01em;
    border-radius: 2px;
}
@media (prefers-color-scheme: dark) {
    body.modern .modern-banner { color: var(--bg); }
}

body.modern .modern-head { margin-bottom: 1.5rem; }
body.modern .modern-lead { color: var(--fg-muted); font-size: 1.05rem; }