:root.photo-mode { background:#090909; scrollbar-color:#777 #090909; }
.photo-mode .site-header { color:#fff; }
.photo-entering .site-header { opacity:0; }
.index-page.has-photography { padding-bottom:0; }
.photography-section { position:relative; z-index:5; height:100svh; margin:170px calc(-1 * var(--edge)) 0; background:var(--paper);  }
.photography-section.is-empty { height:auto; margin:0; }
.photo-stage { position:relative; height:100svh; overflow:clip; isolation:isolate; }
.photo-stage .site-footer { position:absolute; z-index:2; bottom:var(--edge); left:var(--edge); right:var(--edge); margin:0; padding:0; gap:clamp(25px,4vw,60px); background:transparent; }
.photo-wheel { position:absolute; z-index:1; inset:0; }
.photo-slot { position:absolute; top:var(--deck-top,110px); left:50%; width:clamp(255px,26vw,360px); height:clamp(340px,37vw,450px); transform-origin:50% 0; will-change:transform; pointer-events:none; }
.photo-card,.photo-transition-card { width:100%; height:100%; padding:22px; background:#dededb; color:#111110; text-align:left; }
.photo-card { position:absolute; z-index:1; inset:0; cursor:crosshair; }
.photo-card-preview { position:absolute; z-index:0; top:0; left:0; width:100%; height:100%; max-width:none; object-fit:cover; pointer-events:none; transform:translate3d(0,0,0); transition:transform .6s cubic-bezier(.22,1,.36,1); }
.photo-slot.is-hovered .photo-card-preview { transform:translate3d(var(--preview-x,0px),var(--preview-y,0px),0); }
.photo-slot.is-hovered .photo-card-preview { pointer-events:auto; cursor:crosshair; }
.photo-card-copy { position:absolute; top:24px; left:24px; right:24px; bottom:120px; overflow:hidden; font-size:clamp(36px,3.3vw,48px); letter-spacing:-.035em; line-height:1; overflow-wrap:anywhere; }
.photo-card-meta { position:absolute; bottom:24px; left:24px; right:24px; font-size:clamp(26px,2.5vw,34px); line-height:1.04; letter-spacing:-.025em; }
.photo-card-meta span { display:block; }
.photo-card:focus-visible { outline:2px solid currentColor; outline-offset:5px; }
.photo-flight { position:fixed; z-index:75; max-width:none; overflow:hidden; contain:layout paint; pointer-events:none; transform-origin:50% 50%; opacity:0; will-change:transform,clip-path; }
.photo-flight img { width:100%; height:100%; max-width:none; object-fit:cover; transform-origin:50% 50%; }
.photo-transition-card { position:fixed; z-index:96; pointer-events:none; }
.photo-flight.is-visible { opacity:1; }
.photo-flight.is-travelling { z-index:95; will-change:transform; }
.photo-curtain { position:fixed; z-index:68; inset:0; background:#090909; pointer-events:none; opacity:0;  }
.photo-curtain.is-visible { opacity:1; }
.photo-gallery-page { position:fixed; z-index:70; inset:0; overflow-y:auto; overscroll-behavior:contain; scrollbar-gutter:stable; background:#090909; color:#fff; opacity:0;  }
.photo-gallery-page.is-visible { opacity:1; }
.photo-gallery-page:focus { outline:none; }
.photo-gallery-hero { display:flex; justify-content:center; align-items:center; height:100svh; padding:115px 12vw 60px; }
.photo-gallery-hero.is-series { height:auto; padding-bottom:30px; }
.photo-gallery-hero .photo-image { width:min(60%,calc((100svh - 175px) * var(--photo-ratio) * .6)); }
.photo-image { display:block; min-width:0; text-align:left; cursor:default; }
.photo-image img { width:100%; height:auto; background:transparent; }
.photo-image:focus { outline:none; }
.photo-image:focus-visible img { outline:1px solid #fff; outline-offset:6px; }
.photo-caption { position:relative; padding-top:14px; color:#fff; font-size:clamp(18px,1.7vw,25px); line-height:1.12; letter-spacing:-.025em; overflow-wrap:anywhere; opacity:0; transform:translate3d(0,8px,0); transition:opacity .3s ease,transform .4s cubic-bezier(.22,1,.36,1); pointer-events:none; }
.photo-caption span { display:block; }
.photo-image:hover .photo-caption,.photo-image:focus-visible .photo-caption { opacity:1; transform:translate3d(0,0,0); }
.photo-gallery-body { padding:20px var(--edge) var(--edge); }
.photo-gallery-footer { margin-top:140px; padding:0; background:transparent; }
.photo-group { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:18px; align-items:start; margin:300px 0 420px; }
.photo-group.is-series { gap:14px; width:51.6%; }
.photo-group.is-series:nth-child(2n) { margin-left:auto; }
.photo-group:first-child { margin-top:130px; }
.photo-group.is-series:first-child { margin-top:0; }
.photo-group .photo-image { grid-column:span 5; width:60%; }
.photo-group.is-series .photo-image { width:100%; }
.photo-mode .work-preview { opacity:0; }
@media(max-width:700px){
  .photography-section { margin-top:100px; }
  .photo-stage .site-footer,.photo-gallery-footer { grid-template-columns:minmax(0,1fr) auto; gap:12px; }
  .photo-stage .site-footer > div:first-child,.photo-gallery-footer > div:first-child { grid-column:1 / -1; }
  .photo-stage .footer-credit,.photo-gallery-footer .footer-credit { grid-column:auto; align-self:end; }
  .photo-slot { width:clamp(236px,70vw,280px); height:min(clamp(310px,90vw,350px),calc(100svh - 265px)); }
  .photo-card,.photo-transition-card { padding:18px; }
  .photo-card-copy { left:18px; right:18px; top:18px; font-size:36px; }
  .photo-card-meta { left:18px; right:18px; bottom:18px; font-size:26px; }
  .photo-gallery-hero { padding:110px 20px 40px; }
  .photo-gallery-hero .photo-image { width:min(60%,calc((100svh - 195px) * var(--photo-ratio) * .6)); }
  .photo-group { gap:10px; margin:150px 0 225px; }
  .photo-group.is-series { gap:8px; width:60%; }
  .photo-group:first-child { margin-top:80px; }
  .photo-group.is-series:first-child { margin-top:0; }
  .photo-caption { padding-top:10px; font-size:18px; }
  .photo-gallery-body { padding:0 18px 18px; }
  .photo-gallery-footer { margin-top:100px; }
}
@media(prefers-reduced-motion:reduce){ .photo-slot { will-change:auto; } .photo-card-preview,.photo-caption,.photo-gallery-page,.photo-curtain { transition:none; } }

.photo-back { display:none; position:absolute; top:72px; left:var(--edge); height:32px; padding:0; color:inherit; }
.photo-back svg { display:block; width:100%; height:100%; overflow:visible; fill:none; stroke:currentColor; stroke-width:2.5; stroke-linecap:square; stroke-linejoin:miter; }
.photo-mode .photo-back { display:block; }
.photo-entering .photo-back { pointer-events:none; }

.photo-gallery-page { scrollbar-color:#777 #090909; isolation:isolate; transform:translateZ(0); will-change:opacity; }