.bento-card:first-child img {
    border-radius: var(--radius-subtle);
}

@media only screen and (min-width: 64rem) {
    .bento-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        grid-template-rows: repeat(5, 275px); 
        gap: 1.5rem;
        padding: 3rem 0;
        width: 100%;
    }

    .bento-card {
        border-radius: 24px;
        padding: var(--space-3);
        height: 100%;
        box-sizing: border-box;
    }

    .card-title {
        grid-column: 3;
        grid-row: 1 / 2;
    }

    .card-meta {
        grid-column: 1;
        grid-row: 5 / 6;
        align-items: center;
        text-align: center;
    }

    .card-form {
        grid-column: 1 / 3;
        grid-row: 1 / 2;
    }

    .card-code {
        grid-column: 2;
        grid-row: 3 / 6;
    }

    .card-sidebar {
        grid-column: 3;
        grid-row: 2 / 6; 
    }

    .card-stack {
        grid-column: 2;
        grid-row: 2;
    }

    .card-stack h3, .card-title h2, .meta-code {
        font-size: var(--fs-md);
        line-height: var(--lh-md);
    }

    .card-display {
        grid-column: 1 / 2;
        grid-row: 2 / 5; 
    }

    .bento-card img {
        width: 100%;
        height: 100%;
        object-fit: cover; 
        max-height: none; 
    }

    .bento-card:first-child {
        padding: 0;
    }
}

@media only screen and (min-width: 90rem) {
    .card-stack h3, .card-title h2, .meta-code {
        font-size: var(--fs-lg);
        line-height: var(--lh-lg);
    }
}