.elementor-4946 .elementor-element.elementor-element-06dd045:not(.elementor-motion-effects-element-type-background), .elementor-4946 .elementor-element.elementor-element-06dd045 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#201F21;}.elementor-4946 .elementor-element.elementor-element-06dd045 > .elementor-background-overlay{opacity:0.5;transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-4946 .elementor-element.elementor-element-06dd045{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;margin-top:-2px;margin-bottom:-2px;}.elementor-4946 .elementor-element.elementor-element-06dd045 > .elementor-shape-top svg{height:68px;}.elementor-4946 .elementor-element.elementor-element-06dd045 > .elementor-shape-top{z-index:2;pointer-events:none;}.elementor-4946 .elementor-element.elementor-element-06dd045 > .elementor-shape-bottom svg{height:68px;}.elementor-4946 .elementor-element.elementor-element-06dd045 > .elementor-shape-bottom{z-index:2;pointer-events:none;}.elementor-4946 .elementor-element.elementor-element-b89b869 > .elementor-element-populated{margin:49px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;}.elementor-4946 .elementor-element.elementor-element-7c227c2{width:var( --container-widget-width, 99.821% );max-width:99.821%;--container-widget-width:99.821%;--container-widget-flex-grow:0;}.elementor-4946 .elementor-element.elementor-element-ae188b2 > .elementor-container{min-height:384px;}.elementor-4946 .elementor-element.elementor-element-ae188b2:not(.elementor-motion-effects-element-type-background), .elementor-4946 .elementor-element.elementor-element-ae188b2 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#040F27;}.elementor-4946 .elementor-element.elementor-element-ae188b2 > .elementor-background-overlay{opacity:0.5;transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-4946 .elementor-element.elementor-element-ae188b2{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;}.elementor-4946 .elementor-element.elementor-element-0ee09ca > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;}.elementor-4946 .elementor-element.elementor-element-42327d8 .elementor-active .elementor-accordion-icon, .elementor-4946 .elementor-element.elementor-element-42327d8 .elementor-active .elementor-accordion-title{color:#496CB9;}.elementor-4946 .elementor-element.elementor-element-42327d8 .elementor-active .elementor-accordion-icon svg{fill:#496CB9;}.elementor-4946 .elementor-element.elementor-element-42327d8 .elementor-accordion-title{font-family:"Barlow", Sans-serif;font-weight:600;}.elementor-4946 .elementor-element.elementor-element-42327d8 .elementor-tab-title .elementor-accordion-icon i:before{color:#3F43ED;}.elementor-4946 .elementor-element.elementor-element-42327d8 .elementor-tab-title .elementor-accordion-icon svg{fill:#3F43ED;}.elementor-4946 .elementor-element.elementor-element-42327d8 .elementor-tab-content{color:#FEFEFE;font-family:"Jost", Sans-serif;font-size:20px;font-weight:400;}.elementor-4946 .elementor-element.elementor-element-42327d8 > .elementor-widget-container{padding:0px 0px 0px 0px;--e-transform-rotateZ:-360deg;}.elementor-4946 .elementor-element.elementor-element-15a9bf2{margin-top:0px;margin-bottom:0px;padding:0px 0px 0px 0px;}.elementor-4946 .elementor-element.elementor-element-e358e68 > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:0px 0px 0px 0px;}.elementor-4946 .elementor-element.elementor-element-6616f90 iframe{height:300px;}@media(min-width:768px){.elementor-4946 .elementor-element.elementor-element-0ee09ca{width:100%;}}/* Start custom CSS for html, class: .elementor-element-7c227c2 *//* --- Títulos centrados --- */
.section-title {
  text-align: center;
  margin-bottom: 40px;
}

.section-title h2 {
  font-family: 'Barlow', sans-serif;
  font-size: 32px;
  font-weight: 700;
  color: #fff;
  margin-bottom: 8px;
  position: relative;
  display: inline-block;
  padding-bottom: 6px;
}

.section-title h2::after {
  content: "";
  display: block;
  width: 60%;
  height: 3px;
  background: #4069DE;
  margin: 6px auto 0;
  border-radius: 2px;
}

