.portfolio-page { background:#0d1119; }
.portfolio-page a:focus-visible,.portfolio-page button:focus-visible { outline:2px solid #f5b64d; outline-offset:5px; }
.portfolio-hero { padding:64px 0 0; }
.portfolio-kicker { display:flex; align-items:center; justify-content:space-between; gap:20px; }
.portfolio-kicker .eyebrow { color:#7cb9d6; font-size:10px; margin:0; }
.edition { color:#788598; font-size:9px; }
.portfolio-intro { display:grid; grid-template-columns:1.65fr 1fr; gap:50px; align-items:end; margin:30px 0 38px; }
.portfolio-intro h1 { font-size:54px; line-height:1.12; font-weight:550; color:#f2f4f7; }
.portfolio-intro h1>span { color:#929daa; }
.portfolio-intro p { font-size:15px; max-width:315px; color:#a6b0bd; }
.portfolio-jump { display:flex; align-items:center; justify-content:space-between; padding:14px 0 2px; color:#e4c084; max-width:315px; font-size:12px; }
.portfolio-cover { display:grid; grid-template-columns:1.64fr 1fr; gap:14px; height:420px; }
.cover-main,.cover-small { position:relative; overflow:hidden; isolation:isolate; border-radius:6px; background:#172230; }
.cover-main img,.cover-small img { width:100%; height:100%; object-fit:cover; display:block; transition:transform 600ms ease; }
.cover-main:hover img,.cover-small:hover img { transform:scale(1.035); }
.cover-main::after,.cover-small::after { content:''; position:absolute; inset:40% 0 0; z-index:0; background:linear-gradient(transparent,#080b12cf); }
.cover-caption { position:absolute; left:30px; bottom:27px; z-index:1; }
.cover-caption>span,.cover-small>div>span { font-size:9px; color:#eee5d9; }
.cover-caption h2 { font-size:36px; font-weight:550; margin-top:7px; }
.cover-caption p { color:#d2d5d8; font-size:12px; margin-top:5px; }
.visit-orbit { position:absolute; right:26px; bottom:28px; width:42px; height:42px; display:grid; place-items:center; background:#f3d4a0; color:#1b232c; border-radius:50%; z-index:1; font-size:22px; }
.cover-side { display:grid; grid-template-rows:1fr 1fr; gap:14px; min-height:0; }
.cover-small>div { position:absolute; left:22px; bottom:18px; right:20px; z-index:1; }
.cover-small h2 { font-size:21px; font-weight:550; margin-top:4px; display:flex; justify-content:space-between; }
.portfolio-footnote { padding:24px 0 35px; display:flex; justify-content:space-between; font-size:11px; color:#929eac; }
.portfolio-footnote>div { display:flex; gap:17px; align-items:center; color:#d2d9e3; }
.portfolio-footnote i { height:3px; width:3px; border-radius:50%; background:#f5b64d; }
.project-section { border-top:1px solid #ffffff12; padding:65px 0 0; }
.collection-heading { display:flex; align-items:end; justify-content:space-between; gap:25px; margin-bottom:35px; }
.collection-heading .eyebrow { font-size:9px; color:#7cb9d6; margin-bottom:12px; }
.collection-heading h2 { font-size:38px; font-weight:550; line-height:1.15; }
.collection-heading>p { font-size:13px; }
.portfolio-tools { margin-bottom:30px; }
.industry-filters { display:flex; flex-wrap:wrap; gap:7px; padding:0 0 22px; }
.industry-filters button { background:none; border:1px solid #2b3440; border-radius:4px; padding:9px 13px; color:#a6b0bd; font-size:11px; cursor:pointer; transition:background 180ms,color 180ms; }
.industry-filters button:hover { border-color:#6e849e; color:#fff; }
.industry-filters button[aria-pressed=true] { background:#edc78f; border-color:#edc78f; color:#101a24; }
.portfolio-search-row { display:flex; justify-content:space-between; gap:20px; align-items:center; padding:15px 0; border-block:1px solid #ffffff13; }
.collection-count { font-size:11px; color:#8493a5; }
.portfolio-inputs { display:flex; gap:20px; }
.search-field,.country-field { display:flex; gap:12px; align-items:center; font-size:10px; color:#8392a4; }
.portfolio-inputs input,.portfolio-inputs select { background:#111924; border:1px solid #303b49; border-radius:4px; color:#d6dce5; padding:8px 10px; font-size:11px; min-width:0; max-width:190px; }
.project-collection { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:30px; row-gap:42px; }
.portfolio-project { min-width:0; }
.project-art { display:block; position:relative; height:300px; border-radius:6px; overflow:hidden; background:#202936; }
.project-art>img { display:block; width:100%; height:100%; object-fit:cover; transition:transform 600ms ease; }
.portfolio-project:hover .project-art>img { transform:scale(1.035); }
.project-number { position:absolute; top:16px; left:16px; font-size:10px; color:white; background:#0a111dbd; padding:5px 7px; border-radius:3px; }
.project-visit { position:absolute; right:16px; bottom:16px; display:flex; align-items:center; gap:15px; padding:10px 13px; border:1px solid #ffffff30; border-radius:4px; background:#101823e8; color:white; font-size:10px; }
.project-visit>span { font-size:17px; }
.owned-label { position:absolute; left:16px; bottom:19px; font-size:8px; color:#e7d3ae; padding:7px 9px; background:#0a111dd9; }
.project-meta { display:flex; justify-content:space-between; align-items:center; margin-top:19px; font-size:10px; color:#9aa7b6; }
.project-meta i { color:#546070; font-style:normal; margin:0 8px; }
.project-meta>a { font-size:22px; color:#e7c28c; line-height:1; }
.portfolio-project h3 { color:#edf1f7; font-size:23px; font-weight:550; margin-top:7px; }
.portfolio-project>p { font-size:12px; margin-top:5px; }
.project-bottom { display:flex; align-items:center; justify-content:space-between; gap:10px; padding-top:15px; margin-top:18px; border-top:1px solid #ffffff13; font-size:10px; color:#718296; }
.project-bottom button { background:transparent; border:0; color:#bac8d7; cursor:pointer; padding:7px 0 7px 8px; font-size:10px; }
.project-bottom button>span { margin-left:12px; color:#edc78f; }
.contain-art>img { object-fit:contain; }
.unavailable-art { display:flex; flex-direction:column; align-items:center; justify-content:center; height:100%; background:repeating-linear-gradient(0deg,transparent 0 31px,#ffffff04 31px 32px),#152434; gap:16px; }
.unavailable-art>span { font-size:64px; color:#79a4b5; font-weight:300; }
.unavailable-art>strong { font-size:21px; font-weight:500; }
.unavailable-art>small { font-size:10px; color:#9bacbd; }
.collection-end { display:flex; justify-content:space-between; align-items:center; gap:25px; margin-top:55px; padding:28px 0 40px; border-top:1px solid #ffffff13; font-size:12px; color:#97a5b8; }
.collection-end>a { color:#e3c08a; }
.portfolio-next { border-top:1px solid #ffffff12; padding:65px 0 75px; }
.portfolio-next>.eyebrow { color:#7cb9d6; font-size:10px; }
.portfolio-next h2 { font-size:48px; line-height:1.12; font-weight:550; }
.portfolio-next h2>span { color:#929daa; }
.portfolio-next>div { display:flex; justify-content:space-between; align-items:end; margin-top:24px; }
.portfolio-next .button { background:#edc78f; border-color:#edc78f; color:#121a23; box-shadow:none; gap:28px; }
.portfolio-next p { font-size:14px; }
.portfolio-empty { text-align:center; padding:65px 20px; }
.portfolio-empty h3 { font-size:24px; font-weight:500; }
.portfolio-empty p { margin:15px 0; }
.portfolio-empty button { padding:10px 16px; border:1px solid #edc78f; background:none; color:#edc78f; border-radius:4px; cursor:pointer; }
.project-dialog { background:#111a26; border:1px solid #3c4a5e; border-radius:8px; padding:0; color:white; width:min(730px,calc(100% - 28px)); max-height:90dvh; }
.project-dialog::backdrop { background:#03070ed9; backdrop-filter:blur(5px); }
.dialog-close { position:absolute; top:12px; right:12px; z-index:2; border:1px solid #ffffff55; background:#101823e8; color:white; width:36px; height:36px; font-size:25px; cursor:pointer; border-radius:4px; }
.dialog-art img { width:100%; height:260px; object-fit:cover; display:block; }
.dialog-content { padding:28px; }
.dialog-content h2 { font-size:32px; font-weight:550; margin-bottom:16px; }
.dialog-content p { font-size:14px; }
.dialog-content h3 { font-size:13px; margin-top:25px; }
.dialog-content ul { padding-left:18px; color:#b2c1d2; font-size:13px; }
.dialog-note { margin:20px 0; }
body:has(.project-dialog[open]) { overflow:hidden; }
body:has(.portfolio-page) .site-footer .footer-cta { display:none; }
@media(min-width:1600px) { .portfolio-page>.container,.portfolio-page .project-section>.container { max-width:1360px; width:calc(100% - 100px); }.portfolio-cover { height:490px; }.project-art { height:360px; } }
@media(max-width:980px) { .portfolio-intro { gap:25px; grid-template-columns:1.5fr 1fr; }.portfolio-intro h1 { font-size:42px; }.portfolio-cover { height:360px; }.project-art { height:240px; }.project-collection { gap:32px 20px; } }
@media(max-width:640px) { .portfolio-hero { padding-top:32px; }.edition { display:none; }.portfolio-intro { grid-template-columns:1fr; gap:20px; margin-top:22px; }.portfolio-intro h1 { font-size:34px; }.portfolio-intro p { font-size:14px; }.portfolio-cover { height:auto; grid-template-columns:1fr; }.cover-main { min-height:330px; }.cover-main img { position:absolute; inset:0; }.cover-side { grid-template-columns:1fr 1fr; grid-template-rows:175px; }.cover-small h2 { font-size:15px; }.cover-small>div { left:12px; bottom:12px; right:12px; }.cover-small>div>span { font-size:7px; }.cover-caption { left:20px; bottom:23px; }.cover-caption h2 { font-size:30px; }.cover-caption p { max-width:230px; }.visit-orbit { right:18px; bottom:23px; width:34px; height:34px; }.portfolio-footnote { flex-direction:column; gap:16px; font-size:10px; }.project-section { padding-top:35px; }.collection-heading { flex-direction:column; align-items:start; gap:15px; }.collection-heading h2 { font-size:31px; }.collection-heading>p br { display:none; }.industry-filters { gap:6px; }.industry-filters button { padding:8px 10px; font-size:10px; }.portfolio-search-row { align-items:start; flex-direction:column; }.portfolio-inputs { flex-wrap:wrap; gap:12px; width:100%; }.search-field { flex:1; }.search-field input { width:100%; }.project-collection { grid-template-columns:1fr; row-gap:32px; }.project-art { height:auto; aspect-ratio:1.65; }.project-meta { margin-top:14px; }.portfolio-project h3 { font-size:23px; }.collection-end { flex-direction:column; align-items:start; }.portfolio-next { padding:40px 0; }.portfolio-next h2 { font-size:34px; }.portfolio-next>div { align-items:start; flex-direction:column; gap:22px; }.dialog-art img { height:190px; }.dialog-content { padding:22px; } }
@media(prefers-reduced-motion:reduce) { .portfolio-page img { transition:none; }.portfolio-page a:hover img { transform:none; } }