﻿.portfolio-view-open{overflow:hidden}
.portfolio-dialog{position:fixed;inset:0;box-sizing:border-box;width:100%;max-width:none;height:100%;max-height:none;margin:0;padding:0;border:0;background:#0b0d12;color:#e6e8ee;overflow:auto;overscroll-behavior:contain;font-family:inherit;scrollbar-color:#303744 #0b0d12}
.portfolio-dialog::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.12;background:url("assets/reference-texture.svg") repeat;background-size:200px 200px}
.portfolio-dialog::backdrop{background:#0b0d12}
.portfolio-dialog *{box-sizing:border-box}
.portfolio-dialog button,.portfolio-dialog input{font:inherit}
.portfolio-dialog button,.portfolio-dialog a{-webkit-tap-highlight-color:transparent}
.portfolio-dialog button{cursor:pointer;color:inherit}
.portfolio-dialog button:focus-visible,.portfolio-dialog a:focus-visible,.portfolio-dialog input:focus-visible{outline:2px solid #86b0fa;outline-offset:5px}
.portfolio-dialog a{color:inherit;text-decoration:none}
.pg-header{position:sticky;z-index:4;top:16px;width:calc(100% - 48px);max-width:1152px;min-height:56px;margin:16px auto 0;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:5px 6px 5px 8px;border:1px solid #262c36;border-radius:32px;background:rgba(18,21,28,.94);backdrop-filter:blur(18px)}
.pg-brand,.pg-header-actions{display:flex;align-items:center;gap:12px;font-size:13px}
.pg-brand-mark{display:grid;place-items:center;width:32px;height:32px;border-radius:10px;background:#3774f3;color:#fff;font-size:17px;font-weight:700}
.pg-header button{border:0;background:none;padding:12px 18px;font-size:13px}
.pg-header .pg-close{display:flex;align-items:center;gap:14px;border-radius:24px;background:#3774f3;color:white}
.pg-close span{font-size:22px;line-height:1}
.pg-main{position:relative;max-width:1200px;margin:0 auto;padding:0 24px;outline:none}
.pg-intro{padding:108px 0 60px}
.pg-eyebrow{margin:0 0 22px;color:#86b0fa;font-family:ui-monospace,monospace;font-size:12px;letter-spacing:.12em}
.pg-intro h1{margin:0;color:#e6e8ee;font-size:clamp(36px,5.1vw,64px);font-weight:600;line-height:1.16;letter-spacing:-.04em}
.pg-description{max-width:620px;margin:24px 0 0;font-size:17px;line-height:1.8;color:#969ca9}
.pg-toolbar{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;padding-bottom:22px;border-bottom:1px solid #252b36}
.pg-filters{display:flex;align-items:center;flex-wrap:wrap;gap:8px}
.pg-filter{padding:9px 15px;border-radius:22px;border:1px solid #262d39;background:transparent;font-size:13px;transition:background .2s,color .2s,border-color .2s}
.pg-filter:hover,.pg-filter.is-active{color:#0b0d12;background:#e6e8ee;border-color:#e6e8ee}
.pg-search{display:flex;align-items:center;gap:9px;width:230px;height:40px;padding:0 14px;background:#10141b;border:1px solid #262d39;border-radius:22px;color:#a2a9b5}
.pg-search>span:first-child{font-size:23px}
.pg-search input{min-width:0;width:100%;color:#e6e8ee;background:none;border:0;outline:none;font-size:13px}
.pg-search input::placeholder{color:#838b9b}
.pg-result-count{margin:20px 0;color:#858d9c;font-size:12px}
.pg-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:38px 24px}
.pg-project-card{text-align:left;padding:0;border:0;background:none;min-width:0}
.pg-cover{display:block;position:relative;overflow:hidden;aspect-ratio:1.38;border-radius:20px;background:#141821}
.pg-cover img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.16,1,.3,1),filter .5s}
.pg-project-card:hover .pg-cover img{transform:scale(1.035);filter:brightness(.87)}
.pg-card-arrow{position:absolute;right:14px;top:14px;display:grid;place-items:center;width:37px;height:37px;border-radius:50%;background:#e6e8ee;color:#0b0d12;font-size:23px;transform:translateY(5px);opacity:0;transition:opacity .25s,transform .25s}
.pg-project-card:hover .pg-card-arrow,.pg-project-card:focus-visible .pg-card-arrow{opacity:1;transform:none}
.pg-featured{position:absolute;left:14px;top:14px;display:block;padding:7px 11px;border-radius:20px;background:rgba(11,13,18,.8);color:#e6e8ee;backdrop-filter:blur(10px);font-size:11px}
.pg-card-caption{display:flex;flex-direction:column;gap:9px;padding:17px 1px 0}
.pg-card-caption strong{font-size:17px;font-weight:500;line-height:1.5}
.pg-card-caption>span{font-size:12px;color:#858d9c;line-height:1.6}
.pg-empty{grid-column:1/-1;margin:60px 0 100px;color:#969ca9;text-align:center}
.pg-bottom{display:flex;justify-content:space-between;gap:24px;margin-top:100px;padding:25px 0 32px;border-top:1px solid #252b36;color:#858d9c;font-size:12px}
.pg-bottom button{border:0;background:none;padding:0;color:#a4adbc}
.pg-back{display:block;margin:0 0 44px;border:0;padding:0;background:none;font-size:13px;color:#969ca9!important}
.pg-back:hover{color:#86b0fa!important}
.pg-detail-intro{padding-top:76px}
.pg-project-meta{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:50px;padding-top:26px;border-top:1px solid #252b36}
.pg-project-meta>span{display:flex;flex-direction:column;gap:10px;font-size:11px;color:#858d9c;letter-spacing:.03em}
.pg-project-meta strong{font-size:14px;font-weight:400;color:#c8ced9;letter-spacing:0}
.pg-detail-gallery{overflow:hidden;display:flex;flex-direction:column;gap:12px;border-radius:24px}
.pg-detail-gallery figure{margin:0;line-height:0;background:#121720}
.pg-detail-gallery img{display:block;max-width:100%;width:100%;height:auto;object-fit:contain}
.pg-project-navigation{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:64px}
.pg-project-navigation button{display:flex;flex-direction:column;gap:14px;text-align:left;padding:28px;border:1px solid #252b36;border-radius:20px;background:rgba(18,21,28,.7);transition:border-color .2s,background .2s;min-width:0}
.pg-project-navigation button:hover{border-color:#657da6;background:#151c28}
.pg-project-navigation button:last-child{text-align:right}
.pg-project-navigation span{font-size:12px;color:#858d9c}
.pg-project-navigation strong{font-size:20px;font-weight:500;line-height:1.5}
.pg-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:900px){.pg-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.pg-toolbar{gap:18px}.pg-search{width:100%}.pg-filters{gap:7px}.pg-intro{padding-top:80px}}
@media(max-width:600px){.pg-header{top:12px;width:calc(100% - 24px);margin-top:12px;min-height:52px;padding-left:6px}.pg-brand{gap:7px;font-size:11px}.pg-brand-mark{width:30px;height:30px;font-size:15px}.pg-to-gallery{display:none}.pg-header .pg-close{padding:10px 14px;font-size:12px;gap:9px}.pg-main{padding:0 18px}.pg-intro{padding:66px 0 38px}.pg-intro h1{font-size:36px;line-height:1.25}.pg-eyebrow{font-size:10px;margin-bottom:17px}.pg-description{font-size:14px;margin-top:18px}.pg-filter{font-size:12px;padding:8px 12px}.pg-grid{grid-template-columns:1fr;gap:30px}.pg-cover{aspect-ratio:1.38;border-radius:16px}.pg-card-arrow{opacity:1;transform:none;width:32px;height:32px;font-size:20px}.pg-card-caption strong{font-size:17px}.pg-card-caption>span{font-size:11px}.pg-back{margin-bottom:30px;font-size:12px}.pg-project-meta{margin-top:30px;gap:12px}.pg-project-meta>span{font-size:10px}.pg-project-meta strong{font-size:12px}.pg-detail-gallery{gap:7px;border-radius:14px}.pg-project-navigation{gap:12px;margin-top:32px}.pg-project-navigation button{padding:18px 14px;border-radius:14px}.pg-project-navigation strong{font-size:15px}.pg-project-navigation span{font-size:10px}.pg-bottom{margin-top:64px;font-size:10px;gap:10px}}
@media(prefers-reduced-motion:reduce){.portfolio-dialog *{scroll-behavior:auto!important;transition:none!important}}
