.media-with-text-box{padding:var(--section-padding-top, 40px) 0 var(--section-padding-bottom, 40px);width:100%;max-width:var(--max-width, 1200px);margin:0 auto;position:relative}.media-with-text-box__container{position:relative;width:100%}.media-with-text-box__carousel-wrapper{position:relative;overflow:hidden;border-radius:16px;isolation:isolate;contain:layout style paint}.media-with-text-box__carousel{position:relative;width:100%;overflow:hidden;-webkit-user-select:none;user-select:none;touch-action:pan-y pinch-zoom;-webkit-overflow-scrolling:touch;isolation:isolate;contain:layout style paint}@media screen and (max-width: 767px){.media-with-text-box__carousel{touch-action:pan-x pan-y;cursor:grab}.media-with-text-box__carousel:active{cursor:grabbing}.media-with-text-box__track{touch-action:pan-x pan-y}}.media-with-text-box__track{display:flex;transition:transform .3s cubic-bezier(.25,.46,.45,.94);will-change:transform;backface-visibility:hidden;transform:translateZ(0);-webkit-transform:translate3d(0,0,0);-webkit-backface-visibility:hidden;-webkit-perspective:1000}.media-with-text-box__slide{flex:0 0 calc(100% / var(--slides-per-view-mobile, 1));padding:0 calc(var(--gap-between-slides, 20px) / 2);display:flex;flex-direction:column;gap:16px}.media-with-text-box__media-wrapper{position:relative;width:100%;aspect-ratio:var(--media-aspect-ratio, 4/5);border-radius:var(--media-border-radius, 12px);overflow:hidden;background:#f5f5f5}.media-with-text-box__image-wrapper{width:100%;height:100%;position:relative}.media-with-text-box__image{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s ease}.media-with-text-box__image:hover{transform:scale(1.05)}.media-with-text-box__video-wrapper{width:100%;height:100%;position:relative;background:#000;border-radius:var(--media-border-radius, 12px);overflow:hidden}.media-with-text-box__video-wrapper video{width:100%;height:100%;object-fit:cover;display:block;border-radius:var(--media-border-radius, 12px)}.media-with-text-box__video{width:100%;height:100%;object-fit:cover;display:block;border-radius:var(--media-border-radius, 12px)}.media-with-text-box__media-wrapper[data-shadow=light],.media-with-text-box__video-wrapper[data-shadow=light]{box-shadow:0 4px 12px #0000001a}.media-with-text-box__media-wrapper[data-shadow=medium],.media-with-text-box__video-wrapper[data-shadow=medium]{box-shadow:0 8px 24px #00000026}.media-with-text-box__media-wrapper[data-shadow=heavy],.media-with-text-box__video-wrapper[data-shadow=heavy]{box-shadow:0 12px 32px #0003}.media-with-text-box__content{background:var(--text-card-background, #ffffff);padding:var(--text-card-padding, 20px);border-radius:var(--text-card-border-radius, 8px);display:flex;flex-direction:column;gap:12px;flex:1}.media-with-text-box__title{margin:0;line-height:1.3;font-family:inherit}.media-with-text-box__description{margin:0;line-height:1.6;flex:1}.media-with-text-box__description p{margin:0 0 8px}.media-with-text-box__description p:last-child{margin-bottom:0}.media-with-text-box__swipe-indicator{display:inline-flex;align-items:center;gap:8px;background:none;border:none;padding:8px 12px;border-radius:6px;cursor:pointer;transition:all .3s ease;font-size:14px;font-weight:500;color:#666;align-self:var(--swipe-indicator-alignment, center);margin-top:auto}.media-with-text-box__swipe-indicator:hover{background:#0000000d;color:#333;transform:translate(4px)}.swipe-indicator__text{font-size:inherit}.swipe-indicator__icon{transition:transform .3s ease}.media-with-text-box__swipe-indicator:hover .swipe-indicator__icon{transform:translate(2px)}@media screen and (min-width: 768px){.media-with-text-box__swipe-indicator{display:none}}.media-with-text-box__pagination{display:flex;justify-content:center;align-items:center;gap:8px;margin-top:24px}.media-with-text-box__dot{width:12px;height:12px;border-radius:50%;border:none;background:#0003;cursor:pointer;transition:all .3s ease;padding:0}.media-with-text-box__dot:hover{background:#0006;transform:scale(1.2)}.media-with-text-box__dot[aria-selected=true]{background:#333;transform:scale(1.3)}@media screen and (min-width: 768px){.media-with-text-box__pagination{display:none}}.media-with-text-box__content[data-shadow=light]{box-shadow:0 2px 8px #00000014}.media-with-text-box__content[data-shadow=medium]{box-shadow:0 4px 16px #0000001f}.media-with-text-box__content[data-shadow=heavy]{box-shadow:0 8px 24px #00000029}.media-with-text-box--compact .media-with-text-box__slide{gap:8px}.media-with-text-box--compact .media-with-text-box__media-wrapper{aspect-ratio:3/4;max-width:280px;margin:0 auto}.media-with-text-box--compact .media-with-text-box__content{padding:12px}.media-with-text-box--compact .media-with-text-box__title{font-size:18px;margin-bottom:8px}.media-with-text-box--compact .media-with-text-box__description{font-size:14px;line-height:1.4}.media-with-text-box--compact .media-with-text-box__swipe-indicator{padding:6px 10px;font-size:12px}.media-with-text-box--compact .media-with-text-box__pagination{margin-top:16px}.media-with-text-box--compact .media-with-text-box__dot{width:8px;height:8px}@media screen and (min-width: 768px){.media-with-text-box__slide{flex:0 0 calc(100% / var(--slides-per-view-tablet, 2))}.media-with-text-box--compact .media-with-text-box__media-wrapper{aspect-ratio:4/5;max-width:320px}.media-with-text-box--compact .media-with-text-box__content{padding:16px}.media-with-text-box--compact .media-with-text-box__title{font-size:20px}.media-with-text-box--compact .media-with-text-box__description{font-size:15px}}@media screen and (min-width: 1024px){.media-with-text-box__slide{flex:0 0 calc(100% / var(--slides-per-view-desktop, 3))}.media-with-text-box--compact .media-with-text-box__media-wrapper{aspect-ratio:1/1;max-width:360px}.media-with-text-box--compact .media-with-text-box__content{padding:20px}.media-with-text-box--compact .media-with-text-box__title{font-size:22px}.media-with-text-box--compact .media-with-text-box__description{font-size:16px}}.media-with-text-box__dot:focus,.media-with-text-box__swipe-indicator:focus{outline:2px solid #007bff;outline-offset:2px}.media-with-text-box__media-wrapper.loading{background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0,#f0f0f0 75%);background-size:200% 100%;animation:loading 1.5s infinite}@keyframes loading{0%{background-position:200% 0}to{background-position:-200% 0}}.media-with-text-box__media-wrapper.error{background:#f8f8f8;display:flex;align-items:center;justify-content:center;color:#999;font-size:14px}.video-error-message{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:#ffffffe6;padding:12px 16px;border-radius:6px;color:#666;font-size:14px;text-align:center;z-index:10}.video-placeholder,.media-with-text-box__placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:#f5f5f5;color:#999;font-size:14px;border-radius:var(--media-border-radius, 12px)}.video-debug-info{font-family:monospace;line-height:1.4}.video-loading-indicator{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:12px;z-index:5}.loading-spinner{width:32px;height:32px;border:3px solid rgba(255,255,255,.3);border-top:3px solid #333;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.video-loading-indicator p{margin:0;color:#666;font-size:14px;font-weight:500}.media-with-text-box__track{transition:transform .4s cubic-bezier(.25,.46,.45,.94)}@media (hover: none) and (pointer: coarse){.media-with-text-box__nav{display:none}.media-with-text-box__swipe-indicator:hover{transform:none;background:none}.media-with-text-box__image:hover{transform:none}}@media (-webkit-min-device-pixel-ratio: 2),(min-resolution: 192dpi){.media-with-text-box__image{image-rendering:-webkit-optimize-contrast}}@media print{.media-with-text-box__nav,.media-with-text-box__pagination,.media-with-text-box__swipe-indicator{display:none}.media-with-text-box__track{transform:none!important}.media-with-text-box__slide{flex:0 0 50%;break-inside:avoid}}.media-with-text-box__navigation,.media-with-text-box__arrow{display:none!important}
/*# sourceMappingURL=/cdn/shop/t/36/assets/media-with-text-box.css.map */