* { box-sizing: border-box; margin: 0; padding: 0; }

        body {
            display: flex;
            justify-content: center;
            align-items: center;
            min-height: 100vh;
            background: radial-gradient(circle, #2c3e50, #000);
            font-family: 'Segoe UI', sans-serif;
            overflow: hidden;
        }

        .gallery-container {
            display: flex;
            gap: 10px;
            width: 95%;
            max-width: 1100px;
            height: 400px;
            perspective: 1000px;
        }

        .gallery-item {
            position: relative;
            flex: 1;
            border-radius: 12px;
            overflow: hidden;
            transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
            cursor: pointer;
            filter: grayscale(80%);
        }

        .gallery-item img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: transform 0.1s ease-out;
            pointer-events: none;
        }

        .gallery-item.active {
            flex: 4;
            filter: grayscale(0%);
            box-shadow: 0 20px 50px rgba(0,0,0,0.5);
        }

        .gallery-item .label {
            position: absolute;
            bottom: 20px;
            left: 20px;
            color: white;
            background: rgba(0,0,0,0.6);
            padding: 5px 15px;
            border-radius: 20px;
            opacity: 0;
            transform: translateX(-20px);
            transition: 0.3s;
            white-space: nowrap;
        }

        .gallery-item.active .label {
            opacity: 1;
            transform: translateX(0);
        }