/* Custom Cards Container */
.custom-cards-container {
    display               : grid;
    grid-template-columns : repeat(3, minmax(0,1fr));
    gap                   : 20px;
    margin                : 0 auto;
    padding               : 30px 0 50px;
}

  /* Responsive Grid Layout */
@media (max-width: 1024px) {
    .custom-cards-container {
        grid-template-columns : repeat(2, minmax(0,1fr));
    }
}

@media (max-width: 768px) {
    .custom-cards-container {
        grid-template-columns : 1fr;
    }
}

  /* Custom Card */
.custom-card {
    background-color: #ffffff;
    border-radius   : 8px;
    overflow        : hidden;
    transition      : transform 0.3s ease-in-out;
    width           : 100%;
    border          : 1px solid var(--border);
}

  /* Custom Card Thumbnail */
.custom-card-thumbnail {
    overflow : hidden;
    height   : 200px;
      /* Adjust as needed */
}

.custom-card-image {
    width  : 100%;
    height : auto;
}

  /* Custom Card Content */
.custom-card-content {
    padding : 20px;
}

  /* Custom Card Category */
.custom-card-category {
    font-size : 16px;
    color     : #555;
}

  /* Custom Card Title */
.custom-card-title {
    margin-top    : 10px;
    margin-bottom : 10px;
    font-size     : 1.4rem;
}

  /* Custom Card Meta */
.custom-card-meta {
    font-size     : 16px;
    margin-bottom : 15px;
    color         : var(--primary);
}

  /* Custom Card Excerpt */
.custom-card-excerpt {
    margin-bottom : 15px;
    font-size     : 14px;
    color         : #333;
}

.custom-card-excerpt p {
    overflow           : hidden;
    text-overflow      : ellipsis;
    display            : -webkit-box;
    -webkit-line-clamp : 3;            /* Adjust the number of lines as needed */
    -webkit-box-orient : vertical;
}
.custom-card-read-more {
    display         : flex;
    align-items     : center;
    justify-content : flex-end;
}

  /* Custom Card Read More Button */
.custom-card-read-more a {
    display          : inline-block;
    padding          : 10px 25px;
    background-color : var(--primary);
    color            : #fff;
    text-decoration  : none;
    border-radius    : 5px;
    transition       : background-color 0.3s ease-in-out;
}

.custom-card-read-more a:hover {
    background-color : var(--primary-dark);
    color            : var(--white);
}

.custom-card-read-more svg {
    margin-left : 5px;
}

  /* Remove Underline from Links */
.custom-card a {
    text-decoration : none !important;
}

  /* Hover Effect for Links */
.custom-card a:hover {
    text-decoration : underline;
}