/* ============================================================
   320 FM · HOME CONTENT V5
   NUR STARTSEITEN-CONTENT
   KEINE HEADER- ODER HERO-REGELN
   ============================================================ */


/* ------------------------------------------------------------
   BASIS
   ------------------------------------------------------------ */

.fm-home-v5-radar{
    width:min(
        100% - 40px,
        1390px
    );

    margin:
        34px auto 20px;

    color:#f6f8fa;
}


.fm-home-v5-radar *,
.fm-home-v5-radar *::before,
.fm-home-v5-radar *::after{
    box-sizing:border-box;
}


/* ------------------------------------------------------------
   SECTION HEADER
   ------------------------------------------------------------ */

.fm-home-v5-section-head{
    min-height:44px;

    display:flex;
    align-items:center;
    justify-content:space-between;

    gap:24px;

    padding:
        0 1px 11px;
}


.fm-home-v5-section-title{
    display:flex;
    align-items:center;

    gap:10px;
}


.fm-home-v5-section-title h2{
    margin:0;

    font-size:24px;
    line-height:1;

    font-weight:950;

    letter-spacing:
        -.025em;
}


.fm-home-v5-section-signal{
    width:14px;
    height:14px;

    position:relative;

    display:block;

    border:
        2px solid
        #d52d94;

    border-radius:50%;
}


.fm-home-v5-section-signal::after{
    content:"";

    position:absolute;

    width:4px;
    height:4px;

    left:3px;
    top:3px;

    border-radius:50%;

    background:#d52d94;

    box-shadow:
        0 0 10px
        rgba(213,45,148,.72);
}


.fm-home-v5-section-link{
    display:flex;
    align-items:center;

    gap:10px;

    color:#2aafe1;

    text-decoration:none;

    font-size:11px;
    line-height:1;

    font-weight:900;

    letter-spacing:.045em;
}


.fm-home-v5-section-link:hover{
    color:#fff;
}


/* ------------------------------------------------------------
   GRID
   ------------------------------------------------------------ */

.fm-home-v5-radar-grid{
    display:grid;

    grid-template-columns:
        minmax(0,1.55fr)
        minmax(430px,.95fr);

    gap:14px;
}


/* ------------------------------------------------------------
   FEATURE
   ------------------------------------------------------------ */

.fm-home-v5-radar-feature{
    position:relative;

    min-height:330px;

    overflow:hidden;

    border:
        1px solid
        rgba(132,155,170,.25);

    border-radius:9px;

    background:
        #080d12;

    box-shadow:
        0 16px 42px
        rgba(0,0,0,.15);

    isolation:isolate;
}


.fm-home-v5-radar-feature-bg{
    position:absolute;

    inset:0;

    overflow:hidden;
}


.fm-home-v5-radar-feature-photo{
    position:absolute;

    inset:
        0 0 0 35%;

    background-size:cover;

    background-position:
        center 28%;

    filter:
        saturate(.88)
        contrast(1.04);
}


.fm-home-v5-radar-feature-bg::after{
    content:"";

    position:absolute;

    inset:0;

    background:
        linear-gradient(
            90deg,
            #080d12 0%,
            rgba(8,13,18,.98) 27%,
            rgba(8,13,18,.74) 48%,
            rgba(8,13,18,.20) 75%,
            rgba(8,13,18,.16) 100%
        ),
        linear-gradient(
            0deg,
            rgba(5,9,13,.30),
            rgba(5,9,13,0) 58%
        );

    z-index:2;
}


.fm-home-v5-radar-feature.no-image
.fm-home-v5-radar-feature-bg{
    background:
        radial-gradient(
            circle at 75% 50%,
            rgba(213,45,148,.17),
            transparent 25%
        ),
        radial-gradient(
            circle at 70% 55%,
            rgba(42,175,225,.12),
            transparent 45%
        );
}


/* ------------------------------------------------------------
   RADAR GRAPHIC
   ------------------------------------------------------------ */

.fm-home-v5-radar-feature-radar{
    position:absolute;

    width:250px;
    height:250px;

    right:40px;
    top:50%;

    transform:
        translateY(-50%);

    z-index:3;

    opacity:.72;

    pointer-events:none;
}


.fm-home-v5-radar-feature-radar i{
    position:absolute;

    left:50%;
    top:50%;

    border:
        1px solid
        rgba(213,45,148,.34);

    border-radius:50%;

    transform:
        translate(-50%,-50%);
}


.fm-home-v5-radar-feature-radar i:nth-child(1){
    width:55px;
    height:55px;
}


.fm-home-v5-radar-feature-radar i:nth-child(2){
    width:105px;
    height:105px;

    opacity:.75;
}


.fm-home-v5-radar-feature-radar i:nth-child(3){
    width:160px;
    height:160px;

    opacity:.55;
}


.fm-home-v5-radar-feature-radar i:nth-child(4){
    width:220px;
    height:220px;

    opacity:.32;
}


.fm-home-v5-radar-feature-radar b{
    position:absolute;

    width:11px;
    height:11px;

    left:calc(50% - 5px);
    top:calc(50% - 5px);

    border-radius:50%;

    background:#d52d94;

    box-shadow:
        0 0 10px
        rgba(213,45,148,.92),
        0 0 26px
        rgba(213,45,148,.58);

    animation:
        fmHomeV5RadarPulse
        2s
        ease-in-out
        infinite;
}


@keyframes fmHomeV5RadarPulse{

    0%,
    100%{
        transform:scale(.82);
        opacity:.72;
    }

    50%{
        transform:scale(1.22);
        opacity:1;
    }

}


/* ------------------------------------------------------------
   FEATURE COPY
   ------------------------------------------------------------ */

.fm-home-v5-radar-feature-content{
    width:49%;

    position:relative;

    z-index:5;

    display:flex;
    flex-direction:column;
    align-items:flex-start;

    padding:
        44px 34px 34px;
}


.fm-home-v5-kicker{
    display:flex;
    align-items:center;

    gap:8px;

    margin-bottom:22px;

    color:#d52d94;

    font-size:10px;
    line-height:1;

    font-weight:950;

    letter-spacing:.07em;
}


.fm-home-v5-kicker i,
.fm-home-v5-small-kicker i{
    display:block;

    width:7px;
    height:7px;

    border:
        1px solid
        currentColor;

    border-radius:50%;
}


.fm-home-v5-radar-feature h3{
    margin:0;

    font-size:
        clamp(30px,3vw,47px);

    line-height:.95;

    font-weight:950;

    letter-spacing:
        -.045em;
}


.fm-home-v5-radar-type{
    margin:
        11px 0 0;

    color:#2aafe1;

    font-size:11px;

    font-weight:900;

    letter-spacing:.045em;
}


.fm-home-v5-radar-copy{
    max-width:430px;

    margin:
        15px 0 25px;

    color:#abb6bc;

    font-size:14px;
    line-height:1.55;
}


.fm-home-v5-outline-button{
    min-height:42px;

    display:inline-flex;
    align-items:center;

    gap:22px;

    padding:
        0 17px;

    border:
        1px solid
        rgba(213,45,148,.72);

    border-radius:5px;

    color:#46bce7;

    text-decoration:none;

    font-size:10px;

    font-weight:950;

    letter-spacing:.065em;

    transition:
        border-color .18s ease,
        background .18s ease,
        color .18s ease;
}


.fm-home-v5-outline-button:hover{
    color:#fff;

    border-color:#d52d94;

    background:
        rgba(213,45,148,.10);
}


