@font-face {
    font-family: "League Spartan Variable";
    src: url("../fonts/LeagueSpartan-VF.ttf"),
         url("../fonts/LeagueSpartan-VF.woff"),
         url("../fonts/LeagueSpartan-VF.woff2") format('woff2-variations');
}
@font-face {
    font-family: "League Spartan";
    src: url("../fonts/LeagueSpartanTitle.otf");
}
@font-face {
    font-family: "Nunito";
    src: url("../fonts/Nunito-Regular.ttf");
}
@font-face {
    font-family: "Nunito Variable";
    src: url("../fonts/Nunito-VariableFont_wght.ttf");
}

* {
    box-sizing: border-box;
    word-break: break-word;
}

body {
    display: flex;
    margin: 0;
    background-color: #262626;
}

.app {
    width: 100%;
}

header {
    position: fixed !important;
    z-index: 10;
    display: flex;
    flex-direction: row;
    justify-content: center;
    width: 100%;
    padding: 10px 30px;
    transition: all 0.3s ease-in-out;
}
.nav-logo {
    display: none; /* affecte seulement au chargement de la page */
    flex: 1; /* Coller les liens à droite  */
}
.nav-links {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0 15px;
    align-self: center;
    margin-bottom: 40px;
}
.nav-link {
    padding: 10px 15px 5px 15px;
    min-width: max-content;
    transition: background-color 0.3s ease;
    border-radius: 24px;
    line-height: 1.3em;
}
.nav-link:hover {
    background-color: rgba(255, 255, 255, 0.4);
    filter: drop-shadow(0px 0px 10px rgba(255,0,255,0.7));
}
.nav-qrcode {
    position: absolute;
    right: 0;
    top: 0;
    padding: 30px;
    text-align: right;
}
@media (max-width: 1000px) {
    .nav-qrcode {
        display: none !important;
    }
}

main {
    width: 100%;
}

.landing {
    min-height: 40vh;
    width: 100%;
    text-align: center;
    background: rgb(225,75,9);
    background: linear-gradient(145deg, rgba(225,75,9,1) 30%, rgba(235,226,0,1) 100%);
    padding-top: 200px;
    padding-bottom: 100px;;
}
.about-landing, .events-landing, .partenaires-landing {
    height: 40vh !important;
}
.main-logo {
    position: relative;
    margin: 0 auto;
}
.main-logo-img {
    max-width: 100%;
}
.title {
    width: 100%;
}

.content {
    padding: 50px;
    margin: 0 auto 100px auto;
    font-size: xx-large;
    line-height: 200%;
    max-width: 1280px;
    text-align: justify;
}
.content a {
    font-family: "Nunito";
    text-transform: uppercase;
    font-weight: bold;
    text-decoration: none;
}
.partenaires-content {
    max-width: 1500px;
}
.gallery {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 100px;
    justify-content: center;
}
.gallery-image-title {
    display: flex;
    flex-direction: column;
}
.gallery-image-title-text {
    display: flex;
    flex-direction: column;
}
.gallery-image {
    max-width: 375px;
    border-radius: 10px;
}
.gallery-title {
    text-transform: uppercase;
}
.gallery-subtitle {
    font-size: 0.8em;
}
.gallery-text {

}


footer {
    background-color: #303030;
    display: flex;
    flex-wrap: wrap;
    gap: 0.5em;
    justify-content: space-between;
    width: 100%;
    padding: 100px;
    font-size: 24pt;
}
footer>* {
    margin: auto;
}

/* ================================================================= */
.link {
    text-decoration: none;
}

.title {
    font-family: "League Spartan Variable", sans-serif;
    font-size: max(calc(6pt + 6vw), 24pt);
    letter-spacing: min(max(calc(15vw - 2.7em), 0.2em), 0.6em);
    text-transform: uppercase;
    font-variation-settings: "wght" 800;
}

.nav-link {
    font-family: "League Spartan Variable", sans-serif;
    text-transform: uppercase;
    font-variation-settings: "wght" 700;
    font-size: 20pt;
}

.contact-link {
    font-family: "League Spartan Variable", sans-serif;
    text-transform: uppercase;
    font-variation-settings: "wght" 700;
    font-size: 32pt;
}

a {
    font-family: "League Spartan Variable", sans-serif;
    text-transform: uppercase;
}
p, span {
    font-family: "Century Gothic", sans-serif;
}
a, p, span {
    color : white;
}

ul {
    list-style: none;
    margin-block: 0;
    padding-inline: 0;
}