/* -------------------- FONTS -------------------- */
@font-face {
    font-family: "SuisseIntl-Regular";
    src: url("./../../../../assets/font/SuisseIntl-Regular.woff2") format("woff2"),
}

@font-face {
    font-family: "SuisseIntl-SemiBold";
    src: url("./../../../../assets/font/SuisseIntl-SemiBold.woff2") format("woff2"),
}

/* -------------------- VAR GLOBAL -------------------- */
:root {
    --black: #000000;
    --white: #ffffff;
    --red: #ff0000;

    --lh: 1.2em;
    --border: 1px solid var(--black);
}

/* -------------------- VAR XS -------------------- */
:root {
    --grid-margin: 6px;

    --spacer-l: 50px;
    --spacer-xl: 100px;

    --menu-brick-height: 28px;
    --menu-brick-padding: 6px;

    --fs-h1: 20px;
    --fs-h2: 16px;
    --fs-m: 14px;
    --fs-xs: 12px;
    --fs-xxs: 11px;

    --fs-menu: 13px;
}

/* -------------------- VAR MD -------------------- */
@media screen and (min-width: 768px) {
    :root {
        --grid-margin: 8px;

        --menu-brick-height: 30px;
        --menu-brick-padding: 8px;

        --fs-h1: 30px;
        --fs-h2: 20px;
        --fs-m: 14px;

        --fs-menu: 14px;
    }
}

/* -------------------- VAR LG -------------------- */
@media screen and (min-width: 1024px) {
    :root {
        --grid-margin: 10px;

        --menu-brick-height: 32px;

        --spacer-l: 60px;
        --spacer-xl: 120px;

        --fs-h1: 32px;
        --fs-m: 15px;
        --fs-xs: 13px;
        --fs-xxs: 12px;

        --fs-menu: 15px;
    }
}

/* -------------------- VAR XL -------------------- */
@media screen and (min-width: 1536px) {
    :root {
        --grid-margin: 12px;

        --spacer-l: 80px;
        --spacer-xl: 160px;

        --menu-brick-height: 36px;

        --fs-h1: 36px;
        --fs-h2: 22px;
        --fs-m: 16px;

        --fs-menu: 16px;
    }
}

/* -------------------- VAR XXL -------------------- */
@media screen and (min-width: 1920px) {
    :root {
        --grid-margin: 16px;

        --spacer-l: 100px;
        --spacer-xl: 200px;

        --menu-brick-height: 40px;

        --fs-h1: 40px;
        --fs-h2: 24px;
        --fs-m: 18px;
        --fs-xs: 14px;

        --fs-menu: 18px;
    }
}

/* -------------------- RESET -------------------- */
* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
    -webkit-tap-highlight-color: transparent;
    font-family: "SuisseIntl-Regular", Arial, Helvetica, sans-serif;
    font-weight: normal;
    font-style: normal;
    line-height: var(--lh);
}

html {
    scroll-behavior: smooth;
    background-color: var(--black);
}

body {
    background-color: var(--bg-color);
    min-height: 100dvh;
}

:focus {
    outline: none;
}

::selection {
    background: var(--black);
    color: var(--white);
    text-shadow: none;
}

a {
    text-decoration: underline;
    text-decoration-thickness: 0.08em;
    text-underline-offset: 0.10em;
    background-color: transparent;
    color: var(--black);
}

a:hover {
    cursor: pointer;
    background-color: var(--black);
    color: var(--white);
    text-decoration: none;
}

img {
    user-select: none;
    -webkit-user-drag: none;
}

/* -------------------- TEXT STYLES -------------------- */
/* Bold */
strong {
    font-family: "SuisseIntl-SemiBold", Arial, Helvetica, sans-serif;
    font-weight: 600;
}

/* Italic */
em {
    font-style: italic;
}

/* Underline */
u {
    text-decoration-thickness: 0.08em;
    text-underline-offset: 0.10em;
}

/* Strikethrough */
s {
    text-decoration-thickness: 0.08em;
}

/* Paragraph */
p {
    margin-bottom: calc(var(--lh)*0.75);
    text-align: justify;
}

p:last-child {
    margin-bottom: 0px;
}

/* Bullet list */
ul {
    /* removes default bullets */
    list-style: none;
    padding-left: 0;
}

