.elementor-kit-10{--e-global-color-primary:#C59D4D;--e-global-color-secondary:#1E1E1E;--e-global-color-text:#FFFFFF;--e-global-color-accent:#ECAA1D;--e-global-color-retie_primary_light:#DACE96;--e-global-color-retie_dark:#000000;--e-global-color-retie_text_gray:#B3B3B3;--e-global-color-retie_text_dark:#333333;--e-global-color-retie_light_bg:#F8F7F7;--e-global-color-retie_gray:#D9D9D9;--e-global-typography-primary-font-family:"Montserrat";--e-global-typography-primary-font-weight:500;--e-global-typography-secondary-font-family:"Montserrat";--e-global-typography-secondary-font-weight:300;--e-global-typography-text-font-family:"Inter";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Inter";--e-global-typography-accent-font-weight:600;--e-global-typography-retie_alt-font-family:"Roboto";--e-global-typography-retie_alt-font-weight:500;background-color:#000000;}.elementor-kit-10 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1440px;}.e-con{--container-max-width:1440px;}.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 *//* ==== RETIE COLOMBIA SAS — Tokens de diseño (desde Figma) ==== */
:root {
  /* Colores */
  --color-primary: #C59D4D;
  --color-primary-hover: #ECAA1D;
  --color-primary-light: #DACE96;
  --color-dark: #000000;
  --color-dark-alt: #1E1E1E;
  --color-light-bg: #F8F7F7;
  --color-text-white: #FFFFFF;
  --color-text-gray: #B3B3B3;
  --color-text-dark: #333333;
  --color-border: #D9D9D9;

  /* Tipografia */
  --font-heading: 'Gotham', 'Montserrat', sans-serif;
  --font-body: 'Inter', sans-serif;

  /* Tamanos */
  --fs-hero: 64px;
  --fs-h1: 48px;
  --fs-h2: 36px;
  --fs-h3: 32px;
  --fs-h4: 24px;
  --fs-h5: 20px;
  --fs-body-lg: 18px;
  --fs-body: 16px;
  --fs-body-sm: 14px;
  --fs-caption: 10px;
}

/* Estilos base */
body {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  color: var(--color-text-white);
  background-color: var(--color-dark);
}

h1, h2, h3, h4, h5 {
  font-family: var(--font-heading);
  font-weight: 500;
}

/* Boton primario global: transicion y hover dorado */
.elementor-button {
  font-family: var(--font-heading);
  font-weight: 500;
  letter-spacing: 1px;
  transition: all 0.3s ease;
}
.elementor-button:hover {
  background-color: var(--color-primary-hover) !important;
}

/* NOTA: reglas del spec desactivadas por contradecir el mockup de Figma
   (los botones del diseno son redondeados 14px y en mayus/minus mixto).
   Descomentar si se prefiere el estilo cuadrado uppercase:
.elementor-button {
  background-color: var(--color-primary) !important;
  border-radius: 0px;
  text-transform: uppercase;
  padding: 14px 32px;
}
*/

/* Linea decorativa dorada (separador) */
.gold-line {
  width: 60px;
  height: 3px;
  background-color: var(--color-primary);
}

/* ==== Header fijo sobre el hero ==== */
.header-retie {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 999;
  background-color: rgba(1, 1, 1, 0.51);
  backdrop-filter: none;
}

/* Nav items (enlaces propios y widget Nav Menu) */
.header-retie .retie-nav a,
.header-retie .elementor-nav-menu li a {
  font-family: 'Inter', sans-serif;
  font-weight: 500;
  font-size: 15px;
  color: #FFFFFF;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  text-decoration: none;
  margin: 0 22px;
  transition: color 0.3s ease;
}

.header-retie .retie-nav a:hover,
.header-retie .elementor-nav-menu li a:hover {
  color: #C59D4D;
}

/* Boton CTA pill del header */
.header-retie .elementor-button {
  background-color: #F7F2FA !important;
  color: #9B823E !important;
  border-radius: 20px !important;
  font-family: 'Roboto', sans-serif;
  font-weight: 500;
  font-size: 14px;
  padding: 10px 28px;
}

.header-retie .elementor-button:hover {
  background-color: #C59D4D !important;
  color: #FFFFFF !important;
}

/* En movil: ocultar nav de anclas y compactar header */
@media (max-width: 767px) {
  .header-retie .retie-nav { display: none; }
}/* End custom CSS */