@charset "UTF-8";

@import url("tema_padrao.css");
@import url("reset.css");
@import url("animacoes.css"); 

@import url("bento_tarefa_andamento.css");

#inicio{

    display: grid;
    grid-template-columns: 1fr .5fr 1fr 1fr 1fr 1fr 1fr;
    grid-template-rows: 2fr 1fr .6fr .1fr 1fr;

     grid-template-areas:
      "marca marca cartaz cartaz tarefa_estoque tarefa_andamento tarefa_concluida"
      "titulo titulo equipe equipe exec_trabalho exec_trabalho exce_orcamento"
      "funcao avatar equipe equipe exec_trabalho exec_trabalho exce_orcamento"
      "separador separador separador separador separador separador separador"
      "noticia_imagem timeline timeline timeline timeline timeline timeline"; 


    width: 97dvw;
    height: 94dvh;
    gap: .5dvw;
  }

  .bento_item{
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
 
    border-radius: var(--item-bento-raio-borda);
/*     border: .15dvw solid var(--cor-4);
 */    z-index: 100;
     filter: drop-shadow(-3px 3px 2px rgba(0 0 0 / .2)); 
     perspective: 1500px;
    background-color: transparent;
  }

  .legenda_item_bento{
    position: absolute;
    display: block;
    top: .5dvw;
    left: .5dvw;
    font-weight:lighter;
    color: #fff;
    opacity: .9;
    font-size: .5rem;
    font-family: var(--tipo-geral);

    margin-block-start: 0;
    margin-block-end: 0;
    margin-inline-start: 0;
    margin-inline-end: 0;
    padding-inline-start: 0;
  }

  .titulos{
    font-family: var(--tipo-geral);
  
  }

  .container_dados_bento{
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-items: center;
    align-content: center;
    justify-content: center;
    text-align: center;
  }





  .bento_cartao_flip_h, .bento_cartao_flip_v{
    position: relative;
    width: 100%;
    height: 100%;
    text-align: center;
    transition: transform 0.8s;
    transform-style: preserve-3d;
    border-radius: var(--item-bento-raio-borda);


  }

  .bento_item:hover .bento_cartao_flip_h{
      transform: rotateY(180deg);
  }

  .bento_item:hover .bento_cartao_flip_v{
    transform: rotateX(0.5turn);
}

  .bento_face_frontal, .bento_face_traseira{
    position: absolute;
    width: 100%;
    height: 100%;
    -webkit-backface-visibility: hidden; /* Safari */
    backface-visibility: hidden;
    border-radius: var(--item-bento-raio-borda);

    
  }

  .bento_face_frontal{
    background-image: var(--gradiente-verde);
  }

  .bento_face_traseira{
    background-image: var(--gradiente-azul); transform: rotateY(180deg);
  }

  .bento_cartao_flip_h.hover-effect, .bento_cartao_flip_h:hover {
    transform: rotateY(180deg);
}

.bento_cartao_flip_v.hover-effect, .bento_cartao_flip_v:hover {
    transform: rotateX(180deg);
}


    /* BENTO TÍTULO */
    /* BENTO TÍTULO */
    /* BENTO TÍTULO */

  #titulo{
    grid-area: titulo;
    background-image: var(--gradiente-verde);
  }

  #nome_projeto{
    display: block;
    color: rgba(255 255 255 / .9);
    font-weight: bold;
    font-size: var(--tamanho-texto-bento);
    text-align: center;
  }


    /* BENTO MARCA */
    /* BENTO MARCA */
    /* BENTO MARCA */


  #marca{
    grid-area: marca;
    display: flex;
    align-items: center;
    justify-content: center;
    background-image: var(--gradiente-verde);
  }

  #marca_projeto{
    width: 15dvw;
  }


    /* BENTO CARTAZ */
    /* BENTO CARTAZ */
    /* BENTO CARTAZ */


  #cartaz{
    grid-area: cartaz;
/*         filter: grayscale(1); */
    background-image: var(--gradiente-verde);
  }


  #background-video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
  }



    /* BENTOS TAREFAS */
    /* BENTOS TAREFAS */
    /* BENTOS TAREFAS */


  #tarefa_estoque{
    grid-area: tarefa_estoque;
    background-image: var(--gradiente-verde);
  }

  #tarefa_concluida{
    grid-area: tarefa_concluida;
    background-image: var(--gradiente-verde);
  }





  
