/* Painter's Theme 2.3 — consolidated motion system.
   Scroll reveals, navigation transitions and interface motion are intentionally
   kept separate so each system has one source of truth. */
@view-transition {
  navigation: auto;
}

:root {
  --lf-motion-distance: 44px;
  --lf-motion-duration: 1500ms;
  --lf-motion-ease: cubic-bezier(.16,1,.3,1);
  --lf-page-transition-duration: 520ms;
  --lf-page-transition-ease: cubic-bezier(.16,1,.3,1);
}

/* Native cross-document transitions: same-origin navigation is handled by the
   browser. Unsupported browsers use the JavaScript fallback below. */
::view-transition-group(root) {
  animation-duration: var(--lf-page-transition-duration);
  animation-timing-function: var(--lf-page-transition-ease);
}
::view-transition-old(root) {
  animation: lf-view-out var(--lf-page-transition-duration) var(--lf-page-transition-ease) both;
}
::view-transition-new(root) {
  animation: lf-view-in var(--lf-page-transition-duration) var(--lf-page-transition-ease) both;
}
@keyframes lf-view-out {
  from { opacity:1; transform:translate3d(0,0,0); }
  to { opacity:0; transform:translate3d(0,-4px,0); }
}
@keyframes lf-view-in {
  from { opacity:0; transform:translate3d(0,6px,0); }
  to { opacity:1; transform:translate3d(0,0,0); }
}

/* Non-View-Transition fallback. The arrival class is applied early in <head>
   for same-origin navigations/back-forward restores, so content does not flash
   visible before the reveal observer is initialized. */
html.lf-page-arriving body {
  opacity:0;
}
html.lf-page-arrived body {
  opacity:1;
  transition:opacity 420ms var(--lf-page-transition-ease);
}
html.lf-page-leaving body {
  opacity:0;
  transition:opacity 180ms var(--lf-page-transition-ease);
}

/* First-paint state: targeted content is hidden before initial paint. JS then
   upgrades every selected target to .lf-motion-item before releasing this state. */
html.lf-motion-pending .works-grid > .work-card:not(.lf-motion-item),
html.lf-motion-pending .work-single > .work-hero-link:not(.lf-motion-item),
html.lf-motion-pending .work-single > .work-details > div:not(.lf-motion-item),
html.lf-motion-pending .work-single > .work-gallery .work-gallery-item:not(.lf-motion-item),
html.lf-motion-pending .work-single > .work-navigation:not(.lf-motion-item),
html.lf-motion-pending .journal-entry .entry-lead:not(.lf-motion-item),
html.lf-motion-pending .journal-entry .entry-main > .journal-meta:not(.lf-motion-item),
html.lf-motion-pending .journal-entry .entry-main > .entry-title:not(.lf-motion-item),
html.lf-motion-pending .journal-entry .entry-main > .journal-post-summary:not(.lf-motion-item),
html.lf-motion-pending .archive-wrap > .page-header:not(.lf-motion-item),
html.lf-motion-pending .archive-wrap > .journal-entry > .entry-date:not(.lf-motion-item),
html.lf-motion-pending .fallback-entry > .entry-header:not(.lf-motion-item),
html.lf-motion-pending .fallback-entry > .entry-content:not(.lf-motion-item),
html.lf-motion-pending .editorial-layout > .editorial-heading:not(.lf-motion-item),
html.lf-motion-pending .editorial-layout > .editorial-text:not(.lf-motion-item),
html.lf-motion-pending .editorial-layout > .editorial-hero:not(.lf-motion-item),
html.lf-motion-pending .exhibition-layout > .exhibition-text:not(.lf-motion-item),
html.lf-motion-pending .exhibition-layout > .exhibition-hero:not(.lf-motion-item),
html.lf-motion-pending .exhibition-left > .exhibition-heading:not(.lf-motion-item),
html.lf-motion-pending .exhibition-events > .exhibition-event:not(.lf-motion-item),
html.lf-motion-pending .exhibition-events > .exhibition-event-credit:not(.lf-motion-item),
html.lf-motion-pending .post-single > .post-header:not(.lf-motion-item),
html.lf-motion-pending .post-single > .post-content > .post-featured-image:not(.lf-motion-item),
html.lf-motion-pending .post-single > .post-content > *:not(.post-featured-image):not(.lf-motion-item),
html.lf-motion-pending .post-single > .post-pagination:not(.lf-motion-item),
html.lf-motion-pending .exhibition-single > .post-pagination:not(.lf-motion-item),
html.lf-motion-pending .editorial-single > .post-pagination:not(.lf-motion-item),
html.lf-motion-pending .page-wrap > .page-header:not(.lf-motion-item),
html.lf-motion-pending .page-wrap > .page-content:not(.vita-content):not(.info-layout) > *:not(.lf-motion-item),
html.lf-motion-pending .page-wrap > p:not(.lf-motion-item),
html.lf-motion-pending .info-layout > .info-intro > *:not(.lf-motion-item),
html.lf-motion-pending .info-layout > .info-image:not(.lf-motion-item),
html.lf-motion-pending .info-layout > .info-contact-block > .info-contact-items > .info-item:not(.lf-motion-item),
html.lf-motion-pending .vita-content > .vita-intro > .vita-row:not(.lf-motion-item),
html.lf-motion-pending .vita-content > .vita-section > .lf-managed-section-heading:not(.lf-motion-item),
html.lf-motion-pending .vita-content > .vita-section > .vita-row:not(.lf-motion-item),
html.lf-motion-pending .site-footer:not(.lf-motion-item) {
  opacity:0;
  transform:translate3d(0,var(--lf-motion-distance),0);
}

