/* Estilos para a seção Coletivo da Mobilidade */
/* Layout profissional com imagem ao lado de título e resumo grandes */

/* Cabeçalho da seção (título + logo) */
.topo-campanha {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.25rem;
    flex-wrap: nowrap;
}

.topo-campanha .descr-campanha {
    flex: 1 1 320px;
    min-width: 0;
    order: 1;
}

.topo-campanha .logo-campanha {
    flex: 0 0 auto;
    align-self: center;
    order: 2;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    max-width: 140px;
}

.topo-campanha .logo-campanha img.coletivo-logo {
    display: block;
    width: auto !important;
    /*height: 44px !important;*/
    max-width: 150px !important;
    /*max-height: 44px !important;*/
    object-fit: contain;
}

@media (max-width: 767px) {
    .topo-campanha {
        flex-wrap: wrap;
    }

    .topo-campanha .logo-campanha {
        display: none !important;
    }

    .topo-campanha .descr-campanha {
        flex: 1 1 100%;
    }
}

/* Garantir que o container não limite o espaço do layout flexbox */
#blogs-lista {
    width: 100% !important;
    max-width: 100% !important;
}

/* Container do item com alinhamento ao topo */
.coletivo-item {
    width: 100%;
    padding-bottom: 2.5rem;
    margin-bottom: 2.5rem;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: flex-start !important;
    box-sizing: border-box;
    border-bottom: 1px solid #e0e0e0;
}

.coletivo-item:last-child {
    border-bottom: none !important;
    margin-bottom: 0;
}

/* Coluna da imagem */
.coletivo-item > .coletivo-imagem {
    flex-shrink: 0;
    flex-grow: 0;
    width: 25%;
    max-width: 25%;
    padding-right: 1.5rem;
    box-sizing: border-box;
}

/* Coluna do conteúdo */
.coletivo-item > .coletivo-meta {
    flex-shrink: 1;
    flex-grow: 1;
    width: 75%;
    max-width: 75%;
    box-sizing: border-box;
}

/* Garantir que imagens não quebrem o layout */
.coletivo-item img {
    width: 100%;
    height: auto;
    display: block;
}

/* Garantir que imagens não quebrem o layout */
.coletivo-item img {
    width: 100%;
    height: auto;
    display: block;
}

