/* PKC before/after reveal. Markup from the [pkc_reveal] shortcode (functions.php). */
.pkc-reveal { margin: 0; --pos: 50%; --before-pos: 50% 50%; --after-pos: 50% 50%; --before-scale: 1; --after-scale: 1; }
.pkc-reveal__frame {
  position: relative; aspect-ratio: 3 / 2; overflow: hidden; background: #2b2621;
  user-select: none; -webkit-user-select: none; touch-action: pan-y; cursor: ew-resize;
}
.pkc-reveal__frame img {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block;
  pointer-events: none; -webkit-user-drag: none;
}
.pkc-reveal__after  { object-position: var(--after-pos);  transform: scale(var(--after-scale));  transform-origin: var(--after-pos); }
.pkc-reveal__before { object-position: var(--before-pos); transform: scale(var(--before-scale)); transform-origin: var(--before-pos); clip-path: inset(0 calc(100% - var(--pos)) 0 0); }
.pkc-reveal__divider {
  position: absolute; top: 0; bottom: 0; left: var(--pos); width: 2px; margin-left: -1px;
  background: rgba(250,248,244,.95); box-shadow: 0 0 0 1px rgba(20,16,12,.18), 0 0 18px rgba(0,0,0,.35);
  pointer-events: none;
}
.pkc-reveal__handle {
  position: absolute; top: 50%; left: var(--pos); width: 46px; height: 46px; margin: -23px 0 0 -23px;
  border-radius: 50%; border: 0; padding: 0; cursor: ew-resize;
  background: #faf8f4; color: #1f1c17; box-shadow: 0 2px 10px rgba(0,0,0,.35), 0 0 0 1px rgba(20,16,12,.15);
  display: grid; place-items: center;
}
.pkc-reveal__handle::before { content: ""; width: 10px; height: 10px; border-left: 2px solid currentColor; border-right: 2px solid currentColor; }
.pkc-reveal__handle:focus-visible { outline: 3px solid #9c734e; outline-offset: 3px; }
.pkc-reveal__tag {
  position: absolute; bottom: 14px; font-family: "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  font-size: 11px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase;
  padding: 6px 10px; border-radius: 999px; pointer-events: none; transition: opacity .2s;
}
.pkc-reveal__tag--before { left: 14px; background: rgba(250,248,244,.92); color: #1f1c17; }
.pkc-reveal__tag--after  { right: 14px; background: rgba(31,28,23,.72); color: #faf8f4; }
.pkc-reveal.is-min .pkc-reveal__tag--before, .pkc-reveal.is-max .pkc-reveal__tag--after { opacity: 0; }
.pkc-reveal__caption {
  font-family: "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  font-size: 13px; color: #8b8477; padding: 10px 2px 0; display: flex; flex-wrap: wrap; gap: 6px 18px;
}
.pkc-reveal__caption b { color: #5b554b; font-weight: 600; }
.pkc-reveal.is-animating .pkc-reveal__before, .pkc-reveal.is-animating .pkc-reveal__divider, .pkc-reveal.is-animating .pkc-reveal__handle { transition: clip-path 1.1s cubic-bezier(.2,.7,.2,1), left 1.1s cubic-bezier(.2,.7,.2,1); }
@media (prefers-reduced-motion: reduce) { .pkc-reveal.is-animating * { transition: none !important; } }
@media (max-width: 640px) { .pkc-reveal__frame { aspect-ratio: 4 / 3; } .pkc-reveal__handle { width: 40px; height: 40px; margin: -20px 0 0 -20px; } }