/* Base Styles */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: Arial, sans-serif;
    background-color: #1a1a2e;
    color: #f3e5f9;
    line-height: 1.6;
    font-size: 16px;
}

/* Structure Components */
.entrada_principal {
    min-height: 100vh;
    padding: 2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #1a1a2e;
}

.contenedor_superior {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 3rem;
}

/* Brand Identity */
.identidad_marca {
    text-align: center;
    margin-bottom: 1.5rem;
}

.titulo_programa {
    font-size: 3rem;
    color: #7209b7;
    font-weight: 800;
    letter-spacing: -0.5px;
    margin-bottom: 0.5rem;
}

.subtitulo_programa {
    font-size: 1.25rem;
    color: #f3e5f9;
    font-weight: 400;
}

/* Value Proposition */
.proposicion_valor {
    display: flex;
    flex-direction: column-reverse;
    gap: 2rem;
    margin-bottom: 3rem;
    align-items: center;
}

.beneficio_principal {
    flex: 1;
    max-width: 600px;
}

.llamada_accion {
    font-size: 2.5rem;
    color: #7209b7;
    margin-bottom: 1.5rem;
    font-weight: 700;
}

.descripcion_curso {
    font-size: 1.1rem;
    margin-bottom: 2rem;
    line-height: 1.7;
}

.opciones_contacto {
    margin-top: 2rem;
}

.enlace_contacto {
    display: inline-block;
    background-color: #7209b7;
    color: #f3e5f9;
    text-decoration: none;
    padding: 1rem 2rem;
    font-size: 1.1rem;
    font-weight: 600;
    border-radius: 10px;
    transition: all 0.3s ease;
}

.enlace_contacto:hover {
    background-color: #4c0677;
    transform: translateY(-3px);
}

.promesa_contacto {
    margin-top: 1rem;
    font-size: 0.9rem;
    color: #a8a8b3;
}

/* Visual Impact */
.visual_impacto {
    flex: 1;
    max-width: 600px;
}

.imagen_destacada {
    width: 100%;
    height: auto;
    border-radius: 10px;
    box-shadow: 0 20px 40px rgba(114, 9, 183, 0.15);
}

/* Stats Section */
.datos_destacados {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2rem;
    margin-top: 1rem;
}

.punto_destacado {
    background-color: #28293d;
    padding: 1.5rem;
    border-radius: 10px;
    text-align: center;
}

.cifra_impacto {
    font-size: 2.5rem;
    font-weight: 700;
    color: #7209b7;
    margin-bottom: 0.5rem;
}

.contexto_cifra {
    font-size: 1rem;
    color: #f3e5f9;
}

