.footer {
  background-color: #333;
  color: #fbfbfb;
  padding: 4rem 2rem 2rem;

  .footerInner {
    max-width: 1200px;
    margin-inline: auto;
  }

  .footerLogo {
    margin-bottom: 2rem;

    .logoText {
      font-size: clamp(4rem, 3.9rem + 0.5vw, 4.5rem);
      font-weight: 700;
    }
  }

  .footerNav {
    margin-bottom: 3rem;

    ul {
      display: flex;
      flex-wrap: wrap;
      gap: 2rem;

      a {
        font-size: clamp(0.9rem, 0.8rem + 0.5vw, 1.1rem);
        transition: color 0.3s;

        &:hover {
          color: #70c5c7;
        }
      }
    }
  }

  .copyright {
    text-align: center;
    font-size: clamp(0.8rem, 0.7rem + 0.5vw, 1rem);
  }
}

@media (width < 768px) {
  .footer {
    padding: 3rem 1rem 1.5rem;

    .footerNav ul {
      flex-direction: column;
      gap: 1rem;
      text-align: center;
    }
  }
}