ul li {
    display: flex;
    flex-direction: row;
}

ul li p {
    margin-bottom: calc(var(--lh)*0.75) !important;
}

ul li:last-child p:last-child {
    margin-bottom: 0px !important;
}

ul li::before {
    content: "\25CF";
    font-size: calc(var(--fs-m)*0.75);
    margin-right: 8px;
}

/* Number list */
ol {
    list-style: none;
    padding-left: 0;
    /* start counter */
    counter-reset: list-counter;
}

ol li {
    display: flex;
    flex-direction: row;
    /* increment counter for each li */
    counter-increment: list-counter;
}

ol li p {
    margin-bottom: calc(var(--lh)*0.75) !important;
}

ol li:last-child p:last-child {
    margin-bottom: 0px !important;
}

ol li::before {
    content: counter(list-counter) ". ";
    /* display number */
    margin-right: 8px;
}

/* -------------------- TYPOGRAPHY STYLES -------------------- */
h1,
.h1 {
    font-family: "SuisseIntl-SemiBold", Arial, Helvetica, sans-serif;
    font-weight: 600;
    font-size: var(--fs-h1);
    line-height: var(--lh);
    margin: 0px;
}

h2,
.h2 {
    font-family: "SuisseIntl-SemiBold", Arial, Helvetica, sans-serif;
    font-weight: 600;
    font-size: var(--fs-h2);
    line-height: var(--lh);
    margin: 0px;
}

.text-m-semibold {
    font-family: "SuisseIntl-SemiBold", Arial, Helvetica, sans-serif;
    font-weight: 600;
    font-size: var(--fs-m);
    line-height: var(--lh);
}


.text-m {
    font-family: "SuisseIntl-Regular", Arial, Helvetica, sans-serif;
    font-weight: 400;
    font-size: var(--fs-m);
    line-height: var(--lh);
}

.text-menu,
.text-menu p {
    font-family: "SuisseIntl-Regular", Arial, Helvetica, sans-serif;
    font-weight: 400;
    font-size: var(--fs-menu);
    line-height: var(--lh);
}

/* -------------------- SPACERS -------------------- */
.spacer-xl {
    display: block;
    width: 100%;
    height: var(--spacer-xl);
    border-bottom: var(--border);
}

.spacer-l {
    display: block;
    width: 100%;
    height: var(--spacer-l);
    border-bottom: var(--border);
}

/* -------------------- ASPECT RATIO -------------------- */
img.aspect-ratio-1-1,
video.aspect-ratio-1-1 {
    display: block;
    width: 100%;
    aspect-ratio: 1/1;
    object-fit: cover;
}

img.aspect-ratio-3-2,
video.aspect-ratio-3-2 {
    display: block;
    width: 100%;
    aspect-ratio: 3/2;
    object-fit: cover;
}

img.aspect-ratio-16-9,
video.aspect-ratio-16-9 {
    display: block;
    width: 100%;
    aspect-ratio: 16/9;
    object-fit: cover;
}

img.aspect-ratio-2-1,
video.aspect-ratio-2-1 {
    display: block;
    width: 100%;
    aspect-ratio: 2/1;
    object-fit: cover;
}

img.aspect-ratio-3-1,
video.aspect-ratio-3-1 {
    display: block;
    width: 100%;
    aspect-ratio: 3/1;
    object-fit: cover;
}

/* -------------------- HEADER -------------------- */
.header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    display: flex;
    flex-direction: column;
    z-index: 9;
    background-color: var(--bg-color);
    transition: transform 0.3s ease-in-out;
}

.header.header-hidden {
    transform: translateY(-100%);
}

/* Add padding at main to compensate the fixed header */
main {
    padding-top: calc(var(--menu-brick-height) * 4);
}

@media only screen and (max-width : 1023px) {
    main {
        padding-top: calc(var(--menu-brick-height) * 5);
    }
}


.menu-brick {
    height: var(--menu-brick-height);
    min-height: var(--menu-brick-height);
    max-height: var(--menu-brick-height);
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: left;
    padding: var(--menu-brick-padding);
    border-bottom: var(--border);
    border-left: var(--border);
}

.menu-brick.menu-brick-empty {
    width: 100%;
    padding: 0px;
}

.header-top {
    width: 100%;
    display: flex;
    flex-direction: row;
}

