Galeri Foto

---
judul: "Galeri Foto"
foto: [{judul: "Senja di Pantai", url: "https://picsum.photos/seed/senja/400/300", deskripsi: "Pemandangan matahari terbenam"}, {judul: "Gunung Berkabut", url: "https://picsum.photos/seed/gunung/400/300", deskripsi: "Kabut pagi di pegunungan"}, {judul: "Kota Malam", url: "https://picsum.photos/seed/kota/400/300", deskripsi: "Skyline kota di malam hari"}, {judul: "Hutan Tropis", url: "https://picsum.photos/seed/hutan/400/300", deskripsi: "Kehijauan hutan hujan"}]
---

Gaya:
    body
        font-family: 'Inter', system-ui, -apple-system, sans-serif
        margin: 0
        min-height: 100vh
        background: linear-gradient(135deg, #0f0c29 0%, #302b63 50%, #24243e 100%)
        color: #e0e0e0
        padding: 40px 20px
    .container
        max-width: 1000px
        margin: 0 auto
    .page-title
        font-size: 2rem
        font-weight: 800
        text-align: center
        margin-bottom: 8px
        background: linear-gradient(135deg, #7dd3fc, #d3b6e9)
        -webkit-background-clip: text
        -webkit-text-fill-color: transparent
        background-clip: text
    .page-subtitle
        text-align: center
        color: #64748b
        font-size: 0.9rem
        margin-bottom: 32px
    .galeri
        display: grid
        grid-template-columns: repeat(auto-fill, minmax(220px, 1fr))
        gap: 20px
    .kartu
        background: rgba(255,255,255,0.05)
        backdrop-filter: blur(12px)
        -webkit-backdrop-filter: blur(12px)
        border: 1px solid rgba(255,255,255,0.08)
        border-radius: 18px
        overflow: hidden
        transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease
    .kartu:hover
        transform: translateY(-4px)
        box-shadow: 0 16px 40px rgba(0,0,0,0.3)
        border-color: rgba(125,211,252,0.2)
    .kartu img
        width: 100%
        height: 180px
        object-fit: cover
        display: block
        background: rgba(255,255,255,0.03)
    .kartu-body
        padding: 16px
    .kartu-body h3
        margin: 0 0 4px
        font-size: 1rem
        font-weight: 700
        color: #e0e0e0
    .kartu-body p
        margin: 0
        font-size: 0.8rem
        color: #64748b
        line-height: 1.4

Halaman Galeri:
    Buat div.container:
        Buat h1.page-title: $judul
        Buat p.page-subtitle: "Koleksi foto dari berbagai tempat"

        Buat div.galeri:
            Ulangi untuk item dari foto:
                Buat div.kartu:
                    Buat gambar:
                        src = item.url
                        alt = item.judul
                    Buat div.kartu-body:
                        Buat h3:
                            item.judul
                        Buat p:
                            item.deskripsi