body {
    font-family: 'Inter', sans-serif;
}

/* --- ESTILOS DEL HEADER (CORREGIDOS CON MAYOR ESPECIFICIDAD) --- */
#header {
    background-color: transparent;
    transition: background-color 0.4s ease, backdrop-filter 0.4s ease, box-shadow 0.4s ease;
}
#header.header-scrolled {
    background-color: rgba(17, 24, 39, 0.75); /* Negro semi-transparente */
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
}

/* --- ESTILOS DE LOS ENLACES DE NAVEGACIÓN (CORREGIDOS CON MAYOR ESPECIFICIDAD) --- */
#header nav .nav-link { /* Mayor especificidad */
    position: relative;
    color: white !important; /* Forzar color blanco SIEMPRE */
    font-weight: 500;
    transition: color 0.3s ease;
    padding: 8px 0;
}
/* Línea animada individual */
#header nav .nav-link::after {
    content: '';
    position: absolute;
    width: 100%;
    transform: scaleX(0);
    height: 2px;
    bottom: 0;
    left: 0;
    background-color: #ef4444; /* Rojo */
    transform-origin: bottom right;
    transition: transform 0.25s ease-out;
}
/* Animación al pasar el mouse */
#header nav .nav-link:hover::after {
    transform: scaleX(1);
    transform-origin: bottom left;
}
/* Estilo para el enlace activo */
#header nav .nav-link.active {
    color: #f87171 !important; /* Forzar color rojo claro para activo */
    font-weight: 700;
}
/* Línea visible en el enlace activo */
#header nav .nav-link.active::after {
    transform: scaleX(1);
    background-color: #f87171; /* Rojo claro */
}


/* --- OTROS ESTILOS (Sin cambios relevantes) --- */
.hero-bg { background-image: url('images/7.jpg'); background-size: cover; background-position: center center; }
.page-header-bg { background-size: cover; background-position: center center; }
.page-header-bg.nosotros { background-image: url('images/3.jpg'); }
.page-header-bg.servicios { background-image: url('images/2.jpg'); }
.page-header-bg.clientes { background-image: url('images/8.jpg'); }
.page-header-bg.contacto { background-image: url('images/5.jpg'); }
.hero-overlay, .page-header-overlay { background-color: rgba(26, 32, 44, 0.7); }
.hero-bg { height: 100vh; }
.page-header-bg { min-height: 50vh; }
.section-title { @apply text-3xl md:text-4xl font-bold text-gray-800 mb-2; }
.section-subtitle { @apply text-lg text-gray-500 mb-12; }
.mobile-menu { transition: transform 0.3s ease-in-out; }
.breadcrumbs { @apply text-sm text-gray-500 mb-12; }
.breadcrumbs a { @apply hover:text-red-600; }
.breadcrumbs span { @apply text-gray-400 mx-2; }
.certification-logo { @apply grayscale hover:grayscale-0 transition-all; }