.header-top-left {
    width: 50%;
    display: flex;
    flex-direction: row;
}

.header-top-left .logo {
    width: 25%;
    height: calc(var(--menu-brick-height)*3);
    border-bottom: var(--border);
}

.header-top-left .logo a {
    display: block;
    width: 100%;
    height: 100%;
    padding: var(--menu-brick-padding);
}

.header-top-left .logo a:hover {
    background-color: transparent;
}

.header-top-left .logo a img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.countdown-container {
    width: 75%;
    display: flex;
    flex-direction: column;
}

.countdown-container .menu-brick.menu-brick-empty:first-child {
    border-left: none;
}

#countdown {
    width: 100%;
    display: flex;
    flex-direction: row;
}

.countdown-title {
    width: 66.66%;
    border-left: var(--border);
}

.countdown-timer {
    width: 33.33%;
    display: flex;
    flex-direction: row;
}

.countdown-timer-item {
    width: 100%;
}

.header-top-right {
    width: 50%;
    display: flex;
    flex-direction: column;
    align-items: flex-end
}

.main-sponsor-languages-reserved-container {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
}

.main-sponsor-languages-reserved-container .menu-brick.menu-brick-empty:first-child {
    height: calc(var(--menu-brick-height)*2);
    min-height: calc(var(--menu-brick-height)*2);
    max-height: calc(var(--menu-brick-height)*2);
    width: 50%;
}

.main-sponsor-languages-reserved {
    width: 50%;
    display: flex;
    flex-direction: row;
}

.menu-button-mobile {
    display: none;
}

.main-sponsor {
    height: calc(var(--menu-brick-height)*2);
    display: flex;
    align-items: center;
    gap: var(--menu-brick-padding);
    width: 50%;
    padding: var(--menu-brick-padding);
    border-bottom: var(--border);
    border-left: var(--border);
}

.main-sponsor-title {
    width: max-content;
    max-width: 50%;
    font-size: var(--fs-xs);
}

.main-sponsor a {
    display: block;
    width: fit-content;
    max-width: 50%;
    height: 100%;
    max-height: 50px;
}

.main-sponsor a:hover {
    background-color: transparent;
}

.main-sponsor a img {
    display: block;
    width: 100%;
    height: 100%;
    aspect-ratio: 3/2;
    object-fit: contain;
}

.languages-reserved {
    width: 50%;
    display: flex;
    flex-direction: column;
}

.languages {
    width: 100%;
    display: flex;
    flex-direction: row;
}

.menu-list {
    width: 100%;
    display: flex;
    flex-direction: row;
}

.languages .menu-item:first-child .menu-link {
    border-left: var(--border);
}

.menu-item {
    width: 100%;
}

.menu-link {
    width: 100%;
    background-color: transparent;
    color: var(--black);
    text-decoration: none;
}

.menu-item:first-child .menu-link {
    border-left: none;
}

.menu-link:hover,
.menu .menu-link.active {
    background-color: var(--black);
    color: var(--white);
}

li.menu-item::before {
    display: none;
}

/* Header mobile */
@media only screen and (max-width : 767px) {
    .header-top {
        flex-direction: column;
    }

    .header-top-left {
        width: 100%;
    }

    .header-top-left .logo {
        width: 25%;
    }

    .countdown-container {
        width: 75%;
    }

    #countdown {
        flex-direction: column;
    }

    .countdown-title {
        width: 100%;
    }

    .countdown-timer {
        width: 100%;
    }

    .countdown-container .menu-brick.menu-brick-empty:last-child {
        display: none;
    }

    .header-top-right {
        width: 100%;
    }

    .header-top-right .menu-brick.menu-brick-empty:first-child {
        display: none;
    }

    .main-sponsor-languages-reserved-container .menu-brick.menu-brick-empty:first-child {
        display: none;
    }

    .menu-button-mobile {
        display: flex;
        width: 25%;
        height: calc(var(--menu-brick-height)*2);
        min-height: calc(var(--menu-brick-height)*2);
        max-height: calc(var(--menu-brick-height)*2);
        border-left: none;
    }

    .menu-button-mobile:active {
        background-color: var(--black);
        color: var(--white);
        cursor: pointer;
    }

    .main-sponsor-languages-reserved {
        width: 100%;
    }

    .main-sponsor {
        width: 56.25%;
    }

    .languages-reserved {
        width: 18.75%;
    }

    .languages {
        flex-direction: column;
    }

    .reserved-desktop {
        display: none;
    }

    .menu {
        position: fixed;
        top: calc(var(--menu-brick-height) * 5);
        left: -100%;
        width: 100%;
        height: calc(100dvh - var(--menu-brick-height)*5);
        background-color: var(--bg-color);
        z-index: 99;
        transition: left 0.3s ease-in-out;
    }

    .menu.active {
        left: 0;
    }

    .menu-list {
        flex-direction: column;
    }

    .menu .menu-link.menu-brick {
        border-left: none;
    }
}

