.footer {
  color: var(--grey);
  padding: 1.5rem 1rem;
  .footer--nav-wrapper.level-1 > .footer--nav {
    display: flex;
    padding-bottom: 16px;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
    border-bottom: 1px solid var(--orange);
  }

  .footer--nav-level1--logo {
    display: flex;
    flex-direction: column;
    gap: 12px;
    .footer--nav-level1--description p {
      font-family: var(--font-family-poppins);
      font-weight: 400;
      font-size: 12px;
      line-height: 20px;
      vertical-align: middle;
    }
  }
  .footer--nav-level1--socials-contacts {
    display: flex;
    align-items: flex-start;
    width: 100%;
    justify-content: space-between;
    .footer--nav-level1--socials {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      gap: 8px;
      flex: 0 0 auto;
      width: 85px;
      .footer--nav-level1--socials-title {
        font-family: var(--font-family-poppins);
        font-size: 12px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
      }
      .footer--nav-level1--socials-logos {
        display: flex;
        align-items: center;
        gap: 8px;
        display: flex;
        a {
          padding: 4px;
          align-items: center;
        }
        a:first-child {
          padding-left: 0;
        }
        .footer--nav-level1--socials-logo {
          height: 19px;
          width: 19px;
        }
      }
    }
    .footer--nav-level1--contacts {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      gap: 8px;
      margin-left: auto;
      flex: 0 0 auto;
      text-align: left;
      .footer--nav-level1--contacts-title {
        font-family: var(--font-family-poppins);
        font-size: 12px;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
      }
      .footer--nav-level1--contacts-list {
        display: flex;
        flex-direction: column;
        gap: 0.5rem;
        list-style-type: none;
        padding: 0;

        .component-menu-item {
          position: relative;
          padding-left: 1.75rem;
          display: flex;
          align-items: center;

          .component-menu-item--link {
            color: var(--grey);
            font-family: var(--font-family-poppins);
            font-size: 0.75rem;
            font-style: normal;
            font-weight: 400;
            line-height: 1.5rem;
          }
        }

        .component-menu-item .menu-item--contact-country::before,
        .component-menu-item .menu-item--contact-phone::before,
        .component-menu-item .menu-item--contact-email::before {
          content: '';
          position: absolute;
          left: 0;
          top: 50%;
          transform: translateY(-50%);
          width: 20px;
          height: 20px;
          background-size: contain;
          background-repeat: no-repeat;
        }

        /* icônes spécifiques */
        .component-menu-item .menu-item--contact-country::before {
          background-image: url("../icons/contact-country-f6562c443f100a710d01179f0c8a6338.svg");
        }

        .component-menu-item .menu-item--contact-phone::before {
          background-image: url("../icons/contact-phone-3d5e263e3b51625baaf391a53fc6466f.svg");
        }

        .component-menu-item .menu-item--contact-email::before {
          background-image: url("../icons/contact-email-26236eef0f6e2dabf186b76c576e312e.svg");
        }
      }
    }
  }

  .footer--nav-wrapper.level-2 {
    padding-top: 16px;
    > .footer--nav {
      padding-bottom: 16px;
      li {
        list-style: none;
        padding: 0;
        > a {
          color: var(--grey);
          font-family: var(--font-family-poppins);
          font-size: 12px;
          font-style: normal;
          font-weight: 400;
          line-height: 20px; /* 166.667% */
        }
      }
    }
    .footer--nav-description p {
      color: var(--grey);
      font-family: var(--font-family-poppins);
      font-size: 12px;
      font-style: normal;
      font-weight: 400;
      line-height: 20px; /* 166.667% */
    }
  }
}

@media screen and (min-width: 23.438rem) {
  .footer {
    .footer--nav-level1--socials-contacts {
      .footer--nav-level1--socials {
        width: 111px;
      }
      .footer--nav-level1--contacts {
        width: 196px;
      }
    }
  }
}
@media screen and (min-width: 48rem) {
  .footer {
    .footer--nav-wrapper.level-2 {
      display: flex;
      flex-direction: row-reverse;
      justify-content: space-between;
    }
  }
}

@media screen and (min-width: 64rem) {
  .footer {
    padding: 3rem 1rem 1.5rem;
    .footer--nav-wrapper {
      max-width: 75rem;
      width: 100%;
    }
    .footer--nav-wrapper.level-1 > .footer--nav {
      padding-bottom: 24px;
      gap: 0;
      justify-content: space-between;
      flex-direction: row;
      .footer--nav-level1--logo {
        max-width: 320px;
        gap: 2.25rem;
        .footer--logo {
          width: 8.25rem;
          height: 3.1875rem;
        }
      }
      .footer--nav-level1--socials-contacts {
        width: auto;
      }
    }
    .footer--nav-wrapper.level-2 {
      padding-top: 24px;
    }
  }
}