.section-title p {
  font-family: 'Jost', sans-serif;
  font-size: 16px;
  color: #d1d5db;
  margin: 0;
}

/* --- Contenedor principal --- */
#contacto {
  background-color: #1d2128;
  padding: 60px 20px;
  max-width: 1200px;
  margin: 0 auto;
  font-family: 'Jost', sans-serif;
}

/* --- Distribución columnas --- */
.contacto-contenido {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 40px;
  flex-wrap: wrap;
}

/* --- Columna izquierda (iconos) --- */
.left-column {
  flex: 1 1 40%;
  min-width: 280px;
}

.info-box {
  background: #ffffff;
  padding: 18px;
  border-radius: 6px;
  box-shadow: 0px 3px 8px rgba(0,0,0,0.15);
  text-align: center;
  margin-bottom: 20px;
  transition: transform 0.3s ease;
}

.info-box:hover {
  transform: translateY(-5px);
}

.info-box i {
  font-size: 26px;
  color: #4069DE;
  margin-bottom: 8px;
}

.info-box h4 {
  font-family: 'Barlow', sans-serif;
  font-size: 15px;
  font-weight: 600;
  margin-bottom: 6px;
}

/* --- Columna derecha (formulario) --- */
.form-box {
  flex: 1 1 55%;
  min-width: 320px;
  background: #4069DE;
  padding: 30px;
  border-radius: 6px;
  box-shadow: 0px 3px 8px rgba(0,0,0,0.2);
}

.form-box h3 {
  font-family: 'Barlow', sans-serif;
  font-size: 22px;
  margin-bottom: 18px;
  color: #fff;
}

.form-box input,
.form-box textarea {
  width: 100%;
  padding: 10px 14px;
  margin-bottom: 12px;
  border: none;
  border-radius: 3px;
  font-size: 14px;
  font-family: 'Jost', sans-serif;
}

.form-box button {
  background: #fff;
  color: #4069DE;
  padding: 10px 20px;
  border: none;
  border-radius: 3px;
  font-size: 14px;
  font-weight: bold;
  cursor: pointer;
  transition: 0.3s;
  font-family: 'Barlow', sans-serif;
}