/* Header tablet */
@media only screen and (min-width : 768px) and (max-width : 1023px) {
    .header-top {
        flex-direction: column;
    }

    .header-top-left {
        width: 100%;
    }

    .header-top-left .logo {
        width: 25%;
    }

    .countdown-container {
        width: 75%;
    }

    .countdown-title {
        width: 66.66%;
    }

    .countdown-timer {
        width: 33.33%;
    }

    .header-top-right {
        width: 100%;
    }

    .header-top-right .menu-brick.menu-brick-empty:first-child {
        display: none;
    }

    .main-sponsor-languages-reserved-container .menu-brick.menu-brick-empty:first-child {
        display: none;
    }

    .menu-button-mobile {
        display: flex;
        width: 25%;
        height: calc(var(--menu-brick-height)*2);
        min-height: calc(var(--menu-brick-height)*2);
        max-height: calc(var(--menu-brick-height)*2);
        border-left: none;
    }

    .main-sponsor-languages-reserved {
        width: 100%;
    }

    .main-sponsor {
        width: 50%;
    }

    .languages-reserved {
        width: 25%;
    }

    .languages {
        flex-direction: column;
    }

    .reserved-desktop {
        display: none;
    }

    .menu {
        position: fixed;
        top: calc(var(--menu-brick-height) * 5);
        left: -100%;
        width: 100%;
        height: calc(100dvh - var(--menu-brick-height)*5);
        background-color: var(--bg-color);
        z-index: 99;
        transition: left 0.3s ease-in-out;
    }

    .menu.active {
        left: 0;
    }

    .menu-list {
        flex-direction: column;
    }

    .menu .menu-link.menu-brick {
        border-left: none;
    }
}

/* Header small desktop */
@media only screen and (min-width : 1024px) and (max-width : 1535px) {
    .countdown-title {
        width: 50%;
    }

    .countdown-timer {
        width: 50%;
    }

    .main-sponsor-languages-reserved-container .menu-brick.menu-brick-empty:first-child {
        width: 25%;
    }

    .main-sponsor-languages-reserved {
        width: 75%;
    }
}

/* -------------------- TEXT BLOCKS -------------------- */
.h1-block-row,
.h2-block-row {
    display: block;
    width: 100%;
    margin: 0px;
    padding: calc(var(--grid-margin) - 2px) var(--grid-margin);
    border-bottom: var(--border);
}

.text-block-container {
    display: block;
    width: 100%;
    border-bottom: var(--border);
}

.text-block {
    display: block;
    width: 50%;
    padding: calc(var(--grid-margin) - 2px) var(--grid-margin);
}

/* -------------------- VISUAL BLOCKS -------------------- */
/* Visual and text, Visual and links */
.visual-and-text-block-container,
.visual-and-links-block-container,
.complex-block-container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    width: 100%;
    border-bottom: var(--border);
}

.visual-and-text-block-container.reverse .visual-and-text-block-visual,
.visual-and-links-block-container.reverse .visual-and-links-block-visual,
.complex-block-container.reverse .complex-block-visuals {
    order: 1;
}

.visual-and-links-block-container .links-block {
    border-left: var(--border);
}

.visual-and-links-block-container.reverse .links-block {
    border-left: none;
}

.visual-and-links-block-container.reverse .visual-and-links-block-visual {
    border-left: var(--border);
}

.visual-and-text-block-text,
.visual-and-text-block-visual,
.visual-and-text-block-visual.empty,
.visual-and-links-block-text,
.visual-and-links-block-visual,
.visual-and-links-block-visual.empty {
    width: 100%;
}

