body.sd-has-shell.sd-portfolio-3d .sd-site-footer,
body.sd-has-shell.sd-portfolio-3d .sd-cursor,
body.sd-has-shell.sd-portfolio-3d .sd-lead-modal {
  display: none !important;
}

body.sd-portfolio-3d {
  overflow-x: hidden !important;
  overflow-y: auto !important;
  height: auto !important;
}

.sd-page-content.sd-portfolio-3d {
  width: 100%;
  max-width: none;
  padding: 0;
  min-height: calc(100dvh - var(--sd-header-h));
  overflow: visible !important;
  position: relative;
}

.sd-portfolio-3d canvas {
  position: fixed !important;
  top: var(--sd-header-h) !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  height: calc(100dvh - var(--sd-header-h)) !important;
  z-index: 0 !important;
}

.sd-portfolio-3d main.sd-page-content,
.sd-portfolio-3d main.sd-portfolio-3d {
  position: relative;
  z-index: 1;
  min-height: calc(100dvh - var(--sd-header-h));
  width: 100%;
}

.sd-portfolio-3d video,
.sd-portfolio-3d .video {
  position: fixed !important;
  top: var(--sd-header-h) !important;
  left: 0 !important;
  width: 100% !important;
  height: calc(100dvh - var(--sd-header-h)) !important;
  object-fit: cover;
  z-index: 0;
}

@media (min-width: 961px) {
  .sd-portfolio-3d .sd-demo-stage {
    min-height: calc(100dvh - var(--sd-header-h));
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
  }

  .sd-portfolio-3d .sd-demo-stage > * {
    max-width: min(1400px, 96vw);
    width: 100%;
    transform: scale(1);
  }
}

@media (max-width: 960px) {
  .sd-portfolio-3d canvas {
    position: relative !important;
    top: auto !important;
    height: 70vh !important;
    min-height: 320px;
  }

  .sd-portfolio-3d video,
  .sd-portfolio-3d .video {
    position: relative !important;
    top: auto !important;
    height: 60vh !important;
    min-height: 240px;
  }
}