:root {
  --e-global-color-primary: #0F172A;
  --e-global-color-secondary: #334155;
  --e-global-color-text: #020617;
  --e-global-color-accent: #0369A1;
}

body {
  font-family: 'Source Sans 3', sans-serif;
  color: #020617;
  background-color: #F8FAFC;
}

h1, h2, h3, h4, h5, h6,
.elementor-heading-title {
  font-family: 'Lexend', sans-serif;
  color: #0F172A;
}

a {
  color: #0369A1;
}

.elementor-button,
button,
input[type="submit"] {
  background-color: #0369A1 !important;
  border-color: #0369A1 !important;
  color: #FFFFFF !important;
  transition: background-color 200ms ease, border-color 200ms ease;
}

.elementor-button:hover,
button:hover,
input[type="submit"]:hover {
  background-color: #0F172A !important;
  border-color: #0F172A !important;
}

.elementor-widget-container .elementor-icon-box-wrapper,
.elementor-widget-container .elementor-widget-wrap {
  --e-global-color-primary: #0F172A;
}

::selection {
  background-color: #0369A1;
  color: #FFFFFF;
}

.innovap-newsletter-fallback-cta {
  display: inline-block;
  padding: 12px 24px;
  background-color: #25D366;
  color: #FFFFFF !important;
  border-radius: 6px;
  font-family: 'Source Sans 3', sans-serif;
  font-weight: 600;
  text-decoration: none;
  transition: background-color 200ms ease;
}

.innovap-newsletter-fallback-cta:hover {
  background-color: #1DA851;
}

/* Fondos e-home: alterna secciones + textura sutil, sin tocar estructura/DOM */
/* El hero (07fe42a) ya trae su propio fondo oscuro (gradiente navy + grid) definido
   en el CSS de Elementor de esta pagina con mayor especificidad -- no lo tocamos,
   solo ajustamos el color del texto para que contraste bien sobre ese fondo. */

.elementor-element-3b34e7b,
.elementor-element-8794a9b {
  background: linear-gradient(180deg, #FFFFFF 0%, #F1F5F9 100%) !important;
}

.elementor-element-9479030,
.elementor-element-425a1bf {
  background:
    radial-gradient(circle at 90% 10%, rgba(0, 102, 255, 0.06), transparent 40%),
    #FFFFFF !important;
}

.elementor-element-328c91c {
  background: #EEF2F7 !important;
  border-top: 1px solid #E2E8F0;
  border-bottom: 1px solid #E2E8F0;
}

.elementor-element-328c91c img {
  filter: grayscale(20%);
  opacity: 0.9;
  transition: opacity 200ms ease, filter 200ms ease;
}

.elementor-element-328c91c img:hover {
  filter: grayscale(0%);
  opacity: 1;
}

.elementor-element-328c91c .elementor-heading-title {
  font-size: clamp(1.75rem, 1.4rem + 1.5vw, 2.5rem);
  font-weight: 700;
  text-align: center;
  margin-bottom: 32px;
}

/* Logos: marquee infinito, contenido duplicado via JS para el loop */
.innovap-brand-marquee-viewport {
  overflow: hidden;
  width: 100%;
}

.innovap-brand-marquee-track {
  display: flex;
  flex-wrap: nowrap;
  width: max-content;
  animation: innovap-marquee 25s linear infinite;
}

.innovap-brand-marquee-track:hover {
  animation-play-state: paused;
}

.innovap-brand-marquee-track .elementor-widget-image {
  flex-shrink: 0;
  margin: 0 32px;
  display: flex;
  align-items: center;
}

.innovap-brand-marquee-track .elementor-widget-image img {
  height: 48px;
  width: auto;
  max-width: none;
}

@keyframes innovap-marquee {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-50%);
  }
}

/* Titulos: mas jerarquia y caracter, sin cambiar el markup */
.elementor-heading-title {
  letter-spacing: -0.01em;
  font-weight: 600;
  line-height: 1.2;
}

/* Fondo real del hero es oscuro (navy + grid azul) -- texto claro para contraste real */
.elementor-element-25adc73 .elementor-heading-title {
  font-weight: 700;
  letter-spacing: -0.02em;
  color: #FFFFFF;
  text-shadow: 0 2px 20px rgba(0, 102, 255, 0.35);
}

.elementor-element-43ed9d8 {
  color: #E2E8F0 !important;
}

.elementor-element-552c703 .elementor-heading-title {
  color: #7DD3FC;
  letter-spacing: 0.08em;
  font-size: 0.85em;
}

.elementor-widget-heading .elementor-heading-title {
  position: relative;
}

.elementor-element-3b34e7b .elementor-heading-title,
.elementor-element-9479030 .elementor-heading-title,
.elementor-element-8794a9b .elementor-heading-title,
.elementor-element-425a1bf .elementor-heading-title {
  padding-left: 16px;
  border-left: 4px solid #0369A1;
}

/* Estos 2 titulos usan la variable global de Elementor --e-global-color-58be983,
   que esta fijada en blanco (#ffffff) en el kit del sitio -- pensada para un fondo
   oscuro que esta seccion ya no tiene. Se fuerza a navy para que se lean. */
.elementor-element-52cf47c .elementor-heading-title,
.elementor-element-ffc2b31 .elementor-heading-title {
  color: #0F172A !important;
}

/* Carrusel de trabajos reales (inyectado via JS, no toca el contenido de Elementor) */
.innovap-work-carousel-section {
  max-width: 1140px;
  margin: 56px auto;
  padding: 0 24px;
}

.innovap-work-carousel-title {
  font-family: 'Lexend', sans-serif;
  font-weight: 700;
  font-size: 1.75rem;
  color: #0F172A;
  text-align: center;
  margin-bottom: 24px;
  letter-spacing: -0.01em;
}

.innovap-work-carousel {
  position: relative;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.15);
  background: #0F172A;
}

.innovap-work-carousel-track {
  display: flex;
  transition: transform 500ms ease;
}

.innovap-work-carousel-slide {
  min-width: 100%;
}

.innovap-work-carousel-media {
  position: relative;
  aspect-ratio: 16 / 9;
  background: #0F172A;
}

.innovap-work-carousel-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.innovap-work-carousel-caption {
  padding: 14px 20px;
  background: #0F172A;
  color: #FFFFFF;
  font-family: 'Source Sans 3', sans-serif;
  font-weight: 600;
  text-align: center;
}

.innovap-work-carousel-prev,
.innovap-work-carousel-next {
  position: absolute;
  top: calc(50% - 20px);
  background: rgba(255, 255, 255, 0.85);
  border: none;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  cursor: pointer;
  font-size: 16px;
  color: #0F172A;
  transition: background-color 200ms ease;
}

.innovap-work-carousel-prev:hover,
.innovap-work-carousel-next:hover {
  background: #FFFFFF;
}

.innovap-work-carousel-prev {
  left: 16px;
}

.innovap-work-carousel-next {
  right: 16px;
}

.innovap-work-carousel-dots {
  display: flex;
  justify-content: center;
  gap: 8px;
  padding: 14px 0;
  background: #0F172A;
}

.innovap-work-carousel-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  border: none;
  background: rgba(255, 255, 255, 0.4);
  cursor: pointer;
  padding: 0;
  transition: background-color 200ms ease, width 200ms ease;
}

.innovap-work-carousel-dot.is-active {
  background: #FFFFFF;
  width: 20px;
  border-radius: 4px;
}