.portfolio{background:#e5e8df}
.carousel-track{display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:thin;scrollbar-color:#909e83 transparent;padding-bottom:16px;scroll-behavior:smooth;overscroll-behavior-x:contain}
.portfolio-card{flex:0 0 76%;margin:0;min-width:0;scroll-snap-align:start}
.portfolio-card:last-child{margin-right:24%}
.portfolio-image{display:block;position:relative;background:#d1d6c9;overflow:hidden;aspect-ratio:16/10}
.portfolio-image img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .4s;filter:saturate(.8)}
.portfolio-image:hover img{transform:scale(1.025)}
.portfolio-zoom{position:absolute;right:18px;bottom:18px;display:grid;place-items:center;background:var(--cream);color:var(--text);width:42px;height:42px;font-size:22px}
.portfolio-card figcaption{display:flex;justify-content:space-between;align-items:baseline;gap:20px;padding:18px 0 4px;font-size:14px;font-weight:500;line-height:1.6}
.portfolio-number{font:11px monospace;color:var(--muted)}
.carousel-toolbar{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:15px}
.carousel-hint{font-size:11px;color:var(--muted)}.carousel-hint span{margin-left:12px}
.carousel-controls{display:flex;align-items:center;gap:10px}.carousel-counter{font:12px monospace;margin-right:20px;color:var(--muted)}
.icon-button{width:46px;height:46px;border:1px solid #aeb8a2;background:transparent;color:var(--text);font-size:22px;transition:background .2s}.icon-button:hover:not(:disabled){background:var(--cream)}
.photo-dialog{background:var(--dark);color:var(--cream);border:1px solid #ffffff25;padding:0 24px;width:min(1200px,calc(100% - 40px));max-width:1200px;max-height:calc(100dvh - 40px);overflow:auto}
.photo-dialog::backdrop{background:#080906eb}body:has(.photo-dialog[open]){overflow:hidden}
.photo-toolbar,.photo-bottom{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:64px}.photo-counter{font:12px monospace;color:#b8bab1}
.photo-dialog button{background:transparent;color:var(--cream);border:1px solid #51544a;min-width:44px;min-height:44px;font-size:20px}.photo-dialog .photo-close{border:0;display:flex;align-items:center;gap:18px;font-size:12px;padding:0 4px}.photo-close span{font-size:28px}.photo-dialog button:hover{color:var(--orange)}.photo-full{display:block;width:100%;height:min(70dvh,760px);object-fit:contain}.photo-bottom p{font-size:14px;text-align:center;margin:16px 0;line-height:1.5}
@media(max-width:700px){.carousel-track{gap:16px}.portfolio-card{flex-basis:90%}.portfolio-card:last-child{margin-right:10%}.portfolio-image{aspect-ratio:4/3}.portfolio-card figcaption{font-size:12px;gap:10px}.portfolio-zoom{right:12px;bottom:12px;width:36px;height:36px}.carousel-hint{font-size:10px;max-width:120px;line-height:1.6}.carousel-counter{margin-right:8px}.carousel-controls{gap:8px}.icon-button{width:44px;height:44px}.photo-dialog{width:calc(100% - 20px);max-height:calc(100dvh - 20px);padding:0 12px}.photo-full{height:65dvh}.photo-bottom{gap:12px}.photo-bottom p{font-size:12px}.photo-toolbar{min-height:56px}}
@media(prefers-reduced-motion:reduce){.carousel-track{scroll-behavior:auto}.portfolio-image img{transition:none}.portfolio-image:hover img{transform:none}}