/* FEROXO_NEWS_TEXT_HOVER_V542_2026_08_31
   Fix duplicate text:
   - normal state: only the text baked into the approved Figma image is visible;
   - hover/focus: red blur sweeps in, then one crisp HTML title appears above it. */

.home-page .latest-news__stack > a > span {
  position: absolute !important;
  z-index: 4 !important;
  top: 50% !important;
  left: clamp(20px, 4.1%, 34px) !important;
  right: auto !important;
  bottom: auto !important;
  transform: translateY(-50%) !important;
  display: block !important;
  width: min(48%, 290px) !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #fff !important;
  background: transparent !important;
  font-size: clamp(17px, 1.8vw, 29px) !important;
  font-weight: 600 !important;
  line-height: 1.04 !important;
  letter-spacing: 0 !important;
  text-align: left !important;
  text-transform: uppercase !important;
  white-space: normal !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
  text-shadow: 0 2px 12px rgba(0,0,0,.18) !important;
  pointer-events: none !important;

  /* Important: no second text layer before hover. */
  opacity: 0 !important;
  visibility: hidden !important;
  transition:
    opacity .16s ease .08s,
    visibility 0s linear .08s !important;
}

/* The hover plate stays below the HTML title and blurs the baked-in text enough
   to prevent a visible double title while still keeping the photo visible. */
.home-page .latest-news__stack > a::after {
  z-index: 2 !important;
  background:
    linear-gradient(
      90deg,
      rgba(191, 33, 33, .44) 0%,
      rgba(191, 33, 33, .34) 62%,
      rgba(191, 33, 33, .22) 100%
    ) !important;
  -webkit-backdrop-filter: blur(11px) saturate(108%) !important;
  backdrop-filter: blur(11px) saturate(108%) !important;
}

.home-page .latest-news__stack > a > img {
  z-index: 0 !important;
}

@media (hover: hover) and (pointer: fine) {
  .home-page .latest-news__stack > a:hover > span,
  .home-page .latest-news__stack > a:focus-visible > span {
    opacity: 1 !important;
    visibility: visible !important;
    transition:
      opacity .16s ease .08s,
      visibility 0s linear 0s !important;
  }
}

/* No artificial second text layer on touch devices. */
@media (hover: none) {
  .home-page .latest-news__stack > a > span {
    opacity: 0 !important;
    visibility: hidden !important;
  }
}

@media (max-width: 760px) {
  .home-page .latest-news__stack > a > span {
    left: 18px !important;
    width: 54% !important;
    font-size: clamp(14px, 4.6vw, 22px) !important;
    line-height: 1.04 !important;
  }
}
/* END_FEROXO_NEWS_TEXT_HOVER_V542_2026_08_31 */