/* --- Variables Corporativas Estrictas --- */
:root {
    --color-accent-dark: #660033;
    /* Énfasis principal y bordes estándar */
    --color-action-primary: #886600;
    /* Alertas críticas y botones de acción principal */
    --font-main: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

body {
    font-family: var(--font-main);
    color: #333333;
    scroll-behavior: smooth;
}

/* --- Top Bar & Navigation --- */
.top-bar {
    background-color: var(--color-accent-dark);
}

.fs-7 {
    font-size: 0.85rem;
}

.navbar-nav .nav-link {
    color: #555555;
    font-weight: 500;
    transition: color 0.3s ease;
}

.navbar-nav .nav-link:hover,
.navbar-nav .nav-link.active {
    color: var(--color-accent-dark) !important;
}

/* --- Carrusel (Inicio) --- */
.carousel-item {
    height: 70vh;
    min-height: 500px;
}

.max-w-600 {
    max-width: 600px;
}

/* --- Botones Personalizados --- */
.btn-custom {
    background-color: var(--color-action-primary) !important;
    border-color: var(--color-action-primary) !important;
    color: #ffffff !important;
    transition: all 0.3s ease;
}

.btn-custom:hover {
    background-color: #664d00 !important;
    border-color: #664d00 !important;
    transform: translateY(-2px);
}

/* --- Sección Títulos --- */
.section-title {
    color: var(--color-accent-dark);
    font-weight: 700;
}

.title-line {
    width: 60px;
    height: 3px;
    background-color: var(--color-action-primary);
    margin: 10px auto 0;
}

/* --- Tarjetas de Servicios y Detalles --- */
.border-accent-card {
    border: 1px solid rgba(102, 0, 51, 0.15) !important;
    border-top: 4px solid var(--color-accent-dark) !important;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.border-accent-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(102, 0, 51, 0.08) !important;
}

.icon-box i {
    color: var(--color-accent-dark);
}

.text-accent {
    color: var(--color-accent-dark);
}

.text-accent-dark {
    color: #4a0025;
}

/* --- Alertas de Alerta Crítica (Baja) --- */
.alert-custom {
    background-color: #fff9e6;
    border: 1px solid var(--color-action-primary);
    color: #5c4400;
    font-weight: 500;
    border-radius: 8px;
}

/* --- Bordes y Selectores Especiales --- */
.border-start-accent {
    border-left: 5px solid var(--color-accent-dark) !important;
}

.hover-white:hover {
    color: #ffffff !important;
}

/* --- Estilos para el Diagrama de Pasos Limpio --- */
.step-card {
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
    transition: all 0.3s ease;
}

.step-card:hover {
    transform: translateY(-3px);
    border-color: var(--color-accent-dark) !important;
}

.step-number {
    background-color: var(--color-accent-dark);
    color: #ffffff;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.85rem;
    font-weight: bold;
}

.text-warning-custom {
    color: var(--color-action-primary) !important;
}

.bg-grantia {
    background-color: #fffdf5 !important;
    border: 1px dashed var(--color-action-primary) !important;
}

/* --- Estilos para la Sección de Vacantes --- */
.badge-zona {
    background-color: #f8f9fa;
    color: #495057;
    border: 1px solid #dee2e6;
    font-size: 0.8rem;
}

.badge-sueldo {
    background-color: #fffaf0;
    color: var(--color-action-primary);
    border: 1px solid rgba(136, 102, 0, 0.2);
    font-size: 0.85rem;
}

.vacante-card {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.vacante-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.08) !important;
}

.cta-box-vacantes {
    background: linear-gradient(135deg, #ffffff 0%, #fffdf5 100%);
    border-left: 5px solid var(--color-action-primary) !important;
}