section.homepage{
    height: 100svh;
    width: 90svw;
    overflow: hidden;
}

section.homepage article{
    padding: 2rem 2rem;
    margin: 2svh 4svw;
}
section.homepage article.home{
    height: calc(31svh - 2rem);
    display: flex;
}
section.homepage article.home > *{
    flex: 1;
}
section.homepage article.home a.last_doc{
    align-content: center;
    text-align: center;
}


section.homepage article.action{
    height: calc(6svh - 2rem);
    display: flex;
    justify-content: space-around;
    align-items: center;
}
section.homepage article.action a.action_link{
    padding: 1rem;
}


section.homepage article.features{
    height: calc(53svh - 3rem);
    display: flex;
    padding: 0;
    margin-bottom: 0;
}
section.homepage article.features > div{
    flex: 1;
    padding: 2rem;
}
section.homepage article.features div.doc_list{
    margin-top: 1rem;
    padding: 1rem;
    overflow-x: hidden;
    overflow-y: auto;
    background-color: transparent;
    box-shadow: none !important;
    max-height: calc(100% - 4rem);
}
div.doc_list::-webkit-scrollbar {
    width: 8px;
    background: transparent;
}
div.doc_list::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, 0.2); /* change ceci à ton goût */
    border-radius: 4px;
}
div.doc_list::-webkit-scrollbar-thumb:hover {
    background-color: rgba(0, 0, 0, 0.089); /* change ceci à ton goût */
}
div.doc_list::-webkit-scrollbar-thumb:active {
    background-color: #4CB8C46b; /* change ceci à ton goût */
}
section.homepage article.features a{
    padding: 0 2rem;
    margin-block: 0.5rem;
    display: flex;
    align-items: baseline;
}
section.homepage article.features a > p{
    flex: 1;
    overflow: hidden;
    text-wrap: nowrap;
}
section.homepage article.features a p.title{
    font-weight: bold;
    color: #4CB8C4;
    i{
        margin-right: 1ch;
    }
}
section.homepage article.features a p.additional_data{
    text-align: right;
}
section.homepage article.features > div:first-child{
    margin-right: 0.5rem;
}
section.homepage article.features > div:last-child{
    margin-left: 0.5rem;
}


/* MOBILE */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
    section.homepage article.home,
    section.homepage article.features{
        flex-direction: column;
    }
}

/* TABLET */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {

}

/* DESKTOP */
@media only screen and (min-width : 1224px) {

}