[data-component=horizontal-scroller]{position:relative;.horizontal-scroller__controls{position:absolute;top:0;width:100%;height:100%;display:flex;justify-content:space-between;align-items:center;padding:.5rem;.btn{z-index:10}@media screen and (width <= 30rem){.btn{width:2.5rem;height:2.5rem;font-size:1rem}}}.horizontal-scroller__items{position:relative;display:flex;flex-direction:row;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;width:100%;margin:1.5rem 0;gap:1rem;&::-webkit-scrollbar{display:none}.card:first-child{margin-left:4.5rem}.horizontal-scroller__cta{padding:1rem;background-color:var(--blue-light);display:flex;flex-direction:column;justify-content:center;text-align:center;color:var(--white)}}}.card{position:relative;flex:0 0 20%;min-width:15rem;max-width:25rem;display:flex;flex-direction:column;>img,&:is(img),a>img{aspect-ratio:1 / 1;object-fit:cover;&.card__img--non-sq{aspect-ratio:unset}}& img{width:100%}& a+p,img+p{margin-top:1rem}.card__overlay{position:absolute;width:100%;height:100%;top:0;bottom:0;padding:2rem 0;display:flex;flex-direction:column;justify-content:space-between;align-items:center;gap:.75rem;& span{margin-bottom:auto}&.card__overlay--btm-label{padding:1rem 0;>span{margin-top:auto;margin-bottom:0;text-align:center;&.txt--light{color:var(--off-white-lighter)}}}& a{margin-right:0!important}@media screen and (width <= 30rem){padding:1rem 0}}@media (hover: hover){.card__overlay a{opacity:0}&:hover{.card__overlay a{opacity:1}}}}