.visual-and-text-block-visual img,
.visual-and-text-block-visual video,
.visual-and-links-block-visual img,
.visual-and-links-block-visual video {
    height: 100%;
}

.visual-and-text-block-text {
    padding: var(--grid-margin);
}

/* Links */
.link-title-container {
    padding: calc(var(--grid-margin) - 2px) var(--grid-margin);
    display: flex;
    flex-direction: row;
    align-items: baseline;
    justify-content: left;
    gap: calc(var(--grid-margin)/2);
    border-bottom: var(--border);
}

.link-title-link {
    text-decoration: none;
}

.links-block {
    display: flex;
    flex-direction: column;
}

.link-row {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: left;
    height: var(--menu-brick-height);
    min-height: var(--menu-brick-height);
    max-height: var(--menu-brick-height);
    padding: calc(var(--menu-brick-padding)) var(--grid-margin);
    background-color: transparent;
    color: var(--black);
    text-decoration: none;
    border-bottom: var(--border);
}

.link-row:hover {
    background-color: var(--black);
    color: var(--white);
}

/* Logo and text */
.logo-and-text-block-container {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-template-rows: 1fr;
    border-bottom: var(--border);
}

.logo-and-text-block-visuals {
    grid-column: 1 / 6;
    grid-row: 1 / 2;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding-top: calc(var(--grid-margin)*2);
    padding-bottom: calc(var(--grid-margin)*2);
    padding-left: calc(var(--grid-margin)*2);
}

.logo-and-text-block-visuals img,
.logo-and-text-block-visuals video,
.logo-and-links-block-visuals img,
.logo-and-links-block-visuals video,
.complex-block-visuals img,
.complex-block-visuals video {
    display: block;
    width: 100%;
}

.logo-and-text-block-text {
    grid-column: 7 / 13;
    grid-row: 1 / 2;
    padding: calc(var(--grid-margin)*2) var(--grid-margin);
}

.logo-and-text-block-container.reverse .logo-and-text-block-visuals {
    grid-column: 8 / 13;
    grid-row: 1 / 2;
    padding-right: calc(var(--grid-margin)*2);
    padding-left: 0px;
}

.logo-and-text-block-container.reverse .logo-and-text-block-text {
    grid-column: 1 / 7;
    grid-row: 1 / 2;
}

/* Past edition */
a.past-edition-block-link {
    display: block;
    color: var(--black);
    text-decoration: none;
}

a.past-edition-block-link:hover .past-edition-block-title {
    color: var(--white);
}

.past-edition-block-visuals-desktop {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    border-bottom: var(--border);
    overflow: hidden;
}

.past-edition-block-visuals-desktop img,
.past-edition-block-visuals-desktop video {
    display: block;
    width: 100%;
    aspect-ratio: 16/9;
    object-fit: cover;
    transition: transform 0.3s ease-out;
}

.past-edition-block-visuals-desktop img:first-child,
.past-edition-block-visuals-desktop video:first-child {
    transform-origin: center right;
}

.past-edition-block-visuals-desktop img:last-child,
.past-edition-block-visuals-desktop video:last-child {
    transform-origin: center left;
}

a.past-edition-block-link:hover .past-edition-block-visuals-desktop img,
a.past-edition-block-link:hover .past-edition-block-visuals-desktop video {
    transform: scale(1.05);
}

.past-edition-block-visuals-mobile {
    display: none;
}

/* Stripe */
.stripe-container {
    display: flex;
    width: 100%;
    padding: var(--grid-margin) 0px;
    overflow: hidden;
    white-space: nowrap;
    border-bottom: var(--border);
}

.stripe {
    animation: marquee 60s linear infinite;
}

.stripe-content-1 {
    position: relative;
    left: 0%;
    animation: swap 60s linear infinite;
}

.stripe-container,
.stripe,
.stripe-content-1,
.stripe-content-2 {
    display: flex;
    flex-direction: row;
    column-gap: var(--grid-margin);
    align-items: center;
}

.stripe-container:hover .stripe,
.stripe-container:hover .stripe-content-1 {
    animation-play-state: paused;
}

.stripe img {
    height: calc(var(--menu-brick-height)*2.5 - var(--grid-margin)*2);
    width: calc((var(--menu-brick-height)*2.5 - var(--grid-margin)*2)*3/2);
    object-fit: contain;
}