/* Scroll reveals. JS adds .lf-motion-item before observing each target. */
.lf-motion-enabled .lf-motion-item {
  opacity:0;
  transform:translate3d(0,var(--lf-motion-distance),0);
  transition:opacity var(--lf-motion-duration) var(--lf-motion-ease),
             transform var(--lf-motion-duration) var(--lf-motion-ease);
  transition-delay:var(--lf-motion-delay,0ms);
}
.lf-motion-enabled .lf-motion-item.lf-reveal-visible {
  opacity:1;
  transform:none;
}
.lf-motion-enabled .lf-motion-item.lf-motion-active {
  will-change:opacity,transform;
}

/* Footer uses exactly the same motion as all other reveal targets. */
.lf-motion-enabled .site-footer.lf-motion-item {
  opacity:0;
  transform:translate3d(0,var(--lf-motion-distance),0);
  transition:opacity var(--lf-motion-duration) var(--lf-motion-ease),
             transform var(--lf-motion-duration) var(--lf-motion-ease);
}
.lf-motion-enabled .site-footer.lf-motion-item.lf-reveal-visible {
  opacity:1;
  transform:none;
}

/* Lightbox: one buffered image slides/fades against the other; no src swapping
   on the visible image during an animation. */
.lf-lightbox {
  opacity:0;
  transition:opacity 620ms var(--lf-motion-ease);
}
.lf-lightbox.is-open { opacity:1; }
.lf-lightbox.is-closing { opacity:0; }
.lf-lightbox-stage { overflow:hidden; }
.lf-lightbox-stage .lf-lightbox-image {
  transition:opacity 820ms var(--lf-motion-ease), transform 820ms var(--lf-motion-ease);
}
.lf-lightbox-stage .lf-lightbox-image.lf-motion-active {
  will-change:opacity,transform;
}
.lf-lightbox-stage .lf-lightbox-image-current {
  position:relative;
  z-index:2;
  opacity:1;
  transform:translate3d(0,0,0);
}
.lf-lightbox-stage .lf-lightbox-image-next {
  position:absolute;
  inset:0;
  z-index:1;
  width:100%;
  height:100%;
  opacity:0;
  transform:translate3d(clamp(48px,6vw,92px),0,0);
  object-fit:contain;
  object-position:center;
  pointer-events:none;
}
.lf-lightbox-stage.is-sliding-next .lf-lightbox-image-current,
.lf-lightbox-stage.is-sliding-prev .lf-lightbox-image-current { opacity:0; }
.lf-lightbox-stage.is-sliding-next .lf-lightbox-image-current { transform:translate3d(clamp(-92px,-6vw,-48px),0,0); }
.lf-lightbox-stage.is-sliding-next .lf-lightbox-image-next { opacity:1; transform:translate3d(0,0,0); }
.lf-lightbox-stage.is-sliding-prev .lf-lightbox-image-current { transform:translate3d(clamp(48px,6vw,92px),0,0); }
.lf-lightbox-stage.is-sliding-prev .lf-lightbox-image-next { opacity:1; transform:translate3d(0,0,0); }
.lf-lightbox-caption { transition:opacity 420ms var(--lf-motion-ease), transform 420ms var(--lf-motion-ease); }
.lf-lightbox-caption.is-changing { opacity:0; transform:translate3d(0,4px,0); }

/* Scroll-reactive header. will-change is enabled only while the header is moving. */
.site-header {
  position:sticky;
  top:0;
  z-index:2000;
  background:#fff;
  transition:transform 620ms var(--lf-motion-ease);
}
.site-header.lf-header-moving { will-change:transform; }
html.lf-header-hidden .site-header {
  transform:translate3d(0,-105%,0);
}
html.lf-menu-open .site-header {
  transform:translate3d(0,0,0) !important;
}

@media (prefers-reduced-motion:reduce) {
  ::view-transition-group(root),
  ::view-transition-old(root),
  ::view-transition-new(root) { animation:none !important; }
  html.lf-page-arriving body,
  html.lf-page-arrived body,
  html.lf-page-leaving body { opacity:1 !important; transition:none !important; }
  .lf-motion-enabled .lf-motion-item,
  .lf-motion-enabled .lf-motion-item.lf-reveal-visible,
  .lf-motion-enabled .site-footer.lf-motion-item,
  .lf-motion-enabled .site-footer.lf-motion-item.lf-reveal-visible {
    opacity:1 !important;
    transform:none !important;
    transition:none !important;
  }
  .site-header,
  .lf-lightbox,
  .lf-lightbox-stage .lf-lightbox-image,
  .lf-lightbox-caption { transition:none !important; }
}