﻿.btnBuscarLayoutPequeno {
    display: none;
}

.ods-grid {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 20px !important; /* espaço entre os itens */
}

.header {
    background-color: #0e608e !important;
    background-image: url(../../assets/image/fundo_header.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    height: 200px;
}

.ods-item {
    flex: 1 1 calc(16.68% - 20px) !important; /* 6 por linha em desktop */
}

/* Tablet */
@media (max-width: 992px) {
    .ods-item {
        flex: 1 1 calc(33.33% - 20px) !important; /* 3 por linha em tablet */
    }

    .btnBuscarLayoutGrande {
        display: block;
    }

    .btnBuscarLayoutPequeno {
        display: none;
    }

    .header {
        background-color: #0e608e !important;
        background-image: url(../../assets/image/logo_fundo_azul.png);
        background-repeat: no-repeat;
        background-position: center center !important;
        background-size: 250px auto !important;
    }

    .divBusca {
        position: relative;
        top: 20px;
        width: 100%;
    }

    .area1 {
        top: 61px;
        left: 3px;
        width: 279px;
        height: 73px;
    }
}

/* Mobile */
@media (max-width: 768px) {
    .ods-item {
        flex: 1 1 calc(50% - 20px) !important; /* 2 por linha em celular */
    }

    .header {
        background-color: #0e608e !important;
        background-image: url(../../assets/image/logo_fundo_azul.png);
        background-repeat: no-repeat;
        background-position: center center !important;
        background-size: 235px auto !important;
    }

    .divBusca {
        position: relative;
        top: 20px;
        width: 100%;
    }

    .area1 {
        top: 61px;
        left: 3px;
        width: 279px;
        height: 73px;
    }
}

/* Mobile pequeno */
@media (max-width: 480px) {
    .ods-item {
        flex: 1 1 100% !important; /* 1 por linha em telas muito pequenas */
    }

    .btnBuscarLayoutGrande {
        display: none;
    }

    .btnBuscarLayoutPequeno {
        display: block;
    }

    .header {
        background-color: #0e608e !important;
        background-image: url(../../assets/image/logo_fundo_azul.png);
        background-repeat: no-repeat;
        background-position: center center !important;
        background-size: 220px auto !important;
    }

    .divBusca {
        position: relative;
        top: 20px;
        width: 100%;
    }

    .area1 {
        top: 61px;
        left: 3px;
        width: 279px;
        height: 73px;
    }
}

/* Ajuste responsivo do slider principal */
@media (max-width: 768px) {
    .slider-main,
    .fullwidthbanner-container.slider-main,
    .slider-main .fullwidthabnner,
    .slider-main .fullwidthbanner,
    .slider-main .tp-banner-container,
    .slider-main .tp-revslider-mainul,
    .slider-main .rev_slider_wrapper,
    #revolutionul,
    #revolutionul > li {
        width: 100% !important;
        height: 210px !important;
        min-height: 210px !important;
        max-height: 210px !important;
        overflow: hidden !important;
    }

    .slider-main .caption,
    .slider-main .tp-caption {
        transform: none !important;
        -webkit-transform: none !important;
    }

    .slider-main .caption.lfb {
        position: absolute !important;
        left: 0 !important;
        right: 0 !important;
        top: 28px !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 auto !important;
        padding: 0 !important;
        text-align: center !important;
        z-index: 5 !important;
    }

    .slider-main .caption.lfb img {
        display: inline-block !important;
        width: 235px !important;
        max-width: 72vw !important;
        height: auto !important;
        float: none !important;
        margin: 0 auto !important;
    }

    .slider-main .slider-btn-video,
    .slider-main .slider-btn-busca,
    .slider-main .slider-btn-video:link,
    .slider-main .slider-btn-busca:link,
    .slider-main .slider-btn-video:visited,
    .slider-main .slider-btn-busca:visited {
        position: absolute !important;
        left: 0 !important;
        right: 0 !important;
        width: 205px !important;
        min-width: 205px !important;
        max-width: 205px !important;
        height: 28px !important;
        min-height: 28px !important;
        max-height: 28px !important;
        margin: 0 auto !important;
        padding: 0 8px !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        font-size: 10.5px !important;
        line-height: 1 !important;
        white-space: nowrap !important;
        text-align: center !important;
        border-radius: 12px 0 12px 12px !important;

        transform: none !important;
        -webkit-transform: none !important;
        z-index: 6 !important;
    }

    .slider-main .slider-btn-video span,
    .slider-main .slider-btn-busca span {
        display: block !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        font-size: 10.5px !important;
        line-height: 1 !important;
        text-align: center !important;
        white-space: nowrap !important;
    }

    .slider-main .slider-btn-video {
        top: 116px !important;
    }

    .slider-main .slider-btn-busca {
        top: 154px !important;
    }
}

