/* VERSION 44 — essay viewer layout and final visual-system cleanup.
   Desktop uses a vertical right rail; tablet and mobile use a horizontal strip below. */
body.portfolio-review-v50 {
  --portfolio-ink: #1A1A1A;
  --portfolio-panel: #20211F;
  --portfolio-rule: rgba(245,245,245,.10);
  --portfolio-copper: #C4A484;
}

/* Wider screens: photograph on the left, navigable sequence rail on the right. */
@media (min-width: 1000px) {
  body.portfolio-review-v50 .essay-viewer-layout {
    grid-template-columns: minmax(0,1fr) 118px !important;
    gap: clamp(1rem,1.8vw,1.6rem) !important;
    align-items: start !important;
    max-width: 1600px !important;
  }
  body.portfolio-review-v50 .essay-viewer-main {
    grid-column: 1 !important;
    grid-row: 1 / span 2 !important;
    min-width: 0 !important;
  }
  body.portfolio-review-v50 .essay-viewer-rail {
    grid-column: 2 !important;
    grid-row: 1 / span 2 !important;
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    max-height: min(70svh, 840px) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    gap: .6rem !important;
    padding: .15rem .2rem .35rem !important;
    align-self: start !important;
    border: 0 !important;
    border-left: 1px solid transparent !important;
  }
  body.portfolio-review-v50 .essay-viewer-thumb {
    flex: 0 0 auto !important;
    width: 100% !important;
    aspect-ratio: 1.35 / 1 !important;
  }
  body.portfolio-review-v50 .essay-viewer-thumb.is-active {
    border-color: var(--portfolio-copper) !important;
    box-shadow: 0 0 0 1px rgba(196,164,132,.18) !important;
    transform: translateX(1px) !important;
  }
}

/* Tablet and mobile: full image first, scrollable thumbnail strip below. */
@media (max-width: 999px) {
  body.portfolio-review-v50 .essay-viewer-layout {
    grid-template-columns: minmax(0,1fr) !important;
    gap: .9rem !important;
  }
  body.portfolio-review-v50 .essay-viewer-main,
  body.portfolio-review-v50 .essay-viewer-rail {
    grid-column: 1 !important;
  }
  body.portfolio-review-v50 .essay-viewer-main {
    grid-row: 1 !important;
  }
  body.portfolio-review-v50 .essay-viewer-rail {
    grid-row: 2 !important;
    display: flex !important;
    flex-direction: row !important;
    width: 100% !important;
    max-height: none !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    gap: .55rem !important;
    padding: .2rem .1rem .5rem !important;
    margin-top: .1rem !important;
    border: 0 !important;
    scrollbar-width: thin;
    overscroll-behavior-x: contain;
  }
  body.portfolio-review-v50 .essay-viewer-thumb {
    flex: 0 0 82px !important;
    width: 82px !important;
    aspect-ratio: 1.18 / 1 !important;
  }
  body.portfolio-review-v50 .essay-viewer-thumb.is-active {
    border-color: var(--portfolio-copper) !important;
    box-shadow: 0 0 0 1px rgba(196,164,132,.18) !important;
    transform: translateY(-1px) !important;
  }
}
@media (max-width: 640px) {
  body.portfolio-review-v50 .essay-viewer-photo {
    height: min(62svh, 680px) !important;
    min-height: 250px !important;
  }
  body.portfolio-review-v50 .essay-viewer-thumb {
    flex-basis: 76px !important;
    width: 76px !important;
  }
}
@media (prefers-reduced-motion: reduce) {
  body.portfolio-review-v50 .essay-viewer-thumb,
  body.portfolio-review-v50 .essay-viewer-thumb.is-active {
    transition: none !important;
    transform: none !important;
  }
}


