/* main */
.main__index{
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    overflow-x: hidden;
}
/* carrusel */
.carrusel__principal{
    width: 80%;
    margin: 40px;
}
.slogan__carrusel .carousel-item img{
    height: 500px;
    object-fit: cover;
    border-radius: 1rem;
}
.carousel{
    position: relative;
    border-radius: 1rem;
}
/* slogan carrusel */
.contenedor__slogan__carrusel{
    color: white;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    position: absolute;
    inset: 0;
    margin-top: 60px;
}
.seccion__1 h1{
    font-size: 3rem;
    text-align: center;
    font-weight: 700;
}
.seccion__1,.seccion__2{
    width: 80%;
}
.seccion__2 p{
    font-size: 1.2rem;
    font-weight: 300;
}
.seccion__1, .seccion__2,.seccion__3{
    margin: 10px 0;
}
.btn__slogan__carrusel{
    padding: 10px 20px;
    background-color: var(--rosa);
    color: var(--white);
    border: none;
    border-radius: 12px;
    font-size: 1rem;
    box-shadow: 6px 6px 20px rgba(0,0,0,0.3);
    transition: all .3s ease;
}
.btn__slogan__carrusel:hover{
    transform: translateY(3px);
}
/* categorias destacadas */
.categorias__destacadas{
    width: 80%;
}
/* botones carrusel categorias destacadas */
#back__carrusel__categoty__destacadas{
    left: -80px;
    height: 50%;
    top: 100px;
    width: 130px;
    height: 130px;
}
#back__carrusel__categoty__destacadas__icon{
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 512"><path fill="%23000000" d="M9.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l160 160c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L77.3 256 214.6 118.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-160 160z"/></svg>');
}
#next__carrusel__categoty__destacadas{
    right:  -80px;
    height: 50%;
    top: 100px;
    width: 130px;
    height: 130px;
}
#next__carrusel__categoty__destacadas__icon{
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 512"><path fill="%23000000" d="M246.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-160 160c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L178.7 256 41.4 118.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l160 160z"/></svg>');
}
/* tarjetas categoria destacada */

#card{
    margin: 20px;
    background-color: transparent;
    border: none;
}
#card-text{
    font-weight: 500;
}
#card-body{
    padding: 8px;
}
#card-img-top{
    border-radius: 12px;
}
/* contenedor de las cartas de categoria destacada*/
.contendor__cards__present_slide{
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
}
/* contenedor de categoias de mobil */
.contenido__mobil__categorias__destacadas{
    display: none;
}
.contenedor__de__cartas__mobil{
    display: grid;
    grid-template-columns: repeat(2, 300px);
    gap: 10px 20px;
    margin: 20px;
    position: relative;
    padding-bottom: 40px;
}
.contenedor__boton__ver__mas__mobil{
    position: absolute;
    bottom: -10px;
    display: flex;
    justify-content: center;
    width: 100%;
}
.btn__show__mobil__categorys{
    all: unset;
    padding: 4px 80px;
    border: none;
    background-color: var(--gris-pink);
    border-radius: 10px;
    transition: all .3s ease;
    text-align: center;
    font-weight: 500;
}
.btn__show__mobil__categorys:hover{
    background-color: var(--gris-pink-hover);
    transform: translateY(3px);
}
#carta__mobil{
    width: 16rem;
    border: none;
}
/* diseños personalizados */
.desing__category{
    width: 80%;
    margin: 40px 0;
}
.content__cards{
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
}
#carta_de_personalizado{
    border: none;
    width: 18rem;
    margin: 20px;
} 
/* seccion slogan 2 con texto */
.slogan__text{
    width: 80%;
    margin: 20px 0;
    text-align: center;
}
.cont__slogan__text h2{
    font-weight: 700;
}
.cont__slogan__text{
    margin-bottom: 40px;
}
.btn__slogan__2__text{
    padding: 10px 16px;
    background-color: var(--rosa);
    color: var(--white);
    border: none;
    border-radius: 12px;
    font-size: 1rem;
    transition: all .3s ease;
}
.btn__slogan__2__text:hover{
    transform: translateY(3px);
}
/* contacto info section */
.info__contact__section{
    width: 80%;
    margin: 20px 0;
}
.text__description__info p,.text__description__info a{
    color: var(--grismed);
    text-decoration: none;
}
.text__description__info a:hover{
    text-decoration: underline;
}