.h22,
h22 {
    font-size: 32px;
    /* Base font size */
    line-height: 100%;
    font-weight: 400;
    /* Base font weight */
}

/* Media query for large devices (desktops, 1200px and up) */
@media (min-width: 1200px) {

    .h22,
    h22 {
        font-size: 20px;
    }
}

/* Media query for medium devices (tablets, 768px and up) */
@media (min-width: 768px) and (max-width: 1199.98px) {

    .h22,
    h22 {
        font-size: 28px;
    }
}

/* Media query for small devices (phones, 576px and up) */
@media (min-width: 576px) and (max-width: 767.98px) {

    .h22,
    h22 {
        font-size: 10px;
        font-weight: 400;
        /* Reduced font weight for small devices */
    }
}

/* Media query for extra small devices (phones, less than 576px) */
@media (max-width: 575.98px) {

    .h22,
    h22 {
        font-family: sans-serif;
        font-style: normal;
        text-align: justify;
        align-items: center;
        justify-content: center;
        font-size: 15px;
        font-weight: lighter;
        /* Reduced font weight for extra small devices */
    }
}