/* TANKSTOPP_HOME_MAGAZINE_V411
 * Nur Magazin-Topstory. Cars und Tanken werden bewusst in ihren eigenen Plugins gestaltet.
 * 4.10: Bildspalte ohne Leerraum, robuste Breiten und frueher Tablet-Umbruch.
 * 4.11: Wrapper-Breite an den echten Theme-Container binden statt an die Viewport-Breite.
 *       Verhindert mobilen Rechtsueberlauf und haelt links/rechts exakt gleiche Innenkante.
 */
.ts-home-magazine{
    --ts-home-ink:#171b1f;
    --ts-home-muted:#68747b;
    --ts-home-line:#e4e9e7;
    --ts-home-accent:#185f4b;
    box-sizing:border-box;
    width:min(1040px,100%);
    max-width:100%;
    min-width:0;
    margin:14px auto 16px;
}
.ts-home-magazine,
.ts-home-magazine *{box-sizing:border-box}
.ts-home-magazine-card{
    display:grid;
    grid-template-columns:minmax(0,36%) minmax(0,64%);
    align-items:stretch;
    width:100%;
    max-width:100%;
    min-width:0;
    min-height:168px;
    overflow:hidden;
    border:1px solid var(--ts-home-line);
    border-radius:14px;
    background:#fff;
    box-shadow:0 4px 16px rgba(15,23,42,.035);
}
.ts-home-magazine-media{
    display:block;
    width:100%;
    height:100%;
    min-width:0;
    min-height:168px;
    overflow:hidden;
    background:#edf1ef;
}
.ts-home-magazine-image{
    display:block;
    width:100%;
    height:100%;
    min-width:0;
    min-height:168px;
    object-fit:cover;
    object-position:center;
}
.ts-home-magazine-copy{
    display:flex;
    min-width:0;
    max-width:100%;
    flex-direction:column;
    justify-content:center;
    padding:15px 19px;
    overflow:hidden;
}
.ts-home-magazine-overline{
    display:flex;
    gap:6px;
    align-items:center;
    flex-wrap:wrap;
    min-width:0;
    margin:0 0 5px;
    font-size:9.5px;
    line-height:1.2;
    font-weight:800;
    letter-spacing:.115em;
    text-transform:uppercase;
    color:var(--ts-home-accent);
}
body.home h2.ts-home-magazine-title{
    max-width:31ch;
    min-width:0;
    margin:0!important;
    padding:0!important;
    font-size:clamp(23px,2vw,28px)!important;
    line-height:1.08!important;
    letter-spacing:-.024em!important;
    font-weight:780!important;
    color:var(--ts-home-ink)!important;
    overflow-wrap:anywhere;
    word-break:normal;
}
body.home .ts-home-magazine h2.ts-home-magazine-title a,
body.home .ts-home-magazine h2.ts-home-magazine-title a:visited,
body.home .entry-content .ts-home-magazine h2.ts-home-magazine-title a{
    display:block;
    max-width:100%;
    color:var(--ts-home-ink)!important;
    text-decoration:none!important;
    text-decoration-thickness:0!important;
    border:0!important;
    box-shadow:none!important;
    background:none!important;
    overflow-wrap:anywhere;
}
body.home .ts-home-magazine h2.ts-home-magazine-title a:hover,
body.home .ts-home-magazine h2.ts-home-magazine-title a:focus{
    color:var(--ts-home-accent)!important;
    text-decoration:none!important;
}
.ts-home-magazine-deck{
    display:-webkit-box;
    max-width:65ch;
    min-width:0;
    margin:7px 0 0;
    overflow:hidden;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    font-size:13.25px;
    line-height:1.42;
    color:#5f6a71;
}
.ts-home-magazine-meta{
    display:flex;
    align-items:center;
    gap:6px;
    flex-wrap:wrap;
    min-width:0;
    margin-top:7px;
    font-size:10.75px;
    line-height:1.3;
    color:#7a858b;
}
.ts-home-magazine-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;min-width:0;margin-top:9px}
.ts-home-magazine-primary{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:32px;
    padding:6px 11px;
    border-radius:8px;
    background:#171e24;
    color:#fff!important;
    text-decoration:none!important;
    font-size:12px;
    font-weight:750;
    line-height:1.2;
}
.ts-home-magazine-primary:hover{color:#fff!important;opacity:.93;text-decoration:none!important}
.ts-home-magazine-secondary{font-size:12px;font-weight:700;color:#46554d!important;text-decoration:none!important}
.ts-home-magazine-secondary:hover{color:#185f4b!important;text-decoration:none!important}
.ts-home-magazine-card-no-image{grid-template-columns:1fr}

/* Tablet: nicht versuchen, zwei Spalten in einen zu schmalen Theme-Container zu pressen. */
@media(max-width:1080px){
    .ts-home-magazine{
        width:min(860px,100%);
        max-width:100%;
        margin:14px auto 16px;
    }
    .ts-home-magazine-card{grid-template-columns:1fr;min-height:0}
    .ts-home-magazine-media{
        width:100%;
        height:auto;
        min-height:0;
        aspect-ratio:16/7.3;
    }
    .ts-home-magazine-image{
        width:100%;
        height:100%;
        min-height:0;
        aspect-ratio:auto;
        object-fit:cover;
    }
    .ts-home-magazine-copy{padding:15px 18px 16px}
    body.home h2.ts-home-magazine-title{max-width:34ch;font-size:clamp(22px,3.2vw,27px)!important}
}

@media(max-width:760px){
    .ts-home-magazine{width:100%;max-width:100%;margin:12px auto 14px}
    .ts-home-magazine-card{grid-template-columns:1fr;min-height:0;border-radius:14px}
    .ts-home-magazine-media{aspect-ratio:16/8.2}
    .ts-home-magazine-image{height:100%;min-height:0;aspect-ratio:auto}
    .ts-home-magazine-copy{padding:13px 14px 14px}
    .ts-home-magazine-overline{margin-bottom:5px;font-size:9px}
    body.home h2.ts-home-magazine-title{max-width:none;font-size:21px!important;line-height:1.1!important}
    .ts-home-magazine-deck{-webkit-line-clamp:2;margin-top:6px;font-size:12.75px;line-height:1.4}
    .ts-home-magazine-meta{margin-top:7px;font-size:10.25px}
    .ts-home-magazine-actions{gap:9px;margin-top:8px}
    .ts-home-magazine-primary{min-height:31px;padding:6px 10px;font-size:11.5px}
    .ts-home-magazine-secondary{font-size:11.5px}
}
@media(max-width:390px){
    .ts-home-magazine{width:100%;max-width:100%}
    .ts-home-magazine-copy{padding:12px}
    body.home h2.ts-home-magazine-title{font-size:20px!important}
    .ts-home-magazine-meta span[aria-hidden="true"]{display:none}
}
