.elementor-699 .elementor-element.elementor-element-73dc799{--display:flex;--min-height:100vh;--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;--justify-content:center;--gap:20px 20px;--row-gap:20px;--column-gap:20px;--overlay-opacity:0.6;}.elementor-699 .elementor-element.elementor-element-73dc799::before, .elementor-699 .elementor-element.elementor-element-73dc799 > .elementor-background-video-container::before, .elementor-699 .elementor-element.elementor-element-73dc799 > .e-con-inner > .elementor-background-video-container::before, .elementor-699 .elementor-element.elementor-element-73dc799 > .elementor-background-slideshow::before, .elementor-699 .elementor-element.elementor-element-73dc799 > .e-con-inner > .elementor-background-slideshow::before, .elementor-699 .elementor-element.elementor-element-73dc799 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:var( --e-global-color-primary );--background-overlay:'';}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-699 .elementor-element.elementor-element-f31e6b2{text-align:center;}.elementor-699 .elementor-element.elementor-element-f31e6b2 .elementor-heading-title{font-family:"Cormorant Garamond", Sans-serif;font-size:60px;font-weight:700;color:#FFFFFF;}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-699 .elementor-element.elementor-element-d20b376{text-align:center;font-family:"Quicksand", Sans-serif;font-size:18px;font-weight:400;line-height:28px;color:var( --e-global-color-6f3d1d0 );}.elementor-699 .elementor-element.elementor-element-4e8392d{--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;--justify-content:center;--align-items:center;--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-widget-button .elementor-button{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-699 .elementor-element.elementor-element-9f6eb7c .elementor-button{background-color:var( --e-global-color-secondary );font-family:"DM Sans", Sans-serif;font-size:18px;font-weight:600;line-height:56px;fill:var( --e-global-color-6f3d1d0 );color:var( --e-global-color-6f3d1d0 );border-style:solid;border-width:2px 2px 2px 2px;border-color:var( --e-global-color-secondary );padding:0px 48px 0px 48px;}.elementor-699 .elementor-element.elementor-element-348019e{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}@media(max-width:767px){.elementor-699 .elementor-element.elementor-element-f31e6b2 .elementor-heading-title{font-size:36px;line-height:46px;}.elementor-699 .elementor-element.elementor-element-9f6eb7c{width:100%;max-width:100%;}}@media(min-width:768px){.elementor-699 .elementor-element.elementor-element-73dc799{--content-width:768px;}}/* Start custom CSS for heading, class: .elementor-element-f31e6b2 */.elementor-699 .elementor-element.elementor-element-f31e6b2 i {
    font-weight: 500;
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-73dc799 */.elementor-699 .elementor-element.elementor-element-73dc799 {
    background-image: linear-gradient(180deg, hsl(78 42% 77%), hsl(72 33% 93%));;
}/* End custom CSS */
/* Start custom CSS *//* Reset Margin */
    body, html {
      margin: 0;
      padding: 0;
      width: 100%;
      height: 100%;
    
      background-color: #000; /* Hitam agar transisi mulus */
      overflow-x: hidden;
    }

    /* ====================================================
       1. LAYER VIDEO HOME SCREEN
       ==================================================== */
    #video-home-screen {
      position: relative;
      width: 100%;
      height: 100vh;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      text-align: center;
      color: #ffffff;
      z-index: 10;
      transition: opacity 0.5s ease-out; /* Transisi halus saat hilang */
      overflow: hidden; /* Mencegah scrollbar jika iframe melebar */
    }

    /* YouTube iframe Background Trick untuk 'object-fit: cover' */
    #bg-video {
      position: absolute;
      top: 50%;
      left: 50%;
      width: 100vw;
      height: 100vh;
      transform: translate(-50%, -50%);
      z-index: -2;
      pointer-events: none; /* Mencegah user mengklik atau pause video */
      border: none;
    }

    /* Menjaga rasio 16:9 di layar lebar (Desktop) */
    @media (min-aspect-ratio: 16/9) {
      #bg-video {
        height: 56.25vw; /* 9/16 = 0.5625 */
      }
    }

    /* Menjaga rasio 16:9 di layar vertikal (Mobile) */
    @media (max-aspect-ratio: 16/9) {
      #bg-video {
        width: 177.78vh; /* 16/9 = 1.7778 */
      }
    }

    /* Overlay gelap agar teks terbaca */
    .video-overlay {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: rgba(47, 79, 47, 0.6); /* Hijau gelap transparan */
      z-index: -1;
    }

    /* Konten Teks */
    .hero-content {
      position: relative;
      z-index: 1;
      max-width: 800px;
      padding: 20px;
    }

    .hero-content h1 {
      font-size: 3em;
      margin-bottom: 10px;
      text-shadow: 2px 2px 10px rgba(0,0,0,0.5);
    }

    .hero-content p {
      font-size: 1.5em;
      margin-bottom: 40px;
      text-shadow: 1px 1px 8px rgba(0,0,0,0.5);
    }

  



    /* ====================================================
       2. LAYER APP IFRAME (LOVABLE AI)
       ==================================================== */
    #lovable-app-container {
      display: none; /* Sembunyikan iframe saat pertama load */
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100vh;
      z-index: 5;
      background-color: #FDFBF7;
    }

    .app-iframe {
      width: 100%;
      height: 100%;
      border: none;
    }/* End custom CSS */