.elementor-9606 .elementor-element.elementor-element-4f55556{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-9606 .elementor-element.elementor-element-4115dea{--display:flex;--min-height:750px;--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--overlay-opacity:0.58;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;--z-index:0;}.elementor-9606 .elementor-element.elementor-element-4115dea::before, .elementor-9606 .elementor-element.elementor-element-4115dea > .elementor-background-video-container::before, .elementor-9606 .elementor-element.elementor-element-4115dea > .e-con-inner > .elementor-background-video-container::before, .elementor-9606 .elementor-element.elementor-element-4115dea > .elementor-background-slideshow::before, .elementor-9606 .elementor-element.elementor-element-4115dea > .e-con-inner > .elementor-background-slideshow::before, .elementor-9606 .elementor-element.elementor-element-4115dea > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:transparent;--background-overlay:'';background-image:linear-gradient(180deg, #00000085 0%, #000000 100%);}.elementor-9606 .elementor-element.elementor-element-8afb065 .elementor-heading-title{font-family:"Poppins", Sans-serif;font-size:110px;font-weight:600;text-transform:uppercase;color:#FFFFFF;}.elementor-9606 .elementor-element.elementor-element-d80368c{--display:flex;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-9606 .elementor-element.elementor-element-a5130e6{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:center;--padding-top:230px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;--z-index:1;}.elementor-9606 .elementor-element.elementor-element-a5130e6:not(.elementor-motion-effects-element-type-background), .elementor-9606 .elementor-element.elementor-element-a5130e6 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-9606 .elementor-element.elementor-element-94205a1 > .elementor-widget-container{padding:0px 0px 0px 0px;}.elementor-9606 .elementor-element.elementor-element-94205a1 .elementor-heading-title{font-size:70px;line-height:70px;}.elementor-9606 .elementor-element.elementor-element-6ce94d2{--display:grid;--min-height:456px;--e-con-grid-template-columns:repeat(3, 1fr);--e-con-grid-template-rows:repeat(3, 1fr);--gap:0px 0px;--row-gap:0px;--column-gap:0px;--grid-auto-flow:row;}.elementor-9606 .elementor-element.elementor-element-6071197{--display:flex;--justify-content:center;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-9606 .elementor-element.elementor-element-6071197:not(.elementor-motion-effects-element-type-background), .elementor-9606 .elementor-element.elementor-element-6071197 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://rajaloadcell.com/wp-content/uploads/2026/02/Silo-compression-12-1.jpeg");background-size:cover;}.elementor-9606 .elementor-element.elementor-element-12298d5{text-align:center;}.elementor-9606 .elementor-element.elementor-element-12298d5 .elementor-heading-title{font-size:25px;color:#FFFFFF;}.elementor-9606 .elementor-element.elementor-element-c1f395c{--display:flex;--justify-content:center;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-9606 .elementor-element.elementor-element-c1f395c:not(.elementor-motion-effects-element-type-background), .elementor-9606 .elementor-element.elementor-element-c1f395c > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://rajaloadcell.com/wp-content/uploads/2026/02/Silo-compression-14.jpeg");background-size:cover;}.elementor-9606 .elementor-element.elementor-element-85cae96{text-align:center;}.elementor-9606 .elementor-element.elementor-element-85cae96 .elementor-heading-title{font-size:25px;color:#FFFFFF;}.elementor-9606 .elementor-element.elementor-element-4f294aa{--display:flex;--justify-content:center;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-9606 .elementor-element.elementor-element-4f294aa:not(.elementor-motion-effects-element-type-background), .elementor-9606 .elementor-element.elementor-element-4f294aa > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://rajaloadcell.com/wp-content/uploads/2026/02/Silo-compression-1-1.jpeg");background-size:cover;}.elementor-9606 .elementor-element.elementor-element-8c11f49{text-align:center;}.elementor-9606 .elementor-element.elementor-element-8c11f49 .elementor-heading-title{font-size:25px;color:#FFFFFF;}.elementor-9606 .elementor-element.elementor-element-caeabe8{--display:flex;--justify-content:center;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-9606 .elementor-element.elementor-element-caeabe8:not(.elementor-motion-effects-element-type-background), .elementor-9606 .elementor-element.elementor-element-caeabe8 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://rajaloadcell.com/wp-content/uploads/2026/02/Silo-4-1.jpeg");background-size:cover;}.elementor-9606 .elementor-element.elementor-element-0e292ea{text-align:center;}.elementor-9606 .elementor-element.elementor-element-0e292ea .elementor-heading-title{font-size:25px;color:#FFFFFF;}.elementor-9606 .elementor-element.elementor-element-676a7b7{--display:flex;--justify-content:center;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-9606 .elementor-element.elementor-element-676a7b7:not(.elementor-motion-effects-element-type-background), .elementor-9606 .elementor-element.elementor-element-676a7b7 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://rajaloadcell.com/wp-content/uploads/2026/02/Silo-5-2.jpeg");background-size:cover;}.elementor-9606 .elementor-element.elementor-element-3e371ad{text-align:center;}.elementor-9606 .elementor-element.elementor-element-3e371ad .elementor-heading-title{font-size:25px;color:#FFFFFF;}.elementor-9606 .elementor-element.elementor-element-6213f99{--display:flex;--justify-content:center;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-9606 .elementor-element.elementor-element-6213f99:not(.elementor-motion-effects-element-type-background), .elementor-9606 .elementor-element.elementor-element-6213f99 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://rajaloadcell.com/wp-content/uploads/2026/02/Silo-8.jpeg");background-size:cover;}.elementor-9606 .elementor-element.elementor-element-aa89d6c{text-align:center;}.elementor-9606 .elementor-element.elementor-element-aa89d6c .elementor-heading-title{font-size:25px;color:#FFFFFF;}.elementor-9606 .elementor-element.elementor-element-4445cae{--display:flex;--justify-content:center;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-9606 .elementor-element.elementor-element-4445cae:not(.elementor-motion-effects-element-type-background), .elementor-9606 .elementor-element.elementor-element-4445cae > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://rajaloadcell.com/wp-content/uploads/2026/02/IMG_2012-2-scaled.jpg");background-size:cover;}.elementor-9606 .elementor-element.elementor-element-076f458{text-align:center;}.elementor-9606 .elementor-element.elementor-element-076f458 .elementor-heading-title{font-size:25px;color:#FFFFFF;}.elementor-9606 .elementor-element.elementor-element-33edcc7{--display:flex;--justify-content:center;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-9606 .elementor-element.elementor-element-33edcc7:not(.elementor-motion-effects-element-type-background), .elementor-9606 .elementor-element.elementor-element-33edcc7 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://rajaloadcell.com/wp-content/uploads/2026/02/IMG_2017-1-scaled.jpg");background-size:cover;}.elementor-9606 .elementor-element.elementor-element-f3827f7{text-align:center;}.elementor-9606 .elementor-element.elementor-element-f3827f7 .elementor-heading-title{font-size:25px;color:#FFFFFF;}.elementor-9606 .elementor-element.elementor-element-0a4c492{--display:flex;--justify-content:center;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-9606 .elementor-element.elementor-element-0a4c492:not(.elementor-motion-effects-element-type-background), .elementor-9606 .elementor-element.elementor-element-0a4c492 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://rajaloadcell.com/wp-content/uploads/2026/02/IMG_2016-scaled.jpg");background-size:cover;}.elementor-9606 .elementor-element.elementor-element-f33d052{text-align:center;}.elementor-9606 .elementor-element.elementor-element-f33d052 .elementor-heading-title{font-size:25px;color:#FFFFFF;}.elementor-9606 .elementor-element.elementor-element-31e4844{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--align-items:center;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-9606 .elementor-element.elementor-element-47d9502{--display:flex;--justify-content:center;--padding-top:180px;--padding-bottom:14px;--padding-left:14px;--padding-right:14px;}.elementor-9606 .elementor-element.elementor-element-d77772c .elementor-heading-title{font-size:55px;color:#000000;}.elementor-9606 .elementor-element.elementor-element-20b72bb .elementor-heading-title{font-size:20px;line-height:28px;}.elementor-9606 .elementor-element.elementor-element-6f14c15{text-align:justify;font-size:15px;line-height:25px;}.elementor-9606 .elementor-element.elementor-element-37b22c6{--display:flex;--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-9606 .elementor-element.elementor-element-4a0adf5{--display:flex;}.elementor-9606 .elementor-element.elementor-element-02cfcb5{text-align:center;}.elementor-9606 .elementor-element.elementor-element-02cfcb5 .elementor-heading-title{font-size:90px;color:#000000;}.elementor-9606 .elementor-element.elementor-element-5ed1190 .elementor-heading-title{font-size:30px;line-height:28px;color:#000000;}.elementor-9606 .elementor-element.elementor-element-179e800{--display:flex;}.elementor-9606 .elementor-element.elementor-element-8531b57{text-align:center;}.elementor-9606 .elementor-element.elementor-element-8531b57 .elementor-heading-title{font-size:90px;color:#000000;}.elementor-9606 .elementor-element.elementor-element-3b13d86 .elementor-heading-title{font-size:30px;line-height:28px;color:#000000;}.elementor-9606 .elementor-element.elementor-element-b524894{--display:flex;}.elementor-9606 .elementor-element.elementor-element-398d772{text-align:center;}.elementor-9606 .elementor-element.elementor-element-398d772 .elementor-heading-title{font-size:90px;color:#000000;}.elementor-9606 .elementor-element.elementor-element-a1c4563 .elementor-heading-title{font-size:30px;line-height:28px;color:#000000;}.elementor-9606 .elementor-element.elementor-element-26e93b1{--display:flex;}@media(max-width:1024px){.elementor-9606 .elementor-element.elementor-element-6ce94d2{--grid-auto-flow:row;}}@media(min-width:768px){.elementor-9606 .elementor-element.elementor-element-a5130e6{--content-width:1030px;}}@media(max-width:767px){.elementor-9606 .elementor-element.elementor-element-6ce94d2{--e-con-grid-template-columns:repeat(1, 1fr);--grid-auto-flow:row;}}/* Start custom CSS for heading, class: .elementor-element-8afb065 *//* ========================================
   EFEK HOVER TEKS - TANPA PARTIKEL
   ======================================== */

.text-project {
    position: relative;
    display: inline-block;
    font-size: clamp(2rem, 5vw, 4rem);
    font-weight: 900;
    color: #ffffff;
    cursor: pointer;
    letter-spacing: 0.05em;
    transition: all 0.4s ease;
}

/* Text Shadow Effect */
.text-project:hover {
    text-shadow: 
        0 0 10px rgba(255,255,255,0.5),
        0 0 20px rgba(74,222,128,0.3),
        0 0 30px rgba(239,68,68,0.2);
    transform: translateY(-2px);
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-534af35 *//* ======================================
   SCROLL DOWN – AWWWARDS STYLE (TEXT + ARROW)
====================================== */

.scroll-indicator {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;

  height: 56px;
  overflow: hidden;

  pointer-events: none;
  z-index: 10;
}

/* TEKS */
.scroll-text {
  font-size: 14px;          /* LEBIH BESAR */
  font-weight: 500;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: #ffffff;

  line-height: 1;
  margin-bottom: 10px;

  animation: scrollText 2.4s ease-in-out infinite;
}

/* PANAH */
.scroll-arrow {
  position: relative;
  width: 8px;
  height: 8px;

  border-right: 2px solid #ffffff;
  border-bottom: 2px solid #ffffff;

  transform: rotate(45deg);

  animation: scrollArrow 2.4s ease-in-out infinite;
}

/* ======================================
   ANIMATION
====================================== */

@keyframes scrollText {
  0% {
    opacity: 0;
    transform: translateY(-10px);
  }

  35% {
    opacity: 1;
    transform: translateY(0);
  }

  75% {
    opacity: 0;
    transform: translateY(10px);
  }

  100% {
    opacity: 0;
    transform: translateY(10px);
  }
}

@keyframes scrollArrow {
  0% {
    opacity: 0;
    transform: translateY(-6px) rotate(45deg);
  }

  40% {
    opacity: 1;
    transform: translateY(0) rotate(45deg);
  }

  80% {
    opacity: 0;
    transform: translateY(8px) rotate(45deg);
  }

  100% {
    opacity: 0;
    transform: translateY(8px) rotate(45deg);
  }
}/* End custom CSS */
/* Start custom CSS for heading, class: .elementor-element-12298d5 */.image-project:hover .project-text {
    opacity: 1;
    transform: translateY(0);
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-6071197 */.image-project {
    background-size: cover;
    background-position: center;
    transition: 
        transform 0.5s ease,
        box-shadow 0.5s ease,
        background-size 0.8s ease;
}

.image-project:hover {
    transform: translateY(-8px);
    box-shadow: 0 30px 80px rgba(0,0,0,0.4);
    background-size: 108%;
}
.image-project::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        to top,
        rgba(0,0,0,0.55),
        rgba(0,0,0,0.05)
    );
    opacity: 0;
    transition: opacity 0.5s ease;
    pointer-events: none;
}

.image-project:hover::after {
    opacity: 1;
}
.image-project {
    position: relative;
}

.image-project .project-text {
    position: absolute;
    bottom: 24px;
    left: 24px;
    right: 24px;
    color: #fff;
    z-index: 2;
    opacity: 0;
    transform: translateY(12px);
    transition: all 0.5s ease;
}



.image-project {
    width: 100%;
    aspect-ratio: 3 / 4; /* 300x400 */
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 0; /* wajib kalau mau benar-benar nempel */
    background-size: cover;
    background-position: center;
    position: relative;
}/* End custom CSS */
/* Start custom CSS for heading, class: .elementor-element-85cae96 */.image-project:hover .project-text {
    opacity: 1;
    transform: translateY(0);
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-c1f395c */.image-project {
    background-size: cover;
    background-position: center;
    transition: 
        transform 0.5s ease,
        box-shadow 0.5s ease,
        background-size 0.8s ease;
}

.image-project:hover {
    transform: translateY(-8px);
    box-shadow: 0 30px 80px rgba(0,0,0,0.4);
    background-size: 108%;
}
.image-project::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        to top,
        rgba(0,0,0,0.55),
        rgba(0,0,0,0.05)
    );
    opacity: 0;
    transition: opacity 0.5s ease;
    pointer-events: none;
}

.image-project:hover::after {
    opacity: 1;
}
.image-project {
    position: relative;
}

.image-project .project-text {
    position: absolute;
    bottom: 24px;
    left: 24px;
    right: 24px;
    color: #fff;
    z-index: 2;
    opacity: 0;
    transform: translateY(12px);
    transition: all 0.5s ease;
}/* End custom CSS */
/* Start custom CSS for heading, class: .elementor-element-8c11f49 */.image-project:hover .project-text {
    opacity: 1;
    transform: translateY(0);
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-4f294aa */.image-project {
    background-size: cover;
    background-position: center;
    transition: 
        transform 0.5s ease,
        box-shadow 0.5s ease,
        background-size 0.8s ease;
}

.image-project:hover {
    transform: translateY(-8px);
    box-shadow: 0 30px 80px rgba(0,0,0,0.4);
    background-size: 108%;
}
.image-project::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        to top,
        rgba(0,0,0,0.55),
        rgba(0,0,0,0.05)
    );
    opacity: 0;
    transition: opacity 0.5s ease;
    pointer-events: none;
}

