/* Title: RES DESKTOP (Motion 09 Custom Fixes) */
html, body {
  overflow-x: hidden !important;
  scroll-behavior: auto !important;
}

/* DESKTOP (screens > 900px) */
@media (min-width: 901px) {
  .elementor-element-bf15877 {
    display: flex !important;
    flex-direction: row !important;
    justify-content: flex-end !important;
    width: 100% !important;
    min-height: 100vh !important;
    margin: 0 !important;
    padding: 0 !important;
    position: relative !important;
  }

  #desk_cov {
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-end !important;
    align-items: flex-end !important;
    flex: 1 1 0% !important;
    width: calc(100% - 500px) !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 100vh !important;
    position: sticky !important;
    top: 0 !important;
    left: 0 !important;
    padding: 40px 50px 50px 40px !important;
    background-image: url("../images/VINTAGE09-LAND-UPSCALE-PII.jpg") !important;
    background-position: center center !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    z-index: 2 !important;
    box-sizing: border-box !important;
  }

  /* Desktop Left Typography: Matches Gambar 2 */
  #desk_cov .elementor-element-7a0177 {
    width: 100% !important;
    max-width: 480px !important;
    text-align: right !important;
    margin: 0 0 5px 0 !important;
  }

  #desk_cov .elementor-element-7a0177 .elementor-heading-title {
    font-family: "Libre Caslon Text", serif !important;
    font-size: 15px !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    color: #557797 !important;
    text-align: right !important;
    display: block !important;
  }

  #desk_cov .elementor-element-7d2dbed4 {
    width: 100% !important;
    max-width: 480px !important;
    text-align: right !important;
    margin: 5px 0 15px 0 !important;
  }

  #desk_cov .elementor-element-7d2dbed4 .elementor-heading-title {
    font-family: "aston-script", cursive, Sans-serif !important;
    font-size: 42px !important;
    line-height: 1.1 !important;
    color: #DAAC76 !important;
    text-align: right !important;
    text-shadow: 2px 1px 0px rgba(255, 255, 255, 0.7) !important;
    display: block !important;
  }

  #desk_cov .elementor-element-70c6a235 {
    width: 100% !important;
    max-width: 480px !important;
    text-align: right !important;
    margin: 0 !important;
  }

  #desk_cov .elementor-element-70c6a235 > .elementor-widget-container {
    padding: 0 !important;
    margin: 0 !important;
    text-align: right !important;
  }

  #desk_cov .elementor-element-70c6a235 {
    font-family: "Libre Caslon Text", serif !important;
    font-size: 13.5px !important;
    line-height: 1.65 !important;
    color: #557797 !important;
    text-align: right !important;
  }

  #desk_cov .elementor-element-1358e5cd {
    --spacer-size: 20px !important;
  }

  #desk_cov .idb-reveal,
  #desk_cov .idb-ef {
    opacity: 1 !important;
    transform: none !important;
    visibility: visible !important;
  }

  .elementor-element-1d1c7e9e {
    width: 500px !important;
    min-width: 500px !important;
    max-width: 500px !important;
    flex: 0 0 500px !important;
    margin: 0 !important;
    background: #ffffff !important;
    position: relative !important;
    z-index: 5 !important;
    box-shadow: -5px 0 25px rgba(0, 0, 0, 0.1) !important;
  }

  #sec {
    position: fixed !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100vh !important;
    display: flex !important;
    flex-direction: row !important;
    justify-content: flex-end !important;
    align-items: stretch !important;
    pointer-events: none !important;
    z-index: 99999 !important;
  }

  #kolom {
    width: 500px !important;
    min-width: 500px !important;
    max-width: 500px !important;
    flex: 0 0 500px !important;
    height: 100vh !important;
    margin-left: auto !important;
    margin-right: 0 !important;
    position: relative !important;
    pointer-events: auto !important;
    box-shadow: -8px 0 30px rgba(0, 0, 0, 0.25) !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-end !important;
    align-items: center !important;
    padding-bottom: 50px !important;
    box-sizing: border-box !important;
  }

  #kolom .elementor-element-1a3fe2fb {
    display: none !important;
  }
}