/* Imagem com sombra e efeito hover suave */
.coletivo-item a img {
    object-fit: cover;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.coletivo-item a:hover img {
    transform: scale(1.03);
    box-shadow: 0 6px 20px rgba(0,0,0,0.18);
}

/* Container do conteúdo (título + resumo) */
.coletivo-meta {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

/* Título MUITO MAIOR e proeminente */
.coletivo-titulo {
    font-size: 2.0rem;
    font-weight: 700;
    line-height: 1.3;
    color: #1a1a1a;
    margin-bottom: 1.25rem;
    letter-spacing: -0.02em;
}

.coletivo-titulo a {
    color: #1a1a1a;
    text-decoration: none;
    transition: color 0.2s ease;
}

.coletivo-titulo a:hover {
    color: #c62828;
}

/* Resumo MUITO MAIOR e legível */
.coletivo-resumo {
    font-size: 1.5rem;
    line-height: 1.75;
    color: #444;
    margin-bottom: 0;
}

/* Responsivo - Mobile (até 767px) */
@media (max-width: 767px) {
    .coletivo-item {
        flex-direction: column !important;
        flex-wrap: wrap !important;
        padding-bottom: 2rem;
        margin-bottom: 2rem;
    }
    
    .coletivo-item > .coletivo-imagem,
    .coletivo-item > .coletivo-meta {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        padding-right: 0 !important;
    }
    
    .coletivo-item > .coletivo-imagem {
        margin-bottom: 1rem;
    }
    
    .coletivo-titulo {
        font-size: 2rem;
        margin-bottom: 0.75rem;
    }
    
    .coletivo-resumo {
        font-size: 1.25rem;
        line-height: 1.65;
    }
}

/* Responsivo - Tablet (768px - 991px) */
@media (min-width: 768px) and (max-width: 991px) {
    .coletivo-item {
        flex-direction: row !important;
        padding-bottom: 2.25rem;
        margin-bottom: 2.25rem;
    }
    
    .coletivo-item > .coletivo-imagem {
        flex: 0 0 33.333% !important;
        width: 33.333% !important;
        max-width: 33.333% !important;
        padding-right: 1rem;
    }
    
    .coletivo-item > .coletivo-meta {
        flex: 0 0 66.667% !important;
        width: 66.667% !important;
        max-width: 66.667% !important;
    }
    
    .coletivo-titulo {
        font-size: 2.35rem;
        margin-bottom: 1rem;
    }
    
    .coletivo-resumo {
        font-size: 1.35rem;
        line-height: 1.7;
    }
}

/* Responsivo - Desktop médio (992px - 1199px) */
@media (min-width: 992px) and (max-width: 1199px) {
    .coletivo-item {
        flex-direction: row !important;
    }
    
    .coletivo-item > .coletivo-imagem {
        flex: 0 0 25% !important;
        width: 25% !important;
        max-width: 25% !important;
        padding-right: 1.5rem;
    }
    
    .coletivo-item > .coletivo-meta {
        flex: 0 0 75% !important;
        width: 75% !important;
        max-width: 75% !important;
    }
}

/* Responsivo - Desktop grande (1200px+) */
@media (min-width: 1200px) {
    .coletivo-item {
        flex-direction: row !important;
        padding-bottom: 3rem;
        margin-bottom: 3rem;
    }
    
    .coletivo-item > .coletivo-imagem {
        flex: 0 0 25% !important;
        width: 25% !important;
        max-width: 25% !important;
        padding-right: 2rem;
    }
    
    .coletivo-item > .coletivo-meta {
        flex: 0 0 75% !important;
        width: 75% !important;
        max-width: 75% !important;
    }
    
    .coletivo-titulo {
        font-size: 2rem;
        margin-bottom: 1.5rem;
    }
    
    .coletivo-resumo {
        font-size: 1.65rem;
        line-height: 1.8;
    }
}

/* Hover sutil no item inteiro */
.coletivo-item:hover {
    background-color: rgba(0,0,0,0.015);
    transition: background-color 0.3s ease;
}

/* Garantir que o texto não quebre de forma estranha */
.coletivo-titulo,
.coletivo-resumo {
    word-wrap: break-word;
    overflow-wrap: break-word;
}

/* ===== ESTILOS ANTIGOS ABAIXO (manter compatibilidade) ===== */

.coletivo-item h3.h6 a {
    color: #111;
    text-decoration: none;
    font-weight: 700; /* título mais proeminente */
}

.coletivo-item h3.h6 a:hover {
    text-decoration: underline;
}

.coletivo-meta p {
    margin-bottom: 5.25rem;
}

.coletivo-meta .resumo {
    color: #555; /* tom ligeiramente mais escuro para destaque */
}

/* Em telas muito pequenas reduzir padding e tamanho das imagens */
@media (max-width: 576px) {
    .coletivo-item { padding-top: 0.4rem; padding-bottom: 0.4rem; }
    .coletivo-meta .resumo { font-size: 0.9rem; }
}

/* Hover leve para melhorar affordance */
.coletivo-item:hover { background-color: rgba(0,0,0,0.02); }


.topo-campanha {
	width:1000px;
	float:left;
	padding-bottom:42px;
	background:url(/image/bg-topo-tags.jpg) no-repeat left bottom;
	font-size:28px;
	color:#000;
    margin-bottom: 50px;
}
.topo-campanha .logo-campanha {
	float:left;
}
.topo-campanha .descr-campanha {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	color:#737373;
	font-size:16px;
	padding-top:14px;
	float:left;
	/*margin-left:10px;*/
}
.topo-campanha .descr-campanha h2 {
	color:#000;
	display:block;
	font-size:24px;
	padding-bottom:10px;
}
.mais-vistos {
	width:1000px;
	float:left;
	padding-top:30px;
}
.mais-vistos .galerias {
	width:480px;
	float:left;
}
.campanha { 
	width:100%;
	float:left;
	display:block;
	padding-top:21px;
}
#campanha-destaques { float:left; width:315px; }
.topo-box-destaques {
	width:315px;
	height:57px;
	float:left;
	background:url(../image/bg-traco-amarelo.jpg) no-repeat left bottom;
	font-size:24px; font-weight:bold; color:#000; line-height:24px;
}
#campanha-destaques .moldura { background:#ebeae7; }
#campanha-destaques .campanha-destaques-menu { padding:5px; }
#campanha-destaques .campanha-destaques-menu ul { background:#ffffff; }
#campanha-destaques .campanha-destaques-menu ul li { font-size:14px; font-weight:bold; }
#campanha-destaques .campanha-destaques-menu ul li a { color:#000; display:block; height:29px; line-height:29px; padding-left:24px; width:265px; }
#campanha-destaques .campanha-destaques-menu ul li a.campanha-destaques-menu-item-seta-fraca { background:url('../image/campanha-destaques-menu-seta-fraca.jpg') no-repeat 25px center; text-indent:30px; }
#campanha-destaques .campanha-destaques-menu ul li a.campanha-destaques-menu-item-seta-forte { background:url('../image/campanha-destaques-menu-seta-forte.jpg') no-repeat 10px center ; text-indent:10px; }
#campanha-destaques .campanha-destaques-menu ul li.campanha-destaques-menu-linha { background:url('../image/campanha-destaques-menu-linha.jpg') no-repeat center; height:1px; }
#campanha { background:#ebeae7; float:right; margin-top:45px; padding:10px; width:646px; }
#campanha p { font-size:12px; padding:10px 0; }
#campanha .campanha-titulo { color:#000; font-size:26px; font-weight:bold; padding:10px; }
.campanha-texto { background:#f2f1ee; padding:0 10px; line-height:20px; }

#campanha .campanha-imagem-left { float:left;  margin:10px 10px 0 0; text-align:center; width:296px; }
#campanha .campanha-imagem-left img { margin-top:5px; }
#campanha .campanha-imagem-right { float:right; margin:10px 10px 0 0; text-align:center; width:296px; }
#campanha .campanha-imagem-right img { margin-top:5px; }

.midia-campanha-corpo {width:auto;float:left;position:relative;margin-bottom:8px;display:inline;}
.img-campanha-corpo {width:auto;float:left;position:relative;margin-bottom:8px;display:inline;}
.legenda-campanha-corpo {width:100%;left:0;bottom:0;background:#000000;opacity:0.60;-moz-opacity: 0.60;filter: alpha(opacity=60);font-family:Verdana, Arial, Helvetica, sans-serif;color:#FFFFFF;font-size:12px;}
.creditos-campanha-corpo{font-size:9px;margin:2px;text-align:right;width:296px;}
.legenda-campanha-corpo .texto-legenda {margin-bottom:0;line-height:12px;padding-left:10px;padding-top:8px;padding-bottom:8px;}


@media (max-width:999px) {

    #destaques { width:100%; margin-top:0; }

    .topo-campanha { width:100%; }
    .topo-campanha .logo-campanha { float: left; width: 100px; height: auto; margin-right:15px; }
    .topo-campanha .descr-campanha { font-size: 14px; float: initial; }
    .topo-campanha .descr-campanha br { display:none; }

    #campanha { padding:0; width:100%; float:left; margin-top:0px; }
    #campanha p { font-size:14px; }

    .campanha-texto img { max-width: 100%; height:auto; }
    .campanha-texto p { word-wrap: break-word; }
    .campanha-texto table { height:auto; width:100%!important; margin-left:0!important; max-width:100%; box-sizing: border-box; }

    #campanha-destaques { float:left; margin-top:30px; width:100%; box-sizing: border-box; }
    #campanha-destaques .moldura { max-width:315px; float:left; width: 100%; box-sizing: border-box; }
    #campanha-destaques .campanha-destaques-menu { max-width: 100%; width: 100%; box-sizing: border-box; }

    .topo-box-mobilize-se,
    .topo-box-destaques { width:100%; }
    
    .mobilize-se-left,
    .mobilize-se-right { width:49%; margin:0; }
    .mobilize-se-left { margin-right:1%; }
    .mobilize-se-imagem { margin-right:10px; }
    .mobilize-se-float { float:initial; width:initial; }

    .banner-avalie,
    .banners { float:left; margin-left:30px; margin-top:0; }

    .mais-vistos,
    .dv-noticias-relacionadas { display: none; }

    #campanha-filtro { width:80%; min-height:55px; height:auto; background:url('../image/bg-img-filtro.jpg') repeat-y; }
    #campanha-panorama-mapa { width:100%; height:auto; }

    #enderecos_reclame_aqui, #enderecos_cadastre_projeto { width:100%; }
    #googleMaps_reclame_aqui, #googleMaps_cadastre_projeto { width:100%; }
    .formulario-page #campanha-destaques { margin-top:50px; }
    .input-grande { max-width:80%; }

    .formulario-page .box-resposta { width:48%; margin-left:2%; box-sizing:border-box; padding-bottom:0; }
    .formulario-page .resp { margin-right:10px; }
    .formulario-page .descr-resposta { width:auto; float:initial; }
}

@media (max-width:700px) {

    .mobilize-se-left,
    .mobilize-se-right { width:100%; margin-right:0; }
    #campanha-filtro { width:90%; }

    .formulario-page .top-container .boxes .box { width:100%; max-width:300px; float:initial; margin:0 auto; }
    .formulario-page .top-container .boxes .box-center { margin-bottom:10px; margin-top:10px; }

}

@media (max-width:680px) {
    
    .banner-avalie,
    .banners { margin-left:0; clear:both; margin-top:20px;  }
    .banner-avalie img,
    .banners img { max-width:100%; height:auto; }
}

@media (max-width:680px) {
    
    .formulario-page .box-resposta { width:100%; box-sizing:border-box; }

}

@media (max-width:550px) {

    .login-reclame span { padding-top: 0px; margin-left: 0px; height: 22px; line-height: 22px; width: 50px; display:block; margin-bottom:5px; }
    .login-reclame input { margin-bottom:5px; }
    .login-reclame span.dv-senha { clear:left; }
    .descr-login-reclame { margin-left:0; }
    .descr-login-reclame { clear:left; }

}

@media (max-width:480px) {

    #campanha-destaques { margin-left:0; }
    #campanha-filtro { width:100%; }

    .formulario-page .top-container table { overflow:hidden; }
    .formulario-page .top-container table tr td { word-break: break-word; word-wrap: break-word; }
    .formulario-page .top-container table tr td a { font-size:13px; }

    .formulario-page .btn-limpar-notas { font-size:12px; }
    .formulario-page .btn-enviar-notas { font-size:12px; }

}