/*
* Colores personalizados para Gestores Empresarial de Seguridad S.A.S
* Colores principales: RGB(255, 98, 37) y RGB(0, 30, 73)
*/

:root {
  /* Colores principales */
  --primary-color: rgb(255, 98, 37);
  --primary-color-hex: #FF6225;
  --secondary-color: rgb(0, 30, 73);
  --secondary-color-hex: #001E49;
  
  /* Variaciones del color principal */
  --primary-light: rgb(255, 128, 77);
  --primary-dark: rgb(220, 68, 12);
  --primary-rgba: rgba(255, 98, 37, 0.9);
  --primary-rgba-light: rgba(255, 98, 37, 0.1);
  
  /* Variaciones del color secundario */
  --secondary-light: rgb(20, 50, 93);
  --secondary-dark: rgb(0, 15, 36);
  --secondary-rgba: rgba(0, 30, 73, 0.9);
  --secondary-rgba-light: rgba(0, 30, 73, 0.1);
  
  /* Colores neutros complementarios */
  --text-dark: #2d2d2d;
  --text-light: #6b6b6b;
  --white: #ffffff;
  --light-gray: #f8f9fa;
  --border-color: #e9ecef;
}

/* === BOTONES PRINCIPALES === */
.theme-btn1,
.theme-btn10,
.theme-btn16 {
  background: var(--primary-color) !important;
  border: 2px solid var(--primary-color) !important;
  color: var(--white) !important;
}

.theme-btn1:hover,
.theme-btn10:hover,
.theme-btn16:hover {
  background: var(--primary-dark) !important;
  border-color: var(--primary-dark) !important;
  color: var(--white) !important;
}

/* Botones secundarios */
.theme-btn-secondary {
  background: var(--secondary-color) !important;
  border: 2px solid var(--secondary-color) !important;
  color: var(--white) !important;
}

.theme-btn-secondary:hover {
  background: var(--secondary-light) !important;
  border-color: var(--secondary-light) !important;
}

/* === ENLACES Y ELEMENTOS INTERACTIVOS === */
a,
.learn,
.readmore,
.arrow {
  color: var(--primary-color) !important;
}

a:hover,
.learn:hover,
.readmore:hover,
.arrow:hover {
  color: var(--primary-dark) !important;
}

/* === ENCABEZADOS Y TÍTULOS === */
.heading10 h1,
.heading10 h2,
.heading10 h3,
.heading10 h4,
.heading10 h5,
.heading10 h6 {
  color: var(--secondary-color) !important;
}

.heading1-w h1,
.heading1-w h2,
.heading6-w h1,
.heading6-w h2 {
  color: var(--white) !important;
}

/* === SPANS Y ETIQUETAS === */
.span {
  color: var(--primary-color) !important;
}

/* === FONDOS PRINCIPALES === */
.hero10-single {
  background: linear-gradient(90deg, var(--secondary-rgba) 0%, rgba(0, 30, 73, 0.35) 100%);
}

.hero10-sliders .hero10-single::after,
.hero10-sliders .hero10-single.slick-current.slick-active::after {
  background-image: none !important;
  background-color: transparent !important;
}

/* Fondos de sección */
.about10,
.work10,
.tes10 {
  background-color: var(--white);
}

.service10,
.blog10 {
  background-color: var(--light-gray) !important;
}

/* Fondo oscuro para secciones especiales */
.case10 {
  background-color: var(--secondary-color) !important;
}

.case10 .heading10,
.case10 h2,
.case10 h3,
.case10 h4,
.case10 p {
  color: var(--white) !important;
}

/* === ICONOS Y ELEMENTOS DECORATIVOS === */
.single-box .icon,
.service-box .icon,
.work-box .icon {
  background: var(--primary-rgba-light);
  border-radius: 10px;
  padding: 20px;
}

/* === FORMULARIOS === */
.form-area input[type="email"],
.form-area input[type="text"],
.form-area textarea {
  border: 2px solid var(--border-color);
  background: var(--white);
}

.form-area input:focus,
.form-area textarea:focus {
  border-color: var(--primary-color) !important;
  box-shadow: 0 0 0 0.2rem var(--primary-rgba-light) !important;
}

/* === NAVEGACIÓN === */
.header-area10 .main-menu-ex ul li a {
  color: var(--secondary-color) !important;
}

.header-area10 .main-menu-ex ul li a:hover {
  color: var(--primary-color) !important;
}

/* === CTA Y SECCIONES ESPECIALES === */
.cta8 {
  background-color: var(--secondary-color) !important;
  background-blend-mode: multiply;
}

.cta8 .heading6-w h2,
.cta8 .heading6-w p {
  color: var(--white) !important;
}

/* === TESTIMONIOS === */
.tes6-slider .stars i {
  color: var(--primary-color) !important;
}

/* === CONTADORES === */
.counter-box h3 {
  color: var(--primary-color) !important;
}

/* === OVERLAYS Y EFECTOS === */
.overlay-anim::before {
  background: var(--primary-rgba) !important;
}

/* === ESTADOS ACTIVOS === */
.cs_case_study.active .cs_case_study_thumb::after {
  border-color: var(--primary-color) !important;
}

/* === ELEMENTOS ESPECIALES === */
.step p {
  background: var(--primary-color) !important;
  color: var(--white) !important;
}

.work-box.top {
  margin-top: 50px;
}

/* === RESPONSIVE === */
@media (max-width: 768px) {
  .hero10-single {
    background: linear-gradient(180deg, var(--secondary-rgba) 0%, rgba(0, 30, 73, 0.5) 100%) !important;
  }
}

/* === UTILIDADES === */
.text-primary {
  color: var(--primary-color) !important;
}

.text-secondary {
  color: var(--secondary-color) !important;
}

.bg-primary {
  background-color: var(--primary-color) !important;
}

.bg-secondary {
  background-color: var(--secondary-color) !important;
}

.border-primary {
  border-color: var(--primary-color) !important;
}

.border-secondary {
  border-color: var(--secondary-color) !important;
}