/* ------------------------------------------------------------
   SECONDARY GRID
   ------------------------------------------------------------ */

.fm-home-v5-radar-secondary{
    display:grid;

    grid-template-columns:
        repeat(3,minmax(0,1fr));

    gap:12px;
}


.fm-home-v5-radar-card{
    min-width:0;

    position:relative;

    overflow:hidden;

    display:flex;
    flex-direction:column;

    border:
        1px solid
        rgba(132,155,170,.24);

    border-radius:9px;

    background:#080d12;

    color:#fff;

    text-decoration:none;

    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease;
}


.fm-home-v5-radar-card:hover{
    transform:
        translateY(-3px);

    border-color:
        rgba(213,45,148,.46);

    box-shadow:
        0 14px 34px
        rgba(0,0,0,.22);
}


.fm-home-v5-radar-card-image{
    position:relative;

    flex:1 1 auto;

    min-height:208px;

    display:grid;
    place-items:center;

    overflow:hidden;

    background:
        radial-gradient(
            circle at 50% 30%,
            #17252d,
            #081016 70%
        );

    background-size:cover;

    background-position:center;
}


.fm-home-v5-radar-card-image.no-image span{
    font-size:54px;

    font-weight:950;

    color:
        rgba(255,255,255,.13);
}


.fm-home-v5-card-gradient{
    position:absolute;

    inset:0;

    background:
        linear-gradient(
            0deg,
            #080d12 0%,
            rgba(8,13,18,.40) 45%,
            transparent 80%
        );
}


.fm-home-v5-radar-card-copy{
    min-height:118px;

    position:relative;

    padding:
        12px 13px 14px;
}


.fm-home-v5-small-kicker{
    display:flex;
    align-items:center;

    gap:5px;

    margin-bottom:9px;

    color:#d52d94;

    font-size:8px;

    font-weight:950;

    letter-spacing:.06em;
}


.fm-home-v5-radar-card-copy strong{
    display:block;

    overflow:hidden;

    font-size:16px;
    line-height:1.1;

    font-weight:950;

    text-overflow:ellipsis;

    white-space:nowrap;
}


.fm-home-v5-radar-card-copy small{
    display:block;

    margin-top:6px;

    color:#2aafe1;

    font-size:8px;

    font-weight:900;

    letter-spacing:.045em;
}


.fm-home-v5-radar-card-arrow{
    position:absolute;

    right:13px;
    bottom:13px;

    width:29px;
    height:29px;

    display:grid;
    place-items:center;

    border:
        1px solid
        rgba(255,255,255,.46);

    border-radius:50%;

    color:#fff;

    font-size:13px;
}


/* ============================================================
   BESTEHENDE CONTENT-PANELS DER STARTSEITE
   optisch an V5 angleichen
   ============================================================ */

body.fm-header-player-enabled
.fm-home-ref-triple{
    width:min(
        100% - 40px,
        1390px
    ) !important;

    margin:
        14px auto 32px !important;

    gap:14px !important;
}


body.fm-header-player-enabled
.fm-home-ref-triple
.fm-home-ref-panel{
    border-color:
        rgba(132,155,170,.22) !important;

    border-radius:
        9px !important;

    background:
        #080d12 !important;

    box-shadow:
        0 12px 34px
        rgba(0,0,0,.10) !important;
}


body.fm-header-player-enabled
.fm-home-ref-triple
.fm-home-ref-head{
    border-bottom-color:
        rgba(132,155,170,.12) !important;
}


body.fm-header-player-enabled
.fm-home-ref-triple
.fm-home-ref-head h2{
    font-weight:
        900 !important;

    letter-spacing:
        -.015em !important;
}


body.fm-header-player-enabled
.fm-home-ref-triple
.fm-home-ref-head a{
    color:
        #2aafe1 !important;

    font-weight:
        900 !important;
}


/* ============================================================
   RESPONSIVE
   ============================================================ */

@media(max-width:1180px){

    .fm-home-v5-radar-grid{
        grid-template-columns:
            minmax(0,1.3fr)
            minmax(350px,.9fr);
    }


    .fm-home-v5-radar-feature-content{
        width:56%;
    }


    .fm-home-v5-radar-feature-radar{
        right:5px;

        opacity:.55;
    }

}


@media(max-width:980px){

    .fm-home-v5-radar-grid{
        grid-template-columns:1fr;
    }


    .fm-home-v5-radar-secondary{
        grid-template-columns:
            repeat(3,minmax(0,1fr));
    }

}


@media(max-width:760px){

    .fm-home-v5-radar{
        width:
            calc(100% - 28px);

        margin-top:24px;
    }


    .fm-home-v5-section-title h2{
        font-size:20px;
    }


    .fm-home-v5-section-link{
        font-size:9px;
    }


    .fm-home-v5-radar-feature{
        min-height:390px;
    }


    .fm-home-v5-radar-feature-photo{
        inset:
            0 0 42% 0;

        background-position:
            center 22%;
    }


    .fm-home-v5-radar-feature-bg::after{
        background:
            linear-gradient(
                0deg,
                #080d12 0%,
                rgba(8,13,18,.97) 46%,
                rgba(8,13,18,.18) 80%
            );
    }


    .fm-home-v5-radar-feature-radar{
        width:170px;
        height:170px;

        right:8px;
        top:25%;
    }


    .fm-home-v5-radar-feature-radar i:nth-child(4){
        width:160px;
        height:160px;
    }


    .fm-home-v5-radar-feature-content{
        width:100%;

        justify-content:flex-end;

        min-height:390px;

        padding:
            195px 22px 24px;
    }


    .fm-home-v5-kicker{
        margin-bottom:13px;
    }


    .fm-home-v5-radar-feature h3{
        font-size:
            clamp(28px,9vw,38px);
    }


    .fm-home-v5-radar-copy{
        margin-bottom:18px;

        font-size:13px;
    }


    .fm-home-v5-radar-secondary{
        display:flex;

        overflow-x:auto;

        scroll-snap-type:
            x mandatory;

        padding-bottom:4px;
    }


    .fm-home-v5-radar-card{
        min-width:220px;

        scroll-snap-align:start;
    }


    .fm-home-v5-radar-card-image{
        min-height:190px;
    }


    body.fm-header-player-enabled
    .fm-home-ref-triple{
        width:
            calc(100% - 28px) !important;

        grid-template-columns:
            1fr !important;
    }

}


@media(prefers-reduced-motion:reduce){

    .fm-home-v5-radar-feature-radar b{
        animation:none;
    }


    .fm-home-v5-radar-card{
        transition:none;
    }

}


/* ============================================================
   HOME CONTENT V5 · PHASE 2
   PLAYLIST / SETS / PROGRAM
   ============================================================ */


.fm-home-v5-content-grid{
    width:min(
        100% - 40px,
        1390px
    );

    margin:
        14px auto 38px;

    display:grid;

    grid-template-columns:
        minmax(270px,.78fr)
        minmax(420px,1.15fr)
        minmax(320px,.92fr);

    gap:14px;
}


.fm-home-v5-box{
    min-width:0;

    overflow:hidden;

    display:flex;
    flex-direction:column;

    border:
        1px solid
        rgba(132,155,170,.22);

    border-radius:9px;

    background:#080d12;

    box-shadow:
        0 12px 34px
        rgba(0,0,0,.10);
}


