/* Jemné, účelné animácie naprieč webom SKoZ.
   Obsah zostáva viditeľný aj bez JavaScriptu; skrytie sa aktivuje až po inicializácii. */
:root {
  --motion-duration: 560ms;
  --motion-ease: cubic-bezier(.22, 1, .36, 1);
}

@media (prefers-reduced-motion: no-preference) {
  html.motion-ready .motion-reveal {
    opacity: 0;
    transform: translate3d(0, 20px, 0);
    transition:
      opacity var(--motion-duration) var(--motion-ease),
      transform var(--motion-duration) var(--motion-ease);
    transition-delay: var(--motion-delay, 0ms);
    will-change: opacity, transform;
  }

  html.motion-ready .motion-reveal.motion-from-left { transform: translate3d(-22px, 0, 0); }
  html.motion-ready .motion-reveal.motion-from-right { transform: translate3d(22px, 0, 0); }
  html.motion-ready .motion-reveal.motion-fade-only { transform: none; }

  html.motion-ready .motion-reveal.is-visible {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    will-change: auto;
  }

  .title-box .site-logo,
  .title-box .title-header,
  .title-box .hamburger {
    animation: skoz-enter 650ms var(--motion-ease) both;
  }
  .title-box .title-header { animation-delay: 90ms; }
  .title-box .hamburger { animation-delay: 140ms; }

  /* Jemná spätná väzba pri interakcii, bez posúvania rozloženia. */
  .main-nav > li > a,
  .sub-menu a,
  button,
  .pagination a,
  .edit-btn,
  .delete-btn {
    transition:
      color 180ms ease,
      background-color 180ms ease,
      border-color 180ms ease,
      box-shadow 180ms ease,
      transform 180ms ease;
  }

  /* Navigácia sa pri hoveri neposúva, aby zostala stabilná na desktope aj mobile. */
  .main-nav > li > a:hover,
  .sub-menu a:hover {
    transform: none;
  }

  .pagination a:hover {
    transform: translateY(-1px);
  }

  .grid-container .box {
    transition: box-shadow 220ms ease, transform 220ms ease;
  }
  .grid-container .box:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 26px rgba(7, 59, 112, .14);
  }

  .grid-container .thumbnail img,
  .photos .photo-card img {
    transition: transform 420ms var(--motion-ease);
  }
  .grid-container .box:hover .thumbnail img,
  .photos .photo-card:hover img {
    transform: scale(1.035);
  }

  /* Ponecháme pôvodné display:none/block pravidlá navigácie.
     Animuje sa iba už otvorené submenu, aby sa nemenilo správanie menu. */
  .title-box .main-nav > li.has-submenu.open > .sub-menu {
    animation: skoz-submenu-enter 180ms ease both;
  }

  .cookie-consent {
    transition: opacity 220ms ease, transform 220ms var(--motion-ease);
  }
}

@keyframes skoz-enter {
  from { opacity: 0; transform: translate3d(0, 12px, 0); }
  to { opacity: 1; transform: translate3d(0, 0, 0); }
}

@keyframes skoz-submenu-enter {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}

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