.image-project:hover::after {
    opacity: 1;
}
.image-project {
    position: relative;
}

.image-project .project-text {
    position: absolute;
    bottom: 24px;
    left: 24px;
    right: 24px;
    color: #fff;
    z-index: 2;
    opacity: 0;
    transform: translateY(12px);
    transition: all 0.5s ease;
}/* End custom CSS */
/* Start custom CSS for heading, class: .elementor-element-0e292ea */.image-project:hover .project-text {
    opacity: 1;
    transform: translateY(0);
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-caeabe8 */.image-project {
    background-size: cover;
    background-position: center;
    transition: 
        transform 0.5s ease,
        box-shadow 0.5s ease,
        background-size 0.8s ease;
}

.image-project:hover {
    transform: translateY(-8px);
    box-shadow: 0 30px 80px rgba(0,0,0,0.4);
    background-size: 108%;
}
.image-project::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        to top,
        rgba(0,0,0,0.55),
        rgba(0,0,0,0.05)
    );
    opacity: 0;
    transition: opacity 0.5s ease;
    pointer-events: none;
}

.image-project:hover::after {
    opacity: 1;
}
.image-project {
    position: relative;
}

.image-project .project-text {
    position: absolute;
    bottom: 24px;
    left: 24px;
    right: 24px;
    color: #fff;
    z-index: 2;
    opacity: 0;
    transform: translateY(12px);
    transition: all 0.5s ease;
}/* End custom CSS */
/* Start custom CSS for heading, class: .elementor-element-3e371ad */.image-project:hover .project-text {
    opacity: 1;
    transform: translateY(0);
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-676a7b7 */.image-project {
    background-size: cover;
    background-position: center;
    transition: 
        transform 0.5s ease,
        box-shadow 0.5s ease,
        background-size 0.8s ease;
}

.image-project:hover {
    transform: translateY(-8px);
    box-shadow: 0 30px 80px rgba(0,0,0,0.4);
    background-size: 108%;
}
.image-project::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        to top,
        rgba(0,0,0,0.55),
        rgba(0,0,0,0.05)
    );
    opacity: 0;
    transition: opacity 0.5s ease;
    pointer-events: none;
}

