.section-project-portfolios{padding:40px 0;background:var(--Off-White, #F4F4F4)}.project-portfolios__heading{color:var(--Dark-Metal, #29292A);font-family:Barlow Condensed;font-size:64px;font-style:normal;font-weight:600;line-height:normal;text-align:left;margin-bottom:40px}.project-portfolios__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:20px}.project-card{position:relative;aspect-ratio:3 / 2;border-radius:8px;overflow:hidden;background:linear-gradient(180deg,#0000,#00000080),var(--card-image) #d3d3d3 50% / cover no-repeat;background-size:100% 100%,cover;background-position:center;box-shadow:0 2px 8px #0000000f;transform:translateY(0);transition:background-size .6s cubic-bezier(.22,.61,.36,1),transform .4s cubic-bezier(.22,.61,.36,1),box-shadow .4s cubic-bezier(.22,.61,.36,1);will-change:background-size,transform}.project-card__text{position:absolute;bottom:0;left:0;padding:20px;color:#fff;font-family:Roboto;font-size:24px;font-style:normal;font-weight:700;line-height:normal;z-index:2;transform:translateY(4px);transition:transform .35s ease,opacity .35s ease;opacity:.98}@media screen and (max-width:749px){.project-portfolios__grid{grid-template-columns:1fr}.project-card{aspect-ratio:4 / 3}}@media(hover:hover){.project-card:hover{background-size:100% 100%,110%;transform:translateY(-2px);box-shadow:0 10px 24px #0000002e;transition:background-size .6s cubic-bezier(.34,1.56,.64,1),transform .4s cubic-bezier(.34,1.56,.64,1),box-shadow .4s cubic-bezier(.22,.61,.36,1)}.project-card:hover .project-card__text{transform:translateY(0);opacity:1}}.project-card:focus-visible{outline:2px solid currentColor;outline-offset:2px;background-size:100% 100%,110%;transform:translateY(-2px);box-shadow:0 10px 24px #0000002e;transition:background-size .6s cubic-bezier(.34,1.56,.64,1),transform .4s cubic-bezier(.34,1.56,.64,1),box-shadow .4s cubic-bezier(.22,.61,.36,1)}.project-card:focus-visible .project-card__text{transform:translateY(0);opacity:1}@media(prefers-reduced-motion:reduce){.project-card,.project-card__text{transition:none}}
/*# sourceMappingURL=/cdn/shop/t/1/assets/component-project-portfolios.css.map */