.stripe a:hover {
    background-color: transparent;
}

@keyframes marquee {
    0% {
        transform: translateX(0)
    }

    100% {
        transform: translateX(-100%)
    }
}

@keyframes swap {

    0%,
    50% {
        left: 0%;
    }

    50.01%,
    100% {
        left: 100%;
    }
}

/* Carousel */
.carousel {
    width: 100%;
    border-bottom: var(--border);
}

/* Complex block */
.complex-block-visuals img {
    width: 100%;
}

.complex-block-text {
    padding: var(--grid-margin) 0px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: top;
    row-gap: var(--grid-margin);
}

.complex-block-text p {
    padding: 0px var(--grid-margin);
    margin: 0px;
}

.complex-block-text figure {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    margin: var(--grid-margin) 0px;
}

.complex-block-text figure img {
    grid-column: 2 / 7;
    width: 100%;
    padding-right: calc(var(--grid-margin)*2);
}

.complex-block-container.reverse figure img {
    grid-column: 1 / 6;
    padding-right: 0px;
    padding-left: calc(var(--grid-margin)*2);
}

/* Blocks Mobile */
@media only screen and (max-width : 1023px) {
    .text-block {
        width: 100%;
    }

    .visual-and-text-block-container,
    .visual-and-links-block-container,
    .complex-block-container {
        grid-template-columns: 1fr;
        grid-template-rows: max-content max-content;
    }

    .visual-and-text-block-container.reverse .visual-and-text-block-visual,
    .visual-and-links-block-container.reverse .visual-and-links-block-visual,
    .complex-block-container.reverse .complex-block-visuals {
        order: unset;
    }

    .logo-and-text-block-container {
        grid-template-columns: 1fr;
        grid-template-rows: max-content max-content;
    }

    .logo-and-text-block-visuals,
    .logo-and-text-block-container.reverse .logo-and-text-block-visuals {
        grid-column: span 1;
        grid-row: span 1;
        padding: calc(var(--grid-margin)*2);
    }

    .logo-and-text-block-text,
    .logo-and-text-block-container.reverse .logo-and-text-block-text {
        grid-column: span 1;
        grid-row: span 1;
        padding: var(--grid-margin);
    }

    .visual-and-links-block-container .links-block {
        border-left: none;
    }
    
    .visual-and-links-block-container.reverse .visual-and-links-block-visual {
        border-left: none;
    }

    .visual-and-links-block-container .links-block .link-row:first-child {
        border-top: var(--border);
    }

    .visual-and-links-block-container .links-block .link-row:last-child {
        border-bottom: none;
    }

    .complex-block-visuals {
        display: none;
    }

    .complex-block-text figure {
        grid-template-columns: repeat(8, 1fr);
    }

    .complex-block-text figure img,
    .complex-block-container.reverse figure img {
        grid-column: 2 / 8;
        padding: 0px;
    }

    .link-title-container {
        flex-direction: column;
    }

    .past-edition-block-visuals-desktop {
        display: none;
    }

    .past-edition-block-visuals-mobile {
        display: block;
        border-bottom: var(--border);
    }

    .past-edition-block-visuals-mobile img,
    .past-edition-block-visuals-mobile video {
        display: block;
        width: 100%;
        aspect-ratio: 16/9;
        object-fit: cover;
    }
}

/* -------------------- FOOTER -------------------- */
.footer {
    display: flex;
    flex-direction: row;
    border-bottom: var(--border);
}

.footer-mobile-only {
    display: none;
}

.footer-left {
    width: 50%;
}

.footer-left-titles {
    display: flex;
    flex-direction: row;
}

.footer-left-title {
    width: 50%;
}

.footer-left-title:first-child {
    border-left: none;
}

.footer-left-logos-infos {
    width: 100%;
    height: calc(100% - var(--menu-brick-height));
    display: flex;
    /* flex-direction: columne; */
    flex-direction: column-reverse;
    /* justify-content: space-between; */
    justify-content: flex-end;
}

.footer-left-logos {
    display: grid;
    grid-template-columns: repeat(10, 1fr);
    padding: var(--menu-brick-padding);
    gap: calc(var(--menu-brick-padding)*2);
    border-top: var(--border);
}

