:root{--page-title-display:none;}/* Start custom CSS for html, class: .elementor-element-8f54935 */.mg-gallery {
  max-width: var(--mg-container-max, 1200px);
  margin: 0 auto;
  padding: var(--mg-space-xl, 3rem) var(--mg-container-pad, 1rem);
  font-family: var(--mg-font-secondary, "Poppins", sans-serif);
}

.mg-gallery__header {
  text-align: center;
  max-width: 760px;
  margin: 0 auto var(--mg-space-xl, 3rem);
}

.mg-gallery__badge {
  display: inline-block;
  background: var(--mg-color-primary, #E52C1F);
  color: var(--mg-color-white, #fff);
  font-family: var(--mg-font-primary, "Poppins", sans-serif);
  font-weight: var(--mg-font-weight-bold, 700);
  font-size: var(--mg-font-size-sm, 0.875rem);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 0.4em 1em;
  border-radius: var(--mg-radius-pill, 999px);
  margin-bottom: var(--mg-space-md, 1rem);
}

.mg-gallery__title {
  font-family: var(--mg-font-primary, "Poppins", sans-serif);
  font-weight: var(--mg-font-weight-bold, 700);
  color: var(--mg-color-heading, #0C0039);
  font-size: var(--mg-font-size-3xl, 2rem);
  line-height: var(--mg-line-height-tight, 1.2);
  margin: 0 0 var(--mg-space-md, 1rem);
}

.mg-gallery__intro {
  color: var(--mg-color-body-text, #333);
  font-size: var(--mg-font-size-lg, 1.125rem);
  line-height: var(--mg-line-height-loose, 1.7);
  margin: 0;
}

/* Uniform 16:9 grid */
.mg-gallery__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--mg-space-md, 1rem);
}

.mg-gallery__item {
  position: relative;
  margin: 0;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border-radius: var(--mg-radius-md, 8px);
  cursor: pointer;
  box-shadow: var(--mg-shadow-sm, 0 2px 6px rgba(0,0,0,0.12));
  transition: transform var(--mg-transition-base, 0.25s) ease,
              box-shadow var(--mg-transition-base, 0.25s) ease;
}

.mg-gallery__item:hover {
  transform: translateY(-4px);
  box-shadow: var(--mg-shadow-hover, 0 8px 20px rgba(0,0,0,0.2));
}

.mg-gallery__item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Lightbox */
.mg-gallery__lightbox {
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: rgba(12, 0, 57, 0.92);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--mg-space-lg, 2rem);
}

.mg-gallery__lightbox[hidden] { display: none; }

.mg-gallery__lightbox-img {
  max-width: 90vw;
  max-height: 85vh;
  object-fit: contain;
  border-radius: var(--mg-radius-md, 8px);
  box-shadow: 0 10px 40px rgba(0,0,0,0.5);
}

.mg-gallery__close,
.mg-gallery__nav {
  position: absolute;
  background: rgba(255,255,255,0.12);
  color: var(--mg-color-white, #fff);
  border: none;
  cursor: pointer;
  font-family: var(--mg-font-primary, "Poppins", sans-serif);
  line-height: 1;
  transition: background var(--mg-transition-fast, 0.15s) ease;
}

.mg-gallery__close:hover,
.mg-gallery__nav:hover {
  background: var(--mg-color-primary, #E52C1F);
}

.mg-gallery__close {
  top: var(--mg-space-lg, 2rem);
  right: var(--mg-space-lg, 2rem);
  width: 44px;
  height: 44px;
  font-size: 1.8rem;
  border-radius: 50%;
}

.mg-gallery__nav {
  top: 50%;
  transform: translateY(-50%);
  width: 52px;
  height: 52px;
  font-size: 2rem;
  border-radius: 50%;
}

.mg-gallery__nav--prev { left: var(--mg-space-lg, 2rem); }
.mg-gallery__nav--next { right: var(--mg-space-lg, 2rem); }

.mg-gallery__counter {
  position: absolute;
  bottom: var(--mg-space-lg, 2rem);
  left: 50%;
  transform: translateX(-50%);
  color: var(--mg-color-white, #fff);
  font-family: var(--mg-font-primary, "Poppins", sans-serif);
  font-size: var(--mg-font-size-base, 1rem);
}

/* Tablet */
@media (max-width: 900px) {
  .mg-gallery__grid { grid-template-columns: repeat(2, 1fr); }
}

/* Mobile */
@media (max-width: 560px) {
  .mg-gallery__grid { grid-template-columns: 1fr; gap: var(--mg-space-sm, 0.75rem); }
  .mg-gallery__nav { width: 40px; height: 40px; font-size: 1.5rem; }
  .mg-gallery__nav--prev { left: 0.5rem; }
  .mg-gallery__nav--next { right: 0.5rem; }
}/* End custom CSS */