/*
 * ML-HUB Editorial 2026
 * Eigenstaendige Magazinoptik mit klassischer Typografie und klaren Werbeflaechen.
 */
:root {
    --mlhub-ink: #141414;
    --mlhub-paper: #fbfaf6;
    --mlhub-line: #d8d4ca;
    --mlhub-muted: #66645f;
    --mlhub-accent: #006d7c;
    --mlhub-accent-dark: #004f5a;
    --mlhub-signal: #c51d3a;
    --mlhub-serif: Georgia, "Times New Roman", Times, serif;
    --mlhub-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

html { background: var(--mlhub-paper); }

body.mlhub-editorial {
    background:
        linear-gradient(rgba(255,255,255,.9), rgba(255,255,255,.9)),
        repeating-linear-gradient(90deg, transparent 0 63px, rgba(20,20,20,.018) 64px);
    color: var(--mlhub-ink) !important;
    font-family: var(--mlhub-sans) !important;
}

body.mlhub-editorial > main {
    width: min(100% - 24px, 1500px);
    margin-left: auto !important;
    margin-right: auto !important;
}

body.mlhub-editorial .mlhub-desktop-sidebar {
    display: none !important;
}

body.mlhub-editorial > footer,
body.mlhub-editorial .mlhub-rss-ticker {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

body.mlhub-editorial h1,
body.mlhub-editorial h2,
body.mlhub-editorial h3,
body.mlhub-editorial .article-content h2,
body.mlhub-editorial .article-content h3 {
    font-family: var(--mlhub-serif);
    letter-spacing: -.025em;
    text-wrap: balance;
}

body.mlhub-editorial p { text-wrap: pretty; }

/* Masthead: Logozeile plus ruhige Ressortnavigation */
body.mlhub-editorial .mlhub-main-header {
    position: relative !important;
    top: auto !important;
    margin: 0 !important;
    border: 0 !important;
    border-top: 5px solid var(--mlhub-signal) !important;
    border-bottom: 1px solid var(--mlhub-ink) !important;
    border-radius: 0 !important;
    background: rgba(255,255,255,.98) !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
}

body.mlhub-editorial .mlhub-main-header > div {
    max-width: 1500px !important;
    padding: 18px 18px 0 !important;
}

@media (min-width: 1024px) {
    body.mlhub-editorial .mlhub-main-header > div > div:first-child {
        display: grid !important;
        grid-template-columns: minmax(220px, 1fr) minmax(420px, 1.7fr) auto auto;
        gap: 12px 20px !important;
        align-items: center;
    }

    body.mlhub-editorial .mlhub-main-header nav,
    body.mlhub-editorial .mlhub-main-header > div > div > nav {
        display: flex !important;
        grid-column: 1 / -1;
        grid-row: 2;
        order: 10;
        width: 100%;
        margin: 4px 0 0 !important;
        padding: 3px 0 !important;
        flex-wrap: wrap !important;
        justify-content: center !important;
        overflow: visible !important;
        border-top: 1px solid var(--mlhub-line);
    }

    body.mlhub-editorial .mlhub-main-header nav > div { flex: 0 0 auto; }

    body.mlhub-editorial .mlhub-main-header nav > a,
    body.mlhub-editorial .mlhub-main-header nav > div > a {
        flex: 0 0 auto;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        color: var(--mlhub-ink) !important;
        padding: 10px 12px !important;
        font-size: .72rem !important;
        font-weight: 800 !important;
        letter-spacing: .055em;
        text-transform: uppercase;
        white-space: nowrap;
    }

    body.mlhub-editorial .mlhub-main-header nav > a + a,
    body.mlhub-editorial .mlhub-main-header nav > div + a,
    body.mlhub-editorial .mlhub-main-header nav > a + div,
    body.mlhub-editorial .mlhub-main-header nav > div + div {
        border-left: 1px solid var(--mlhub-line) !important;
    }

    body.mlhub-editorial .mlhub-main-header nav > a:hover,
    body.mlhub-editorial .mlhub-main-header nav > div > a:hover,
    body.mlhub-editorial .mlhub-main-header nav > div:hover > a {
        background: #e7e1d6 !important;
        color: var(--mlhub-signal) !important;
        box-shadow: inset 0 -3px 0 var(--mlhub-signal) !important;
    }

    body.mlhub-editorial .mlhub-main-header nav a.bg-white,
    body.mlhub-editorial .mlhub-main-header nav button.bg-white,
    body.mlhub-editorial .mlhub-main-header nav > div > a.bg-white {
        background: #e8f1ef !important;
        color: var(--mlhub-accent-dark) !important;
        box-shadow: inset 0 -3px 0 var(--mlhub-accent) !important;
    }

    body.mlhub-editorial .mlhub-main-header nav .group > div.absolute {
        z-index: 120 !important;
        padding-top: 7px !important;
    }

    body.mlhub-editorial .mlhub-main-header nav .group > div.absolute > div {
        min-width: 250px !important;
        padding: 6px !important;
        border: 1px solid var(--mlhub-line) !important;
        border-top: 3px solid var(--mlhub-signal) !important;
        border-radius: 0 !important;
        background: #fff !important;
        box-shadow: 0 18px 38px rgba(20,20,20,.18) !important;
    }

    body.mlhub-editorial .mlhub-main-header nav .group > div.absolute a {
        display: flex !important;
        width: 100% !important;
        padding: 10px 12px !important;
        border: 0 !important;
        border-bottom: 1px solid #ebe8e0 !important;
        border-radius: 0 !important;
        background: #fff !important;
        color: var(--mlhub-ink) !important;
        font-size: .78rem !important;
        font-weight: 800 !important;
        letter-spacing: .02em !important;
        text-transform: none !important;
        white-space: nowrap !important;
    }

    body.mlhub-editorial .mlhub-main-header nav .group > div.absolute a:hover,
    body.mlhub-editorial .mlhub-main-header nav .group > div.absolute a:focus-visible {
        background: #e7e1d6 !important;
        color: var(--mlhub-signal) !important;
    }
}

body.mlhub-editorial .mlhub-main-header > div > div > a:first-child {
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

body.mlhub-editorial .mlhub-main-header a.group > span:first-child {
    width: 70px !important;
    height: 70px !important;
    border: 1px solid var(--mlhub-line) !important;
    border-radius: 0 !important;
    background: #fff !important;
    box-shadow: none !important;
}

body.mlhub-editorial .mlhub-main-header a.group > span:last-child > span:first-child {
    color: var(--mlhub-signal) !important;
    letter-spacing: .24em !important;
}

body.mlhub-editorial .mlhub-main-header a.group > span:last-child > span:last-child {
    background: none !important;
    color: var(--mlhub-ink) !important;
    font-family: var(--mlhub-serif);
    font-size: clamp(2rem, 3vw, 3.25rem) !important;
    font-weight: 700 !important;
    letter-spacing: -.05em;
    text-transform: none !important;
}

body.mlhub-editorial .mlhub-header-title {
    color: var(--mlhub-muted) !important;
    font-family: var(--mlhub-serif);
    font-size: .9rem !important;
    font-style: italic;
    font-weight: 400 !important;
    letter-spacing: 0;
    text-transform: none !important;
}

body.mlhub-editorial .mlhub-main-header form input {
    border: 1px solid var(--mlhub-line) !important;
    border-radius: 0 !important;
    background: #fff !important;
    color: var(--mlhub-ink) !important;
}

body.mlhub-editorial .mlhub-main-header form button,
body.mlhub-editorial .mlhub-mobile-toggle {
    border-radius: 0 !important;
    background: var(--mlhub-ink) !important;
    color: #fff !important;
    box-shadow: none !important;
}

body.mlhub-editorial .mlhub-main-header [title="Admin"] {
    border: 1px solid var(--mlhub-line) !important;
    border-radius: 0 !important;
    background: #fff !important;
    color: var(--mlhub-ink) !important;
}

body.mlhub-editorial #mlhubMobileMenu {
    border: 0 !important;
    border-top: 1px solid var(--mlhub-line) !important;
    border-radius: 0 !important;
    background: #fff !important;
    box-shadow: none !important;
}

body.mlhub-editorial #mlhubMobileMenu a {
    border-color: var(--mlhub-line) !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: var(--mlhub-ink) !important;
}

/* Newsticker wie eine redaktionelle Eilmeldungszeile */
body.mlhub-editorial .mlhub-rss-ticker {
    margin: 0 !important;
    border: 0 !important;
    border-bottom: 1px solid var(--mlhub-line) !important;
    border-radius: 0 !important;
    background: #f1efe9 !important;
    box-shadow: none !important;
}

body.mlhub-editorial .mlhub-rss-ticker a,
body.mlhub-editorial .mlhub-rss-ticker span { color: var(--mlhub-ink) !important; }
body.mlhub-editorial .mlhub-rss-ticker a > span:first-child,
body.mlhub-editorial .mlhub-rss-ticker span > span:first-child {
    border: 0 !important;
    border-radius: 0 !important;
    background: var(--mlhub-signal) !important;
    color: #fff !important;
    box-shadow: none !important;
}

/* Titelseite */
body.mlhub-editorial .mlhub-frontpage-lead {
    margin-top: 28px !important;
    border: 1px solid var(--mlhub-line) !important;
    border-top: 3px solid var(--mlhub-ink) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

body.mlhub-editorial .mlhub-frontpage-lead > div:first-child {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
}

body.mlhub-editorial .mlhub-frontpage-lead h1 {
    color: var(--mlhub-ink) !important;
    font-weight: 700 !important;
}

body.mlhub-editorial .mlhub-frontpage-lead [class*="rounded-full"] {
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: var(--mlhub-signal) !important;
    padding-left: 0 !important;
}

body.mlhub-editorial .mlhub-frontpage-lead > .grid > a h2 {
    font-size: clamp(2rem, 4vw, 4.6rem) !important;
    font-weight: 700 !important;
    line-height: .98 !important;
}

body.mlhub-editorial .mlhub-frontpage-lead > .grid > div a {
    border-color: var(--mlhub-line) !important;
    background: #fff !important;
}

body.mlhub-editorial .mlhub-frontpage-lead > .grid > div a h3 {
    color: var(--mlhub-ink) !important;
    font-family: var(--mlhub-serif);
    font-size: 1.05rem !important;
}

body.mlhub-editorial main > div > section:not(.mlhub-frontpage-lead),
body.mlhub-editorial main > section {
    border-radius: 0 !important;
}

body.mlhub-editorial main section {
    box-shadow: none !important;
}

body.mlhub-editorial main section > div[class*="mb-"] > div[class*="text-"][class*="uppercase"],
body.mlhub-editorial main section div[class*="tracking-"][class*="uppercase"] {
    letter-spacing: .14em !important;
}

body.mlhub-editorial main h2 { line-height: 1.08 !important; }

/* Redaktioneller Nachrichtenblock der Startseite */
body.mlhub-editorial .mlhub-editorial-desk {
    border-top: 4px solid var(--mlhub-ink);
    border-bottom: 1px solid var(--mlhub-line);
    background: #fff;
}

body.mlhub-editorial .mlhub-editorial-desk__header {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 24px;
    padding: 22px 0 18px;
    border-bottom: 1px solid var(--mlhub-line);
}

body.mlhub-editorial .mlhub-editorial-kicker {
    color: var(--mlhub-signal) !important;
    font-family: var(--mlhub-sans);
    font-size: .64rem;
    font-weight: 900;
    letter-spacing: .19em !important;
    text-transform: uppercase;
}

body.mlhub-editorial .mlhub-editorial-desk__header h2,
body.mlhub-editorial .mlhub-most-read h2 {
    margin-top: 5px;
    color: var(--mlhub-ink) !important;
    font-size: clamp(2rem, 3vw, 3.2rem);
    font-weight: 700;
}

body.mlhub-editorial .mlhub-editorial-desk__header > a {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 9px 0;
    border-bottom: 2px solid var(--mlhub-signal);
    color: var(--mlhub-ink) !important;
    font-size: .76rem;
    font-weight: 900;
    text-transform: uppercase;
}

body.mlhub-editorial .mlhub-editorial-desk__grid {
    display: grid;
    grid-template-columns: minmax(0, 2.15fr) minmax(280px, .75fr);
    gap: 0;
}

body.mlhub-editorial .mlhub-editorial-story-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding-right: 28px;
}

body.mlhub-editorial .mlhub-editorial-story {
    padding: 22px 20px 22px 0;
    border-bottom: 1px solid var(--mlhub-line);
}

body.mlhub-editorial .mlhub-editorial-story:nth-child(even):not(.mlhub-editorial-story--lead) {
    padding-left: 20px;
    border-left: 1px solid var(--mlhub-line);
}

body.mlhub-editorial .mlhub-editorial-story--lead {
    grid-column: 1 / -1;
    padding-right: 0;
}

body.mlhub-editorial .mlhub-editorial-story__link {
    display: grid;
    gap: 15px;
    color: var(--mlhub-ink) !important;
}

body.mlhub-editorial .mlhub-editorial-story--lead .mlhub-editorial-story__link {
    grid-template-columns: minmax(260px, 1.2fr) minmax(240px, .9fr);
    align-items: center;
}

body.mlhub-editorial .mlhub-editorial-story__image {
    display: block;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background: #eeece6;
}

body.mlhub-editorial .mlhub-editorial-story__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: saturate(.86) contrast(1.03);
    transition: transform .35s ease, filter .35s ease;
}

