@view-transition{navigation:auto}::view-transition-old(root),::view-transition-new(root){animation-duration:.28s}@media(prefers-reduced-motion:reduce){@view-transition{navigation:none}}.pup-proteins{--pp-forest: #285943;--pp-coral: #e98370;--pp-ease: cubic-bezier(.22, 1, .36, 1);--pp-w: 196px;--pp-h: 136px;display:block;padding-top:5px}.pup-proteins__head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:12px}.pup-proteins__heading{margin:0;color:var(--pp-forest);font-size:22px;line-height:1.2;letter-spacing:0;text-transform:none}.pup-proteins__arrows{display:flex;gap:8px}.pup-proteins__arrow{display:grid;place-items:center;width:38px;height:38px;padding:0;border:1.5px solid rgba(40,89,67,.3);border-radius:50%;background:#fff;color:var(--pp-forest);cursor:pointer;transition:background-color .2s ease,color .2s ease,opacity .2s ease,transform .2s var(--pp-ease)}.pup-proteins__arrow svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.pup-proteins__arrow:hover:not(:disabled){background:var(--pp-forest);color:#fff}.pup-proteins__arrow:active:not(:disabled){transform:scale(.92)}.pup-proteins__arrow:disabled{opacity:.35;cursor:default}.pup-proteins__arrow:focus-visible{outline:2px solid var(--pp-coral);outline-offset:2px}.pup-proteins__list{display:flex;gap:12px;margin:0 -8px;padding:8px;overflow-x:auto;list-style:none;scroll-snap-type:x proximity;scroll-padding-inline:8px;scrollbar-width:none;-webkit-mask-image:linear-gradient(90deg,transparent,#000 24px,#000 calc(100% - 40px),transparent);mask-image:linear-gradient(90deg,transparent,#000 24px,#000 calc(100% - 40px),transparent)}.pup-proteins.is-start .pup-proteins__list{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 40px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 40px),transparent)}.pup-proteins.is-start.is-end .pup-proteins__list{-webkit-mask-image:none;mask-image:none}.pup-proteins__list::-webkit-scrollbar{display:none}.pup-proteins__list>li{flex:0 0 auto;margin:0;scroll-snap-align:center}.pup-proteins__tile{--pp-tint: #f3e6d3;position:relative;display:block;overflow:hidden;width:var(--pp-w);height:var(--pp-h);border-radius:18px;background:var(--pp-tint);color:var(--pp-forest);text-decoration:none;isolation:isolate;transition:transform .35s var(--pp-ease),box-shadow .35s var(--pp-ease)}.pup-proteins__list>li:nth-child(4n+2) .pup-proteins__tile{--pp-tint: #f9dfd6}.pup-proteins__list>li:nth-child(4n+3) .pup-proteins__tile{--pp-tint: #dfe9df}.pup-proteins__list>li:nth-child(4n+4) .pup-proteins__tile{--pp-tint: #efe4c9}.pup-proteins__tile:not(.pup-proteins__tile--all):before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;border:1.5px solid color-mix(in srgb,var(--pp-tint) 58%,var(--pp-forest));border-radius:inherit;pointer-events:none}.pup-proteins__img{position:absolute;right:-10%;bottom:-14%;z-index:-1;width:78%;height:auto;mix-blend-mode:multiply;transform:rotate(-10deg);transition:transform .5s var(--pp-ease)}.pup-proteins__text{position:absolute;top:0;right:0;bottom:0;left:0;padding:14px 12px 12px 16px}.pup-proteins__label{display:block;font-family:var(--element-text-font-family--heading),var(--element-text-font-family-fallback--heading, sans-serif);font-size:21px;font-weight:var(--element-text-font-weight--heading, 600);line-height:1.05}.pup-proteins__desc{display:-webkit-box;max-width:72%;margin-top:3px;overflow:hidden;color:currentColor;font-size:12px;font-weight:600;line-height:1.3;opacity:.72;-webkit-box-orient:vertical;-webkit-line-clamp:2}.pup-proteins__count{--pp-dot: rgba(255, 255, 255, .88);--pp-num: var(--pp-forest);position:absolute;left:0;bottom:0;display:grid;place-items:end start;width:54px;height:54px;padding:0 0 11px 14px;color:var(--pp-num);font-size:14px;font-weight:800;font-variant-numeric:tabular-nums;line-height:1;transition:color .3s ease}.pup-proteins__count:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1;border-top-right-radius:100%;background:var(--pp-dot);transform-origin:0 100%;transition:transform .5s var(--pp-ease),background-color .3s ease}.pup-proteins__tile:hover .pup-proteins__count{--pp-num: #fff}.pup-proteins__tile:hover .pup-proteins__count:before{--pp-dot: var(--pp-coral);transform:scale(1.22)}.pup-proteins__tile:hover{transform:translate(-3px,-3px);box-shadow:4px 4px 0 var(--pp-forest)}.pup-proteins__tile:hover .pup-proteins__img{transform:rotate(0) scale(1.1) translate(-4%,-6%)}.pup-proteins__tile:active{transform:translate(0);box-shadow:1px 1px 0 var(--pp-forest);transition-duration:.1s}.pup-proteins__tile--all{--pp-tint: var(--pp-forest);color:#fffaf3;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='56' viewBox='0 0 24 24' fill='%23fffaf3' fill-opacity='.08'%3E%3Cellipse cx='5.4' cy='10.4' rx='1.9' ry='2.5'/%3E%3Cellipse cx='9.3' cy='6.3' rx='2' ry='2.7'/%3E%3Cellipse cx='14.7' cy='6.3' rx='2' ry='2.7'/%3E%3Cellipse cx='18.6' cy='10.4' rx='1.9' ry='2.5'/%3E%3Cpath d='M12 11.3c2.7 0 5.9 3.3 5.9 6.1 0 1.9-1.3 3-3 3-1.2 0-1.8-.6-2.9-.6s-1.7.6-2.9.6c-1.7 0-3-1.1-3-3 0-2.8 3.2-6.1 5.9-6.1Z'/%3E%3C/svg%3E");background-position:0 0;transition:transform .35s var(--pp-ease),box-shadow .35s var(--pp-ease),background-position 1.2s var(--pp-ease)}.pup-proteins__tile--all:hover{background-position:28px -28px;box-shadow:4px 4px 0 var(--pp-coral)}.pup-proteins__tile--all.is-current:hover{box-shadow:0 0 0 2px #fffaf3,0 0 0 4px var(--pp-forest),7px 7px 0 var(--pp-coral)}.pup-proteins__tile--all .pup-proteins__count{--pp-dot: rgba(255, 250, 243, .18);--pp-num: #fffaf3}.pup-proteins__tile.pup-proteins__tile--all:hover .pup-proteins__count{--pp-num: var(--pp-forest)}.pup-proteins__tile.pup-proteins__tile--all:hover .pup-proteins__count:before{--pp-dot: #fffaf3}.pup-proteins__tile--photo{color:#fff}.pup-proteins__tile--photo .pup-proteins__img{top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;mix-blend-mode:normal;transform:none}.pup-proteins__tile--photo:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1;background:linear-gradient(160deg,#141e188c,#141e1800 60%)}.pup-proteins__tile--photo:hover .pup-proteins__img{transform:scale(1.06)}.pup-proteins__tile.is-current{box-shadow:0 0 0 2px #fffaf3,0 0 0 4px var(--pp-forest)}.pup-proteins__tile.is-current:hover{box-shadow:0 0 0 2px #fffaf3,0 0 0 4px var(--pp-forest),7px 7px 0 var(--pp-forest)}.pup-proteins__tile.is-current .pup-proteins__count{--pp-dot: var(--pp-coral);--pp-num: #fff}.pup-proteins__tile:focus-visible{outline:none;box-shadow:0 0 0 2px #fffaf3,0 0 0 4px var(--pp-coral)}@media(min-width:990px){.pup-proteins{--pp-w: clamp(220px, 16.5vw, 280px);--pp-h: calc(var(--pp-w) * .68)}.pup-proteins__list{gap:16px}.pup-proteins__text{padding:18px 16px 16px 20px}.pup-proteins__label{font-size:clamp(22px,1.7vw,27px)}.pup-proteins__desc{margin-top:5px;font-size:13.5px}.pup-proteins__count{width:68px;height:68px;padding:0 0 14px 18px;font-size:17px}}@media(max-width:749px){.pup-proteins{--pp-w: clamp(136px, 37vw, 176px);--pp-h: calc(var(--pp-w) * .68);padding-top:5px}.pup-proteins__head{margin-bottom:6px}.pup-proteins__heading{font-size:19px}.pup-proteins__arrows{display:none}.pup-proteins__list{gap:10px;margin-right:calc(var(--page-width-gutter, 17px) * -1)}.pup-proteins__text{padding:10px 10px 9px 12px}.pup-proteins__label{font-size:16.5px}.pup-proteins__desc{max-width:90%;font-size:10.5px}.pup-proteins__count{width:44px;height:44px;padding:0 0 9px 11px;font-size:12px}}@media(prefers-reduced-motion:reduce){.pup-proteins__tile,.pup-proteins__img{transition:none}}.pup-proteins__list>li[hidden]{display:none}.pup-proteins__tile--image-only:after{content:none}
/*# sourceMappingURL=/cdn/shop/t/97/assets/pup-protein-row.css.map */
