{"id":8544,"date":"2026-04-10T10:07:24","date_gmt":"2026-04-10T15:07:24","guid":{"rendered":"https:\/\/infobienestar.ufpso.edu.co\/?page_id=8544"},"modified":"2026-04-10T10:11:05","modified_gmt":"2026-04-10T15:11:05","slug":"elementor-8544","status":"publish","type":"page","link":"https:\/\/infobienestar.ufpso.edu.co\/?page_id=8544","title":{"rendered":"Rutas de atencion"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"8544\" class=\"elementor elementor-8544\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-24634fc elementor-section-full_width elementor-section-height-default elementor-section-height-default\" data-id=\"24634fc\" data-element_type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-07c3590\" data-id=\"07c3590\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-af4e4b5 elementor-widget elementor-widget-html\" data-id=\"af4e4b5\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<style>\r\n  \/* Aislamos los estilos para que no afecten el resto del sitio WordPress *\/\r\n  .rutas-atencion-wrapper {\r\n    font-family: Arial, Helvetica, sans-serif;\r\n    background: transparent;\r\n    color: #1f2937;\r\n    padding: 20px 0;\r\n    max-width: 1400px;\r\n    margin: 0 auto;\r\n  }\r\n\r\n  .rutas-atencion-wrapper * {\r\n    box-sizing: border-box;\r\n  }\r\n\r\n  .rutas-atencion-wrapper .hero-rutas {\r\n    \/* Degradado usando el rojo institucional #C71122 y un tono ligeramente m\u00e1s oscuro para dar profundidad *\/\r\n    background: linear-gradient(135deg, #C71122, #9b0d1a);\r\n    color: white;\r\n    border-radius: 18px;\r\n    padding: 40px 32px;\r\n    margin-bottom: 30px;\r\n    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.12);\r\n    display: flex;\r\n    flex-wrap: wrap;\r\n    align-items: center;\r\n    gap: 30px;\r\n  }\r\n\r\n  .rutas-atencion-wrapper .hero-texto {\r\n    flex: 1;\r\n    min-width: 300px;\r\n  }\r\n\r\n  .rutas-atencion-wrapper .hero-texto h2 {\r\n    color: white;\r\n    margin: 0 0 15px;\r\n    font-size: 2.2rem;\r\n    font-weight: 700;\r\n  }\r\n\r\n  .rutas-atencion-wrapper .quote {\r\n    margin: 0;\r\n    font-size: 1.1rem;\r\n    line-height: 1.6;\r\n    opacity: 0.95;\r\n    font-style: italic;\r\n  }\r\n\r\n  .rutas-atencion-wrapper .imagen-destacada {\r\n    flex: 1;\r\n    min-width: 300px;\r\n    text-align: center;\r\n  }\r\n  \r\n  .rutas-atencion-wrapper .imagen-destacada img {\r\n    max-width: 100%;\r\n    height: auto;\r\n    border-radius: 12px;\r\n    box-shadow: 0 8px 20px rgba(0,0,0,0.15);\r\n  }\r\n\r\n  .rutas-atencion-wrapper .rutas-layout {\r\n    display: grid;\r\n    grid-template-columns: 300px 1fr;\r\n    gap: 24px;\r\n  }\r\n\r\n  .rutas-atencion-wrapper .rutas-menu {\r\n    background: #ffffff;\r\n    border-radius: 16px;\r\n    padding: 20px;\r\n    \/* Sombra con un toque del rojo institucional *\/\r\n    box-shadow: 0 4px 15px rgba(199, 17, 34, 0.08);\r\n    display: flex;\r\n    flex-direction: column;\r\n    gap: 12px;\r\n    height: fit-content;\r\n    position: sticky;\r\n    top: 100px; \r\n  }\r\n\r\n  .rutas-atencion-wrapper .ruta-btn {\r\n    border: 2px solid #f0f0f0;\r\n    background: #fdfdfd;\r\n    color: #1f2937;\r\n    border-radius: 10px;\r\n    padding: 16px;\r\n    text-align: left;\r\n    font-size: 1rem;\r\n    font-weight: 600;\r\n    cursor: pointer;\r\n    transition: all 0.3s ease;\r\n  }\r\n\r\n  .rutas-atencion-wrapper .ruta-btn:hover {\r\n    border-color: #C71122;\r\n    background: #fdf2f3; \/* Fondo rojizo muy suave *\/\r\n    transform: translateY(-2px);\r\n  }\r\n\r\n  .rutas-atencion-wrapper .ruta-btn.active {\r\n    background: #C71122;\r\n    color: #fff;\r\n    border-color: #C71122;\r\n    box-shadow: 0 4px 10px rgba(199, 17, 34, 0.25);\r\n  }\r\n\r\n  .rutas-atencion-wrapper .visor-panel {\r\n    background: #fff;\r\n    border-radius: 16px;\r\n    padding: 24px;\r\n    box-shadow: 0 4px 15px rgba(199, 17, 34, 0.08);\r\n  }\r\n\r\n  .rutas-atencion-wrapper .visor-header {\r\n    margin-bottom: 15px;\r\n  }\r\n\r\n  .rutas-atencion-wrapper .indicador {\r\n    display: inline-block;\r\n    background: #fdf2f3;\r\n    color: #C71122;\r\n    padding: 8px 16px;\r\n    border-radius: 50px;\r\n    font-size: 0.9rem;\r\n    font-weight: 700;\r\n    text-transform: uppercase;\r\n    letter-spacing: 0.5px;\r\n  }\r\n\r\n  .rutas-atencion-wrapper .ruta-info h3 {\r\n    margin: 0 0 10px;\r\n    font-size: 1.6rem;\r\n    color: #C71122;\r\n    font-weight: 700;\r\n  }\r\n\r\n  .rutas-atencion-wrapper .ruta-info p {\r\n    margin: 0 0 20px;\r\n    line-height: 1.6;\r\n    color: #4b5563;\r\n    font-size: 1.05rem;\r\n  }\r\n\r\n  .rutas-atencion-wrapper .pdf-viewer {\r\n    border: 1px solid #f0f0f0;\r\n    border-radius: 12px;\r\n    overflow: hidden;\r\n    background: #f8fafc;\r\n  }\r\n\r\n  .rutas-atencion-wrapper .pdf-viewer iframe {\r\n    display: block;\r\n    border: none;\r\n    width: 100%;\r\n    min-height: 700px;\r\n  }\r\n\r\n  @media (max-width: 960px) {\r\n    .rutas-atencion-wrapper .rutas-layout {\r\n      grid-template-columns: 1fr;\r\n    }\r\n    .rutas-atencion-wrapper .rutas-menu {\r\n      position: static;\r\n    }\r\n    .rutas-atencion-wrapper .pdf-viewer iframe {\r\n      min-height: 500px;\r\n    }\r\n  }\r\n<\/style>\r\n\r\n<div class=\"rutas-atencion-wrapper\">\r\n  <!-- Encabezado con Quote e Imagen -->\r\n  <div class=\"hero-rutas\">\r\n    <div class=\"hero-texto\">\r\n      <h2>Rutas de Atenci\u00f3n<\/h2>\r\n      <p class=\"quote\">\r\n        \"No est\u00e1s solo: en la universidad existen rutas de atenci\u00f3n para orientarte,\r\n        protegerte y acompa\u00f1arte oportunamente. Cada situaci\u00f3n tiene una ruta, y cada ruta empieza con escucharte.\"\r\n      <\/p>\r\n    <\/div>\r\n    <div class=\"imagen-destacada\">\r\n      <img decoding=\"async\" src=\"https:\/\/infobienestar.ufpso.edu.co\/wp-content\/uploads\/2026\/04\/Rutas-de-atencion-integral-1.png\" alt=\"Ilustraci\u00f3n Rutas de Atenci\u00f3n UFPSO\">\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <div class=\"rutas-layout\">\r\n    <!-- Men\u00fa lateral de botones -->\r\n    <aside class=\"rutas-menu\">\r\n      <button class=\"ruta-btn active\"\r\n              data-ruta=\"integral\"\r\n              data-pdf=\"https:\/\/infobienestar.ufpso.edu.co\/wp-content\/uploads\/2026\/04\/Ruta-Folleto-1_compressed.pdf\"\r\n              data-titulo=\"Ruta Integral de Atenci\u00f3n\"\r\n              data-descripcion=\"Atenci\u00f3n inicial por Bienestar Universitario, evaluaci\u00f3n interdisciplinaria (M\u00e9dico, Psicolog\u00eda, Trabajo Social), activaci\u00f3n de ruta o derivaci\u00f3n y seguimiento continuo.\">\r\n        Ruta Integral\r\n      <\/button>\r\n\r\n      <button class=\"ruta-btn\"\r\n              data-ruta=\"bullying\"\r\n              data-pdf=\"https:\/\/infobienestar.ufpso.edu.co\/wp-content\/uploads\/2026\/04\/Ruta-bullying-Pieza-grafica.pdf\"\r\n              data-titulo=\"Ruta de Bullying\"\r\n              data-descripcion=\"Atenci\u00f3n a situaciones de maltrato reiterado. Incluye denuncia, apoyo psicosocial, asesor\u00eda jur\u00eddica, articulaci\u00f3n externa y monitoreo permanente para cierre del caso.\">\r\n        Ruta de Bullying\r\n      <\/button>\r\n\r\n      <button class=\"ruta-btn\"\r\n              data-ruta=\"genero\"\r\n              data-pdf=\"https:\/\/infobienestar.ufpso.edu.co\/wp-content\/uploads\/2026\/04\/Ruta-violencia-de-gA\u00a9nero_compressed.pdf\"\r\n              data-titulo=\"Ruta de Violencia Basada en G\u00e9nero\"\r\n              data-descripcion=\"Atenci\u00f3n a casos de violencia f\u00edsica, psicol\u00f3gica, sexual, simb\u00f3lica o econ\u00f3mica. Implica denuncia prioritaria, primeros auxilios emocionales, medidas preventivas y acompa\u00f1amiento.\">\r\n        Violencia de G\u00e9nero\r\n      <\/button>\r\n    <\/aside>\r\n\r\n    <!-- Panel principal de visualizaci\u00f3n -->\r\n    <main class=\"visor-panel\">\r\n      <div class=\"visor-header\">\r\n        <span id=\"indicadorRuta\" class=\"indicador\">Ruta activa: Ruta Integral de Atenci\u00f3n<\/span>\r\n      <\/div>\r\n\r\n      <div class=\"ruta-info\">\r\n        <h3 id=\"rutaTitulo\">Ruta Integral de Atenci\u00f3n<\/h3>\r\n        <p id=\"rutaDescripcion\">\r\n          Atenci\u00f3n inicial por Bienestar Universitario, evaluaci\u00f3n interdisciplinaria (M\u00e9dico, Psicolog\u00eda, Trabajo Social), activaci\u00f3n de ruta o derivaci\u00f3n y seguimiento continuo.\r\n        <\/p>\r\n      <\/div>\r\n\r\n      <div class=\"pdf-viewer\">\r\n        <!-- El src inicial es el de la Ruta Integral -->\r\n        <iframe\r\n          id=\"pdfViewer\"\r\n          src=\"https:\/\/infobienestar.ufpso.edu.co\/wp-content\/uploads\/2026\/04\/Ruta-Folleto-1_compressed.pdf\"\r\n          title=\"Visor de PDF de la ruta seleccionada\">\r\n        <\/iframe>\r\n      <\/div>\r\n    <\/main>\r\n  <\/div>\r\n<\/div>\r\n\r\n<script>\r\n  document.addEventListener('DOMContentLoaded', function() {\r\n    const botones = document.querySelectorAll('.ruta-btn');\r\n    const pdfViewer = document.getElementById('pdfViewer');\r\n    const rutaTitulo = document.getElementById('rutaTitulo');\r\n    const rutaDescripcion = document.getElementById('rutaDescripcion');\r\n    const indicadorRuta = document.getElementById('indicadorRuta');\r\n\r\n    botones.forEach(boton => {\r\n      boton.addEventListener('click', function() {\r\n        \/\/ Quitar la clase 'active' de todos los botones\r\n        botones.forEach(btn => btn.classList.remove('active'));\r\n        \/\/ A\u00f1adir la clase 'active' al bot\u00f3n clickeado\r\n        this.classList.add('active');\r\n\r\n        \/\/ Obtener la informaci\u00f3n de los atributos data-*\r\n        const pdfUrl = this.getAttribute('data-pdf');\r\n        const titulo = this.getAttribute('data-titulo');\r\n        const descripcion = this.getAttribute('data-descripcion');\r\n\r\n        \/\/ Actualizar el DOM\r\n        pdfViewer.src = pdfUrl;\r\n        rutaTitulo.textContent = titulo;\r\n        rutaDescripcion.textContent = descripcion;\r\n        indicadorRuta.textContent = 'Ruta activa: ' + titulo;\r\n      });\r\n    });\r\n  });\r\n<\/script>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Rutas de Atenci\u00f3n &#8220;No est\u00e1s solo: en la universidad existen rutas de atenci\u00f3n para orientarte, protegerte y acompa\u00f1arte oportunamente. Cada [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-8544","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/infobienestar.ufpso.edu.co\/index.php?rest_route=\/wp\/v2\/pages\/8544","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/infobienestar.ufpso.edu.co\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/infobienestar.ufpso.edu.co\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/infobienestar.ufpso.edu.co\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/infobienestar.ufpso.edu.co\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=8544"}],"version-history":[{"count":5,"href":"https:\/\/infobienestar.ufpso.edu.co\/index.php?rest_route=\/wp\/v2\/pages\/8544\/revisions"}],"predecessor-version":[{"id":8555,"href":"https:\/\/infobienestar.ufpso.edu.co\/index.php?rest_route=\/wp\/v2\/pages\/8544\/revisions\/8555"}],"wp:attachment":[{"href":"https:\/\/infobienestar.ufpso.edu.co\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=8544"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}