body.mlhub-editorial .mlhub-editorial-story__link:hover .mlhub-editorial-story__image img {
    transform: scale(1.025);
    filter: saturate(1) contrast(1.03);
}

body.mlhub-editorial .mlhub-editorial-story__placeholder {
    display: grid;
    width: 100%;
    height: 100%;
    place-items: center;
    color: var(--mlhub-muted);
}

body.mlhub-editorial .mlhub-editorial-story__placeholder svg { width: 32px; height: 32px; }

body.mlhub-editorial .mlhub-editorial-story__copy { display: block; }

body.mlhub-editorial .mlhub-editorial-story__meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    color: var(--mlhub-signal) !important;
    font-family: var(--mlhub-sans);
    font-size: .61rem;
    font-weight: 900;
    letter-spacing: .13em;
    text-transform: uppercase;
}

body.mlhub-editorial .mlhub-editorial-story__meta time { color: var(--mlhub-muted); }

body.mlhub-editorial .mlhub-editorial-story__title {
    display: block;
    margin-top: 9px;
    color: var(--mlhub-ink) !important;
    font-family: var(--mlhub-serif);
    font-size: clamp(1.35rem, 2vw, 2rem);
    font-weight: 700;
    letter-spacing: -.025em;
    line-height: 1.07;
}

