/**
Theme Name: Oceges
Author: Oceges
Author URI: https://oceges.com/
Description: Astra child theme by oceges
Version: 1.26.5
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: oceges
Template: astra
*/

/* =============== */
/* Texto Gradient */
.texto-gradiente {
    background: #6366F1;
    background: linear-gradient(to right, #6366F1 0%, #C25CF5 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text; /* Propiedad estándar por compatibilidad */
    text-fill-color: transparent;
}

.texto-gradiente-morado {
    background: #6366F1;
    background: linear-gradient(to right, #6B5CF6 0%, #4F46E5 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text; /* Propiedad estándar por compatibilidad */
    text-fill-color: transparent;
}

/* Titulos gradient Lila, este es el que no se nota mucho el gradient */
.texto-gradient {
  background: linear-gradient(90deg, #6B5CF6 0%, #4F46E5 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  display: inline-block;
}

/* =============== */
/* Boton Gradient */
/* Color en estado normal */
.btn-gradient .elementor-button {
   /* background: linear-gradient(to right, #6366F1, #C25CF5) !important; */
 	background: linear-gradient(
        90deg,
        #6366F1 0%,
        #6B66F1 7.14%,
        #7366F2 14.28%,
        #7A66F2 21.42%,
        #8165F2 28.56%,
        #8865F3 35.70%,
        #8F64F3 42.84%,
        #9564F3 49.98%,
        #9C63F3 57.12%,
        #A362F4 64.26%,
        #A961F4 71.40%,
        #AF60F4 78.54%,
        #B65FF4 85.68%,
        #BC5DF5 92.82%,
        #C25CF5 100%
    ) !important;
}

/* Color al pasar el ratón (Hover) */
.btn-gradient .elementor-button:hover {
   /*  background: linear-gradient(to right, #C25CF5, #6366F1) !important; */
	background: linear-gradient(
        90deg,
        #6366F1 0%,
        #C25CF5 100%
    ) !important;
}

/* ====================== */

/* Boton Gradient Header */
/* Color en estado normal para el botón del Header */
.ast-custom-button-link .ast-custom-button {
    /*background: linear-gradient(to right, #6366F1, #C25CF5) !important; */
	    background: linear-gradient(
        90deg,
        #6366F1 0%,
        #6B66F1 7.14%,
        #7366F2 14.28%,
        #7A66F2 21.42%,
        #8165F2 28.56%,
        #8865F3 35.70%,
        #8F64F3 42.84%,
        #9564F3 49.98%,
        #9C63F3 57.12%,
        #A362F4 64.26%,
        #A961F4 71.40%,
        #AF60F4 78.54%,
        #B65FF4 85.68%,
        #BC5DF5 92.82%,
        #C25CF5 100%
    ) !important;
    color: #ffffff !important; /* Asegura que el texto sea blanco */
}

/* Color al pasar el ratón (Hover) para el botón del Header */
.ast-custom-button-link:hover .ast-custom-button {
    /*background: linear-gradient(to right, #C25CF5, #6366F1) !important;*/
	background: linear-gradient(
        90deg,
        #6366F1 0%,
        #C25CF5 100%
    ) !important;
} 

/*Botó Degradado 2 */
.boton-degradado {
  background: linear-gradient(90deg, #6B5CF6 0%, #4F46E5 100%);
  color: #fff;
  border: none;
  border-radius: 12px;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.25s ease;
}



/*fondo bloques gradient  Color Banner oscuro */
.banner-oscuro {
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(rgba(0, 0, 0, 0.20), rgba(0, 0, 0, 0.20)),
    linear-gradient(rgba(5, 32, 109, 0.10), rgba(5, 32, 109, 0.10)),
    linear-gradient(to right, #05206D, #1A1535);
}
/* Fondo CTA */
.banner-fondo {
  background:
    radial-gradient(
      circle at 50% 85%,
      rgba(110, 86, 255, 0.18) 0%,
      rgba(110, 86, 255, 0.10) 18%,
      rgba(110, 86, 255, 0.04) 32%,
      rgba(110, 86, 255, 0) 55%
    ),
    linear-gradient(
      90deg,
      rgba(18, 20, 52, 1) 0%,
      rgba(28, 24, 73, 1) 50%,
      rgba(20, 18, 60, 1) 100%
    );
}

/*fondo hero linear gradient */
.fondo-linear-gradient{
    position: absolute;
    width: 800px;
    height: 400px;
    top: -100px;
    left: 50%;
    transform: translateX(-50%);
    border-radius: 50%;
    background: linear-gradient(
        90deg,
        rgba(99, 102, 241, 0.10),
        rgba(194, 92, 245, 0.10)
    );
    filter: blur(100px);
    pointer-events: none;
}


/*** Mega menú: estados visuales ***/
/* Caja activa */
.mega-funcionalidad.is-active {
  background-color: #F0EEFF;
  border: 1px solid #6B5CF633;
  border-radius: 12px;
  padding: 10px 12px;
}

/* Textos activos */
.mega-funcionalidad.is-active .elementor-icon-box-title,
.mega-funcionalidad.is-active .elementor-icon-box-title a,
.mega-funcionalidad.is-active .elementor-icon-box-description {
  color: #6B5CF6 !important;
}

.mega-funcionalidad .elementor-icon-box-icon {
  flex: 0 0 auto;
  width: auto;
  margin: 0;
}

/* Fondo normal del icono */
.mega-funcionalidad .elementor-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  padding: 10px;
  background-color: #F3F4F6;
  border-radius: 10px;
  box-sizing: border-box;
}

/* Fondo activo del icono */
.mega-funcionalidad.is-active .elementor-icon {
  background-color: #6B5CF633;
}

/* Color normal: elementos con stroke */
.mega-funcionalidad
  .elementor-icon
  svg
  [stroke]:not([stroke="none"]) {
  stroke: #9CA3AF !important;
}

/* Color normal: elementos con fill */
.mega-funcionalidad
  .elementor-icon
  svg
  [fill]:not([fill="none"]) {
  fill: #9CA3AF !important;
}

/* Color activo: elementos con stroke */
.mega-funcionalidad.is-active
  .elementor-icon
  svg
  [stroke]:not([stroke="none"]) {
  stroke: #6B5CF6 !important;
}

/* Color activo: elementos con fill */
.mega-funcionalidad.is-active
  .elementor-icon
  svg
  [fill]:not([fill="none"]) {
  fill: #6B5CF6 !important;
}

/* Hover para enlaces en página integraciones */
.elementor-heading-title a{
    color: inherit;
    text-decoration: none;
    position: relative;
}

.elementor-heading-title a::after{
    content: "";
    position: absolute;
    left: 0;
    bottom: -3px;
    width: 100%;
    height: 2px;
    background: #6B5CF6;

    transform: scaleX(0);
    transform-origin: left;
    transition: transform .3s ease;
}

.elementor-heading-title a:hover::after{
    transform: scaleX(1);
}

/* Ajustar los parrafos y evitar que queden palabras sueltas*/
p {
    text-wrap: pretty;
    hyphens: auto;
}

h1,
h2,
h3 {
    text-wrap: balance;
}