.footer-left-infos {
    width: 100%;
    display: flex;
    flex-direction: row;
    /* border-top: var(--border); */
}

.footer-left-contact-legals {
    width: 50%;
    display: flex;
    flex-direction: column;
}

.footer-left-contact {
    width: 100%;
    height: calc(100% - var(--menu-brick-height));
    min-height: calc(100% - var(--menu-brick-height));
    /* max-height: unset; */
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    border-left: none;
    overflow: hidden;
}

.footer-left-contact p {
    margin: 0px;
}

.footer-left-legals {
    width: 100%;
    border-left: none;
    border-bottom: none;
}

.footer-left-legals a {
    text-decoration: none;
}

.footer-left-socials {
    width: 50%;
}

.footer-left-social {
    text-decoration: none;
}

.footer-left-social:last-child {
    border-bottom: none;
}

.footer-right {
    width: 50%;
    display: flex;
    flex-direction: row;
}

.footer-partners-container {
    width: 50%;
    display: flex;
    flex-direction: column;
}

.footer-partners-logos {
    height: 100%;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    padding: var(--menu-brick-padding);
    gap: calc(var(--menu-brick-padding)*2);
    border-left: var(--border);
}

.footer-partner-logo {
    width: 100%;
}

.footer-partner-logo a {
    width: 100%;
    display: block;
}

.footer-partner-logo a:hover {
    background-color: transparent;
}

.footer-partner-logo img {
    width: 100%;
    display: block;
    aspect-ratio: 3 / 2;
    object-fit: contain;
}

/* Footer mobile */
@media only screen and (max-width : 767px) {
    .footer {
        flex-direction: column;
    }

    .footer-mobile-only {
        display: flex;
    }

    .footer-desktop-only {
        display: none;
    }

    .footer-left {
        width: 100%;
    }

    .footer-left-title {
        width: 100%;
    }

    .footer-left-logos-infos {
        flex-direction: column-reverse;
    }

    .footer-left-logos {
        grid-template-columns: repeat(5, 1fr);
        border-top: none;
        border-bottom: var(--border);
    }

    .footer-left-infos {
        flex-direction: column;
        border-top: none;
    }

    .footer-left-contact-legals {
        width: 100%;
    }

    .footer-left-contact {
        height: unset;
        min-height: unset;
        max-height: unset;
    }

    .footer-left-socials {
        width: 100%;
    }

    .footer-left-social {
        border-left: none;
    }

    .footer-left-social:last-child {
        border-bottom: var(--border);
    }

    .footer-right {
        width: 100%;
        flex-direction: column;
    }

    .footer-partners-container {
        width: 100%;
    }

    .footer-partners-container > div {
        border-left: none;
        border-bottom: var(--border);
    }

    .footer-legals {
        border-left: none;
        border-bottom: none;
        max-height: unset;
    }

    .footer-legals a {
        text-decoration: none;
    }
}

/* Footer tablet */
@media only screen and (min-width : 768px) and (max-width : 1023px) {
    .footer {
        flex-direction: column;
    }

    .footer-left {
        width: 100%;
    }

    .footer-left-logos-infos {
        flex-direction: column-reverse;
    }

    .footer-left-logos {
        grid-template-columns: repeat(10, 1fr);
        border-top: none;
        border-bottom: var(--border);
    }

    .footer-left-infos {
        border-top: none;
    }

    .footer-left-legals {
        border-bottom: var(--border);
    }

    .footer-left-social:last-child {
        border-bottom: var(--border);
    }

    .footer-right {
        width: 100%;
    }

    .footer-partners-container:first-child .menu-brick:first-child,
    .footer-partners-container:first-child .footer-partners-logos {
        border-left: none;
    }
}

/* Footer small desktop */
@media only screen and (min-width : 1024px) and (max-width : 1535px) {
    .footer-left-logos {
        grid-template-columns: repeat(8, 1fr);
    }

    .footer-partners-logos {
        grid-template-columns: repeat(4, 1fr);
    }
}

/* Footer medium desktop */
@media only screen and (min-width : 1536px) and (max-width : 1979px) {
    .footer-left-logos {
        grid-template-columns: repeat(8, 1fr);
    }

    .footer-partners-logos {
        grid-template-columns: repeat(4, 1fr);
    }
}