/*=====================================
GRID
=====================================*/

.challenges-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:30px;
}

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

.challenge-card{

    background:#16161B;
    border:1px solid rgba(255,255,255,.08);
    border-radius:24px;

    min-height:280px;

    padding:40px 30px;

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

    text-align:center;

    transition:.35s ease;
}

.challenge-card:hover{

    transform:translateY(-8px);

    border-color:#ED4C84;

    box-shadow:
    0 18px 40px rgba(0,0,0,.35),
    0 0 28px rgba(237,76,132,.18);

}

/*=====================================
ICON
=====================================*/

.challenge-icon{

    width:70px;
    height:70px;

    border-radius:50%;

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

    margin-bottom:22px;

    background:rgba(237,76,132,.10);

    border:1px solid rgba(237,76,132,.25);

    transition:.35s ease;

}

.challenge-icon i{

    color:#ED4C84;
    font-size:28px;

}

.challenge-card:hover .challenge-icon{

    background:#ED4C84;
    transform:scale(1.08);

}

.challenge-card:hover .challenge-icon i{

    color:#fff;

}

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

.challenge-card h3{

    color:#fff;
    font-size:24px;
    margin-bottom:14px;
    font-weight:700;

}

.challenge-card p{

    max-width:280px;

    color:#A7A7B3;

    line-height:1.8;

    font-size:15px;

}

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

@media(max-width:768px){

    .challenges-grid{

        grid-template-columns:1fr;

    }

}