.hanlyn-shop-pattern{--sp-tile-size: 216px;--sp-gap: 32px;background-color:#f1f7f8;overflow:visible}.hanlyn-shop-pattern__container{max-width:var(--hanlyn-layout-page-width);margin:0 auto;padding-left:var(--hanlyn-page-gutter);padding-right:var(--hanlyn-page-gutter)}.hanlyn-shop-pattern__header{text-align:center;margin-bottom:48px}.hanlyn-shop-pattern__heading{font-family:var(--hanlyn-font-heading);font-size:48px;line-height:1.2;color:var(--hanlyn-color-text-primary);margin:0 0 16px}.hanlyn-shop-pattern__subheading{font-family:var(--hanlyn-font-body);font-size:16px;line-height:1.6;color:var(--hanlyn-color-text-primary);margin:0}.hanlyn-shop-pattern__carousel{position:relative;display:flex;flex-direction:column;align-items:center;gap:24px}.hanlyn-shop-pattern__arrow{position:absolute;top:calc(var(--sp-tile-size) / 2);transform:translateY(-50%);z-index:2;width:48px;height:48px;display:flex;align-items:center;justify-content:center;background-color:var(--hanlyn-color-background);border:1px solid var(--hanlyn-color-border);border-radius:50%;color:var(--hanlyn-color-text-primary);cursor:pointer;transition:all .2s ease;flex-shrink:0}.hanlyn-shop-pattern__arrow:hover{background-color:var(--hanlyn-color-navy);border-color:var(--hanlyn-color-navy);color:var(--hanlyn-color-text-on-navy)}.hanlyn-shop-pattern__arrow:focus-visible{outline:2px solid var(--hanlyn-color-navy);outline-offset:2px}.hanlyn-shop-pattern__arrow--prev{left:40px}.hanlyn-shop-pattern__arrow--next{right:40px}.hanlyn-shop-pattern__arrow svg{width:24px;height:24px;display:block}.hanlyn-shop-pattern__track-container{width:100%;max-width:100%;overflow-x:hidden;overflow-y:visible;position:relative;padding:0}.hanlyn-shop-pattern__track{display:flex;align-items:flex-start;justify-content:flex-start;gap:var(--sp-gap);transition:transform .4s cubic-bezier(.25,.46,.45,.94);will-change:transform;touch-action:pan-y pinch-zoom;cursor:grab}.hanlyn-shop-pattern__track:active{cursor:grabbing}.hanlyn-shop-pattern__item{flex-shrink:0;width:var(--sp-tile-size);display:flex;flex-direction:column;align-items:center;gap:16px}.hanlyn-shop-pattern__card{display:block;width:var(--sp-tile-size);height:var(--sp-tile-size);border-radius:50%;overflow:hidden;border:2px solid var(--hanlyn-color-border-subtle);text-decoration:none;transition:border-color .2s ease,box-shadow .2s ease;background-color:var(--hanlyn-color-surface-warm)}.hanlyn-shop-pattern__card:hover{border-color:var(--hanlyn-color-navy);box-shadow:0 4px 12px #31527033}.hanlyn-shop-pattern__card:focus-visible{outline:2px solid var(--hanlyn-color-navy);outline-offset:4px}.hanlyn-shop-pattern__label{font-family:var(--hanlyn-font-body);font-size:16px;font-weight:var(--hanlyn-font-weight-bold);line-height:1.3;color:var(--hanlyn-color-text-primary);text-align:center;margin:0}.hanlyn-shop-pattern__item--active .hanlyn-shop-pattern__card{border-color:var(--hanlyn-color-navy)}.hanlyn-shop-pattern--embedded{background-color:transparent}.hanlyn-shop-pattern--embedded .hanlyn-shop-pattern__label{font-weight:var(--hanlyn-font-weight-regular)}.hanlyn-shop-pattern--embedded .hanlyn-shop-pattern__item--active .hanlyn-shop-pattern__label{font-weight:var(--hanlyn-font-weight-bold)}.hanlyn-shop-pattern__card img{width:100%;height:100%;object-fit:cover;display:block}.hanlyn-shop-pattern__placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background-color:var(--hanlyn-color-surface-subtle)}.hanlyn-shop-pattern__placeholder svg{width:50%;height:50%;opacity:.3}.hanlyn-shop-pattern__actions{display:flex;justify-content:center;margin-top:8px}.hanlyn-shop-pattern__button{display:inline-flex;align-items:center;justify-content:center;padding:14px 32px;background-color:var(--hanlyn-color-navy);color:var(--hanlyn-color-text-on-navy);border:1.5px solid var(--hanlyn-color-navy);font-family:var(--hanlyn-font-body);font-size:13px;font-weight:var(--hanlyn-font-weight-bold);text-transform:uppercase;letter-spacing:.08em;text-decoration:none;border-radius:6px;transition:background-color .2s ease,color .2s ease,transform .2s ease}.hanlyn-shop-pattern__button:after{box-shadow:none!important}.hanlyn-shop-pattern__button:hover{background-color:var(--hanlyn-color-teal);border-color:var(--hanlyn-color-teal);transform:translateY(-1px)}.hanlyn-shop-pattern__button:focus-visible{outline:2px solid var(--hanlyn-color-navy);outline-offset:2px}.hanlyn-shop-pattern__empty{text-align:center;padding:60px 20px;color:var(--hanlyn-color-text-primary);opacity:.6}@media screen and (min-width:1440px){.hanlyn-shop-pattern__carousel{max-width:1220px;margin:0 auto}.hanlyn-shop-pattern__track-container{max-width:1100px;margin:0 auto}.hanlyn-shop-pattern__arrow--prev{left:0}.hanlyn-shop-pattern__arrow--next{right:0}}@media screen and (max-width:1200px){.hanlyn-shop-pattern{--sp-tile-size: 168px;--sp-gap: 24px}.hanlyn-shop-pattern__arrow--prev{left:30px}.hanlyn-shop-pattern__arrow--next{right:30px}}@media screen and (max-width:989px){.hanlyn-shop-pattern{--sp-tile-size: 132px}.hanlyn-shop-pattern__heading{font-size:36px}.hanlyn-shop-pattern__arrow{width:40px;height:40px}.hanlyn-shop-pattern__arrow--prev{left:20px}.hanlyn-shop-pattern__arrow--next{right:20px}.hanlyn-shop-pattern__arrow svg{width:20px;height:20px}}@media screen and (max-width:749px){.hanlyn-shop-pattern__container{padding-left:20px;padding-right:20px}.hanlyn-shop-pattern__header{margin-bottom:32px}.hanlyn-shop-pattern__heading{font-size:28px}.hanlyn-shop-pattern__subheading{font-size:14px}.hanlyn-shop-pattern{--sp-tile-size: 120px;--sp-gap: 20px}.hanlyn-shop-pattern__track-container{overflow-x:clip}.hanlyn-shop-pattern__track{cursor:default}.hanlyn-shop-pattern__card img{pointer-events:none;-webkit-user-drag:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.hanlyn-shop-pattern__card{-webkit-tap-highlight-color:rgba(0,0,0,.05)}.hanlyn-shop-pattern__label{font-size:14px}.hanlyn-shop-pattern__button{padding:12px 24px;font-size:12px}}@media(prefers-reduced-motion:reduce){.hanlyn-shop-pattern__track,.hanlyn-shop-pattern__item,.hanlyn-shop-pattern__arrow,.hanlyn-shop-pattern__button{transition:none}}@media screen and (min-width:990px){.hanlyn-shop-pattern:not(.hanlyn-shop-pattern--embedded) .hanlyn-shop-pattern__container{max-width:none;width:100%;margin-left:0;margin-right:0;padding-left:0;padding-right:0}.hanlyn-shop-pattern:not(.hanlyn-shop-pattern--embedded) .hanlyn-shop-pattern__header{max-width:var(--hanlyn-layout-page-width);margin-left:auto;margin-right:auto;padding-left:var(--hanlyn-page-gutter);padding-right:var(--hanlyn-page-gutter);text-align:center}.hanlyn-shop-pattern:not(.hanlyn-shop-pattern--embedded) .hanlyn-shop-pattern__carousel{max-width:none;width:100%;margin-left:0;margin-right:0}.hanlyn-shop-pattern:not(.hanlyn-shop-pattern--embedded) .hanlyn-shop-pattern__track-container{max-width:none;width:100%;margin-left:0;margin-right:0}.hanlyn-shop-pattern:not(.hanlyn-shop-pattern--embedded) .hanlyn-shop-pattern__arrow{top:calc(var(--sp-tile-size) / 2);transform:translateY(-50%);z-index:3;width:48px;height:48px;background-color:#fff;border:1px solid rgba(var(--color-foreground, 26, 26, 26),.12);box-shadow:0 2px 10px rgba(var(--color-shadow, 18, 18, 18),.14);transition:background-color .2s ease,border-color .2s ease,color .2s ease,box-shadow .2s ease}.hanlyn-shop-pattern:not(.hanlyn-shop-pattern--embedded) .hanlyn-shop-pattern__arrow:hover{background-color:var(--hanlyn-color-navy);border-color:var(--hanlyn-color-navy);color:var(--hanlyn-color-text-on-navy);box-shadow:0 4px 16px rgba(var(--color-shadow, 18, 18, 18),.24)}.hanlyn-shop-pattern:not(.hanlyn-shop-pattern--embedded) .hanlyn-shop-pattern__arrow--prev{left:32px}.hanlyn-shop-pattern:not(.hanlyn-shop-pattern--embedded) .hanlyn-shop-pattern__arrow--next{right:32px}}.hanlyn-shop-pattern:not(.hanlyn-shop-pattern--embedded) .hanlyn-shop-pattern__track-container{cursor:grab}.hanlyn-shop-pattern:not(.hanlyn-shop-pattern--embedded) .hanlyn-shop-pattern__track-container.is-dragging{cursor:grabbing;user-select:none;-webkit-user-select:none}.hanlyn-shop-pattern:not(.hanlyn-shop-pattern--embedded) .hanlyn-shop-pattern__track-container.is-dragging .hanlyn-shop-pattern__track{cursor:grabbing}.hanlyn-shop-pattern:not(.hanlyn-shop-pattern--embedded) .hanlyn-shop-pattern__card img{-webkit-user-drag:none;user-select:none;-webkit-user-select:none}
/*# sourceMappingURL=/cdn/shop/t/15/assets/component-shop-by-pattern.css.map */