.site-footer {
  margin: var(--120px) auto var(--75px);
  max-width: var(--max-width);
  padding: 0 var(--inset);
}

.site-footer .subscribe-social {
  position: relative;
}
.site-footer .subscribe-social .heading {
  font-size: var(--26px);
  line-height: var(--26px);
  margin: 0;
}
.site-footer .subscribe {
  background-color: var(--orange);
  color: var(--white);
  display: inline-block;
  padding: var(--60px) var(--120px) var(--60px) 0;
  position: relative;
  max-width: var(--1105px);
  width: 100%;
  z-index: 1;
}
.site-footer .subscribe::before {
  background-color: inherit;
  bottom: 0;
  content: '';
  left: -50vw;
  position: absolute;
  top: 0;
  width: 50vw;
}
.site-footer .subscribe .heading + form {
  margin-top: var(--18px);
}
.site-footer .subscribe form {
  display: flex;
  gap: var(--25px);
}
.site-footer .subscribe .field {
  background-color: var(--white);
  color: var(--grey);
  border: none;
  border-radius: 0;
  flex-grow: 1;
  font-size: var(--19px);
  line-height: var(--19px);
  outline: none;
  padding: 0 var(--25px);
  height: var(--48px);
}
.site-footer .subscribe .button {
  padding: 0 var(--50px);
}
.site-footer .social {
  align-items: center;
  background-color: var(--grey-background);
  display: flex;
  flex-direction: column;
  height: var(--350px);
  justify-content: center;
  margin-top: var(---135px);
  padding: var(--75px);
  position: absolute;
  right: var(---50px);
  top: 100%;
  width: var(--350px);
}
.site-footer .social .heading + ul {
  margin-top: var(--10px);
}
.site-footer .social ul {
  display: flex;
  gap: var(--10px);
}
.site-footer .social a {
  align-items: center;
  background-color: var(--teal);
  display: inline-flex;
  height: var(--44px);
  justify-content: center;
  overflow: hidden;
  width: var(--44px);
}
.site-footer .social a:hover,
.site-footer .social a:focus {
  background-color: var(--teal-dark);
}
.site-footer .social a::after {
  background-color: var(--white);
  content: '';
}
.site-footer .social .facebook::after {
  height: var(--30px);
  -webkit-mask: url('icons/facebook.svg') center no-repeat;
  mask: url('icons/facebook.svg') center no-repeat;
  width: var(--16px);
}
.site-footer .social .twitter::after {
  height: var(--22px);
  -webkit-mask: url('icons/twitter.svg') center no-repeat;
  mask: url('icons/twitter.svg') center no-repeat;
  width: var(--27px);
}
.site-footer .social .linkedin::after {
  height: var(--23px);
  -webkit-mask: url('icons/linkedin.svg') center no-repeat;
  mask: url('icons/linkedin.svg') center no-repeat;
  width: var(--23px);
}

.site-footer .links {
  display: flex;
  flex-wrap: wrap;
  gap: var(--25px) var(--150px);
  margin: var(--75px) 0;
  max-width: 73%;
}
.site-footer .navigation {
  font-size: var(--16px);
  line-height: var(--25px);
  letter-spacing: 0.02em;
  text-transform: uppercase;
}
.site-footer .alternate {
  font-weight: var(--semibold);
}
.site-footer .alternate a {
  color: var(--orange);
}
.site-footer .alternate a:hover,
.site-footer .alternate a:focus {
  color: var(--orange-dark);
}
.site-footer .alternate a b {
  color: var(--grey);
  font-weight: var(--semibold);
}
.site-footer .alternate a:hover b,
.site-footer .alternate a:focus b {
  color: var(--orange-dark);
}
.site-footer .alternate {
  font-weight: var(--semibold);
}

