/* ============================================
   Layout & Grid Systems
   ============================================ */

main {
    max-width: 1200px;
    margin: 0 auto;
}

/* Letter Grid */
.letter-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: var(--spacing-md);
    margin-bottom: var(--spacing-xl);
}

@media (min-width: 768px) {
    .letter-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}