.media-cards__wrapper.section-card-wrapper--grid{gap:1.2rem}@media screen and (min-width:576px){.media-cards__wrapper.section-card-wrapper--grid{gap:2rem}}.js .media-cards[data-has-appearance-animation=true] .media-card{opacity:0;transform:translate3d(0,-20px,0)}.js .media-cards[data-has-appearance-animation=true].init-appearance-animation .media-card{animation-name:cardFadeInDown;animation-duration:1s;animation-timing-function:cubic-bezier(.19,1,.22,1);animation-delay:var(--entrance-animation-delay, .3s);animation-fill-mode:both}@property --mask-hole-radius{syntax: "<length>"; inherits: false; initial-value: 80px;}.media-card{width:100%;height:auto;position:relative;overflow:hidden;background-color:rgb(var(--color-background));border-radius:var(--border-radius-block);padding:2.4rem;display:flex;align-items:center;background:transparent}.media-card:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:4;width:100%;height:100%;border-radius:var(--border-radius-block);border:.1rem solid rgba(var(--color-foreground),.03);pointer-events:none;background:transparent}@media screen and (min-width:576px){.media-card{padding:3.2rem}}.media-card.background{background:var(--gradient-background, rgb(var(--color-background)));background-attachment:fixed}.media-card .card-overlay-link{position:absolute;top:0;right:0;bottom:0;left:0;z-index:3;display:block;width:100%;height:100%;border-radius:var(--border-radius-block)}.media-card .card-overlay-link:empty{display:block}.media-card .card-overlay-link~.media-card__content{pointer-events:none}@media screen and (hover:hover)and (pointer:fine){.media-card .card-overlay-link:hover~.media-card__arrow{color:rgb(var(--color-hover-tertiary-button-icon));background-color:rgb(var(--background-color-hover-tertiary-button-icon));border-color:rgb(var(--color-hover-tertiary-button-icon),.08)}.media-card .card-overlay-link:hover~.media-card__arrow .icon-button-arrow{color:rgb(var(--color-hover-tertiary-button-icon))}.media-card .card-overlay-link:hover~.media-card__arrow .button-icon__icon:first-of-type{transform:translate3d(50%,0,0);opacity:0}.media-card .card-overlay-link:hover~.media-card__arrow .button-icon__icon:last-of-type{transform:translateZ(0);opacity:1}.media-card .card-overlay-link:hover~.media-card__media>.media-card__media-item{transform:scale(1.01)}}.media-card__media{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;width:100%;height:100%;border-radius:var(--border-radius-block);overflow:hidden}.media-card__media-item{display:block;width:100%;height:100%;object-fit:cover;will-change:transform;transition:var(--image-hover-transition)}.media-card__media-overlay{transform:translateZ(0);position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;width:100%;height:100%;max-width:100%;max-height:100%}.media-card__mask{display:none}.media-card__content{transform:translateZ(0);position:relative;z-index:4;display:flex;flex-direction:column;gap:.8rem;background:transparent}.media-card__content>*{margin:0;padding:0}.media-card__content>* a,.media-card__content>* button,.media-card__content>* .button,.media-card__content>* input{pointer-events:all}.media-card__content>.block-button{margin:.8rem 0 0}.media-card__content .block-description--color-secondary strong,.media-card__content .block-description--color-secondary em{color:rgb(var(--color-foreground-secondary))}.media-card__content .block-description--color-primary strong,.media-card__content .block-description--color-primary em{color:rgb(var(--color-foreground))}.media-card__content .block-description--color-primary_overlay strong,.media-card__content .block-description--color-primary_overlay em{color:rgba(var(--color-foreground),.8)}.media-card__content .block-heading strong,.media-card__content .block-heading em{color:rgb(var(--color-foreground))}.media-card__arrow{display:none;flex-shrink:0;pointer-events:none;position:relative;z-index:4;width:2rem;height:2rem;color:rgb(var(--color-tertiary-button-icon));background-color:rgb(var(--background-color-tertiary-button-icon));border-color:rgba(var(--color-tertiary-button-icon),.06);box-shadow:0 2px 2px rgba(var(--color-shadow),.12)}.media-card__arrow .button-icon__icon-wrapper{width:2rem;height:2rem}.media-card__arrow .icon-button-arrow{color:rgb(var(--color-tertiary-button-icon))}.media-card--layout-horizontal{justify-content:space-between;gap:1.2rem}.media-card--layout-horizontal .card-overlay-link~.media-card__arrow{display:flex}.media-card--layout-vertical .media-card__content{width:100%;align-items:center;text-align:center}.media-card--layout-vertical .media-card__arrow{display:none}.media-card--layout-vertical .media-card__media~.media-card__content>*:first-child{order:-2}.media-card--layout-vertical .media-card__media~.media-card__content>*:first-child.block-button:only-child{order:2;margin:0}.media-card--layout-vertical .media-card__media~.media-card__content:after{display:block;order:-1;content:"";background:transparent;pointer-events:none;width:calc(100% - 4.4rem);aspect-ratio:1;height:auto;margin:1.6rem 0}@media screen and (min-width:750px)and (hover:hover)and (pointer:fine){.media-card--hover{background:var(--gradient-background, rgb(var(--color-background)));background-attachment:fixed;transition:background-color var(--duration-default) ease-in-out}.media-card--hover.media-card--layout-horizontal .media-card__media{opacity:0;transition:opacity var(--duration-default) ease-in-out}.media-card--hover:not(.background):hover{background:transparent}.media-card--hover:not(.background):hover .media-card__media{opacity:1}.media-card--hover.media-card--layout-vertical .media-card__media{transform:scale(.98);transition:transform var(--duration-default) ease-in-out}.media-card--hover.media-card--layout-vertical .media-card__mask{display:block;position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;background:var(--gradient-background, rgb(var(--color-background)));width:100%;height:100%;border-radius:var(--border-radius-block);overflow:hidden;pointer-events:none;transition:--mask-hole-radius .5s ease-out!important}.media-card--hover.media-card--layout-vertical .media-card__mask.media-card__mask--initialized{-webkit-mask-image:radial-gradient(circle var(--mask-hole-radius, 80px) at var(--mask-hole-x, 50%) var(--mask-hole-y, 100px),transparent 0,transparent calc(var(--mask-hole-radius, 80px) + 1px),black calc(var(--mask-hole-radius, 80px) + 2px));mask-image:radial-gradient(circle var(--mask-hole-radius, 80px) at var(--mask-hole-x, 50%) var(--mask-hole-y, 100px),transparent 0,transparent calc(var(--mask-hole-radius, 80px) + 1px),black calc(var(--mask-hole-radius, 80px) + 2px))}.media-card--hover.media-card--layout-vertical:not(.background):hover .media-card__media{transform:scale(1)}}[dir=rtl] .card-overlay-link~.media-card__arrow .button-icon__icon:last-of-type{transform:translate3d(50%,0,0)}[dir=rtl] .card-overlay-link~.media-card__arrow .button-icon .icon-button-arrow{transform:rotate(0)}@media screen and (hover:hover)and (pointer:fine){[dir=rtl] .card-overlay-link:hover~.media-card__arrow .button-icon__icon:first-of-type{transform:translate3d(-50%,0,0)}[dir=rtl] .card-overlay-link:hover~.media-card__arrow .button-icon__icon:last-of-type{transform:translateZ(0)}}
/*# sourceMappingURL=/cdn/shop/t/5/assets/section-media-cards.css.map */
