.pgsc-wrapper{
    display:flex;
    gap:40px;
    padding:50px;
    background:#f6f2ec;
    border-radius:30px;
    align-items:center;
}

.pgsc-left{
    width:32%;
}

.pgsc-tag,
.pgsc-left h2,
.pgsc-left p,
.pgsc-overlay h3,
.pgsc-overlay p{
    font-family:'Ivy Mode', serif;
}

.pgsc-tag{
    letter-spacing:4px;
    color:#c8a76a;
    display:block;
    margin-bottom:20px;
}

.pgsc-left h2{
    font-size:64px;
    line-height:1;
    margin-bottom:20px;
}

.pgsc-left p{
    font-size:18px;
    line-height:1.8;
}

.pgsc-right{
    width:68%;
}

.pgsc-cards{
    display:flex;
    gap:20px;
}

.pgsc-card{
    width:25%;
    height:650px;
    border-radius:24px;
    overflow:hidden;
    position:relative;
    transition:0.4s ease;
    cursor:pointer;
}

.pgsc-card.active{
    width:40%;
}

.pgsc-card img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.pgsc-overlay{
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    padding:30px;
    background:linear-gradient(to top, rgba(0,0,0,.85), transparent);
}

.pgsc-overlay h3{
    color:#fff;
    font-size:30px;
    margin-bottom:10px;
}

.pgsc-overlay p{
    color:#fff;
    font-size:16px;
}

@media(max-width:768px){

    .pgsc-wrapper{
        flex-direction:column;
        padding:25px;
    }

    .pgsc-left,
    .pgsc-right{
        width:100%;
    }

    .pgsc-cards{
        flex-direction:column;
    }

    .pgsc-card,
    .pgsc-card.active{
        width:100%;
        height:420px;
    }
}