@font-face {
  font-family: 'Recraft Footer Century Gothic';
  src: url('assets/footer/century-gothic-input.ttf') format('truetype');
  font-style: normal;
  font-weight: 400;
  font-display: block;
  ascent-override: 100%;
  descent-override: 25%;
  line-gap-override: 0%;
}

.interactive-footer {
  position: absolute;
  left: 0;
  top: 4860px;
  width: 1440px;
  height: 541px;
  overflow: hidden;
  pointer-events: none;
}
.footer-background {
  position: absolute;
  inset: 0;
  display: block;
  width: 1440px;
  height: 541px;
  max-width: none;
}
.footer-email-field {
  position: absolute;
  left: 360px;
  top: 86.554px;
  width: 539.995px;
  height: 93.508px;
  cursor: text;
  pointer-events: auto;
}
.footer-email-input {
  position: absolute;
  left: 47.3447px;
  top: 36.356px;
  width: 475px;
  height: 24px;
  box-sizing: content-box;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  outline: 0;
  background: transparent;
  color: #565757;
  caret-color: #565757;
  font: 400 16px/24px 'Recraft Footer Century Gothic', sans-serif;
  font-kerning: none;
  font-synthesis: none;
  font-feature-settings: 'liga' 0;
  letter-spacing: normal;
  appearance: none;
  -webkit-appearance: none;
}
.footer-email-input::placeholder { color: transparent; opacity: 0; }
.footer-email-placeholder {
  position: absolute;
  left: 47px;
  top: 40.946px;
  display: block;
  width: 143px;
  height: 17.5px;
  max-width: none;
  pointer-events: none;
}
.footer-email-input:focus + .footer-email-placeholder,
.footer-email-input:not(:placeholder-shown) + .footer-email-placeholder { visibility: hidden; }
.footer-word {
  position: absolute;
  display: block;
  pointer-events: auto;
  transform-origin: center;
}
.footer-word img,
.footer-thumb-art {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  pointer-events: none;
  transform-origin: center;
}
.footer-word:hover img,
.footer-word:focus-visible img,
.footer-vote:hover .footer-thumb-art,
.footer-vote:has(.footer-vote-button:focus-visible) .footer-thumb-art {
  animation: menu-pulse 700ms ease-in-out infinite;
}
.footer-word:focus-visible { outline: 1px solid #273238; outline-offset: 5px; }
.footer-vote {
  position: absolute;
  top: 360px;
  width: 180px;
  height: 181px;
  pointer-events: auto;
}
.footer-vote-up { left: 900px; }
.footer-vote-down { left: 1080px; }
.footer-thumb-art { position: absolute; }
.footer-vote-count {
  position: absolute;
  inset: 0;
  display: block;
  width: 180px;
  height: 180px;
  pointer-events: none;
  fill: #080204;
}
.footer-vote-button {
  position: absolute;
  inset: 0;
  width: 180px;
  height: 180px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
}
.footer-vote-button:focus-visible { outline: 2px solid #273238; outline-offset: -6px; }
.footer-vote-button[aria-disabled='true'] { cursor: default; }
.interactive-footer [data-reveal-control][inert] { pointer-events: none; }
.footer-vote-status {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}
@media (prefers-reduced-motion: reduce) {
  .footer-word:hover img,
  .footer-word:focus-visible img,
  .footer-vote:hover .footer-thumb-art,
  .footer-vote:has(.footer-vote-button:focus-visible) .footer-thumb-art {
    animation: none;
    transform: scale(1.1);
  }
}

.footer-question { position: absolute; left: 1260px; top: 360px; display: block; width: 180px; height: 181px; pointer-events: auto; cursor: default; }
.footer-question-art { position: absolute; left: 70px; top: 67px; display: block; width: 41px; height: 41px; max-width: none; pointer-events: none; transform-origin: center; }
.footer-question:hover .footer-question-art { animation: menu-pulse 700ms ease-in-out infinite; }
@media (prefers-reduced-motion: reduce) { .footer-question:hover .footer-question-art { animation: none; transform: scale(1.1); } }

/* Reuse the exact original envelope, shifted onto the column centre. */
.footer-envelope-mask {
  position: absolute;
  left: 246px;
  top: 116px;
  width: 40px;
  height: 32px;
  background: #95a3aa;
  pointer-events: none;
}
.footer-envelope {
  position: absolute;
  left: 250.25px;
  top: 116px;
  width: 40px;
  height: 32px;
  overflow: hidden;
  pointer-events: none;
}
.footer-envelope img {
  position: absolute;
  left: -246px;
  top: -116px;
  display: block;
  width: 1440px;
  height: 541px;
  max-width: none;
  pointer-events: none;
}