.elementor-kit-5{--e-global-color-primary:#C9A84C;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--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;}.elementor-kit-5 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 *//* ================================================================
   GOLD KING BOT — CSS GLOBAL CORREGIDO
   
   DÓNDE PEGARLO:
   Elementor → Ajustes del sitio → CSS personalizado
   (NO en Apariencia → Personalizar)

   FILOSOFÍA:
   - Este CSS solo define variables y clases opcionales
   - Elementor sigue mandando en todo lo visual del editor
   - Solo usas las clases cuando quieres aplicar el estilo gold
   ================================================================ */


/* ════════════════════════════════════════════════════════════════
   1. FUENTES — Solo esto va con @import, nada más
   ════════════════════════════════════════════════════════════════ */
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;600;700;800;900&family=JetBrains+Mono:wght@400;500;700&display=swap');


/* ════════════════════════════════════════════════════════════════
   2. VARIABLES — Disponibles en todo Elementor
   (En Elementor Pro puedes usarlas en cualquier campo de color
    escribiendo: var(--gold) )
   ════════════════════════════════════════════════════════════════ */
:root {
  --gold:          #C9A84C;
  --gold-bright:   #F0C040;
  --gold-deep:     #7A5E10;
  --gold-pale:     #E0C070;
  --gold-muted:    rgba(201,168,76,0.40);
  --gold-border:   rgba(201,168,76,0.18);
  --gold-border-h: rgba(201,168,76,0.35);
  --gold-bg:       rgba(201,168,76,0.07);
  --gold-div:      rgba(201,168,76,0.09);
  --gold-sep:      rgba(201,168,76,0.07);

  --bg-0:   #050403;
  --bg-1:   #080705;
  --bg-2:   #0C0A07;
  --bg-3:   #111009;
  --bg-4:   #161410;
  --bg-nav: rgba(5,4,3,0.94);

  --white:       #F8F3E8;
  --white-dim:   rgba(248,243,232,0.55);
  --white-faint: rgba(248,243,232,0.25);

  --green:        #22C55E;
  --green-bg:     rgba(34,197,94,0.08);
  --green-border: rgba(34,197,94,0.30);
  --red:          #EF4444;
  --red-bg:       rgba(239,68,68,0.10);
  --red-border:   rgba(239,68,68,0.35);

  --r-card: 16px;
  --r-pill: 50px;
  --r-icon: 12px;

  --font-ui:   'Outfit', sans-serif;
  --font-mono: 'JetBrains Mono', 'Courier New', monospace;
}


/* ════════════════════════════════════════════════════════════════
   3. BASE MÍNIMA — Solo lo que Elementor no puede controlar
   ════════════════════════════════════════════════════════════════ */

/* Scrollbar */
::-webkit-scrollbar        { width: 4px; }
::-webkit-scrollbar-track  { background: var(--bg-2); }
::-webkit-scrollbar-thumb  { background: rgba(201,168,76,0.25); border-radius: 2px; }
::-webkit-scrollbar-thumb:hover { background: rgba(201,168,76,0.45); }

/* Selección de texto */
::selection {
  background: rgba(201,168,76,0.20);
  color: var(--gold-bright);
}

/* Gradiente dorado en <em> dentro de títulos de Elementor
   Esto sí necesita !important porque compite con el editor */
.elementor-heading-title em {
  font-style: normal !important;
  background: linear-gradient(130deg, #7A5E10 0%, #C9A84C 45%, #F0C040 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}


/* ════════════════════════════════════════════════════════════════
   4. CLASES OPCIONALES — Solo actúan si tú las asignas
   en Elementor → Avanzado → Clase CSS
   Elementor sigue teniendo prioridad sobre sus propios controles
   ════════════════════════════════════════════════════════════════ */

/* ── Fondos de sección ── */
.sec-hero {
  background:
    radial-gradient(ellipse 70% 55% at 50% -5%,
      rgba(201,168,76,0.09), transparent 65%),
    radial-gradient(ellipse 35% 45% at 85% 55%,
      rgba(122,94,16,0.07), transparent 55%),
    #050403;
}
.sec-dark   { background: #050403; }
.sec-mid    { background: #0C0A07; }
.sec-cards  { background: #111009; }


/* ── Tarjetas ── */
.gkb-card {
  background: #111009;
  border: 1px solid rgba(201,168,76,0.18);
  border-radius: 16px;
  box-shadow:
    0 0 32px rgba(201,168,76,0.05),
    inset 0 1px 0 rgba(201,168,76,0.08);
  transition: background 0.3s, box-shadow 0.3s, border-color 0.3s;
  overflow: hidden;
}
.gkb-card:hover {
  background: #161410;
  border-color: rgba(201,168,76,0.35);
  box-shadow:
    0 0 48px rgba(201,168,76,0.10),
    inset 0 1px 0 rgba(201,168,76,0.14);
}

.gkb-card-hot {
  background: linear-gradient(180deg,
    rgba(201,168,76,0.10), rgba(201,168,76,0.03));
  border: 1.5px solid rgba(201,168,76,0.40);
  border-radius: 16px;
  box-shadow:
    0 0 48px rgba(201,168,76,0.12),
    inset 0 1px 0 rgba(201,168,76,0.18);
  overflow: hidden;
}

.gkb-card-danger {
  background: rgba(239,68,68,0.06);
  border: 1px solid rgba(239,68,68,0.28);
  border-radius: 16px;
  overflow: hidden;
}

.gkb-card-success {
  background: rgba(201,168,76,0.06);
  border: 1.5px solid rgba(201,168,76,0.35);
  border-radius: 16px;
  overflow: hidden;
}


/* ── Botones ── */
.gkb-btn-primary .elementor-button {
  background: linear-gradient(135deg, #C9A84C, #F0C040);
  color: #050403;
  border-radius: 50px;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0.5px;
  box-shadow: 0 4px 20px rgba(201,168,76,0.30);
  transition: opacity 0.2s, transform 0.2s;
}
.gkb-btn-primary .elementor-button:hover {
  opacity: 0.88;
  transform: translateY(-2px);
}

.gkb-btn-outline .elementor-button {
  background: rgba(201,168,76,0.08);
  color: #C9A84C;
  border: 1px solid rgba(201,168,76,0.30);
  border-radius: 50px;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0.5px;
  transition: background 0.2s, border-color 0.2s;
}
.gkb-btn-outline .elementor-button:hover {
  background: rgba(201,168,76,0.15);
  border-color: #C9A84C;
}


/* ── CTA box ── */
.gkb-cta-box {
  background: linear-gradient(135deg,
    rgba(201,168,76,0.08), rgba(201,168,76,0.03) 50%,
    rgba(201,168,76,0.08));
  border: 1.5px solid rgba(201,168,76,0.22);
  border-radius: 24px;
  position: relative;
  overflow: hidden;
}
.gkb-cta-box::before {
  content: '';
  position: absolute;
  top: 0; left: 10%; right: 10%;
  height: 1.5px;
  background: linear-gradient(90deg, transparent, #C9A84C, transparent);
  pointer-events: none;
}


/* ── Chips de features ── */
.gkb-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(201,168,76,0.07);
  border: 1px solid rgba(201,168,76,0.18);
  border-radius: 50px;
  padding: 9px 18px;
  font-family: 'Outfit', sans-serif;
  font-size: 13.5px;
  font-weight: 500;
  color: rgba(248,243,232,0.80);
  transition: background 0.2s, border-color 0.2s;
  white-space: nowrap;
}
.gkb-chip:hover {
  background: rgba(201,168,76,0.13);
  border-color: rgba(201,168,76,0.30);
}


/* ── Línea decorativa dorada ── */
.gkb-line .elementor-divider-separator {
  border-image: linear-gradient(90deg,
    transparent, #C9A84C, transparent) 1;
}


/* ── Valores positivo/negativo/dorado ── */
.gkb-pos  { color: #22C55E; font-weight: 700; }
.gkb-neg  { color: #EF4444; font-weight: 700; }
.gkb-gold { color: #C9A84C; font-weight: 700; }
.gkb-mono { font-family: 'JetBrains Mono', monospace; }
.gkb-dim  { color: rgba(248,243,232,0.55); }


/* ── Animaciones ── */
@keyframes gkb-blink {
  0%,100% { opacity: 1; }
  50%      { opacity: 0.2; }
}
@keyframes gkb-levitate {
  0%,100% { transform: translateY(0px); }
  50%      { transform: translateY(-12px); }
}/* End custom CSS */