.custom-post-container {
    margin-top:48px;
    margin-bottom:48px;
    display: grid;
    grid-template-columns: repeat(12, 1fr); /* Equivalent to grid-cols-12 */
}

/* Medium devices and up (768px) */
@media (min-width: 768px) {
    .custom-post-container {
        gap: 1rem; /* Equivalent to md:gap-6 */
    }
}

/* Large devices and up (1024px) */
@media (min-width: 1024px) {
    .custom-post-container {
        gap: 1rem; /* Equivalent to lg:gap-10 */
        max-width: none; /* Equivalent to lg:max-w-none */
    }
}

@media (max-width: 768px) {
    .custom-post-container .card {
        margin-bottom: 2rem; /* Equivalent to md:gap-6 */
    }
}