body.mlhub-editorial .mlhub-editorial-story--lead .mlhub-editorial-story__title {
    font-size: clamp(2rem, 3.2vw, 3.65rem);
    line-height: 1.01;
}

body.mlhub-editorial .mlhub-editorial-story__excerpt {
    display: -webkit-box;
    margin-top: 11px;
    overflow: hidden;
    color: var(--mlhub-muted) !important;
    font-family: var(--mlhub-serif);
    font-size: .98rem;
    line-height: 1.55;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

body.mlhub-editorial .mlhub-most-read {
    padding: 24px 0 24px 28px;
    border-left: 1px solid var(--mlhub-line);
}

body.mlhub-editorial .mlhub-most-read h2 { font-size: 2.25rem; }
body.mlhub-editorial .mlhub-most-read ol { margin-top: 13px; }

body.mlhub-editorial .mlhub-most-read li { border-top: 1px solid var(--mlhub-line); }

body.mlhub-editorial .mlhub-most-read li:last-child { border-bottom: 1px solid var(--mlhub-line); }

body.mlhub-editorial .mlhub-most-read li a {
    display: grid;
    grid-template-columns: 42px minmax(0,1fr);
    gap: 12px;
    padding: 15px 0;
    color: var(--mlhub-ink) !important;
}

body.mlhub-editorial .mlhub-most-read__number {
    color: var(--mlhub-signal) !important;
    font-family: var(--mlhub-serif);
    font-size: 1.8rem;
    line-height: 1;
}

body.mlhub-editorial .mlhub-most-read__title {
    display: block;
    font-family: var(--mlhub-serif);
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.25;
}

body.mlhub-editorial .mlhub-most-read li a:hover .mlhub-most-read__title { color: var(--mlhub-signal) !important; }

body.mlhub-editorial .mlhub-most-read__views {
    display: block;
    margin-top: 5px;
    color: var(--mlhub-muted) !important;
    font-size: .64rem;
    font-weight: 800;
    text-transform: uppercase;
}

/* Untere Module optisch in die Zeitungssprache holen. */
body.mlhub-editorial .mlhub-frontpage section[class*="bg-slate-900/86"] {
    border-color: var(--mlhub-line) !important;
    border-top: 3px solid var(--mlhub-ink) !important;
    background: #fff !important;
    color: var(--mlhub-ink) !important;
}

body.mlhub-editorial .mlhub-frontpage section[class*="bg-slate-900/86"] :is(h1,h2,h3,.text-white) {
    color: var(--mlhub-ink) !important;
}

body.mlhub-editorial .mlhub-frontpage section[class*="bg-slate-900/86"] :is(.text-slate-300,.text-slate-400,.text-slate-500) {
    color: var(--mlhub-muted) !important;
}

body.mlhub-editorial .mlhub-frontpage section[class*="bg-slate-900/86"] a[class*="bg-slate-950"] {
    border-color: var(--mlhub-line) !important;
    background: #f7f5f0 !important;
}

/* Karten: weniger App-Look, mehr Zeitung */
body.mlhub-editorial main article,
body.mlhub-editorial main a[class*="rounded-"] {
    border-radius: 0 !important;
}

body.mlhub-editorial main article {
    box-shadow: none !important;
}

body.mlhub-editorial main a[class*="hover:-translate-y"] {
    transform: none !important;
}

body.mlhub-editorial main a[class*="hover:-translate-y"]:hover {
    border-color: var(--mlhub-accent) !important;
}

/* Artikelansicht */
body.mlhub-editorial .mlhub-article-wrap {
    max-width: 1320px;
    margin-top: 28px !important;
}

body.mlhub-editorial .mlhub-article-wrap > div.pointer-events-none { display: none; }

body.mlhub-editorial #mlhub-article {
    border: 1px solid var(--mlhub-line) !important;
    border-radius: 0 !important;
    background: #fff !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
}

