* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    }

    body {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    }

    /* Barras de menu superiores */
    .top-bar-1 {
    height: 30px;
    background: #f1f1f1;
    }


    .top-bar-2 {
    background: linear-gradient(90deg, var(--azul-cnen) 0%, var(--azul-cnen-50) 31%, var(--azul-cnen) 100%);
    color: white;
    padding: 1rem;
    box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.3);
    }


    /* Layout principal */
    .main-container {
    display: grid;
    grid-template-columns: .8fr 3.2fr;
    flex: 1;
    gap: 1rem;
    padding: 1rem  6rem;
    }


    /* Conteúdo principal */
    .content {
    background-color: #fff;
    padding: 1rem;
    }

    /* Rodapé */
    footer {
    background: linear-gradient(90deg, var(--azul-cnen) 0%, var(--azul-cnen-50) 31%, var(--azul-cnen) 100%);
    color: white;
    text-align: center;
    padding: 1rem;
    }

    .copyright {
    color: var(--cinza-cnen-50);
    font-size: .6rem;
    }



    .menu-hamburger {
    display: none;
    }


    .sidebarShow {
    margin-left: 20px;
    margin-top: -30px;
    visibility: visible;
    opacity: 1;
    display: block;
    }

  
    @media (max-width: 1280px) {

       .menu-hamburger {
      margin-top: 20px;
      margin-left: 50px;
      display:block;
      background-color: rgb(202, 202, 202);
      border-radius: 4px;
      width: 30px;
      height: 30px;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      padding: 7px 4px;
      cursor: pointer;
      }

      .menu-hamburger div {
      width: 100%;
      height: 0.15rem ; 
      background-color: var(--azul-cnen);
      }

       .sidebar {
      display: none;
      opacity: 0;
      visibility: hidden;
      transition: all 2s;
      }

      .barra1 {
      margin-top: 2px;
      transform: rotate(50deg) translate(20%, 150%);  
    }

    .barra2 {
      display: none;
    }

    .barra3 {
      margin-bottom: 2px;
      transform: rotate(-50deg) translate(10%, -130%);
    }

     .main-container {
      grid-template-columns: 1fr;
      padding: 1rem  2rem;
      }

}


@media (max-width: 950px) {

    .barra1 {
      margin-top: 2px;
      transform: rotate(50deg) translate(20%, 150%);  
    }

    .barra2 {
      display: none;
    }

    .barra3 {
      margin-bottom: 2px;
      transform: rotate(-50deg) translate(10%, -130%);
    }

      .menu-hamburger {
      margin-top: 20px;
      margin-left: 50px;
      display:block;
      background-color: rgb(202, 202, 202);
      border-radius: 4px;
      width: 30px;
      height: 30px;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      padding: 7px 4px;
      cursor: pointer;
      }

      .menu-hamburger div {
      width: 100%;
      height: 0.15rem ; 
      background-color: var(--azul-cnen);
      }


      .sidebar {
      display: none;
      opacity: 0;
      visibility: hidden;
      transition: all 2s;
      }

      .content {
      width: 500px;
      }

      .main-container {
      grid-template-columns: 1fr;
      padding: 1rem  2rem;
      }

      .top-bar-2 ul {
      flex-direction: column;
      gap: 0.5rem;
      }   
}


@media (max-width: 590px) {
  .logoCnen {
    width: 80%;
  }
}