/* Fonts import */

    @font-face {
        font-family: 'regular';
        src: url('../fnt/Futura/FuturaPT-Medium.eot');
        src: url('../fnt/Futura/FuturaPT-Medium.eot?#iefix') format('embedded-opentype'),
            url('../fnt/Futura/FuturaPT-Medium.woff2') format('woff2'),
            url('../fnt/Futura/FuturaPT-Medium.woff') format('woff'),
            url('../fnt/Futura/FuturaPT-Medium.ttf') format('truetype'),
            url('../fnt/Futura/FuturaPT-Medium.svg#../fnt/Futura/FuturaPT-Medium') format('svg');
        font-weight: 500;
        font-style: normal;
        font-display: swap;
    }

    @font-face {
        font-family: 'bold';
        src: url('../fnt/Futura/FuturaPT-Heavy.eot');
        src: url('../fnt/Futura/FuturaPT-Heavy.eot?#iefix') format('embedded-opentype'),
            url('../fnt/Futura/FuturaPT-Heavy.woff2') format('woff2'),
            url('../fnt/Futura/FuturaPT-Heavy.woff') format('woff'),
            url('../fnt/Futura/FuturaPT-Heavy.ttf') format('truetype'),
            url('../fnt/Futura/FuturaPT-Heavy.svg#../fnt/Futura/FuturaPT-Heavy') format('svg');
        font-weight: 900;
        font-style: normal;
        font-display: swap;
    }

/* General setting */

    *:not(ul){
        margin: unset;
        padding: unset;
        position: relative;
        font-size: 1rem;
        font-family: 'regular';
        box-sizing: border-box;
    }

    html, body{
        width: 100%;
        height: 100%;
    }

    body{
        --color-primary : #7551F5;
    }

/* Head */

    #app-head{
        width: 100%;
        height: auto;

        position: fixed;
        left: 0;
        top: 0;
        z-index: 2;

        display: flex;
        justify-content: space-between;
        align-items: center;

        padding: 20px;
        border-bottom: 1px solid rgba(0 0 0/.1);

        background: rgba(255 255 255/.1);
        backdrop-filter: blur(10px);
    }
        #app-head > .logo{
            display: flex;
            justify-content: center;
            align-items: center;
        }
        #app-head > .logo > svg{
            width: 30px;
            height: 30px;
        }

        .app-redirection{
            width: auto;
            height: auto;

            display: inline-flex;
            justify-content: center;
            align-items: center;

            border: 1px solid rgba(0 0 0/.2);
            border-radius: 15px;
            padding: 10px;

            transition: .2s ease-in-out;

            background: #fff;
            text-decoration: unset;
        }

        .app-redirection > span{
            display: block;
            font-size: 1rem;
            color: #000;
            white-space: nowrap;
        }
        .app-redirection > svg{
            width: 20px;
            height: 20px;
            color: #000;
            margin-left: 5px;
        }
        .app-redirection:active{
            background: #7551f547;
        }


/* body */

    #app-cadre{
        width: 100%;
        height: auto;

        margin-top: 100px;
        padding: 15px;

        z-index: 1;
    }

    .title{
        font-size: 1.5rem;
        display: block;
        margin-bottom: 5px;
        font-family: 'bold';
    }
    .wording{
        margin-bottom: 30px;
    }

    .section{
        margin-bottom: 30px;
    }
    .section:not(:nth-child(6), :nth-child(10), :nth-child(14)){
        border-bottom: 1px solid rgba(0 0 0/.2);
    }
    .section > .text > span:last-child{
        padding-bottom: 30px;
    }

    .section > .label{
        font-size: 1.2rem;
        text-transform: initial;
        font-family: 'bold';
        margin-bottom: 5px;
    }
    .section:is(.base) > .label{
        text-transform: uppercase;
    }

    ul{
        list-style: square;
        padding-left: 15px;
    }
    ul > li{
        margin-bottom: 5px;
    }

    .section > .text > span{
        display: block;
    }
    .section > .text > span > span,
    .section > .text > ul > li > span{
        font-weight: bold;
    }

     .section > .text > span + span{
        margin-top: 15px;
     }
