.roadmap-item{
    padding:14px 18px;

    margin-bottom:15px;

    border-radius:14px;

    font-size:16px;

    transition:0.25s;
}

/* terminé */
.roadmap-item.done{
    background:rgba(0,180,80,0.12);

    border:1px solid rgba(0,255,120,0.15);

    color:#7dffae;
}

/* en cours */
.roadmap-item.progress{
    background:rgba(0,140,255,0.12);

    border:1px solid rgba(0,195,255,0.15);

    color:#8ed8ff;
}

/* futur */
.roadmap-item.todo{
    background:rgba(255,255,255,0.05);

    border:1px solid rgba(255,255,255,0.05);

    color:#cfcfcf;
}

.roadmap-item:hover{
    transform:translateX(6px);
}

/*bar de progression */

.global-progress{
    margin-bottom:35px;
}

.global-progress-header{
    display:flex;
    justify-content:space-between;

    margin-bottom:12px;

    font-size:18px;
    font-weight:bold;

    color:#8ed8ff;
}

.global-progress-bar{
    width:100%;
    height:18px;

    background:rgba(255,255,255,0.06);

    border-radius:50px;

    overflow:hidden;
}

.global-progress-fill{
    height:100%;

    border-radius:50px;
}

.site-progress{
    width:45%;

    background:
        linear-gradient(
            90deg,
            #00b894,
            #55efc4
        );

    box-shadow:
        0 0 15px rgba(85,239,196,0.4);
}

.logiciel-progress{
    width:5%;

    background:
        linear-gradient(
            90deg,
            #0984e3,
            #00cec9
        );

    box-shadow:
        0 0 15px rgba(0,206,201,0.4);
}