.fm-home-v5-box-head{
    min-height:56px;

    display:flex;
    align-items:center;
    justify-content:space-between;

    gap:14px;

    padding:
        0 17px;

    border-bottom:
        1px solid
        rgba(132,155,170,.11);
}


.fm-home-v5-box-head h2{
    margin:0;

    color:#fff;

    font-size:15px;

    font-weight:950;

    letter-spacing:
        -.015em;
}


.fm-home-v5-box-head a{
    display:flex;
    align-items:center;

    gap:8px;

    color:#2aafe1;

    text-decoration:none;

    font-size:8px;

    font-weight:950;

    letter-spacing:.055em;
}


.fm-home-v5-box-head a:hover{
    color:#fff;
}


/* ============================================================
   PLAYLIST
   ============================================================ */

.fm-home-v5-playlist-list{
    flex:1 1 auto;

    padding:
        5px 16px 2px;
}


.fm-home-v5-track{
    min-height:60px;

    display:grid;

    grid-template-columns:
        42px
        minmax(0,1fr)
        auto;

    align-items:center;

    gap:11px;

    border-bottom:
        1px solid
        rgba(132,155,170,.10);
}


.fm-home-v5-track:last-child{
    border-bottom:0;
}


.fm-home-v5-track-cover{
    width:38px;
    height:38px;

    display:grid;
    place-items:center;

    overflow:hidden;

    border-radius:4px;

    background:
        linear-gradient(
            135deg,
            rgba(213,45,148,.38),
            rgba(42,175,225,.25)
        );

    background-size:cover;

    background-position:center;
}


.fm-home-v5-track-cover span{
    color:
        rgba(255,255,255,.55);

    font-size:9px;

    font-weight:950;
}


.fm-home-v5-track-copy{
    min-width:0;
}


.fm-home-v5-track-copy strong,
.fm-home-v5-track-copy span{
    display:block;

    overflow:hidden;

    text-overflow:ellipsis;

    white-space:nowrap;
}


.fm-home-v5-track-copy strong{
    color:#f5f7f8;

    font-size:11px;
    line-height:1.2;
}


.fm-home-v5-track-copy span{
    margin-top:3px;

    color:#929fa6;

    font-size:10px;
}


.fm-home-v5-track time{
    color:#7f8c94;

    font-size:9px;
}


/* ============================================================
   SETS
   ============================================================ */

.fm-home-v5-set-grid{
    flex:1 1 auto;

    display:grid;

    grid-template-columns:
        repeat(3,minmax(0,1fr));

    gap:9px;

    padding:
        14px;
}


.fm-home-v5-set-card{
    min-width:0;

    overflow:hidden;

    border:
        1px solid
        rgba(132,155,170,.15);

    border-radius:6px;

    background:#090f14;
}


.fm-home-v5-set-art{
    height:155px;

    position:relative;

    display:grid;
    place-items:center;

    overflow:hidden;

    background:
        linear-gradient(
            135deg,
            #111c24,
            #080d12
        );

    background-size:cover;

    background-position:center;
}


.fm-home-v5-set-art > span{
    color:
        rgba(255,255,255,.15);

    font-size:46px;

    font-weight:950;
}


.fm-home-v5-set-overlay{
    position:absolute;

    inset:0;

    background:
        linear-gradient(
            0deg,
            rgba(4,8,12,.82),
            rgba(4,8,12,.06) 65%
        );
}


.fm-home-v5-set-play{
    width:38px;
    height:38px;

    position:absolute;

    left:50%;
    top:50%;

    z-index:2;

    transform:
        translate(-50%,-50%);

    display:grid;
    place-items:center;

    padding:
        0 0 0 2px;

    border:
        1px solid
        rgba(255,255,255,.65);

    border-radius:50%;

    background:
        rgba(5,9,13,.58);

    color:#fff;

    cursor:pointer;
}


.fm-home-v5-set-play:hover{
    border-color:#d52d94;

    background:
        rgba(213,45,148,.34);
}


.fm-home-v5-set-card audio{
    display:none;
}


.fm-home-v5-set-copy{
    min-height:77px;

    padding:
        11px 11px 12px;
}


.fm-home-v5-set-copy strong,
.fm-home-v5-set-copy span{
    display:block;
}


.fm-home-v5-set-copy strong{
    color:#f5f7f8;

    font-size:12px;
    line-height:1.2;
}


.fm-home-v5-set-copy span{
    margin-top:6px;

    color:#2aafe1;

    font-size:8px;

    font-weight:900;
}


/* ============================================================
   PROGRAM
   ============================================================ */

.fm-home-v5-program-list{
    flex:1 1 auto;

    padding:
        6px 16px;
}


.fm-home-v5-program-row{
    min-height:57px;

    display:grid;

    grid-template-columns:
        38px
        34px
        minmax(0,1fr)
        auto
        28px;

    align-items:center;

    gap:9px;

    border-bottom:
        1px solid
        rgba(132,155,170,.10);

    color:#fff;

    text-decoration:none;
}


.fm-home-v5-program-row:last-child{
    border-bottom:0;
}


.fm-home-v5-program-row time{
    color:#a7b1b7;

    font-size:10px;
}


.fm-home-v5-program-cover{
    width:31px;
    height:31px;

    display:grid;
    place-items:center;

    border-radius:4px;

    overflow:hidden;

    background:
        linear-gradient(
            135deg,
            rgba(213,45,148,.38),
            rgba(42,175,225,.24)
        );

    background-size:cover;

    background-position:center;
}


.fm-home-v5-program-cover span{
    color:
        rgba(255,255,255,.50);

    font-size:8px;

    font-weight:950;
}


.fm-home-v5-program-copy{
    min-width:0;
}


.fm-home-v5-program-copy strong,
.fm-home-v5-program-copy span{
    display:block;

    overflow:hidden;

    white-space:nowrap;

    text-overflow:ellipsis;
}


.fm-home-v5-program-copy strong{
    font-size:10px;

    font-weight:900;
}


.fm-home-v5-program-copy span{
    margin-top:3px;

    color:#8c999f;

    font-size:9px;
}


.fm-home-v5-live{
    padding:
        3px 6px;

    border:
        1px solid
        rgba(213,45,148,.48);

    border-radius:3px;

    color:#ec4aae;

    font-size:7px;

    font-weight:950;

    letter-spacing:.05em;
}


.fm-home-v5-program-arrow{
    width:25px;
    height:25px;

    display:grid;
    place-items:center;

    border:
        1px solid
        rgba(255,255,255,.30);

    border-radius:50%;

    color:#fff;

    font-size:10px;
}


.fm-home-v5-program-row:hover
.fm-home-v5-program-arrow{
    border-color:#2aafe1;

    color:#2aafe1;
}


/* ============================================================
   BUTTONS
   ============================================================ */

.fm-home-v5-box-button{
    min-height:40px;

    display:flex;
    align-items:center;
    justify-content:center;

    gap:18px;

    margin:
        0 16px 14px;

    border:
        1px solid
        rgba(132,155,170,.25);

    border-radius:4px;

    color:#dce5e9;

    text-decoration:none;

    font-size:9px;

    font-weight:950;

    letter-spacing:.055em;
}


.fm-home-v5-box-button:hover{
    border-color:
        rgba(42,175,225,.65);

    color:#fff;
}


.fm-home-v5-box-button--accent{
    border-color:
        rgba(213,45,148,.56);

    background:
        linear-gradient(
            90deg,
            rgba(213,45,148,.13),
            rgba(42,175,225,.10)
        );
}


