.portfolio-item{--item-height:43.75vw;--small-value:5%;--large-value:7.5%;--padding-left:var(--small-value);--padding-right:var(--large-value);overflow:hidden;padding-block:5%;padding-left:var(--padding-left);padding-right:var(--padding-right);position:relative}@media(min-width:1280px){.portfolio-item{--small-value:10%;--large-value:15%}}.portfolio-item.even{--padding-left:var(--large-value);--padding-right:var(--small-value)}.portfolio-date{backface-visibility:hidden;color:#000;display:none;font-family:Maison Neue Mono,Maison Neue Mono fallback,monospace;font-size:var(--font-size-xl);font-weight:400;letter-spacing:.03em;max-width:50px;position:absolute;right:0;text-transform:uppercase;top:15px;z-index:12}@media(min-width:768px){.portfolio-date{display:block}}.portfolio-thumb__image,.portfolio-thumb__placeholder{aspect-ratio:3/2;background:linear-gradient(135deg,#667eea,#764ba2);display:block;height:100%;max-width:100%;min-height:var(--item-height);-o-object-fit:cover;object-fit:cover;transition:max-width .5s ease;width:100%}.portfolio-item__link{background:#f7f7f7;border:none;display:grid;place-items:center;position:relative;text-decoration:none;z-index:var(--z-index-normal)}.portfolio-title{--line-height:36px;color:#fff;font-weight:400;line-height:var(--line-height);margin-top:0;position:relative;text-decoration:none;transition:transform .5s ease,color .75s ease;z-index:3}.active .portfolio-title{--color:transparent;color:var(--color)}@media(min-width:768px){.active .portfolio-title{--color:#000}}.portfolio-item:not(.active) .portfolio-title{--translateY:calc((var(--line-height) + var(--item-height))/2 + var(--line-height)/2);transform:translateY(var(--translateY))}.project-info{bottom:0;display:flex;flex-flow:column nowrap;font-size:var(--font-size-xs);height:auto;justify-content:center;max-height:calc(100% - 5rem);max-width:36rem;min-width:19rem;opacity:0;pointer-events:none;position:absolute;right:var(--padding-right,10%);top:5rem;transition:opacity .5s ease;transition-delay:.5s;width:40%;z-index:var(--z-index-foreground)}.project-info dl{margin:0}.project-info dt{font-weight:700}.project-info dt:not(:first-child){margin-top:var(--space-4)}.project-info dd{letter-spacing:.05em;margin:0;opacity:.5}.portfolio-item.active .portfolio-thumb:before{transform:translateY(-50rem)}.portfolio-item.opened .portfolio-thumb__image,.portfolio-item.opened .portfolio-thumb__placeholder,.portfolio-item.opened img{max-width:40%}.portfolio-item.opened .project-info{opacity:1;pointer-events:auto}.portfolio-thumb{line-height:0;overflow:hidden;position:relative;width:100%;z-index:1}.portfolio-thumb:before{background-color:#afafaf;content:"";display:block;height:100%;inset:0;position:absolute;transition:transform .4s ease;width:100%;z-index:2}.portfolio-item footer{color:#222;display:flex;flex-flow:row nowrap;font-size:var(--font-size-xs);font-weight:400;justify-content:space-between;margin-top:var(--space-2);opacity:.5}.portfolio-item footer div{align-items:flex-start;display:flex;flex-flow:column nowrap}@media(max-width:767px){.footer-actions:is(.portfolio-item footer div){display:none}}.portfolio-item footer *{margin:0;padding:0}.footer-title{color:#000;font-size:var(--font-size-xs);font-weight:700;letter-spacing:.05em;text-transform:uppercase}.footer-function{color:inherit}.portfolio-item footer a{color:inherit;text-decoration:none}.portfolio-item footer .footer-function,.portfolio-item footer .footer-title,.portfolio-item footer .more-info,.portfolio-item footer a{line-height:1.25rem}.more-info{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:none;color:inherit;cursor:pointer;font-weight:600;height:auto;margin:0;min-height:0;padding:0}
