.ug-wrap{--ug-accent:#2f6b3f;--ug-accent-soft:#e7f1e9;--ug-text:#1f2a24;--ug-gap:14px;
  width:100%;max-width:1280px;margin:0 auto;padding:0 12px;font-family:inherit;color:var(--ug-text);box-sizing:border-box}
.ug-wrap *{box-sizing:border-box}

/* ---------- Tabs ---------- */
.ug-tabs{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-bottom:28px}
.ug-tab{appearance:none;-webkit-appearance:none;border:1.5px solid var(--ug-accent);background:#fff;color:var(--ug-accent);
  padding:10px 20px;border-radius:999px;font-size:15px;font-weight:600;cursor:pointer;
  transition:background .2s,color .2s;line-height:1.2;font-family:inherit}
.ug-tab:hover{background:var(--ug-accent-soft)}
.ug-tab.active{background:var(--ug-accent);color:#fff}

/* ---------- Panels ---------- */
.ug-panel{display:none}
.ug-panel.active{display:block;animation:ugFade .35s ease}
@keyframes ugFade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* ---------- Grid: 4 images ek line mein, beech mein gap, poori image (no crop) ---------- */
.ug-grid{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:16px!important;align-items:start!important;width:100%}
.ug-item{margin:0!important;padding:0!important;border-radius:10px;overflow:hidden;background:#e9ecea;line-height:0;width:100%}
.ug-item img{width:100%!important;height:auto!important;max-width:100%;display:block;margin:0!important;cursor:zoom-in;transition:transform .35s ease}
.ug-item:hover img{transform:scale(1.03)}

/* ---------- Lightbox + zoom ---------- */
.ug-lightbox{position:fixed;inset:0;background:rgba(0,0,0,.93);display:none;align-items:center;justify-content:center;z-index:2147483000}
.ug-lightbox.open{display:flex}
.ug-stage{width:100vw;height:100vh;display:flex;align-items:center;justify-content:center;overflow:hidden;padding:56px 70px}
.ug-stage img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;border-radius:6px;
  cursor:zoom-in;transition:transform .25s ease;transform-origin:center center;user-select:none;-webkit-user-drag:none}
.ug-stage.zoomed img{transform:scale(2.4);cursor:zoom-out;transition:transform .15s ease-out}
.ug-close,.ug-nav{position:absolute;background:rgba(255,255,255,.16);color:#fff;border:0;cursor:pointer;border-radius:50%;
  width:46px;height:46px;font-size:22px;line-height:1;display:flex;align-items:center;justify-content:center;z-index:2;padding:0}
.ug-close:hover,.ug-nav:hover{background:rgba(255,255,255,.32)}
.ug-close{top:16px;right:18px;font-size:32px}
.ug-prev{left:16px;top:50%;transform:translateY(-50%)}
.ug-next{right:16px;top:50%;transform:translateY(-50%)}
.ug-count{position:absolute;bottom:16px;left:0;right:0;text-align:center;color:#fff;font:600 14px/1 sans-serif;opacity:.85;z-index:2}
.ug-lightbox.zoom-on .ug-nav{opacity:.0;pointer-events:none}

/* ---------- Responsive ---------- */
@media (max-width:1024px){.ug-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}}
@media (max-width:700px){.ug-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}}
@media (max-width:560px){
  .ug-tabs{flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;padding-bottom:8px;-webkit-overflow-scrolling:touch}
  .ug-tab{white-space:nowrap;flex:0 0 auto;padding:9px 16px;font-size:14px}
  .ug-stage{padding:60px 8px}
  .ug-nav{width:40px;height:40px}
  .ug-prev{left:6px}.ug-next{right:6px}
}