:root {
    --street-green: #76EF00;
    --street-black: #131313;
    --street-blue: #001AD9;
    --street-pink: #FADEDD;
    --street-white: #F9F9F9;
    --street-purple: #ea28e5;
    font-size: clamp(.3rem, .72vw + .2rem, 2rem);   
  }

[x-cloak] { display: none !important; }

html { scroll-behavior: smooth; }

.color-street-blue { color: var(--street-blue); }
.color-street-purple { color: var(--street-purple) }
.bg-street-purple { background-color: var(--street-purple); }
.bg-street-black { background-color: var(--street-black); }
.bg-street-white { background-color: var(--street-white); }
.bg-street-blue { background-color: var(--street-blue); }
.bg-street-pink { background-color: var(--street-pink); }
.bg-street-green { background-color: var(--street-green); }


.color-st-blue { color: var(--street-blue); }
.color-st-green { color: var(--street-green); }
.color-st-white { color: var(--street-white); }
.color-st-pink { color: var(--street-pink); }
.color-st-purple { color: var(--street-purple); }

.bStGreen { background-color: var(--street-green); }

.text-st-green { color: var(--street-green); }

/* .stBlur { backdrop-filter: blur(8px); } */

.icon-custom {
    padding: 1.5rem;
    display: inline-block;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

@media (max-width: 800px) {
    .icon-custom {
        padding: .8rem!important;
    }

    .mobi-no-display {
        display: none!important;
    }
}

.svg-cuadrilatero { background-image: url(../imgs/index/v-cuadrilatero.svg); }

.svg-eye {
    background-image: url(../imgs/index/v-eye.svg);
    width: 4rem;
}

@media (max-width: 800px) {
    
    .svg-eye { width: 3rem; }

    .svg-eye-big { padding: 8rem!important; }

    .svg-warp { width: 6rem; }

    .svg-destello-black {
        padding: 2rem 1.6rem!important;
    }

}

.svg-sun { background-image: url(../imgs/index/v-sun.svg); }

.svg-eye-big {
    background-image: url(../imgs/index/v-eye-big.svg);
    padding: 6.5rem;
    margin-top: -2rem;
}

.svg-warp {
    background-image: url(../imgs/index/v-warp.svg);
    background-repeat: repeat-x;
    width: 13rem;
    background-size: contain;
}

.svg-mundito {
    background-image: url(../imgs/index/v-mundito.svg);
    padding: .9rem;
}

.svg-mundito-purple {
    background-image: url(../imgs/index/v-mundito-purple-02.svg);
    padding: .9rem;
}

.svg-sun-blue {
    background-image: url(../imgs/index/v-sun-blue.svg);
    padding: .7rem;
}

.svg-rombo { background-image: url(../imgs/index/v-rombo.svg); }

.svg-rombo-doble {
    background-image: url(../imgs/index/v-rombo-doble.svg); 
    top: 0;
    bottom: 0;
    margin: auto 0;
    padding: 1.4rem 1.2rem;
    margin-top: -1rem;
}

.svg-destello {
    background-image: url(../imgs/index/v-destello.svg); 
    padding: 1.4rem 1.2rem;
}

.svg-destello-purple {
    background-image: url(../imgs/index/destello-purple-02.svg); 
    padding: 1.2rem 1rem;
}

.svg-destello-black {
    background-image: url(../imgs/index/v-destello-black-01.svg); 
    padding: 1.4rem 1.2rem;
}

.svg-destello-green {
    background-image: url(../imgs/index/v-destello-green-01.svg); 
    padding: 1.4rem 1.2rem;
}

.svg-arrow-doble {
    background-image: url(../imgs/index/v-arrow-doble.svg); 
    padding: 1.4rem;
}

.street-transition-background { transition:background-color 1.8s cubic-bezier(.23,1,.32,1); }

body.isOpen { overflow-y: hidden; }

@media (max-width: 40em) {
    .street-h-casting { height: 45rem; }
}

.splide-img-container {
    aspect-ratio: 1 / 1;
}

.street-transition-rotate {
    transition:transform .3s cubic-bezier(.23,1,.32,1);
}

.activeSvg {
    fill: white;
    transform: rotate(180deg);
}

.filter-menu > * + *, .ver-todos-ul > * + *  {
    border-top: 2px solid black;
}

.ver-todos-ul > *:last-of-type, .wishlist-ul > *:last-of-type  {
    border-bottom: 2px solid black;
}

.ver-todos-ul:last-child  {
    border-bottom: 2px solid black;
}

.ver-todos-min-size {
    min-height: 12rem;
    min-width: 30rem;
}

@media (min-width: 40em) {

    .desk-no-display {
        display: none!important;
    }
}