.elementor-3653 .elementor-element.elementor-element-a1b6b07{width:var( --container-widget-width, 75% );max-width:75%;--container-widget-width:75%;--container-widget-flex-grow:0;z-index:5;text-align:center;}.elementor-3653 .elementor-element.elementor-element-a1b6b07 > .elementor-widget-container{margin:0px 0px 20px 0px;padding:0px 0px 0px 0px;}.elementor-3653 .elementor-element.elementor-element-a1b6b07 .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-size:var( --e-global-typography-primary-font-size );font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-81050ec );}.elementor-3653 .elementor-element.elementor-element-b3ca52a{width:var( --container-widget-width, 800px );max-width:800px;--container-widget-width:800px;--container-widget-flex-grow:0;z-index:5;text-align:center;font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-size:var( --e-global-typography-text-font-size );font-weight:var( --e-global-typography-text-font-weight );line-height:var( --e-global-typography-text-line-height );color:var( --e-global-color-text );}.elementor-3653 .elementor-element.elementor-element-7176798{font-family:"Rubik", Sans-serif;font-size:1vw;font-weight:300;}.elementor-3653 .elementor-element.elementor-element-7176798 a{color:var( --e-global-color-text );}.elementor-3653 .elementor-element.elementor-element-21b7274{--display:flex;--min-height:200vh;--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;--justify-content:center;--align-items:center;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:3rem;--padding-bottom:3.75rem;--padding-left:3.75rem;--padding-right:3.75rem;--z-index:10;}.elementor-3653 .elementor-element.elementor-element-d6d211a > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3653 .elementor-element.elementor-element-d6d211a{text-align:center;}.elementor-3653 .elementor-element.elementor-element-d6d211a .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-size:var( --e-global-typography-primary-font-size );font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-81050ec );}.elementor-3653 .elementor-element.elementor-element-c7bfbc4{width:initial;max-width:initial;text-align:center;font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-size:var( --e-global-typography-text-font-size );font-weight:var( --e-global-typography-text-font-weight );line-height:var( --e-global-typography-text-line-height );color:var( --e-global-color-text );}.elementor-3653 .elementor-element.elementor-element-c7bfbc4 > .elementor-widget-container{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}.elementor-3653 .elementor-element.elementor-element-1f64fcb{--display:grid;--e-con-grid-template-columns:repeat(2, 1fr);--e-con-grid-template-rows:repeat(2, 1fr);--gap:20px 20px;--row-gap:20px;--column-gap:20px;--grid-auto-flow:row;--justify-items:center;--align-items:center;--margin-top:0rem;--margin-bottom:0rem;--margin-left:0rem;--margin-right:0rem;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3653 .elementor-element.elementor-element-45e0b89{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-size:var( --e-global-typography-text-font-size );font-weight:var( --e-global-typography-text-font-weight );line-height:var( --e-global-typography-text-line-height );}.elementor-3653 .elementor-element.elementor-element-4f0c5f4{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-size:var( --e-global-typography-text-font-size );font-weight:var( --e-global-typography-text-font-weight );line-height:var( --e-global-typography-text-line-height );}.elementor-3653 .elementor-element.elementor-element-9a12261{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-size:var( --e-global-typography-text-font-size );font-weight:var( --e-global-typography-text-font-weight );line-height:var( --e-global-typography-text-line-height );}.elementor-3653 .elementor-element.elementor-element-badabd2{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-size:var( --e-global-typography-text-font-size );font-weight:var( --e-global-typography-text-font-weight );line-height:var( --e-global-typography-text-line-height );}.elementor-3653 .elementor-element.elementor-element-a4085a6{--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;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}body.elementor-page-3653{margin:0px 0px 0px 0px;padding:0px 0px 0px 0px;}@media(max-width:1024px){.elementor-3653 .elementor-element.elementor-element-a1b6b07 .elementor-heading-title{font-size:var( --e-global-typography-primary-font-size );}.elementor-3653 .elementor-element.elementor-element-b3ca52a{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-3653 .elementor-element.elementor-element-7176798{text-align:center;font-size:2.2vw;}.elementor-3653 .elementor-element.elementor-element-21b7274{--gap:0rem 0rem;--row-gap:0rem;--column-gap:0rem;--padding-top:3rem;--padding-bottom:3rem;--padding-left:3rem;--padding-right:3rem;}.elementor-3653 .elementor-element.elementor-element-d6d211a .elementor-heading-title{font-size:var( --e-global-typography-primary-font-size );}.elementor-3653 .elementor-element.elementor-element-c7bfbc4{text-align:center;font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-3653 .elementor-element.elementor-element-1f64fcb{--e-con-grid-template-columns:repeat(1, 1fr);--e-con-grid-template-rows:repeat(4, 1fr);--grid-auto-flow:row;--margin-top:0rem;--margin-bottom:0rem;--margin-left:0rem;--margin-right:0rem;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3653 .elementor-element.elementor-element-45e0b89{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-3653 .elementor-element.elementor-element-4f0c5f4{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-3653 .elementor-element.elementor-element-9a12261{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-3653 .elementor-element.elementor-element-badabd2{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}}@media(max-width:767px){.elementor-3653 .elementor-element.elementor-element-a1b6b07{width:100%;max-width:100%;}.elementor-3653 .elementor-element.elementor-element-a1b6b07 .elementor-heading-title{font-size:var( --e-global-typography-primary-font-size );}.elementor-3653 .elementor-element.elementor-element-b3ca52a{text-align:start;font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-3653 .elementor-element.elementor-element-7176798{font-size:4vw;}.elementor-3653 .elementor-element.elementor-element-21b7274{--padding-top:0rem;--padding-bottom:0rem;--padding-left:1rem;--padding-right:1rem;}.elementor-3653 .elementor-element.elementor-element-d6d211a .elementor-heading-title{font-size:var( --e-global-typography-primary-font-size );}.elementor-3653 .elementor-element.elementor-element-c7bfbc4{text-align:start;font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-3653 .elementor-element.elementor-element-1f64fcb{--e-con-grid-template-columns:repeat(1, 1fr);--grid-auto-flow:row;}.elementor-3653 .elementor-element.elementor-element-45e0b89{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-3653 .elementor-element.elementor-element-4f0c5f4{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-3653 .elementor-element.elementor-element-9a12261{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}.elementor-3653 .elementor-element.elementor-element-badabd2{font-size:var( --e-global-typography-text-font-size );line-height:var( --e-global-typography-text-line-height );}}@media(min-width:768px){.elementor-3653 .elementor-element.elementor-element-1f64fcb{--width:80%;}}@media(max-width:1024px) and (min-width:768px){.elementor-3653 .elementor-element.elementor-element-1f64fcb{--width:100%;}}/* Start custom CSS for text-editor, class: .elementor-element-b3ca52a */.elementor-3653 .elementor-element.elementor-element-b3ca52a{
    max-width: 800px
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-1f64fcb */#image_1{
    -webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,1) 60%, rgba(0,0,0,0) 100%);
  mask-image: linear-gradient(to bottom, rgba(0,0,0,1) 60%, rgba(0,0,0,0) 100%);
}
#image_2{
    -webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,1) 60%, rgba(0,0,0,0) 100%);
  mask-image: linear-gradient(to bottom, rgba(0,0,0,1) 60%, rgba(0,0,0,0) 100%);
}

#imagen_3{
    -webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,1) 60%, rgba(0,0,0,0) 100%);
  mask-image: linear-gradient(to bottom, rgba(0,0,0,1) 60%, rgba(0,0,0,0) 100%);
}

#imagen_4{
    -webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,1) 60%, rgba(0,0,0,0) 100%);
  mask-image: linear-gradient(to bottom, rgba(0,0,0,1) 60%, rgba(0,0,0,0) 100%);
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-21b7274 *//* ==========================================================================
   1. ESTILO BASE (PANTALLAS GRANDES / DESKTOP DESDE 1025px)
   ========================================================================== */
#principal_image {
  background-image: 
    linear-gradient(100deg, rgba(222, 222, 235, 0.37) 0%, rgba(222, 222, 235, 0) 100%),
    radial-gradient(circle at center center, rgba(215, 215, 232, 1) 29%, rgba(215, 215, 232, 0) 100%),
    url('https://impeccablehome.com.co/wp-content/uploads/2026/04/ChatGPT-Image-Apr-15-2026-01_55_45-PM-1.webp'); 

  background-repeat: no-repeat, no-repeat, no-repeat;
  
  /* En desktop grande, dejamos que mantenga su tamaño automático o un ancho controlado */
  background-size: cover, cover, 45%; 
  background-position: center center, center center, right 5% bottom 50%;
  background-attachment: fixed;

  /* --- SÚPER MÁSCARA: Desvanece Abajo, Arriba (más sutil) e Izquierda --- */
  /* Combinamos dos degradados: uno vertical (top/bottom) y uno horizontal (left) */
  -webkit-mask-image: 
    linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 12%, rgba(0,0,0,1) 75%, rgba(0,0,0,0) 100%),
    linear-gradient(to right, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 25%);
  mask-image: 
    linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 12%, rgba(0,0,0,1) 75%, rgba(0,0,0,0) 100%),
    linear-gradient(to right, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 25%);
  
  /* Importante para que las dos máscaras se fusionen correctamente */
  -webkit-mask-composite: source-in;
  mask-composite: intersect;

  /* --- Animación impulsada por Scroll --- */
  view-timeline-name: --ocultar-al-scroll;
  view-timeline-axis: block; 
  animation-name: animacion-ocultar;
  animation-fill-mode: both; 
  animation-timeline: --ocultar-al-scroll;
  animation-range: contain 0% contain 100%;
}

