.site-footer {
  position: relative;
  overflow: hidden;
  background: #07090a;
  color: #eef1f1;
  border-top: 1px solid rgba(220, 232, 232, .1);
}

.site-footer::before {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 42% 120% at 82% 100%, rgba(84, 111, 112, .11), transparent 72%),
    linear-gradient(90deg, transparent 0 49.96%, rgba(255,255,255,.035) 50%, transparent 50.04%);
  content: "";
  pointer-events: none;
}

.site-footer-inner {
  position: relative;
  width: min(100%, 1600px);
  margin: 0 auto;
  padding: 46px clamp(24px, 6.8vw, 112px) 24px;
}

.site-footer-main {
  display: grid;
  grid-template-columns: auto minmax(220px, 1fr) auto;
  gap: clamp(28px, 5vw, 84px);
  align-items: center;
  padding-bottom: 42px;
}

.site-footer-origin {
  font-family: var(--brand-serif);
  font-size: clamp(34px, 3vw, 48px);
  letter-spacing: -.03em;
  line-height: 1;
}

.site-footer-main p {
  max-width: 420px;
  margin: 0;
  color: rgba(216, 226, 226, .52);
  font-size: 13px;
  line-height: 1.5;
}

.site-footer-contact {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  min-height: 44px;
  padding: 0 0 5px;
  border-bottom: 1px solid rgba(235, 242, 242, .35);
  color: #f4f7f7;
  font-size: 14px;
  transition: gap .35s var(--ease-out), border-color .25s ease;
}

.site-footer-contact:hover,
.site-footer-contact:focus-visible { gap: 20px; border-color: currentColor; }

.site-footer-bottom {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 28px;
  align-items: center;
  min-height: 58px;
  border-top: 1px solid rgba(220, 232, 232, .1);
  color: rgba(204, 216, 216, .42);
  font-size: 11px;
}

.site-footer-bottom > span {
  font-family: Inter, ui-sans-serif, system-ui, sans-serif;
  font-size: 12px;
  font-weight: 300;
  letter-spacing: -.03em;
}

.site-footer-nav,
.site-footer-social { display: flex; align-items: center; gap: clamp(14px, 2vw, 30px); }
.site-footer-nav { justify-self: center; }
.site-footer-social { justify-self: end; }
.site-footer-nav a,
.site-footer-social a { min-height: 44px; display: inline-flex; align-items: center; color: rgba(225, 233, 233, .62); transition: color .25s ease; }
.site-footer-nav a:hover,
.site-footer-nav a:focus-visible,
.site-footer-social a:hover,
.site-footer-social a:focus-visible { color: #fff; }

@media (max-width: 900px) {
  .site-footer-main { grid-template-columns: 1fr auto; }
  .site-footer-main p { grid-column: 1 / -1; grid-row: 2; }
  .site-footer-contact { grid-column: 2; grid-row: 1; }
  .site-footer-bottom { grid-template-columns: 1fr auto; }
  .site-footer-nav { grid-column: 1 / -1; grid-row: 1; justify-self: start; flex-wrap: wrap; }
  .site-footer-bottom > span { grid-row: 2; }
  .site-footer-social { grid-row: 2; }
}

@media (max-width: 560px) {
  .site-footer-inner { width: 100%; padding: 42px 22px 24px; }
  .site-footer-main { display: flex; flex-direction: column; align-items: flex-start; gap: 20px; padding-bottom: 30px; }
  .site-footer-main p { max-width: 330px; }
  .site-footer-contact { width: 100%; max-width: 100%; justify-content: space-between; font-size: 13px; overflow-wrap: anywhere; }
  .site-footer-contact span:first-child { min-width: 0; overflow-wrap: anywhere; }
  .site-footer-bottom { display: grid; grid-template-columns: 1fr auto; gap: 16px 20px; padding-top: 18px; }
  .site-footer-nav { grid-column: 1 / -1; width: 100%; order: initial; gap: 4px 16px; }
  .site-footer-nav a { min-height: 36px; }
  .site-footer-bottom > span { grid-column: 1; grid-row: 2; align-self: center; font-size: 10px; line-height: 1.4; }
  .site-footer-social { grid-column: 2; grid-row: 2; margin: 0; justify-self: end; }
  .site-footer-social a { min-height: 36px; }
}