body.mlhub-editorial #mlhub-article header > div:last-child > div {
    border-radius: 0 !important;
    border-color: rgba(255,255,255,.32) !important;
    background: rgba(15,15,15,.9) !important;
    box-shadow: none !important;
}

body.mlhub-editorial #mlhub-article h1 {
    font-family: var(--mlhub-serif);
    font-weight: 700 !important;
    letter-spacing: -.04em;
    line-height: 1.01 !important;
}

body.mlhub-editorial #mlhub-article > div.grid > div > div[class*="rounded-"] {
    border-radius: 0 !important;
    box-shadow: none !important;
}

body.mlhub-editorial .article-content {
    max-width: 780px;
    margin-inline: auto;
    color: #292824;
    font-family: var(--mlhub-serif);
    font-size: 1.14rem;
    line-height: 1.8;
}

body.mlhub-editorial .article-content h2,
body.mlhub-editorial .article-content h3 {
    color: var(--mlhub-ink) !important;
    line-height: 1.12 !important;
}

body.mlhub-editorial .article-content a { color: var(--mlhub-accent-dark) !important; }

/* Anzeigen: feste, gut erkennbare Flaechen ohne den Lesefluss zu zerreissen */
body.mlhub-editorial .mlhub-adsense-slot {
    width: 100%;
    margin: 30px auto;
    padding: 16px 0 0;
    border-top: 1px solid var(--mlhub-line);
    border-bottom: 1px solid var(--mlhub-line);
    background: #f5f3ee;
}

