.elementor-kit-6{--e-global-color-primary:#0D1C22;--e-global-color-secondary:#54595F;--e-global-color-text:#FFFFFF;--e-global-color-accent:#61CE70;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;background-color:#0C1117;}.elementor-kit-6 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* 1) Asegurar que el centro pueda crecer en flex */
.service-item .service-content{
  min-width: 0 !important;
}

/* 2) Quitar cualquier ellipsis que venga del tema o Elementor */
.service-item .service-content,
.service-item .service-content *{
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: unset !important;
}

/* 3) Caso específico: si Elementor pone clamp/ellipsis en el widget */
.service-item .service-content p,
.service-item .service-content .elementor-widget-container,
.service-item .service-content .elementor-text-editor{
  overflow: visible !important;
  text-overflow: unset !important;
  white-space: normal !important;
}
/* ===============================
   SERVICES – HOVER FX FINAL
   =============================== */

/* Fila base */
.service-item{
  position: relative;
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 40px 24px;
  border-bottom: 1px solid rgba(255,255,255,0.08);
  cursor: pointer;
  overflow: hidden;
}

/* Columnas laterales fijas */
.service-icon,
.service-arrow{
  flex: 0 0 90px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Centro flexible */
.service-content{
  flex: 1 1 auto;
  min-width: 0;
}

/* Imagen de fondo (oculta) */
.service-item::before{
  content:"";
  position:absolute;
  inset:0;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center 0%;
  opacity: 0;
  transform: scale(1.08);
  transition:
    opacity 0.45s ease,
    transform 0.65s ease,
    background-position 1.2s ease;
  z-index: 0;
}

/* Overlay oscuro */
.service-item::after{
  content:"";
  position:absolute;
  inset:0;
  background: rgba(0,0,0,0.58);
  opacity: 0;
  transition: opacity 0.35s ease;
  z-index: 1;
}

/* Hover activo */
.service-item:hover::before{
  opacity: 1;
  transform: scale(1.02);
  background-position: center 100%;
}

.service-item:hover::after{
  opacity: 1;
}

/* Contenido encima del fondo */
.service-item > *{
  position: relative;
  z-index: 2;
}

/* Texto sin recortes */
.service-content p{
  margin: 0;
  white-space: normal;
  overflow: visible;
}

/* Flecha animada */
.service-arrow{
  transition: transform 0.3s ease;
}

.service-item:hover .service-arrow{
  transform: translateX(6px);
}
.service-1::before{
  background-image:url('http://applesorangesmedia.com/wp-content/uploads/2026/01/image-hover-01.webp');
}

.service-2::before{
  background-image:url('http://applesorangesmedia.com/wp-content/uploads/2026/01/image-hover-02.webp');
}

.service-3::before{
  background-image:url('http://applesorangesmedia.com/wp-content/uploads/2026/01/image-hover-03.webp');
}
.service-4::before{
  background-image:url('http://applesorangesmedia.com/wp-content/uploads/2026/01/image-hover-04.webp');
}

.service-5::before{
  background-image:url('http://applesorangesmedia.com/wp-content/uploads/2026/01/image-hover-05.webp');
}

.service-6::before{
  background-image:url('http://applesorangesmedia.com/wp-content/uploads/2026/01/image-hover-06.webp');
}
.service-7::before{
  background-image:url('http://applesorangesmedia.com/wp-content/uploads/2026/01/image-hover-07.webp');
}

.service-8::before{
  background-image:url('http://applesorangesmedia.com/wp-content/uploads/2026/01/image-hover-08.webp');
}

.service-9::before{
  background-image:url('http://applesorangesmedia.com/wp-content/uploads/2026/01/image-hover-09.webp');
}
.service-10::before{
  background-image:url('http://applesorangesmedia.com/wp-content/uploads/2026/01/image-hover-010.webp');
}
.service-11::before{
  background-image:url('http://applesorangesmedia.com/wp-content/uploads/2026/01/image-hover-011.webp');
}

.service-12::before{
  background-image:url('http://applesorangesmedia.com/wp-content/uploads/2026/01/image-hover-012.webp');
}

/* Luego repites hasta service-12 */
.hero-results{
  background: linear-gradient(90deg, #1e90ff 0%, #4cff6a 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent !important;
}
/* RESULTS gradient - Elementor safe */
.hero-results .elementor-heading-title{
  background: linear-gradient(90deg, #1e90ff 0%, #4cff6a 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;
  opacity: 1 !important;
  filter: none !important;
  text-shadow: none !important;
}
/* Sección */
.brand-section{
  padding: 90px 0;
}

/* Título centrado */
.brand-heading{
  text-align: center;
}

/* Degradado para “BRAND” */
.brand-gradient{
  background: linear-gradient(90deg, #1e90ff 0%, #4cff6a 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}/* End custom CSS */