.portfolio{display:grid;gap:1rem;grid-auto-flow:column;grid-template-areas:"details details" "main-image main-image" "image-1 image-1" "image-2 image-3";grid-template-columns:1fr 1fr}@media (min-width:600px){.portfolio{display:grid;gap:1rem;grid-auto-flow:column;grid-template-areas:"details details detail" "main-image main-image main-image" "image-1 image-2 image-3";grid-template-columns:1fr 1fr 1fr}}@media (min-width:1024px){.portfolio{display:grid;gap:1rem;grid-auto-flow:column;grid-template-areas:"details details details details image-1 image-1" "main-image main-image main-image main-image main-image main-image" "image-2 image-2 image-2 image-3 image-3 image-3";grid-template-columns:1fr 1fr 1fr 1fr 1fr 1fr}}@media (min-width:1200px){.portfolio{display:grid;gap:2rem 2rem;grid-auto-flow:row;grid-template-columns:1fr 1fr 1fr}.portfolio,.portfolio--bottom-left-text-left{grid-template-areas:"details details image-1" "main-image main-image image-2" "main-image main-image image-3"}.portfolio--bottom-left-text-right{grid-template-areas:"image-1 details details" "main-image main-image image-2" "main-image main-image image-3"}.portfolio--bottom-right-text-right{grid-template-areas:"image-1 details details" "image-2 main-image main-image" "image-3 main-image main-image"}.portfolio--bottom-right-text-left{grid-template-areas:"details details image-1" "image-2 main-image main-image" "image-3 main-image main-image"}.portfolio--bottom-right-text-right-feature{grid-template-areas:"image-1 details details" "image-1 main-image main-image" "image-2 main-image main-image"}}.portfolio img{block-size:100%;inline-size:100%;-o-object-fit:cover;object-fit:cover}.portfolio img,.portfolio__video{border-radius:var(--border-radius-outer)}.portfolio__video{background:var(--secondary-background);padding:2rem}.portfolio video{block-size:100%;border-radius:var(--border-radius-inner);box-shadow:0 3px 6px #0000004d;inline-size:100%;-o-object-fit:cover;object-fit:cover}.portfolio__header{--flex-direction:column;--align:flex-start;align-items:var(--align);display:flex;flex-direction:var(--flex-direction);gap:1rem}@media (min-width:1200px){.portfolio__header{--flex-direction:row;--align:center}}.portfolio__header h2{margin:0}.portfolio__content{--padding:var(--space-4x) 0;display:flex;flex-direction:column;gap:2rem;padding:var(--padding)}@media (min-width:1200px){.portfolio__content{--padding:var(--space-4x)}}.portfolio__content{grid-area:details}.portfolio__main-image{grid-area:main-image}.portfolio__image-1{grid-area:image-1}.portfolio__image-2{grid-area:image-2}.portfolio__image-3{grid-area:image-3}.portfolio__tags{display:flex;flex-wrap:wrap;gap:1rem}.portfolio__tag{border:1px solid #fff;border-radius:.5rem;color:#fff;display:inline-flex;font-size:1.2rem;font-weight:500;line-height:1;padding:.8rem;text-transform:uppercase}.has-js .portfolio__image{position:relative}.has-js .portfolio__image:after{background:var(--secondary-background);content:"";display:block;top:0;right:0;bottom:0;left:0;position:absolute;transition:all 1s ease;z-index:1}.in-view .portfolio--bottom-left-text-left>.portfolio__image:after,.in-view .portfolio--bottom-left-text-right>.portfolio__image:after{inset-inline-start:100%}.in-view .portfolio--bottom-left-text-left>.portfolio__image-1:after,.in-view .portfolio--bottom-left-text-left>.portfolio__image-3:after,.in-view .portfolio--bottom-left-text-right>.portfolio__image-1:after,.in-view .portfolio--bottom-left-text-right>.portfolio__image-3:after{inset-inline-end:100%;inset-inline-start:0}.in-view .portfolio--bottom-right-text-left>.portfolio__image:after,.in-view .portfolio--bottom-right-text-right>.portfolio__image:after{inset-inline-end:100%;inset-inline-start:0}.in-view .portfolio--bottom-right-text-left>.portfolio__image-1:after,.in-view .portfolio--bottom-right-text-left>.portfolio__image-3:after,.in-view .portfolio--bottom-right-text-right>.portfolio__image-1:after,.in-view .portfolio--bottom-right-text-right>.portfolio__image-3:after{inset-inline-end:0;inset-inline-start:100%}.in-view .portfolio--bottom-right-text-right-feature>.portfolio__image:after{inset-inline-end:100%;inset-inline-start:0}.in-view .portfolio--bottom-right-text-right-feature>.portfolio__image-1:after{inset-block-start:100%;inset-inline-end:0;inset-inline-start:0}.in-view .portfolio--bottom-right-text-right-feature>.portfolio__image-3:after{inset-inline-end:0;inset-inline-start:100%}.portfolio__image:after{transition-delay:.2s!important}.portfolio__image-1:after{transition-delay:.1s!important}.portfolio__image-2:after{transition-delay:.2s!important}.portfolio__image-3:after{transition-delay:.4s!important}