/* Existing main.css footer layout, scoped to the landing preview/live page. */
.stance-story .current-footer {
  --text: #1a1a1a;
  --background: #dfdfdf;
  width: 100%;
  height: fit-content;
  min-height: 25vh;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  margin-top: 15vh;
  background: var(--background);
  color: var(--text);
  font-family: "Stance Rajdhani", sans-serif;
  font-size: 16px;
  font-weight: 500;
  letter-spacing: normal;
  line-height: normal;
}
.stance-story .current-footer .footer-col-img {
  width: 25%;
  height: fit-content;
  display: flex;
  justify-content: center;
  align-items: center;
}
.stance-story .current-footer .footer-col-img img {
  width: 80%;
  height: auto;
  mix-blend-mode: difference;
}
.stance-story .current-footer .footer-col-links {
  width: 75%;
  height: fit-content;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: flex-start;
}
.stance-story .current-footer .f-link-section {
  width: 33%;
  height: fit-content;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
}
.stance-story .current-footer .f-link-title {
  font-size: 155%;
  white-space: nowrap;
  text-overflow: clip;
}
.stance-story .current-footer .f-link-links {
  font-size: 95%;
  width: 100%;
  height: fit-content;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.stance-story .current-footer .f-link {
  cursor: pointer;
  color: var(--text);
  position: relative;
  margin: 2px 0;
  padding: 0;
  border: 0;
  background: none;
  font: inherit;
  line-height: inherit;
}
.stance-story .current-footer .f-link::after {
  content: "";
  position: absolute;
  bottom: -1px;
  left: 50%;
  transform: translate(-50%, 0);
  background: var(--text);
  width: 0%;
  height: 1px;
  overflow: clip;
  transition: all .3s ease;
}
.stance-story .current-footer .f-link:hover::after { transition: all .15s ease; width: 100%; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .stance-story .current-footer {
    --text: #f5f5f5;
    --background: #000;
  }
}
:root[data-theme="dark"] .stance-story .current-footer { --text: #f5f5f5; --background: #000; }
@media (max-width: 850px) {
  .stance-story .current-footer {
    position: relative;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
  .stance-story .current-footer .footer-col-links {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-top: 1vh;
    margin-bottom: 5vh;
  }
  .stance-story .current-footer .f-link-section { margin-top: 5vh; }
}
