.product-media-reel{position:relative;background-color:transparent;width:100%;max-width:100vw;overflow:hidden}.product-media-reel .page-width{max-width:var(--page-width, 1400px);margin-left:auto;margin-right:auto;padding-left:1.5rem;padding-right:1.5rem}.media-reel__header{display:flex;align-items:flex-end;justify-content:space-between;gap:1.25rem;margin-bottom:1.5rem}.media-reel__title-group{flex:1;min-width:0}.media-reel__heading{color:#17484c;font-weight:700;letter-spacing:-.02em;margin:0 0 .25rem}.media-reel__subheading{color:#6b7280;font-size:.9rem;line-height:1.4;margin:0}.media-reel__actions{display:flex;align-items:center;gap:1rem;flex-shrink:0}.media-reel__header-link{color:#17484c;font-size:.875rem;font-weight:600;text-decoration:none;display:inline-flex;align-items:center;gap:.35rem;transition:opacity .2s ease,transform .2s ease;white-space:nowrap}.media-reel__header-link:hover{opacity:.8;transform:translate(2px)}.media-reel__arrows{display:none;align-items:center;gap:.5rem}@media(min-width:768px){.media-reel__arrows{display:flex}}.media-reel__arrow{width:38px;height:38px;border-radius:50%;border:1.5px solid rgba(23,72,76,.2);background:#fff;color:#17484c;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .25s cubic-bezier(.16,1,.3,1);padding:0;box-shadow:0 2px 6px #0000000a}.media-reel__arrow:hover{background:#17484c;color:#fff;border-color:#17484c;transform:translateY(-1px);box-shadow:0 4px 12px #17484c33}.media-reel__arrow:active{transform:translateY(0)}.media-reel__track-wrapper{position:relative;width:100%;max-width:100vw;overflow:hidden}.media-reel__track{display:flex;gap:1rem;overflow-x:auto;scroll-behavior:auto;scroll-snap-type:none;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;padding:.5rem max(1.5rem,calc((100vw - 1400px)/2 + 1.5rem)) 1.5rem max(1.5rem,calc((100vw - 1400px)/2 + 1.5rem));margin:0;list-style:none;scrollbar-width:none;-ms-overflow-style:none;will-change:scroll-position}.media-reel__track::-webkit-scrollbar{display:none}.media-reel__card{flex:0 0 var(--card-w, 240px);width:var(--card-w, 240px);height:var(--card-h, 320px);border-radius:var(--card-r, 16px);position:relative;overflow:hidden;background-color:#0f2628;box-shadow:0 4px 14px #00000014;border:1px solid rgba(23,72,76,.12);transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s cubic-bezier(.16,1,.3,1);-webkit-user-select:none;user-select:none;cursor:pointer}@media(hover:hover)and (pointer:fine){.media-reel__card:not(.media-reel__card--video):hover{transform:translateY(-5px);box-shadow:0 12px 28px #17484c38;border-color:#17484c4d}}.media-reel__card--video{cursor:default!important;user-select:none!important;-webkit-user-select:none!important;-webkit-touch-callout:none!important}@media(hover:hover)and (pointer:fine){.media-reel__card--video:hover{transform:none!important;box-shadow:0 4px 14px #00000014!important;border-color:#17484c1f!important;cursor:default!important}}.media-reel__card--video .media-reel__card-link{display:none!important;pointer-events:none!important}.media-reel__card--video video,.media-reel__card--video .media-reel__media-box,.media-reel__card--video .media-reel__video-badge,.media-reel__card--video .media-reel__gradient-overlay,.media-reel__card--video .media-reel__pill-badge,.media-reel__card--video .media-reel__card-content,.media-reel__card--video .media-reel__card-title,.media-reel__card--video .media-reel__card-subtitle{pointer-events:none!important;user-select:none!important;-webkit-user-select:none!important;-webkit-touch-callout:none!important}.media-reel__card-link{position:absolute;top:0;right:0;bottom:0;left:0;z-index:20;text-decoration:none}.media-reel__media-box{width:100%;height:100%;position:relative;overflow:hidden;background:#0d2224}.media-reel__video,.media-reel__img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s cubic-bezier(.16,1,.3,1)}@media(hover:hover)and (pointer:fine){.media-reel__card:hover .media-reel__img{transform:scale(1.06)}}.media-reel__placeholder{width:100%;height:100%;background:linear-gradient(145deg,#17484c,#0c2022);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:1.5rem;text-align:center}.media-reel__gradient-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(180deg,#0000 45%,#0f2628e0);pointer-events:none;z-index:2}.media-reel__pill-badge{position:absolute;top:12px;left:12px;z-index:5;background:#fffffff0;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:#17484c;font-size:.65rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:4px 10px;border-radius:9999px;border:1px solid rgba(23,72,76,.1);box-shadow:0 2px 8px #0000001f}.media-reel__video-badge{position:absolute;top:12px;right:12px;z-index:5;background:#17484cd9;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:#fff;font-size:.65rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;padding:4px 9px;border-radius:9999px;display:flex;align-items:center;gap:4px;border:1px solid rgba(255,255,255,.25);box-shadow:0 2px 8px #00000026}.media-reel__card-content{position:absolute;bottom:0;left:0;right:0;padding:1rem;z-index:4;display:flex;flex-direction:column}.media-reel__card-title{color:#fff;font-size:.95rem;font-weight:700;line-height:1.25;margin:0;text-shadow:0 1px 3px rgba(0,0,0,.4)}.media-reel__card-subtitle{color:#ffffffd9;font-size:.75rem;line-height:1.2;margin:3px 0 0}@media(max-width:767px){.media-reel__header{flex-direction:column;align-items:flex-start;gap:.75rem;margin-bottom:1rem}.media-reel__actions{width:100%;justify-content:space-between}.media-reel__track{padding:.25rem 1rem 1rem;gap:.75rem}.media-reel__card{flex:0 0 min(var(--card-w, 240px),58vw);width:min(var(--card-w, 240px),58vw);height:min(var(--card-h, 320px),78vw)}.media-reel__card-title{font-size:.85rem}.media-reel__card-subtitle{font-size:.7rem}}.media-reel__mobile-hint{display:flex;align-items:center;justify-content:space-between;font-size:.72rem;color:#6b7280;margin-top:.5rem;padding:0 .5rem;letter-spacing:.02em}@media(min-width:768px){.media-reel__mobile-hint{display:none}}
/*# sourceMappingURL=/cdn/shop/t/19/assets/product-media-reel.css.map */