.portfolio-container h1{letter-spacing:-.03em;text-transform:uppercase;margin-bottom:.25rem;font-size:4rem;font-weight:700}.portfolio-container h1 sup{vertical-align:super;opacity:.5;letter-spacing:.05em;font-size:1rem;font-weight:400}.portfolio-container .page-subtitle{font-family:var(--font-pp-supply-mono),"PP Supply Mono",monospace;text-transform:uppercase;letter-spacing:.15em;opacity:.5;margin-bottom:2rem;font-size:.85rem;font-weight:400}.portfolio-container{counter-reset:project-counter 0;flex-direction:column;gap:0;width:100%;max-width:1400px;margin:0 auto;padding:4rem 2rem 6rem;display:flex;position:relative}.project-list{margin:0;padding:0;list-style:none}.project-item{cursor:pointer;grid-column-gap:2rem;opacity:1;width:100%;font-family:var(--font-pp-supply-mono),"PP Supply Mono",monospace;text-transform:uppercase;letter-spacing:.05em;border-bottom:1px solid #c8ffc81a;grid-template-columns:40px 1fr 2fr 1fr 1fr 80px;align-items:center;padding:12px 0;font-size:12px;font-weight:400;transition:all .3s;display:grid;position:relative}.project-item-link{color:inherit;text-decoration:none;display:contents}.project-item.active{opacity:1;box-shadow:inset 0 1px #c8ffc833,inset 0 -1px #c8ffc833}.portfolio-container.has-active .project-item{opacity:.3}.portfolio-container.has-active .project-item.active{opacity:1}.project-item:before{content:counter(project-counter,decimal-leading-zero);counter-increment:project-counter;opacity:.6;z-index:10;justify-self:start;padding:4px 0;line-height:.8;transition:opacity .1s;position:relative}.project-item.counter-hidden:before{opacity:.05}.project-data{font-family:var(--font-pp-supply-mono),"PP Supply Mono",monospace;white-space:nowrap;color:var(--warm-off-white);z-index:1;text-overflow:ellipsis;padding:2px;line-height:1;text-decoration:none;transition:all .3s;position:relative;overflow:hidden}.project-data.artist,.project-data.album{justify-self:start}.project-data.category{justify-self:start;padding-left:12rem}.project-data.label{justify-self:start}.project-data.year{text-align:right;justify-self:end}.project-data:after{content:"";transform-origin:0;z-index:-1;background:#ffdf00;width:calc(100% + 16px);height:calc(100% - 2px);transition:transform .3s;position:absolute;top:0;left:-8px;transform:scaleX(0)}.project-item:hover .project-data:after{transform:scaleX(1)}.project-item:hover .project-data{color:#0a0a0a!important}.background-image{opacity:0;z-index:-2;width:800px;height:600px;transition:opacity .6s;position:fixed;top:50%;left:50%;overflow:hidden;transform:translate(-50%,-50%)}@media (max-width:1200px){.project-item{grid-column-gap:1rem;grid-template-columns:30px 1fr 1.5fr .8fr .8fr 60px}.background-image{width:600px;height:450px}}@media (max-width:768px){.portfolio-container{padding:3rem 1rem 4rem}.portfolio-container h1{font-size:3.5rem}.project-item{grid-column-gap:1rem;grid-template-columns:30px 1fr 1fr}.project-data:not(.artist):not(.album){display:none}.background-image{width:400px;height:300px}}