/* ============================================================
   EMPTY
   ============================================================ */

.fm-home-v5-empty{
    min-height:160px;

    flex:1 1 auto;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;

    gap:7px;

    padding:25px;

    text-align:center;
}


.fm-home-v5-empty span{
    color:#d52d94;

    font-size:8px;

    font-weight:950;

    letter-spacing:.09em;
}


.fm-home-v5-empty strong{
    color:#a6b1b6;

    font-size:12px;
}


.fm-home-v5-empty--sets{
    min-height:235px;
}


/* ============================================================
   RESPONSIVE
   ============================================================ */

@media(max-width:1180px){

    .fm-home-v5-content-grid{
        grid-template-columns:
            1fr 1.25fr;
    }


    .fm-home-v5-program{
        grid-column:
            1 / -1;
    }

}


@media(max-width:760px){

    .fm-home-v5-content-grid{
        width:
            calc(100% - 28px);

        grid-template-columns:1fr;
    }


    .fm-home-v5-program{
        grid-column:auto;
    }


    .fm-home-v5-set-grid{
        display:flex;

        overflow-x:auto;
    }


    .fm-home-v5-set-card{
        min-width:190px;
    }


    .fm-home-v5-program-row{
        grid-template-columns:
            36px
            31px
            minmax(0,1fr)
            auto;
    }


    .fm-home-v5-program-arrow{
        display:none;
    }

}


/* ============================================================
   HOME V5 · RADAR FULL WIDTH
   Nach Entfernung der alten Sets/Radar-Zweispaltenhülle
   ============================================================ */

.fm-home-v5-radar{
    display:block !important;

    width:min(
        calc(100% - 40px),
        1390px
    ) !important;

    max-width:1390px !important;

    margin:
        34px auto 20px !important;
}


.fm-home-v5-radar-grid{
    width:100% !important;

    grid-template-columns:
        minmax(0,1.65fr)
        minmax(470px,.95fr) !important;
}


.fm-home-v5-radar-feature{
    width:100% !important;

    min-width:0 !important;

    min-height:330px !important;
}


.fm-home-v5-radar-secondary{
    width:100% !important;

    grid-template-columns:
        repeat(3,minmax(0,1fr))
        !important;
}


@media(max-width:1100px){

    .fm-home-v5-radar-grid{
        grid-template-columns:
            1fr !important;
    }


    .fm-home-v5-radar-secondary{
        grid-template-columns:
            repeat(3,minmax(0,1fr))
            !important;
    }

}


@media(max-width:760px){

    .fm-home-v5-radar{
        width:
            calc(100% - 28px)
            !important;
    }

}


/* ============================================================
   HOME V5 · CONTENT FRAME
   Radar bis News als gemeinsamer Workspace
   ============================================================ */

.fm-home-v5-frame{
    width:min(
        calc(100% - 32px),
        1450px
    );

    margin:
        28px auto 34px;

    padding:
        24px 22px 28px;

    border:
        1px solid
        rgba(120,149,166,.20);

    border-radius:
        12px;

    background:
        linear-gradient(
            180deg,
            rgba(8,14,19,.72),
            rgba(6,11,15,.90)
        );

    box-shadow:
        0 20px 70px
        rgba(0,0,0,.16),
        inset 0 1px 0
        rgba(255,255,255,.015);
}


/*
 * Untergeordnete Home-Shells sitzen jetzt
 * innerhalb des gemeinsamen Frames.
 */

.fm-home-v5-frame
.fm-home-v5-radar,

.fm-home-v5-frame
.fm-home-v5-content-grid,

.fm-home-v5-frame
.fm-home-ref-news,

.fm-home-v5-frame
.fm-home-ref-shell{
    width:100% !important;
    max-width:none !important;

    margin-left:0 !important;
    margin-right:0 !important;
}


/* Radar direkt oben im Frame */

.fm-home-v5-frame
.fm-home-v5-radar{
    margin-top:0 !important;
}


/* ============================================================
   PLAYLIST V6
   ============================================================ */

.fm-home-v5-playlist{
    background:
        linear-gradient(
            180deg,
            rgba(9,15,20,.98),
            rgba(6,11,15,.98)
        ) !important;
}


/* ------------------------------------------------------------
   Header
   ------------------------------------------------------------ */

.fm-home-v5-playlist
.fm-home-v5-box-head{
    min-height:64px;

    padding:
        0 18px;
}


.fm-home-v5-playlist
.fm-home-v5-box-head > div{
    display:flex;
    flex-direction:column;

    gap:4px;
}


.fm-home-v5-box-kicker{
    color:#d52d94;

    font-size:7px;
    line-height:1;

    font-weight:950;

    letter-spacing:.12em;
}


/* ------------------------------------------------------------
   Tracks
   ------------------------------------------------------------ */

.fm-home-v5-playlist-list{
    padding:
        6px 15px 4px;
}


.fm-home-v5-track{
    min-height:67px;

    position:relative;

    display:grid;

    grid-template-columns:
        34px
        minmax(0,1fr)
        34px
        40px;

    align-items:center;

    gap:10px;

    padding:
        4px 3px;

    border-bottom:
        1px solid
        rgba(123,151,167,.10);

    transition:
        background .18s ease,
        padding-left .18s ease;
}


.fm-home-v5-track:hover{
    padding-left:7px;

    background:
        linear-gradient(
            90deg,
            rgba(213,45,148,.055),
            transparent 72%
        );
}


.fm-home-v5-track.is-latest{
    background:
        linear-gradient(
            90deg,
            rgba(213,45,148,.07),
            transparent 76%
        );
}


/* ------------------------------------------------------------
   Track Nummer
   ------------------------------------------------------------ */

.fm-home-v5-track-index{
    width:28px;
    height:28px;

    display:grid;
    place-items:center;

    border:
        1px solid
        rgba(117,146,162,.22);

    border-radius:50%;

    color:#71818b;

    font-size:8px;

    font-weight:900;
}


.fm-home-v5-track.is-latest
.fm-home-v5-track-index{
    border-color:
        rgba(213,45,148,.54);

    color:#e252ad;

    box-shadow:
        0 0 14px
        rgba(213,45,148,.10);
}


/* ------------------------------------------------------------
   Artist / Titel
   ------------------------------------------------------------ */

.fm-home-v5-track-copy{
    min-width:0;
}


.fm-home-v5-track-artist-line{
    display:flex;
    align-items:center;

    gap:7px;

    min-width:0;
}


.fm-home-v5-track-artist-line strong{
    min-width:0;

    overflow:hidden;

    color:#f5f8f9;

    font-size:11px;
    line-height:1.25;

    font-weight:850;

    text-overflow:ellipsis;

    white-space:nowrap;
}


.fm-home-v5-track-title{
    display:block;

    margin-top:4px;

    overflow:hidden;

    color:#89979f;

    font-size:9px;
    line-height:1.25;

    text-overflow:ellipsis;

    white-space:nowrap;
}


.fm-home-v5-track-now{
    flex:0 0 auto;

    padding:
        2px 5px;

    border-radius:
        999px;

    background:
        rgba(213,45,148,.12);

    color:#df45a6;

    font-size:6px;

    font-weight:950;

    letter-spacing:.06em;
}


/* ------------------------------------------------------------
   Kleine Waveform
   ------------------------------------------------------------ */

.fm-home-v5-track-wave{
    height:22px;

    display:flex;
    align-items:center;
    justify-content:center;

    gap:2px;

    opacity:.35;
}


