/* CEP .fx system - desktop animated colour+text hover, mobile scroll-activation.
   Fills the gap in theme v2.2.0, which had hovers and no mobile twin. */
.fx{transition:background-color var(--dur,240ms) var(--ease,cubic-bezier(.22,.61,.36,1)),
  color var(--dur,240ms) var(--ease,cubic-bezier(.22,.61,.36,1)),
  border-color var(--dur,240ms) var(--ease,cubic-bezier(.22,.61,.36,1)),
  transform var(--dur,240ms) var(--ease,cubic-bezier(.22,.61,.36,1)),
  box-shadow var(--dur,240ms) var(--ease,cubic-bezier(.22,.61,.36,1))}
@media (hover:hover) and (pointer:fine){
  .fx:hover{background-color:var(--red,#D60000);color:#fff;border-color:var(--red,#D60000);
    transform:translateY(-4px);box-shadow:var(--sh-lg,0 18px 48px rgba(15,27,45,.13))}
  .fx:hover .fx-t,.fx:hover h3,.fx:hover p,.fx:hover dt,.fx:hover dd,.fx:hover .fx-k{color:#fff}
  .fx:hover .fx-i{stroke:#fff}
}
.fx.fx-on{background-color:var(--red,#D60000);color:#fff;border-color:var(--red,#D60000);
  transform:translateY(-4px);box-shadow:var(--sh-lg,0 18px 48px rgba(15,27,45,.13))}
.fx.fx-on .fx-t,.fx.fx-on h3,.fx.fx-on p,.fx.fx-on dt,.fx.fx-on dd,.fx.fx-on .fx-k{color:#fff}
.fx.fx-on .fx-i{stroke:#fff}
.fx-rise{opacity:1;transform:translateY(14px);transition:transform 620ms var(--ease,cubic-bezier(.22,.61,.36,1))}
.fx-rise.is-in{transform:translateY(0)}
@media (prefers-reduced-motion:reduce){
  .fx,.fx-rise{transition:none!important}
  .fx.fx-on,.fx:hover{transform:none}
  .fx-rise{transform:none}
}
