
*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

body {
    margin: 0;
    height: 100vh;

    /*background set*/
    background-image: url('../img/background_tree.jpg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment:fixed;
    display:flex;
    justify-content:center;
    align-items:center;

    font-family:Arial, sans-serif;
}

.logo{
    position:fixed;
    top:20px;
    left:20px;
    width:120px;
    border-radius:15px;

    box-shadow:0 10px 25px rgba(0,0,0,0.4);
}

.container{
    display:flex;
    flex-direction:column;

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

    gap:20px;
}

.box{
    background:rgba(0,0,0,0.45); /* assombrit derrière le texte */
    backdrop-filter:blur(6px);
    border-radius:20px;
    text-align:center;
    width:min(900px, 92%);
    margin:auto;
    text-align:center;
    margin-top: 100px;
    padding: 20px;
}

h1{
    color:#d8ffd8; /* vert très clair */
    font-size:60px;

    text-shadow:
        0 0 10px rgba(0,0,0,0.7),
        0 0 20px rgba(0,0,0,0.5);
}

p{
    color:white;
    font-size:26px;

    text-shadow:0 0 8px rgba(0,0,0,0.7);
}
a{
    display:inline-block;
    background:#3fa34d;
    color:white;

    text-decoration:none;

    transition:0.3s;
}
.fixed-buttons{
    position:fixed;
    bottom:20px;
    left:20px;

    display:flex;
    flex-direction:column;
    gap:10px;
}
.fixed-buttons a{
    padding:12px 30px;
    border:none;
    border-radius: 40px / 15px;
    text-decoration:none;

    background:rgba(183, 98, 33, 0.8);
    color:rgb(0, 0, 0);

    cursor:pointer;
    transition:0.3s;

    font-family: Arial, Helvetica, sans-serif;
    font-style: normal;
    font-size:30px;
    text-align:center;

    box-shadow:
    0 5px 15px rgba(0,0,0,0.25);
}

.fixed-buttons a:hover {
    background:rgba(188, 113, 33, 0.85);

    transform:
        translateY(-2px)
        scale(1.03);
}

@media (max-width: 768px){
    body{
        display: block;
    }

    .fixed-buttons{
        position:static;
        margin-top: 30px;
        padding-bottom: 30px;
        align-items: center;
        justify-content:center;
        flex-direction: row;
        display: flex;
    }
    .fixed-buttons a{
        display: block;
    }
}