.footer {
  width: 100%;
  min-height: 50vh;
  background: var(--background-footer);
  align-content: center;
  font-size: 18px;
}

.footer section {
    max-width: 1440px;
    margin: 2rem auto;
    display: flex;
    flex-direction: column;
    padding: 0 1em;
    box-sizing: border-box;
    gap: 36px;
    flex-wrap: wrap;

    & > article {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 24px;
      box-sizing: border-box;
    }

    .solidair {
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      gap: 1em;

      &>img {
        /* width: 25%; */
        max-width: 100px;
        height: fit-content;
      }

      .cta-contact {
        margin: 0;
      }
    }

    .description {
      img {
        width: 78px;
      }
    }

    .footer-links ul {
        width: 100%;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 24px;
        align-items: center;
        margin: 2em 0;

      & > li a h3 {
        display: inline;
        font-size: 18px;
        cursor: pointer;
      }
    }

    .reseaux_sociauxF {
      justify-content: flex-start;
      border-bottom: solid 3px whitesmoke;
      align-items: end;

      a {
        color: white;
        font-size: 2.5em;
        padding-right: 16px;
      }
    }

    .copyright {
      margin: 0;
      text-align: right;
      font-size: .8em;
      flex: 1;
    }
}

/* Tablet only (between 768px and 1023px) */
@media (min-width: 768px) and (max-width: 1023px) {
 
}

/* Desktop only (1024px and up) */
@media (min-width: 1024px) {

  .footer section {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(4, minmax(20px, auto));
    grid-template-areas:  
      "solidair  description"
      "links     description"
      "links     social"
      "copyright copyright";
    gap: 10px 5vw;

    .solidair {
      grid-area: solidair;

      display: grid;
      grid-template-columns: repeat(2, 1fr);
    }

    .description {
      grid-area: description;

      flex-direction: column;
      align-items: self-start;
      justify-content: space-evenly;
      gap: 0;
    }

    .footer-links {
      grid-area: links;
    }

    .reseaux_sociauxF {
      grid-area: social;
    }

    .copyright {
      grid-area: copyright;
    }
  }
}