.fm-home-v5-track-wave i{
    width:2px;

    display:block;

    border-radius:3px;

    background:#2aafe1;
}


.fm-home-v5-track-wave i:nth-child(1){
    height:6px;
}


.fm-home-v5-track-wave i:nth-child(2){
    height:13px;
}


.fm-home-v5-track-wave i:nth-child(3){
    height:19px;
}


.fm-home-v5-track-wave i:nth-child(4){
    height:10px;
}


.fm-home-v5-track-wave i:nth-child(5){
    height:5px;
}


.fm-home-v5-track.is-latest
.fm-home-v5-track-wave{
    opacity:.85;
}


.fm-home-v5-track.is-latest
.fm-home-v5-track-wave i{
    background:#d52d94;
}


/* ------------------------------------------------------------
   Uhrzeit
   ------------------------------------------------------------ */

.fm-home-v5-track time{
    color:#73828b;

    text-align:right;

    font-size:8px;

    font-variant-numeric:
        tabular-nums;
}


/* ------------------------------------------------------------
   Playlist Footer Button
   ------------------------------------------------------------ */

.fm-home-v5-playlist
.fm-home-v5-box-button{
    min-height:43px;

    margin:
        4px 15px 14px;

    border-color:
        rgba(104,135,151,.25);

    background:
        rgba(255,255,255,.012);

    color:#2aafe1;
}


.fm-home-v5-playlist
.fm-home-v5-box-button:hover{
    border-color:
        rgba(213,45,148,.55);

    color:#fff;

    background:
        rgba(213,45,148,.055);
}


/* ============================================================
   FRAME SPACING
   ============================================================ */

.fm-home-v5-frame
.fm-home-v5-content-grid{
    margin-top:
        18px !important;
}


.fm-home-v5-frame
.fm-home-ref-news{
    margin-top:
        46px !important;
}


/* ============================================================
   RESPONSIVE
   ============================================================ */

@media(max-width:760px){

    .fm-home-v5-frame{
        width:
            calc(100% - 16px);

        padding:
            14px 7px 20px;

        border-radius:
            9px;
    }


    .fm-home-v5-track{
        grid-template-columns:
            30px
            minmax(0,1fr)
            34px;
    }


    .fm-home-v5-track-wave{
        display:none;
    }

}


/* ============================================================
   HOME V5 · DYNAMIC CONTENT GRID
   ============================================================ */

/*
 * Mit Sets:
 * Playlist | Sets | Programm
 */

.fm-home-v5-content-grid.has-sets{
    grid-template-columns:
        minmax(280px,.82fr)
        minmax(400px,1.18fr)
        minmax(340px,.95fr);
}


/*
 * Ohne Sets:
 * Playlist und Programm teilen sich die volle Breite.
 */

.fm-home-v5-content-grid.no-sets{
    grid-template-columns:
        minmax(0,.95fr)
        minmax(0,1.35fr);
}


/*
 * Playlist wird ohne Sets etwas großzügiger.
 */

.fm-home-v5-content-grid.no-sets
.fm-home-v5-playlist{
    min-height:360px;
}


/*
 * Programm ebenfalls vollwertige Karte.
 */

.fm-home-v5-content-grid.no-sets
.fm-home-v5-program{
    min-height:360px;
}


/* ------------------------------------------------------------
   Playlist etwas kräftiger
   ------------------------------------------------------------ */

.fm-home-v5-track{
    min-height:61px;
}


.fm-home-v5-track-index{
    background:
        rgba(255,255,255,.018);
}


.fm-home-v5-track.is-latest{
    box-shadow:
        inset 2px 0 0
        rgba(213,45,148,.72);
}


/* ------------------------------------------------------------
   Program bei echten Slots
   ------------------------------------------------------------ */

.fm-home-v5-program-row.is-live{
    background:
        linear-gradient(
            90deg,
            rgba(213,45,148,.08),
            transparent 72%
        );
}


@media(max-width:980px){

    .fm-home-v5-content-grid.has-sets,
    .fm-home-v5-content-grid.no-sets{
        grid-template-columns:
            1fr;
    }

}


/* ============================================================
   HOME V6 · ZULETZT ON AIR
   ============================================================ */

.fm-home-v6-onair,
.fm-home-v6-sets{
    width:100%;

    margin:
        18px 0 0;

    border:
        1px solid
        rgba(120,149,166,.19);

    border-radius:
        9px;

    background:
        linear-gradient(
            180deg,
            rgba(8,14,19,.96),
            rgba(6,11,15,.98)
        );

    overflow:hidden;
}


.fm-home-v6-head{
    min-height:68px;

    display:flex;
    align-items:center;
    justify-content:space-between;

    gap:20px;

    padding:
        0 20px;

    border-bottom:
        1px solid
        rgba(120,149,166,.10);
}


.fm-home-v6-head > div{
    display:flex;
    flex-direction:column;

    gap:5px;
}


.fm-home-v6-head > div > span{
    color:#d52d94;

    font-size:7px;

    font-weight:950;

    letter-spacing:.12em;
}


.fm-home-v6-head h2{
    margin:0;

    color:#fff;

    font-size:18px;

    font-weight:950;

    letter-spacing:
        -.02em;
}


.fm-home-v6-head a{
    display:flex;
    align-items:center;

    gap:8px;

    color:#2aafe1;

    text-decoration:none;

    font-size:9px;

    font-weight:950;

    letter-spacing:.055em;
}


/* ============================================================
   HORIZONTAL TIMELINE
   ============================================================ */

.fm-home-v6-timeline{
    min-height:225px;

    position:relative;

    display:grid;

    grid-template-columns:
        repeat(6,minmax(0,1fr));

    gap:0;

    padding:
        36px 22px 26px;
}


.fm-home-v6-timeline-line{
    position:absolute;

    left:7%;
    right:7%;

    top:79px;

    height:1px;

    background:
        linear-gradient(
            90deg,
            rgba(213,45,148,.55),
            rgba(42,175,225,.44)
        );

    opacity:.72;
}


.fm-home-v6-track{
    min-width:0;

    position:relative;

    display:flex;
    flex-direction:column;
    align-items:center;

    text-align:center;
}


.fm-home-v6-track time{
    height:26px;

    color:#6f8089;

    font-size:9px;

    font-weight:800;

    font-variant-numeric:
        tabular-nums;
}


.fm-home-v6-node{
    width:18px;
    height:18px;

    position:relative;

    z-index:2;

    display:grid;
    place-items:center;

    margin-bottom:13px;

    border-radius:50%;

    background:#080d12;
}


.fm-home-v6-node span{
    width:8px;
    height:8px;

    display:block;

    border:
        2px solid
        #2aafe1;

    border-radius:50%;

    background:#080d12;
}


.fm-home-v6-track.is-latest
.fm-home-v6-node span{
    border-color:#d52d94;

    background:#d52d94;

    box-shadow:
        0 0 12px
        rgba(213,45,148,.70),
        0 0 24px
        rgba(213,45,148,.28);
}


.fm-home-v6-cover{
    width:52px;
    height:52px;

    display:grid;
    place-items:center;

    overflow:hidden;

    margin-bottom:12px;

    border:
        1px solid
        rgba(120,149,166,.16);

    border-radius:5px;

    background:
        linear-gradient(
            145deg,
            #132029,
            #090e13
        );

    background-size:cover;

    background-position:center;

    box-shadow:
        0 7px 18px
        rgba(0,0,0,.18);
}


