body::-webkit-scrollbar {
    width: 12px;               /* width of the entire scrollbar */
  }
  
  body::-webkit-scrollbar-track {
    background: rgba(17, 17, 16, 0);        /* color of the tracking area */
  }
  
  body::-webkit-scrollbar-thumb {
    background-color: #c9c9c9;    /* color of the scroll thumb */
    border-radius: 20px;       /* roundness of the scroll thumb */
    border: 3px solid rgb(0, 0, 0);  /* creates padding around scroll thumb */
  }

.projetos {
    height: 100%;
    width: 100%;
    display: flex;
    flex-direction: column;
}

.projetos__cards {
    display: flex;
    flex-direction: column;
    gap: 50px;
}

.projetos__cards{
    display: flex;
    margin-left: 104px ;
    height: 100%;
    

    
}

.projetos__card {
    display: flex;
    align-items: flex-start;
    gap: 40px;
}

.deixar-em-coluna {
    display: flex;
    flex-direction: column;

}

.card__imagem  {
    width: 100%;
    border-radius: 20px;
    object-fit: cover;
    max-width: 660px;
    transition: 0.4s;
    height: 460px;
}

.card__imagem:hover {
    border-radius: 23px;
    opacity: 0.9;
}

.card__titulo {
    font-size: 30px;
    font-weight: 600;
    margin-top: 8px;
    margin-bottom: 20px;
}

.card__descricao {
font-size: 20px;
}



.deixar-em-coluna p {
    margin-top: 20px;
    margin-bottom: 32px;
}


/* BTN */

.wrapper {
    display: flex;
  }
  
  .cta {
      display: flex;
      padding: 10px 20px;
      text-decoration: none;
      font-family: 'Poppins', sans-serif;
      font-size: 20px;
      color: white;
      background: #a8a8a89f;
      transition: 1s;
      box-shadow: 6px 6px 0 black;
      transform: skewX(-15deg);
  }
  
  .cta:focus {
     outline: none; 
  }
  
  .cta:hover {
      transition: 0.5s;
      box-shadow: 10px 10px 0 #141414;
  }
  
  .cta span:nth-child(2) {
      transition: 0.5s;
      margin-right: 0px;
  }
  
  .cta:hover  span:nth-child(2) {
      transition: 0.5s;
      margin-right: 45px;
  }
  
    span {
      transform: skewX(15deg);
      color: black;
    }
  
    span:nth-child(2) {
      width: 5px;
      margin-left: 5px;
      position: relative;
      top: -60%;
    }
    
  /**************SVG****************/
  
  path.one {
      transition: 0.4s;
      transform: translateX(-60%);
  }
  
  path.two {
      transition: 0.5s;
      transform: translateX(-30%);
  }
  
  .cta:hover path.three {
      animation: color_anim 1s infinite 0.2s;
  }
  
  .cta:hover path.one {
      transform: translateX(0%);
      animation: color_anim 1s infinite 0.6s;
  }
  
  .cta:hover path.two {
      transform: translateX(0%);
      animation: color_anim 1s infinite 0.4s;
  }
  
  /* SVG animations */
  
  @keyframes color_anim {
      0% {
          fill: rgb(70, 69, 69);
      }
      50% {
          fill: #91908e;
      }
      100% {
          fill: rgb(56, 55, 55);
      }
  }


  .botoes-paginacao {
    display: flex;
    justify-content: center;
    gap: 20px;
    margin-bottom: 30px;
    margin-top: 30px;
    align-items: center;
  }
  

  .botoes-paginacao button {
    text-align: center;
    width: 40px;
    height: 30px;
    cursor: pointer;
    border-radius: 5px;
    font-weight: bold;
    background-color: transparent;
    transition: 0.3s;
    border: 2px solid black;
  }


  .botoes-paginacao button:hover {
    background-color: #c9c9c9 ;
  }