/* ==========================================================================
   2. BREAKPOINT LAPTOPS / PANTALLAS MEDIANAS (Hasta 1024px)
   ========================================================================== */
@media (max-width: 1024px) {
  #principal_image {
    /* Hacemos la imagen un poco más grande para que no se pierda en laptops */
    background-size: cover, cover, 55%;
    /* La pegamos bien a la derecha */
    background-position: center center, center center, right -5% bottom 50%;
  }
}

/* ==========================================================================
   3. BREAKPOINT TABLETS (Hasta 768px)
   ========================================================================== */
@media (max-width: 768px) {
  #principal_image {
    /* En tablet la hacemos aún más grande o la centramos si el texto se va abajo */
    background-size: cover, cover, 65%;
    background-position: center center, center center, right -10% bottom 40%;
    
    /* Suavizamos un poco más la máscara izquierda en tablets */
    -webkit-mask-image: 
      linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 10%, rgba(0,0,0,1) 80%, rgba(0,0,0,0) 100%),
      linear-gradient(to right, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 15%);
    mask-image: 
      linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 10%, rgba(0,0,0,1) 80%, rgba(0,0,0,0) 100%),
      linear-gradient(to right, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 15%);
  }
}

/* ==========================================================================
   4. BREAKPOINT MÓVILES (Hasta 480px)
   ========================================================================== */
@media (max-width: 480px) {
  #principal_image {
    /* En móviles, como el texto ocupa casi toda la pantalla, la imagen debe ir de fondo completo o muy sutil al lado */
    background-size: cover, cover, 80%;
    background-position: center center, center center, right -20% bottom 20%;
    opacity: 0.25; /* Bajamos la opacidad general en móvil para que no tape el texto de lectura */
  }
}

/* ==========================================================================
   5. KEYFRAMES ADAPTADOS PARA EL MOVIMIENTO EN DESKTOP
   ========================================================================== */
@keyframes animacion-ocultar {
  from {
    opacity: 1;
    background-position: center center, center center, right 5% bottom 10%; 
  }
  to {
    opacity: 0;
  }
}/* End custom CSS */