/* ! Projects.html */
.projects-list {
  width: 100%;
  max-height: 100%;
  height: 90vh;
  min-height: 400px;
  display: flex;
  justify-content: center;
  align-items: flex-end;
  flex-direction: column;
  line-height: 20px;
  opacity: 0;
  gap: 50px;

  /* scroll senza barra */
  overflow-y: auto;
  scrollbar-width: none;        /* Firefox */
  -ms-overflow-style: none;     /* IE/Edge */

  padding: 30px 0px;

  mask-image: linear-gradient(
    to bottom,
    transparent 0%,
    black 15%,
    black 85%,
    transparent 100%
  );
  -webkit-mask-image: linear-gradient(
    to bottom,
    transparent 0%,
    black 15%,
    black 85%,
    transparent 100%
  );
}

/* Chrome, Safari, Opera */
.projects-list::-webkit-scrollbar {
  display: none;
}

/* stato base */
.projects-list .item {
  transition: opacity 0.2s ease;
  font-size: 50px;
  opacity: 0;
  line-height: 55px;
  display: flex;flex-direction: column;
  text-align: right;
}
.projects-list .item span{
  line-height: 15px;
  font-size: 15px;
  color: var(--cool-grey);
  text-align: right;
  font-weight: 450;
}
@media (max-width: 768px) {
.projects-list .item {
  transition: opacity 0.2s ease;
  cursor: pointer;
  font-size: 20px;
  opacity: 0;
  line-height: 25px;
  display: flex;flex-direction: column;
}
.projects-list .item span{
  line-height: 15px;
  font-size: 15px;
  color: var(--cool-grey);
}
}

/* stato base: GSAP farà arrivare le card a opacity 0.3 */
.card-fade-up {
  transition: opacity 0.25s ease;
}

.projects-list .card-fade-up:hover {
  opacity: 1 !important;
}