/* Shared site footer (GateRouter) — single tree for all public pages */

.site-footer {
  --footer-text: #111827;
  --footer-muted: #6f7680;
  --footer-line: #edf0f3;

  position: relative;
  display: flex;
  width: 100%;
  height: 394px;
  flex-direction: column;
  align-items: flex-start;
  overflow: hidden;
  background: #fff url("/landing/assets/home/footer-placeholder.png") center / cover no-repeat;
  color: var(--footer-text);
}

.site-footer::before {
  display: none;
}

.site-footer .footer-inner {
  position: relative;
  z-index: 1;
  display: flex;
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: space-between;
  padding: 63.12px clamp(24px, 11.1vw, 213.03px);
}

.site-footer .footer-content {
  display: flex;
  flex: 1;
  align-items: flex-start;
  justify-content: space-between;
  gap: clamp(24px, 4vw, 134.13px);
  flex-wrap: nowrap;
  min-width: 0;
}

.site-footer .footer-brand {
  display: flex;
  width: auto;
  flex: 0 0 auto;
  min-width: 0;
  flex-direction: column;
  align-items: flex-start;
  gap: 11.84px;
}

.site-footer .footer-brand .brand {
  display: inline-flex;
  flex: 0 0 auto;
  flex-shrink: 0;
  width: 131.1px;
  height: 23.67px;
  align-items: center;
  margin: 0;
  text-decoration: none;
}

.site-footer .footer-brand .brand img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: contain;
}

.site-footer .footer-brand p {
  width: auto;
  min-width: 0;
  max-width: 100%;
  margin: 0;
  color: var(--footer-muted);
  font-size: 13.808px;
  font-weight: 400;
  line-height: 1.5;
  white-space: nowrap;
}

.site-footer .footer-column {
  position: relative;
  display: flex;
  width: auto;
  flex: 0 0 auto;
  flex-direction: column;
  align-items: flex-start;
  gap: 0;
  white-space: nowrap;
  color: var(--footer-text);
  font-size: 13.808px;
  line-height: normal;
}

.site-footer .footer-column h2 {
  margin: 0 0 15.78px;
  color: var(--footer-muted);
  font-size: 11.835px;
  font-weight: 600;
  line-height: normal;
  letter-spacing: 0.9468px;
  text-transform: uppercase;
}

.site-footer .footer-column > a,
.site-footer .footer-column > button {
  position: relative;
  display: inline-block;
  padding: 0;
  border: 0;
  background: none;
  color: var(--footer-text);
  font-family: inherit;
  font-size: 13.808px;
  font-weight: 400;
  line-height: normal;
  text-align: left;
  text-decoration: none;
  cursor: pointer;
  transition: color 500ms cubic-bezier(0.16, 1, 0.3, 1);
}

.site-footer .footer-column > a + a,
.site-footer .footer-column > a + button,
.site-footer .footer-column > button + a {
  margin-top: 9.863px;
}

.site-footer .footer-column > a:hover,
.site-footer .footer-column > a:focus-visible,
.site-footer .footer-column > button:hover,
.site-footer .footer-column > button:focus-visible {
  color: #000;
}

.site-footer .social-row {
  display: flex;
  align-items: center;
  gap: 11.835px;
}

.site-footer .social-row a {
  position: relative;
  display: grid;
  width: 39.45px;
  height: 39.45px;
  border: 0.986px solid var(--footer-line);
  border-radius: 19.725px;
  background: #fff;
  font-weight: 700;
  place-items: center;
  text-decoration: none;
}

.site-footer .social-row svg {
  display: block;
  width: 17.75px;
  height: 17.75px;
}

@media (max-width: 768px) {
  .site-footer {
    height: auto;
    overflow: visible;
  }

  .site-footer .footer-inner {
    height: auto;
    min-height: auto;
    padding: 40px 20px;
  }

  .site-footer .footer-content {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 30px 24px;
    align-items: start;
    justify-content: initial;
    flex-wrap: unset;
  }

  .site-footer .footer-brand {
    grid-column: 1 / -1;
    width: 100%;
  }

  .site-footer .footer-brand .brand {
    width: 130px;
    height: auto;
    aspect-ratio: 131.1 / 23.67;
  }

  .site-footer .footer-brand p {
    white-space: normal;
    max-width: 100%;
  }

  .site-footer .footer-column {
    width: auto;
    min-width: 0;
    white-space: normal;
  }

  .site-footer .footer-column h2 {
    margin-bottom: 12px;
  }
}

@media (max-width: 900px) and (min-width: 769px) {
  .site-footer {
    height: auto;
    overflow: visible;
  }

  .site-footer .footer-inner {
    height: auto;
    padding: 56px 24px;
  }

  .site-footer .footer-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
    align-items: start;
  }

  .site-footer .footer-brand {
    grid-column: 1 / -1;
  }

  .site-footer .footer-brand p {
    white-space: normal;
  }
}