/* PWD.Design static-site overrides */

/* Elementor tags entrance-animation elements .elementor-invisible (opacity:0) and
   relies on its frontend JS to reveal them; on a static export that reveal can fail,
   leaving hero headings, text and buttons hidden. Force them visible. */
.elementor-invisible {
  opacity: 1 !important;
  visibility: visible !important;
  animation: none !important;
  transform: none !important;
}

/* Elementor Gallery builds its grid + lightbox via JS (empty 0x0 items on a static
   export). pwd-gallery.js rebuilds each container as a clean grid of .pwd-gitem
   links; style that grid: 3 columns (2 on tablet, 1 on phone). */
.pwd-gallery-grid {
  position: static !important;
  height: auto !important;
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 10px;
}
.pwd-gitem {
  position: static;
  display: block;
  overflow: hidden;
  aspect-ratio: 4 / 3;
  border-radius: 4px;
  cursor: pointer;
}
.pwd-gitem img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .3s ease;
}
.pwd-gitem:hover img { transform: scale(1.06); }
@media (max-width: 991px) { .pwd-gallery-grid { grid-template-columns: repeat(2, 1fr) !important; } }
@media (max-width: 575px) { .pwd-gallery-grid { grid-template-columns: 1fr !important; } }

/* Self-contained lightbox (Elementor's lightbox JS doesn't initialize on a static export). */
.pwd-lb {
  position: fixed; inset: 0; background: rgba(0,0,0,.92);
  display: none; align-items: center; justify-content: center; z-index: 99999;
}
.pwd-lb.open { display: flex; }
.pwd-lb-img { max-width: 92vw; max-height: 88vh; object-fit: contain; box-shadow: 0 4px 44px rgba(0,0,0,.6); }
.pwd-lb button {
  position: absolute; background: rgba(0,0,0,.45); color: #fff; border: 0; cursor: pointer;
  line-height: 1; width: 54px; height: 54px; border-radius: 50%;
  display: grid; place-items: center; font-size: 2rem; transition: background .2s;
}
.pwd-lb button:hover { background: rgba(0,0,0,.75); }
.pwd-lb-x    { top: 18px; right: 18px; }
.pwd-lb-prev { left: 18px;  top: 50%; transform: translateY(-50%); }
.pwd-lb-next { right: 18px; top: 50%; transform: translateY(-50%); }
@media (max-width: 575px) { .pwd-lb button { width: 44px; height: 44px; font-size: 1.6rem; } }