/* Ajuste do slider em celulares menores */
@media (max-width: 480px) {
    .slider-main,
    .fullwidthbanner-container.slider-main,
    .slider-main .fullwidthabnner,
    .slider-main .fullwidthbanner,
    .slider-main .tp-banner-container,
    .slider-main .tp-revslider-mainul,
    .slider-main .rev_slider_wrapper,
    #revolutionul,
    #revolutionul > li {
        width: 100% !important;
        height: 210px !important;
        min-height: 210px !important;
        max-height: 210px !important;
        overflow: hidden !important;
    }

    .slider-main .caption,
    .slider-main .tp-caption {
        transform: none !important;
        -webkit-transform: none !important;
    }

    .slider-main .caption.lfb {
        position: absolute !important;
        left: 0 !important;
        right: 0 !important;
        top: 24px !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 auto !important;
        padding: 0 !important;
        text-align: center !important;
    }

    .slider-main .caption.lfb img {
        display: inline-block !important;
        width: 220px !important;
        max-width: 72vw !important;
        height: auto !important;
        float: none !important;
        margin: 0 auto !important;
    }

    .slider-main .slider-btn-video,
    .slider-main .slider-btn-busca,
    .slider-main .slider-btn-video:link,
    .slider-main .slider-btn-busca:link,
    .slider-main .slider-btn-video:visited,
    .slider-main .slider-btn-busca:visited {
        position: absolute !important;
        left: 0 !important;
        right: 0 !important;
        width: 195px !important;
        min-width: 195px !important;
        max-width: 195px !important;
        height: 27px !important;
        min-height: 27px !important;
        max-height: 27px !important;
        margin: 0 auto !important;
        padding: 0 8px !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        font-size: 10px !important;
        line-height: 1 !important;
        white-space: nowrap !important;
        text-align: center !important;
        border-radius: 12px 0 12px 12px !important;

        transform: none !important;
        -webkit-transform: none !important;
        z-index: 6 !important;
    }

    .slider-main .slider-btn-video span,
    .slider-main .slider-btn-busca span {
        display: block !important;
        width: 100% !important;
        font-size: 10px !important;
        line-height: 1 !important;
        margin: 0 !important;
        padding: 0 !important;
        text-align: center !important;
        white-space: nowrap !important;
    }

    .slider-main .slider-btn-video {
        top: 108px !important;
    }

    .slider-main .slider-btn-busca {
        top: 144px !important;
    }
}

/* Ajuste fino para iPhones e telas próximas de 390px */
@media (max-width: 390px) {
    .header {
        background-size: 205px auto !important;
        background-position: center center !important;
    }

    .slider-main .caption.lfb img {
        width: 205px !important;
        max-width: 70vw !important;
    }

    .slider-main .slider-btn-video,
    .slider-main .slider-btn-busca,
    .slider-main .slider-btn-video:link,
    .slider-main .slider-btn-busca:link,
    .slider-main .slider-btn-video:visited,
    .slider-main .slider-btn-busca:visited {
        width: 185px !important;
        min-width: 185px !important;
        max-width: 185px !important;
        font-size: 9.5px !important;
    }

    .slider-main .slider-btn-video span,
    .slider-main .slider-btn-busca span {
        font-size: 9.5px !important;
    }
}

/* Ajuste dos textos abaixo do slider no mobile */
@media (max-width: 768px) {
    .page-container .container {
        padding-left: 14px !important;
        padding-right: 14px !important;
    }

    .page-container .service-box {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    .page-container .service-box .col-md-4,
    .page-container .service-box .col-sm-4,
    .page-container .service-box .col-xs-12 {
        padding-left: 14px !important;
        padding-right: 14px !important;
    }

    .page-container .service-box-heading {
        justify-content: flex-start !important;
        text-align: left !important;
    }

    .page-container .service-box p {
        text-align: left !important;
    }
}