/* VERSION 45 — slightly slower, more considered homepage print reveal. */
body.portfolio-review-v50 .home-prints-lane .home-print-card[data-reveal="print"].is-reveal-ready {
  transition-duration: .78s !important;
  transition-timing-function: cubic-bezier(.2,.65,.25,1) !important;
  transition-delay: calc(var(--reveal-order, 0) * 95ms) !important;
}
@media (prefers-reduced-motion: reduce) {
  body.portfolio-review-v50 .home-prints-lane .home-print-card[data-reveal="print"].is-reveal-ready,
  body.portfolio-review-v50 .home-prints-lane .home-print-card[data-reveal="print"].is-reveal-ready.is-visible {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}


/* VERSION 46 — refined Photo Essays index reveal.
   The six story rows use the same IntersectionObserver pipeline as the current
   portfolio reveals, with a short rise, soft fade and a calm, deterministic stagger. */
body.portfolio-review-v50 .photo-essays-index .essay-index-row[data-reveal="essay-index"].is-reveal-ready {
  opacity: 0 !important;
  transform: translate3d(0, 14px, 0) !important;
  transition: opacity .72s ease, transform .78s cubic-bezier(.2,.65,.25,1) !important;
  transition-delay: calc(var(--reveal-order, 0) * 85ms) !important;
  will-change: opacity, transform;
}
body.portfolio-review-v50 .photo-essays-index .essay-index-row[data-reveal="essay-index"].is-reveal-ready.is-visible {
  opacity: 1 !important;
  transform: translate3d(0,0,0) !important;
}
body.portfolio-review-v50 .photo-essays-index .essay-index-row[data-reveal="essay-index"].is-reveal-ready .essay-image img {
  transition: transform 1.05s cubic-bezier(.2,.65,.25,1) !important;
}
body.portfolio-review-v50 .photo-essays-index .essay-index-row[data-reveal="essay-index"].is-reveal-ready:not(.is-visible) .essay-image img {
  transform: scale(1.012) !important;
}
body.portfolio-review-v50 .photo-essays-index .essay-index-row[data-reveal="essay-index"].is-reveal-ready.is-visible .essay-image img {
  transform: scale(1) !important;
}
@media (prefers-reduced-motion: reduce) {
  body.portfolio-review-v50 .photo-essays-index .essay-index-row[data-reveal="essay-index"].is-reveal-ready,
  body.portfolio-review-v50 .photo-essays-index .essay-index-row[data-reveal="essay-index"].is-reveal-ready.is-visible {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
    will-change: auto !important;
  }
  body.portfolio-review-v50 .photo-essays-index .essay-index-row[data-reveal="essay-index"].is-reveal-ready .essay-image img {
    transition: none !important;
    transform: none !important;
  }
}


/* VERSION 47 — reveal coverage across all six essay detail pages.
   Each story reveals its viewer, narrative and closing area as they enter view.
   The selected frame receives a brief, understated dissolve when the reader changes images. */
body.portfolio-review-v50 [data-reveal="story-viewer"].is-reveal-ready,
body.portfolio-review-v50 [data-reveal="story-narrative"].is-reveal-ready,
body.portfolio-review-v50 [data-reveal="story-end"].is-reveal-ready {
  opacity: 0 !important;
  transform: translate3d(0, 12px, 0) !important;
  transition: opacity .7s ease, transform .76s cubic-bezier(.2,.65,.25,1) !important;
  transition-delay: calc(var(--reveal-order, 0) * 75ms) !important;
}
body.portfolio-review-v50 [data-reveal="story-viewer"].is-reveal-ready.is-visible,
body.portfolio-review-v50 [data-reveal="story-narrative"].is-reveal-ready.is-visible,
body.portfolio-review-v50 [data-reveal="story-end"].is-reveal-ready.is-visible {
  opacity: 1 !important;
  transform: translate3d(0,0,0) !important;
}
@keyframes v47EssayFrameArrive {
  from { opacity: .72; transform: scale(1.008); }
  to { opacity: 1; transform: scale(1); }
}
body.portfolio-review-v50 .essay-slide.is-active .essay-viewer-photo img {
  animation: v47EssayFrameArrive .58s cubic-bezier(.2,.65,.25,1) both;
}
@media (prefers-reduced-motion: reduce) {
  body.portfolio-review-v50 [data-reveal="story-viewer"].is-reveal-ready,
  body.portfolio-review-v50 [data-reveal="story-narrative"].is-reveal-ready,
  body.portfolio-review-v50 [data-reveal="story-end"].is-reveal-ready,
  body.portfolio-review-v50 [data-reveal="story-viewer"].is-reveal-ready.is-visible,
  body.portfolio-review-v50 [data-reveal="story-narrative"].is-reveal-ready.is-visible,
  body.portfolio-review-v50 [data-reveal="story-end"].is-reveal-ready.is-visible {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
  body.portfolio-review-v50 .essay-slide.is-active .essay-viewer-photo img {
    animation: none !important;
  }
}


/* VERSION 49 — canonical page class; legacy cascade order preserved. */
