.co-blog-hero{position:relative;isolation:isolate;overflow:clip;background-color:var(--co-cream);padding-block:clamp(32px,5vw,64px)}.co-blog-hero-inner{position:relative;z-index:1;max-width:var(--page-width);margin-inline:auto;padding-inline:var(--page-margin)}.co-blog-hero-header{margin-bottom:clamp(24px,4vw,52px);text-align:center}.co-blog-hero-heading{margin:0;color:var(--co-black);font-size:clamp(35px,6.4vw,74px);line-height:1}.co-blog-hero-cards{display:block}.co-blog-hero-cards-track{display:flex;justify-content:safe center;gap:clamp(14px,2vw,30px);overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-webkit-overflow-scrolling:touch;padding:10px 0;margin-inline:0px}.co-blog-hero-cards-track::-webkit-scrollbar{display:none}.co-blog-hero-card{flex:0 0 auto;width:clamp(116px,12vw,178px);display:flex;flex-direction:column;align-items:center;gap:10px;cursor:pointer;text-decoration:none!important;color:var(--co-black)}.co-blog-hero-card-frame{display:block;position:relative;width:100%;height:0;padding-bottom:100%;transition:transform .25s var(--co-anim-ease, ease)}.co-blog-hero .co-svg-mask-border-1{z-index:2;pointer-events:none}.co-blog-hero-card.is-active .co-svg-mask-border-1{color:var(--co-purple)!important;stroke-width:6px!important;overflow:visible}#co-mask-border-1{overflow:visible}.co-blog-hero-card.is-active .co-blog-hero-card-label{color:var(--co-purple)}.co-blog-hero-card-mask{--co-mask-border-width: .4%;top:var(--co-mask-border-width);left:var(--co-mask-border-width);width:calc(100% - var(--co-mask-border-width) * 2);height:calc(100% - var(--co-mask-border-width) * 2);overflow:hidden;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-position:center center;mask-position:center center}.co-blog-hero-card-mask>div{background-color:var(--co-blue-light)}.co-blog-hero-card-mask img{width:100%;height:100%;object-fit:cover}.co-blog-hero-card-label{text-align:center;font-size:clamp(13px,1.3vw,17px);line-height:1.1;text-transform:uppercase}@media(hover:hover){.co-blog-hero-card:hover .co-blog-hero-card-frame{transform:scale(1.04)}}@media(prefers-reduced-motion:reduce){.co-blog-hero-card-frame{transition:none}}
/*# sourceMappingURL=/cdn/shop/t/30/assets/co-styles-blog-hero.css.map */