/* Motion is opt-in to this stylesheet, loaded only by application detail pages. */
.application-detail .app-keyword {
  background-image: linear-gradient(#009ecb35, #009ecb35);
  background-repeat: no-repeat;
  background-position: 0 100%;
  background-size: 100% 2px;
}
@media (prefers-reduced-motion: no-preference) {
  .application-detail .app-hero-enter {
    animation: app-enter 450ms cubic-bezier(0.2, 0.65, 0.3, 1) var(--app-delay, 0ms) both;
  }
  .application-detail .app-reveal-in {
    animation: app-enter 480ms cubic-bezier(0.2, 0.65, 0.3, 1) var(--app-delay, 0ms) both;
  }
  .application-detail [data-app-direction="left"] { --app-x: -10px; --app-y: 0px; }
  .application-detail [data-app-direction="right"] { --app-x: 10px; --app-y: 0px; }
  .application-detail .app-reveal-in .app-keyword { animation: app-underline 550ms ease-out 100ms both; }
  .application-detail .app-reveal-in svg { animation: app-icon-enter 400ms ease-out both; }
  .application-detail .whatsapp-enquiry svg { animation: app-icon-enter 400ms ease-out both; }
  .application-detail .application-panel,
  .application-detail .application-automation {
    transition: translate 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
  }
  .application-detail .button,
  .application-detail .whatsapp-enquiry {
    transition: box-shadow 180ms ease, background-color 180ms ease, border-color 180ms ease;
  }
  .application-detail .button > span[aria-hidden="true"] { transition: transform 180ms ease; }
  .application-detail .button[href]:hover > span[aria-hidden="true"],
  .application-detail .button[href]:focus-visible > span[aria-hidden="true"] { transform: translateX(2px); }
  .application-detail .button[href]:hover,
  .application-detail .button[href]:focus-visible { box-shadow: 0 6px 18px -8px #006b9b70; }
  @media (hover: hover) and (pointer: fine) {
    .application-detail .application-panel:hover,
    .application-detail .application-automation:hover {
      translate: 0 -2px;
      box-shadow: 0 8px 22px -15px #103e6040;
      border-color: #94c4da;
    }
  }
}
@keyframes app-enter {
  from { opacity: 0; transform: translate(var(--app-x, 0px), var(--app-y, 8px)); }
  to { opacity: 1; transform: translate(0, 0); }
}
@keyframes app-underline { from { background-size: 0 2px; } to { background-size: 100% 2px; } }
@keyframes app-icon-enter { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }
@media (max-width: 700px) {
  .application-detail [data-app-direction] { --app-x: 0px; --app-y: 8px; }
}
@media (prefers-reduced-motion: reduce) {
  .application-detail *, .application-detail *::before, .application-detail *::after {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }
}
@media print {
  .application-detail * { animation: none !important; opacity: 1 !important; transform: none !important; }
}