.photo-widget-wrap {content-visibility: auto;}
.pg-subtitle{
    text-align:center;
    color:#7c4199;
    opacity:.8;
    margin-top:-8px;
    margin-bottom:36px;
    font-size:15px;
}

/* ---- Category cards ---- */
.pg-cards{
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    gap:24px;
}
@media (max-width: 991px){ .pg-cards{ grid-template-columns:repeat(2, 1fr); } }
@media (max-width: 560px){ .pg-cards{ grid-template-columns:1fr; } }

.pg-card{
    display:flex;
    flex-direction:column;
    text-align:left;
    background:#ffffff;
    border:1px solid #fbebf5;
    border-radius:18px;
    padding:0;
    overflow:hidden;
    cursor:pointer;
    box-shadow:0 6px 20px -12px rgba(124,65,153,.3);
    transition:transform .3s ease, box-shadow .3s ease;
}
.pg-card:hover{
    transform:translateY(-6px);
    box-shadow:0 20px 34px -16px rgba(205,3,128,.35);
}
.pg-card-thumb{
    display:block;
    width:100%;
    aspect-ratio:4/3;
    overflow:hidden;
    background:#fbebf5;
}
.pg-card-thumb img{
    width:100%; height:100%;
    object-fit:cover;
    display:block;
    transition:transform .5s ease;
}
.pg-card:hover .pg-card-thumb img{ transform:scale(1.08); }

.pg-card-body{
    display:flex;
    flex-direction:column;
    gap:8px;
    padding:20px;
}
.pg-card-title{
    font-size:18px;
    font-weight:700;
    color:#7c4199;
    line-height:1.3;
}
.pg-card-desc{
    font-size:13.5px;
    color:#7c4199;
    opacity:.75;
    line-height:1.5;
}
.pg-card-link{
    margin-top:6px;
    font-size:14px;
    font-weight:700;
    color:#cd0380;
    display:inline-flex;
    align-items:center;
    gap:8px;
}
.pg-card-link i{ font-size:12px; transition:transform .25s ease; }
.pg-card:hover .pg-card-link i{ transform:translateX(4px); }

/* ---- Lightbox ---- */
.pg-lightbox{
    position:fixed; inset:0;
    z-index:9999;
    background:rgb(174 149 184 / 97%);
    display:flex;
    flex-direction:column;
    opacity:0;
    visibility:hidden;
    transition:opacity .3s ease;
}
.pg-lightbox.is-open{
    opacity:1;
    visibility:visible;
}
.pg-lb-top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:16px 20px;
    color:#ffffff;
    flex-shrink:0;
}
.pg-lb-caption{
    font-size:15px;
    font-weight:600;
    letter-spacing:.02em;
}
.pg-lb-actions{
    display:flex; align-items:center; gap:18px;
}
.pg-lb-count{
    font-size:13px;
    color:#fbebf5;
    background:rgba(255,255,255,.12);
    padding:5px 12px;
    border-radius:999px;
}

.pg-lb-stage{
    flex:1;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:0 70px;
    min-height:0;
}
.pg-lb-img{
    max-width:100%;
    max-height:100%;
    border-radius:10px;
    box-shadow:0 20px 50px -12px rgba(0,0,0,.4);
    background:#ffffff;
}

.pg-lb-nav{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    background:#ffffff;
    color:#7c4199;
    border:none;
    width:46px; height:46px;
    border-radius:50%;
    font-size:18px;
    cursor:pointer;
    z-index:2;
    transition:background .2s ease, color .2s ease;
}
.pg-lb-nav:hover{ background:#cd0380; color:#ffffff; }
.pg-lb-prev{ left:16px; }
.pg-lb-next{ right:16px; }

.pg-lb-strip{
    flex-shrink:0;
    display:flex;
    gap:10px;
    padding:14px 20px 20px;
    overflow-x:auto;
    scroll-behavior:smooth;
}
.pg-lb-strip::-webkit-scrollbar{ height:6px; }
.pg-lb-strip::-webkit-scrollbar-thumb{ background:#cd0380; border-radius:6px; }
.pg-lb-strip::-webkit-scrollbar-track{ background:rgba(255,255,255,.15); }

.pg-lb-thumb{
    flex:0 0 auto;
    width:64px; height:64px;
    border-radius:8px;
    overflow:hidden;
    border:2px solid transparent;
    cursor:pointer;
    opacity:.55;
    transition:opacity .2s ease, border-color .2s ease, transform .2s ease;
}
.pg-lb-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.pg-lb-thumb:hover{ opacity:.85; }
.pg-lb-thumb.is-active{
    opacity:1;
    border-color:#ffffff;
    transform:translateY(-3px);
}

@media (max-width: 640px){
    .pg-lb-stage{ padding:0 46px; }
    .pg-lb-nav{ width:38px; height:38px; font-size:12px; margin: -12px;}
    .pg-lb-caption{ font-size:13px; }
    .pg-lb-thumb{ width:50px; height:50px; }
}
