/* One quiet portfolio: immersive cover, proportional photographs and restrained controls. */
#routeWorkDialog{height:100dvh;overflow:hidden;isolation:isolate}
#routeWorkDialog[open]{animation:none}
#routeWorkDialog>.route-top{position:absolute;inset:0 var(--expedition-scrollbar-width,0px) auto 0;z-index:20;isolation:isolate;background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}
#routeWorkDialog>.route-top:before{content:"";position:absolute;inset:0 0 -64px;z-index:-1;pointer-events:none;background:linear-gradient(180deg,rgba(0,0,0,.84),rgba(0,0,0,.5) 48%,rgba(0,0,0,.12) 78%,transparent)}
#routeWorkDialog.route-menu-open>.route-top{z-index:60}
.portfolio-scroll{height:100%;overflow:auto;overscroll-behavior:none;scrollbar-color:#484848 #000;scroll-padding-top:calc(var(--brand-bar-height) + 24px)}
#routeWorkDialog .work{padding:0;min-height:100%}
.portfolio-hero{position:relative;isolation:isolate;height:clamp(520px,82svh,880px);background:#090d0c;overflow:hidden}
.portfolio-hero-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 52%;z-index:-2;transform:none}
.portfolio-hero:after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,rgba(0,0,0,.12),rgba(0,0,0,.08) 35%,rgba(0,0,0,.46) 76%,#000)}
.portfolio-hero-copy{position:absolute;left:var(--header-gutter);right:var(--header-gutter);bottom:clamp(54px,8svh,95px);max-width:900px}
.portfolio-hero h2{font:600 clamp(52px,6.2vw,90px)/1.15 var(--serif);letter-spacing:.015em;margin:0;text-wrap:balance;color:var(--text)}
html[lang="en"] .portfolio-hero h2{font-family:var(--nav);font-size:clamp(48px,5.7vw,82px);font-weight:500;letter-spacing:-.035em;line-height:1.08;max-width:780px}
.work.is-commercial .portfolio-hero{height:clamp(320px,52svh,520px)}
.work.is-commercial .portfolio-hero-photo{display:none}
.work.is-commercial .portfolio-hero:after{background:radial-gradient(ellipse at 80% 30%,rgba(70,86,76,.14),transparent 70%),linear-gradient(180deg,transparent,#000)}
.work.is-commercial .portfolio-hero-copy{bottom:78px}
.portfolio-gallery{padding:52px var(--header-gutter) 58px;scroll-margin-top:calc(var(--brand-bar-height) + 18px)}
.portfolio-gallery:focus{outline:0}
.portfolio-gallery h3{font:600 28px/1.4 var(--serif);margin:0;letter-spacing:.01em}
html[lang="en"] .portfolio-gallery h3{font-family:var(--nav);font-weight:500;letter-spacing:-.02em}
.portfolio-categories{display:flex;gap:28px;align-items:center;padding:0 0 19px;border-bottom:1px solid var(--line);margin-bottom:22px}
.portfolio-categories a{font:500 14px/1.7 var(--sans);color:var(--muted);padding:7px 0;position:relative}
.portfolio-categories a[aria-current="page"]{color:var(--text)}
.portfolio-categories a[aria-current="page"]:after{content:"";position:absolute;left:0;right:0;bottom:-20px;height:1px;background:#dac8a2}
#routeWorkDialog .work-toolbar{display:flex;justify-content:space-between;align-items:center;gap:22px;flex-wrap:wrap;margin:0 0 28px;padding:0;border:0}
#routeWorkDialog .country-filters{display:flex;gap:18px;flex-wrap:wrap;overflow:visible;padding:0;margin:0}
#routeWorkDialog .country-filters button{font:400 12px/1.8 var(--sans);min-height:36px;white-space:nowrap;padding:6px 0;color:var(--muted);border:0}
#routeWorkDialog .country-filters button.active{color:#dac8a2}
#routeWorkDialog .gallery-controls{display:flex;gap:16px;align-items:center}
#routeWorkDialog .work-toolbar[hidden],#routeWorkDialog .gallery-controls>[hidden]{display:none}
#routeWorkDialog .orientation-filter{font-size:11px;margin:0;gap:8px;color:var(--muted)}
#routeWorkDialog .orientation-filter select{font-size:12px;color:#d9dcd7;min-height:36px;background:#000;border:0;padding:5px 2px}
.composition-control{display:flex;align-items:center;gap:13px}
.composition-label{font:400 11px/1.5 var(--sans);color:var(--muted);white-space:nowrap}
.composition-options{display:flex;align-items:stretch;gap:3px;padding:3px;border:1px solid #292c29;border-radius:7px;background:#0d0f0e}
.composition-options button{display:flex;align-items:center;justify-content:center;gap:7px;min-height:40px;padding:8px 13px;border:1px solid transparent;border-radius:4px;font:400 12px/1.5 var(--sans);white-space:nowrap;color:#999e98;background:transparent;touch-action:manipulation;transition:background 180ms,color 180ms,border-color 180ms}
.composition-options button svg{width:17px;height:17px;flex:none;fill:none;stroke:currentColor;stroke-width:1.1}
.composition-options button[aria-pressed="true"]{color:#e9deca;background:#22251f;border-color:#4b4b3e}
.composition-options button:focus-visible{outline:1px solid #dac8a2;outline-offset:3px}
@media(hover:hover){.composition-options button[aria-pressed="false"]:hover{color:#f2f2ef;background:#191c19}}
#workGrid{display:flex;flex-direction:column;gap:10px;width:100%;margin:0}
.portfolio-row{display:flex;gap:10px;width:100%;align-items:flex-start}
.portfolio-photo{position:relative;display:block;flex:none;min-width:0;margin:0;padding:0;overflow:hidden;background:#0e1110;text-align:left}
.portfolio-photo img{display:block;width:100%;height:100%;object-fit:contain;transform:none;transition:opacity 240ms}
.portfolio-photo:hover img{opacity:.83}
.portfolio-photo:focus-visible{outline:1px solid #dac8a2;outline-offset:3px;z-index:1}
.portfolio-photo-index{position:absolute;left:12px;top:10px;font:400 10px/1.5 var(--sans);color:#fff;opacity:.72;letter-spacing:.08em;text-shadow:0 1px 6px #000}
.portfolio-photo-caption{position:absolute;left:0;right:0;bottom:0;padding:28px 14px 14px;background:linear-gradient(transparent,rgba(0,0,0,.72));opacity:0;transition:opacity 240ms;pointer-events:none}
.portfolio-photo:hover .portfolio-photo-caption,.portfolio-photo:focus-visible .portfolio-photo-caption{opacity:1}
.portfolio-photo-caption>span{display:block;font:400 12px/1.6 var(--sans);color:#f2f2ef}
.portfolio-photo-caption>small{display:block;font:400 9px/1.6 var(--sans);letter-spacing:.08em;color:#c5ccc6;margin-top:3px}
.portfolio-empty{padding:64px 16px 78px;text-align:center;border:0;background:none}
.portfolio-empty h3{font:500 24px/1.55 var(--serif);margin:0}
.portfolio-empty p{font:400 13px/1.9 var(--sans);color:var(--muted);margin:12px 0 0}
.portfolio-related{display:flex;justify-content:flex-end;gap:25px;flex-wrap:wrap;margin-top:38px;padding-top:22px;border-top:1px solid var(--line)}
.portfolio-related a{font:400 12px/1.8 var(--sans);color:var(--muted);padding:6px 0}
.portfolio-related a:hover,.portfolio-related a:focus-visible{color:var(--text)}
@media(max-width:800px){
 .portfolio-hero{height:76svh;min-height:460px;max-height:720px}
 .portfolio-hero-photo{object-position:58% 50%}
 .portfolio-hero-copy{bottom:64px}
 .portfolio-hero h2{font-size:clamp(42px,12vw,58px);line-height:1.2}
 html[lang="en"] .portfolio-hero h2{font-size:clamp(40px,11vw,56px);max-width:360px}
 .portfolio-gallery{padding:30px var(--header-gutter) 38px}
 .portfolio-gallery h3{font-size:24px}
 .portfolio-categories{gap:22px;padding-bottom:13px;margin-bottom:14px}
 .portfolio-categories a{font-size:13px}
 .portfolio-categories a[aria-current="page"]:after{bottom:-14px}
 #routeWorkDialog .work-toolbar{gap:9px;margin-bottom:19px}
 #routeWorkDialog .country-filters{gap:16px}
 #routeWorkDialog .country-filters button{font-size:11px}
 #routeWorkDialog .gallery-controls{margin-left:0;gap:12px;width:100%}
 .composition-control{width:100%}
 .composition-label{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
 .composition-options{display:grid;grid-template-columns:.8fr 1.2fr 1.1fr;width:100%}
 .composition-options button{min-width:0;min-height:44px;font-size:11px;padding:7px 8px;gap:6px}
 .composition-options button svg{width:16px;height:16px}
 #routeWorkDialog .orientation-filter{font-size:10px}
 #routeWorkDialog .orientation-filter select{font-size:11px}
 #workGrid,.portfolio-row{gap:7px}
 .portfolio-photo-index{left:7px;top:6px;font-size:8px}
 .portfolio-photo-caption{padding:20px 9px 9px}
 .portfolio-photo-caption>span{font-size:10px}
 .portfolio-photo-caption>small{font-size:8px}
 .portfolio-related{gap:22px;margin-top:27px;padding-top:17px}
 .portfolio-related a{font-size:11px}
 .portfolio-empty{padding:45px 0 58px}
 .portfolio-empty h3{font-size:21px}
 .work.is-commercial .portfolio-hero{height:365px;min-height:0}
}
@media(prefers-reduced-motion:reduce){.portfolio-photo img,.portfolio-photo-caption,.composition-options button{transition:none}}
