/* ──────────────────────────────────────────────────────────────────────────
   Overrides propios del proyecto (cargados DESPUÉS del CSS de Elementor).
   ────────────────────────────────────────────────────────────────────────── */

/* Navegación por anclas (sitio de una sola página).
   - Desplazamiento suave al pulsar los enlaces del menú/hero/footer.
   - scroll-margin-top: las secciones tienen un header fijo (~62px) encima, así
     que reservamos margen para que su inicio no quede tapado al saltar al ancla. */
html {
  scroll-behavior: smooth;
}
#inicio,
#nosotros,
#servicios,
#contacto {
  scroll-margin-top: 80px;
}

/* Los ítems del menú ahora son enlaces <a> (antes <div>). Evitar que el
   subrayado global de WordPress (a { text-decoration: underline }) los afecte;
   el color e interacción siguen gestionados por el CSS del mega-menú. */
.e-n-menu-title,
.e-n-menu-title:hover,
.e-n-menu-title:focus {
  text-decoration: none;
}

/* Mensaje de respuesta del formulario de contacto (envío vía /send.php). */
.efw-message {
  margin-top: 14px;
  padding: 12px 16px;
  border-radius: 4px;
  font-family: "Source Sans 3", Sans-serif;
  font-size: 0.9375rem;
  line-height: 1.4;
}
.efw-message--success {
  background: #e7f6ec;
  color: #1d6b3a;
  border: 1px solid #b6e2c4;
}
.efw-message--error {
  background: #fdecec;
  color: #a12626;
  border: 1px solid #f3c2c2;
}

/* Fix: el menú del header aplicaba un `border-bottom: 2px` en :hover y en el
   ítem activo (.e-current). Como el borde forma parte de la caja, al pasar el
   ratón el ítem crecía 2px y desplazaba el header (layout shift).

   Solución: anular ese borde y dibujar la misma línea inferior con un
   `box-shadow` inset, que NO ocupa espacio en el modelo de caja. Visualmente
   queda idéntico, pero la altura del nav permanece constante en reposo y en
   hover. Se replican los selectores exactos de Elementor para ganar en la
   cascada por orden de carga (misma especificidad, esta hoja va después). */

.elementor-15 .elementor-element.elementor-element-63881a3 > .e-n-menu > .e-n-menu-wrapper > .e-n-menu-heading > .e-n-menu-item > .e-n-menu-title:hover:not( .e-current ) {
  border-width: 0;
  box-shadow: inset 0 -2px 0 0 var( --e-global-color-accent );
}

.elementor-15 .elementor-element.elementor-element-63881a3 > .e-n-menu > .e-n-menu-wrapper > .e-n-menu-heading > .e-n-menu-item > .e-n-menu-title.e-current {
  border-width: 0;
  box-shadow: inset 0 -2px 0 0 var( --e-global-color-eaf5e7b );
}

/* Franja de crédito del footer ("Diseñado por Emprende.cl").
   Aspecto más minimalista: texto fino y tenue en lugar del blanco en negrita,
   barra más slim, y enlace discreto que se tiñe de acento al hacer hover. */

/* Padding vertical de la barra = 3px arriba/abajo.
   La única fuente de padding vertical es el sistema de variables de Elementor:
   `.e-con` define --padding-top/--padding-bottom (10px por defecto), que vía
   --padding-block-start/end aplica `.e-con > .e-con-inner`. Lo reducimos en el
   origen sobreescribiendo esas variables, así no queda ninguna otra regla de
   padding compitiendo (no hay override físico adicional). El padding horizontal
   se mantiene como en el diseño original. */
.elementor-24 .elementor-element.elementor-element-ddfcbb0 {
  --padding-top: 3px;
  --padding-bottom: 3px;
}
.elementor-24 .elementor-element.elementor-element-4b9c202 {
  font-weight: 400;
  font-size: 0.8125rem;       /* 13px */
  letter-spacing: 0.03em;
  color: rgba(255, 255, 255, 0.6);
}
.elementor-24 .elementor-element.elementor-element-4b9c202 a {
  color: rgba(255, 255, 255, 0.85);
  text-decoration: none;
  transition: color 0.2s ease;
}
.elementor-24 .elementor-element.elementor-element-4b9c202 a:hover {
  color: var( --e-global-color-accent );
  text-decoration: underline;
  text-underline-offset: 3px;
}