.portfolio-section{background-color:#fff;width:100%}.portfolio-grid{grid-template-columns:repeat(3,1fr);gap:0;width:100%;display:grid}.portfolio-item{aspect-ratio:4/3;width:100%;position:relative;overflow:hidden}.portfolio-link{width:100%;height:100%;display:block}.portfolio-image-wrapper{width:100%;height:100%;position:relative}.portfolio-image{object-fit:cover;width:100%;height:100%;transition:transform .6s cubic-bezier(.25,1,.5,1)}.portfolio-image-placeholder{color:#888;width:100%;height:100%;font-family:var(--font-roboto-sans), sans-serif;background-color:#f0f0f0;justify-content:center;align-items:center;font-weight:300;display:flex}.portfolio-overlay{opacity:0;text-align:center;background-color:#0006;justify-content:center;align-items:center;width:100%;height:100%;padding:20px;transition:opacity .4s;display:flex;position:absolute;top:0;left:0}.portfolio-item-title{color:#fff;font-family:var(--font-roboto-sans), sans-serif;letter-spacing:1.5px;text-transform:uppercase;font-size:1.5rem;font-weight:400;transition:transform .4s cubic-bezier(.25,1,.5,1);transform:translateY(10px)}.portfolio-item:hover .portfolio-image{transform:scale(1.05)}.portfolio-item:hover .portfolio-overlay{opacity:1}.portfolio-item:hover .portfolio-item-title{transform:translateY(0)}@media (max-width:1024px){.portfolio-grid{grid-template-columns:repeat(2,1fr)}.portfolio-item-title{font-size:1.3rem}}@media (max-width:640px){.portfolio-grid{grid-template-columns:repeat(2,1fr)}.portfolio-item-title{font-size:1rem}}