/* Shared responsive finishing for every invitation theme. */
html { -webkit-text-size-adjust:100%; }
body { overflow-wrap:break-word; }
body .legacy-cover-photo,body:has(.cultural-program) .legacy-cover-photo { padding:0; object-fit:cover; object-position:50% 42%; }
body .legacy-opening h1,body:has(.cultural-program) .legacy-opening h1 { max-width:780px; margin:18px auto; text-align:center; font-size:clamp(26px,4vw,44px); line-height:1.25; text-wrap:balance; }
body .hero-card,body.signature .hero-card,body #complete-profile .complete-card { text-align:center; }
body #complete-profile .complete-card { min-width:0; }
body #complete-profile .complete-card h3 { max-width:28ch; margin:0 auto 16px; text-align:center; text-wrap:balance; overflow-wrap:anywhere; }
body #complete-profile .complete-card img { display:block; width:100%!important; max-width:340px; height:auto!important; aspect-ratio:3/4; object-fit:cover!important; object-position:center 30%; margin:0 auto 22px!important; border-radius:160px 160px 8px 8px; }
body .portrait { padding:0; }
body .portrait img { display:block; width:100%; height:100%; object-fit:cover; object-position:center 30%; }
body .demo-shell .gallery { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; max-width:960px; margin:32px auto; align-items:stretch; }
body .demo-shell .gallery>div,body .demo-shell .gallery>div:nth-child(even) { margin:0; height:clamp(260px,36vw,440px); min-height:0; padding:8px; border-radius:12px; align-self:stretch; display:flex; align-items:center; justify-content:center; }
body .demo-shell .gallery img { display:block; width:100%; height:100%; max-height:100%; object-fit:contain; }
body .gallery-tiles { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); align-items:start; }
body .gallery-tiles figure { min-width:0; margin:0; }
body .gallery-tiles img { display:block; width:100%; height:clamp(220px,32vw,390px); object-fit:contain; }
body .complete-button { background:#f6ead6; color:#332718; border-color:#9d7544; cursor:pointer; border-radius:8px; line-height:1.5; min-height:44px; max-width:100%; }
body .complete-button:hover { background:#e9d5b5; color:#21170e; }
body .complete-button:focus-visible { outline:3px solid #c69042; outline-offset:4px; }
body #complete-gift .complete-card { max-width:600px; margin:18px auto; text-align:center; }
body #complete-gift .complete-card p { overflow-wrap:anywhere; }
body #complete-media { max-width:960px; }
body #complete-media iframe,body #complete-media video { display:block; width:100%; aspect-ratio:16/9; border:0; border-radius:12px; background:#151515; }
body #complete-media h3 { margin-top:32px; }
body input,body select,body textarea { min-width:0; max-width:100%; font-size:16px; }
body .complete-grid { grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr)); }
body .foot,body footer { text-align:center; padding-bottom:110px; }
@media(max-width:600px){body .demo-shell .gallery { grid-template-columns:1fr; max-width:420px; gap:16px; } body .demo-shell .gallery>div,body .demo-shell .gallery>div:nth-child(even){height:380px;height:min(110vw,440px)} body .gallery-tiles { grid-template-columns:1fr; max-width:420px; margin:auto; } body .gallery-tiles img{height:360px} body #complete-profile .complete-card img{max-width:280px} body .complete-section{padding-inline:20px} }

/* Responsive gallery
   Desktop/tablet : horizontal swipe/drag, no visible arrows.
   Phone          : natural vertical photo stack.
*/

body .mw-gallery-shell {
  width: 100%;
  max-width: 1000px;
  min-width: 0;
  margin: 32px auto;
}

/* DESKTOP + TABLET */
body .demo-shell .gallery.mw-gallery-track,
body #momentGallery.mw-gallery-track {
  position: relative;
  display: flex !important;
  gap: 0 !important;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
  border-radius: 12px;
  cursor: grab;

  /* penting: jangan paksa rasio gallery */
  aspect-ratio: auto !important;
}

body .mw-gallery-track:active {
  cursor: grabbing;
}

body .mw-gallery-track::-webkit-scrollbar {
  display: none;
}

body .demo-shell .gallery.mw-gallery-track > .mw-gallery-slide,
body #momentGallery.mw-gallery-track > .mw-gallery-slide {
  position: relative;
  flex: 0 0 100%;
  width: 100%;
  height: auto !important;
  max-height: none;
  min-height: 0;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none;
  transform: none !important;
  display: flex;
  align-items: center;
  justify-content: center;
  scroll-snap-align: start;
  scroll-snap-stop: always;
  overflow: visible;
}

body .mw-gallery-track .mw-gallery-slide img,
body #momentGallery.mw-gallery-track img {
  display: block;
  width: 100% !important;
  height: auto !important;
  max-width: 100%;
  max-height: none !important;
  object-fit: contain !important;
  object-position: center;
  border: 0;
  padding: 0;
  margin: 0 auto;
}