.image-project:hover::after {
    opacity: 1;
}
.image-project {
    position: relative;
}

.image-project .project-text {
    position: absolute;
    bottom: 24px;
    left: 24px;
    right: 24px;
    color: #fff;
    z-index: 2;
    opacity: 0;
    transform: translateY(12px);
    transition: all 0.5s ease;
}/* End custom CSS */
/* Start custom CSS for heading, class: .elementor-element-aa89d6c */.image-project:hover .project-text {
    opacity: 1;
    transform: translateY(0);
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-6213f99 */.image-project {
    background-size: cover;
    background-position: center;
    transition: 
        transform 0.5s ease,
        box-shadow 0.5s ease,
        background-size 0.8s ease;
}

.image-project:hover {
    transform: translateY(-8px);
    box-shadow: 0 30px 80px rgba(0,0,0,0.4);
    background-size: 108%;
}
.image-project::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        to top,
        rgba(0,0,0,0.55),
        rgba(0,0,0,0.05)
    );
    opacity: 0;
    transition: opacity 0.5s ease;
    pointer-events: none;
}

.image-project:hover::after {
    opacity: 1;
}
.image-project {
    position: relative;
}

.image-project .project-text {
    position: absolute;
    bottom: 24px;
    left: 24px;
    right: 24px;
    color: #fff;
    z-index: 2;
    opacity: 0;
    transform: translateY(12px);
    transition: all 0.5s ease;
}/* End custom CSS */
/* Start custom CSS for heading, class: .elementor-element-076f458 */.image-project:hover .project-text {
    opacity: 1;
    transform: translateY(0);
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-4445cae */.image-project {
    background-size: cover;
    background-position: center;
    transition: 
        transform 0.5s ease,
        box-shadow 0.5s ease,
        background-size 0.8s ease;
}

.image-project:hover {
    transform: translateY(-8px);
    box-shadow: 0 30px 80px rgba(0,0,0,0.4);
    background-size: 108%;
}
.image-project::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        to top,
        rgba(0,0,0,0.55),
        rgba(0,0,0,0.05)
    );
    opacity: 0;
    transition: opacity 0.5s ease;
    pointer-events: none;
}