.fm-home-v6-cover > span{
    color:
        rgba(255,255,255,.17);

    font-size:13px;

    font-weight:950;
}


.fm-home-v6-track.is-latest
.fm-home-v6-cover{
    border-color:
        rgba(213,45,148,.38);

    box-shadow:
        0 7px 22px
        rgba(0,0,0,.20),
        0 0 18px
        rgba(213,45,148,.08);
}


.fm-home-v6-track-copy{
    width:100%;

    min-width:0;

    padding:
        0 10px;
}


.fm-home-v6-track-copy strong,
.fm-home-v6-track-copy span{
    display:block;

    overflow:hidden;

    text-overflow:ellipsis;

    white-space:nowrap;
}


.fm-home-v6-track-copy strong{
    color:#f5f7f8;

    font-size:10px;

    font-weight:900;
}


.fm-home-v6-track-copy span{
    margin-top:4px;

    color:#798991;

    font-size:8px;
}


/* ============================================================
   EMPTY
   ============================================================ */

.fm-home-v6-empty{
    min-height:170px;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;

    gap:7px;
}


.fm-home-v6-empty span{
    color:#d52d94;

    font-size:7px;

    font-weight:950;
}


.fm-home-v6-empty strong{
    color:#8f9ca3;

    font-size:11px;
}


/* ============================================================
   LATEST SETS OPTIONAL
   ============================================================ */

.fm-home-v6-set-grid{
    display:grid;

    grid-template-columns:
        repeat(3,minmax(0,1fr));

    gap:12px;

    padding:16px;
}


.fm-home-v6-set{
    overflow:hidden;

    border:
        1px solid
        rgba(120,149,166,.16);

    border-radius:6px;

    background:#080d12;
}


.fm-home-v6-set-art{
    height:180px;

    display:grid;
    place-items:center;

    background:
        linear-gradient(
            145deg,
            #14222b,
            #080d12
        );

    background-size:cover;

    background-position:center;
}


.fm-home-v6-set-art span{
    color:
        rgba(255,255,255,.15);

    font-size:48px;

    font-weight:950;
}


.fm-home-v6-set-copy{
    padding:
        12px;
}


.fm-home-v6-set-copy strong,
.fm-home-v6-set-copy span{
    display:block;
}


.fm-home-v6-set-copy strong{
    color:#fff;

    font-size:12px;
}


.fm-home-v6-set-copy span{
    margin-top:5px;

    color:#2aafe1;

    font-size:8px;

    font-weight:900;
}


/* ============================================================
   MOBILE
   ============================================================ */

@media(max-width:900px){

    .fm-home-v6-timeline{
        display:flex;

        overflow-x:auto;

        scroll-snap-type:
            x mandatory;

        padding:
            34px 15px 24px;
    }


    .fm-home-v6-timeline-line{
        display:none;
    }


    .fm-home-v6-track{
        min-width:145px;

        scroll-snap-align:start;
    }


    .fm-home-v6-set-grid{
        display:flex;

        overflow-x:auto;
    }


    .fm-home-v6-set{
        min-width:220px;
    }

}


/* ============================================================
   HOME V6 · FINAL POLISH
   RADAR + ZULETZT ON AIR
   ============================================================ */


/* ============================================================
   RADAR FEATURE
   ============================================================ */

.fm-home-v5-radar-feature-radar{
    width:330px !important;
    height:330px !important;

    right:28px !important;

    opacity:.80 !important;

    filter:
        drop-shadow(
            0 0 24px
            rgba(213,45,148,.08)
        );
}


.fm-home-v5-radar-feature-radar i:nth-child(1){
    width:64px !important;
    height:64px !important;
}


.fm-home-v5-radar-feature-radar i:nth-child(2){
    width:124px !important;
    height:124px !important;
}


.fm-home-v5-radar-feature-radar i:nth-child(3){
    width:196px !important;
    height:196px !important;
}


.fm-home-v5-radar-feature-radar i:nth-child(4){
    width:286px !important;
    height:286px !important;
}


.fm-home-v5-radar-feature-radar b{
    width:12px !important;
    height:12px !important;

    box-shadow:
        0 0 12px
        rgba(213,45,148,.95),
        0 0 32px
        rgba(213,45,148,.50),
        0 0 52px
        rgba(213,45,148,.22) !important;
}


/* ============================================================
   RADAR SECONDARY FALLBACK
   ============================================================ */

.fm-home-v5-radar-card-image.no-image{
    background:
        radial-gradient(
            circle at 52% 38%,
            rgba(213,45,148,.14),
            transparent 28%
        ),
        radial-gradient(
            circle at 65% 56%,
            rgba(42,175,225,.09),
            transparent 45%
        ),
        linear-gradient(
            145deg,
            #101a21,
            #080d12
        ) !important;
}


.fm-home-v5-radar-fallback{
    position:relative;

    z-index:1;

    display:flex;
    align-items:flex-end;

    gap:4px;

    opacity:.22;

    transform:
        translateY(-4px);
}


.fm-home-v5-radar-fallback span{
    font-size:42px !important;
    line-height:.8;

    font-weight:950;

    letter-spacing:-.06em;

    color:#fff !important;
}


.fm-home-v5-radar-fallback small{
    margin-bottom:2px;

    font-size:12px;

    font-weight:950;

    color:#fff;
}


/* ============================================================
   RADAR SECONDARY CARDS
   ============================================================ */

.fm-home-v5-radar-card-image{
    min-height:224px !important;
}


.fm-home-v5-radar-card-copy{
    min-height:108px !important;

    padding:
        11px 12px 13px !important;
}


.fm-home-v5-radar-card-copy strong{
    font-size:14px !important;
}


.fm-home-v5-radar-card-arrow{
    width:27px !important;
    height:27px !important;
}


/* ============================================================
   ON AIR TIMELINE · DICHTER UND KRÄFTIGER
   ============================================================ */

.fm-home-v6-timeline{
    min-height:204px !important;

    padding:
        26px 28px 22px !important;
}


.fm-home-v6-timeline-line{
    top:69px !important;

    left:8% !important;
    right:8% !important;

    height:2px !important;

    background:
        linear-gradient(
            90deg,
            rgba(213,45,148,.76) 0%,
            rgba(213,45,148,.40) 18%,
            rgba(42,175,225,.58) 46%,
            rgba(42,175,225,.42) 100%
        ) !important;

    box-shadow:
        0 0 8px
        rgba(42,175,225,.08);
}


/* ============================================================
   TRACK TIME
   ============================================================ */

.fm-home-v6-track-time{
    height:33px;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:flex-end;

    gap:2px;
}


.fm-home-v6-track-time > span{
    color:#d52d94;

    font-size:6px;

    font-weight:950;

    letter-spacing:.08em;
}


.fm-home-v6-track-time time{
    height:auto !important;

    color:#71828c;

    font-size:8px !important;

    font-weight:850;
}


.fm-home-v6-track.is-latest
.fm-home-v6-track-time time{
    color:#dce5e9;
}


/* ============================================================
   NODES
   ============================================================ */

.fm-home-v6-node{
    margin-bottom:9px !important;
}


.fm-home-v6-node span{
    width:9px !important;
    height:9px !important;

    border-width:2px !important;
}


.fm-home-v6-track.is-latest
.fm-home-v6-node span{
    width:11px !important;
    height:11px !important;

    box-shadow:
        0 0 10px
        rgba(213,45,148,.88),
        0 0 22px
        rgba(213,45,148,.42) !important;
}


