.site-footer {
  background: var(--nexo-bg);
  color:      var(--nexo-dark);

  padding-block: var(--section-y) var(--space-8);
}

.footer__logo {
  display:          block;
  width:            100%;
  margin-block-end: clamp(var(--space-8), 5vh, var(--space-16));
}

.footer__logo svg {
  display: block;
  width:   100%;
  height:  auto;
}

.footer__logo path            { fill: var(--nexo-dark); }
.footer__logo path:last-child { fill: var(--nexo-bg); }

.footer__main {
  display:               grid;
  grid-template-columns: 1fr auto;
  align-items:           end;
  gap:                   clamp(var(--space-8), 5vw, var(--space-16));
}

.footer__nav {
  display:               grid;
  grid-template-columns: repeat(auto-fit, minmax(8rem, 1fr));
  gap:                   clamp(var(--space-6), 3vw, var(--space-12));
}

.footer__col-title {
  font-family:      var(--font-heading);
  font-size:        var(--fs-sm);
  font-weight:      var(--fw-bold);
  line-height:      var(--lh-none);
  color:            var(--nexo-dark);
  margin-block-end: var(--space-4);
}

.footer__col a {
  display:       block;
  font-family:   var(--font-heading);
  font-size:     var(--fs-sm);
  font-weight:   var(--fw-regular);
  line-height:   var(--lh-normal);
  color:         var(--nexo-dark);
  padding-block: var(--space-1);
  opacity:       0.7;
  transition:    opacity var(--duration-fast) ease;
}

.footer__col a:hover,
.footer__col a:focus-visible { opacity: 1; }

.footer__institut {
  display:     block;
  flex-shrink: 0;
  width:       clamp(92px, 9vw, 123px);
}

.footer__institut img {
  display: block;
  width:   100%;
  height:  auto;
}

.footer__bottom {
  display:             flex;
  flex-wrap:           wrap;
  justify-content:     space-between;
  gap:                 var(--space-2);
  margin-block-start:  clamp(var(--space-12), 6vh, var(--space-16));
  padding-block-start: var(--space-6);
  border-block-start:  1px solid rgba(21, 7, 31, 0.15);
}

.footer__bottom small {
  font-size: var(--fs-xs);
  color:     var(--nexo-dark);
  opacity:   0.65;
}

@media (max-width: 768px) {
  .footer__main {
    grid-template-columns: 1fr;
    gap: clamp(var(--space-8), 6vw, var(--space-12));
  }
  .footer__institut { justify-self: start; }
}

@media (max-width: 640px) {
  .footer__nav { grid-template-columns: repeat(2, 1fr); }
}