/* =====================================================
   RADYO32 DENEYIMI V50
   ===================================================== */

.r50-experience{
    width:100%;
    padding:58px 0;

    background:
        radial-gradient(circle at 76% 45%,rgba(84,55,197,.16),transparent 32%),
        linear-gradient(110deg,#091321,#0a1220 58%,#111532);
}

.r50-experience .wrap{
    width:min(1240px,calc(100% - 36px))!important;
}

.r50-experience-grid{
    display:grid;
    grid-template-columns:minmax(0,1fr) 570px;
    gap:65px;
    align-items:center;
}


/* SOL */

.r50-experience-copy{
    min-width:0;
}

.r50-kicker{
    display:flex;
    align-items:center;
    gap:9px;
    margin-bottom:13px;
}

.r50-kicker span{
    color:#46d6bd;
    font-size:8px;
    font-weight:900;
    letter-spacing:1px;
}

.r50-kicker i{
    display:block;
    width:32px;
    height:1px;
    background:linear-gradient(90deg,#3282d8,transparent);
}

.r50-experience-copy h2{
    max-width:620px;
    margin:0;

    color:#fff;

    font-size:39px;
    line-height:1.14;
    font-weight:850;

    letter-spacing:-1.5px;
}

.r50-experience-copy p{
    max-width:570px;

    margin:20px 0 0;

    color:#a0abbd;

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

.r50-actions{
    display:flex;
    align-items:center;
    gap:10px;

    margin-top:25px;
}

.r50-actions a{
    min-height:43px;

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

    padding:10px 18px;

    border-radius:11px;

    color:#fff;

    text-decoration:none;

    font-size:9px;
    font-weight:850;

    transition:.18s ease;
}

.r50-primary{
    border:0;

    background:
        linear-gradient(135deg,#ff2e73,#d822b0,#743ff2);

    box-shadow:
        0 10px 26px rgba(208,36,137,.28);
}

.r50-secondary{
    border:1px solid rgba(255,255,255,.10);

    background:#0a101b;
}

.r50-actions a:hover{
    transform:translateY(-2px);
}


/* SAG KART */

.r50-chart-card{
    position:relative;

    width:100%;

    padding:20px;

    overflow:hidden;

    border:1px solid rgba(255,255,255,.12);
    border-radius:19px;

    background:
        radial-gradient(circle at 100% 0%,rgba(90,58,205,.18),transparent 38%),
        linear-gradient(145deg,#0d1625,#0a1220);

    box-shadow:
        0 20px 55px rgba(0,0,0,.24);
}

.r50-chart-card:before{
    content:"";

    position:absolute;

    left:0;
    right:0;
    top:0;

    height:1px;

    background:
        linear-gradient(90deg,transparent,#7644e8,#de2d94,transparent);
}


/* BASLIK */

.r50-chart-head{
    display:flex;
    align-items:center;

    margin-bottom:12px;
}

.r50-chart-head span{
    display:flex;
    align-items:center;
    gap:7px;

    color:#b7c0d0;

    font-size:8px;
    font-weight:900;

    letter-spacing:.7px;
}

.r50-chart-head i{
    width:20px;
    height:20px;

    display:grid;
    place-items:center;

    border-radius:50%;

    color:#cf42e8;

    background:rgba(186,52,227,.09);

    font-style:normal;
}


/* EQUALIZER */

.r50-equalizer{
    height:70px;

    display:flex;

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

    gap:4px;

    padding:0 10px 11px;

    border-bottom:1px solid rgba(255,255,255,.07);
}

.r50-equalizer i{
    width:6px;

    height:var(--h);

    display:block;

    border-radius:4px 4px 1px 1px;

    background:
        linear-gradient(
            to top,
            #2788ef 0%,
            #7746ef 46%,
            #ef2bb2 100%
        );

    animation:r50eq 1.15s ease-in-out infinite alternate;

    animation-delay:var(--d);
}

@keyframes r50eq{
    from{
        transform:scaleY(.45);
        opacity:.72;
    }

    to{
        transform:scaleY(1);
        opacity:1;
    }
}


/* LISTE */

.r50-mini-list{
    margin-top:0;
}

.r50-mini-list article{
    min-height:57px;

    display:grid;

    grid-template-columns:30px 22px 42px minmax(0,1fr) 34px;

    align-items:center;

    gap:8px;

    padding:7px 5px;

    border-bottom:1px solid rgba(255,255,255,.065);
}

.r50-mini-list article:last-child{
    border-bottom:0;
}

.r50-number{
    color:#8996aa;

    font-size:10px;
}

.r50-trend{
    color:#c54bf1;

    text-align:center;

    font-size:10px;
}

.r50-mini-cover{
    width:42px;
    height:42px;

    overflow:hidden;

    display:grid;
    place-items:center;

    border-radius:9px;

    color:#fff;

    background:#172338;
}

.r50-mini-cover img{
    width:100%;
    height:100%;

    object-fit:cover;
}

.r50-mini-song{
    min-width:0;
}

.r50-mini-song strong,
.r50-mini-song span{
    display:block;

    overflow:hidden;

    white-space:nowrap;
    text-overflow:ellipsis;
}

.r50-mini-song strong{
    color:#fff;

    font-size:10px;
    font-weight:750;
}

.r50-mini-song span{
    margin-top:3px;

    color:#7f8ca0;

    font-size:8px;
}

.r50-mini-play{
    width:30px!important;
    height:30px!important;

    display:grid!important;
    place-items:center!important;

    padding:0!important;

    border:1px solid rgba(255,255,255,.10)!important;
    border-radius:50%!important;

    background:#121d2e!important;

    color:#fff!important;

    font-size:9px!important;

    cursor:pointer;
}

.r50-mini-play.disabled{
    opacity:.4;
}


/* TABLET */

@media(max-width:1050px){

    .r50-experience-grid{
        grid-template-columns:1fr;
        gap:35px;
    }

    .r50-experience-copy{
        text-align:center;
    }

    .r50-kicker{
        justify-content:center;
    }

    .r50-experience-copy h2,
    .r50-experience-copy p{
        margin-left:auto;
        margin-right:auto;
    }

    .r50-actions{
        justify-content:center;
    }

    .r50-chart-card{
        max-width:700px;
        margin:auto;
    }
}


/* MOBIL */

@media(max-width:650px){

    .r50-experience{
        padding:38px 0;
    }

    .r50-experience .wrap{
        width:calc(100% - 16px)!important;
    }

    .r50-experience-copy h2{
        font-size:29px;
        line-height:1.14;
    }

    .r50-experience-copy p{
        font-size:10px;
    }

    .r50-actions{
        display:grid;
        grid-template-columns:1fr 1fr;
    }

    .r50-actions a{
        padding:9px 10px;
    }

    .r50-chart-card{
        padding:13px;
        border-radius:15px;
    }

    .r50-equalizer{
        gap:3px;
        height:58px;
    }

    .r50-equalizer i{
        width:4px;
    }

    .r50-mini-list article{
        grid-template-columns:27px 18px 38px minmax(0,1fr) 30px;
        gap:6px;
    }

    .r50-mini-cover{
        width:38px;
        height:38px;
    }
}

@media(max-width:390px){

    .r50-actions{
        grid-template-columns:1fr;
    }

    .r50-experience-copy h2{
        font-size:26px;
    }
}

/* END EXPERIENCE V50 */