:root{
    --verde: #669928;
    --bordes: 2px solid black;
}
/*SERVICIO RIGH*/
.servicio{
    
    height: 70vh;
    display: flex;
    align-items: center;
    padding-left: 10%;
    padding-right: 10%;
    margin-bottom: 50px;
}
.servicio .contenido{

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-left: 100px;
    height: 100%;
   
}
.contenido h1{
    
    margin-right: auto;
    color: var(--verde);
    margin-bottom: 30px;
}
.contenido button{
    margin-right: auto;
    cursor: pointer;
    height: 50px;
    padding: 5px 10px;
    background: var(--verde);
    border-style: none;
}
#btn-service{
    transition: 0.5s ease;
}
#btn-service:hover{
    transform: scale(1.2);
}
.contenido a{
    text-decoration: none;
    color: white;  

}
.servicio .imagen img{
    width: 600px;
    height: 400PX;
    transition: 0.5s ease;
    
}
.servicio .imagen img:hover{
    transform: scale(1.1);
}
/*SERVICIO LEFT*/

.servicio-left{
    
    display: flex;
    height: 70vh;
    align-items: center;
    padding-left: 10%;
    padding-right: 10%;
    margin-bottom: 50px;
}
.servicio-left .contenido-left{
  
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-right: 100px;
    height: 100%;
    text-align: end;
}
.servicio-left .imagen-left{
   

}
.servicio-left .imagen-left img{
    width: 600px;
    height: 400PX;
    transition: 0.5s ease;
}
.servicio-left .imagen-left img:hover{
    transform: scale(1.1);
}
.contenido-left h1{
    margin-left: auto;
    color: var(--verde);
    margin-bottom: 30px;
}
.contenido-left button{
    margin-left: auto;
    cursor: pointer;
    height: 50px;
    padding: 5px 10px;
    background: var(--verde);
    border-style: none;
}
.contenido-left a{
    text-decoration: none;
    color: white;  
}
.etiqueta-venta{
    
    position: absolute;
top: 35%;
left: 50%;
transform: translate(-50%, -50%); /* desplaza el div hacia su centro */
z-index: 100;

padding: 30px 15px;
font-size: 60px;
font-weight: 700;
text-align: center;

color: #DA0515;
border: 3px solid #DA0515; /* borde más suave */
border-radius: 8px;

background: rgba(255, 255, 255, 0.2); /* fondo translúcido */
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);

box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
    
}
@media(max-width:1450px) {

    .etiqueta-venta{
   
        top: 28%;
        font-size: 35px;   
    }
}
@media(max-width:1300px) {

    .servicio .imagen img{
        width: 500px;   
    }
    .servicio .contenido{
        margin-left: 50px;
    }
    /*left*/
    .servicio-left .imagen-left img{
        width: 500px;
    }
    .servicio-left .contenido-left{
        margin-right: 50px;
    }
}


@media(max-width:1100px) {
    .servicio{
        padding-left: 20px;
        padding-right: 20px;
    }
    .servicio .imagen img{
        width: 400px;
        height: 300px;  
    }
    .servicio .contenido{
        margin-left: 50px;
    }
    /*left*/
    .servicio-left{
        padding-left: 20px;
        padding-right: 20px;
    }
    .servicio-left .imagen-left img{
        width: 400px;
        height: 300px;  
    }
    .contenido-left .contenido-left{
        margin-right: 50px;
    }
    .etiqueta-venta{
   
        top: 20%;
        font-size: 30px;   
    }
}
@media(max-width:976px) {
    .etiqueta-venta{
   
        top: 25%;
        font-size: 35px;   
    }
}
@media(max-width:768px) {
    .servicio{
        flex-direction: column;
        height: auto;
    }
    .servicio .imagen{
        width: 90%;
        margin-bottom: 20px;
    }
    .servicio .imagen img{
        width: 100%;
    }
    .servicio .contenido{
        margin-left: 0;
        width: 90%;
    }
    /*left*/
    .servicio-left{
        flex-direction: column-reverse;
        height: auto;
    }
    .servicio-left .imagen-left{
        width: 90%;
        margin-bottom: 20px;
    }
    .servicio-left .imagen-left img{
        width: 100%;
    }
    .servicio-left .contenido-left{
        margin-right: 0;
        width: 90%;
        text-align: start;
    }
    .contenido-left button{
        margin-left: 0;
        margin-right: auto;
    }
    .contenido-left h1{
        margin-left: 0;
        margin-right: auto;
    }
    .etiqueta-venta{
   
        top: 55%;
        font-size: 70px;   
    }
}

@media(max-width:576px) {
    .servicio .imagen{
        width: 100%;
    }
    .servicio .imagen img{
        height: 250px;
    }
    .servicio .contenido{
        width: 100%;
    }
    /*left*/
    .servicio-left .imagen-left{
        width: 100%;
    }
    .servicio-left .imagen-left img{
        height: 250px;
    }
    .servicio-left .contenido-left{
        width: 100%;
    }

    .etiqueta-venta{
   
        top: 25%;
        font-size: 40px;   
    }
}

@media(max-width:411px){
    .etiqueta-venta{
        top: 25%;
        font-size: 20px;
    }
}