

.footer{
  background: #ececec;
  border-top: 1px solid #737272;
  padding: 64px 0 0;
}


.footer__top{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 120px;
  align-items: start;
  padding-bottom: 44px;
}

.footer__left{
  display: grid;
  gap: 14px;
  align-content: start;
}

.footer__place{
  margin: 0;
  font-weight: 500;
  font-size: 16px;
  line-height: 24px;
  color: #737272;
  opacity: 1;
}

.footer__mail{
  width: fit-content;
  text-decoration: none;
  color: #737272;
  font-weight: 500;
  font-size: 16px;
  line-height: 24px;
  opacity: 1;
}
.footer__mail:hover{ text-decoration: underline; opacity: .85; }

.footer__socials{
  display: grid;
  gap: 10px;
  margin-top: 16px;
}

.footer__social{
  width: fit-content;
  text-decoration: none;
  color: #737272;
  font-weight: 500;
  font-size: 16px;
  line-height: 24px;
  opacity: 1;
}
.footer__social:hover{ text-decoration: underline; opacity: .85; }

.footer__menu{
  display: grid;
  gap: 14px;
  align-content: start;
  justify-items: start;
}

.footer__menu-link{
  text-decoration: none;
  color: #1a1a1a;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: uppercase;
  font-size: 24px;
  line-height: 32px;
}
.footer__menu-link:hover{ text-decoration: underline; }

.footer__divider{
  width: 100%;
  border-top: 1px solid #737272;
}

.footer__bottom{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 18px 0 26px;
}

.footer__copy{
  font-weight: 500;
  font-size: 16px;
  line-height: 24px;
  color: #737272;
  opacity: 1;
}

.footer__legal{
  display: flex;
  gap: 26px;
  flex-wrap: wrap;
}

.footer__legal-link{
  font-weight: 500;
  font-size: 16px;
  line-height: 24px;
  color: #737272;
  opacity: 1;
  text-decoration: none;
}
.footer__legal-link:hover{ text-decoration: underline; opacity: .85; }

@media (max-width: 980px){
  .footer__top{
    grid-template-columns: 1fr;
    gap: 34px;
    padding-bottom: 34px;
  }

  .footer__menu-link{
    font-size: 18px; 
  }

  .footer__bottom{
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    padding: 16px 0px 22px;
  }
}

.footer .container{
  padding-left: 90px;
  padding-right: 90px;
}

@media (max-width: 980px){
  .footer .container{
    padding-left: 24px;
    padding-right: 24px;
  }
}
