
/* ===== BASE (360px+) ===== */
.ibd-static-landing-mod-04-ofertas-plan-mas-ahorro {
 display: flex;
  min-width: var(--360-575-page-width, 360px);
  padding: var(--size-space-32, 32px) var(--360-575-page-margin, 16px) var(--size-space-40, 40px) var(--360-575-page-margin, 16px);
  flex-direction: column;
  align-items: center;
  gap: var(--size-space-40, 40px);
  border-radius: var(--border-radius-l, 16px);
  background: var(--Color-Surface-General-1, #FFF);
}

.mod04-titulo {
  color: var(--Color-Content-General-1, #2c2c2c);
  font-feature-settings: "liga" off, "clig" off;
  align-self: stretch;
  text-align: center;
  margin-bottom: 0px;
}
.mod04-titulo-card{
  color: var(--Color-Content-General-1, #2c2c2c);
  font-feature-settings: "liga" off, "clig" off;
  align-self: stretch;
  margin-bottom: 0px;
}

.mod04-subtitulo {
  color: var(--Color-Content-General-1, #2c2c2c);
  font-feature-settings: "liga" off, "clig" off;
  align-self: stretch;
  margin-bottom: 0px;
}

.mod04-contenedor-planes {
  display: flex;
  padding: var(--size-space-0, 0);
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: var(--size-space-24, 24px);
  align-self: stretch;
}

.mod04-contenedor-plan-imagen {
  display: flex;
  padding: var(--size-space-20, 20px);
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: var(--size-space-24, 24px);
  align-self: stretch;
  border-radius: var(--border-radius-l, 16px);
  background: var(--Color-Surface-General-2, #dcebe1);
}

.mod04-contenedor-imagen {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  align-self: stretch;
}

.mod04-imagen {
  height: 300px;
  width: 100%;
  align-self: stretch;
  object-fit: cover;
  border-radius: var(--border-radius-l, 16px);
}
.mod04-contenedor-plan-textos{
  display: flex;
  padding: var(--size-space-0, 0);
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: var(--size-space-24, 24px);
  align-self: stretch;
  border-radius: var(--border-radius-l, 16px);
}
.mod04-contenedor-texto {
  display: flex;
  padding: var(--size-space-0, 0);
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: var(--size-space-8, 8px);
  align-self: stretch;
}

.mod04-texto {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--size-space-8, 8px);
  align-self: stretch;
}

.mod04-contenedor-plan-texto {
  display: flex;
  padding: var(--size-space-0, 0);
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: var(--size-space-24, 24px);
  align-self: stretch;
}

.mod04-contenedor-plan-texto-1 {
display: flex;
padding: var(--size-space-20, 20px);
flex-direction: column;
justify-content: center;
align-items: flex-start;
gap: var(--size-space-24, 24px);
align-self: stretch;
  border-radius: var(--border-radius-l, 16px);
background: var(--Color-Surface-General-3, #F9F9F9);
}

.mod04-contenedor-plan-texto-2 {
display: flex;
padding: var(--size-space-20, 20px);
flex-direction: column;
align-items: flex-start;
gap: var(--size-space-8, 8px);
align-self: stretch;
  border-radius: var(--border-radius-l, 16px);
background: var(--Color-Surface-General-4, #FFF5EC);
}
.mod04-contenedor-plan-texto-3{
  display: flex;
  padding: var(--size-space-20, 20px);
  flex-direction: column;
  align-items: flex-start;
  gap: var(--size-space-8, 8px);
  align-self: stretch;
  border-radius: var(--border-radius-l, 16px);
  background: var(--Color-Category-General-3, #F0F0F0);
}

/* ===== 576px+ ===== */
@media (min-width: 576px) {
  .ibd-static-landing-mod-04-ofertas-plan-mas-ahorro {
    min-width: var(--576-767-page-width, 576px);
    padding: var(--size-space-32, 32px) 85px var(--size-space-40, 40px) 85px;
  }

  .mod04-contenedor-planes {
    min-width: 406px;
    align-self: unset;
  }

  .mod04-contenedor-plan-texto {
    border-radius: var(--border-radius-l, 16px);
  }
}

/* ===== 768px+ ===== */
@media (min-width: 768px) {
  .ibd-static-landing-mod-04-ofertas-plan-mas-ahorro {
    min-width: var(--768-991-page-width, 768px);
    padding: var(--size-space-32, 32px) 106px var(--size-space-40, 40px) 106px;
    border-radius: var(--border-radius-l, 16px);
    background: var(--Color-Surface-General-1, #fff);
  }

  .mod04-titulo {
    min-width: 556px;
    margin-bottom: 0;
  }

  .mod04-titulo-card {
    color: var(--Color-Content-General-1, #2c2c2c);
    font-feature-settings: "liga" off, "clig" off;
    align-self: stretch;
  }

  .mod04-contenedor-planes {
    min-width: 556px;
    align-self: unset;
  }

  .mod04-contenedor-plan-texto {
    border-radius: var(--border-radius-l, 16px);
  }

  .mod04-contenedor-plan-texto-2 {
    flex: 1 0 0;
  }
}

/* ===== 992px+ ===== */
@media (min-width: 992px) {
  .ibd-static-landing-mod-04-ofertas-plan-mas-ahorro {
    min-width: var(--992-1199-page-width, 992px);
    padding: var(--size-space-64, 64px) var(--992-1199-page-margin, 82px)
      var(--size-space-80, 80px) var(--992-1199-page-margin, 82px);
    border-radius: var(--border-radius-xl, 48px);
    background: var(--Color-Surface-General-1, #fff);
  }

  .mod04-titulo {
    margin-bottom: 0;
  }

  .mod04-contenedor-planes {
    flex-direction: column;
    align-items: center;
    align-self: stretch;
    min-width: unset;
  }

  .mod04-contenedor-plan-imagen {
    flex-direction: row-reverse;
    align-items: center;
    align-self: stretch;
    padding: var(--size-space-32, 32px);
    gap: var(--size-space-40, 40px);

  }

  .mod04-contenedor-plan-imagen--reverse {
    flex-direction: row;
  }

  .mod04-contenedor-imagen {
    flex: 1 0 0;
    align-self: stretch;
    flex-direction: column;
    align-items: flex-start;
  }

  .mod04-imagen {
    height: 300px;
    align-self: stretch;
    object-fit: cover;
    border-radius: var(--border-radius-l, 16px);
  }

  .mod04-contenedor-texto {
    flex: 1 0 0;
    gap: var(--size-space-12, 12px);
    align-self: unset;
  }

  .mod04-texto {
    gap: 8px;
    align-self: stretch;
  }

  .mod04-contenedor-plan-texto {
    flex-direction: row;
    align-items: stretch;
    align-self: stretch;
    gap: var(--size-space-24, 24px);
    border-radius: var(--border-radius-none, 0);
  }
  .mod04-contenedor-plan-textos{
    display: flex;
    padding: var(--size-space-0, 0);
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: var(--size-space-24, 24px);
    flex: 1 0 0;
    align-self: stretch;
  }
  .mod04-contenedor-plan-texto-1 {
    flex-direction: column-reverse; 
    justify-content: center;
    align-items: flex-start;
    gap: var(--size-space-40, 40px);
    flex: 1 0 0;
    border-radius: var(--border-radius-l, 16px);
    background: var(--Color-Surface-General-3, #F9F9F9);
    padding: var(--size-space-32, 32px);
  }

  .mod04-contenedor-plan-texto-2 {
    display: flex;
    padding: var(--size-space-32, 32px);
    flex-direction: column;
    align-items: flex-start;
    gap: var(--size-space-8, 8px);
    flex: 1 0 0;
    align-self: stretch;
    border-radius: var(--border-radius-l, 16px);
    background: var(--Color-Surface-General-4, #FFF5EC);
  }
   .mod04-contenedor-plan-texto-3 {
     display: flex;
    padding: var(--size-space-32, 32px);
    flex-direction: column;
    align-items: flex-start;
    gap: var(--size-space-8, 8px);
    flex: 1 0 0;
    align-self: stretch;
   }
  
}

/* ===== 1200px+ ===== */
@media (min-width: 1200px) {
  .ibd-static-landing-mod-04-ofertas-plan-mas-ahorro {
    min-width: var(--1200-1399-page-width, 1200px);
    padding: var(--size-space-64, 64px) 187px var(--size-space-80, 80px) 187px;
    border-radius: var(--border-radius-xl, 48px);
    background: var(--Color-Surface-General-1, #fff);
  }

  .mod04-titulo {
    min-width: 825px;
    margin-bottom: 0;
  }

  .mod04-contenedor-planes {
    display: flex;
    min-width: 826px;
    padding: var(--size-space-0, 0);
    flex-direction: column;
    align-items: center;
    gap: var(--size-space-24, 24px);
  }
    .mod04-contenedor-plan-textos{
    display: flex;
padding: var(--size-space-0, 0);
flex-direction: column;
justify-content: center;
align-items: flex-start;
gap: var(--size-space-24, 24px);
flex: 1 0 0;
align-self: stretch;
      border-radius: var(--border-radius-none, 0);
  }

}


/* ===== 1920px+ ===== */
@media (min-width: 1920px) {
  .ibd-static-landing-mod-04-ofertas-plan-mas-ahorro {
    display: flex;
    min-width: var(--14001920-page-width, 1920px);
    padding: var(--size-space-64, 64px) var(--14001920-page-margin, 324px) var(--size-space-80, 80px) var(--14001920-page-margin, 324px);
    flex-direction: column;
    align-items: center;
    gap: var(--size-space-40, 40px);
    border-radius: var(--border-radius-xl, 48px);
    background: var(--Color-Surface-General-1, #FFF);
  }

  .mod04-titulo {
    min-width: 1056px;
    color: var(--Color-Content-General-1, #2C2C2C);
    text-align: center;
    font-feature-settings: 'liga' off, 'clig' off;
  }

  .mod04-contenedor-planes {
    display: flex;
    min-width: 1056px;
    padding: var(--size-space-0, 0);
    flex-direction: column;
    align-items: center;
    gap: var(--size-space-24, 24px);
  }

  .mod04-contenedor-imagen picture {
    display: block;   
    width: 100%;
  }

  .mod04-imagen {
    height: 300px;   
    border-radius: var(--border-radius-l, 16px);
  }
      .mod04-contenedor-plan-textos{
    display: flex;
padding: var(--size-space-0, 0);
flex-direction: column;
justify-content: center;
align-items: flex-start;
gap: var(--size-space-24, 24px);
flex: 1 0 0;
align-self: stretch;
      border-radius: var(--border-radius-none, 0);
  }
  .mod04-contenedor-plan-texto-1 {
    flex-direction: column-reverse; 
    justify-content: center;
    align-items: flex-start;
    gap: var(--size-space-40, 40px);
    flex: 1 0 0;
    border-radius: var(--border-radius-l, 16px);
    background: var(--Color-Surface-General-3, #F9F9F9);
    padding: var(--size-space-32, 32px);
  }

  .mod04-contenedor-plan-texto-2 {
    display: flex;
    padding: var(--size-space-32, 32px);
    flex-direction: column;
    align-items: flex-start;
    gap: var(--size-space-8, 8px);
    flex: 1 0 0;
    align-self: stretch;
  }
   .mod04-contenedor-plan-texto-3 {
     display: flex;
    padding: var(--size-space-32, 32px);
    flex-direction: column;
    align-items: flex-start;
    gap: var(--size-space-8, 8px);
    flex: 1 0 0;
    align-self: stretch;
   }
}