body.mlhub-editorial .mlhub-adsense-slot > div {
    margin-bottom: 8px !important;
    color: #77746d !important;
    font-family: var(--mlhub-sans);
    font-size: .58rem !important;
    letter-spacing: .2em !important;
}

body.mlhub-editorial .mlhub-adsense-slot .adsbygoogle {
    min-height: 120px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #fff !important;
    box-shadow: none !important;
}

/* Footer als klassische Magazin-Abschlussleiste */
body.mlhub-editorial > footer {
    margin-top: 48px !important;
    border-top: 5px solid var(--mlhub-signal) !important;
    background: var(--mlhub-ink) !important;
}

body.mlhub-editorial > footer section,
body.mlhub-editorial > footer [class*="rounded-"] {
    border-radius: 0 !important;
    box-shadow: none !important;
}

body.mlhub-editorial > footer h2,
body.mlhub-editorial > footer h3 { font-family: var(--mlhub-serif); }

@media (max-width: 1023px) {
    body.mlhub-editorial .mlhub-main-header > div { padding: 10px 12px !important; }
    body.mlhub-editorial .mlhub-main-header a.group > span:first-child {
        width: 48px !important;
        height: 48px !important;
    }
    body.mlhub-editorial .mlhub-main-header a.group > span:last-child > span:last-child {
        font-size: 1.8rem !important;
    }
    body.mlhub-editorial .mlhub-frontpage-lead > .grid > a h2 {
        font-size: clamp(2rem, 9vw, 3.3rem) !important;
    }
    body.mlhub-editorial .mlhub-editorial-desk__grid { grid-template-columns: 1fr; }
    body.mlhub-editorial .mlhub-editorial-story-grid { padding-right: 0; }
    body.mlhub-editorial .mlhub-most-read {
        padding: 24px 0;
        border-top: 3px solid var(--mlhub-ink);
        border-left: 0;
    }
}