.form-box button:hover {
  background: #217dbb;
  color: #fff;
} 
/* Botón ENVIAR - modelo gradiente moderno */
.form-box button {
  background: linear-gradient(135deg, #4069DE, #5fa8ff);
  color: #fff;
  font-family: 'Barlow', sans-serif;
  font-size: 15px;
  font-weight: bold;
  padding: 12px 28px;
  border: none;
  border-radius: 30px;
  cursor: pointer;
  text-transform: uppercase;
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(64, 105, 222, 0.4);
}

.form-box button:hover {
  background: linear-gradient(135deg, #3052b8, #4b90e2);
  box-shadow: 0 6px 20px rgba(64, 105, 222, 0.7);
  transform: translateY(-2px) scale(1.03);
}

/* --- Responsive --- */
@media (max-width: 991px) {
  .contacto-contenido {
    flex-direction: column;
    gap: 30px;
  }
}

/* --- Celulares pequeños (pantallas muy chicas) --- */
@media (max-width: 576px) {
  .contacto-contenido {
    gap: 20px;
    padding: 0 15px; /* margen lateral para que no pegue con los bordes */
  }
}/* End custom CSS */
/* Start custom CSS for section, class: .elementor-element-06dd045 *//* Campos de texto y textarea */
#wpforms-5062 .wpforms-field input,
#wpforms-5062 .wpforms-field textarea {
  width: 100%;
  padding: 10px 14px;
  margin-bottom: 12px;
  border: none;
  border-radius: 3px;
  font-size: 14px;
  font-family: 'Jost', sans-serif;
}

/* Botón enviar */
#wpforms-5062 .wpforms-submit,
#wpforms-5062 .wpforms-submit[type="submit"] {
  background: linear-gradient(135deg, #4069DE, #5fa8ff);
  color: #fff;
  font-family: 'Barlow', sans-serif;
  font-size: 15px;
  font-weight: bold;
  padding: 12px 28px;
  border: none;
  border-radius: 30px;
  cursor: pointer;
  text-transform: uppercase;
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(64, 105, 222, 0.4);
}

#wpforms-5062 .wpforms-submit:hover,
#wpforms-5062 .wpforms-submit[type="submit"]:hover {
  background: linear-gradient(135deg, #3052b8, #4b90e2);
  box-shadow: 0 6px 20px rgba(64, 105, 222, 0.7);
  transform: translateY(-2px) scale(1.03);
}/* End custom CSS */
/* Start custom CSS for column, class: .elementor-element-0ee09ca *//* === CONTENEDOR MATRIX === */
.mi-acordeon .elementor-accordion-item {
  position: relative;
  margin-bottom: 25px;
  border-radius: 10px;
  overflow: hidden;
  background: rgba(5, 10, 25, 0.95);
  border: 2px solid rgba(64,105,222,0.6);
  box-shadow: 0 0 25px rgba(64,105,222,0.3);
  backdrop-filter: blur(8px);
  transition: all 0.5s ease;
}
.mi-acordeon .elementor-accordion-item:hover {
  box-shadow: 0 0 35px rgba(64,105,222,0.9),
              inset 0 0 20px rgba(64,105,222,0.4);
  transform: translateY(-4px) scale(1.02);
}

/* === LLUVIA DE CODIGO BINARIO === */
.mi-acordeon .elementor-accordion-item::before {
  content: "010101010101";
  position: absolute;
  inset: 0;
  font-family: monospace;
  font-size: 12px;
  line-height: 14px;
  color: rgba(64,105,222,0.15);
  text-shadow: 0 0 8px rgba(64,105,222,0.5);
  animation: matrixRain 10s linear infinite;
  white-space: pre;
  overflow: hidden;
}
@keyframes matrixRain {
  from { transform: translateY(-100%); }
  to { transform: translateY(100%); }
}

/* === CHISPA ELECTRICA EN LOS BORDES === */
.mi-acordeon .elementor-accordion-item::after {
  content: "";
  position: absolute;
  top: 0; left: -50%;
  width: 200%; height: 2px;
  background: linear-gradient(90deg, transparent, #4069DE, transparent);
  animation: electricSpark 3s infinite linear;
}
@keyframes electricSpark {
  0% { transform: translateX(-100%); }
  100% { transform: translateX(100%); }
}

/* === TITULO ESTILO CONSOLA === */
.mi-acordeon .elementor-tab-title {
  font-family: 'Barlow', monospace;
  font-size: 18px;
  font-weight: 600;
  color: #00eaff;
  padding: 20px 24px;
  cursor: pointer;
  position: relative;
  z-index: 2;
  letter-spacing: 1px;
  overflow: hidden;
}
.mi-acordeon .elementor-tab-title::after {
  content: "_";
  margin-left: 2px;
  animation: blinkCursor 1s infinite step-start;
}
@keyframes blinkCursor {
  50% { opacity: 0; }
}

/* Glitch al pasar */
.mi-acordeon .elementor-tab-title:hover {
  color: #4069DE;
  text-shadow: 0 0 10px #4069DE, 0 0 30px #6f8cff;
  animation: glitchTitle 0.5s steps(2, end) infinite;
}
@keyframes glitchTitle {
  0% { transform: skew(0deg); }
  20% { transform: skew(-10deg); }
  40% { transform: skew(10deg); }
  60% { transform: skew(-5deg); }
  80% { transform: skew(5deg); }
  100% { transform: skew(0deg); }
}

/* === ICONO DIGITAL === */
.mi-acordeon .elementor-accordion-icon i {
  font-size: 22px;
  color: #4069DE;
  text-shadow: 0 0 15px #4069DE;
  transition: transform 0.5s ease;
}
.mi-acordeon .elementor-tab-title.elementor-active .elementor-accordion-icon i {
  transform: rotate(180deg) scale(1.2);
  color: #00eaff;
}

/* === CONTENIDO CON EFECTO HACK === */
.mi-acordeon .elementor-tab-content {
  font-family: 'Jost', sans-serif;
  font-size: 15px;
  line-height: 1.7;
  color: #dce6f5;
  background: rgba(10, 20, 40, 0.95);
  padding: 22px 26px;
  border-radius: 0 0 18px 18px;
  animation: hackIn 0.7s ease;
}
@keyframes hackIn {
  0% { opacity: 0; transform: scale(0.9) skewX(15deg); filter: blur(5px); }
  50% { opacity: 0.6; transform: scale(1.05) skewX(-10deg); filter: blur(2px); }
  100% { opacity: 1; transform: scale(1) skewX(0); filter: blur(0); }
}

/* === CONTENEDOR ALINEADO A LA IZQUIERDA === */
.mi-acordeon {
  max-width: 1200px;   /* ancho fijo */
  margin: 0;
  margin-left: 87px;   /* lo fija a la izquierda */
  text-align: left;
}

/* Títulos y contenido alineados a la izquierda */
.mi-acordeon .elementor-tab-title,
.mi-acordeon .elementor-tab-content {
  text-align: left;
}

/* ===================== */
/* === RESPONSIVE ====== */
/* ===================== */

/* --- Tablets y laptops pequeños (≤ 991px) --- */
@media (max-width: 991px) {
  .mi-acordeon {
    max-width: 95%;
  }
  .mi-acordeon .elementor-tab-title {
    font-size: 16px;
  }
  .mi-acordeon .elementor-tab-content {
    font-size: 14px;
  }
}

/* --- Celulares grandes (≤ 768px) --- */
@media (max-width: 768px) {
  .mi-acordeon {
    max-width: 100%;
  }
  .mi-acordeon .elementor-tab-title {
    font-size: 15px;
  }
  .mi-acordeon .elementor-tab-content {
    font-size: 13px;
  }
  .mi-acordeon .elementor-accordion-icon i {
    font-size: 20px;
  }
}

/* --- Celulares pequeños (≤ 576px) --- */
@media (max-width: 576px) {
  .mi-acordeon {
    max-width: 100%;
    padding: 0 10px;
  }
  .mi-acordeon .elementor-tab-title {
    font-size: 14px;
  }
  .mi-acordeon .elementor-tab-content {
    font-size: 12px;
  }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-f52441b *//* --- Estilos para WPForms dentro de #contacto --- */
#contacto .wpforms-container {
  flex: 1 1 55%;
  min-width: 320px;
  background: #4069DE;
  padding: 30px;
  border-radius: 6px;
  box-shadow: 0px 3px 8px rgba(0,0,0,0.2);
  font-family: 'Jost', sans-serif;
}

/* Título del formulario */
#contacto .wpforms-container .wpforms-title {
  font-family: 'Barlow', sans-serif;
  font-size: 22px;
  margin-bottom: 18px;
  color: #fff;
  text-align: left;
}

/* Inputs y textarea */
#contacto .wpforms-container input[type="text"],
#contacto .wpforms-container input[type="email"],
#contacto .wpforms-container input[type="tel"],
#contacto .wpforms-container textarea {
  width: 100%;
  padding: 10px 14px;
  margin-bottom: 12px;
  border: none;
  border-radius: 3px;
  font-size: 14px;
  font-family: 'Jost', sans-serif;
}

/* Botón enviar */
#contacto .wpforms-container .wpforms-submit {
  background: linear-gradient(135deg, #4069DE, #5fa8ff);
  color: #fff;
  font-family: 'Barlow', sans-serif;
  font-size: 15px;
  font-weight: bold;
  padding: 12px 28px;
  border: none;
  border-radius: 30px;
  cursor: pointer;
  text-transform: uppercase;
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(64, 105, 222, 0.4);
  margin-top: -10px; /* 🔹 Ajusta la altura del botón */
}

#contacto .wpforms-container .wpforms-submit:hover {
  background: linear-gradient(135deg, #3052b8, #4b90e2);
  box-shadow: 0 6px 20px rgba(64, 105, 222, 0.7);
  transform: translateY(-2px) scale(1.03);
}

/* Ocultar etiquetas si quieres un look más limpio */
#contacto .wpforms-container .wpforms-field-label {
  display: none;
}

/* --- Responsive --- */
@media (max-width: 991px) {
  #contacto .wpforms-container {
    width: 100%;
  }
}/* End custom CSS */