.image-cards{padding:var(--space-xs) 0}.image-cards .page-width{padding:0}.image-cards__grid{display:grid;grid-auto-flow:column;grid-auto-columns:var(--size-80-per-100);gap:var(--space-xs);padding:0 var(--space-xs);overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:0 var(--space-xs);scrollbar-width:none}.image-cards__grid::-webkit-scrollbar{display:none}.image-cards__card{position:relative;aspect-ratio:.74;overflow:hidden;border-radius:var(--border-radius-xxs);background-color:var(--color-gray-2);scroll-snap-align:start}.image-cards__card img{position:absolute;top:0;right:0;bottom:0;left:0;width:var(--size-100-per-100);height:var(--size-100-per-100);object-fit:cover;object-position:var(--size-50-per-100) var(--size-50-per-100)}.image-cards__card:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:var(--gradient-bottom-black);pointer-events:none}.image-cards__content{position:absolute;inset:auto 0 0;z-index:1;display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-xxs);padding:var(--space-xs);color:var(--color-gray-1);font-family:var(--typo-family)}.image-cards__card-title{margin:0;color:var(--color-gray-1);font-family:var(--typo-family);font-size:var(--typo-heading-3);font-weight:var(--font-weight-900);line-height:var(--typo-line-height-120);letter-spacing:calc(var(--typo-heading-letter-spacing-base) * 2);text-transform:uppercase}.image-cards__description,.image-cards__description p{margin:0;color:var(--color-gray-1);font-size:var(--typo-body-l);font-weight:var(--font-weight-400);line-height:var(--typo-line-height-150)}.image-cards__button{display:flex;justify-content:center;align-items:center;padding:var(--space-xs) var(--space-m);border-radius:var(--border-radius-xxs);background:var(--color-primary-5);color:var(--color-gray-1);text-decoration:none;align-self:stretch}.image-cards__button:hover{background:var(--color-primary-6);transition:background-color var(--transition-duration-03s),color var(--transition-duration-03s)}@media only screen and (min-width:750px){.image-cards__grid{grid-auto-columns:var(--size-45-per-100)}.image-cards__button{align-self:flex-start}}@media only screen and (min-width:990px){.image-cards{padding:var(--space-m) 0}.image-cards .page-width{padding:0 calc(var(--space-s) - var(--space-4xs))}.image-cards__grid{grid-auto-flow:row;grid-template-columns:repeat(4,1fr);padding:0;overflow:visible}}
/*# sourceMappingURL=/cdn/shop/t/31/assets/image-cards.css.map */