@media (max-width: 640px) {
    body.mlhub-editorial > main { width: min(100% - 12px, 1500px); }
    body.mlhub-editorial .mlhub-frontpage-lead { margin-top: 14px !important; }
    body.mlhub-editorial .mlhub-frontpage-lead > .grid > a > div:last-child { padding: 18px !important; }
    body.mlhub-editorial .mlhub-frontpage-lead > .grid > div a {
        grid-template-columns: 88px minmax(0,1fr) !important;
    }
    body.mlhub-editorial .article-content { font-size: 1.06rem; line-height: 1.72; }
    body.mlhub-editorial .mlhub-adsense-slot { margin: 22px auto; }
    body.mlhub-editorial .mlhub-editorial-desk { margin-top: 24px !important; }
    body.mlhub-editorial .mlhub-editorial-desk__header {
        align-items: flex-start;
        flex-direction: column;
        gap: 10px;
    }
    body.mlhub-editorial .mlhub-editorial-story-grid { grid-template-columns: 1fr; }
    body.mlhub-editorial .mlhub-editorial-story,
    body.mlhub-editorial .mlhub-editorial-story:nth-child(even):not(.mlhub-editorial-story--lead) {
        grid-column: 1;
        padding: 18px 0;
        border-left: 0;
    }
    body.mlhub-editorial .mlhub-editorial-story--lead .mlhub-editorial-story__link {
        grid-template-columns: 1fr;
    }
    body.mlhub-editorial .mlhub-editorial-story--lead .mlhub-editorial-story__title {
        font-size: 2.25rem;
    }
}