/* MOBILE & TABLET (screens <= 900px) */
@media (max-width: 900px) {
  #desk_cov,
  .elementor-element-90bcff1,
  .elementor-hidden-tablet,
  .elementor-hidden-mobile {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
  }

  .elementor-element-bf15877 {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    padding: 0 !important;
  }

  .elementor-element-1d1c7e9e {
    display: block !important;
    width: 100% !important;
    max-width: 500px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    box-shadow: none !important;
  }

  #sec {
    position: fixed !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    z-index: 99999 !important;
    pointer-events: none !important;
  }

  #kolom {
    width: 100% !important;
    max-width: 500px !important;
    height: 100% !important;
    min-height: 100vh !important;
    margin: 0 auto !important;
    pointer-events: auto !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-end !important;
    align-items: center !important;
  }

  .elementor-element-1a3fe2fb {
    --spacer-size: 35px !important;
  }
}

@media (min-width: 990px) {
  ::-webkit-scrollbar { width: 10px; }
  ::-webkit-scrollbar-track { background-color: #fff0; }
  ::-webkit-scrollbar-thumb { background-color: #d6dee1; border-radius: 20px; border: 2px solid #fff0; background-clip: content-box; }
  ::-webkit-scrollbar-thumb:hover { background-color: #a8bbbf; }
}

#open { cursor: pointer; }

/* Hide redundant empty 3rd event card */
.elementor-element-19cae8be {
  display: none !important;
}

/* Gallery 2-Column Responsive Grid with Rounded Corners */
.tegar-gallery-grid,
.elementor-gallery__container {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 12px !important;
  width: 100% !important;
  padding: 0 4px !important;
  box-sizing: border-box !important;
}

.tegar-gallery-item,
.e-gallery-item {
  display: block !important;
  position: relative !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  width: 100% !important;
  height: 220px !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08) !important;
  text-decoration: none !important;
}

.tegar-gallery-item img,
.e-gallery-item img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  border-radius: 14px !important;
  transition: transform 0.4s ease !important;
}

.tegar-gallery-item:hover img,
.e-gallery-item:hover img {
  transform: scale(1.05) !important;
}

/* Groom & Bride Profile Portrait Styling */
.profil1 {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: 100% !important;
  margin: 15px auto !important;
  text-align: center !important;
}

.profil1 .elementor-widget-container {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: 100% !important;
  text-align: center !important;
}

.profil1 img,
.tegar-profile-img {
  width: 190px !important;
  height: 280px !important;
  max-width: 190px !important;
  max-height: 280px !important;
  object-fit: cover !important;
  object-position: center top !important;
  border-radius: 120px !important;
  box-shadow: 0 10px 25px rgba(69, 100, 130, 0.22) !important;
  border: 4px solid #ffffff !important;
  display: block !important;
  margin: 0 auto !important;
}

/* Invitation Video Player - Auto Adapt to Portrait or Landscape */
.elementor-element-79fbc88e,
.elementor-widget-bisdev_invite_video,
.elementor-widget-bisdev_invite_video > .elementor-widget-container {
  display: block !important;
  width: 100% !important;
  text-align: center !important;
  margin: 15px auto 25px auto !important;
  box-sizing: border-box !important;
  opacity: 1 !important;
  visibility: visible !important;
}

.bisdev-invite-video {
  display: block !important;
  width: 100% !important;
  margin: 0 auto !important;
  border-radius: 18px !important;
  box-shadow: 0 12px 30px rgba(69, 100, 130, 0.22) !important;
  border: 3px solid #ffffff !important;
  overflow: hidden !important;
  background: #000000 !important;
  position: relative !important;
  box-sizing: border-box !important;
  transition: max-width 0.3s ease;
}

/* Portrait Video (Vertical 9:16 / Reels / TikTok) */
.bisdev-invite-video.is-portrait {
  max-width: 340px !important;
}

/* Landscape Video (Horizontal 16:9 / Cinematic Film) */
.bisdev-invite-video.is-landscape {
  max-width: 100% !important;
}

.bisdev-invite-video .bisdev-invite-video__inner {
  position: relative !important;
  width: 100% !important;
  height: 0 !important;
  display: block !important;
  border-radius: 15px !important;
  overflow: hidden !important;
  background: #000000 !important;
  transition: padding-bottom 0.3s ease;
}

.bisdev-invite-video .bisdev-invite-video__native {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  border-radius: 15px !important;
  background: #000000 !important;
  pointer-events: none !important;
  user-select: none !important;
}

/* Hide any native browser controls completely */
.bisdev-invite-video video::-webkit-media-controls,
.bisdev-invite-video video::-webkit-media-controls-enclosure,
.bisdev-invite-video video::-webkit-media-controls-panel {
  display: none !important;
  -webkit-appearance: none !important;
}