.gtn-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(200px, 120px));
    grid-template-rows: repeat(4, minmax(150px, 120px));
    gap: 10px;
    justify-content: center;
    align-items: center;
    margin: 30px auto;
    padding: 20px;

    /* Background général de la grille */
    background: url("https://air-nephis.fr/wp-content/plugins/gestion-pilote-activite-team_nephis/image/fond.jpg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 15px;
}

.gtn-slot {
    background: url("https://air-nephis.fr/wp-content/plugins/gestion-pilote-activite-team_nephis/image/avionTeam1.png");
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    padding: 8px;
    text-align: center;
    font-size: 14px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    color: #222;
}

/* Positions (diamant) */
.pos-1 {
    grid-column: 3;
    grid-row: 1;
}

.pos-2 {
    grid-column: 4;
    grid-row: 2;
}

.pos-3 {
    grid-column: 2;
    grid-row: 2;
}

.pos-4 {
    grid-column: 3;
    grid-row: 3;
}

.pos-5 {
    grid-column: 5;
    grid-row: 3;
}

.pos-6 {
    grid-column: 1;
    grid-row: 3;
}

.pos-7 {
    grid-column: 2;
    grid-row: 4;
}

.pos-8 {
    grid-column: 4;
    grid-row: 4;
}

/* --- Version mobile --- */
@media (max-width: 600px) {
    .gtn-grid {
        display: flex;
        flex-direction: column;
        align-items: center;
        padding: 10px;
        gap: 10px;
        background-size: cover;
    }

    .gtn-slot {
        width: 80px;
        height: 80px;
        font-size: 12px;
        padding: 6px;
        background-size: contain;
    }

    /* Réorganisation en “diamant” vertical */
    .pos-1 {
        order: 1;
    }

    .pos-2,
    .pos-3 {
        order: 2;
        display: flex;
        justify-content: space-between;
        width: 100%;
    }

    .pos-4,
    .pos-5,
    .pos-6 {
        order: 3;
        display: flex;
        justify-content: space-between;
        width: 100%;
    }

    .pos-7,
    .pos-8 {
        order: 4;
        display: flex;
        justify-content: space-around;
        width: 100%;
    }
}

.gtn-title {
    color: #f4ca35;
}