:root{
  --mk-ease: cubic-bezier(.22,1,.36,1);
  --mk-fast: 180ms;
  --mk-base: 280ms;
  --mk-slow: 480ms;
}

html{ -webkit-tap-highlight-color: transparent; }

body.mk-motion-ready .mk-reveal{
  opacity: 0;
  transform: translateY(14px) scale(.985);
  transition:
    opacity var(--mk-slow) var(--mk-ease),
    transform var(--mk-slow) var(--mk-ease);
  transition-delay: var(--mk-delay, 0ms);
  will-change: transform, opacity;
}
body.mk-motion-ready .mk-reveal.mk-inview{
  opacity: 1;
  transform: translateY(0) scale(1);
}

.saas-card,
.saas-soft-card,
.saas-kpi,
.saas-side-card,
.saas-alert,
.saas-tab,
.saas-chip,
.saas-pill,
.saas-btn,
.saas-btn-secondary,
.saas-btn-ghost,
.saas-btn-danger,
#menu-btn,
#menu-dropdown,
.mk-pwa-install-btn,
nav a,
main a[role="button"],
main button,
main input,
main select,
main textarea{
  transition:
    transform var(--mk-fast) ease,
    box-shadow var(--mk-fast) ease,
    border-color var(--mk-fast) ease,
    background-color var(--mk-fast) ease,
    color var(--mk-fast) ease,
    opacity var(--mk-fast) ease,
    filter var(--mk-fast) ease;
}

.saas-card:hover,
.saas-soft-card:hover,
.saas-kpi:hover{
  transform: translateY(-2px);
}

.saas-side-card:hover{
  transform: translateY(-1px);
}

.saas-btn:hover,
.saas-btn-secondary:hover,
.saas-btn-ghost:hover,
.saas-btn-danger:hover,
#menu-btn:hover,
.mk-pwa-install-btn:hover{
  transform: translateY(-1px);
}

.saas-btn:active,
.saas-btn-secondary:active,
.saas-btn-ghost:active,
.saas-btn-danger:active,
#menu-btn:active,
.mk-pwa-install-btn:active{
  transform: translateY(0) scale(.985);
}

.saas-tab:hover,
.saas-chip:hover,
.saas-pill:hover{
  transform: translateY(-1px);
}

main input:focus,
main select:focus,
main textarea:focus,
main button:focus-visible,
main a:focus-visible,
nav button:focus-visible,
nav a:focus-visible{
  outline: none;
}

.mk-sheen{
  position: relative;
  overflow: hidden;
}
.mk-sheen::after{
  content: "";
  position: absolute;
  inset: 0 auto 0 -140%;
  width: 38%;
  background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,.22) 50%, transparent 100%);
  transform: skewX(-18deg);
  transition: left 700ms var(--mk-ease);
  pointer-events: none;
}
.mk-sheen:hover::after{ left: 155%; }

.mk-glow-ring{
  box-shadow:
    0 18px 36px rgba(15,23,42,.08),
    0 0 0 1px rgba(255,255,255,.14) inset;
}

.mk-app-bar{
  position: sticky;
  top: calc(100dvh - 82px);
  z-index: 30;
}

@media (max-width: 768px){
  .mk-mobile-safe{
    padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 88px);
  }

  .saas-card:hover,
  .saas-soft-card:hover,
  .saas-kpi:hover,
  .saas-side-card:hover{
    transform: none;
  }
}

@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }

  body.mk-motion-ready .mk-reveal,
  body.mk-motion-ready .mk-reveal.mk-inview{
    opacity: 1 !important;
    transform: none !important;
  }

  .mk-sheen::after{ display:none; }
}