.image-grid-section{--grid-gap: 20px}.image-grid__container{display:grid;grid-template-columns:repeat(var(--grid-columns-desktop),1fr);grid-auto-rows:minmax(250px,auto);gap:var(--grid-gap);width:100%}.image-grid__container.column-spacing--none{--grid-gap: 0}.image-grid__container.column-spacing--small{--grid-gap: 10px}.image-grid__container.column-spacing--medium{--grid-gap: 20px}.image-grid__container.column-spacing--large{--grid-gap: 30px}.image-grid__item{position:relative;overflow:hidden;border-radius:var(--item-border-radius, 0);border:var(--item-border-width, 0) solid var(--item-border-color, transparent);transition:all .3s ease}.image-grid__item-inner{height:100%;overflow:hidden}.image-grid__image{position:relative;width:100%;height:100%;overflow:hidden;border-radius:inherit;margin:0}.image-grid__image img{width:100%;height:100%;object-fit:contain;transition:transform .3s cubic-bezier(.25,.46,.45,.94);user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;pointer-events:none;-webkit-user-drag:none;-khtml-user-drag:none;-moz-user-drag:none;-o-user-drag:none;user-drag:none}.image-grid__item:hover .image-grid__image img{transform:scale(1.05)}.image-grid__item:hover{transform:translateY(-2px);box-shadow:0 8px 25px #00000026}.image-grid__overlay{position:absolute;top:0;left:0;right:0;bottom:0;background-color:rgba(var(--overlay-color-rgb),var(--overlay-opacity));transition:opacity .3s ease;pointer-events:none;border-radius:inherit}.image-grid__item:hover .image-grid__overlay{opacity:calc(var(--overlay-opacity) + .2)}.image-grid__content{position:absolute;top:0;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:center;padding:16px;color:var(--text-color);text-align:center;z-index:10;pointer-events:none}.image-grid__content *{pointer-events:auto}.image-grid__content.content-top-left{align-items:flex-start;justify-content:flex-start}.image-grid__content.content-top-center{align-items:flex-start;justify-content:center}.image-grid__content.content-top-right{align-items:flex-start;justify-content:flex-end}.image-grid__content.content-middle-left{align-items:center;justify-content:flex-start}.image-grid__content.content-middle-center{align-items:center;justify-content:center}.image-grid__content.content-middle-right{align-items:center;justify-content:flex-end}.image-grid__content.content-bottom-left{align-items:flex-end;justify-content:flex-start}.image-grid__content.content-bottom-center{align-items:flex-end;justify-content:center}.image-grid__content.content-bottom-right{align-items:flex-end;justify-content:flex-end}.image-grid__content.text-left{text-align:left}.image-grid__content.text-center{text-align:center}.image-grid__content.text-right{text-align:right}.image-grid__content-inner{width:100%;max-width:400px}.image-grid__subtitle{font-size:14px;font-weight:500;letter-spacing:1px;text-transform:uppercase;margin-bottom:8px;opacity:.9}.image-grid__title{font-size:24px;font-weight:600;line-height:1.3;margin-bottom:16px;color:var(--text-color)}.image-grid__button{margin-top:16px;transition:all .3s ease}.image-grid__button.show-on-hover{opacity:0;transform:translateY(10px)}.image-grid__item:hover .image-grid__button.show-on-hover{opacity:1;transform:translateY(0)}.image-grid__button .button{padding:12px 24px;font-size:14px;font-weight:500;letter-spacing:.5px;text-transform:uppercase;background-color:transparent;color:var(--text-color);border:1px solid var(--text-color);transition:all .3s ease}.image-grid__button .button:hover{background-color:var(--text-color);color:rgba(var(--overlay-color-rgb),1)}.image-grid__button .button.white{background-color:#fff;color:#000;border-color:#fff}.image-grid__button .button.white:hover{background-color:#2c2d2e;color:#fff;border-color:#2c2d2e}.image-grid__link{position:absolute;top:0;left:0;right:0;bottom:0;z-index:3}.image-grid__image .thb-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background-color:#f5f5f5}.image-grid__image .thb-placeholder svg{width:50%;height:50%;opacity:.3;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;pointer-events:none;-webkit-user-drag:none;-khtml-user-drag:none;-moz-user-drag:none;-o-user-drag:none;user-drag:none}.aspect-ratio--square{--ratio-percent: 100%}.aspect-ratio--landscape{--ratio-percent: 66.66%}.aspect-ratio--portrait{--ratio-percent: 133.33%}@media only screen and (max-width:768px){.image-grid__container{grid-template-columns:repeat(var(--grid-columns-mobile),1fr);grid-auto-rows:minmax(200px,auto)}.image-grid__content{padding:8px 20px}.image-grid__title{font-size:20px;margin-bottom:12px}.image-grid__subtitle{font-size:12px;margin-bottom:6px}.image-grid__button .button{padding:10px 20px;font-size:12px;height:38px}.image-grid__button.show-on-hover{opacity:1;transform:translateY(0)}.image-grid__section-header.text-center .section-header--centered .section-header--description{max-width:100%}}@media only screen and (min-width:769px)and (max-width:1024px){.image-grid__container{grid-template-columns:repeat(min(var(--grid-columns-desktop),3),1fr)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.image-grid__item:hover .image-grid__content-inner{animation:fadeInUp .3s ease-out}.image-grid__section-header.text-left{text-align:left}.image-grid__section-header.text-center{text-align:center}.image-grid__section-header.text-right{text-align:right}.image-grid__section-header.text-center .section-header--centered{text-align:center;display:flex;justify-content:center}.image-grid__section-header.text-center .section-header--centered .section-header--content{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center}.image-grid__section-header.text-center .section-header--centered .section-header--title{margin-bottom:0;order:1;text-align:center}.image-grid__section-header.text-center .section-header--centered .section-header--description{margin-top:0;order:2;max-width:600px;text-align:center;border-left:none!important;padding-left:0!important}.image-grid__section-header.text-right .section-header{display:flex;flex-direction:column;align-items:flex-end}.row.full-width-row-full{max-width:100%;width:100%}.row.full-width-row-full .columns{padding:0}
/*# sourceMappingURL=/cdn/shop/t/11/assets/image-grid.css.map */
