/* Explicit page blocks only. Legacy project pages keep their existing layout. */
.page-block-case{overflow:visible}
.page-block-case .page-block-timeline{padding-top:18px}
.page-block-case .page-block{margin:0 0 clamp(50px,7vw,110px);padding:0;border:0;min-width:0;scroll-margin-top:calc(var(--bar,46px) + var(--public-nav-offset,88px) + 80px)}
.page-block-case .page-block-heading{display:block;margin:0 0 26px}
.page-block-case .page-block-heading h2{font-size:clamp(30px,4.1vw,64px);line-height:1.05;letter-spacing:-.045em;font-weight:450;max-width:1000px}
.page-block-case .page-block-copy{max-width:760px;margin:0 0 32px;font-size:clamp(14px,1.35vw,19px);line-height:1.65;color:#bbb;white-space:pre-wrap}
.page-block-case .page-block-copy p+p{margin-top:1em}
.page-block-case .page-block-media{display:flex;flex-direction:column;gap:50px;min-width:0}
.page-block-case .page-block .media-figure{margin:0;padding:0;min-width:0;max-width:none;grid-column:auto}
.page-block-case .page-block .media-stage{translate:none!important;scale:1!important;clip-path:none!important;transform:none!important;overflow:visible;outline:0;border:0;box-shadow:none}
.page-block-case .page-block .media-figure figcaption{translate:none!important}
.page-block-case .page-block-layout-fit-height .media-stage{display:flex;align-items:center;justify-content:center;height:auto;aspect-ratio:auto}
.page-block-case .page-block-layout-fit-height .media-stage>img,
.page-block-case .page-block-layout-fit-height .media-stage>video{width:min(100%,calc(78svh * var(--media-ratio,1.6)));height:auto;aspect-ratio:var(--media-ratio,1.6);max-height:78svh;max-width:100%;object-fit:contain;margin-inline:auto}
.page-block-case .page-block-layout-fit-height .media-figure .external-player{width:min(100%,calc(78svh * var(--media-ratio,1.77778)));max-width:100%;max-height:78svh;margin-inline:auto;aspect-ratio:var(--media-ratio,1.77778)}
.page-block-case .page-block-layout-wide .page-block-media{width:100%}
.page-block-case .page-block-layout-full-bleed{width:100vw;max-width:none;margin-inline:calc(50% - 50vw)}
.page-block-case .page-block-layout-full-bleed>.page-block-heading,
.page-block-case .page-block-layout-full-bleed>.page-block-copy,
.page-block-case .page-block-layout-full-bleed .media-figure>figcaption,
.page-block-case .page-block-layout-full-bleed .player-help{padding-inline:var(--gutter)}
.page-block-case .page-block-layout-full-bleed .media-stage{width:100%;border:0;border-radius:0}
.page-block-case .page-block-layout-full-bleed .media-stage>img,
.page-block-case .page-block-layout-full-bleed .media-stage>video{object-fit:contain;border:0;border-radius:0}
.page-block-case .page-block.page-block-layout-full-bleed .media-figure .media-stage>img,
.page-block-case .page-block.page-block-layout-full-bleed .media-figure .media-stage>video{width:100%;height:auto;max-height:none;max-width:100%;aspect-ratio:var(--media-ratio,1.6);object-fit:contain}
.page-block-case .page-block-columns{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px 28px;align-items:start}
.page-block-case .page-block-columns .media-stage>img,
.page-block-case .page-block-columns .media-stage>video{max-height:78svh;object-fit:contain}
.page-block-case .page-block-rail{display:flex;gap:26px;align-items:flex-start;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;scroll-snap-type:none;scroll-behavior:auto;scrollbar-width:thin;scrollbar-color:#777 #000;touch-action:pan-y;cursor:grab;padding:0 0 24px;min-width:0;border:0;outline:0;box-shadow:none}
.page-block-case .page-block-rail.is-dragging{cursor:grabbing;user-select:none}
.page-block-case .page-block-rail>.media-figure{flex:0 0 auto;width:min(84vw,calc(62svh * var(--media-ratio,1.6)));max-width:1150px}
.page-block-case .page-block-rail .media-stage{display:flex;align-items:center;justify-content:center;height:62svh;aspect-ratio:auto}
.page-block-case .page-block-rail .media-stage>img,
.page-block-case .page-block-rail .media-stage>video{width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;aspect-ratio:auto}
.page-block-case .page-block-rail .external-player{width:100%;aspect-ratio:var(--media-ratio,1.77778)}
.page-block-case .page-block-rail .audio-stage{height:180px;align-items:stretch;justify-content:center}
.page-block-case .page-block-rail .media-audio{min-width:310px}
.page-block-case .page-block-rail:focus-visible{outline:0;background:#111;box-shadow:none}
.page-block-case .page-block-gallery-hint{font-size:8px;letter-spacing:.025em;color:#777;margin-top:10px;display:flex;align-items:center;gap:18px}
.page-block-case .page-block-gallery-hint>span{font-size:17px;line-height:1}
.page-block-case .page-block-context>summary{display:flex;align-items:center;justify-content:space-between;gap:25px;cursor:pointer;list-style:none;font-size:15px;padding:20px 0}
.page-block-case .page-block-context>summary::-webkit-details-marker{display:none}
.page-block-case .page-block-context>summary>span{font-size:22px;transition:rotate .35s cubic-bezier(.16,1,.3,1)}
.page-block-case .page-block-context[open]>summary>span{rotate:45deg}
.page-block-case .page-block-context-body{padding-top:14px}
.page-block-case .page-block-credit{font-size:12px;line-height:1.65;color:#aaa;max-width:740px;margin:0 0 35px}
.page-block-case .page-block-navigation{display:flex;align-items:baseline;justify-content:space-between;gap:35px;border-top:1px solid #444;margin-top:70px;padding-top:30px;font-size:14px}
.page-block-case .page-block-navigation a{display:flex;flex-direction:column;gap:14px;min-height:65px}
.page-block-case .page-block-navigation a>span{font-size:9px;color:#888}
.page-block-case .page-block-navigation a:last-child{text-align:right}
.page-block-case .case-contents>div{overflow-x:auto;scrollbar-width:none;min-width:0;max-width:100%}
.page-block-case .case-contents button{flex:none}
/* R31: optional, finite overrides. Without data attributes, the original rules
   above are unchanged. Fit always preserves the complete design. */
.page-block-case [data-block-gap] .page-block-media,
.page-block-case [data-block-gap] .page-block-rail{gap:var(--r31-gap)}
.page-block-case [data-block-columns] .page-block-columns{grid-template-columns:repeat(var(--r31-columns,2),minmax(0,1fr))}
.page-block-case [data-block-fit="height"] .media-stage{display:flex;align-items:center;justify-content:center;height:auto;aspect-ratio:auto}
.page-block-case .page-block[data-block-fit="height"] .media-figure .media-stage>img,
.page-block-case .page-block[data-block-fit="height"] .media-figure .media-stage>video{width:min(100%,calc(78svh * var(--media-ratio,1.6)));height:auto;max-height:78svh;max-width:100%;object-fit:contain;margin-inline:auto;aspect-ratio:var(--media-ratio,1.6)}
.page-block-case [data-block-fit="width"] .media-stage{height:auto;aspect-ratio:auto}
.page-block-case .page-block[data-block-fit="width"] .media-figure .media-stage>img,
.page-block-case .page-block[data-block-fit="width"] .media-figure .media-stage>video{width:100%;height:auto;max-width:100%;max-height:none;aspect-ratio:var(--media-ratio,1.6);object-fit:contain}
.page-block-case [data-block-fit="width"] .page-block-rail>.media-figure{width:min(84vw,1100px)}
.page-block-case .page-block-rail[data-r31-gallery-drag="false"]{cursor:auto}
.page-block-case .page-block-gallery-controls{display:flex;justify-content:flex-end;gap:8px;margin-top:10px}
.page-block-case .page-block-gallery-controls button{width:48px;height:48px;border:0;border-radius:50%;background:#222;color:#fff;font-family:inherit;font-size:24px;line-height:1;cursor:pointer;transition:background .2s,transform .2s}
.page-block-case .page-block-gallery-controls button:hover{background:#fff;color:#000;transform:translateY(-2px)}
.page-block-case .page-block-gallery-controls button:focus-visible{outline:0;background:#fff;color:#000;box-shadow:0 0 0 4px #666}
.page-block-case .page-block-gallery-controls button:disabled{opacity:.32;cursor:default;transform:none}
@media(min-width:681px) and (max-width:1024px){.page-block-case [data-block-columns] .page-block-columns{grid-template-columns:repeat(var(--r31-medium-columns,2),minmax(0,1fr))}}
@media(max-width:680px){
 .page-block-case .page-block{margin-bottom:50px}
 .page-block-case .page-block-heading h2{font-size:32px}
 .page-block-case .page-block-copy{font-size:14px;margin-bottom:24px}
 .page-block-case .page-block-media{gap:32px}
 .page-block-case .page-block-columns{grid-template-columns:minmax(0,1fr);gap:32px}
 .page-block-case [data-block-columns] .page-block-columns{grid-template-columns:minmax(0,1fr)}
 .page-block-case .page-block[data-block-fit="height"] .media-figure .media-stage>img,.page-block-case .page-block[data-block-fit="height"] .media-figure .media-stage>video{max-height:74svh;width:min(100%,calc(74svh * var(--media-ratio,1.6)))}
 .page-block-case .page-block-layout-fit-height .media-stage>img,
 .page-block-case .page-block-layout-fit-height .media-stage>video{width:min(100%,calc(74svh * var(--media-ratio,1.6)));max-height:74svh}
 .page-block-case .page-block-layout-fit-height .media-figure .external-player{width:min(100%,calc(74svh * var(--media-ratio,1.77778)));max-height:74svh}
 .page-block-case .page-block-rail{gap:16px;padding-bottom:20px}
 .page-block-case .page-block-rail>.media-figure{width:min(87vw,calc(58svh * var(--media-ratio,1.6)))}
 .page-block-case .page-block-rail .media-stage{height:58svh}
 .page-block-case .page-block-gallery-hint{font-size:8px}
 .page-block-case .page-block-navigation{font-size:12px;gap:25px}
}
/* R32 grid placement: per-image spans from the shared layout rule (layout-options-r31.js). */
.page-block-case .page-block-columns>[data-grid-span]{grid-column:span var(--r32-span,1)}
@media(min-width:681px) and (max-width:1024px){.page-block-case .page-block-columns>[data-grid-span]{grid-column:span var(--r32-span-medium,1)}}
@media(max-width:680px){
 .page-block-case .page-block-columns>[data-grid-span]{grid-column:span var(--r32-span-mobile,1)}
 .page-block-case [data-block-mobile-columns="2"] .page-block-columns{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 12px}
}
/* R34 one picture's own fit, size and crop (layoutOptions.items). The renderer wraps the
   picture in .r34-frame. The stage is sized like the picture would be (fit width: a share of
   the column; fit height: a share of the screen height), so it hugs the picture and the play
   key stays on its corner; the frame keeps the cropped shape and shows only the cropped part
   of the picture inside it. Pictures without settings are untouched. */
.page-block-case .page-block .media-figure[data-item-fit] .media-stage{display:block;height:auto;aspect-ratio:auto;max-width:100%;margin-inline:auto}
.page-block-case .page-block .media-figure[data-item-fit="width"] .media-stage{width:calc(100% * var(--item-size,1))}
.page-block-case .page-block .media-figure[data-item-fit="height"] .media-stage{width:min(100%,calc(78svh * var(--item-size,1) * var(--media-ratio,1.6)))}
.page-block-case .page-block .media-figure[data-item-fit] .r34-frame{position:relative;display:block;overflow:hidden;width:100%;aspect-ratio:var(--media-ratio,1.6)}
.page-block-case .page-block .media-figure[data-item-fit] .r34-frame>img,
.page-block-case .page-block .media-figure[data-item-fit] .r34-frame>video{position:absolute;left:calc(-100% * var(--crop-x,0) / var(--crop-w,1));top:calc(-100% * var(--crop-y,0) / var(--crop-h,1));width:calc(100% / var(--crop-w,1));height:calc(100% / var(--crop-h,1));max-width:none;max-height:none;margin:0;object-fit:fill;aspect-ratio:auto}
.page-block-case .page-block-rail>.media-figure[data-item-fit="height"]{width:min(84vw,calc(62svh * var(--item-size,1) * var(--media-ratio,1.6)))}
.page-block-case .page-block-rail>.media-figure[data-item-fit="width"]{width:calc(min(84vw,1100px) * var(--item-size,1))}
.page-block-case .page-block .page-block-rail .media-figure[data-item-fit] .media-stage{width:100%}
@media(max-width:680px){
 .page-block-case .page-block .media-figure[data-item-fit="height"] .media-stage{width:min(100%,calc(74svh * var(--item-size,1) * var(--media-ratio,1.6)))}
 .page-block-case .page-block-rail>.media-figure[data-item-fit="height"]{width:min(87vw,calc(58svh * var(--item-size,1) * var(--media-ratio,1.6)))}
 .page-block-case .page-block-rail>.media-figure[data-item-fit="width"]{width:calc(87vw * var(--item-size,1))}
}