.portfolio-hub-section{background:var(--paper, #f3efe3)}.template-suffix-portfolio .site-footer-section,.template-suffix-packaging-designer-portfolio .site-footer-section,.template-suffix-pf-6a78496b .site-footer-section{background:#f3efe3}.portfolio-hub{--hub-black: #090a08;--hub-paper: #f3efe3;--hub-white: #fff;--hub-red: #ef2b22;display:grid;gap:clamp(.65rem,1vw,1rem);padding:0 var(--ynt-shell-gutter, 1rem) clamp(2rem,5vw,5rem);overflow:clip;color:var(--hub-black)}.portfolio-hub__hero,.portfolio-hub__grid{width:min(100%,var(--ynt-shell-max, 88rem));margin-inline:auto}.portfolio-hub__hero{margin-top:var(--ynt-shell-gutter, 1rem);min-height:clamp(20rem,36vw,32rem);display:grid;grid-template-columns:minmax(0,.9fr) minmax(32rem,1.1fr);gap:clamp(2rem,4vw,4.5rem);align-items:end;padding:clamp(7rem,11vw,10rem) clamp(1.25rem,4.5vw,4.5rem) clamp(2rem,4.5vw,4rem);overflow:hidden;border-radius:1.75rem;background:var(--hub-black);color:var(--hub-white)}.portfolio-hub__hero-copy{min-width:0}.portfolio-hub__eyebrow{margin:0 0 1rem;font-size:clamp(.68rem,.75vw,.78rem);font-weight:750;line-height:1.2;letter-spacing:.01em;text-transform:uppercase}.portfolio-hub__title{max-width:10ch;margin:0;color:var(--hub-red);font-family:Instrument Sans,Arial,Helvetica,sans-serif;font-size:clamp(3.5rem,6.55vw,6.55rem);font-weight:900;line-height:.78;letter-spacing:-.075em;text-transform:uppercase;text-wrap:balance}.portfolio-hub__filter{position:relative;z-index:1;display:flex;width:max-content;max-width:100%;margin:0;justify-self:end;align-self:end;padding:0;gap:.4rem;overflow-x:auto;border:0;border-radius:0;background:transparent;box-shadow:none;scrollbar-width:none}.portfolio-hub__filter::-webkit-scrollbar{display:none}.portfolio-hub__filter-button{flex:0 0 auto;min-height:2.45rem;padding:.58rem .8rem;border:1px solid rgba(255,255,255,.7);border-radius:999px;background:var(--hub-black);color:var(--hub-white);font:inherit;font-size:.76rem;font-weight:700;line-height:1;white-space:nowrap;cursor:pointer;transition:color .2s ease,background-color .2s ease}.portfolio-hub__filter-button:is(:hover,:focus-visible),.portfolio-hub__filter-button.is-active{border-color:var(--hub-red);background:var(--hub-red)}.portfolio-hub__filter-button:focus-visible{outline:2px solid var(--hub-white);outline-offset:2px}.portfolio-hub__grid{column-count:3;column-gap:clamp(.55rem,.85vw,.85rem)}.portfolio-card[hidden]{display:none}.portfolio-card{display:inline-block;width:100%;margin:0 0 clamp(.55rem,.85vw,.85rem);break-inside:avoid;vertical-align:top}.portfolio-card__link{position:relative;display:block;overflow:hidden;border-radius:clamp(.85rem,1.15vw,1.2rem);background:#d9d8d1;color:var(--hub-white);text-decoration:none;isolation:isolate}.portfolio-card__media{position:relative;margin:0;overflow:hidden}.portfolio-card__media img{position:static;display:block;width:100%;height:auto;object-fit:contain;transition:transform .65s cubic-bezier(.2,.72,.2,1),filter .4s ease}.portfolio-card__meta{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;display:flex;gap:1rem;align-items:flex-end;justify-content:space-between;padding:clamp(.9rem,1.5vw,1.35rem);background:linear-gradient(to top,#090a08c7,#090a0800 58%);opacity:0;transform:translateY(.3rem);transition:opacity .25s ease,transform .32s cubic-bezier(.2,.72,.2,1);pointer-events:none}.portfolio-card__meta>div{min-width:0}.portfolio-card__descriptor{margin:0 0 .38rem;color:#ffffffc7;font-size:.64rem;font-weight:750;line-height:1.15;letter-spacing:.035em;text-transform:uppercase}.portfolio-card h3{max-width:18ch;margin:0;font-family:Instrument Sans,Arial,Helvetica,sans-serif;font-size:clamp(1rem,1.25vw,1.3rem);font-weight:850;line-height:.98;letter-spacing:-.045em;text-transform:uppercase;text-wrap:balance}.portfolio-card__arrow{flex:0 0 auto;display:grid;width:1.9rem;aspect-ratio:1;place-items:center;border:1px solid rgba(255,255,255,.7);border-radius:50%;color:var(--hub-white);font-size:.85rem;line-height:1;transition:color .25s ease,background-color .25s ease,transform .25s ease}.portfolio-card__link:is(:hover,:focus-visible) .portfolio-card__meta{opacity:1;transform:translateY(0)}.portfolio-card__link:is(:hover,:focus-visible) .portfolio-card__media img{transform:scale(1.025);filter:saturate(.92) brightness(.9)}.portfolio-card__link:is(:hover,:focus-visible) .portfolio-card__arrow{background:var(--hub-red);border-color:var(--hub-red);transform:translate(.08rem,-.08rem)}.portfolio-card__link:focus-visible{outline:3px solid var(--hub-red);outline-offset:3px}@media(max-width:999px){.portfolio-hub__hero{grid-template-columns:1fr;gap:1.35rem}.portfolio-hub__filter{width:100%;max-width:none;justify-self:stretch}}@media(max-width:899px){.portfolio-hub__grid{column-count:2}}@media(max-width:599px){.portfolio-hub{gap:.55rem;padding-inline:var(--ynt-shell-gutter, 1rem)}.portfolio-hub__hero{min-height:20rem;gap:1rem;padding:7.25rem 1.15rem 1.6rem;border-radius:1.25rem}.portfolio-hub__eyebrow{margin-bottom:.8rem;font-size:.64rem}.portfolio-hub__title{width:100%;max-width:100%;font-size:clamp(3rem,15.5vw,4.35rem)}.portfolio-hub__filter{width:100%;max-width:none;margin:0;scroll-padding-inline:.3rem 2rem;scroll-snap-type:x proximity;-webkit-mask-image:linear-gradient(to right,#000 0,#000 calc(100% - 1.7rem),transparent 100%);mask-image:linear-gradient(to right,#000 0,#000 calc(100% - 1.7rem),transparent 100%)}.portfolio-hub__filter-button{min-height:2.35rem;padding-inline:.75rem;font-size:.72rem;scroll-snap-align:start}.portfolio-hub__grid{column-count:1;column-gap:0}.portfolio-card{margin-bottom:.55rem}.portfolio-card__link{border-radius:1rem}.portfolio-card__meta{padding:1rem}.portfolio-card h3{font-size:1.05rem}}@media(max-width:379px){.portfolio-hub__title{font-size:clamp(2.2rem,14vw,2.95rem)}}@media(hover:none),(pointer:coarse){.portfolio-card__meta{opacity:1;transform:none;background:linear-gradient(to top,#090a08ad,#090a0800 48%)}.portfolio-card__descriptor{display:none}}@media(prefers-reduced-motion:reduce){.portfolio-card__media img,.portfolio-card__meta,.portfolio-card__arrow,.portfolio-hub__filter-button{transition:none}}
/*# sourceMappingURL=/cdn/shop/t/36/assets/portfolio-hub.css.map */
