/* SECCION GALERIA */
.seccion_galeria {
    box-sizing:                 border-box;
    padding-bottom:             2rem;
    padding-top:                2rem;
}

.container {
    box-sizing:                 border-box;
    margin-left:                auto;
    margin-right:               auto;
    max-width:                  90%;
    padding-left:               1rem;
    padding-right:              1rem;
    width:                      100%;
}

.breadcrumb {
    color:                      #333;
    font-family:                'Roboto', sans-serif;
    font-size:                  1rem;
    margin-bottom:              0;
}

.breadcrumb a {
    color:                      #1a73e8;
    text-decoration:            none;
}

.breadcrumb a:hover {
    text-decoration:            underline;
}

.breadcrumb i {
    color:                      #333;
    font-size:                  1rem;
    padding:                    0 0.5rem;
    vertical-align:             middle;
}

.contador_productos {
    color:                      #333;
    font-family:                'Roboto', sans-serif;
    font-size:                  0.85rem;
    margin-bottom:              1rem;
    margin-top:                 0;
}

.contenedor_flex {
    display:                    flex;
    flex-wrap:                  wrap;
    gap:                        15px;
    justify-content:            center;
    margin:                     0 auto;
    width:                      100%;
}

.elemento_cuadricula {
    align-items:                center;
    background:                 #fff;
    border-radius:              8px;
    box-shadow:                 0 4px 8px rgba(0, 0, 0, 0.1);
    box-sizing:                 border-box;
    display:                    flex;
    flex-direction:             column;
    justify-content:            space-between;
    min-height:                 480px;
    padding:                    1rem;
    position:                   relative;
    width:                      300px;
}

.elemento_cuadricula h3 {
    align-items:                center;
    color:                      #333;
    display:                    flex;
    font-family:                'Roboto', sans-serif;
    font-size:                  1rem;
    font-weight:                600;
    justify-content:            center;
    margin-bottom:              0.5rem;
    min-height:                 2.5rem;
    text-align:                 center;
}

.imagen_producto {
    border-radius:              8px;
    height:                     250px;
    margin-bottom:              0.5rem;
    object-fit:                 cover;
    transition:                 filter 0.3s ease, transform 0.3s ease;
    width:                      100%;
}

.imagen_producto:hover {
    cursor:                     pointer;
    filter:                     brightness(1.1);
    transform:                  scale(1.05);
}

.elemento_cuadricula p.descripcion {
    align-items:                center;
    color:                      #666;
    display:                    flex;
    font-family:                'Roboto', sans-serif;
    font-size:                  0.875rem;
    justify-content:            center;
    margin-bottom:              0.5rem;
    min-height:                 3.5rem;
    text-align:                 center;
}

.elemento_cuadricula p.precio {
    color:                      #666;
    font-family:                'Roboto', sans-serif;
    font-size:                  1em;
    font-weight:                400;
    margin:                     0 auto 0.5rem;
    text-align:                 center;
}

.elemento_cuadricula p.meses {
    background:                 yellow;
    color:                      black;
    display:                    inline-block;
    font-family:                'Roboto', sans-serif;
    font-size:                  1em;
    font-weight:                400;
    line-height:                1.5em;
    margin:                     0 auto 0.5rem;
    padding:                    0.25em 0.5em;
    text-align:                 center;
    width:                      100%;
}

.elemento_cuadricula p.oferta {
    display:                    inline-block;
    font-family:                'Roboto', sans-serif;
    font-size:                  1em;
    font-weight:                400;
    margin:                     0 auto 0.5rem;
    text-align:                 center;
}

.oferta span {
    font-size:                  1em;
}

.precio-descuento {
    display:                    inline-block;
    margin-left:                0.5em;
    vertical-align:             middle;
}

.precio-descuento svg text {
    font-size:                  1em;
}

.descuento-esquina {
    background:                 red;
    border-radius:              50%;
    color:                      white;
    font-family:                'Roboto', sans-serif;
    font-size:                  .7em;
    font-weight:                600;
    height:                     30px;
    line-height:                30px;
    position:                   absolute;
    right:                      10px;
    text-align:                 center;
    top:                        10px;
    transform:                  rotate(20deg);
    width:                      30px;
    z-index:                    10;
}
/* IMAGEN BUEN FIN EN ESQUINA (temporal) */
.buen-fin-esquina {
    position: absolute;
    top: 0;
    right: 0;
    width: 50px;           /* Ajusta este valor si quieres más grande/más pequeña */
    height: auto;
    border-radius: 0 8px 0 0;  /* Redondea SOLO la esquina superior derecha */
    object-fit: cover;     /* Evita que se deforme */
    z-index: 10;
    pointer-events: none;
    box-shadow: 0 2px 6px rgba(0,0,0,0.2); /* Opcional: sombra ligera */
}
.boton_whatsapp {
    align-items:                center;
    background:                 #25d366;
    border-radius:              4px;
    color:                      #fff;
    display:                    flex;
    font-family:                'Roboto', sans-serif;
    font-size:                  1rem;
    gap:                        0.5rem;
    justify-content:            center;
    margin-bottom:              0.5rem;
    padding:                    0.5rem;
    text-align:                 center;
    text-decoration:            none;
    transition:                 background 0.3s ease;
    width:                      100%;
}

.boton_whatsapp:hover {
    background:                 #1da851;
}

.sin_productos {
    color:                      #666;
    font-family:                'Roboto', sans-serif;
    font-size:                  1.125rem;
    text-align:                 center;
    width:                      100%;
}

/* Media queries para responsividad */
@media only screen and (max-width: 620px) {
    .contenedor_flex {
        justify-content:            center;
    }
    .elemento_cuadricula {
        width:                      90%;
        max-width:                  300px;
    }
}