.elementor-3212 .elementor-element.elementor-element-df8cf3e{--display:flex;--flex-direction:row-reverse;--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-reverse;--align-items:stretch;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--overlay-opacity:1;--overlay-mix-blend-mode:color;--padding-top:250px;--padding-bottom:50px;--padding-left:0px;--padding-right:0px;}.elementor-3212 .elementor-element.elementor-element-df8cf3e::before, .elementor-3212 .elementor-element.elementor-element-df8cf3e > .elementor-background-video-container::before, .elementor-3212 .elementor-element.elementor-element-df8cf3e > .e-con-inner > .elementor-background-video-container::before, .elementor-3212 .elementor-element.elementor-element-df8cf3e > .elementor-background-slideshow::before, .elementor-3212 .elementor-element.elementor-element-df8cf3e > .e-con-inner > .elementor-background-slideshow::before, .elementor-3212 .elementor-element.elementor-element-df8cf3e > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:#0C1D45;--background-overlay:'';}.elementor-3212 .elementor-element.elementor-element-07e74b1{--display:flex;--flex-direction:row-reverse;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap-reverse;--gap:15px 0px;--row-gap:15px;--column-gap:0px;--flex-wrap:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3212 .elementor-element.elementor-element-fa5c764 > .elementor-widget-container{padding:0px 0px 0px 0px;}.elementor-3212 .elementor-element.elementor-element-fa5c764{text-align:start;}.elementor-3212 .elementor-element.elementor-element-fa5c764 .elementor-heading-title{text-shadow:-7px 5px 0px #010207;color:#FBC316;}.elementor-3212 .elementor-element.elementor-element-2e6066b{--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:stretch;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--overlay-opacity:0.8;--overlay-mix-blend-mode:color;--padding-top:150px;--padding-bottom:125px;--padding-left:0px;--padding-right:0px;}.elementor-3212 .elementor-element.elementor-element-2e6066b:not(.elementor-motion-effects-element-type-background), .elementor-3212 .elementor-element.elementor-element-2e6066b > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://www.moty.com.my/wp-content/uploads/2020/02/bg-img-07-free-img.jpg");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-3212 .elementor-element.elementor-element-2e6066b::before, .elementor-3212 .elementor-element.elementor-element-2e6066b > .elementor-background-video-container::before, .elementor-3212 .elementor-element.elementor-element-2e6066b > .e-con-inner > .elementor-background-video-container::before, .elementor-3212 .elementor-element.elementor-element-2e6066b > .elementor-background-slideshow::before, .elementor-3212 .elementor-element.elementor-element-2e6066b > .e-con-inner > .elementor-background-slideshow::before, .elementor-3212 .elementor-element.elementor-element-2e6066b > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:#0C1D45;--background-overlay:'';}.elementor-3212 .elementor-element.elementor-element-8fdc3b2{--display:flex;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3212 .elementor-element.elementor-element-9f37ce2{--grid-row-gap:35px;--grid-column-gap:30px;}.elementor-3212 .elementor-element.elementor-element-9f37ce2 .elementor-posts-container .elementor-post__thumbnail{padding-bottom:calc( 0.66 * 100% );}.elementor-3212 .elementor-element.elementor-element-9f37ce2:after{content:"0.66";}.elementor-3212 .elementor-element.elementor-element-9f37ce2 .elementor-post__thumbnail__link{width:100%;}.elementor-3212 .elementor-element.elementor-element-9f37ce2 .elementor-post__meta-data span + span:before{content:"•";}.elementor-3212 .elementor-element.elementor-element-9f37ce2 .elementor-post__text{margin-top:20px;}.elementor-3212 .elementor-element.elementor-element-9f37ce2 .elementor-post__title, .elementor-3212 .elementor-element.elementor-element-9f37ce2 .elementor-post__title a{color:var( --e-global-color-astglobalcolor6 );}.elementor-3212 .elementor-element.elementor-element-9f37ce2 .elementor-post__meta-data{color:var( --e-global-color-astglobalcolor7 );}.elementor-3212 .elementor-element.elementor-element-9f37ce2 .elementor-post__excerpt p{color:var( --e-global-color-astglobalcolor4 );}.elementor-3212 .elementor-element.elementor-element-9f37ce2 .elementor-pagination{text-align:center;margin-top:30px;}body:not(.rtl) .elementor-3212 .elementor-element.elementor-element-9f37ce2 .elementor-pagination .page-numbers:not(:first-child){margin-left:calc( 10px/2 );}body:not(.rtl) .elementor-3212 .elementor-element.elementor-element-9f37ce2 .elementor-pagination .page-numbers:not(:last-child){margin-right:calc( 10px/2 );}body.rtl .elementor-3212 .elementor-element.elementor-element-9f37ce2 .elementor-pagination .page-numbers:not(:first-child){margin-right:calc( 10px/2 );}body.rtl .elementor-3212 .elementor-element.elementor-element-9f37ce2 .elementor-pagination .page-numbers:not(:last-child){margin-left:calc( 10px/2 );}@media(max-width:1024px){.elementor-3212 .elementor-element.elementor-element-df8cf3e{--padding-top:275px;--padding-bottom:50px;--padding-left:25px;--padding-right:25px;}.elementor-3212 .elementor-element.elementor-element-07e74b1{--gap:15px 0px;--row-gap:15px;--column-gap:0px;}.elementor-3212 .elementor-element.elementor-element-fa5c764 > .elementor-widget-container{padding:0px 0px 0px 0px;}.elementor-3212 .elementor-element.elementor-element-2e6066b{--justify-content:flex-start;--padding-top:100px;--padding-bottom:100px;--padding-left:25px;--padding-right:25px;}}@media(max-width:767px){.elementor-3212 .elementor-element.elementor-element-df8cf3e{--overlay-opacity:1;--padding-top:150px;--padding-bottom:50px;--padding-left:20px;--padding-right:20px;}.elementor-3212 .elementor-element.elementor-element-07e74b1{--width:100%;--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;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-3212 .elementor-element.elementor-element-fa5c764 > .elementor-widget-container{padding:0px 0px 0px 0px;}.elementor-3212 .elementor-element.elementor-element-2e6066b{--padding-top:50px;--padding-bottom:50px;--padding-left:20px;--padding-right:20px;}.elementor-3212 .elementor-element.elementor-element-8fdc3b2{--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3212 .elementor-element.elementor-element-9f37ce2 .elementor-posts-container .elementor-post__thumbnail{padding-bottom:calc( 0.5 * 100% );}.elementor-3212 .elementor-element.elementor-element-9f37ce2:after{content:"0.5";}.elementor-3212 .elementor-element.elementor-element-9f37ce2 .elementor-post__thumbnail__link{width:100%;}}@media(max-width:1024px) and (min-width:768px){.elementor-3212 .elementor-element.elementor-element-07e74b1{--width:65%;}}@media(min-width:1025px){.elementor-3212 .elementor-element.elementor-element-2e6066b:not(.elementor-motion-effects-element-type-background), .elementor-3212 .elementor-element.elementor-element-2e6066b > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-attachment:fixed;}}/* Start custom CSS for heading, class: .elementor-element-fa5c764 */.hero-title {
  /* Gaya Font */
  font-family: 'Montserrat', sans-serif; /* Pastikan font tebal */
  font-weight: 900; /* Extra Bold */
  font-size: 3rem; /* Saiz besar ikut kesesuaian skrin */
  line-height: 1.3;
  text-align: center;
  text-transform: uppercase;
  
  /* Pastikan teks tak terlalu lebar di skrin besar */
  max-width: 900px;
  margin: 0 auto;

  /* Keadaan Mula (Sebelum Animasi) */
  opacity: 0; 
  transform: scale(0.9) translateY(30px); /* Kecil sikit & duduk bawah */
  filter: blur(15px); /* Sangat kabur */
  
  /* Tetapan Animasi: 'forwards' maksudnya dia kekal di posisi akhir */
  animation: textLand 1.2s cubic-bezier(0.2, 1, 0.3, 1) forwards;
  
  /* Delay sikit kalau nak tunggu page loading */
  animation-delay: 0.3s;
}

