header{	z-index:98;	width:100%; margin:0 auto; padding:0;}
/*CORES
vermelho original #ed3237
azul original #3051a0 
cinza claro #f7f7f7
cinza escuro #4c4c4c
*/

h1 {color:#FFF; font-size:26pt; margin:0; padding-bottom:10px; font-weight:900;}
h2 {color:#3051a0; font-size:26pt; margin:0; font-weight:900;}
h3 {color:#3051a0; font-size:18pt; margin:0; font-weight:900;}

.topo_page{ clear:both; z-index:99999; padding-top:220px; box-shadow: 0 4px 4px rgba(50, 50, 50, 0.3); background-image:url(../images/topo.jpg); background-repeat:no-repeat; background-size:100% 210px; background-color:#3051a0}

.central { width:95%; margin:0 auto; max-width:1200px; box-sizing: border-box; clear:both}
.central_contato { width:95%; margin:0 auto; max-width:1200px; box-sizing: border-box; clear:both; }
.central_mapa { width:95%; margin:0 auto; max-width:1200px; box-sizing: border-box; clear:both; }
.central_roda { width:95%; margin:0 auto; max-width:1200px; box-sizing: border-box; clear:both}
.slides { width:95%; margin:0 auto; max-width:1190px; box-sizing: border-box; clear:both}

.espaco{ clear:both; height:40px}
.espaco_P{ clear:both; height:20px}

#topo-master {box-sizing: border-box; margin:0; padding:0px; width:100%; position:absolute; top:0; z-index:3;top: 0px; border-top:#ed3237 10px solid}
.topo_fundo{padding-top:30px; padding-bottom:30px}

.topo { width:95%; margin:0 auto; max-width:1225px; box-sizing: border-box;}
.lateral_logo{box-sizing: border-box; padding-top:40px; float:right} 
.logo{box-sizing: border-box; float:left; width:20%; text-align:left}
.logo_img{ content:url(../images/c3empreendimentos.png); height:144px;}
.logo_img_home{ content:url(../images/c3empreendimentos_home.png); height:144px;}
.linha_topo{ width:100%; background-image:url(../images/linha_topo.png); height:7px; display:none}

/*//////////MENU//////////////////////////////*/
.menu{ display: flex; justify-content: center;  align-items: center; list-style: none; font-size:14pt; border:0; font-weight:400; text-decoration:none; margin:0; font-family: 'Montserrat', sans-serif; text-transform:uppercase}
.menu li{ position:relative;}
.menu li a{ color:#FFF; display:block; border:0; margin:0; padding:15px; text-shadow:#000 0px 0px 4px}
.menu li a:hover{ }

/*//////////MENU FLUTUANTE//////////////////////////////*/
#carrinho-scrow{height: 70px; position: fixed; width: 100%; display:none; z-index:3;top: 0px; background-color:#3051a0; border-bottom:1px solid #000}

.logo_cima {float:left; text-align:left; width:240px; padding-top:15px}
.icone_cima { display:none}
.logo_img_p{ width:90%;}
.lateral_logo_cima{box-sizing: border-box; float:right; padding-top:8px; padding-bottom:8px}

.menu_p{ list-style:none; font-size:12pt; font-weight:400; border:0; text-decoration:none; margin:0; font-family: 'Montserrat', sans-serif;}
.menu_p li{ position:relative; float:left; text-align:center;}
.menu_p li a{ color:#FFF; display:block; border:0; margin:0; padding:15px; text-transform:uppercase; letter-spacing:1}
.menu_p li a:hover{ }
/*//////////MENU FLUTUANTE END/////////////////////////*/

/*BANNER*/
.banner_mobile{ display:none}
.banner{ box-sizing:border-box; height:720px; background-color:#000000; overflow:hidden;}
.banner_points{ box-sizing:border-box; height:720px; background-image:url(../images/mask_points.png)}

.banner_img{ height:720px; background-position:center; background-repeat:no-repeat; background-size:cover}
.banner_base { position: absolute; top: 0; left: 0; width: 100%; height: 100%;  z-index: 99; display: flex; justify-content: center; align-items: center;}
.banner_infos { box-sizing: border-box; width: 70%; max-width: 1200px;text-align: center; text-shadow: 2px 2px 4px rgba(0,0,0,0.5);}

.banner_titulo{ color:#FFF; font-size:40pt; font-family: "Crimson Text", serif; font-weight: 600; font-style: italic;}
.banner_texto{ color:#FFF; font-size:15pt;}
.banner_bt{color:#FFF; font-size:13pt; border: 1px solid #FFF; padding:15px; margin:0 auto; display:inline-block; opacity:0.6; margin-top:20px; font-weight:300; border-radius:2px; animation: subirRevelar 0.8s ease-out forwards; transition: all 0.3s ease;}
.banner_bt:hover{background-color:#3051a0; opacity:0.9; transition: all 0.3s ease; }


/*EMPREENDIMENTOS HOME*/
.empreendimentos_base{ margin:0 auto; text-align:center; padding-top:50px}
.empreendimentos_home_esquerda{ box-sizing:border-box; width:100%;  padding-top:30px; box-sizing:border-box;
 opacity: 0; transform: translateX(-50px); transition: transform 2s, opacity 1s;overflow:hidden;}
.empreendimentos_home_esquerda.visivel { opacity: 1; transform: translateX(0);}
.empreendimentos_home_direita{ box-sizing:border-box; width:100%; box-sizing:border-box; opacity: 0; transform: translateX(50px); transition: transform 2s, opacity 1s; text-align:center; padding-top:20px; overflow:hidden;}
.empreendimentos_home_direita.visivel { opacity: 1; transform: translateX(0);}

.empreendimentos_home_subtitulo{  font-size:20pt; font-family: "Crimson Text", serif; font-style: italic;}
.empreendimentos_home_titulo{  font-size:40pt; font-weight:900; margin-bottom:10px; color:#ed3237; font-family: "Crimson Text", serif; font-weight: 600; font-style: italic; margin-top:-10px}
.empreendimentos_home_botao{color:#FFF; font-size:13pt; border: 1px solid #FFF; padding:15px; margin:0 auto; display:inline-block; opacity:0.6; margin-top:20px; font-weight:300; border-radius:2px; animation: subirRevelar 0.8s ease-out forwards; transition: all 0.3s ease;}
.empreendimentos_home_botao:hover{background-color:#3051a0; opacity:0.9; transition: all 0.3s ease; }

.empreendimentos_box{ box-sizing:border-box; margin:0px; margin-bottom:30px; padding:0px}
.empreendimentos_box_home{ box-sizing:border-box; margin:5px; margin-bottom:30px; padding:5px}
.empreendimentos_box_foto{background-size:cover; height:500px; background-position:center; margin-bottom:10px; position: relative; outline: 2px solid white;
  outline-offset: -2px; /* Começa colada na borda interna */
  
  /* Transição Suave */
  transition: outline-offset 0.3s ease, outline-color 0.3s ease;}
.empreendimentos_box_foto:hover {
  /* Retrai a borda para dentro criando o efeito de 10px */
  outline-offset: -12px; 
  /* (10px de padding desejado + 2px da largura da borda) */
}
.empreendimentos_box_nome{ font-size:15pt; color:#4c4c4c; font-weight:300; height:60px; margin:0 auto; text-align:center; box-sizing:border-box; margin-bottom:10px}
.empreendimentos_box_txt{ font-size:11pt; background-color:#FFFFFF; color:#4c4c4c; text-align:center; padding:10px; position:absolute; right:10px; bottom:10px}

.empreendimentos_grade{display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }



/*empreendimento detalha*/

.empreendimento_banner_img{ height:600px; background-position:center; background-repeat:no-repeat; background-size:cover}
.empreendimento_banner_points{ box-sizing:border-box; height:600px; background-image:url(../images/mask_points.png); display: flex; flex-direction: column; justify-content: center; align-items: center;}
.empreendimento_banner_infos{ box-sizing:border-box; width:70%; margin:0 auto; padding-bottom:20px; text-align:center; text-shadow: 2px 2px 4px rgba(0,0,0,0.5);}
.empreendimento_banner_titulo{ color:#FFF; font-size:40pt; font-family: "Crimson Text", serif; font-weight: 600; font-style: italic; line-height: 1.2;}
.empreendimento_banner_texto{ color:#FFF; font-size:15pt;}

.apresentacao { padding-top:40px; padding-bottom:40px; text-align: center;}
.apresentacao-textos { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; text-align: left; margin-top: 30px; }
.apresentacao-destaque { border-left: 4px solid #ed3237; padding-left: 15px; font-size:40pt; font-weight:900; margin-bottom:10px; }
.apresentacao-txt { line-height:150%; font-size:14pt; line-height:150%; margin-bottom:30px;hyphens: auto; text-align:justify }
.apresentacao-botao{ color:#4c4c4c; font-size:13pt; border: 1px solid #4c4c4c; padding:15px; margin:0 auto; opacity:0.6;  font-weight:300; border-radius:2px; animation: subirRevelar 0.8s ease-out forwards; transition: all 0.3s ease; text-transform:uppercase; display: table; margin: 0 auto 0 auto; margin-bottom:40px;}
.apresentacao-botao:hover{background-color:#3051a0; color:#FFF; opacity:0.9; transition: all 0.3s ease; }

/* Andamento da Obra - 3 Colunas (Stickers com Porcentagem) */
.sessao-obras { background-color: #f7f7f7; padding: 60px 0; }
.grid-obras { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px;}
.fase-card { background: var(--branco); padding: 20px; border-radius: 5px; box-shadow: 0 2px 5px rgba(0,0,0,0.05); }
.fase-topo { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; }
.fase-nome { font-weight: bold; color: #3051a0; text-transform: uppercase; font-size: 0.85rem; }
.fase-perc { background: #ed3237; color: #FFF; padding: 2px 8px; border-radius: 12px; font-size: 0.8rem; }
.barra-fundo { background: #e0e0e0; height: 8px; border-radius: 4px; overflow: hidden; }
.barra-progresso { background: #3051a0; height: 100%; transition: width 1s ease-in-out; }

/* Vídeo Incorporado */
.video-box { padding: 60px 0; max-width: 900px; margin: 0 auto; }
.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; }
.embed-container iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0; }

/* Formulário de Contato */
.sessao-contato { background-color: #3051a0; color: #FFF; padding: 60px 0; }
.form-contato { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; max-width: 700px; margin: 30px auto 0; }
.form-contato input, .form-contato textarea { padding: 12px; border: none; border-radius: 3px; width: 100%; box-sizing: border-box; }
.form-contato textarea { grid-column: span 2; height: 80px; }
.btn-enviar { grid-column: span 2; background: #ed3237; color: #FFF; border: none; padding: 15px; cursor: pointer; font-weight: bold; text-transform: uppercase; transition: 0.3s; }
.btn-enviar:hover { background: #c1272c; }







/*QUEM HOME*/
.quem_home_base{ margin:0; padding:0; clear:both; padding-top:70px; padding-bottom:70px; box-sizing:border-box; width:100%; overflow:hidden; background-color:#f7f7f7; text-align:center}
.quem_home_sep_cima{ background-color:#3051a0;  height:18px; width:100%; border-top:18px solid #ed3237}

.quem_home_logo{ text-align:center; padding-bottom:50px; padding-top:50px}
.quem_home_grade{ display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; text-align:left}
.quem_home_esquerda{ box-sizing:border-box; padding-top:40px; padding-right:40px; opacity: 0; transform: translateX(-50px); transition: transform 2s, opacity 1s;overflow:hidden;}
.quem_home_direita{ box-sizing:border-box; padding-top:40px; opacity: 0; transform: translateX(50px); transition: transform 2s, opacity 1s;overflow:hidden;}
.quem_home_esquerda.visivel { opacity: 1; transform: translateX(0);}
.quem_home_direita.visivel { opacity: 1; transform: translateX(0);}
.quem_home_titulo{  font-size:40pt; font-weight:900; margin-bottom:10px; }
.quem_home_texto{ font-size:14pt; line-height:150%; margin-bottom:30px; hyphens: auto; text-align:justify}
.quem_botao{ color:#4c4c4c; font-size:13pt; border: 1px solid #4c4c4c; padding:15px; margin:0 auto; display:inline-block; opacity:0.6; margin-top:20px; font-weight:300; border-radius:2px; animation: subirRevelar 0.8s ease-out forwards; transition: all 0.3s ease; text-transform:uppercase}
.quem_botao:hover{background-color:#3051a0; opacity:0.9; transition: all 0.3s ease; }


/* BANNER DOIS*/
.ken-burns-container {
    position: relative; /* Necessário para posicionar o conteúdo e a imagem */
    width: 100%; /* Largura total da tela */
    height: 600px; /* Altura fixa de 800px */
    overflow: hidden; /* Esconde a parte da imagem que sai do container durante a animação */
	background-color:#000
}

/* A imagem que sofrerá o efeito Ken Burns */
.ken-burns-image {
    position: absolute; /* Ocupa todo o espaço do container pai */
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover; /* A imagem cobre todo o container */
    background-position: center; /* Centraliza a imagem */
	opacity:0.6;
    
    /* Prepara a animação, mas não a inicia ainda */
    transition: transform 10s ease-out; /* Define a duração e suavidade da transição */
}

/* Classe que será adicionada via JavaScript quando a seção for visível */
.ken-burns-container.visible .ken-burns-image {
    transform: scale(1.1) translate(10px, -10px); /* Aplica o zoom e um pequeno movimento */
}

/* Conteúdo centralizado sobre a imagem */
.ken-burns-content {
    position: absolute; /* Posiciona sobre a imagem */
    top: 50%; /* Centraliza verticalmente */
    left: 50%; /* Centraliza horizontalmente */
    transform: translate(-50%, -50%); /* Ajusta a posição exata para o centro */
    text-align: center; /* Centraliza o texto */
    color: white; /* Cor do texto (ajuste conforme sua imagem) */
    z-index: 10; /* Garante que o texto fique acima da imagem */
    text-shadow: 2px 2px 4px rgba(0,0,0,0.5); /* Adiciona sombra ao texto para melhor leitura */
}

/* Estilos opcionais para o texto */
.ken-burns-content h1 {
    font-size: 40pt;
	font-family: "Crimson Text", serif; font-style: italic;
    margin-bottom: 10px;
}
/*


/*RODAPE*/
.rodape_sep_cima{ background-color:#3051a0;  height:18px; width:100%; border-top:18px solid #ed3237}
.rodape_base{ background-color:#f7f7f7; padding-top:100px; padding-bottom:100px;}
.roda_redes{ box-sizing:border-box; display: flex; justify-content: center;  align-items: center; gap: 10px; flex-wrap: wrap; padding: 10px;}
.rede{box-sizing:border-box; width:32px; margin-bottom:10px; }
.roda_divide{ box-sizing:border-box; max-width:30%; float:left; text-align:left;  padding-right:40px}
.roda_logo{box-sizing:border-box; width:25%; float:right; text-align:center; padding-top:10px}
.roda_logo_img{ width:90%;}
.roda_slogan{font-size:10pt; padding-top:20px; padding-bottom:20px}
.roda_titulo{ font-weight:900; font-size:16pt; padding-bottom:10px;}
.roda_dados{ font-size:10pt; min-height:40px; margin-bottom:20px; clear:both; padding-top:5px}
.roda_tele{ font-size:14pt; font-weight:700; clear:both}
.link_roda{ font-size:10pt;}
.link_roda::before { content: '» ';}
.roda_serv{ display:none}

/*MISSÂO*/
.dados_base{ background-color:#f7f7f7; padding-top:30px; padding-bottom:50px; box-sizing:border-box; width:100%; }
.dados{ box-sizing:border-box; width:33.33%; float:left; font-size:14pt; text-align:justify; text-overflow: ellipsis; hyphens: auto;}
.dados_titu{ font-size:30pt;  font-weight:900; text-align:justify; margin-bottom:10px; padding-top:20px; font-family: "Crimson Text", serif; font-style: italic;}
.esq{ padding-right:40px;}
.meio{ padding-right:20px; padding-left:20px;}
.dir{padding-left:40px;}
.dados_final{}

.bloco{line-height:150%; margin:0px; padding-top:5px; text-align:justify; font-size:16pt; hyphens: auto;}
.bloco_fotos {width:40%; float:right; padding-left:3%}
.coluna{-moz-column-count: 2;-webkit-column-count: 2;-moz-column-gap: 50px;-webkit-column-gap: 50px; text-align:justify}

.bloco_contato_esq {width:60%;	float:left; box-sizing:border-box; background-image:url(../images/sep.png); background-position:right; background-repeat:no-repeat; padding-right:100px; }
.bloco_contato_dir {width:40%;	float:right; padding:50px; margin-bottom:30px; box-sizing:border-box; font-size:14pt}

.mapa{width:58%; height:350px; border:0;}
.mapa_titulo{ margin-bottom:20px}
