/*
Theme Name: WebGraficos Pro
Theme URI: https://webgraficos.com
Description: Child theme premium de Hello Elementor para WebGraficos. Incluye parallax, reveal on scroll, zoom on appear y franjas con desplazamiento horizontal. Diseñado para funcionar con Elementor Free.
Author: Nelso Barragán
Author URI: https://webgraficos.com
Template: hello-elementor
Version: 1.0.0
Text Domain: webgraficos-pro
*/

/* ==========================================================================
   TOKENS DE MARCA — WebGraficos
   ========================================================================== */
:root {
  --wg-bg:        #121B22;  /* fondo principal (azul muy oscuro/negro) */
  --wg-bg-soft:   #1E2A33;  /* fondo alternativo suave para destacar secciones */
  --wg-bg-line:   #3A4F60;  /* bordes / líneas sutiles */
  --wg-accent:    #B94A3E;  /* acento principal (rojo terracota apagado) */
  --wg-accent-2:  #D96A5C;  /* acento hover (derivado del terracota) */
  --wg-text:      #EAEAEA;  /* texto principal (gris muy claro) */
  --wg-text-mut:  #A0AEC0;  /* texto secundario / metadatos (gris azulado) */
  --wg-font-disp: 'Syne', sans-serif;
  --wg-font-body: 'DM Sans', sans-serif;
  --wg-ease:      cubic-bezier(0.16, 1, 0.3, 1);
}

/* Tipografía base sobre Hello (Hello es muy neutro, lo vestimos) */
body {
  background-color: var(--wg-bg);
  color: var(--wg-text);
  font-family: var(--wg-font-body);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--wg-font-disp);
  color: var(--wg-text);
  letter-spacing: -0.02em;
}

a { color: var(--wg-accent); transition: color .25s var(--wg-ease); }
a:hover { color: var(--wg-accent-2); }

/* Botones de Elementor con look premium WebGraficos */
.elementor-button {
  font-family: var(--wg-font-disp);
  letter-spacing: .01em;
  border-radius: 10px;
  transition: transform .35s var(--wg-ease), box-shadow .35s var(--wg-ease), background-color .35s var(--wg-ease);
}
.elementor-button:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 30px -8px rgba(185, 74, 62, .45);
}