/* caption tetap boleh berada di bawah foto */
body .mw-gallery-track figcaption {
  position: static;
  margin: 0;
  padding: 12px 16px;
  color: inherit;
  background: transparent;
  font: 15px/1.5 'Segoe UI', sans-serif;
  text-align: center;
}

/* Counter tetap tampil, tombol panah disembunyikan */
body .mw-gallery-controls {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  margin-top: 14px;
  color: inherit;
  font: 14px/1.5 'Segoe UI', sans-serif;
}

body .mw-gallery-controls button {
  display: none !important;
}

body .mw-gallery-track:focus-visible {
  outline: 3px solid #c69042;
  outline-offset: 4px;
}


/* HP
   Tidak carousel.
   Semua foto turun ke bawah mengikuti rasio aslinya.
*/
@media (max-width: 600px) {

  body .mw-gallery-shell {
    width: 100%;
    max-width: 100%;
    margin: 24px auto;
  }

  body .demo-shell .gallery.mw-gallery-track,
  body #momentGallery.mw-gallery-track {
    display: flex !important;
    flex-direction: column;
    gap: 16px !important;
    width: 100%;
    overflow: visible !important;
    scroll-snap-type: none;
    border-radius: 0;
    aspect-ratio: auto !important;
    cursor: default;
  }

  body .demo-shell .gallery.mw-gallery-track > .mw-gallery-slide,
  body #momentGallery.mw-gallery-track > .mw-gallery-slide {
    flex: none;
    width: 100%;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible;
    scroll-snap-align: none;
    border-radius: 12px !important;
  }

  body .mw-gallery-track .mw-gallery-slide img,
  body #momentGallery.mw-gallery-track img {
    display: block;
    width: 100% !important;
    height: auto !important;
    max-width: 100%;
    max-height: none !important;
    object-fit: contain !important;
    object-position: center;
    margin: 0 auto;
    border-radius: 12px;
  }

  /* HP tidak membutuhkan counter */
  body .mw-gallery-controls {
    display: none !important;
  }
}
/* Uniform full-frame slides, with no inset mat around photos. */
body .demo-shell .gallery.mw-gallery-track>.mw-gallery-slide,body #momentGallery.mw-gallery-track>.mw-gallery-slide{padding:0!important;overflow:hidden;border-radius:12px;height:clamp(300px,65vh,620px)!important;min-height:0!important;position:relative}body .demo-shell .gallery.mw-gallery-track img,body #momentGallery.mw-gallery-track img{width:100%!important;height:100%!important;object-fit:cover!important;object-position:center!important;max-height:none!important}body #momentGallery.mw-gallery-track figcaption{position:absolute;bottom:0;left:0;right:0;padding:14px;background:linear-gradient(transparent,#0009);color:white}@media(max-width:599px){body .demo-shell .gallery.mw-gallery-track>.mw-gallery-slide,body #momentGallery.mw-gallery-track>.mw-gallery-slide{height:auto!important;aspect-ratio:3/4}}

/* Preserve the complete photograph: the frame follows its aspect ratio. */
body .demo-shell .gallery.mw-gallery-track>.mw-gallery-slide,body #momentGallery.mw-gallery-track>.mw-gallery-slide{width:100%!important;min-width:100%!important;height:auto!important;min-height:0!important;aspect-ratio:auto!important;flex:0 0 100%!important;display:block!important;background:transparent!important;border:0!important;padding:0!important}
body .demo-shell .gallery.mw-gallery-track img,body #momentGallery.mw-gallery-track img{width:100%!important;height:auto!important;aspect-ratio:auto!important;object-fit:contain!important;object-position:center!important;max-height:none!important;border-radius:12px}
body .demo-shell .gallery.mw-gallery-track,body #momentGallery.mw-gallery-track{align-items:flex-start!important;height:auto!important;aspect-ratio:auto!important;background:transparent!important}
body:has(.cultural-program) .portrait{padding:0!important;overflow:hidden;border:2px solid var(--accent)!important;box-shadow:0 0 0 3px var(--bg),0 0 0 4px var(--accent)}
body:has(.cultural-program) .portrait img{width:100%!important;height:100%!important;display:block;object-fit:cover!important;margin:0!important;border:0!important}
body .mw-gallery-track figcaption{position:static!important;background:transparent!important;color:inherit!important}
@media(max-width:599px){body .demo-shell .gallery.mw-gallery-track>.mw-gallery-slide,body #momentGallery.mw-gallery-track>.mw-gallery-slide{flex:none!important}}

/* Reserve space for lazy photos, then use their intrinsic ratio once loaded. */
body .demo-shell .gallery.mw-gallery-track img,body #momentGallery.mw-gallery-track img{aspect-ratio:auto 3/4!important}