/* Final polish: dynamic modal video sizing, portfolio crops, copyright */

.portfolio-modal-shell {
  grid-template-rows: auto auto !important;
  align-content: center !important;
  gap: 14px !important;
  max-height: calc(100svh - 28px) !important;
}

.portfolio-modal-stage {
  width: min(1180px, 100%) !important;
  min-height: auto !important;
  height: auto !important;
  aspect-ratio: var(--portfolio-video-ratio, 16 / 9) !important;
  max-height: calc(100svh - 142px) !important;
  display: grid !important;
  place-items: center !important;
  background: #000 !important;
}

.portfolio-modal-stage.is-video-cinematic,
.portfolio-modal-stage.is-video-landscape {
  width: min(1180px, 100%) !important;
}

.portfolio-modal-stage.is-video-portrait {
  width: min(520px, 100%) !important;
  justify-self: center !important;
}

.portfolio-modal-stage.is-video-square {
  width: min(760px, 100%) !important;
  justify-self: center !important;
}

.portfolio-modal-video {
  width: 100% !important;
  height: 100% !important;
  max-height: none !important;
  display: block !important;
  object-fit: contain !important;
  background: #000 !important;
}

.portfolio-modal-head {
  width: min(1180px, 100%) !important;
  justify-self: center !important;
}

.portfolio-category-card[data-gallery="christening"] video {
  object-fit: cover !important;
  object-position: center center !important;
}

.portfolio-category-card[data-gallery="gender-party"] video {
  object-fit: contain !important;
  object-position: center center !important;
  background: #05060a !important;
  transform: none !important;
}

.portfolio-category-card[data-gallery="gender-party"]:hover video {
  transform: none !important;
}

.site-copyright-footer {
  padding: 30px 20px 36px;
  text-align: center;
  color: rgba(255, 247, 236, 0.48);
  font-size: 13px;
  letter-spacing: 0.02em;
  background:
    radial-gradient(circle at 50% 0%, rgba(217, 168, 95, 0.06), transparent 32%),
    #07080c;
}

@media (max-width: 720px) {
  .portfolio-modal-shell {
    width: calc(100% - 18px) !important;
    max-height: calc(100svh - 18px) !important;
    gap: 10px !important;
  }

  .portfolio-modal-stage {
    width: 100% !important;
    max-height: calc(100svh - 126px) !important;
    border-radius: 20px !important;
  }

  .portfolio-modal-stage.is-video-portrait {
    width: min(390px, 100%) !important;
  }

  .portfolio-modal-head {
    width: 100% !important;
  }

  .site-copyright-footer {
    padding: 24px 16px 30px;
    font-size: 12px;
  }
}