.ps-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(1rem,1.6vw,1.5rem);display:grid}.ps-card{flex-direction:column;gap:.875rem;min-width:0;display:flex}.ps-frame{--ps-h:15rem;border:1px solid var(--line-strong);transition:border-color var(--dur-ui) var(--ease-portal);background:#fff;border-radius:1rem;position:relative;overflow:hidden}.ps-card:hover .ps-frame,.ps-card:focus-within .ps-frame{border-color:var(--portal-cyan)}.ps-bar{border-bottom:1px solid var(--line);background:#e8edf3;align-items:center;gap:.375rem;height:1.75rem;padding-inline:.75rem;display:flex}.ps-bar i{background:#b9c3d0;border-radius:50%;width:.5rem;height:.5rem}.ps-view{height:var(--ps-h);background:#f1f4f8;position:relative;overflow:hidden}.ps-shot{width:100%;height:auto;transition:transform 1.2s var(--ease-portal);display:block}@media (hover:hover) and (prefers-reduced-motion:no-preference){.ps-card.has-link:hover .ps-shot{transform:translateY(min(0px, calc(var(--ps-h) - 100%)));transition:transform 6s ease-in-out}}@media (hover:none) and (prefers-reduced-motion:no-preference){.ps-card.has-link.is-played .ps-shot{transform:translateY(min(0px, calc(var(--ps-h) - 100%)));transition:transform 6s ease-in-out}}.ps-visit{z-index:1;color:#031014;opacity:0;background:#00d9ff;border-radius:999px;align-items:center;gap:.375rem;min-height:2.25rem;padding:.4375rem .875rem;font-size:.8125rem;font-weight:600;transition:opacity .25s;display:inline-flex;position:absolute;bottom:calc(.625rem + 1px);right:calc(.625rem + 1px)}.ps-card:hover .ps-visit,.ps-card:focus-within .ps-visit{opacity:1}@media (hover:none){.ps-visit{opacity:1;min-height:2.75rem}}.ps-meta{flex-wrap:wrap;align-items:baseline;gap:.25rem .625rem;display:flex}.ps-meta h3{flex:100%;font-size:1.0625rem;font-weight:600}.ps-tag{font-family:var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--text-faint);font-size:.6875rem}.ps-dots{display:none}@media (width<=1099px){.ps-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (width<=759px){.ps-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=700px){.ps{--w:min(78vw, 22rem)}.ps-grid{scroll-snap-type:x mandatory;scrollbar-width:none;width:100vw;padding-inline:calc((100vw - var(--w)) / 2);gap:1rem;margin-inline:calc(50% - 50vw);display:flex;position:relative;overflow-x:auto}.ps-grid::-webkit-scrollbar{display:none}.ps-card{flex:0 0 var(--w);scroll-snap-align:center;scroll-snap-stop:always;text-align:left;transition:scale .25s;scale:.94}.ps-card.is-active{scale:1}.ps-frame,.ps-meta,.ps-visit{transition:opacity .25s ease, border-color var(--dur-ui) var(--ease-portal)}.ps-card:not(.is-active) .ps-frame,.ps-card:not(.is-active) .ps-meta,.ps-card:not(.is-active) .ps-visit{opacity:.7}.ps-frame{--ps-h:13rem}.ps-visit{opacity:1;width:max-content;min-height:2.75rem;margin:.625rem .75rem;display:flex;position:static}.ps-card.has-link .ps-shot{transition:none;transform:none}.ps-card.has-link.is-active .ps-shot{animation:8.2s infinite paused ps-scan}.ps.is-running .ps-card.has-link.is-active .ps-shot{animation-play-state:running}.ps-dots{flex-wrap:wrap;justify-content:center;max-width:15rem;margin:.75rem auto 0;display:flex}.ps-dots button{background:0 0;border:0;width:2.75rem;height:2.75rem;padding:0;position:relative}.ps-dots button:before{content:"";background:var(--line-strong);border-radius:999px;width:.5rem;height:.5rem;margin:auto;transition:transform .3s,background-color .3s;position:absolute;inset:0}.ps-dots button.is-active:before{background:var(--portal-cyan);transform:scale(1.5)}}@keyframes ps-scan{0%{animation-timing-function:ease-in-out;transform:translateY(0)}73.2%{transform:translateY(min(0px, calc(var(--ps-h) - 100%)))}85.4%{transform:translateY(min(0px, calc(var(--ps-h) - 100%)));animation-timing-function:ease-in-out}to{transform:translateY(0)}}@media (prefers-reduced-motion:reduce){.ps-shot,.ps-visit,.ps-dots button{transition:none}.ps-card.has-link.is-active .ps-shot{animation:none}}.portfolio-hero{isolation:isolate;z-index:var(--z-content);background:radial-gradient(120% 90% at 75% 40%, #1b2433 0%, var(--portal-bg-2) 45%, var(--portal-bg) 100%);border-radius:1.75rem;margin:10px;position:relative;overflow:hidden}.portfolio-hero-grid{padding:calc(var(--nav-h) + clamp(2rem, 5vh, 4rem)) clamp(1.5rem, 5vw, 5rem) clamp(2.5rem, 6vh, 4.5rem);grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);align-items:center;gap:clamp(1.5rem,4vw,4rem);display:grid}.portfolio-hero-net{min-width:0}@media (width<=900px){.portfolio-hero{border-radius:1.5rem;margin:8px}.portfolio-hero-grid{grid-template-columns:1fr;padding-top:6rem}}.portfolio-hero-glow{filter:blur(10px);background:radial-gradient(#00d9ff2e 0%,#0080ff14 45%,#0000 72%);width:min(900px,120vw);height:31.25rem;animation:9s ease-in-out infinite alternate portfolio-glow-breathe;position:absolute;top:-15%;left:50%;transform:translate(-50%)}@keyframes portfolio-glow-breathe{0%{opacity:.7}to{opacity:1}}@media (prefers-reduced-motion:reduce){.portfolio-hero-glow{animation:none}}.portfolio-hero-inner{z-index:var(--z-content);width:100%;position:relative}@media (width<=900px){.portfolio-hero-inner{max-width:100%}}.portfolio-hero h1{letter-spacing:-.03em;color:var(--portal-text);font-size:clamp(2.2rem,5vw,4.2rem);line-height:1.08}.portfolio-hero-inner p{color:var(--portal-text-dim);max-width:60ch;margin-top:1.125rem;font-size:1.0625rem;line-height:1.65}.portfolio-hero-inner .stat-readout{margin-top:1.375rem}.more-projects{z-index:var(--z-content);padding-block:clamp(2rem,4vw,3.25rem) clamp(2.5rem,5vw,4rem);position:relative}.ps-head{margin-bottom:clamp(1.5rem,3vw,2.25rem)}.ps-head h2{letter-spacing:-.03em;font-size:clamp(1.8rem,3.6vw,2.8rem);line-height:1.1}
