.footer {
  display: flex;
  width: 100%;
  height: 300px;
  align-items: center;
  justify-content: center;
  padding: 2rem;
  background-color: var(--dark-color);
  color: var(--white-color);

  .contact {
    .copyright {
      text-align: center;
      font-size: 1.4rem;
      font-style: normal;
      margin-top: 2rem;
      color: var(--text-muted);
    }

    .info {
      display: grid;
      gap: 15px 30px;
      grid-template-areas:
        'github linkedin email tel';

      .link {
        font-weight: 600;
        font-size: 1.6rem;
        color: var(--white-color);
        font-style: normal;
        padding: 1rem;
        border-radius: 12px;
        transition: all 0.3s ease;
        display: flex;
        align-items: center;
        justify-content: center;
        text-decoration: none;
        background-color: rgba(255, 255, 255, 0.1);
        backdrop-filter: blur(10px);

        &:hover {
          background-color: var(--primary-color);
          transform: translateY(-3px);
          box-shadow: 0 8px 20px rgba(37, 99, 235, 0.3);
        }

        &:focus {
          outline: 2px solid var(--focus-color);
          outline-offset: 2px;
        }

        &:active {
          transform: translateY(0);
        }

        &.linkedin-link {
          grid-area: linkedin;
        }

        &.github-link {
          grid-area: github;
        }

        &.email-link {
          grid-area: email;
        }

        &.tel-link {
          grid-area: tel;
        }

        .social-media-icon {
          width: 30px;
          height: 30px;
          filter: brightness(0) invert(1);
          transition: all 0.3s ease;
        }
      }
    }
  }
}

@media (max-width: 1074px) {
}