/* Kunci Animasi (Keyframes) */
@keyframes textLand {
  to {
    opacity: 1; /* Muncul sepenuhnya */
    transform: scale(1) translateY(0); /* Saiz asal & posisi tepat */
    filter: blur(0); /* Hilang kabur, jadi tajam */
  }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-df8cf3e *//* Class untuk container yang anda nak letak effect tu */
.film-grain {
  position: relative;
  overflow: hidden; /* Supaya grain tak terkeluar */
}

/* Pseudo-element untuk layer grain */
.film-grain::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none; /* Penting! Supaya user boleh klik button di bawah grain */
  z-index: 10; /* Pastikan ia berada di atas content tapi bawah modal/menu */
  
  /* Ini adalah magic dia - SVG Noise pattern */
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)' opacity='1'/%3E%3C/svg%3E");
  
  opacity: 0.15; /* Kawal ketebalan grain di sini (0.1 - 0.3 nampak nice) */
  mix-blend-mode: overlay; /* Atau guna 'soft-light' / 'screen' bergantung pada background */
}
@keyframes grain-move {
  0%, 100% { transform: translate(0, 0); }
  10% { transform: translate(-5%, -5%); }
  20% { transform: translate(-10%, 5%); }
  30% { transform: translate(5%, -10%); }
  40% { transform: translate(-5%, 15%); }
  50% { transform: translate(-10%, 5%); }
  60% { transform: translate(15%, 0); }
  70% { transform: translate(0, 10%); }
  80% { transform: translate(-15%, 0); }
  90% { transform: translate(10%, 5%); }
}

.film-grain::after {
  /* Tambah code ini pada class ::after tadi */
  width: 200%; /* Lebarkan sikit supaya bila gerak tak nampak kosong */
  height: 200%;
  left: -50%;
  top: -50%;
  animation: grain-move 8s steps(10) infinite;
}/* End custom CSS */