.section-monitoring {
    width: 100vw;
}

.image-container-section-monitoring {
    position: relative;
    width: 100vw;
    height: 50vh;
    overflow: hidden;
    padding-bottom: clamp(16px, 4vh, 64px);
}

.image-container-section-monitoring img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.overlay-text-section-monitoring {
    position: absolute;
    top: 50%;
    left: 25%;
    transform: translateY(-50%);
    color: white;
    max-width: 40%;
}

.overlay-text-section-monitoring h1 {
    font-size: 4.5rem;
    margin: 0 0 15px 0;
    line-height: 1.2;
}

.overlay-text-section-monitoring p {
    font-size: 20px;
    line-height: 1.4;
    max-width: 15vw;
}

@media (max-width: 768px) {
    .overlay-text-section-monitoring { left: 8%; max-width: 84%; }
    .overlay-text-section-monitoring h1 { font-size: 2rem; }
    .overlay-text-section-monitoring p { font-size: 16px; max-width: 100%; }
}

@media (max-width: 1280px) {
    .overlay-text-section-monitoring { left: 15%; max-width: 60%; }
}

@media (min-width: 1200px) and (max-width: 1500px) and (max-height: 900px) {
    .image-container-section-monitoring { height: 45vh; }
    .overlay-text-section-monitoring h1 { font-size: 2.6rem; }
}

/* narrow tablets and small laptops (e.g., 819px wide) */
@media (max-width: 992px) {
    .image-container-section-monitoring { height: 45vh; }
    .overlay-text-section-monitoring { left: 10%; max-width: 80%; }
    .overlay-text-section-monitoring h1 { font-size: 2.2rem; }
    .overlay-text-section-monitoring p { font-size: 18px; max-width: 80vw; }
}

/* small laptops: 993px–1199px */
@media (min-width: 993px) and (max-width: 1199px) {
    .image-container-section-monitoring { height: 62vh; }
    .overlay-text-section-monitoring { left: 14%; max-width: 65%; }
    .overlay-text-section-monitoring h1 { font-size: 3rem; }
    .overlay-text-section-monitoring p { font-size: 18px; max-width: 40vw; }
}

/* Altura baixa (zoom >= 125% em telas desktop) */
@media (max-height: 900px) {
    .image-container-section-monitoring { height: 70vh; }
    .overlay-text-section-monitoring { left: 12%; max-width: 60%; }
    .overlay-text-section-monitoring h1 { font-size: 3rem; }
}