#numero_tarefas_em_andamento, #numero_tarefas_estoque, #numero_tarefas_concluida{
  letter-spacing: -.2dvw;
  display: block;
  margin: 0 0 0 1dvw;
  color: rgba(255 255 255 / .8);
  font-weight: bold;
  font-size: var(--tamanho-numero-tarefas);
  text-align: left;
  margin-top: .5dvw;
}



    /* BENTOS EQUIPE E GERENTE */
    /* BENTOS EQUIPE E GERENTE */
    /* BENTOS EQUIPE E GERENTE */



  #equipe{
    grid-area: equipe;
    background-image: var(--gradiente-verde);
    display: flex;
    flex-direction: column;
    align-items: center;


  }

  #container_equipe{
    width: 90%;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
    grid-template-rows: 1fr 1fr 1fr 1fr;
    gap: .6dvw;
    margin-top: 2.5dvw;
  }

  .avatar_equipe{
  width: 100%;
  opacity: .7;
  border-radius: var(--item-bento-raio-borda);
  }

  #avatar_gerente{
    grid-area: avatar;
    background-color: var(--cor-3);
    background-size: cover;
    background-position: center;
  }

  #funcao{
    grid-area: funcao;
    background-image: var(--gradiente-verde);

  }

  #nome_funcao{
    display: block;
    color: rgba(255 255 255 / .8);
    font-weight:normal;
    font-size: var(--tamanho-texto-bento);
  }


    /* BENTO ORCAMENTO EXECUTADO */
    /* BENTO ORCAMENTO EXECUTADO */
    /* BENTO ORCAMENTO EXECUTADO */


  #exce_orcamento{
    grid-area: exce_orcamento;
    background-image: var(--gradiente-verde) ;

  }




    /* BENTO TRABALHO EXECUTADO */
    /* BENTO TRABALHO EXECUTADO */
    /* BENTO TRABALHO EXECUTADO */


  #exec_trabalho{
    grid-area: exec_trabalho;
    background-image: var(--gradiente-verde);
  }


  #numero_exec_trabalho{
    letter-spacing: -.5dvw;
    display: block;
    margin: 0 0 0 1dvw;
    color: rgba(255 255 255 / .4);
    font-weight: bold;
    font-size: 8dvw;
    text-align: left;
  }


    /* BENTO TIMELINE */
    /* BENTO TIMELINE */
    /* BENTO TIMELINE */
  
  #timeline{
    grid-area: timeline;
    background: transparent;
    z-index: 1000;
    overflow: hidden;
  }

  #noticia_imagem{
    grid-area: noticia_imagem;
    height: 100%;
    width: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
  }
  
  #noticias_portal{
    position: relative;
   /*  display: flex;
    flex-direction:row; */
    /* flex-wrap: nowrap; */
  }
  
  
  
  .noticia_portal{
    font-family: var(--tipo-geral);
    user-select: none;
    

  }
  
  .noticia_portal_titulo{
    font-family: var(--tipo-geral);
    font-size: calc(var(--tamanho-texto-bento) * 1.2);
    font-weight: 400;
    font-style: normal;
    color: aliceblue;
    opacity: 1;

  }
  .noticia_portal_dia{
    font-family: var(--tipo-geral);
    font-size: var(--tamanho-legenda-bento);
    
  }
  
  .noticia_portal_hora{
    font-family: var(--tipo-geral);
    font-size: var(--tamanho-legenda-bento);
  }
  
  #noticia_descricao{
    font-family: var(--tipo-geral);
    opacity: .8;
    font-size: calc(var(--tamanho-texto-bento));
  }
  
  #noticia_cartao_descricao{
    display: flex;
    align-content: center;
    justify-content: center;
    align-items: center;
    justify-items: center;
    transform: rotateX(0.5turn);
  }
  
  .noticia_face_frontal{
    display: flex;
    flex-direction: column;
    justify-content: center;
    background-image: var(--gradiente-azul);
  }

  .noticia_face_traseira{
    background-image: var(--gradiente-verde);
    color: #fff;
  }

  

    /* BENTO METAS */
    /* BENTO METAS */
    /* BENTO METAS */


   #metas{
    display: none;
    grid-area: metas;
    background-image: var(--gradiente-verde);
  } 



#container_dados_bento{

margin-top: 1.8dvw;
}


#separador_grid{
  grid-area: separador;
}