/* ============================================================
   BAGUS & SABRINA WEDDING - Custom Overrides
   ============================================================ */

/* ---- Elementor Section Visibility Fix ----
   .hidden sections = display:none by Elementor.
   Our JS animation bridge removes .hidden at runtime,
   but we still need display:block as a CSS fallback
   in case JS hasn't run yet or for noscript browsers.
   NOTE: We do NOT override opacity here — the JS
   IntersectionObserver handles the fade-in animation.
   -------------------------------------------------------- */

/* Sections need to be in layout flow (not display:none) */
.elementor-section.hidden,
.elementor-widget.hidden,
.elementor-column.hidden {
    display: block !important;
}

/* Columns/containers use flexbox */
.elementor-widget-wrap.hidden,
.elementor-container.hidden {
    display: flex !important;
}

/* elementor-invisible = visibility:hidden, we let JS handle it
   but add visibility:visible so layout is not collapsed */
.elementor-invisible {
    visibility: visible !important;
}

/* ---- Lazy Load Fix ----
   Images with data-src won't load without Elementor's lazy loader JS.
   The inline polyfill script handles src swap, this handles opacity. */
img[src*="data:image"] {
    opacity: 0;
}

img:not([src*="data:image"]) {
    opacity: 1 !important;
}

/* ============================================================
   WAYANG KIRI MIRROR FIX
   wayang-kiri.png is a copy of wayang-kanan.png, so we mirror
   it horizontally via CSS to make them face each other.
   ============================================================ */
img.wp-image-1254 {
    /* transform: scaleX(-1) !important;
    -webkit-transform: scaleX(-1) !important; */
}

/* ============================================================
   BACKGROUND IMAGE FIX — FULL COVER
   The section column backgrounds (elementor-motion-effects-layer)
   have background-image set in 41_post-1249.css but NO
   background-size. Default = auto (natural size, repeating tile).
   This forces them to cover the full section properly.
   ============================================================ */

/* Target: the actual layer elements that hold background-image in CSS */
.elementor-motion-effects-layer,
.elementor-column>.elementor-element-populated {
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
}

/* Also ensure the column itself (when it holds the bg) covers full height */
.elementor-1249 .elementor-column {
    min-height: 100%;
}

/* ============================================================
   WAYANG.PNG — PULSING DECORATIVE BACKGROUND WATERMARK
   A centered, semi-transparent wayang gunungan silhouette 
   floats behind content on every section, pulsing gently.
   Uses ::before on the main Elementor page wrapper.
   ============================================================ */

@keyframes wayangPulse {
    0% {
        opacity: 0.04;
        transform: scale(1);
    }

    50% {
        opacity: 0.10;
        transform: scale(1.04);
    }

    100% {
        opacity: 0.04;
        transform: scale(1);
    }
}

/* The wayang watermark sits behind all content on the page */
.elementor-1249 {
    position: relative;
}

.elementor-1249::before {
    content: '';
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(1);
    width: 70vw;
    max-width: 500px;
    height: 70vw;
    max-height: 500px;
    background-image: url('./assets/images/wayang.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
    opacity: 0.06;
    pointer-events: none;
    z-index: 0;
    animation: wayangPulse 4s ease-in-out infinite;
    /* mix-blend-mode makes black silhouette blend nicely on warm bg */
    mix-blend-mode: multiply;
}

/* Make sure all section content stays above the watermark */
.elementor-section,
.elementor-container,
.elementor-column,
.elementor-widget {
    position: relative;
    z-index: 1;
}

/* ============================================================
   SLIDER
   ============================================================ */
@media (max-width: 767px) {
    .gambardepanbaru img {
        width: 80%;
    }
}

@media (max-width: 767px) {
    .attachment-full.size-full.wp-image-1255 img {
        width: 10%;
    }
}

.your-slider {
    width: 100%;
    overflow: hidden;
}

.your-slider img {
    width: 100%;
    height: auto;
    display: block;
}

.slick-prev,
.slick-next {
    display: none !important;
}