/*
Theme Name: Hello Elementor Child
Theme URI: https://elementor.com/hello-theme/?utm_source=wp-themes&utm_campaign=theme-uri&utm_medium=wp-dash
Template: hello-elementor
Author: Elementor Team
Author URI: https://elementor.com/?utm_source=wp-themes&utm_campaign=author-uri&utm_medium=wp-dash
Description: Hello Elementor is a lightweight and minimalist WordPress theme that was built specifically to work seamlessly with the Elementor site builder plugin. The theme is free, open-source, and designed for users who want a flexible, easy-to-use, and customizable website. The theme, which is optimized for performance, provides a solid foundation for users to build their own unique designs using the Elementor drag-and-drop site builder. Its simplicity and flexibility make it a great choice for both beginners and experienced Web Creators.
Tags: accessibility-ready,flexible-header,custom-colors,custom-menu,custom-logo,featured-images,rtl-language-support,threaded-comments,translation-ready
Version: 3.4.9.1781524747
Updated: 2026-06-15 13:59:07

*/

/* =============================================
   HEADER — Un solo header, dos estados de color
   ============================================= */

/* El header empieza oculto, el JS lo muestra tras calcular el estado */

.admin-bar header#site-header {
    top: 32px;
}

#site-header {
  opacity: 0;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 9999;

  --header-bg:    transparent;
  --header-color: #000;

  background-color: var(--header-bg);
  transition: opacity 0.2s ease,
              background-color 0.35s ease,
              color 0.35s ease;
}

.elementor-editor-active #site-header {
  opacity: 1;
}

#site-header.header-ready {
  opacity: 1;
}

/* Sobre sección oscura → texto blanco */
#site-header.is-dark {
  --header-color: #fff;
}

#site-header.is-dark svg * {
  fill: var(--header-color); /* MODIFICADO: antes era #fff fijo */
  transition: fill 0.35s ease;
}

.is-dark .elementor-social-icon svg {
  fill: var(--header-color) !important; /* MODIFICADO */
  transition: fill 0.35s ease;
}

/* Textos del nav */
#site-header,
#site-header .elementor-nav-menu a,
#site-header .e-con {
  color: var(--header-color);
  transition: color 0.35s ease;
}

/* NUEVO: enlaces, hover y current-menu-item siempre leen la variable */
#site-header a.elementor-item,
#site-header a.elementor-item:hover,
#site-header .current-menu-item a {
  color: var(--header-color) !important;
}

/* NUEVO: la línea del ::after también depende de la variable */
#site-header .elementor-widget-nav-menu .elementor-item:after {
  background-color: var(--header-color) !important;
}

/* Estado por defecto (sin is-dark) y con scroll → borde y texto negro */
#site-header:not(.is-dark) .btn-blanco,
#site-header.header-scroll .btn-blanco {
  border-color: var(--c-negro) !important;
  color: var(--c-negro) !important;
}

/* Hover en ambos casos → fondo negro, texto blanco */
#site-header:not(.is-dark) .btn-blanco:hover,
#site-header.header-scroll .btn-blanco:hover {
  background-color: var(--c-negro) !important;
  color: var(--c-blanco) !important;
  border-color: var(--c-negro) !important;
}

/* Con scroll → fondo blanco */
#site-header.header-scroll {
  --header-bg: #ffffff;
  box-shadow: 0 2px 20px rgba(0, 0, 0, 0.08);
}

/* NUEVO: con scroll, SIEMPRE negro, haya o no is-dark */
#site-header.header-scroll,
#site-header.header-scroll.is-dark {
  --header-color: #000 !important;
}

@media screen and (max-width:1024px) {
  #site-header, #site-header .elementor-nav-menu a, #site-header .e-con {
    color: var(--c-negro);
  }
}


/* Oculta el texto antes de que JS lo inicialice, evita flash de texto completo */
.typewriter {
  visibility: hidden;
}

/* Cursor parpadeante opcional — se añade con ::after */
.typewriter.typing::after {
  content: '|';
  display: inline-block;
  margin-left: 2px;
  animation: blink 0.7s step-end infinite;
}

@keyframes blink {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0; }
}

/*TESTIMONIOS*/
div#cont-testimonios {
    flex-direction: column;
}
/*TEXTO CITA*/
.texto-cita {
    position: relative;
}
.texto-cita:before {
    content: "";
    background: url(img/comillas.svg)no-repeat;
    display: block;
    width: 22px;
    height: 17px;
    position: absolute;
    left: 5px;
    top: 14px;
}