.hf-cats{padding:28px 0}.hf-cats__head{margin-bottom:20px}.hf-cats__head .hf-title{font-size:32px}.hf-cats__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}.hf-cats__card{--cc-x: 50px;--cc-r: 20deg;display:flex;flex-direction:column;gap:8px;padding:12px 16px 8px;background:#f1ece4;border:0;border-radius:12px;color:inherit;text-decoration:none;transition:background-color .25s}.hf-cats__card:focus-visible{outline:3px solid var(--hf-green);outline-offset:3px}.hf-cats__card:hover,.hf-cats__card:focus-visible{background:#ece6dc}html.dark .hf-cats__card{background:var(--d-surface)}html.dark .hf-cats__card:hover,html.dark .hf-cats__card:focus-visible{background:var(--d-raised)}.hf-cats__stage{position:relative;display:block;height:180px;overflow:hidden}.hf-cats__cover{position:absolute;left:50%;bottom:8px;height:150px;width:auto;max-width:42%;object-fit:contain;border-radius:3px;box-shadow:0 2px 6px #14231b1f;transform-origin:50% 100%;transition:transform .3s;transform:translate(-50%)}.hf-cats__cover--1{z-index:2}.hf-cats__cover--2{z-index:1;transform:translate(calc(-50% - 10px)) rotate(-5deg)}.hf-cats__cover--3{z-index:1;transform:translate(calc(-50% + 10px)) rotate(5deg)}.hf-cats__caption{display:flex;align-items:center;justify-content:space-between;gap:var(--hf-s2);min-height:44px}.hf-cats__label{display:flex;flex-direction:column;min-width:0}.hf-cats__kicker{display:none}.hf-cats__title{font-family:var(--hf-font-display);font-weight:600;font-size:1.125rem;line-height:1.25;color:var(--hf-dark);overflow-wrap:break-word;-webkit-hyphens:auto;hyphens:auto}.hf-cats__arrow{flex:none;display:inline-flex;width:28px;height:28px;align-items:center;justify-content:center;color:var(--hf-green);transition:transform .25s}.hf-cats__arrow svg{width:20px;height:20px}.hf-cats__card:hover .hf-cats__arrow,.hf-cats__card:focus-visible .hf-cats__arrow{transform:translate(4px)}@media(prefers-reduced-motion:no-preference){.hf-cats__card:focus-visible .hf-cats__cover--1{transform:translate(-50%) translateY(-12px)}.hf-cats__card:focus-visible .hf-cats__cover--2{transform:translate(calc(-50% - var(--cc-x))) rotate(calc(-1 * var(--cc-r)))}.hf-cats__card:focus-visible .hf-cats__cover--3{transform:translate(calc(-50% + var(--cc-x))) rotate(var(--cc-r))}}@media(prefers-reduced-motion:no-preference)and (hover:hover){.hf-cats__card:hover .hf-cats__cover--1{transform:translate(-50%) translateY(-12px)}.hf-cats__card:hover .hf-cats__cover--2{transform:translate(calc(-50% - var(--cc-x))) rotate(calc(-1 * var(--cc-r)))}.hf-cats__card:hover .hf-cats__cover--3{transform:translate(calc(-50% + var(--cc-x))) rotate(var(--cc-r))}}@media(prefers-reduced-motion:reduce){.hf-cats__card:hover .hf-cats__arrow,.hf-cats__card:focus-visible .hf-cats__arrow{transform:none}}@media(max-width:1023px){.hf-cats__grid{gap:var(--hf-s4)}}@media(max-width:699px){.hf-cats{padding:0}.hf-cats__head{margin-bottom:8px}.hf-cats__head .hf-title{font-size:1.5rem;text-align:left}.hf-cats__head .hf-eyebrow,.hf-cats__head .hf-intro{display:none}.hf-cats__grid{display:grid;grid-template-columns:none;grid-auto-flow:column;grid-template-rows:repeat(2,190px);grid-auto-columns:150px;gap:12px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;scrollbar-width:none;margin-inline:calc(-1 * var(--hf-gut));padding:0 var(--hf-gut) 10px;scroll-padding-inline:var(--hf-gut);-webkit-overflow-scrolling:touch}.hf-cats__grid::-webkit-scrollbar{display:none}.hf-cats__card{height:190px;gap:6px;padding:10px;box-sizing:border-box;border-radius:10px;scroll-snap-align:start}.hf-cats__caption{order:-1;min-height:40px}.hf-cats__stage{height:120px}.hf-cats__cover{bottom:4px;height:100px;max-width:46%}.hf-cats__card:hover,.hf-cats__card:focus-visible{box-shadow:none}.hf-cats__card:hover .hf-cats__cover--1,.hf-cats__card:focus-visible .hf-cats__cover--1{transform:translate(-50%)}.hf-cats__card:hover .hf-cats__cover--2,.hf-cats__card:focus-visible .hf-cats__cover--2{transform:translate(calc(-50% - 10px)) rotate(-5deg)}.hf-cats__card:hover .hf-cats__cover--3,.hf-cats__card:focus-visible .hf-cats__cover--3{transform:translate(calc(-50% + 10px)) rotate(5deg)}.hf-cats__kicker{display:none}.hf-cats__title{font-size:.875rem;line-height:1.25;overflow-wrap:break-word;-webkit-hyphens:auto;hyphens:auto}.hf-cats__arrow{display:none}}.hf-cats{content-visibility:auto;contain-intrinsic-size:auto 820px}
/*# sourceMappingURL=/cdn/shop/t/37/assets/section-home-category-cards.css.map */