.site-footer .local {
  columns: 2;
  column-gap: var(--50px);
  flex-grow: 1;
  font-weight: var(--light);
}
.site-footer .local ul {
  margin-top: var(--30px);
}
.site-footer .local ul:first-child {
  margin-top: 0;
}
.site-footer .local a {
  color: var(--grey);
}
.site-footer .local a:hover,
.site-footer .local a:focus {
  color: var(--orange);
}

.site-footer .legal,
.site-footer .copyright,
.site-footer .trademarks {
  font-size: var(--14px);
  font-weight: var(--light);
  letter-spacing: 0.02em;
  line-height: var(--20px);
}
.site-footer .legal a,
.site-footer .copyright,
.site-footer .copyright a,
.site-footer .trademarks {
  color: var(--grey-light);
  outline: none;
  text-decoration: none;
}
.site-footer .legal a:hover,
.site-footer .legal a:focus,
.site-footer .copyright a:hover,
.site-footer .copyright a:focus {
  color: var(--grey);
}
.site-footer .legal,
.site-footer .legal ul,
.site-footer .legal li,
.site-footer .copyright {
  display: inline-block;
}
.site-footer .legal {
  margin-right: var(--5px);
}
.site-footer .legal a {
  padding: 0 var(--10px);
  position: relative;
}
.site-footer .legal a::after {
  background-color: var(--grey-divider);
  content: '';
  height: 1em;
  right: 0;
  margin-top: -0.425em;
  position: absolute;
  top: 50%;
  width: var(--1px);
}
.site-footer .legal li:first-child a {
  padding-left: 0;
}
.site-footer .copyright {
  margin: 0;
}
.site-footer .trademarks {
  margin: var(--20px) 0 0;
}

@media (max-width: calc(1420px * 0.8)) {
  .site-footer {
    margin-bottom: var(--inset);
  }
  .site-footer .social {
    justify-content: flex-end;
    padding-bottom: var(--70px);
    right: var(---25px);
  }
}
@media (max-width: calc(960px * 0.8)) {
  .site-footer {
    margin: var(--50px) auto;
  }
  .site-footer .subscribe {
    padding: var(--50px) var(--inset) var(--50px) 0;
  }
  .site-footer .subscribe .heading {
    font-size: var(--20px);
    line-height: var(--25px);
  }
  .site-footer .subscribe form {
    flex-direction: column;
    gap: var(--15px);
  }
  .site-footer .links {
    max-width: none;
  }
}
@media (max-width: calc(640px * 0.8)) {
  .site-footer .subscribe-social {
    padding-bottom: var(--150px);
  }
  .site-footer .social {
    bottom: 0;
    height: var(--285px);
    max-width: var(--335px);
    padding-bottom: var(--30px);
    padding-left: var(--65px);
    top: auto;
    width: 100vw;
  }
  .site-footer .links {
    margin: var(--40px) 0;
    margin-right: var(--outset);
  }
  .site-footer .alternate {
    font-size: var(--20px);
    line-height: var(--50px);
    margin-top: var(---40px);
    padding-top: var(--40px);
    width: 100%;
  }
  .site-footer .alternate a {
    display: block;
    overflow: hidden;
    padding-right: var(--50px);
    position: relative;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .site-footer .alternate a::after {
    background-color: var(--grey-divider-dark);
    content: '';
    height: var(--18px);
    margin-top: var(---9px);
    -webkit-mask: url('icons/chevron-right.svg') center no-repeat;
    mask: url('icons/chevron-right.svg') center no-repeat;
    position: absolute;
    right: var(--25px);
    top: 50%;
    width: var(--10px);
  }
  .site-footer .alternate a:hover::after,
  .site-footer .alternate a:focus::after {
    background-color: var(--grey-light);
  }
  .site-footer .local {
    display: none;
  }
}
@media (max-width: calc(420px * 0.8)) {
  .site-footer .legal,
  .site-footer .copyright,
  .site-footer .trademarks {
    font-size: var(--12px);
    -webkit-font-smoothing: auto;
    letter-spacing: 0.01em;
    line-height: var(--20px);
  }
}