.portfolio-page .container{padding-bottom:20em}.portfolio-header{width:50%;margin:2em auto 4em;text-align:center;-webkit-clip-path:polygon(0 0,100% 0,100% 100%,0 100%);clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}.portfolio-header h1{position:relative;transform:translateY(64px);will-change:transform}.portfolio-row{width:100%;display:flex;gap:2em}.portfolio-row .col{position:relative;width:100%;height:380px;margin-bottom:2em;overflow:hidden;-webkit-clip-path:polygon(0 100%,100% 100%,100% 100%,0 100%);clip-path:polygon(0 100%,100% 100%,100% 100%,0 100%)}.portfolio-row .col img,.portfolio-row .col video{width:100%;height:100%;object-fit:cover;will-change:transform}.portfolio-row .col.lg{flex:2 1}.portfolio-row .col.sm{flex:1.25 1}.portfolio-row .col .col-hit{position:absolute;inset:0;z-index:2;cursor:pointer}.portfolio-row .col .col-badge{position:absolute;top:1em;right:1em;z-index:3;display:flex;align-items:center;gap:.5em;padding:.5em .85em;border-radius:100px;background:hsla(0,0%,6%,.5);border:1px solid hsla(0,0%,100%,.35);color:#fff;font-size:12px;font-weight:500;letter-spacing:.02em;line-height:1;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);pointer-events:none;transition:background .35s ease,color .35s ease,border-color .35s ease}.portfolio-row .col:hover .col-badge{background:#fff;color:#0f0f0f;border-color:#fff}.portfolio-row .col .col-badge svg{width:14px;height:14px;display:block}.portfolio-row .col .project-title{position:absolute;left:1em;bottom:1em;-webkit-clip-path:polygon(0 0,100% 0,100% 100%,0 100%);clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}.portfolio-row .col .project-title h3{position:relative;transform:translateY(24px);font-size:20px;will-change:transform}@media (max-width:900px){.portfolio-row{flex-direction:column;gap:0}.portfolio-row .col,.portfolio-row .col.lg,.portfolio-row .col.sm{flex:none;width:100%;height:340px}}