.site-footer {
  position: relative;

  padding-top: 120px;

  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.footer-grid {
  display: grid;

  grid-template-columns: 1.5fr 1fr 1fr 1.3fr;

  gap: 60px;

  padding-bottom: 80px;
}

.footer-logo h2 {
  font-size: 34px;

  margin-bottom: 25px;

  background: linear-gradient(135deg, var(--primary), var(--secondary));

  -webkit-background-clip: text;

  -webkit-text-fill-color: transparent;
}

.footer-description {
  color: var(--light-text);

  line-height: 1.9;

  margin-bottom: 30px;

  max-width: 380px;
}

.footer-socials {
  display: flex;

  gap: 14px;
}

.footer-socials a {
  width: 45px;
  height: 45px;

  display: flex;

  align-items: center;

  justify-content: center;

  border-radius: 50%;

  background: rgba(255, 255, 255, 0.08);

  transition: 0.3s ease;
}

.footer-socials a:hover {
  transform: translateY(-5px);

  background: linear-gradient(135deg, var(--primary), var(--secondary));
}

.footer-column h3 {
  font-size: 22px;

  margin-bottom: 28px;
}

.footer-column ul {
  list-style: none;
}

.footer-column ul li {
  margin-bottom: 16px;
}

.footer-column ul li a {
  color: var(--light-text);

  transition: 0.3s ease;
}

.footer-column ul li a:hover {
  color: var(--white);

  padding-left: 5px;
}

.footer-newsletter-text {
  color: var(--light-text);

  line-height: 1.8;

  margin-bottom: 25px;
}

.footer-newsletter {
  display: flex;

  gap: 10px;

  margin-bottom: 30px;
}

.footer-newsletter input {
  flex: 1;

  height: 55px;

  border: none;

  outline: none;

  border-radius: 50px;

  padding: 0 20px;

  background: rgba(255, 255, 255, 0.08);

  color: white;
}

.footer-newsletter button {
  height: 55px;

  border: none;

  padding: 0 24px;

  border-radius: 50px;

  cursor: pointer;

  color: white;

  font-weight: 600;

  background: linear-gradient(135deg, var(--primary), var(--secondary));
}

.footer-contact p {
  color: var(--light-text);

  margin-bottom: 12px;
}

.footer-bottom {
  padding: 30px 0;

  border-top: 1px solid rgba(255, 255, 255, 0.08);

  text-align: center;
}

.footer-bottom p {
  color: var(--light-text);
}
.footer-menu {
  list-style: none;

  padding: 0;

  margin: 0;
}

.footer-menu li {
  margin-bottom: 16px;
}

.footer-menu li a {
  color: var(--light-text);

  transition: 0.3s ease;
}

.footer-menu li a:hover {
  color: var(--white);

  padding-left: 5px;
}