/* OneStack v373: hover/focus treatment for Software + Graphic cards on homepage only.
 * No template changes, and no animation triggered by touch input. */

body.oneweb-template-home .os-home-v9 .os-v9-dual .os-v9-feature-card {
  position: relative;
  isolation: isolate;
  border: 1px solid #dfe6ef !important;
  box-shadow: 0 7px 24px rgba(15, 33, 62, .075) !important;
  transition: transform .34s cubic-bezier(.22, 1, .36, 1),
              border-color .3s ease, box-shadow .34s ease !important;
}
body.oneweb-template-home .os-home-v9 .os-v9-dual .os-v9-feature-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  width: 28%;
  height: 3px;
  border-radius: 0 0 999px 999px;
  background: linear-gradient(90deg, rgba(239,176,0,0), #EFB000, rgba(239,176,0,0));
  opacity: 0;
  transform: translateX(-50%) scaleX(.5);
  transform-origin: center;
  pointer-events: none;
  transition: opacity .28s ease, transform .36s cubic-bezier(.22, 1, .36, 1);
}
body.oneweb-template-home .os-home-v9 .os-v9-dual .os-v9-feature-card__image img {
  transition: transform .5s cubic-bezier(.22, 1, .36, 1),
              filter .4s ease;
  transform: translate3d(0,0,0);
}
body.oneweb-template-home .os-home-v9 .os-v9-dual .os-v9-feature-card em {
  transition: background-color .3s ease, border-color .3s ease,
              color .3s ease;
}

@media (hover: hover) and (pointer: fine) {
  body.oneweb-template-home .os-home-v9 .os-v9-dual .os-v9-feature-card:hover {
    transform: translateY(-5px);
    border-color: #EFB000 !important;
    box-shadow: 0 19px 37px rgba(0,7,48,.14), 0 0 0 1px rgba(239,176,0,.08) !important;
  }
  body.oneweb-template-home .os-home-v9 .os-v9-dual .os-v9-feature-card:hover::before {
    opacity: 1;
    transform: translateX(-50%) scaleX(1);
  }
  body.oneweb-template-home .os-home-v9 .os-v9-dual .os-v9-feature-card:hover .os-v9-feature-card__image img {
    transform: translate3d(0,-5px,0) scale(1.025);
    filter: drop-shadow(0 10px 12px rgba(0,7,48,.12));
  }
  body.oneweb-template-home .os-home-v9 .os-v9-dual .os-v9-feature-card:hover em {
    border-color: rgba(239,176,0,.6) !important;
    background-color: #fff9e8 !important;
    color: #000730 !important;
  }
}
/* Keyboard focus mirrors the interaction even when no pointing device exists. */
body.oneweb-template-home .os-home-v9 .os-v9-dual .os-v9-feature-card:focus-visible {
  outline: 2px solid #EFB000;
  outline-offset: 3px;
  border-color: #EFB000 !important;
  box-shadow: 0 14px 30px rgba(0,7,48,.13) !important;
}
body.oneweb-template-home .os-home-v9 .os-v9-dual .os-v9-feature-card:focus-visible::before {
  opacity: 1;
  transform: translateX(-50%) scaleX(1);
}
@media (prefers-reduced-motion: reduce) {
  body.oneweb-template-home .os-home-v9 .os-v9-dual .os-v9-feature-card,
  body.oneweb-template-home .os-home-v9 .os-v9-dual .os-v9-feature-card::before,
  body.oneweb-template-home .os-home-v9 .os-v9-dual .os-v9-feature-card__image img,
  body.oneweb-template-home .os-home-v9 .os-v9-dual .os-v9-feature-card em {
    transition: none !important;
  }
  body.oneweb-template-home .os-home-v9 .os-v9-dual .os-v9-feature-card:hover,
  body.oneweb-template-home .os-home-v9 .os-v9-dual .os-v9-feature-card:hover .os-v9-feature-card__image img {
    transform: none !important;
  }
}
