/* Vitium-only portfolio, with large images and a full-view gallery. */
.portfolio-image{display:block;width:100%;height:100%;overflow:hidden}
.hero-scene>.portfolio-image{transform:scale(1.055);transition:transform 8.2s cubic-bezier(.17,.3,.55,1)}
.hero-scene.is-active>.portfolio-image{transform:scale(1)}
.portfolio-toolbar{display:flex;justify-content:space-between;align-items:center;gap:24px;margin:0 0 24px;color:#a9b7a2;font-size:12px}
.portfolio-toolbar>span{font-size:10px;color:#ddc591;white-space:nowrap}
.portfolio-mobile-hint{display:none}
.project-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:clamp(320px,31vw,420px);gap:20px}
.project-tile{position:relative;min-width:0;min-height:0;overflow:hidden;border-radius:4px;background:#141a14}
.project-tile.project-wide{grid-column:span 2}
.project-photo{position:relative;display:block;width:100%;height:100%;padding:0;border:0;border-radius:inherit;background:transparent;text-align:left;overflow:hidden}
.project-photo>.portfolio-image{transition:transform .85s cubic-bezier(.2,.7,.2,1)}
.project-photo:hover>.portfolio-image{transform:scale(1.025)}
.project-photo:after{content:'';position:absolute;inset:48% 0 0;background:linear-gradient(transparent,#050a06c9);pointer-events:none}
.project-enlarge{position:absolute;top:16px;right:16px;z-index:1;display:grid;place-items:center;width:39px;height:39px;border:1px solid #ffffff65;border-radius:50%;color:white;background:#0b120d4d;backdrop-filter:blur(8px);font-size:25px;line-height:1;transition:background .2s,color .2s}
.project-photo:hover .project-enlarge{background:var(--gold);color:#172014;border-color:var(--gold)}
.project-tile>figcaption{position:absolute;left:24px;right:24px;bottom:24px;pointer-events:none}
.project-tile>figcaption>span{font-size:8px;font-weight:600;text-transform:uppercase;letter-spacing:.15em;color:#f2dca8}
.project-tile h3{font-size:25px;line-height:1.13;letter-spacing:-.035em;color:#fffdf4;max-width:420px;margin-top:9px}
.spaces-section .portfolio-note{max-width:650px}
.media-dialog.gallery-viewer{width:min(calc(100vw - 28px),calc((100dvh - 220px) * var(--gallery-ratio)));max-width:1400px;max-height:calc(100dvh - 16px);overflow:visible;border:0;background:transparent;box-shadow:none}
.gallery-viewer .dialog-close{margin:0 0 12px auto;background:#101811d9;border-color:#e6c78466;font-size:11px;min-height:36px}
.gallery-viewer #dialog-content>svg{display:block;width:100%;height:auto;aspect-ratio:var(--gallery-ratio);overflow:hidden;border-radius:3px}
.gallery-viewer .media-caption{padding:10px 0 0;margin:0;color:#eef1e7;text-align:center;font-size:12px;line-height:1.5}
.gallery-controls{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:13px}
.gallery-controls>button{min-height:42px;min-width:83px;border:1px solid #ffffff4d;background:#111b13c9;color:#f2ead7;border-radius:25px;padding:9px 17px;font-size:11px;line-height:1.4}
.gallery-controls>button:hover{border-color:var(--gold);color:var(--gold)}
.gallery-controls>span{font-size:11px;letter-spacing:.08em;color:#e5d3aa}
@media(max-width:1000px){.project-gallery{gap:16px;grid-auto-rows:330px}.project-tile>figcaption{left:20px;right:18px;bottom:21px}.project-tile h3{font-size:22px}}
@media(max-width:650px){.portfolio-toolbar{font-size:10px;align-items:start;gap:15px;margin-bottom:18px}.portfolio-toolbar>p{max-width:150px;line-height:1.7}.portfolio-toolbar>span{font-size:8px;line-height:1.8}.portfolio-mobile-hint{display:inline}.project-gallery{grid-template-columns:none;grid-template-rows:clamp(260px,78vw,360px);grid-auto-flow:column;grid-auto-columns:88%;gap:15px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:thin;scrollbar-color:#bca578 #263022;padding-bottom:15px}.project-tile,.project-tile.project-wide{grid-column:auto;scroll-snap-align:start}.project-tile>figcaption{left:20px;right:18px;bottom:21px}.project-tile h3{font-size:24px;max-width:280px}.project-enlarge{width:34px;height:34px;top:12px;right:12px;font-size:23px}.project-tile>figcaption>span{font-size:8px}.gallery-viewer .media-caption{font-size:10px}.gallery-controls>button{font-size:10px;min-width:76px}.gallery-controls>span{font-size:10px}}
@media(prefers-reduced-motion:reduce){.hero-scene>.portfolio-image,.hero-scene.is-active>.portfolio-image,.project-photo:hover>.portfolio-image{transform:none;transition:none}}
