[Duda] Como aumento el tamaño del precio también al pasar el mouse por la imagen?

Tomando de base este código. Como hago para que el texto del precio también aumente de tamaño?

header{
    background-color: cadetblue;
}

#logo{
    width: 10%;
}

.caja{
    width: 940px;
    position: relative;
    margin: 0 auto;
}

nav{
    position: absolute;
    top: 52.5px;
    right: 0;
}

nav li{
    display: inline-block;
    margin: 0 0 0 15px;    
}

nav a{
    text-transform: uppercase;
    color: black;
    font-weight: bold;
    font-size: 22px;
    text-decoration: none;
}

nav a:hover{
    color: #98de16;
    text-shadow: 2px 2px 5px black;
}

.productos{
    width: 940px;
    margin: 0 auto;
    padding: 50px;
}

.productos li{
    display: inline-block;
    text-align: center;
    width: 30%;
    vertical-align: top;
    margin: 0 1.5%;
    padding: 30px 20px;
    box-sizing: border-box;
    border: 2px solid black;
    border-radius: 15px;
}

.productos li:hover{
    border-color: #98de16;
}

.productos li:hover h2{
    font-size: 33px;
}

.productos li:active{
    border-color: blueviolet;
}

.productos h2{
    font-size: 30px;
    font-weight: bold;

}

.productos-descripcion{
    font-size: 18px;
}

.productos-precio{
    font-size: 20px;
    font-weight: bold;
    margin-top: 10px;
}