/* ==================================================================
   Koreksi lebar kolom di antara HP dan desktop, plus animasi hero.
   Dimuat terakhir supaya menang atas style.css dan layout.css.
   ================================================================== */

@media (max-width:1024px){
  .e-con:has(> .e-con-inner > .cc-journal){width:48%; --width:48%;}
  .e-con:has(> .e-con-inner > .cc-foothead){width:46%; --width:46%;}
  .e-con:has(> .e-con-inner > .cc-zoom-wide){width:100%; --width:100%;}
}

@media (max-width:767px){
  .e-con:has(> .e-con-inner > .cc-journal){width:100%; --width:100%;}
  .e-con:has(> .e-con-inner > .cc-foothead){width:100%; --width:100%;}
}

/* ------------------------------------------------------------------
   ANIMASI HERO TANPA JAVASCRIPT.

   Entrance animation Elementor menambahkan class "elementor-invisible"
   di HTML dan baru melepasnya lewat JS saat elemen masuk viewport.
   Untuk section di bawah lipatan itu tidak masalah, tapi untuk hero
   artinya SELURUH teks layar pertama tidak terlihat sampai script
   jalan, dan sempat terbukti hilang total pada render tanpa JS.

   Karena itu keempat widget hero TIDAK memakai entrance Elementor,
   dan animasinya dijalankan murni dari CSS di sini: geser 50px,
   1,25 detik, easing ease, delay bertahap seperti Lumilux.
   ------------------------------------------------------------------ */
.e-con:has(> .e-con-inner > .cc-heroover) > .e-con-inner > .elementor-widget{
  animation:ccShortFadeInUp 1.25s ease both;
}
.e-con:has(> .e-con-inner > .cc-heroover) > .e-con-inner > .elementor-widget:nth-child(1){animation-delay:.2s;}
.e-con:has(> .e-con-inner > .cc-heroover) > .e-con-inner > .elementor-widget:nth-child(2){animation-delay:.4s;}
.e-con:has(> .e-con-inner > .cc-heroover) > .e-con-inner > .elementor-widget:nth-child(3){animation-delay:.5s;}
.e-con:has(> .e-con-inner > .cc-heroover) > .e-con-inner > .elementor-widget:nth-child(4){animation-delay:.6s;}

@media (prefers-reduced-motion:reduce){
  .e-con:has(> .e-con-inner > .cc-heroover) > .e-con-inner > .elementor-widget{animation:none;}
}