/* v353: Gentle premium hover for the three App use-case labels only.
 * Purely decorative cards: do not add button cursors or change their links/semantics.
 */
.os-home-v9 .os-v339-app__use-cases > div {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  transition: transform 240ms cubic-bezier(.2,.8,.2,1),
              border-color 240ms ease,
              box-shadow 240ms ease,
              background-color 240ms ease;
  will-change: auto;
}
.os-home-v9 .os-v339-app__use-cases > div::before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  width: min(64%, 170px);
  height: 3px;
  border-radius: 0 0 6px 6px;
  background: linear-gradient(90deg, #EFB000 0%, #F6D76A 50%, #EFB000 100%);
  opacity: 0;
  transform: translateX(-50%) scaleX(.25);
  transform-origin: center;
  transition: transform 260ms cubic-bezier(.2,.8,.2,1), opacity 180ms ease;
  pointer-events: none;
}
.os-home-v9 .os-v339-app__use-cases > div svg {
  transition: transform 240ms cubic-bezier(.2,.8,.2,1), color 240ms ease;
}
@media (hover: hover) and (pointer: fine) {
  .os-home-v9 .os-v339-app__use-cases > div:hover {
    transform: translateY(-4px);
    background: #fff !important;
    border-color: #EFB000 !important;
    box-shadow: 0 12px 25px rgba(0,7,48,.09), 0 0 0 1px rgba(239,176,0,.11);
    color: #000730 !important;
  }
  .os-home-v9 .os-v339-app__use-cases > div:hover::before {
    opacity: 1;
    transform: translateX(-50%) scaleX(1);
  }
  .os-home-v9 .os-v339-app__use-cases > div:hover svg {
    color: #EFB000 !important;
    transform: translateY(-1px) scale(1.09);
  }
}
@media (prefers-reduced-motion: reduce) {
  .os-home-v9 .os-v339-app__use-cases > div,
  .os-home-v9 .os-v339-app__use-cases > div::before,
  .os-home-v9 .os-v339-app__use-cases > div svg {
    transition: none !important;
  }
  .os-home-v9 .os-v339-app__use-cases > div:hover,
  .os-home-v9 .os-v339-app__use-cases > div:hover svg { transform: none; }
}