.elementor-391 .elementor-element.elementor-element-abd9d5c{--display:flex;}.elementor-391 .elementor-element.elementor-element-6c7c03e{width:initial;max-width:initial;margin:20px 20px calc(var(--kit-widget-spacing, 0px) + 20px) 20px;top:0px;}body:not(.rtl) .elementor-391 .elementor-element.elementor-element-6c7c03e{left:0px;}body.rtl .elementor-391 .elementor-element.elementor-element-6c7c03e{right:0px;}body.elementor-page-391:not(.elementor-motion-effects-element-type-background), body.elementor-page-391 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:transparent;background-image:linear-gradient(180deg, #000000 0%, #000000 100%);}@media(max-width:767px){.elementor-391 .elementor-element.elementor-element-6c7c03e{width:100%;max-width:100%;margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}}/* Start custom CSS for html, class: .elementor-element-6c7c03e *//* ========== FIX MOBILE SPACING + TYPO ========== */
@media (max-width: 768px){

  /* Card / hero */
  .rdg-hero{
    padding: 16px !important;
  }

  /* Si tu hero tiene un contenedor tipo card dentro */
  .rdg-hero .rdg-card,
  .rdg-hero .elementor-widget-container{
    padding: 16px !important;
  }

  /* Títulos: menos gigantes, más respiración */
  .rdg-hero h1,
  .rdg-hero .rdg-h1{
    font-size: 32px !important;
    line-height: 1.08 !important;
    letter-spacing: -0.2px;
    margin-bottom: 10px !important;
  }

  /* Subtítulo: que se lea y no se coma el espacio */
  .rdg-hero p,
  .rdg-hero .rdg-sub{
    font-size: 15px !important;
    line-height: 1.35 !important;
    opacity: .92;
    margin-bottom: 14px !important;
  }

  /* ========== CONTADOR RESPONSIVE ========== */
  .rdg-countdown-wrap{
    margin-top: 12px !important;
  }

  /* Si el contador es un bloque con cajas (flex), que envuelva */
  .rdg-countdown-wrap .rdg-countdown,
  .rdg-countdown-wrap .countdown,
  .rdg-countdown-wrap .timer{
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    justify-content: center !important;
  }

  /* Cajas del contador (ajusta si tus clases cambian) */
  .rdg-countdown-wrap .rdg-unit,
  .rdg-countdown-wrap .countdown__item,
  .rdg-countdown-wrap .timer-box{
    width: calc(50% - 5px) !important;  /* 2 por fila en móvil */
    min-height: 64px !important;
    padding: 10px 8px !important;
    border-radius: 14px !important;
  }

  /* Números del contador */
  .rdg-countdown-wrap .rdg-num,
  .rdg-countdown-wrap .countdown__number,
  .rdg-countdown-wrap .timer-number{
    font-size: 28px !important;
    line-height: 1 !important;
  }

  /* Labels (Días/Horas/etc) */
  .rdg-countdown-wrap .rdg-label,
  .rdg-countdown-wrap .countdown__label,
  .rdg-countdown-wrap .timer-label{
    font-size: 12px !important;
    opacity: .85;
  }

  /* ========== Sticky: que NO tape contenido ========== */
  body{ padding-bottom: 96px !important; }

  /* iPhone safe area (para que no se vea encimado con la barra) */
  .rdg-sticky-cta{
    padding-bottom: calc(12px + env(safe-area-inset-bottom)) !important;
  }
}/* End custom CSS */
/* Start custom CSS *//* Contenedor para que NO se pegue a las orillas */
.rdg-container{
  max-width: 1120px;
  margin: 0 auto;
  padding: 0 18px;
}

/* GRID de mockups (separación + responsive) */
#imagenes .rdg-mockups-grid{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin-top: 18px;
}

/* Tarjetas */
#imagenes .rdg-mockup-card{
  margin: 0;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.04);
  border-radius: 16px;
  overflow: hidden;
}

/* Imagen bien escalada */
#imagenes .rdg-mockup-card img{
  width: 100%;
  height: auto;
  display: block;
}

/* Texto abajo */
#imagenes .rdg-mockup-card figcaption{
  padding: 12px 12px 14px;
  font-size: 14px;
  color: rgba(255,255,255,.92);
  border-top: 1px solid rgba(255,255,255,.08);
}

/* Tablet: 2 columnas */
@media (max-width: 980px){
  #imagenes .rdg-mockups-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Cel: 1 columna */
@media (max-width: 640px){
  #imagenes .rdg-mockups-grid{
    grid-template-columns: 1fr;
  }
}/* End custom CSS */