@import url("reset.css");

@import url("variables.css");

@import url("navbar.css");
@import url("hero.css");
@import url("buttons.css");
@import url("cards.css");
@import url("pages.css");
@import url("top10.css");
@import url("table.css");
@import url("forms.css");
@import url("events-page.css");
@import url("footer.css");
@import url("responsive.css");





/*====================================================
        DERNIÈRES DANSES
====================================================*/

.latest-dances{

    padding:80px 0;

    background:#F7F3EE;

}

.latest-grid{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:25px;

    margin-top:40px;

}

.latest-card{

    background:#fff;

    border:1px solid #E5DDD4;

    border-radius:8px;

    padding:22px;

    transition:.25s;

}

.latest-card:hover{

    transform:translateY(-5px);

    box-shadow:0 10px 25px rgba(0,0,0,.08);

}

.latest-card h3{

    color:#8B5E34;

    margin-bottom:15px;

}

.latest-info{

    display:flex;

    flex-wrap:wrap;

    gap:8px;

    margin-bottom:15px;

}

.latest-info span{

    background:#EFE6DB;

    color:#6E4727;

    padding:5px 10px;

    border-radius:20px;

    font-size:.85rem;

}

.choreo{

    color:#666;

    margin-bottom:20px;

}

.latest-actions{

    display:flex;

    gap:12px;

}

.latest-actions a{

    text-decoration:none;

    color:#8B5E34;

    font-weight:600;

}

.latest-button{

    text-align:center;

    margin-top:40px;

}


.container{

    max-width:1400px;

    margin:0 auto;

    padding:0 25px;

}

/*====================================================
        EVENTS
====================================================*/

.events-head{

    background:#8B5E34;

    color:#fff;

    font-weight:bold;

}


.events-row{

    display:grid;

    grid-template-columns:
        110px
        2fr
        1.2fr
        1.5fr
        100px
        120px;

    align-items:center;



}






.event-date{

    display:inline-flex;

    align-items:center;

    gap:10px;

    padding:8px 14px;

    background:var(--primary);

    color:#fff;

    border-radius:30px;

    font-weight:600;

    font-size:14px;

}

.event-date .jour{

    font-size:22px;

    font-weight:700;

}

.event-date .mois{

    text-transform:uppercase;

    letter-spacing:1px;

}

.event-date .annee{

    opacity:.85;

}