html {
  scroll-behavior: smooth;
}

::-webkit-scrollbar {
  width: 8px;
}

::-webkit-scrollbar-track {
  background: #f1f5f9;
  border-radius: 10px;
}

::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #14b8a6, #3b82f6);
  border-radius: 10px;
  transition: all 0.3s ease;
}

::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, #0d9488, #2563eb);
  width: 12px;
}

/* Para Firefox */
* {
  scrollbar-width: thin;
  scrollbar-color: #14b8a6 #f1f5f9;
}

.masonry-container {
  column-count: 1;
  column-gap: 1.5rem;
}

@media (min-width: 768px) {
  .masonry-container {
    column-count: 2;
  }
}

@media (min-width: 1024px) {
  .masonry-container {
    column-count: 2;
  }
}

@media (max-width: 767px) {
  .masonry-container {
    img {
      max-height: 350px;
      object-position: top !important;
    }
  }
}

.masonry-item {
  display: inline-block;
  width: 100%;
  margin-bottom: 1.5rem;
  break-inside: avoid;
  max-height: 200px;
}

.card-text p {
  overflow: hidden;
  transition: max-height 0.3s ease;
}

.card-text.collapsed p {
  display: -webkit-box;
  -webkit-line-clamp: 5;
  line-clamp: 5;
  -webkit-box-orient: vertical;
}

.smooth-scroll {
  scroll-behavior: smooth;
  transition: all 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}