.material-symbols-outlined {
    font-variation-settings:
        "FILL" 0,
        "wght" 400,
        "GRAD" 0,
        "opsz" 24;
}

.masonry-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    grid-auto-rows: 200px;
    gap: 24px;
}

.masonry-item-tall {
    grid-row: span 2;
}

.masonry-item-wide {
    grid-column: span 2;
}

@media (max-width: 767px) {
    .masonry-grid {
        display: flex;
        flex-direction: column;
        gap: 8px;
    }

    .masonry-item-tall,
    .masonry-item-wide {
        grid-row: unset;
        grid-column: unset;
    }

    .masonry-item-tall {
        aspect-ratio: 4/5;
        height: auto;
    }

    .masonry-item-wide {
        aspect-ratio: 16/9;
        height: auto;
    }

    .masonry-grid > div {
        height: auto;
    }
}

body {
    min-height: max(884px, 100dvh);
}

#lang-toggle-btn {
    transition:
        transform 0.15s ease,
        opacity 0.15s ease;
}
