/* Modern UI Phase 8 — Animations | var.13 grafo74 */
:root {
  --motion-fast: 160ms;
  --motion-base: 260ms;
  --motion-slow: 420ms;
  --motion-ease: cubic-bezier(.2,.7,.2,1);
  --motion-ease-out: cubic-bezier(.16,1,.3,1);
}

html { scroll-behavior: smooth; }

/* Safe initial page entrance: never hides content. */
body.modern-ui-motion-ready .wrapper,
body.modern-ui-motion-ready .container,
body.modern-ui-motion-ready main {
  animation: mui-page-enter var(--motion-slow) var(--motion-ease-out) both;
}

@keyframes mui-page-enter {
  from { opacity: .86; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Progressive reveal. Content remains visible when JS is unavailable. */
.mui-reveal {
  transition:
    opacity var(--motion-slow) var(--motion-ease-out),
    transform var(--motion-slow) var(--motion-ease-out);
}
body.modern-ui-motion-ready .mui-reveal:not(.mui-reveal-visible) {
  opacity: 0;
  transform: translateY(14px);
}
body.modern-ui-motion-ready .mui-reveal.mui-reveal-visible {
  opacity: 1;
  transform: translateY(0);
}

/* Staggered groups without changing layout. */
.mui-reveal:nth-child(2) { transition-delay: 45ms; }
.mui-reveal:nth-child(3) { transition-delay: 90ms; }
.mui-reveal:nth-child(4) { transition-delay: 135ms; }
.mui-reveal:nth-child(n+5) { transition-delay: 180ms; }

/* Interactive micro-motion. */
a,
button,
input,
select,
textarea,
.item-service,
.item-practice,
.item-man,
.card,
.thumbnail,
[class*="thumb"] {
  transition-duration: var(--motion-fast);
  transition-timing-function: var(--motion-ease);
}

button:active,
[role="button"]:active,
.btn:active,
.button:active,
a[class*="btn"]:active,
a[class*="button"]:active {
  transform: translateY(1px) scale(.985);
}

.item-service:hover,
.item-practice:hover,
.item-man:hover,
.card:hover {
  transform: translateY(-3px);
}

/* Images fade in only after the browser has decoded them. */
img.mui-image-pending {
  opacity: .001;
}
img.mui-image-ready {
  opacity: 1;
  transition: opacity var(--motion-base) ease;
}

/* Disclosure/menu transitions where supported. */
details > *:not(summary) {
  animation: mui-disclosure var(--motion-base) var(--motion-ease-out) both;
}
@keyframes mui-disclosure {
  from { opacity: 0; transform: translateY(-4px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Preserve viewer geometry and document controls. */
.viewer img,
.viewer-container img,
#doc2026Image,
.main-image,
.document-image {
  transform: none;
}

@media (hover: none) {
  .item-service:hover,
  .item-practice:hover,
  .item-man:hover,
  .card:hover { transform: none; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    transition-delay: 0ms !important;
  }
  body.modern-ui-motion-ready .mui-reveal,
  body.modern-ui-motion-ready .mui-reveal:not(.mui-reveal-visible) {
    opacity: 1 !important;
    transform: none !important;
  }
}

@media print {
  *, *::before, *::after {
    animation: none !important;
    transition: none !important;
    transform: none !important;
  }
  .mui-reveal,
  img.mui-image-pending { opacity: 1 !important; }
}