.image-project:hover::after {
    opacity: 1;
}
.image-project {
    position: relative;
}

.image-project .project-text {
    position: absolute;
    bottom: 24px;
    left: 24px;
    right: 24px;
    color: #fff;
    z-index: 2;
    opacity: 0;
    transform: translateY(12px);
    transition: all 0.5s ease;
}/* End custom CSS */
/* Start custom CSS for heading, class: .elementor-element-f3827f7 */.image-project:hover .project-text {
    opacity: 1;
    transform: translateY(0);
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-33edcc7 */.image-project {
    background-size: cover;
    background-position: center;
    transition: 
        transform 0.5s ease,
        box-shadow 0.5s ease,
        background-size 0.8s ease;
}

.image-project:hover {
    transform: translateY(-8px);
    box-shadow: 0 30px 80px rgba(0,0,0,0.4);
    background-size: 108%;
}
.image-project::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        to top,
        rgba(0,0,0,0.55),
        rgba(0,0,0,0.05)
    );
    opacity: 0;
    transition: opacity 0.5s ease;
    pointer-events: none;
}

.image-project:hover::after {
    opacity: 1;
}
.image-project {
    position: relative;
}

.image-project .project-text {
    position: absolute;
    bottom: 24px;
    left: 24px;
    right: 24px;
    color: #fff;
    z-index: 2;
    opacity: 0;
    transform: translateY(12px);
    transition: all 0.5s ease;
}/* End custom CSS */
/* Start custom CSS for heading, class: .elementor-element-f33d052 */.image-project:hover .project-text {
    opacity: 1;
    transform: translateY(0);
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-0a4c492 */.image-project {
    background-size: cover;
    background-position: center;
    transition: 
        transform 0.5s ease,
        box-shadow 0.5s ease,
        background-size 0.8s ease;
}

.image-project:hover {
    transform: translateY(-8px);
    box-shadow: 0 30px 80px rgba(0,0,0,0.4);
    background-size: 108%;
}
.image-project::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        to top,
        rgba(0,0,0,0.55),
        rgba(0,0,0,0.05)
    );
    opacity: 0;
    transition: opacity 0.5s ease;
    pointer-events: none;
}