/* ============================================================
   TRACK COVERS
   ============================================================ */

.fm-home-v6-cover{
    width:58px !important;
    height:58px !important;

    margin-bottom:9px !important;

    border-color:
        rgba(120,149,166,.22) !important;

    background:
        radial-gradient(
            circle at 55% 34%,
            rgba(213,45,148,.12),
            transparent 30%
        ),
        linear-gradient(
            145deg,
            #14232b,
            #080d12
        ) !important;
}


.fm-home-v6-cover > span{
    font-size:14px !important;

    opacity:.70;
}


.fm-home-v6-track.is-latest
.fm-home-v6-cover{
    width:64px !important;
    height:64px !important;

    border-color:
        rgba(213,45,148,.58) !important;

    box-shadow:
        0 8px 24px
        rgba(0,0,0,.22),
        0 0 20px
        rgba(213,45,148,.16) !important;
}


/* ============================================================
   TRACK TEXT
   ============================================================ */

.fm-home-v6-track-copy{
    padding:
        0 8px !important;
}


.fm-home-v6-track-copy strong{
    font-size:10px !important;
}


.fm-home-v6-track-copy span{
    margin-top:3px !important;

    font-size:7px !important;

    line-height:1.25;
}


/* ============================================================
   TIMELINE HOVER
   ============================================================ */

.fm-home-v6-track{
    transition:
        transform .16s ease,
        opacity .16s ease;
}


.fm-home-v6-track:hover{
    transform:
        translateY(-3px);
}


.fm-home-v6-track:not(.is-latest){
    opacity:.86;
}


.fm-home-v6-track:not(.is-latest):hover{
    opacity:1;
}


/* ============================================================
   ABSTAND NEWS
   ============================================================ */

.fm-home-v5-frame
.fm-home-ref-news{
    margin-top:
        30px !important;
}


/* ============================================================
   FRAME ETWAS KOMPAKTER
   ============================================================ */

.fm-home-v5-frame{
    padding-bottom:
        22px !important;
}


/* ============================================================
   RESPONSIVE
   ============================================================ */

@media(max-width:980px){

    .fm-home-v5-radar-feature-radar{
        width:250px !important;
        height:250px !important;

        right:4px !important;
    }

}


@media(max-width:760px){

    .fm-home-v6-timeline{
        min-height:auto !important;

        padding:
            24px 14px 20px !important;
    }


    .fm-home-v6-track-time{
        height:30px;
    }


    .fm-home-v6-cover{
        width:54px !important;
        height:54px !important;
    }


    .fm-home-v6-track.is-latest
    .fm-home-v6-cover{
        width:58px !important;
        height:58px !important;
    }

}


/* ============================================================
   320 FM · COMMUNITY
   SUPPORT + NEWSLETTER
   ============================================================ */

.fm-home-community{
    width:100%;

    display:grid;

    grid-template-columns:
        repeat(2,minmax(0,1fr));

    gap:14px;

    margin:
        30px 0 0;
}


/* ============================================================
   CARD
   ============================================================ */

.fm-home-community-card{
    min-height:285px;

    position:relative;

    overflow:hidden;

    display:flex;

    border:
        1px solid
        rgba(120,149,166,.20);

    border-radius:
        9px;

    background:
        linear-gradient(
            145deg,
            rgba(10,17,22,.98),
            rgba(5,10,14,.99)
        );

    isolation:isolate;
}


/* ============================================================
   COPY
   ============================================================ */

.fm-home-community-content{
    width:58%;

    position:relative;

    z-index:4;

    display:flex;
    flex-direction:column;
    align-items:flex-start;

    padding:
        31px 30px 27px;
}


.fm-home-community-kicker{
    margin-bottom:16px;

    color:#d52d94;

    font-size:8px;
    line-height:1;

    font-weight:950;

    letter-spacing:.11em;
}


.fm-home-community h2{
    margin:0;

    color:#fff;

    font-size:
        clamp(25px,2.25vw,36px);

    line-height:.94;

    font-weight:950;

    letter-spacing:
        -.04em;
}


.fm-home-community p{
    max-width:390px;

    margin:
        16px 0 21px;

    color:#91a0a8;

    font-size:12px;
    line-height:1.55;
}


/* ============================================================
   SUPPORT VISUAL
   ============================================================ */

.fm-home-community-visual{
    width:42%;

    position:absolute;

    inset:
        0 0 0 auto;

    display:grid;
    place-items:center;

    overflow:hidden;

    background:
        radial-gradient(
            circle at 55% 50%,
            rgba(213,45,148,.15),
            transparent 24%
        );
}


.fm-home-community-support-mark{
    position:relative;

    z-index:3;

    display:flex;
    align-items:flex-end;

    gap:5px;

    color:
        rgba(255,255,255,.18);
}


.fm-home-community-support-mark span{
    font-size:70px;

    line-height:.8;

    font-weight:950;

    letter-spacing:
        -.07em;
}


.fm-home-community-support-mark small{
    margin-bottom:4px;

    font-size:20px;

    font-weight:950;
}


.fm-home-community-visual > i{
    position:absolute;

    width:210px;
    height:210px;

    border:
        1px solid
        rgba(213,45,148,.10);

    border-radius:50%;
}


.fm-home-community-visual > i:nth-of-type(2){
    width:150px;
    height:150px;

    opacity:.78;
}


.fm-home-community-visual > i:nth-of-type(3){
    width:90px;
    height:90px;

    opacity:.60;
}


/* ============================================================
   SUPPORT FOOTER
   ============================================================ */

.fm-home-community-footer{
    display:flex;
    align-items:center;

    gap:13px;

    margin-top:auto;
}


.fm-home-community-coming{
    color:#2aafe1;

    font-size:8px;

    font-weight:950;

    letter-spacing:.055em;
}


.fm-home-community-arrow{
    width:28px;
    height:28px;

    display:grid;
    place-items:center;

    border:
        1px solid
        rgba(213,45,148,.52);

    border-radius:50%;

    color:#fff;

    font-size:11px;
}


/* ============================================================
   NEWSLETTER
   ============================================================ */

.fm-home-community-newsletter{
    background:
        radial-gradient(
            circle at 82% 48%,
            rgba(42,175,225,.12),
            transparent 30%
        ),
        radial-gradient(
            circle at 68% 65%,
            rgba(213,45,148,.10),
            transparent 38%
        ),
        linear-gradient(
            145deg,
            rgba(10,17,22,.98),
            rgba(5,10,14,.99)
        );
}


.fm-home-community-newsletter-preview{
    width:min(
        100%,
        355px
    );

    min-height:42px;

    display:grid;

    grid-template-columns:
        minmax(0,1fr)
        43px;

    margin-top:auto;

    border:
        1px solid
        rgba(120,149,166,.26);

    border-radius:
        5px;

    overflow:hidden;

    background:
        rgba(2,7,10,.35);
}


.fm-home-community-newsletter-preview > div{
    display:flex;
    align-items:center;

    padding:
        0 13px;
}


.fm-home-community-newsletter-preview
span{
    color:#61717a;

    font-size:8px;

    font-weight:850;

    letter-spacing:.055em;
}


.fm-home-community-newsletter-preview
button{
    display:grid;
    place-items:center;

    padding:0;

    border:0;
    border-left:
        1px solid
        rgba(213,45,148,.35);

    background:
        rgba(213,45,148,.10);

    color:#2aafe1;

    font-size:13px;

    pointer-events:none;
}


