.qf-featured .qf-figure::after {
  transition: all calc(var(--qf-trans-fast) * 2) ease-in-out;
}

.qf-featured .qf-figure:hover:after {
  opacity: .5;
}

.qf-featured .qf-figure::before,
.qf-featured .qf-figcaption {
  inset: auto -1px -76px -1px;
  height: 75px;
}

.qf-featured .qf-figure::after {
  background-color: rgba(var(--qf-colors-dark), .735);
}

.qf-featured .qf-figure::before {
  background-color: rgba(var(--qf-colors-dark), .635);
  border: 1px solid rgba(var(--qf-colors-light), .5);
  opacity: 1;
}

.qf-featured .qf-figure:hover:before {
  background-color: rgba(var(--qf-colors-light), 1);
  opacity: 1;
}

.qf-featured .qf-figcaption {
  color: rgba(var(--qf-colors-light), .8);
  transition: all calc(var(--qf-trans-fast) * 2) ease-in-out;
}

.qf-featured .qf-article-sq:hover .qf-figcaption {
  color: rgba(var(--qf-colors-mid), 1);
}

@keyframes quick {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

.qf-responsive img,
.qf-versatile img,
.qf-quick img {
  z-index: 5;
}

.qf-responsive img:last-of-type,
.qf-versatile img:last-of-type,
.qf-quick img:last-of-type {
  inset: 0;
  opacity: 0;
  position: absolute;
  transition: all var(--qf-trans-fast) ease-in-out;
}

.qf-quick img:last-of-type {
  animation: quick 1.235s infinite linear;
  opacity: 0;
  transition-duration: calc(var(--qf-trans-fast) * 1.735);
}

.qf-quick:hover img:last-of-type {
  opacity: 1;
}

.qf-versatile img:first-of-type {
  transition: all calc(var(--qf-trans-fast) * 2) ease-in-out;
  opacity: 1;
}

.qf-versatile:hover img:first-of-type {
  opacity: 0;
}

.qf-versatile img:last-of-type {
  border-radius: 50%;
  transition: all calc(var(--qf-trans-fast) * 2) ease-in-out;
  transform: rotate(-45deg);
}

.qf-versatile:hover img:last-of-type {
  opacity: 1;
  transform: rotate(0deg);
  transition: all calc(var(--qf-trans-fast) * 2) ease-in-out;
}

.qf-versatile:hover img:first-of-type {
  opacity: 0;
  transform: rotate(-45deg);
  transition: all calc(var(--qf-trans-fast) * 2) ease-in-out;
}

.qf-responsive img:first-of-type {
  transition: all calc(var(--qf-trans-fast) * 2) ease-in-out;
  transform: scale(100%);
}

.qf-responsive:hover img:first-of-type {
  opacity: 0;
  transform: scale(1%);
  transform-origin: left;
  transition: all calc(var(--qf-trans-fast) * 2) ease-in-out;
}

.qf-responsive img:last-of-type {
  transform: scale(1%);
  transform-origin: right;
  transition: all calc(var(--qf-trans-fast) * 2) ease-in-out;
}

.qf-responsive:hover img:last-of-type {
  opacity: 1;
  transform: scale(100%);
  transition: all calc(var(--qf-trans-fast) * 1.35) ease-in-out;
}

@media only screen and (max-width: 1400px) {
  .qf-featured {
    gap: 3.735em;
    margin-top: 55px;
    padding: 35px;
  }

  .qf-featured .qf-article-sq {
    flex-grow: 1;
    width: calc(50% - 2.735em);
  }
}

@media only screen and (max-width: 1280px) {
  .qf-featured {
    flex-flow: column;
    gap: 3.735em;
    margin-top: 35px;
    padding: 3.5em 0 7.35em 0;
  }

  .qf-main-section {
    bottom: -2.135vh;
  }

  .qf-featured .qf-article-sq {
    width: 85%;
  }

  .qf-article {
    padding-bottom: 75px;
    padding-top: 85px;
  }

  .qf-close {
    right: 5%;
  }
}