.collection-circles{background-color:rgba(var(--color-background),1);background-image:var(--color-background-gradient);color:rgba(var(--color-text),1);overflow:hidden}ul.collection-circles-list{list-style:none;padding:.5rem;margin:-.5rem 0;display:flex;overflow-x:auto;flex-wrap:nowrap;scroll-snap-type:x mandatory;text-align:center;-ms-overflow-style:auto;color:#fff}ul.collection-circles-list::-webkit-scrollbar{display:none}ul.collection-circles-list li{flex-basis:1;flex-shrink:0;scroll-snap-align:start}.collection-circles-list li a{display:block;padding:.5rem;border-radius:var(--border-radius);outline-offset:-2px}.collection-circles-list li .img-wrapper{position:relative;overflow:hidden;margin:0 0 .25rem}.collection-circles-list li .img-wrapper img{border-radius:50rem;transition:all .2s ease-out}.collection-circles-list li a:hover .img-wrapper img{opacity:.9}.collection-circles-list li a:active .img-wrapper img{opacity:.5}.collection-circles-list .img-wrapper:after{content:"";background-color:rgba(var(--color-accent),.5);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='%23fff' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolygon points='12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2'%3E%3C/polygon%3E%3C/svg%3E");background-size:60%;background-repeat:no-repeat;background-position:center;width:32px;height:32px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(0);opacity:0;visibility:hidden;border-radius:50%;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.collection-circles-list .active .img-wrapper:after{visibility:visible;animation:collection_circles_active_item .4s ease-out both;animation-delay:.6s}@keyframes collection_circles_active_item{to{transform:translate(-50%,-50%) scale(1);opacity:1}}.collection-circles-list li .heading{margin:0 auto;max-width:var(--img-size);color:#fff;display:none}.collection-circles-list li .placeholder-svg{background-color:rgba(var(--color-text),.05);width:var(--img-size);height:var(--img-size);border-radius:50%}@media(max-width:1199px){.collection-circles{padding-top:calc(var(--padding-top) * .75);padding-bottom:calc(var(--padding-bottom) * .75)}.collection-circles .container{padding-left:0;padding-right:0;max-width:none}ul.collection-circles-list li{width:29vw}.collection-circles-list li .img-wrapper img{width:100%}}@media(min-width:600px)and (max-width:999px){ul.collection-circles-list li{width:19vw}}@media(min-width:1000px)and (max-width:1199px){ul.collection-circles-list li{width:14vw}}@media(min-width:1200px){.collection-circles{padding-top:calc(var(--padding-top) * 1);padding-bottom:calc(var(--padding-bottom) * 1)}}.brand-marquee-outer{overflow:hidden;position:relative}.brand-marquee-outer:before,.brand-marquee-outer:after{content:"";position:absolute;top:0;width:80px;height:100%;z-index:2;pointer-events:none}.brand-marquee-outer:before{left:0;background:linear-gradient(to right,#ffffff,transparent)}.brand-marquee-outer:after{right:0;background:linear-gradient(to left,#ffffff,transparent)}.brand-marquee-track{display:flex;gap:28px;width:max-content;animation:brandScroll 30s linear infinite}.brand-marquee-outer:hover .brand-marquee-track{animation-play-state:paused}@keyframes brandScroll{0%{transform:translate(0)}to{transform:translate(-50%)}}.brand-marquee-item{display:flex;flex-direction:column;align-items:center;gap:8px;text-decoration:none;min-width:100px}.brand-marquee-item .brand-img-wrap{width:90px;height:90px;border-radius:50%;border:1px solid #e8e8e8;background:#f8f8f8;overflow:hidden;display:flex;align-items:center;justify-content:center;transition:transform .2s,border-color .2s}.brand-marquee-item:hover .brand-img-wrap{transform:scale(1.06);border-color:#ccc}.brand-marquee-item .brand-img-wrap img{width:80px;height:80px;object-fit:contain;border-radius:50%}.brand-marquee-item .brand-name{font-size:12px;font-weight:500;color:#666;text-align:center;white-space:nowrap}
/*# sourceMappingURL=/cdn/shop/t/7/assets/collection-circles.css.map */
