.shop-by-goal-hexagons__hexagons-wrapper{margin-top:10rem;margin-bottom:15rem;min-height:600px;position:relative}.shop-by-goal-hexagons__hexagon{position:absolute;width:317px;aspect-ratio:1;left:50%;top:50%;transform:translate(-50%,-50%);z-index:1;cursor:pointer;-webkit-user-select:none;user-select:none}.shop-by-goal-hexagons__hexagon.active{z-index:2}.shop-by-goal-hexagons__hexagon *{pointer-events:none;-webkit-user-select:none;user-select:none}.shop-by-goal-hexagons__hexagon:nth-child(1){transform:translate(-420px,-245px)}.shop-by-goal-hexagons__hexagon:nth-child(2){transform:translate(-50%,-30%)}.shop-by-goal-hexagons__hexagon:nth-child(3){transform:translate(102px,-245px)}.shop-by-goal-hexagons__hexagon-image-wrapper{position:relative;width:100%;aspect-ratio:1;z-index:1}.shop-by-goal-hexagons__hexagon-image-wrapper img{height:auto}.shop-by-goal-hexagons__hexagon-image-wrapper img:nth-child(3){position:absolute;width:100%;left:50%;top:50%;transform:translate(-50%,-50%) scale(1);z-index:10;transition:transform .3s ease,opacity .3s ease;opacity:0;pointer-events:none}.shop-by-goal-hexagons__hexagon.active .shop-by-goal-hexagons__hexagon-image-wrapper img:nth-child(3){transform:translate(-50%,-50%) scale(1.4);opacity:1;pointer-events:all}.shop-by-goal-hexagons__hexagon-image-wrapper img:nth-child(4){position:absolute;left:50%;bottom:0;transform:translate(-50%,-50%);transition:transform .3s ease,opacity .1s ease;height:197px;width:2px;opacity:0}.shop-by-goal-hexagons__hexagon.active .shop-by-goal-hexagons__hexagon-image-wrapper img:nth-child(4){transition:transform .3s .3s ease,opacity .3s .3s ease;transform:translate(-50%,calc(100% + 100px));opacity:1}.shop-by-goal-hexagons__hexagon-image-wrapper svg:first-child{position:absolute;width:100%;height:100%;left:0;top:0;z-index:1}.shop-by-goal-hexagons__hexagon-image-wrapper svg:nth-child(2){position:absolute;width:276px;height:240px;left:50%;top:50%;transform:translate(-50%,-50%);z-index:1}.shop-by-goal-hexagons__hexagon-title{position:absolute;left:50%;top:50%;max-width:200px;transform:translate(-50%,-50%);font-family:Proxima Nova Condensed;font-style:normal;font-weight:600;font-size:30px;line-height:100%;display:flex;align-items:center;text-align:center;text-transform:uppercase;color:rgb(var(--brand-color-dark-grey))}.shop-by-goal-hexagons__hexagon.active .shop-by-goal-hexagons__hexagon-title{z-index:4;top:unset;color:#fff;bottom:10px}.shop-by-goal-hexagons__hexagons-mobile-line{display:none}.shop-by-goal-hexagons__gradient-1{display:block!important;position:absolute;left:0;top:0;width:527.74px;height:667.04px;background:#96d6d5;opacity:.4;filter:blur(20rem);-webkit-filter:blur(20rem);transform:translateZ(0) rotate(-30deg) translate(-40%,-20%);pointer-events:none}.shop-by-goal-hexagons__gradient-2{display:block!important;position:absolute;right:0;top:0;width:527.74px;height:667.04px;background:#b60038;opacity:.1;filter:blur(20rem);-webkit-filter:blur(20rem);transform:translateZ(0) rotate(26.55deg) translate(100%,60%);pointer-events:none}@media screen and (max-width: 768px){.shop-by-goal-hexagons__hexagon{width:220px}.shop-by-goal-hexagons__hexagon-image-wrapper svg:nth-child(2){width:195px}.shop-by-goal-hexagons__hexagon-title{font-size:24px}.shop-by-goal-hexagons__hexagon:nth-child(1){transform:translate(-200px,-370px)}.shop-by-goal-hexagons__hexagon:nth-child(2){transform:translate(-25px,-265px)}.shop-by-goal-hexagons__hexagon:nth-child(3){transform:translate(-200px,-165px)}.shop-by-goal-hexagons__hexagon-image-wrapper img:nth-child(4){display:none!important}.shop-by-goal-hexagons__hexagons-mobile-line{display:block;position:absolute;left:50%;top:400px;width:2px;height:197px;transform:translate(-50%)}.shop-by-goal-hexagons__hexagons-wrapper{margin-bottom:4rem}.shop-by-goal-hexagons__gradient-1{width:362.03px;height:457.59px;opacity:.2;filter:blur(10rem);-webkit-filter:blur(10rem);transform:translateZ(0) rotate(-38.19deg) translate(-50%,-50%)}.shop-by-goal-hexagons__gradient-2{width:362.03px;height:457.59px;opacity:.1;filter:blur(10rem);-webkit-filter:blur(10rem);transform:translateZ(0) rotate(30deg) translate(150%,100%)}}
/*# sourceMappingURL=/cdn/shop/t/195/assets/section-shop-by-goal-page-hexagons.css.map */