 {"id":7169,"date":"2026-06-09T14:41:11","date_gmt":"2026-06-09T19:41:11","guid":{"rendered":"https:\/\/new-web.hospitalsantamonica.gov.co\/?page_id=7169"},"modified":"2026-06-09T14:58:53","modified_gmt":"2026-06-09T19:58:53","slug":"portafolio-de-servicios","status":"publish","type":"page","link":"https:\/\/new-web.hospitalsantamonica.gov.co\/index.php\/portafolio-de-servicios\/","title":{"rendered":"Portafolio de Servicios"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"7169\" class=\"elementor elementor-7169\">\n\t\t\t\t<div class=\"elementor-element elementor-element-24757f5 e-flex e-con-boxed e-con e-parent\" data-id=\"24757f5\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-450db08 elementor-widget elementor-widget-html\" data-id=\"450db08\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"servicios-especiales-container\">\r\n    <h2 class=\"servicios-main-title\">Nuestros Servicios Especializados<\/h2>\r\n    <p class=\"servicios-sub-title\">Ofrecemos atenci\u00f3n m\u00e9dica de alta calidad con profesionales comprometidos con su salud y bienestar.<\/p>\r\n    \r\n    <div class=\"servicios-grid\">\r\n        \r\n        <div class=\"servicio-card\">\r\n            <div class=\"servicio-img-wrapper\">\r\n                <img decoding=\"async\" src=\"http:\/\/new-web.hospitalsantamonica.gov.co\/wp-content\/uploads\/2026\/06\/foto-estetoscopio.jpg\" alt=\"Consulta Especializada\">\r\n                <div class=\"servicio-overlay\"><\/div>\r\n                <div class=\"servicio-icon\">\r\n                    <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><rect x=\"2\" y=\"7\" width=\"20\" height=\"14\" rx=\"2\" ry=\"2\"><\/rect><path d=\"M16 21V5a2 2 0 0 0-2-2h-4a2 2 0 0 0-2 2v16\"><\/path><\/svg>\r\n                <\/div>\r\n            <\/div>\r\n            <div class=\"servicio-content\">\r\n                <h3>Consulta y Atenci\u00f3n Especializada<\/h3>\r\n                <p>Valoraciones por especialistas m\u00e9dicos enfocados en diagn\u00f3sticos precisos y tratamientos oportunos.<\/p>\r\n                <a href=\"#\" class=\"servicio-btn\">Conocer M\u00e1s \u2794<\/a>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"servicio-card\">\r\n            <div class=\"servicio-img-wrapper\">\r\n                <img decoding=\"async\" src=\"http:\/\/new-web.hospitalsantamonica.gov.co\/wp-content\/uploads\/2026\/06\/foto-estetoscopio.jpg\" alt=\"Salud Oral Especializada\">\r\n                <div class=\"servicio-overlay\"><\/div>\r\n                <div class=\"servicio-icon\">\r\n                    <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><path d=\"M12 22C12 22 20 18 20 12V5L12 2L4 5V12C4 18 12 22 12 22Z\"><\/path><\/svg>\r\n                <\/div>\r\n            <\/div>\r\n            <div class=\"servicio-content\">\r\n                <h3>Salud Oral Especializada<\/h3>\r\n                <p>Tratamientos odontol\u00f3gicos avanzados y maxilofaciales para devolver la funcionalidad y est\u00e9tica a tu sonrisa.<\/p>\r\n                <a href=\"#\" class=\"servicio-btn\">Conocer M\u00e1s \u2794<\/a>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"servicio-card\">\r\n            <div class=\"servicio-img-wrapper\">\r\n                <img decoding=\"async\" src=\"http:\/\/new-web.hospitalsantamonica.gov.co\/wp-content\/uploads\/2026\/06\/foto-estetoscopio.jpg\" alt=\"Laboratorio Cl\u00ednico\">\r\n                <div class=\"servicio-overlay\"><\/div>\r\n                <div class=\"servicio-icon\">\r\n                    <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><path d=\"M10 2v8a4 4 0 0 0 8 0V2\"><\/path><path d=\"M6 2h12\"><\/path><path d=\"M14 22h.01\"><\/path><\/svg>\r\n                <\/div>\r\n            <\/div>\r\n            <div class=\"servicio-content\">\r\n                <h3>Laboratorio Cl\u00ednico<\/h3>\r\n                <p>Procesamiento r\u00e1pido y confiable de muestras cl\u00ednicas con tecnolog\u00eda de punta y altos est\u00e1ndares de seguridad.<\/p>\r\n                <a href=\"#\" class=\"servicio-btn\">Conocer M\u00e1s \u2794<\/a>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"servicio-card\">\r\n            <div class=\"servicio-img-wrapper\">\r\n                <img decoding=\"async\" src=\"http:\/\/new-web.hospitalsantamonica.gov.co\/wp-content\/uploads\/2026\/06\/foto-estetoscopio.jpg\" alt=\"Cirug\u00eda Laparosc\u00f3pica\">\r\n                <div class=\"servicio-overlay\"><\/div>\r\n                <div class=\"servicio-icon\">\r\n                    <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><line x1=\"12\" y1=\"5\" x2=\"12\" y2=\"19\"><\/line><line x1=\"5\" y1=\"12\" x2=\"19\" y2=\"12\"><\/line><\/svg>\r\n                <\/div>\r\n            <\/div>\r\n            <div class=\"servicio-content\">\r\n                <h3>Cirug\u00eda Laparosc\u00f3pica<\/h3>\r\n                <p>Procedimientos quir\u00fargicos de m\u00ednima invasi\u00f3n que garantizan una recuperaci\u00f3n mucho m\u00e1s r\u00e1pida y menos dolorosa.<\/p>\r\n                <a href=\"#\" class=\"servicio-btn\">Conocer M\u00e1s \u2794<\/a>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"servicio-card\">\r\n            <div class=\"servicio-img-wrapper\">\r\n                <img decoding=\"async\" src=\"http:\/\/new-web.hospitalsantamonica.gov.co\/wp-content\/uploads\/2026\/06\/foto-estetoscopio.jpg\" alt=\"Paquetes Quir\u00fargicos\">\r\n                <div class=\"servicio-overlay\"><\/div>\r\n                <div class=\"servicio-icon\">\r\n                    <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><path d=\"M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2\"><\/path><rect x=\"8\" y=\"2\" width=\"8\" height=\"4\" rx=\"1\" ry=\"1\"><\/rect><\/svg>\r\n                <\/div>\r\n            <\/div>\r\n            <div class=\"servicio-content\">\r\n                <h3>Paquetes Quir\u00fargicos<\/h3>\r\n                <p>Planes integrales programados que cubren los requerimientos m\u00e9dicos de tu cirug\u00eda con tarifas preferenciales.<\/p>\r\n                <a href=\"#\" class=\"servicio-btn\">Conocer M\u00e1s \u2794<\/a>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"servicio-card\">\r\n            <div class=\"servicio-img-wrapper\">\r\n                <img decoding=\"async\" src=\"http:\/\/new-web.hospitalsantamonica.gov.co\/wp-content\/uploads\/2026\/06\/foto-estetoscopio.jpg\" alt=\"Terapias y Rehabilitaci\u00f3n\">\r\n                <div class=\"servicio-overlay\"><\/div>\r\n                <div class=\"servicio-icon\">\r\n                    <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><path d=\"M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 0 0 0-7.78z\"><\/path><\/svg>\r\n                <\/div>\r\n            <\/div>\r\n            <div class=\"servicio-content\">\r\n                <h3>Terapias y Rehabilitaci\u00f3n<\/h3>\r\n                <p>Procesos terap\u00e9uticos personalizados para la recuperaci\u00f3n \u00f3ptima de la movilidad y funcionalidad corporal.<\/p>\r\n                <a href=\"#\" class=\"servicio-btn\">Conocer M\u00e1s \u2794<\/a>\r\n            <\/div>\r\n        <\/div>\r\n\r\n    <\/div>\r\n<\/div>\r\n\r\n<style>\r\n    \/* CONTENEDOR PRINCIPAL *\/\r\n    .servicios-especiales-container {\r\n        max-width: 1200px;\r\n        margin: 60px auto;\r\n        padding: 0 20px;\r\n        font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\r\n    }\r\n\r\n    .servicios-main-title {\r\n        text-align: center;\r\n        color: #003366; \/* Azul institucional *\/\r\n        font-size: 32px;\r\n        font-weight: 700;\r\n        margin-bottom: 10px;\r\n    }\r\n\r\n    .servicios-sub-title {\r\n        text-align: center;\r\n        color: #64748b;\r\n        font-size: 16px;\r\n        max-width: 600px;\r\n        margin: 0 auto 50px auto;\r\n        line-height: 1.5;\r\n    }\r\n\r\n    \/* GRID RESPONSIVO (3 columnas en desktop, 2 en tablet, 1 en celular) *\/\r\n    .servicios-grid {\r\n        display: grid;\r\n        grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));\r\n        gap: 30px;\r\n    }\r\n\r\n    \/* TARJETA INDIVIDUAL *\/\r\n    .servicio-card {\r\n        background: #ffffff;\r\n        border-radius: 16px;\r\n        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);\r\n        overflow: hidden;\r\n        border: 1px solid #e2e8f0;\r\n        display: flex;\r\n        flex-direction: column;\r\n        transition: transform 0.3s cubic-bezier(0.25, 1, 0.5, 1), box-shadow 0.3s ease;\r\n    }\r\n\r\n    .servicio-card:hover {\r\n        transform: translateY(-8px);\r\n        box-shadow: 0 12px 30px rgba(0, 51, 102, 0.12);\r\n    }\r\n\r\n    \/* CONTENEDOR DE LA IMAGEN EN LA CARD *\/\r\n .servicio-img-wrapper {\r\n    position: relative !important;\r\n    height: 180px !important;\r\n    overflow: hidden !important;\r\n    background-color: #003366 !important; \/* Azul institucional de respaldo *\/\r\n}\r\n\r\n    .servicio-img-wrapper img {\r\n        width: 100%;\r\n        height: 100%;\r\n        object-fit: cover;\r\n        transition: transform 0.5s ease;\r\n    }\r\n\r\n    .servicio-card:hover .servicio-img-wrapper img {\r\n        transform: scale(1.08);\r\n    }\r\n\r\n    \/* Capa de tinte azul transl\u00facido sobre la imagen para dar coherencia visual *\/\r\n    .servicio-overlay {\r\n        position: absolute;\r\n        top: 0;\r\n        left: 0;\r\n        width: 100%;\r\n        height: 100%;\r\n        background: linear-gradient(to bottom, rgba(0, 51, 102, 0.2), rgba(0, 51, 102, 0.6));\r\n    }\r\n\r\n    \/* Icono flotante redondo entre la imagen y el texto *\/\r\n  .servicio-icon {\r\n    position: absolute !important;\r\n    bottom: -12px !important; \/* Subido 10px para centrarse mejor sobre la l\u00ednea divisoria *\/\r\n    right: 25px !important;\r\n    width: 46px !important;\r\n    height: 46px !important;\r\n    background: #00c0f3 !important; \/* Celeste brillante *\/\r\n    color: #ffffff !important;\r\n    border-radius: 50% !important;\r\n    display: flex !important;\r\n    align-items: center !important;\r\n    justify-content: center !important;\r\n    box-shadow: 0 4px 10px rgba(0, 192, 243, 0.4) !important;\r\n    border: 3px solid #ffffff !important;\r\n    z-index: 10 !important; \/* Prioridad alta para que no lo tape el texto *\/\r\n    transition: transform 0.3s ease, background-color 0.3s ease !important;\r\n}\r\n\r\n.servicio-card:hover .servicio-icon {\r\n    transform: rotate(15deg) scale(1.1) !important;\r\n    background-color: #002244 !important; \/* Tono m\u00e1s oscuro al pasar el cursor *\/\r\n}\r\n\r\n    .servicio-icon svg {\r\n        width: 20px;\r\n        height: 20px;\r\n    }\r\n\r\n    \/* CONTENIDO ESCRITO DE LA TARJETA *\/\r\n    .servicio-content {\r\n        padding: 25px;\r\n        display: flex;\r\n        flex-direction: column;\r\n        flex-grow: 1;\r\n    }\r\n\r\n    .servicio-content h3 {\r\n        color: #003366;\r\n        font-size: 20px;\r\n        font-weight: 600;\r\n        margin: 0 0 12px 0;\r\n        line-height: 1.3;\r\n    }\r\n\r\n.servicio-content {\r\n    padding: 25px !important;\r\n    padding-top: 30px !important; \/* Espacio extra arriba para respetar el icono *\/\r\n    display: flex !important;\r\n    flex-direction: column !important;\r\n    flex-grow: 1 !important;\r\n}\r\n    }\r\n\r\n    \/* BOT\u00d3N DE ACCI\u00d3N ACCESIBLE *\/\r\n    .servicio-btn {\r\n        align-self: flex-start;\r\n        color: #00c0f3;\r\n        text-decoration: none;\r\n        font-size: 14px;\r\n        font-weight: 600;\r\n        transition: color 0.2s ease, padding-left 0.2s ease;\r\n    }\r\n\r\n    .servicio-btn:hover {\r\n        color: #003366;\r\n        padding-left: 5px;\r\n    }\r\n\r\n    \/* OPTIMIZACI\u00d3N RESPONSIVA ADICIONAL *\/\r\n    @media (max-width: 640px) {\r\n        .servicios-grid {\r\n            grid-template-columns: 1fr;\r\n        }\r\n        .servicios-main-title {\r\n            font-size: 26px;\r\n        }\r\n    }\r\n<\/style>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Nuestros Servicios Especializados Ofrecemos atenci\u00f3n m\u00e9dica de alta calidad con profesionales comprometidos con su salud y bienestar. Consulta y Atenci\u00f3n Especializada Valoraciones por especialistas m\u00e9dicos enfocados en diagn\u00f3sticos precisos y tratamientos oportunos. Conocer M\u00e1s \u2794 Salud Oral Especializada Tratamientos odontol\u00f3gicos avanzados y maxilofaciales para devolver la funcionalidad y est\u00e9tica a tu sonrisa. Conocer M\u00e1s \u2794 [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-7169","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/new-web.hospitalsantamonica.gov.co\/index.php\/wp-json\/wp\/v2\/pages\/7169","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/new-web.hospitalsantamonica.gov.co\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/new-web.hospitalsantamonica.gov.co\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/new-web.hospitalsantamonica.gov.co\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/new-web.hospitalsantamonica.gov.co\/index.php\/wp-json\/wp\/v2\/comments?post=7169"}],"version-history":[{"count":4,"href":"https:\/\/new-web.hospitalsantamonica.gov.co\/index.php\/wp-json\/wp\/v2\/pages\/7169\/revisions"}],"predecessor-version":[{"id":7175,"href":"https:\/\/new-web.hospitalsantamonica.gov.co\/index.php\/wp-json\/wp\/v2\/pages\/7169\/revisions\/7175"}],"wp:attachment":[{"href":"https:\/\/new-web.hospitalsantamonica.gov.co\/index.php\/wp-json\/wp\/v2\/media?parent=7169"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}