/* Related-products carousel: one row, arrow buttons, scroll-snap (used by every product page; keeps one row at every width, incl. phones) */
.rel-carousel{position:relative}
#related-products .rel-carousel .rel-grid{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:8px 4px 14px;-webkit-overflow-scrolling:touch}
#related-products .rel-carousel .rel-grid::-webkit-scrollbar{display:none}
#related-products .rel-carousel .rel-tile{flex:0 0 calc((100% - 5 * 16px) / 6);scroll-snap-align:start}
.rel-carousel{padding-inline:50px}
.rel-nav{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:46px;height:80px;border-radius:7px;border:0;background:transparent;color:#0d3268;padding:0;display:grid;place-items:center;cursor:pointer;transition:opacity .2s,background-color .2s}
.rel-nav svg{width:28px;height:43px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.rel-nav:hover{background:rgba(32,107,238,.05)}
.rel-nav:focus-visible{outline:3px solid #8ab9ff;outline-offset:2px}
.rel-nav[disabled]{opacity:.3;cursor:default;pointer-events:none}
.rel-nav--left{left:0}.rel-nav--right{right:0}
@media(max-width:1180px){#related-products .rel-carousel .rel-tile{flex-basis:calc((100% - 2 * 16px) / 3)}}
@media(max-width:620px){.rel-carousel{padding-inline:34px}#related-products .rel-carousel .rel-grid{gap:12px}#related-products .rel-carousel .rel-tile{flex-basis:calc((100% - 12px) / 2)}.rel-nav{width:34px;height:64px}.rel-nav svg{width:24px;height:34px}}
