/* Three photographic worlds. Fixed image canvases open via transforms and clips. */
.works{padding-bottom:75px}.works-intro{margin-bottom:62px}.portfolio-panels{position:relative;display:flex;height:clamp(500px,76svh,900px);overflow:clip;background:var(--ink);color:var(--paper)}
.portfolio-panel{position:relative;flex:1;min-width:0;height:100%;overflow:hidden;isolation:isolate}.panel-image{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;object-position:50% center}.panel-portrait .panel-image{object-position:72% center}.panel-motion .panel-image{object-position:48% center}.panel-shade{position:absolute;inset:0;background:linear-gradient(180deg,#08110ed9 0%,#08110e35 24%,transparent 48%,#08110ec9 100%);pointer-events:none}.portfolio-panel .panel-title{position:absolute;z-index:4;top:30px;left:28px;right:20px;font-size:clamp(28px,3.4vw,60px);line-height:.95;pointer-events:none}.panel-select{display:none;position:absolute;inset:0;width:100%;padding:0;border:0;background:none;z-index:2}.panel-select:active{transform:none}.panel-select:focus-visible{outline:2px solid var(--paper);outline-offset:-7px}.panel-content{position:absolute;bottom:32px;left:28px;right:28px;z-index:3}.panel-story{font:600 clamp(36px,4.2vw,74px)/.98 Barlow,Arial,sans-serif;margin:0 0 12px;letter-spacing:-.02em}.panel-description{font-size:14px;margin:0 0 24px;color:var(--paper)}.panel-open{display:inline-flex;align-items:center;justify-content:space-between;gap:25px;width:auto;min-height:44px;padding:8px 0;background:none;border:0;border-bottom:1px solid var(--paper);border-radius:0;font-size:13px;overflow:visible}.panel-open svg{width:19px;height:19px}.panel-open:focus-visible{outline-offset:6px}
.panels-enhanced .portfolio-panel{position:absolute;left:0;top:0;width:62%;clip-path:inset(0% 69.35484% 0% 0%);transition:transform 650ms var(--ease-out),clip-path 650ms var(--ease-out)}
.panels-enhanced .panel-select{display:block}.panels-enhanced .panel-image{transform:translateX(-34.67742%) scale(1.025);transition:transform 650ms var(--ease-out)}.panels-enhanced .portfolio-panel.is-active{clip-path:inset(0%)}.panels-enhanced .panel-portrait:not(.is-active) .panel-image{transform:translateX(-49%) scale(1.025)}.panels-enhanced .panel-motion:not(.is-active) .panel-image{transform:translateX(-22%) scale(1.025)}.panels-enhanced .is-active .panel-image{transform:translateX(0%) scale(1)}
.panels-enhanced .portfolio-panel:nth-child(1){transform:translateX(0%)}.panels-enhanced .portfolio-panel:nth-child(2){transform:translateX(30.64516%)}.panels-enhanced .portfolio-panel:nth-child(3){transform:translateX(61.29032%)}
.panels-enhanced[data-active="0"] .portfolio-panel:nth-child(2){transform:translateX(100%)}.panels-enhanced[data-active="0"] .portfolio-panel:nth-child(3),.panels-enhanced[data-active="1"] .portfolio-panel:nth-child(3){transform:translateX(130.64516%)}
.panels-enhanced .panel-content{opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity 180ms ease,transform 350ms var(--ease-out),visibility 180ms}.panels-enhanced .is-active .panel-content{opacity:1;visibility:visible;transform:none;transition:opacity 300ms ease 100ms,transform 450ms var(--ease-out) 100ms,visibility 0ms}
.portfolio-footer{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:26px}.portfolio-navigation{display:flex;align-items:center;gap:18px}.portfolio-navigation button{display:grid;place-items:center;width:44px;height:44px;min-width:44px;padding:0;background:none;border:1px solid var(--line);border-radius:50%}.portfolio-navigation button:disabled{opacity:.3}.portfolio-navigation button:focus-visible{outline-color:var(--ink)}.portfolio-navigation p{display:flex;align-items:center;gap:18px;min-width:150px;margin:0;font-size:12px;font-variant-numeric:tabular-nums}.portfolio-navigation p span{font-size:13px}.portfolio-footer .portfolio-link{margin:0;font-size:13px;gap:20px}.portfolio-footer .portfolio-link:focus-visible{outline-color:var(--ink)}
@media(hover:hover) and (pointer:fine){.portfolio-navigation button:not(:disabled):hover{background:var(--ink);color:var(--paper)}.panel-open:hover{color:var(--sand);border-color:var(--sand)}}
@media(max-width:900px) and (min-width:701px){.portfolio-panel .panel-title{left:18px;top:24px;font-size:28px}.panel-content{left:22px;right:22px}.portfolio-navigation{gap:10px}.portfolio-footer{gap:16px}.portfolio-navigation p{min-width:128px;gap:10px}}
@media(max-width:700px){.works{padding-bottom:55px}.works-intro{margin-bottom:38px}.portfolio-panels{height:clamp(390px,61svh,580px);margin-right:calc(-1 * var(--gutter));overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:thin;scrollbar-color:var(--sand) var(--ink);gap:12px;padding-right:var(--gutter);background:transparent;overscroll-behavior-x:contain}.portfolio-panel,.panels-enhanced .portfolio-panel{position:relative;flex:0 0 84%;width:84%;height:100%;clip-path:none!important;transform:none!important;scroll-snap-align:start;transition:none;background:var(--ink)}.panels-enhanced .panel-select{display:none}.portfolio-panel .panel-title{top:24px;left:20px;font-size:32px}.panel-content,.panels-enhanced .panel-content{bottom:26px;left:20px;right:20px;opacity:1;visibility:visible;transform:none;transition:none}.panel-story{font-size:40px}.panel-description{font-size:13px;margin-bottom:18px}.panel-image,.panels-enhanced .panel-image{transform:none!important;transition:none}.panel-land .panel-image{object-position:40% center}.panel-portrait .panel-image{object-position:72% center}.panel-motion .panel-image{object-position:48% center}.portfolio-footer{display:block;margin-top:22px}.portfolio-navigation{justify-content:space-between;gap:12px}.portfolio-navigation p{justify-content:center;min-width:0;gap:16px}.portfolio-footer .portfolio-link{margin-top:28px}.portfolio-navigation button{width:46px;height:46px}.panel-open{font-size:12px}}
.gentle .portfolio-panel,.gentle .panel-image,.gentle .panel-content{transition:none!important}.gentle .works-intro h2 span{transform:none!important}
@media(prefers-reduced-motion:reduce){.portfolio-panel,.panel-image,.panel-content{transition:none!important}}