/* Responsive Design */
@media (min-width: 768px) {
    .proposicion_valor {
        flex-direction: row;
        align-items: center;
    }
    
    .datos_destacados {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 767px) {
    .titulo_programa {
        font-size: 2.2rem;
    }
    
    .llamada_accion {
        font-size: 2rem;
    }
    
    .entrada_principal {
        padding: 1.5rem;
    }
    
    .contenedor_superior {
        gap: 2rem;
    }
    
    .visual_impacto {
        margin-bottom: 1rem;
    }
}

@media (max-width: 480px) {
    .titulo_programa {
        font-size: 1.8rem;
    }
    
    .subtitulo_programa {
        font-size: 1rem;
    }
    
    .llamada_accion {
        font-size: 1.6rem;
    }
    
    .descripcion_curso {
        font-size: 1rem;
    }
    
    .enlace_contacto {
        padding: 0.8rem 1.5rem;
        font-size: 1rem;
    }
}











/* Sección de Desafíos y Soluciones */
.desafios_profesionales {
    background-color: #21213a;
    padding: 5rem 2rem;
}

.marco_soluciones {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 4rem;
}

.introduccion_problematica {
    text-align: center;
    max-width: 800px;
    margin: 0 auto;
}

.titulo_desafios {
    font-size: 2.8rem;
    color: #7209b7;
    margin-bottom: 1.5rem;
    font-weight: 700;
}

.contexto_problematica {
    font-size: 1.2rem;
    line-height: 1.7;
    color: #f3e5f9;
}

.matriz_problemas_soluciones {
    display: flex;
    flex-direction: column;
    gap: 3.5rem;
}

.caso_problema {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2rem;
    background-color: #2a2a45;
    padding: 2.5rem;
    border-radius: 12px;
}

.identificacion_problema {
    margin-bottom: 1rem;
}

.titulo_problema {
    font-size: 1.8rem;
    color: #f3e5f9;
    margin-bottom: 1rem;
    position: relative;
    display: inline-block;
}



.descripcion_problema {
    font-size: 1.1rem;
    line-height: 1.6;
    color: #c7c7d8;
}

.propuesta_solucion {
    background-color: #33334d;
    padding: 2rem;
    border-radius: 8px;
}

.enfoque_metodologico {
    font-size: 1.4rem;
    color: #7209b7;
    margin-bottom: 1.2rem;
}

.descripcion_solucion {
    font-size: 1.05rem;
    line-height: 1.7;
    margin-bottom: 1.5rem;
    color: #f3e5f9;
}

.recursos_formativos {
    list-style-type: none;
    margin: 1.5rem 0;
}

.recurso_detalle {
    padding: 0.7rem 0;
    font-size: 1.05rem;
    color: #e0e0f0;
    position: relative;
    padding-left: 1.2rem;
}

.recurso_detalle::before {
    content: "•";
    color: #7209b7;
    position: absolute;
    left: 0;
    font-size: 1.2rem;
}

.tabla_metodologias {
    width: 100%;
    margin: 1.5rem 0;
    border-collapse: separate;
    border-spacing: 0 10px;
}

.categoria_metodologia {
    text-align: left;
}

.titulo_metodologia {
    padding: 1rem;
    font-size: 1.1rem;
    color: #7209b7;
    font-weight: 600;
    background-color: #3a3a5a;
}

.titulo_metodologia:first-child {
    border-radius: 8px 0 0 8px;
}

.titulo_metodologia:last-child {
    border-radius: 0 8px 8px 0;
}

.elemento_metodologia {
    transition: all 0.3s ease;
}

.elemento_metodologia:hover {
    transform: translateY(-3px);
}

.contenido_metodologia {
    padding: 1rem;
    font-size: 1rem;
    color: #e0e0f0;
    background-color: #404063;
}

.contenido_metodologia:first-child {
    border-radius: 8px 0 0 8px;
}

.contenido_metodologia:last-child {
    border-radius: 0 8px 8px 0;
}

.estadisticas_impacto {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
    margin-top: 2rem;
}

.dato_estrategia {
    background-color: #404063;
    padding: 1.5rem;
    border-radius: 8px;
    text-align: center;
}

.valor_estadistica {
    font-size: 2rem;
    font-weight: 700;
    color: #7209b7;
    margin-bottom: 0.5rem;
}

.contexto_estadistica {
    font-size: 0.9rem;
    color: #e0e0f0;
    line-height: 1.4;
}

.conclusion_problematica {
    text-align: center;
    margin-top: 2rem;
    background-color: #2a2a45;
    padding: 2.5rem;
    border-radius: 12px;
}

.llamado_accion_problemas {
    font-size: 1.3rem;
    color: #f3e5f9;
    margin-bottom: 1.5rem;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

.enlace_consulta {
    display: inline-block;
    background-color: #7209b7;
    color: #f3e5f9;
    text-decoration: none;
    padding: 1rem 2rem;
    font-size: 1.1rem;
    font-weight: 600;
    border-radius: 10px;
    transition: all 0.3s ease;
}

.enlace_consulta:hover {
    background-color: #4c0677;
    transform: translateY(-3px);
}

/* Responsive Design */
@media (min-width: 992px) {
    .caso_problema {
        grid-template-columns: 1fr 2fr;
    }
    
    .identificacion_problema {
        margin-bottom: 0;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .caso_problema {
        grid-template-columns: 1fr;
    }
    
    .estadisticas_impacto {
        grid-template-columns: repeat(3, 1fr);
    }
    
    .titulo_desafios {
        font-size: 2.5rem;
    }
}

@media (max-width: 767px) {
    .titulo_desafios {
        font-size: 2.2rem;
    }
    
    .estadisticas_impacto {
        grid-template-columns: 1fr;
    }
    
    .desafios_profesionales {
        padding: 3rem 1.5rem;
    }
    
    .caso_problema {
        padding: 1.8rem;
    }
    
    .propuesta_solucion {
        padding: 1.5rem;
    }
    
    .tabla_metodologias {
        font-size: 0.9rem;
    }
    
    .titulo_metodologia, .contenido_metodologia {
        padding: 0.7rem;
    }
    
    .conclusion_problematica {
        padding: 2rem 1.5rem;
    }
}

@media (max-width: 480px) {
    .titulo_desafios {
        font-size: 1.8rem;
    }
    
    .contexto_problematica {
        font-size: 1.1rem;
    }
    
    .titulo_problema {
        font-size: 1.5rem;
    }
    
    .enfoque_metodologico {
        font-size: 1.3rem;
    }
    
    .llamado_accion_problemas {
        font-size: 1.1rem;
    }
    
    .enlace_consulta {
        padding: 0.8rem 1.5rem;
        font-size: 1rem;
    }
}










/* Sección de Objetivos del Curso */
.metas_aprendizaje {
    background-color: #1e1e36;
    padding: 5rem 2rem;
}

.contenedor_objetivos {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 4rem;
}

.introduccion_capacitacion {
    text-align: center;
    max-width: 800px;
    margin: 0 auto;
}

.titulo_resultados {
    font-size: 2.8rem;
    color: #7209b7;
    margin-bottom: 1.5rem;
    font-weight: 700;
}

.vision_programa {
    font-size: 1.2rem;
    line-height: 1.7;
    color: #f3e5f9;
}

.estructura_objetivos {
    display: flex;
    flex-direction: column;
    gap: 4rem;
}

.objetivo_formativo {
    display: grid;
    grid-template-columns: 80px 1fr;
    gap: 2rem;
}

.numeracion_objetivo {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    padding-top: 0.5rem;
}

.indicador_numerado {
    font-size: 2.5rem;
    font-weight: 700;
    color: #7209b7;
    line-height: 1;
}

.contenido_objetivo {
    flex: 1;
}

.titulo_objetivo {
    font-size: 2rem;
    color: #f3e5f9;
    margin-bottom: 1rem;
    font-weight: 600;
}

.descripcion_objetivo {
    font-size: 1.2rem;
    line-height: 1.6;
    color: #c7c7d8;
    margin-bottom: 2rem;
    max-width: 90%;
}

.detalles_objetivo {
    background-color: #2a2a45;
    border-radius: 12px;
    padding: 2.5rem;
}

/* Estilos para el objetivo 1: Delegación */
.bloque_capacidades {
    margin-bottom: 2rem;
}

.titulo_capacidades {
    font-size: 1.3rem;
    color: #7209b7;
    margin-bottom: 1.2rem;
    font-weight: 500;
}

.lista_capacidades {
    list-style-type: none;
}

.elemento_capacidad {
    padding: 0.8rem 0;
    font-size: 1.05rem;
    color: #f3e5f9;
    position: relative;
    padding-left: 1.5rem;
}

.elemento_capacidad::before {
    content: "•";
    color: #7209b7;
    position: absolute;
    left: 0;
    font-size: 1.2rem;
}

.experiencia_aprendizaje {
    background-color: #33334d;
    padding: 2rem;
    border-radius: 8px;
}

.caso_aplicacion {
    font-size: 1.05rem;
    line-height: 1.7;
    color: #f3e5f9;
    font-style: italic;
    margin-bottom: 1rem;
}

.autor_testimonio {
    font-size: 0.95rem;
    color: #c7c7d8;
    text-align: right;
}

/* Estilos para el objetivo 2: Coaching */
.matriz_metodologias {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
}

.metodologia_coaching {
    background-color: #33334d;
    padding: 1.5rem;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
}

.nombre_metodologia {
    font-size: 1.1rem;
    color: #7209b7;
    margin-bottom: 0.8rem;
    font-weight: 500;
}

.aplicacion_metodologia {
    font-size: 1rem;
    color: #f3e5f9;
    line-height: 1.5;
}

.resultado_tangible {
    margin-top: 2rem;
    background-color: #33334d;
    padding: 1.5rem;
    border-radius: 8px;
}

.impacto_medible {
    font-size: 1.1rem;
    line-height: 1.6;
    color: #f3e5f9;
    text-align: center;
}

/* Estilos para el objetivo 3: Sistema de Evaluación */
.ciclo_desarrollo {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
    margin-bottom: 2rem;
}

.fase_sistema {
    background-color: #33334d;
    padding: 1.5rem;
    border-radius: 8px;
    position: relative;
}

.etiqueta_fase {
    display: inline-block;
    background-color: #7209b7;
    color: #fff;
    font-size: 0.8rem;
    font-weight: 600;
    padding: 0.4rem 0.8rem;
    border-radius: 4px;
    margin-bottom: 1rem;
}

.nombre_fase {
    font-size: 1.1rem;
    color: #f3e5f9;
    margin-bottom: 0.8rem;
    font-weight: 500;
}

.descripcion_fase {
    font-size: 0.95rem;
    color: #c7c7d8;
    line-height: 1.5;
}

.caso_practico {
    background-color: #33334d;
    padding: 1.5rem;
    border-radius: 8px;
    margin-top: 1.5rem;
}

.descripcion_caso {
    font-size: 1.05rem;
    line-height: 1.6;
    color: #f3e5f9;
}

/* Cierre de la sección */
.cierre_objetivos {
    text-align: center;
    margin-top: 2rem;
}

.solicitud_programa {
    display: inline-block;
    background-color: #7209b7;
    color: #f3e5f9;
    text-decoration: none;
    padding: 1rem 2rem;
    font-size: 1.1rem;
    font-weight: 600;
    border-radius: 10px;
    transition: all 0.3s ease;
    margin-bottom: 1rem;
}

.solicitud_programa:hover {
    background-color: #4c0677;
    transform: translateY(-3px);
}

.promesa_programa {
    font-size: 0.95rem;
    color: #c7c7d8;
}

/* Responsive Design */
@media (max-width: 992px) {
    .matriz_metodologias {
        grid-template-columns: 1fr;
    }
    
    .ciclo_desarrollo {
        grid-template-columns: 1fr;
    }
    
    .descripcion_objetivo {
        max-width: 100%;
    }
}

@media (max-width: 768px) {
    .titulo_resultados {
        font-size: 2.4rem;
    }
    
    .vision_programa {
        font-size: 1.1rem;
    }
    
    .objetivo_formativo {
        grid-template-columns: 60px 1fr;
        gap: 1.5rem;
    }
    
    .indicador_numerado {
        font-size: 2rem;
    }
    
    .titulo_objetivo {
        font-size: 1.8rem;
    }
    
    .descripcion_objetivo {
        font-size: 1.1rem;
    }
    
    .detalles_objetivo {
        padding: 2rem;
    }
    
    .metas_aprendizaje {
        padding: 4rem 1.5rem;
    }
}

@media (max-width: 480px) {
    .titulo_resultados {
        font-size: 2rem;
    }
    
    .vision_programa {
        font-size: 1rem;
    }
    
    .objetivo_formativo {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .numeracion_objetivo {
        justify-content: flex-start;
        padding-bottom: 0.5rem;
    }
    
    .titulo_objetivo {
        font-size: 1.6rem;
    }
    
    .descripcion_objetivo {
        font-size: 1rem;
    }
    
    .detalles_objetivo {
        padding: 1.5rem;
    }
    
    .experiencia_aprendizaje {
        padding: 1.5rem;
    }
    
    .metodologia_coaching,
    .fase_sistema {
        padding: 1.2rem;
    }
    
    .solicitud_programa {
        padding: 0.8rem 1.5rem;
        font-size: 1rem;
    }
}













/* Sección de Perfiles Profesionales */
.perfiles_candidatos {
    background-color: #242445;
    padding: 5rem 2rem;
}

.contenedor_perfiles {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 4rem;
}

.introduccion_perfiles {
    text-align: center;
    max-width: 800px;
    margin: 0 auto;
}

.titulo_perfiles {
    font-size: 2.8rem;
    color: #7209b7;
    margin-bottom: 1.5rem;
    font-weight: 700;
}

.descripcion_general_perfiles {
    font-size: 1.2rem;
    line-height: 1.7;
    color: #f3e5f9;
}

.galeria_perfiles {
    display: flex;
    flex-direction: column;
    gap: 3rem;
}

.perfil_candidato {
    background-color: #2a2a50;
    border-radius: 12px;
    overflow: hidden;
    transition: transform 0.3s ease;
}

.perfil_candidato:hover {
    transform: translateY(-5px);
}

.cabecera_perfil {
    padding: 2rem;
    background-color: #33335a;
}

.titulo_tipo_perfil {
    font-size: 1.8rem;
    color: #f3e5f9;
    margin-bottom: 0.5rem;
}

.subtitulo_tipo_perfil {
    font-size: 1.1rem;
    color: #b8b8d0;
    font-style: italic;
}

.detalles_perfil {
    padding: 2rem;
    display: grid;
    grid-template-columns: 1fr;
    gap: 2rem;
}

.titulo_requisitos, .titulo_beneficios {
    font-size: 1.4rem;
    color: #7209b7;
    margin-bottom: 1.2rem;
}

.lista_caracteristicas {
    list-style-type: none;
}

.caracteristica {
    padding: 0.7rem 0;
    font-size: 1.05rem;
    color: #e0e0f0;
    position: relative;
    padding-left: 1.2rem;
}

.caracteristica::before {
    content: "•";
    color: #7209b7;
    position: absolute;
    left: 0;
    font-size: 1.2rem;
}

.descripcion_beneficios {
    font-size: 1.05rem;
    line-height: 1.7;
    margin-bottom: 1.8rem;
    color: #e0e0f0;
}

.testimonio_perfil {
    background-color: #33335a;
    padding: 1.5rem;
    border-radius: 8px;
    position: relative;
}



.cita_testimonio {
    font-size: 1.1rem;
    font-style: italic;
    color: #f3e5f9;
    margin-bottom: 1rem;
    line-height: 1.6;
}

.autor_testimonio {
    font-size: 0.95rem;
    color: #b8b8d0;
    text-align: right;
}

/* Estilos específicos para cada tipo de perfil */
.perfil_experimentado .cabecera_perfil {
    border-left: 5px solid #7209b7;
}

.perfil_emprendedor .cabecera_perfil {
    border-left: 5px solid #9d4edd;
}

.perfil_transicion .cabecera_perfil {
    border-left: 5px solid #c77dff;
}

.conclusion_perfiles {
    text-align: center;
    margin-top: 2rem;
    background-color: #33335a;
    padding: 2.5rem;
    border-radius: 12px;
}

.nota_adaptabilidad {
    font-size: 1.2rem;
    color: #f3e5f9;
    margin-bottom: 1.5rem;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

.enlace_evaluacion {
    display: inline-block;
    background-color: #7209b7;
    color: #f3e5f9;
    text-decoration: none;
    padding: 1rem 2rem;
    font-size: 1.1rem;
    font-weight: 600;
    border-radius: 10px;
    transition: all 0.3s ease;
}

.enlace_evaluacion:hover {
    background-color: #4c0677;
    transform: translateY(-3px);
}

/* Responsive Design */
@media (min-width: 992px) {
    .detalles_perfil {
        grid-template-columns: 1fr 2fr;
    }
    
    .galeria_perfiles {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 2rem;
    }
    
    .perfil_candidato {
        height: 100%;
        display: flex;
        flex-direction: column;
    }
    
    .detalles_perfil {
        flex: 1;
        display: flex;
        flex-direction: column;
    }
    
    .beneficios_perfil {
        flex: 1;
        display: flex;
        flex-direction: column;
    }
    
    .testimonio_perfil {
        margin-top: auto;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .detalles_perfil {
        grid-template-columns: 1fr 1.5fr;
    }
    
    .titulo_perfiles {
        font-size: 2.5rem;
    }
}

@media (max-width: 767px) {
    .titulo_perfiles {
        font-size: 2.2rem;
    }
    
    .perfiles_candidatos {
        padding: 3rem 1.5rem;
    }
    
    .cabecera_perfil, .detalles_perfil {
        padding: 1.5rem;
    }
    
    .titulo_tipo_perfil {
        font-size: 1.6rem;
    }
    
    .conclusion_perfiles {
        padding: 2rem 1.5rem;
    }
    
    .nota_adaptabilidad {
        font-size: 1.1rem;
    }
}

@media (max-width: 480px) {
    .titulo_perfiles {
        font-size: 1.8rem;
    }
    
    .descripcion_general_perfiles {
        font-size: 1.1rem;
    }
    
    .titulo_tipo_perfil {
        font-size: 1.5rem;
    }
    
    .subtitulo_tipo_perfil, 
    .cita_testimonio {
        font-size: 1rem;
    }
    
    .titulo_requisitos, 
    .titulo_beneficios {
        font-size: 1.3rem;
    }
    
    .enlace_evaluacion {
        padding: 0.8rem 1.5rem;
        font-size: 1rem;
    }
}












/* Sección del Programa Formativo */
.estructura_formativa {
    background-color: #1a1a2e;
    padding: 5rem 2rem;
}

.contenedor_programa {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 4rem;
}

.introduccion_programa {
    text-align: center;
    max-width: 800px;
    margin: 0 auto;
}

.titulo_programa_formativo {
    font-size: 2.8rem;
    color: #7209b7;
    margin-bottom: 1.5rem;
    font-weight: 700;
}

.descripcion_programa {
    font-size: 1.2rem;
    line-height: 1.7;
    color: #f3e5f9;
}

.mapa_formativo {
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
}

.modulo_formativo {
    background-color: #28293d;
    border-radius: 12px;
    overflow: hidden;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.modulo_formativo:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.2);
}

.encabezado_modulo {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem 2rem;
    background-color: #33335a;
}

.identificador_modulo {
    display: flex;
    align-items: center;
    gap: 1.5rem;
}

.numero_modulo {
    font-size: 2.5rem;
    font-weight: 800;
    color: rgba(114, 9, 183, 0.3);
}

.titulo_modulo {
    font-size: 1.6rem;
    color: #f3e5f9;
    font-weight: 600;
}

.duracion_modulo {
    font-size: 0.95rem;
    color: #b8b8d0;
    background-color: rgba(114, 9, 183, 0.15);
    padding: 0.5rem 1rem;
    border-radius: 20px;
}

.contenido_modulo {
    padding: 2rem;
}

.descripcion_modulo {
    font-size: 1.1rem;
    line-height: 1.7;
    color: #e0e0f0;
    margin-bottom: 2rem;
}

.detalles_modulo {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2rem;
}

.titulo_temas, .titulo_resultado {
    font-size: 1.3rem;
    color: #7209b7;
    margin-bottom: 1rem;
}

.lista_temas {
    list-style-type: none;
}

.tema {
    padding: 0.6rem 0;
    font-size: 1.05rem;
    color: #e0e0f0;
    position: relative;
    padding-left: 1.2rem;
}

.tema::before {
    content: "•";
    color: #7209b7;
    position: absolute;
    left: 0;
    font-size: 1.2rem;
}

.descripcion_resultado {
    font-size: 1.05rem;
    line-height: 1.7;
    color: #e0e0f0;
}

/* Estilos específicos para cada módulo */
.modulo_inteligencia .numero_modulo {
    color: rgba(114, 9, 183, 0.3);
}

.modulo_delegacion .numero_modulo {
    color: rgba(139, 30, 207, 0.3);
}

.modulo_conflictos .numero_modulo {
    color: rgba(157, 78, 221, 0.3);
}

.modulo_retencion .numero_modulo {
    color: rgba(175, 94, 238, 0.3);
}

.modulo_cambio .numero_modulo {
    color: rgba(193, 125, 255, 0.3);
}

.conclusion_programa {
    margin-top: 2rem;
    display: flex;
    flex-direction: column;
    gap: 3rem;
}

.metodologia_general {
    background-color: #28293d;
    padding: 2.5rem;
    border-radius: 12px;
    text-align: center;
    max-width: 900px;
    margin: 0 auto;
}

.titulo_metodologia {
    font-size: 1.8rem;
    color: #7209b7;
    margin-bottom: 1.2rem;
}

.descripcion_metodologia {
    font-size: 1.1rem;
    line-height: 1.7;
    color: #e0e0f0;
}

.llamada_accion_programa {
    text-align: center;
    background-color: #33335a;
    padding: 3rem 2rem;
    border-radius: 12px;
}

.texto_llamada {
    font-size: 1.5rem;
    color: #f3e5f9;
    margin-bottom: 1.5rem;
    font-weight: 600;
}

.enlace_inscripcion {
    display: inline-block;
    background-color: #7209b7;
    color: #f3e5f9;
    text-decoration: none;
    padding: 1rem 2rem;
    font-size: 1.1rem;
    font-weight: 600;
    border-radius: 10px;
    transition: all 0.3s ease;
}

.enlace_inscripcion:hover {
    background-color: #4c0677;
    transform: translateY(-3px);
}

/* Responsive Design */
@media (min-width: 992px) {
    .detalles_modulo {
        grid-template-columns: 1fr 1.5fr;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .titulo_programa_formativo {
        font-size: 2.5rem;
    }
    
    .encabezado_modulo {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }
    
    .duracion_modulo {
        align-self: flex-start;
    }
}

@media (max-width: 767px) {
    .titulo_programa_formativo {
        font-size: 2.2rem;
    }
    
    .estructura_formativa {
        padding: 3rem 1.5rem;
    }
    
    .encabezado_modulo {
        padding: 1.2rem 1.5rem;
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }
    
    .identificador_modulo {
        gap: 1rem;
    }
    
    .numero_modulo {
        font-size: 2rem;
    }
    
    .titulo_modulo {
        font-size: 1.4rem;
    }
    
    .duracion_modulo {
        font-size: 0.9rem;
        align-self: flex-start;
    }
    
    .contenido_modulo {
        padding: 1.5rem;
    }
    
    .descripcion_modulo {
        font-size: 1rem;
    }
    
    .titulo_temas, .titulo_resultado {
        font-size: 1.2rem;
    }
    
    .metodologia_general {
        padding: 2rem 1.5rem;
    }
    
    .titulo_metodologia {
        font-size: 1.6rem;
    }
    
    .llamada_accion_programa {
        padding: 2.5rem 1.5rem;
    }
    
    .texto_llamada {
        font-size: 1.3rem;
    }
}

@media (max-width: 480px) {
    .titulo_programa_formativo {
        font-size: 1.8rem;
    }
    
    .descripcion_programa {
        font-size: 1.1rem;
    }
    
    .numero_modulo {
        font-size: 1.8rem;
    }
    
    .titulo_modulo {
        font-size: 1.3rem;
    }
    
    .texto_llamada {
        font-size: 1.2rem;
    }
    
    .enlace_inscripcion {
        padding: 0.8rem 1.5rem;
        font-size: 1rem;
    }
}












/* Sección de Formato de Formación */
.modalidades_aprendizaje {
    background-color: #21213a;
    padding: 5rem 2rem;
}

.contenedor_formato {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 4rem;
}

.introduccion_formato {
    text-align: center;
    max-width: 800px;
    margin: 0 auto;
}

.titulo_formato {
    font-size: 2.8rem;
    color: #7209b7;
    margin-bottom: 1.5rem;
    font-weight: 700;
}

.descripcion_formato {
    font-size: 1.2rem;
    line-height: 1.7;
    color: #f3e5f9;
}

.sistema_formativo {
    display: flex;
    flex-direction: column;
    gap: 4rem;
}

.distribucion_componentes {
    display: flex;
    flex-direction: column;
    gap: 3rem;
}

.componente_formativo {
    background-color: #2a2a45;
    border-radius: 12px;
    overflow: hidden;
    transition: transform 0.3s ease;
}

.componente_formativo:hover {
    transform: translateY(-5px);
}

.visual_componente {
    padding: 2rem;
    display: flex;
    align-items: center;
    gap: 1.5rem;
    background-color: #33335a;
}

.icono_componente {
    width: 80px;
    height: 80px;
    background-color: rgba(114, 9, 183, 0.1);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.figura_icono {
    width: 40px;
    height: 40px;
    position: relative;
}

/* Formas geométricas para los iconos en lugar de SVG o emojis */
.figura_clases::before,
.figura_clases::after {
    content: "";
    position: absolute;
    background-color: #7209b7;
}

.figura_clases::before {
    width: 36px;
    height: 24px;
    bottom: 0;
    left: 2px;
    border-radius: 4px;
}

.figura_clases::after {
    width: 24px;
    height: 16px;
    top: 0;
    left: 8px;
    border-radius: 4px;
}

.figura_coaching::before,
.figura_coaching::after {
    content: "";
    position: absolute;
    background-color: #7209b7;
}

.figura_coaching::before {
    width: 16px;
    height: 16px;
    top: 4px;
    left: 4px;
    border-radius: 50%;
}

.figura_coaching::after {
    width: 16px;
    height: 16px;
    bottom: 4px;
    right: 4px;
    border-radius: 50%;
}

.figura_acceso::before,
.figura_acceso::after {
    content: "";
    position: absolute;
    background-color: #7209b7;
}

.figura_acceso::before {
    width: 24px;
    height: 12px;
    top: 8px;
    left: 8px;
    border-radius: 6px 6px 0 0;
}

.figura_acceso::after {
    width: 12px;
    height: 16px;
    bottom: 8px;
    left: 14px;
    border-radius: 3px;
}

.titulo_componente {
    font-size: 1.8rem;
    color: #f3e5f9;
    font-weight: 600;
}

.detalle_componente {
    padding: 2rem;
}

.descripcion_componente {
    font-size: 1.1rem;
    line-height: 1.7;
    color: #e0e0f0;
    margin-bottom: 2rem;
}

.especificaciones_componente {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem;
}

.especificacion_item {
    background-color: #33335a;
    padding: 1.5rem;
    border-radius: 8px;
}

.titulo_especificacion {
    font-size: 1.3rem;
    color: #7209b7;
    margin-bottom: 0.8rem;
}

.descripcion_especificacion {
    font-size: 1.05rem;
    line-height: 1.6;
    color: #e0e0f0;
}

/* Estilo específico para cada componente */
.componente_digital .icono_componente {
    background-color: rgba(114, 9, 183, 0.1);
}

.componente_grupal .icono_componente {
    background-color: rgba(157, 78, 221, 0.1);
}

.componente_perpetuo .icono_componente {
    background-color: rgba(199, 125, 255, 0.1);
}

.calendario_programa {
    margin-top: 2rem;
    display: flex;
    flex-direction: column;
    gap: 3rem;
}

.cronograma_visual {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.ciclo_formativo {
    background-color: #2a2a45;
    padding: 1.5rem;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    position: relative;
    overflow: hidden;
}

.etiqueta_ciclo {
    font-size: 1.2rem;
    font-weight: 600;
    color: #7209b7;
    margin-bottom: 0.5rem;
}

.duracion_ciclo {
    font-size: 0.95rem;
    color: #b8b8d0;
    margin-bottom: 0.8rem;
}

.actividad_ciclo {
    font-size: 1.1rem;
    color: #f3e5f9;
}

.ciclo_uno::after {
    content: "";
    position: absolute;
    height: 100%;
    width: 4px;
    background-color: #7209b7;
    left: 0;
    top: 0;
}

.ciclo_dos::after {
    content: "";
    position: absolute;
    height: 100%;
    width: 4px;
    background-color: #9d4edd;
    left: 0;
    top: 0;
}

.ciclo_tres::after {
    content: "";
    position: absolute;
    height: 100%;
    width: 4px;
    background-color: #c77dff;
    left: 0;
    top: 0;
}

.ciclo_continuo::after {
    content: "";
    position: absolute;
    height: 100%;
    width: 4px;
    background-color: #e0aaff;
    left: 0;
    top: 0;
}

.inicio_programa {
    text-align: center;
    background-color: #33335a;
    padding: 2.5rem;
    border-radius: 12px;
    margin-top: 2rem;
}

.proxima_convocatoria {
    font-size: 1.5rem;
    color: #f3e5f9;
    margin-bottom: 0.8rem;
    font-weight: 600;
}

.plazas_disponibles {
    font-size: 1.1rem;
    color: #b8b8d0;
    margin-bottom: 1.5rem;
}

.enlace_proceso {
    display: inline-block;
    background-color: #7209b7;
    color: #f3e5f9;
    text-decoration: none;
    padding: 1rem 2rem;
    font-size: 1.1rem;
    font-weight: 600;
    border-radius: 10px;
    transition: all 0.3s ease;
}

.enlace_proceso:hover {
    background-color: #4c0677;
    transform: translateY(-3px);
}

/* Responsive Design */
@media (min-width: 992px) {
    .distribucion_componentes {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 2rem;
    }
    
    .componente_formativo {
        height: 100%;
        display: flex;
        flex-direction: column;
    }
    
    .detalle_componente {
        flex: 1;
        display: flex;
        flex-direction: column;
    }
    
    .especificaciones_componente {
        flex: 1;
        display: flex;
        flex-direction: column;
    }
    
    .cronograma_visual {
        flex-direction: row;
        height: 150px;
    }
    
    .ciclo_formativo {
        flex: 1;
        justify-content: center;
    }
    
    .ciclo_uno::after,
    .ciclo_dos::after,
    .ciclo_tres::after,
    .ciclo_continuo::after {
        width: 100%;
        height: 4px;
        left: 0;
        top: 0;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .titulo_formato {
        font-size: 2.5rem;
    }
    
    .especificaciones_componente {
        grid-template-columns: repeat(3, 1fr);
        gap: 1rem;
    }
    
    .cronograma_visual {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 1rem;
    }
}

@media (max-width: 767px) {
    .titulo_formato {
        font-size: 2.2rem;
    }
    
    .modalidades_aprendizaje {
        padding: 3rem 1.5rem;
    }
    
    .visual_componente {
        padding: 1.5rem;
    }
    
    .titulo_componente {
        font-size: 1.5rem;
    }
    
    .icono_componente {
        width: 60px;
        height: 60px;
    }
    
    .detalle_componente {
        padding: 1.5rem;
    }
    
    .descripcion_componente {
        font-size: 1rem;
    }
    
    .titulo_especificacion {
        font-size: 1.2rem;
    }
    
    .inicio_programa {
        padding: 2rem 1.5rem;
    }
    
    .proxima_convocatoria {
        font-size: 1.3rem;
    }
}

@media (max-width: 480px) {
    .titulo_formato {
        font-size: 1.8rem;
    }
    
    .descripcion_formato {
        font-size: 1.1rem;
    }
    
    .visual_componente {
        flex-direction: column;
        text-align: center;
        gap: 1rem;
    }
    
    .titulo_componente {
        font-size: 1.4rem;
    }
    
    .proxima_convocatoria {
        font-size: 1.2rem;
    }
    
    .enlace_proceso {
        padding: 0.8rem 1.5rem;
        font-size: 1rem;
    }
}











/* Sección de Pie de Página */
.cierre_sitio {
    background-color: #1a1a2e;
    padding: 4rem 2rem 2rem;
}

.contenedor_cierre {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 3rem;
}

.informacion_legal {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 2rem;
}

.identidad_marca {
    margin-bottom: 1rem;
}

.nombre_organizacion {
    font-size: 1.8rem;
    color: #7209b7;
    margin-bottom: 0.5rem;
    font-weight: 700;
}

.eslogan_organizacion {
    font-size: 1.1rem;
    color: #f3e5f9;
    font-style: italic;
}

.contacto_directo {
    margin-bottom: 1.5rem;
}

.etiqueta_contacto {
    font-size: 1.1rem;
    color: #b8b8d0;
    margin-bottom: 0.5rem;
}

.email_contacto {
    font-size: 1.3rem;
    color: #f3e5f9;
    text-decoration: none;
    transition: color 0.3s ease;
    position: relative;
    display: inline-block;
}

.email_contacto::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 2px;
    background-color: #7209b7;
    bottom: -5px;
    left: 0;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.3s ease;
}

.email_contacto:hover {
    color: #7209b7;
}

.email_contacto:hover::after {
    transform: scaleX(1);
}

.navegacion_secundaria {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

.enlaces_legales {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.enlace_legal {
    color: #f3e5f9;
    text-decoration: none;
    font-size: 1.1rem;
    transition: color 0.3s ease;
    position: relative;
    display: inline-block;
    margin-bottom: 0.5rem;
    width: fit-content;
}

.enlace_legal::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 2px;
    background-color: #7209b7;
    bottom: -5px;
    left: 0;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.3s ease;
}

.enlace_legal:hover {
    color: #7209b7;
}

.enlace_legal:hover::after {
    transform: scaleX(1);
}

.acreditaciones {
    margin-top: 1rem;
}

.certificacion {
    font-size: 0.95rem;
    color: #b8b8d0;
    margin-bottom: 0.5rem;
}

.derechos_autor {
    border-top: 1px solid rgba(114, 9, 183, 0.2);
    padding-top: 1.5rem;
    text-align: center;
}

.texto_derechos {
    font-size: 1rem;
    color: #f3e5f9;
    margin-bottom: 1rem;
}

.aviso_legal {
    font-size: 0.9rem;
    color: #a8a8b3;
    max-width: 800px;
    margin: 0 auto;
    line-height: 1.6;
}

/* Responsive Design */
@media (min-width: 992px) {
    .informacion_legal {
        flex-direction: row;
        align-items: center;
    }
    
    .navegacion_secundaria {
        flex-direction: row;
        justify-content: space-between;
        align-items: flex-start;
    }
    
    .enlaces_legales {
        flex-direction: row;
        gap: 2rem;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .navegacion_secundaria {
        flex-direction: row;
        justify-content: space-between;
        align-items: flex-start;
    }
}

@media (max-width: 767px) {
    .cierre_sitio {
        padding: 3rem 1.5rem 1.5rem;
    }
    
    .nombre_organizacion {
        font-size: 1.6rem;
    }
    
    .email_contacto {
        font-size: 1.2rem;
    }
}

@media (max-width: 480px) {
    .nombre_organizacion {
        font-size: 1.4rem;
    }
    
    .eslogan_organizacion {
        font-size: 1rem;
    }
    
    .email_contacto {
        font-size: 1.1rem;
    }
    
    .texto_derechos {
        font-size: 0.9rem;
    }
}










/* Menú Superior */
.navegacion_principal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background-color: rgba(26, 26, 46, 0.95);
    backdrop-filter: blur(10px);
    z-index: 1000;
    padding: 1rem 2rem;
}

.contenedor_navegacion {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.logo_sitio {
    flex-grow: 1;
}

.enlace_inicio {
    color: #f3e5f9;
    text-decoration: none;
    font-size: 1.3rem;
    font-weight: 700;
    transition: color 0.3s ease;
}

.enlace_inicio:hover {
    color: #7209b7;
}

.accion_contacto {
    margin-left: 2rem;
}

.boton_contacto {
    display: inline-block;
    background-color: #7209b7;
    color: #f3e5f9;
    text-decoration: none;
    padding: 0.7rem 1.5rem;
    font-size: 1rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
}

.boton_contacto:hover {
    background-color: #4c0677;
    transform: translateY(-3px);
}

/* Ajuste para el header principal */
.entrada_principal {
    padding-top: 5rem;
}

/* Responsive Design */
@media (max-width: 767px) {
    .navegacion_principal {
        padding: 0.8rem 1.5rem;
    }
    
    .enlace_inicio {
        font-size: 1.1rem;
    }
    
    .boton_contacto {
        padding: 0.5rem 1rem;
        font-size: 0.9rem;
    }
}

@media (max-width: 480px) {
    .navegacion_principal {
        padding: 0.7rem 1rem;
    }
    
    .enlace_inicio {
        font-size: 1rem;
    }
    
    .boton_contacto {
        padding: 0.4rem 0.8rem;
        font-size: 0.85rem;
    }
}







/* Base Styles */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: Arial, sans-serif;
    background-color: #1a1a2e;
    color: #f3e5f9;
    line-height: 1.6;
    font-size: 16px;
}

/* Menú Superior */
.navegacion_principal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background-color: rgba(26, 26, 46, 0.95);
    backdrop-filter: blur(10px);
    z-index: 1000;
    padding: 1rem 2rem;
}

.contenedor_navegacion {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.logo_sitio {
    flex-grow: 1;
}

.enlace_inicio {
    color: #f3e5f9;
    text-decoration: none;
    font-size: 1.3rem;
    font-weight: 700;
    transition: color 0.3s ease;
}

.enlace_inicio:hover {
    color: #7209b7;
}

.accion_contacto {
    margin-left: 2rem;
}

.boton_contacto {
    display: inline-block;
    background-color: #7209b7;
    color: #f3e5f9;
    text-decoration: none;
    padding: 0.7rem 1.5rem;
    font-size: 1rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
}

.boton_contacto:hover {
    background-color: #4c0677;
    transform: translateY(-3px);
}

/* Cabecera de Profesores */
.cabecera_profesores {
    padding: 8rem 2rem 4rem;
    background-color: #21213a;
    text-align: center;
}

.contenedor_cabecera {
    max-width: 900px;
    margin: 0 auto;
}

.titulo_seccion {
    font-size: 3.2rem;
    color: #7209b7;
    margin-bottom: 1.5rem;
    font-weight: 800;
}

.descripcion_seccion {
    font-size: 1.3rem;
    color: #f3e5f9;
    line-height: 1.7;
}

/* Galería de Profesores */
.galeria_profesores {
    padding: 5rem 2rem;
    background-color: #1a1a2e;
}

.contenedor_profesores {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 4rem;
}

.tarjeta_profesor {
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
    background-color: #2a2a4a;
    border-radius: 16px;
    overflow: hidden;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.tarjeta_profesor:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 40px rgba(114, 9, 183, 0.2);
}

.imagen_profesor {
    height: 250px;
    overflow: hidden;
    position: relative;
}

.foto_profesor {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    transition: transform 0.5s ease;
}

.tarjeta_profesor:hover .foto_profesor {
    transform: scale(1.05);
}

.perfil_profesor {
    padding: 0 2.5rem 2.5rem;
}

.identidad_profesor {
    margin-bottom: 1.5rem;
}

.nombre_profesor {
    font-size: 2.2rem;
    color: #7209b7;
    margin-bottom: 0.5rem;
    font-weight: 700;
}

.cargo_profesor {
    font-size: 1.1rem;
    color: #b8b8d0;
    font-style: italic;
}

.biografia_profesor {
    display: flex;
    flex-direction: column;
    gap: 1.8rem;
}

.resumen_biografia {
    font-size: 1.1rem;
    line-height: 1.7;
    color: #f3e5f9;
}

.logros_profesor {
    background-color: #33335a;
    padding: 2rem;
    border-radius: 12px;
}

.titulo_logros {
    font-size: 1.4rem;
    color: #7209b7;
    margin-bottom: 1rem;
    font-weight: 600;
}

.lista_logros {
    list-style-type: none;
}

.logro {
    padding: 0.7rem 0;
    font-size: 1.05rem;
    color: #e0e0f0;
    position: relative;
    padding-left: 1.5rem;
}

.logro::before {
    content: "•";
    color: #7209b7;
    position: absolute;
    left: 0;
    font-size: 1.2rem;
}

.enfoque_profesor {
    padding: 1.5rem;
    background-color: #33335a;
    border-radius: 12px;
}

.cita_profesor {
    font-size: 1.1rem;
    line-height: 1.7;
    color: #f3e5f9;
    font-style: italic;
    position: relative;
}



/* Llamada a la acción */
.llamada_accion_profesores {
    max-width: 1000px;
    margin: 5rem auto 0;
}

.contenedor_llamada {
    background-color: #33335a;
    padding: 3rem;
    border-radius: 16px;
    text-align: center;
    background-image: radial-gradient(circle at top right, rgba(114, 9, 183, 0.2) 0%, rgba(26, 26, 46, 0) 70%);
}

.titulo_llamada {
    font-size: 2.2rem;
    color: #f3e5f9;
    margin-bottom: 1.5rem;
    font-weight: 700;
}

.descripcion_llamada {
    font-size: 1.2rem;
    color: #e0e0f0;
    margin-bottom: 2rem;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

.enlace_programa {
    display: inline-block;
    background-color: #7209b7;
    color: #f3e5f9;
    text-decoration: none;
    padding: 1rem 2rem;
    font-size: 1.1rem;
    font-weight: 600;
    border-radius: 10px;
    transition: all 0.3s ease;
}

.enlace_programa:hover {
    background-color: #4c0677;
    transform: translateY(-3px);
}

/* Sección de Metodología */
.metodologia_docente {
    padding: 5rem 2rem;
    background-color: #242445;
}

.contenedor_metodologia {
    max-width: 1200px;
    margin: 0 auto;
    text-align: center;
}

.titulo_metodologia {
    font-size: 2.5rem;
    color: #7209b7;
    margin-bottom: 3rem;
    font-weight: 700;
}

.pilares_metodologia {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

.pilar_docente {
    background-color: #33335a;
    padding: 2.5rem;
    border-radius: 12px;
    transition: transform 0.3s ease;
}

.pilar_docente:hover {
    transform: translateY(-5px);
}

.titulo_pilar {
    font-size: 1.8rem;
    color: #7209b7;
    margin-bottom: 1rem;
    font-weight: 600;
}

.descripcion_pilar {
    font-size: 1.1rem;
    line-height: 1.7;
    color: #f3e5f9;
}

/* Pie de Página */
.cierre_sitio {
    background-color: #1a1a2e;
    padding: 4rem 2rem 2rem;
}

.contenedor_cierre {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 3rem;
}

.informacion_legal {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 2rem;
}

.identidad_marca {
    margin-bottom: 1rem;
}

.nombre_organizacion {
    font-size: 1.8rem;
    color: #7209b7;
    margin-bottom: 0.5rem;
    font-weight: 700;
}

.eslogan_organizacion {
    font-size: 1.1rem;
    color: #f3e5f9;
    font-style: italic;
}

.contacto_directo {
    margin-bottom: 1.5rem;
}

.email_contacto {
    font-size: 1.3rem;
    color: #f3e5f9;
    text-decoration: none;
    transition: color 0.3s ease;
    position: relative;
    display: inline-block;
}

.email_contacto::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 2px;
    background-color: #7209b7;
    bottom: -5px;
    left: 0;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.3s ease;
}

.email_contacto:hover {
    color: #7209b7;
}

.email_contacto:hover::after {
    transform: scaleX(1);
}

.navegacion_secundaria {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

.enlaces_legales {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.enlace_legal {
    color: #f3e5f9;
    text-decoration: none;
    font-size: 1.1rem;
    transition: color 0.3s ease;
    position: relative;
    display: inline-block;
    margin-bottom: 0.5rem;
    width: fit-content;
}

.enlace_legal::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 2px;
    background-color: #7209b7;
    bottom: -5px;
    left: 0;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.3s ease;
}

.enlace_legal:hover {
    color: #7209b7;
}

.enlace_legal:hover::after {
    transform: scaleX(1);
}

.acreditaciones {
    margin-top: 1rem;
}

.certificacion {
    font-size: 0.95rem;
    color: #b8b8d0;
    margin-bottom: 0.5rem;
}

.derechos_autor {
    border-top: 1px solid rgba(114, 9, 183, 0.2);
    padding-top: 1.5rem;
    text-align: center;
}

.texto_derechos {
    font-size: 1rem;
    color: #f3e5f9;
    margin-bottom: 1rem;
}

.aviso_legal {
    font-size: 0.9rem;
    color: #a8a8b3;
    max-width: 800px;
    margin: 0 auto;
    line-height: 1.6;
}

/* Efectos visuales adicionales */
.tarjeta_profesor:nth-child(1) {
    border-top: 4px solid #7209b7;
}

.tarjeta_profesor:nth-child(2) {
    border-top: 4px solid #9d4edd;
}

.tarjeta_profesor:nth-child(3) {
    border-top: 4px solid #c77dff;
}

.tarjeta_profesor:nth-child(4) {
    border-top: 4px solid #e0aaff;
}

/* Responsive Design */
@media (min-width: 992px) {
    .tarjeta_profesor {
        flex-direction: row;
        align-items: stretch;
    }
    
    .imagen_profesor {
        width: 35%;
        height: auto;
    }
    
    .perfil_profesor {
        width: 65%;
        padding: 2.5rem;
    }
    
    .pilares_metodologia {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 2rem;
    }
    
    .informacion_legal {
        flex-direction: row;
        align-items: center;
    }
    
    .navegacion_secundaria {
        flex-direction: row;
        justify-content: space-between;
        align-items: flex-start;
    }
    
    .enlaces_legales {
        flex-direction: row;
        gap: 2rem;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .titulo_seccion {
        font-size: 2.8rem;
    }
    
    .descripcion_seccion {
        font-size: 1.2rem;
    }
    
    .navegacion_secundaria {
        flex-direction: row;
        justify-content: space-between;
        align-items: flex-start;
    }
    
    .pilares_metodologia {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 1.5rem;
    }
}

@media (max-width: 767px) {
    .titulo_seccion {
        font-size: 2.4rem;
    }
    
    .descripcion_seccion {
        font-size: 1.1rem;
    }
    
    .cabecera_profesores {
        padding: 6rem 1.5rem 3rem;
    }
    
    .galeria_profesores,
    .metodologia_docente {
        padding: 3rem 1.5rem;
    }
    
    .nombre_profesor {
        font-size: 1.8rem;
    }
    
    .titulo_llamada {
        font-size: 1.8rem;
    }
    
    .descripcion_llamada {
        font-size: 1.1rem;
    }
    
    .contenedor_llamada {
        padding: 2rem 1.5rem;
    }
    
    .titulo_metodologia {
        font-size: 2rem;
    }
    
    .pilar_docente {
        padding: 1.8rem;
    }
    
    .titulo_pilar {
        font-size: 1.5rem;
    }
}

@media (max-width: 480px) {
    .navegacion_principal {
        padding: 0.7rem 1rem;
    }
    
    .enlace_inicio {
        font-size: 1rem;
    }
    
    .boton_contacto {
        padding: 0.4rem 0.8rem;
        font-size: 0.85rem;
    }
    
    .titulo_seccion {
        font-size: 2rem;
    }
    
    .descripcion_seccion {
        font-size: 1rem;
    }
    
    .nombre_profesor {
        font-size: 1.6rem;
    }
    
    .cargo_profesor {
        font-size: 1rem;
    }
    
    .titulo_logros {
        font-size: 1.3rem;
    }
    
    .logro, .resumen_biografia, .cita_profesor {
        font-size: 1rem;
    }
    
    .titulo_llamada {
        font-size: 1.6rem;
    }
    
    .descripcion_llamada {
        font-size: 1rem;
    }
    
    .enlace_programa {
        padding: 0.8rem 1.5rem;
        font-size: 1rem;
    }
    
    .titulo_metodologia {
        font-size: 1.8rem;
    }
    
    .titulo_pilar {
        font-size: 1.4rem;
    }
    
    .descripcion_pilar {
        font-size: 1rem;
    }
    
    .perfil_profesor {
        padding: 0 1.5rem 1.5rem;
    }
    
    .logros_profesor, .enfoque_profesor {
        padding: 1.5rem;
    }
}










/* Base Styles */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: Arial, sans-serif;
    background-color: #1a1a2e;
    color: #f3e5f9;
    line-height: 1.6;
    font-size: 16px;
}

/* Menú Superior */
.navegacion_principal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background-color: rgba(26, 26, 46, 0.95);
    backdrop-filter: blur(10px);
    z-index: 1000;
    padding: 1rem 2rem;
}

.contenedor_navegacion {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.logo_sitio {
    flex-grow: 1;
}

.enlace_inicio {
    color: #f3e5f9;
    text-decoration: none;
    font-size: 1.3rem;
    font-weight: 700;
    transition: color 0.3s ease;
}

.enlace_inicio:hover {
    color: #7209b7;
}

.accion_contacto {
    margin-left: 2rem;
}

.boton_contacto {
    display: inline-block;
    background-color: #7209b7;
    color: #f3e5f9;
    text-decoration: none;
    padding: 0.7rem 1.5rem;
    font-size: 1rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
}

.boton_contacto:hover {
    background-color: #4c0677;
    transform: translateY(-3px);
}

/* Cabecera de Contacto */
.cabecera_contacto {
    padding: 9rem 2rem 3rem;
    background-color: #21213a;
    text-align: center;
    background-image: radial-gradient(circle at center, rgba(114, 9, 183, 0.2) 0%, rgba(26, 26, 46, 0) 70%);
}

.contenedor_cabecera {
    max-width: 900px;
    margin: 0 auto;
}

.titulo_seccion {
    font-size: 3.5rem;
    color: #7209b7;
    font-weight: 800;
    letter-spacing: -1px;
}

/* Información de Contacto */
.info_contacto {
    padding: 4rem 2rem;
    background-color: #242445;
}

.contenedor_info {
    max-width: 1000px;
    margin: 0 auto;
}

.datos_contacto {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 2rem;
    text-align: center;
}

.ubicacion_fisica,
.telefono_contacto,
.email_institucional,
.horario_atencion {
    background-color: #2a2a50;
    padding: 2rem;
    border-radius: 12px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.ubicacion_fisica:hover,
.telefono_contacto:hover,
.email_institucional:hover,
.horario_atencion:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.2);
}

.titulo_dato {
    font-size: 1.5rem;
    color: #7209b7;
    margin-bottom: 1rem;
    font-weight: 600;
    position: relative;
    display: inline-block;
}

.detalle_dato {
    font-size: 1.1rem;
    color: #f3e5f9;
    line-height: 1.5;
}

/* Mapa y Formulario */
.contacto_interactivo {
    padding: 4rem 2rem;
    background-color: #1a1a2e;
}

.contenedor_contacto {
    max-width: 1200px;
    margin: 0 auto;
}

.bloques_contacto {
    display: flex;
    flex-direction: column;
    gap: 3rem;
}

.bloque_mapa, 
.bloque_formulario {
    flex: 1;
}

.marco_mapa {
    height: 350px;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}

.cabecera_formulario {
    margin-bottom: 2rem;
}

.titulo_formulario {
    font-size: 2.2rem;
    color: #7209b7;
    margin-bottom: 1rem;
    font-weight: 700;
}

.descripcion_formulario {
    font-size: 1.1rem;
    color: #e0e0f0;
    line-height: 1.7;
}

.formulario_contacto {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    background-color: #242445;
    padding: 2.5rem;
    border-radius: 12px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
}

.campo_formulario {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.etiqueta_campo {
    font-size: 1rem;
    color: #b8b8d0;
    font-weight: 500;
}

.entrada_campo {
    padding: 1rem;
    font-size: 1.05rem;
    color: #f3e5f9;
    background-color: #33335a;
    border: 1px solid rgba(114, 9, 183, 0.3);
    border-radius: 8px;
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.entrada_campo:focus {
    outline: none;
    border-color: #7209b7;
    box-shadow: 0 0 0 2px rgba(114, 9, 183, 0.2);
}

.entrada_mensaje {
    min-height: 150px;
    resize: vertical;
}

.campo_checkbox {
    flex-direction: row;
    align-items: center;
    gap: 0.8rem;
}

.checkbox_campo {
    width: 20px;
    height: 20px;
    accent-color: #7209b7;
}

.etiqueta_checkbox {
    font-size: 0.95rem;
    color: #b8b8d0;
}

.enlace_formulario {
    color: #7209b7;
    text-decoration: none;
    transition: color 0.3s ease;
}

.enlace_formulario:hover {
    color: #9d4edd;
    text-decoration: underline;
}

.acciones_formulario {
    margin-top: 1rem;
    display: flex;
    justify-content: flex-end;
}

.boton_enviar {
    background-color: #7209b7;
    color: #f3e5f9;
    border: none;
    padding: 1rem 2.5rem;
    font-size: 1.1rem;
    font-weight: 600;
    border-radius: 10px;
    cursor: pointer;
    transition: all 0.3s ease;
}

.boton_enviar:hover {
    background-color: #4c0677;
    transform: translateY(-3px);
}

/* Pie de Página */
.cierre_sitio {
    background-color: #1a1a2e;
    padding: 4rem 2rem 2rem;
    border-top: 1px solid rgba(114, 9, 183, 0.2);
}

.contenedor_cierre {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 3rem;
}

.informacion_legal {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 2rem;
}

.identidad_marca {
    margin-bottom: 1rem;
}

.nombre_organizacion {
    font-size: 1.8rem;
    color: #7209b7;
    margin-bottom: 0.5rem;
    font-weight: 700;
}

.eslogan_organizacion {
    font-size: 1.1rem;
    color: #f3e5f9;
    font-style: italic;
}

.contacto_directo {
    margin-bottom: 1.5rem;
}

.email_contacto {
    font-size: 1.3rem;
    color: #f3e5f9;
    text-decoration: none;
    transition: color 0.3s ease;
    position: relative;
    display: inline-block;
}

.email_contacto::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 2px;
    background-color: #7209b7;
    bottom: -5px;
    left: 0;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.3s ease;
}

.email_contacto:hover {
    color: #7209b7;
}

.email_contacto:hover::after {
    transform: scaleX(1);
}

.navegacion_secundaria {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

.enlaces_legales {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.enlace_legal {
    color: #f3e5f9;
    text-decoration: none;
    font-size: 1.1rem;
    transition: color 0.3s ease;
    position: relative;
    display: inline-block;
    margin-bottom: 0.5rem;
    width: fit-content;
}

.enlace_legal::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 2px;
    background-color: #7209b7;
    bottom: -5px;
    left: 0;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.3s ease;
}

.enlace_legal:hover {
    color: #7209b7;
}

.enlace_legal:hover::after {
    transform: scaleX(1);
}

.acreditaciones {
    margin-top: 1rem;
}

.certificacion {
    font-size: 0.95rem;
    color: #b8b8d0;
    margin-bottom: 0.5rem;
}

.derechos_autor {
    padding-top: 1.5rem;
    text-align: center;
}

.texto_derechos {
    font-size: 1rem;
    color: #f3e5f9;
    margin-bottom: 1rem;
}

.aviso_legal {
    font-size: 0.9rem;
    color: #a8a8b3;
    max-width: 800px;
    margin: 0 auto;
    line-height: 1.6;
}

/* Responsive Design */
@media (min-width: 992px) {
    .datos_contacto {
        grid-template-columns: repeat(4, 1fr);
        gap: 1.5rem;
    }
    
    .bloques_contacto {
        flex-direction: row;
    }
    
    .informacion_legal {
        flex-direction: row;
        align-items: center;
    }
    
    .navegacion_secundaria {
        flex-direction: row;
        justify-content: space-between;
        align-items: flex-start;
    }
    
    .enlaces_legales {
        flex-direction: row;
        gap: 2rem;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .datos_contacto {
        grid-template-columns: repeat(2, 1fr);
        gap: 1.5rem;
    }
    
    .navegacion_secundaria {
        flex-direction: row;
        justify-content: space-between;
        align-items: flex-start;
    }
}

@media (max-width: 767px) {
    .titulo_seccion {
        font-size: 2.8rem;
    }
    
    .cabecera_contacto {
        padding: 7rem 1.5rem 2.5rem;
    }
    
    .info_contacto,
    .contacto_interactivo {
        padding: 3rem 1.5rem;
    }
    
    .titulo_dato {
        font-size: 1.3rem;
    }
    
    .detalle_dato {
        font-size: 1rem;
    }
    
    .titulo_formulario {
        font-size: 1.8rem;
    }
    
    .descripcion_formulario {
        font-size: 1rem;
    }
    
    .formulario_contacto {
        padding: 2rem 1.5rem;
    }
    
    .entrada_campo {
        padding: 0.8rem;
        font-size: 1rem;
    }
    
    .boton_enviar {
        padding: 0.8rem 2rem;
        font-size: 1rem;
    }
}

@media (max-width: 480px) {
    .titulo_seccion {
        font-size: 2.2rem;
    }
    
    .navegacion_principal {
        padding: 0.7rem 1rem;
    }
    
    .enlace_inicio {
        font-size: 1rem;
    }
    
    .boton_contacto {
        padding: 0.5rem 1rem;
        font-size: 0.9rem;
    }
    
    .titulo_dato {
        font-size: 1.2rem;
    }
    
    .acciones_formulario {
        justify-content: center;
    }
    
    .boton_enviar {
        width: 100%;
    }
}










/* Base Styles */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: Arial, sans-serif;
    background-color: #1a1a2e;
    color: #f3e5f9;
    line-height: 1.6;
    font-size: 16px;
}

/* Menú Superior */
.navegacion_principal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background-color: rgba(26, 26, 46, 0.95);
    backdrop-filter: blur(10px);
    z-index: 1000;
    padding: 1rem 2rem;
}

.contenedor_navegacion {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.logo_sitio {
    flex-grow: 1;
}

.enlace_inicio {
    color: #f3e5f9;
    text-decoration: none;
    font-size: 1.3rem;
    font-weight: 700;
    transition: color 0.3s ease;
}

.enlace_inicio:hover {
    color: #7209b7;
}

.accion_contacto {
    margin-left: 2rem;
}

.boton_contacto {
    display: inline-block;
    background-color: #7209b7;
    color: #f3e5f9;
    text-decoration: none;
    padding: 0.7rem 1.5rem;
    font-size: 1rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
}

.boton_contacto:hover {
    background-color: #4c0677;
    transform: translateY(-3px);
}

/* Cabecera de Contacto */
.cabecera_contacto {
    padding: 9rem 2rem 3rem;
    background-color: #21213a;
    text-align: center;
    background-image: radial-gradient(circle at center, rgba(114, 9, 183, 0.2) 0%, rgba(26, 26, 46, 0) 70%);
}

.contenedor_cabecera {
    max-width: 900px;
    margin: 0 auto;
}

.titulo_seccion {
    font-size: 3.5rem;
    color: #7209b7;
    font-weight: 800;
    letter-spacing: -1px;
}

/* Información de Contacto */
.info_contacto {
    padding: 4rem 2rem;
    background-color: #242445;
}

.contenedor_info {
    max-width: 1000px;
    margin: 0 auto;
}

.datos_contacto {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 2rem;
    text-align: center;
}

.ubicacion_fisica,
.telefono_contacto,
.email_institucional,
.horario_atencion {
    background-color: #2a2a50;
    padding: 2rem;
    border-radius: 12px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.ubicacion_fisica:hover,
.telefono_contacto:hover,
.email_institucional:hover,
.horario_atencion:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.2);
}

.titulo_dato {
    font-size: 1.5rem;
    color: #7209b7;
    margin-bottom: 1rem;
    font-weight: 600;
    position: relative;
    display: inline-block;
}

.detalle_dato {
    font-size: 1.1rem;
    color: #f3e5f9;
    line-height: 1.5;
}

/* Mapa y Formulario */
.contacto_interactivo {
    padding: 4rem 2rem;
    background-color: #1a1a2e;
}

.contenedor_contacto {
    max-width: 1200px;
    margin: 0 auto;
}

.bloques_contacto {
    display: flex;
    flex-direction: column;
    gap: 3rem;
}

.bloque_mapa, 
.bloque_formulario {
    flex: 1;
}

.marco_mapa {
    height: 350px;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}

.cabecera_formulario {
    margin-bottom: 2rem;
}

.titulo_formulario {
    font-size: 2.2rem;
    color: #7209b7;
    margin-bottom: 1rem;
    font-weight: 700;
}

.descripcion_formulario {
    font-size: 1.1rem;
    color: #e0e0f0;
    line-height: 1.7;
}

.formulario_contacto {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    background-color: #242445;
    padding: 2.5rem;
    border-radius: 12px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
}

.campo_formulario {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.etiqueta_campo {
    font-size: 1rem;
    color: #b8b8d0;
    font-weight: 500;
}

.entrada_campo {
    padding: 1rem;
    font-size: 1.05rem;
    color: #f3e5f9;
    background-color: #33335a;
    border: 1px solid rgba(114, 9, 183, 0.3);
    border-radius: 8px;
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.entrada_campo:focus {
    outline: none;
    border-color: #7209b7;
    box-shadow: 0 0 0 2px rgba(114, 9, 183, 0.2);
}

.entrada_mensaje {
    min-height: 150px;
    resize: vertical;
}

.campo_checkbox {
    flex-direction: row;
    align-items: center;
    gap: 0.8rem;
}

.checkbox_campo {
    width: 20px;
    height: 20px;
    accent-color: #7209b7;
}

.etiqueta_checkbox {
    font-size: 0.95rem;
    color: #b8b8d0;
}

.enlace_formulario {
    color: #7209b7;
    text-decoration: none;
    transition: color 0.3s ease;
}

.enlace_formulario:hover {
    color: #9d4edd;
    text-decoration: underline;
}

.acciones_formulario {
    margin-top: 1rem;
    display: flex;
    justify-content: flex-end;
}

.boton_enviar {
    background-color: #7209b7;
    color: #f3e5f9;
    border: none;
    padding: 1rem 2.5rem;
    font-size: 1.1rem;
    font-weight: 600;
    border-radius: 10px;
    cursor: pointer;
    transition: all 0.3s ease;
}

.boton_enviar:hover {
    background-color: #4c0677;
    transform: translateY(-3px);
}

/* Pie de Página */
.cierre_sitio {
    background-color: #1a1a2e;
    padding: 4rem 2rem 2rem;
    border-top: 1px solid rgba(114, 9, 183, 0.2);
}

.contenedor_cierre {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 3rem;
}

.informacion_legal {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 2rem;
}

.identidad_marca {
    margin-bottom: 1rem;
}

.nombre_organizacion {
    font-size: 1.8rem;
    color: #7209b7;
    margin-bottom: 0.5rem;
    font-weight: 700;
}

.eslogan_organizacion {
    font-size: 1.1rem;
    color: #f3e5f9;
    font-style: italic;
}

.contacto_directo {
    margin-bottom: 1.5rem;
}

.email_contacto {
    font-size: 1.3rem;
    color: #f3e5f9;
    text-decoration: none;
    transition: color 0.3s ease;
    position: relative;
    display: inline-block;
}

.email_contacto::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 2px;
    background-color: #7209b7;
    bottom: -5px;
    left: 0;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.3s ease;
}

.email_contacto:hover {
    color: #7209b7;
}

.email_contacto:hover::after {
    transform: scaleX(1);
}

.navegacion_secundaria {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

.enlaces_legales {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.enlace_legal {
    color: #f3e5f9;
    text-decoration: none;
    font-size: 1.1rem;
    transition: color 0.3s ease;
    position: relative;
    display: inline-block;
    margin-bottom: 0.5rem;
    width: fit-content;
}

.enlace_legal::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 2px;
    background-color: #7209b7;
    bottom: -5px;
    left: 0;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.3s ease;
}

.enlace_legal:hover {
    color: #7209b7;
}

.enlace_legal:hover::after {
    transform: scaleX(1);
}

.acreditaciones {
    margin-top: 1rem;
}

.certificacion {
    font-size: 0.95rem;
    color: #b8b8d0;
    margin-bottom: 0.5rem;
}

.derechos_autor {
    padding-top: 1.5rem;
    text-align: center;
}

.texto_derechos {
    font-size: 1rem;
    color: #f3e5f9;
    margin-bottom: 1rem;
}

.aviso_legal {
    font-size: 0.9rem;
    color: #a8a8b3;
    max-width: 800px;
    margin: 0 auto;
    line-height: 1.6;
}

/* Responsive Design */
@media (min-width: 992px) {
    .datos_contacto {
        grid-template-columns: repeat(4, 1fr);
        gap: 1.5rem;
    }
    
    .bloques_contacto {
        flex-direction: row;
    }
    
    .informacion_legal {
        flex-direction: row;
        align-items: center;
    }
    
    .navegacion_secundaria {
        flex-direction: row;
        justify-content: space-between;
        align-items: flex-start;
    }
    
    .enlaces_legales {
        flex-direction: row;
        gap: 2rem;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .datos_contacto {
        grid-template-columns: repeat(2, 1fr);
        gap: 1.5rem;
    }
    
    .navegacion_secundaria {
        flex-direction: row;
        justify-content: space-between;
        align-items: flex-start;
    }
}

@media (max-width: 767px) {
    .titulo_seccion {
        font-size: 2.8rem;
    }
    
    .cabecera_contacto {
        padding: 7rem 1.5rem 2.5rem;
    }
    
    .info_contacto,
    .contacto_interactivo {
        padding: 3rem 1.5rem;
    }
    
    .titulo_dato {
        font-size: 1.3rem;
    }
    
    .detalle_dato {
        font-size: 1rem;
    }
    
    .titulo_formulario {
        font-size: 1.8rem;
    }
    
    .descripcion_formulario {
        font-size: 1rem;
    }
    
    .formulario_contacto {
        padding: 2rem 1.5rem;
    }
    
    .entrada_campo {
        padding: 0.8rem;
        font-size: 1rem;
    }
    
    .boton_enviar {
        padding: 0.8rem 2rem;
        font-size: 1rem;
    }
}

@media (max-width: 480px) {
    .titulo_seccion {
        font-size: 2.2rem;
    }
    
    .navegacion_principal {
        padding: 0.7rem 1rem;
    }
    
    .enlace_inicio {
        font-size: 1rem;
    }
    
    .boton_contacto {
        padding: 0.5rem 1rem;
        font-size: 0.9rem;
    }
    
    .titulo_dato {
        font-size: 1.2rem;
    }
    
    .acciones_formulario {
        justify-content: center;
    }
    
    .boton_enviar {
        width: 100%;
    }
}










/* Base Styles */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: Arial, sans-serif;
    background-color: #1a1a2e;
    color: #f3e5f9;
    line-height: 1.6;
    font-size: 16px;
}

/* Menú Superior */
.navegacion_principal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background-color: rgba(26, 26, 46, 0.95);
    backdrop-filter: blur(10px);
    z-index: 1000;
    padding: 1rem 2rem;
}

.contenedor_navegacion {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.logo_sitio {
    flex-grow: 1;
}

.enlace_inicio {
    color: #f3e5f9;
    text-decoration: none;
    font-size: 1.3rem;
    font-weight: 700;
    transition: color 0.3s ease;
}

.enlace_inicio:hover {
    color: #7209b7;
}

.accion_contacto {
    margin-left: 2rem;
}

.boton_contacto {
    display: inline-block;
    background-color: #7209b7;
    color: #f3e5f9;
    text-decoration: none;
    padding: 0.7rem 1.5rem;
    font-size: 1rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
}

.boton_contacto:hover {
    background-color: #4c0677;
    transform: translateY(-3px);
}

/* Cabecera de Cookies */
.cabecera_cookies {
    padding: 8rem 2rem 3rem;
    background-color: #21213a;
    text-align: center;
}

.contenedor_cabecera {
    max-width: 900px;
    margin: 0 auto;
}

.titulo_seccion {
    font-size: 3rem;
    color: #7209b7;
    margin-bottom: 1rem;
    font-weight: 800;
}

/* Contenido Principal */
.contenido_cookies {
    padding: 4rem 2rem;
    background-color: #1a1a2e;
}

.contenedor_cookies {
    max-width: 900px;
    margin: 0 auto;
}

.seccion_cookies {
    background-color: #242445;
    padding: 3rem;
    border-radius: 12px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
}

.introduccion_cookies {
    margin-bottom: 2.5rem;
}

.texto_introduccion {
    font-size: 1.2rem;
    line-height: 1.7;
    color: #f3e5f9;
}

.definicion_cookies,
.tipos_cookies,
.gestion_cookies,
.actualizacion_politica {
    margin-bottom: 2.5rem;
}

.titulo_apartado {
    font-size: 1.8rem;
    color: #7209b7;
    margin-bottom: 1.2rem;
    font-weight: 700;
}

.texto_apartado {
    font-size: 1.1rem;
    line-height: 1.7;
    color: #e0e0f0;
    margin-bottom: 1.5rem;
}

.categoria_cookies {
    margin-bottom: 1.8rem;
}

.subtitulo_apartado {
    font-size: 1.4rem;
    color: #9d4edd;
    margin-bottom: 0.8rem;
    font-weight: 600;
}

.lista_navegadores {
    list-style-type: none;
    margin-left: 1rem;
}

.item_navegador {
    padding: 0.5rem 0;
    font-size: 1.1rem;
    color: #e0e0f0;
    position: relative;
    padding-left: 1.5rem;
}

.item_navegador::before {
    content: "•";
    color: #7209b7;
    position: absolute;
    left: 0;
    font-size: 1.2rem;
}

.enlace_externo {
    color: #7209b7;
    text-decoration: none;
    transition: color 0.3s ease;
}

.enlace_externo:hover {
    color: #9d4edd;
    text-decoration: underline;
}

/* Pie de Página */
.cierre_sitio {
    background-color: #1a1a2e;
    padding: 4rem 2rem 2rem;
    border-top: 1px solid rgba(114, 9, 183, 0.2);
}

.contenedor_cierre {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 3rem;
}

.informacion_legal {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 2rem;
}

.identidad_marca {
    margin-bottom: 1rem;
}

.nombre_organizacion {
    font-size: 1.8rem;
    color: #7209b7;
    margin-bottom: 0.5rem;
    font-weight: 700;
}

.eslogan_organizacion {
    font-size: 1.1rem;
    color: #f3e5f9;
    font-style: italic;
}

.navegacion_secundaria {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

.enlaces_legales {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.enlace_legal {
    color: #f3e5f9;
    text-decoration: none;
    font-size: 1.1rem;
    transition: color 0.3s ease;
    position: relative;
    display: inline-block;
    margin-bottom: 0.5rem;
    width: fit-content;
}

.enlace_legal::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 2px;
    background-color: #7209b7;
    bottom: -5px;
    left: 0;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.3s ease;
}

.enlace_legal:hover {
    color: #7209b7;
}

.enlace_legal:hover::after {
    transform: scaleX(1);
}

.acreditaciones {
    margin-top: 1rem;
}

.certificacion {
    font-size: 0.95rem;
    color: #b8b8d0;
    margin-bottom: 0.5rem;
}

.derechos_autor {
    padding-top: 1.5rem;
    text-align: center;
}

.texto_derechos {
    font-size: 1rem;
    color: #f3e5f9;
    margin-bottom: 1rem;
}

.aviso_legal {
    font-size: 0.9rem;
    color: #a8a8b3;
    max-width: 800px;
    margin: 0 auto;
    line-height: 1.6;
}

/* Responsive Design */
@media (min-width: 992px) {
    .informacion_legal {
        flex-direction: row;
        align-items: center;
    }
    
    .navegacion_secundaria {
        flex-direction: row;
        justify-content: space-between;
        align-items: flex-start;
    }
    
    .enlaces_legales {
        flex-direction: row;
        gap: 2rem;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .titulo_seccion {
        font-size: 2.7rem;
    }
    
    .navegacion_secundaria {
        flex-direction: row;
        justify-content: space-between;
        align-items: flex-start;
    }
}

@media (max-width: 767px) {
    .titulo_seccion {
        font-size: 2.4rem;
    }
    
    .cabecera_cookies {
        padding: 6rem 1.5rem 2.5rem;
    }
    
    .contenido_cookies {
        padding: 3rem 1.5rem;
    }
    
    .seccion_cookies {
        padding: 2rem;
    }
    
    .texto_introduccion {
        font-size: 1.1rem;
    }
    
    .titulo_apartado {
        font-size: 1.6rem;
    }
    
    .subtitulo_apartado {
        font-size: 1.3rem;
    }
    
    .texto_apartado,
    .item_navegador {
        font-size: 1rem;
    }
}

@media (max-width: 480px) {
    .titulo_seccion {
        font-size: 2rem;
    }
    
    .navegacion_principal {
        padding: 0.7rem 1rem;
    }
    
    .enlace_inicio {
        font-size: 1rem;
    }
    
    .boton_contacto {
        padding: 0.5rem 1rem;
        font-size: 0.9rem;
    }
    
    .seccion_cookies {
        padding: 1.5rem;
    }
    
    .titulo_apartado {
        font-size: 1.4rem;
    }
    
    .subtitulo_apartado {
        font-size: 1.2rem;
    }
}







/* Base Styles */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: Arial, sans-serif;
    background-color: #1a1a2e;
    color: #f3e5f9;
    line-height: 1.6;
    font-size: 16px;
}

/* Menú Superior */
.navegacion_principal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background-color: rgba(26, 26, 46, 0.95);
    backdrop-filter: blur(10px);
    z-index: 1000;
    padding: 1rem 2rem;
}

.contenedor_navegacion {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.logo_sitio {
    flex-grow: 1;
}

.enlace_inicio {
    color: #f3e5f9;
    text-decoration: none;
    font-size: 1.3rem;
    font-weight: 700;
    transition: color 0.3s ease;
}

.enlace_inicio:hover {
    color: #7209b7;
}

.accion_contacto {
    margin-left: 2rem;
}

.boton_contacto {
    display: inline-block;
    background-color: #7209b7;
    color: #f3e5f9;
    text-decoration: none;
    padding: 0.7rem 1.5rem;
    font-size: 1rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
}

.boton_contacto:hover {
    background-color: #4c0677;
    transform: translateY(-3px);
}

/* Contenido Principal */
.contenido_gracias {
    min-height: 80vh;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 5rem 2rem;
}

.contenedor_gracias {
    max-width: 800px;
    width: 100%;
    margin: 0 auto;
}

.mensaje_gracias {
    background-color: #242445;
    padding: 3rem;
    border-radius: 12px;
    text-align: center;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
    position: relative;
    overflow: hidden;
}

/* Efecto de brillante en el borde */
.mensaje_gracias::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 5px;
    background: linear-gradient(90deg, #7209b7, #9d4edd, #c77dff);
    z-index: 1;
}

.icono_gracias {
    margin: 0 auto 2rem;
    width: 80px;
    height: 80px;
    background-color: rgba(114, 9, 183, 0.1);
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    animation: pulse 3s infinite;
}

@keyframes pulse {
    0% {
        box-shadow: 0 0 0 0 rgba(114, 9, 183, 0.4);
    }
    70% {
        box-shadow: 0 0 0 15px rgba(114, 9, 183, 0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(114, 9, 183, 0);
    }
}

.titulo_gracias {
    font-size: 2.8rem;
    color: #7209b7;
    margin-bottom: 1.5rem;
    font-weight: 800;
}

.descripcion_gracias {
    font-size: 1.2rem;
    line-height: 1.7;
    color: #f3e5f9;
    margin-bottom: 2rem;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}

.info_adicional {
    margin-bottom: 2.5rem;
}

.tiempo_respuesta {
    font-size: 1.1rem;
    color: #e0e0f0;
}

.destacado {
    color: #7209b7;
    font-weight: 600;
}

.acciones_gracias {
    margin-top: 2rem;
}

.texto_redirección {
    font-size: 1rem;
    color: #b8b8d0;
    margin-bottom: 1.2rem;
}

#contador {
    font-weight: 700;
    color: #7209b7;
}

.boton_inicio {
    display: inline-block;
    background-color: #7209b7;
    color: #f3e5f9;
    text-decoration: none;
    padding: 1rem 2rem;
    font-size: 1.1rem;
    font-weight: 600;
    border-radius: 10px;
    transition: all 0.3s ease;
}

.boton_inicio:hover {
    background-color: #4c0677;
    transform: translateY(-3px);
}

/* Pie de Página */
.cierre_sitio {
    background-color: #1a1a2e;
    padding: 4rem 2rem 2rem;
    border-top: 1px solid rgba(114, 9, 183, 0.2);
}

.contenedor_cierre {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 3rem;
}

.informacion_legal {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 2rem;
}

.identidad_marca {
    margin-bottom: 1rem;
}

.nombre_organizacion {
    font-size: 1.8rem;
    color: #7209b7;
    margin-bottom: 0.5rem;
    font-weight: 700;
}

.eslogan_organizacion {
    font-size: 1.1rem;
    color: #f3e5f9;
    font-style: italic;
}

.navegacion_secundaria {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

.enlaces_legales {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.enlace_legal {
    color: #f3e5f9;
    text-decoration: none;
    font-size: 1.1rem;
    transition: color 0.3s ease;
    position: relative;
    display: inline-block;
    margin-bottom: 0.5rem;
    width: fit-content;
}

.enlace_legal::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 2px;
    background-color: #7209b7;
    bottom: -5px;
    left: 0;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.3s ease;
}

.enlace_legal:hover {
    color: #7209b7;
}

.enlace_legal:hover::after {
    transform: scaleX(1);
}

.acreditaciones {
    margin-top: 1rem;
}

.certificacion {
    font-size: 0.95rem;
    color: #b8b8d0;
    margin-bottom: 0.5rem;
}

.derechos_autor {
    padding-top: 1.5rem;
    text-align: center;
}

.texto_derechos {
    font-size: 1rem;
    color: #f3e5f9;
    margin-bottom: 1rem;
}

.aviso_legal {
    font-size: 0.9rem;
    color: #a8a8b3;
    max-width: 800px;
    margin: 0 auto;
    line-height: 1.6;
}

/* Responsive Design */
@media (min-width: 992px) {
    .informacion_legal {
        flex-direction: row;
        align-items: center;
    }
    
    .navegacion_secundaria {
        flex-direction: row;
        justify-content: space-between;
        align-items: flex-start;
    }
    
    .enlaces_legales {
        flex-direction: row;
        gap: 2rem;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .titulo_gracias {
        font-size: 2.5rem;
    }
    
    .navegacion_secundaria {
        flex-direction: row;
        justify-content: space-between;
        align-items: flex-start;
    }
}

@media (max-width: 767px) {
    .contenido_gracias {
        padding: 4rem 1.5rem;
    }
    
    .mensaje_gracias {
        padding: 2.5rem 1.5rem;
    }
    
    .titulo_gracias {
        font-size: 2.2rem;
    }
    
    .descripcion_gracias {
        font-size: 1.1rem;
    }
    
    .tiempo_respuesta {
        font-size: 1rem;
    }
    
    .boton_inicio {
        padding: 0.8rem 1.5rem;
        font-size: 1rem;
    }
}

@media (max-width: 480px) {
    .navegacion_principal {
        padding: 0.7rem 1rem;
    }
    
    .enlace_inicio {
        font-size: 1rem;
    }
    
    .boton_contacto {
        padding: 0.5rem 1rem;
        font-size: 0.9rem;
    }
    
    .mensaje_gracias {
        padding: 2rem 1.2rem;
    }
    
    .titulo_gracias {
        font-size: 1.8rem;
    }
    
    .icono_gracias {
        width: 60px;
        height: 60px;
    }
    
    .descripcion_gracias {
        font-size: 1rem;
    }
}