.fm-home-community-note{
    display:block;

    margin-top:8px;

    color:#5d6d76;

    font-size:7px;
    line-height:1.4;
}


/* ============================================================
   NEWSLETTER SIGNAL
   ============================================================ */

.fm-home-community-signal{
    width:42%;

    position:absolute;

    right:0;
    top:0;
    bottom:0;

    display:grid;
    place-items:center;

    pointer-events:none;

    opacity:.72;
}


.fm-home-community-signal i{
    position:absolute;

    width:72px;
    height:72px;

    border:
        1px solid
        rgba(42,175,225,.13);

    border-radius:50%;
}


.fm-home-community-signal i:nth-child(2){
    width:135px;
    height:135px;
}


.fm-home-community-signal i:nth-child(3){
    width:205px;
    height:205px;

    opacity:.60;
}


.fm-home-community-signal strong{
    color:
        rgba(255,255,255,.08);

    font-size:64px;

    font-weight:950;

    letter-spacing:
        -.07em;
}


/* ============================================================
   NEWS ABSTAND
   ============================================================ */

.fm-home-community
+
.fm-home-ref-news{
    margin-top:
        32px !important;
}


/* ============================================================
   RESPONSIVE
   ============================================================ */

@media(max-width:850px){

    .fm-home-community{
        grid-template-columns:1fr;
    }


    .fm-home-community-card{
        min-height:260px;
    }

}


@media(max-width:560px){

    .fm-home-community-content{
        width:72%;

        padding:
            25px 21px;
    }


    .fm-home-community-visual,
    .fm-home-community-signal{
        width:40%;
    }


    .fm-home-community h2{
        font-size:27px;
    }

}


/* ============================================================
   320 FM · HOME TYPOGRAPHY NORMALIZATION
   Verbindliche Lesbarkeitsstufe für den neuen Contentbereich.
   Header und Hero werden nicht verändert.
   ============================================================ */


/* ------------------------------------------------------------
   ALLGEMEINE SECTION HEADLINES
   ------------------------------------------------------------ */

.fm-home-v5-frame
.fm-home-v5-section-title h2,

.fm-home-v5-frame
.fm-home-v6-head h2,

.fm-home-v5-frame
.fm-home-community h2,

.fm-home-v5-frame
.fm-home-ref-news h2{
    text-rendering:optimizeLegibility;
}


/* Radar Hauptüberschrift */

.fm-home-v5-section-title h2{
    font-size:24px !important;
    line-height:1.08 !important;
}


/* ------------------------------------------------------------
   KICKER / EYEBROWS
   Niemals wieder 6–8 px.
   ------------------------------------------------------------ */

.fm-home-v5-kicker,

.fm-home-v5-small-kicker,

.fm-home-v6-head > div > span,

.fm-home-community-kicker,

.fm-home-v5-box-kicker,

.fm-home-v5-track-now,

.fm-home-v6-track-time > span{
    font-size:10px !important;
    line-height:1.15 !important;

    font-weight:900 !important;

    letter-spacing:.075em !important;
}


/* ------------------------------------------------------------
   MODUL-LINKS
   ------------------------------------------------------------ */

.fm-home-v5-section-link,

.fm-home-v6-head > a,

.fm-home-community a,

.fm-home-v5-box-head a{
    font-size:11px !important;
    line-height:1.2 !important;

    font-weight:850 !important;
}


/* ============================================================
   RADAR
   ============================================================ */

.fm-home-v5-radar-type{
    font-size:12px !important;
    line-height:1.3 !important;
}


.fm-home-v5-radar-copy{
    font-size:15px !important;
    line-height:1.58 !important;

    color:#aab6bc !important;
}


.fm-home-v5-outline-button{
    font-size:11px !important;

    min-height:44px !important;
}


/* Kleine Residentkarten */

.fm-home-v5-radar-card-copy strong{
    font-size:16px !important;
    line-height:1.15 !important;
}


.fm-home-v5-radar-card-copy small{
    font-size:10px !important;
    line-height:1.25 !important;

    margin-top:6px !important;
}


.fm-home-v5-small-kicker{
    margin-bottom:8px !important;
}


/* ============================================================
   ZULETZT ON AIR
   ============================================================ */

.fm-home-v6-track-time{
    gap:4px !important;
}


.fm-home-v6-track-time time{
    font-size:11px !important;
    line-height:1.2 !important;

    color:#87979f !important;
}


.fm-home-v6-track-copy strong{
    font-size:13px !important;
    line-height:1.25 !important;
}


.fm-home-v6-track-copy span{
    margin-top:5px !important;

    font-size:11px !important;
    line-height:1.35 !important;

    color:#87969e !important;
}


/*
 * Mit größerer Schrift etwas mehr Platz unter der Timeline.
 */

.fm-home-v6-timeline{
    min-height:224px !important;
}


/* ============================================================
   LATEST SETS
   ============================================================ */

.fm-home-v6-set-copy strong{
    font-size:14px !important;
    line-height:1.25 !important;
}


.fm-home-v6-set-copy span{
    margin-top:6px !important;

    font-size:11px !important;
    line-height:1.3 !important;
}


/* ============================================================
   SUPPORT / NEWSLETTER
   ============================================================ */

.fm-home-community-kicker{
    margin-bottom:15px !important;
}


.fm-home-community h2{
    font-size:
        clamp(28px,2.2vw,38px)
        !important;

    line-height:.98 !important;
}


.fm-home-community p{
    font-size:14px !important;
    line-height:1.6 !important;

    color:#a3b0b7 !important;
}


.fm-home-community-coming{
    font-size:11px !important;
    line-height:1.25 !important;
}


.fm-home-community-newsletter-preview span{
    font-size:11px !important;
}


.fm-home-community-note{
    margin-top:10px !important;

    font-size:10px !important;
    line-height:1.45 !important;
}


/* ============================================================
   NEWS
   Bestehendes Newsdesign nur lesbarer machen.
   ============================================================ */

.fm-home-v5-frame
.fm-home-ref-news{
    font-size:14px;
}


.fm-home-v5-frame
.fm-home-ref-news p{
    font-size:14px !important;
    line-height:1.58 !important;
}


.fm-home-v5-frame
.fm-home-ref-news small,

.fm-home-v5-frame
.fm-home-ref-news time,

.fm-home-v5-frame
.fm-home-ref-news .category,

.fm-home-v5-frame
.fm-home-ref-news [class*="meta"]{
    font-size:11px !important;
    line-height:1.3 !important;
}


/* ============================================================
   BUTTONS GENERELL
   ============================================================ */

.fm-home-v5-frame button,

.fm-home-v5-frame
a.fm-home-v5-box-button{
    font-size:11px !important;
}


/* ============================================================
   MOBILE
   Nicht alles wieder winzig skalieren.
   ============================================================ */

@media(max-width:760px){

    .fm-home-v5-section-title h2,
    .fm-home-v6-head h2{
        font-size:20px !important;
    }


    .fm-home-v5-radar-copy,
    .fm-home-community p{
        font-size:14px !important;
    }


    .fm-home-v6-track-copy strong{
        font-size:13px !important;
    }


    .fm-home-v6-track-copy span{
        font-size:11px !important;
    }


    .fm-home-v6-track-time time{
        font-size:11px !important;
    }


    .fm-home-v5-kicker,
    .fm-home-v5-small-kicker,
    .fm-home-v6-head > div > span,
    .fm-home-community-kicker{
        font-size:10px !important;
    }

}