.image-project:hover::after {
    opacity: 1;
}
.image-project {
    position: relative;
}

.image-project .project-text {
    position: absolute;
    bottom: 24px;
    left: 24px;
    right: 24px;
    color: #fff;
    z-index: 2;
    opacity: 0;
    transform: translateY(12px);
    transition: all 0.5s ease;
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-31e4844 *//* Kolom kiri sticky */
.sticky-left {
    position: -webkit-sticky;
    position: sticky;
    top: 100px;
    align-self: flex-start;
    z-index: 10;
}

/* Kolom kanan */
.dynamic-right {
    position: relative;
}

/* Setiap item konten di kolom kanan */
.content-item {
    min-height: 50vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 50px 20px;
    
    /* Efek awal (sebelum scroll) */
    opacity: 0;
    transform: translateY(80px);
    filter: blur(8px);
    
    /* Animasi smooth */
    transition: opacity 0.8s cubic-bezier(0.4, 0, 0.2, 1),
                transform 0.8s cubic-bezier(0.4, 0, 0.2, 1),
                filter 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Efek saat item aktif (di viewport) */
.content-item.active {
    opacity: 1;
    transform: translateY(0);
    filter: blur(0);
}

/* Responsive - matikan sticky di mobile */
@media (max-width: 768px) {
    .sticky-left {
        position: relative;
        top: 0;
    }
    
    .content-item {
        min-height: 60vh;
        /* Kurangi efek di mobile agar tidak lag */
        transform: translateY(40px);
        filter: blur(4px);
    }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-a5130e6 *//* Jajar Genjang – miring di atas (tanpa hover) */
.container-project {
    position: relative;
    clip-path: polygon(0 10%, 100% 0, 100% 100%, 0 100%);
    padding-top: 100px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
}/* End custom CSS */