{"id":3958,"date":"2016-07-21T11:39:32","date_gmt":"2016-07-21T14:39:32","guid":{"rendered":"http:\/\/dev.posadas.gov.ar\/planurbano\/?page_id=3958"},"modified":"2026-09-18T08:56:05","modified_gmt":"2026-09-18T11:56:05","slug":"home2016","status":"publish","type":"page","link":"https:\/\/posadas.gov.ar\/planurbano\/","title":{"rendered":""},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"3958\" class=\"elementor elementor-3958\" data-elementor-post-type=\"page\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-2087878 elementor-section-full_width elementor-section-stretched elementor-section-height-default elementor-section-height-default\" data-id=\"2087878\" data-element_type=\"section\" data-settings=\"{&quot;stretch_section&quot;:&quot;section-stretched&quot;,&quot;background_background&quot;:&quot;classic&quot;}\">\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-8ca9818\" data-id=\"8ca9818\" 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-b4a9a5d elementor-widget elementor-widget-html\" data-id=\"b4a9a5d\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<!-- Enlaces a fuentes e iconos externos -->\r\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&family=Source+Sans+3:ital,wght@0,300..900;1,300..900&display=swap\" rel=\"stylesheet\">\r\n<link rel=\"stylesheet\" href=\"https:\/\/fonts.googleapis.com\/css2?family=Material+Symbols+Rounded:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200\" \/>\r\n<link rel=\"stylesheet\" href=\"https:\/\/fonts.googleapis.com\/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0,0\" \/>\r\n\r\n<style>\r\n  \/* \u00c1mbito encapsulado para WordPress \/ Elementor Pro *\/\r\n  .kiosk-container-wrapper {\r\n    font-family: 'Source Sans 3', sans-serif;\r\n    color: #012623;\r\n    width: 100vw;\r\n    height: 100vh;\r\n    display: flex;\r\n    flex-direction: column;\r\n    justify-content: center;\r\n    align-items: center;\r\n    position: relative;\r\n    overflow: hidden;\r\n    line-height: 1.5;\r\n\r\n    --cyan: #25B8D9;\r\n    --dark-green: #012623;\r\n    --green-mid: #038C5A;\r\n    --green-light: #04BF68;\r\n    --magenta: #F22283;\r\n    --magenta-dark: #cb437f;\r\n    --gop-blue: #007791;\r\n    --gop-lime: #B2C926;\r\n    --gop-lime-dark: #96AB1D;\r\n    --surface: #011E1C;\r\n    --surface-container: #FFFFFF;\r\n    --surface-variant: #F4F7F6;\r\n    --on-surface: #012623;\r\n    --on-surface-variant: #4A635E;\r\n    --shape-xs: 12px;\r\n    --shape-md: 24px;\r\n    --shape-lg: 36px;\r\n    --shape-xl: 48px;\r\n    --shape-full: 9999px;\r\n    --spring-fast: cubic-bezier(0.175, 0.885, 0.32, 1.275);\r\n    --duration-fast: 350ms;\r\n    --duration-medium: 450ms;\r\n\r\n    \/* Variables locales portada *\/\r\n    --pill-green: #02c084;\r\n    --btn-blue: #0088cc;\r\n    --btn-blue-hover: #006da3;\r\n  }\r\n\r\n  .kiosk-container-wrapper * {\r\n    box-sizing: border-box;\r\n    margin: 0;\r\n    padding: 0;\r\n  }\r\n\r\n  .kiosk-container-wrapper .material-symbols-rounded,\r\n  .kiosk-container-wrapper .material-symbols-outlined {\r\n    font-variation-settings: 'FILL' 1, 'wght' 600, 'GRAD' 0, 'opsz' 36;\r\n    display: inline-block;\r\n    vertical-align: middle;\r\n  }\r\n\r\n  .kiosk-container-wrapper .deck-viewport {\r\n    width: 100%;\r\n    height: 100%;\r\n    position: absolute;\r\n    inset: 0;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n  }\r\n\r\n  \/* TARJETA BASE PARA LOS PANELES REGULARES *\/\r\n  .kiosk-container-wrapper .slide-card {\r\n    position: absolute;\r\n    width: 100%;\r\n    max-width: 1400px;\r\n    height: calc(100vh - 120px);\r\n    max-height: 850px;\r\n    background: var(--surface-container);\r\n    border-radius: var(--shape-xl);\r\n    padding: 56px 64px;\r\n    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.3);\r\n    display: flex;\r\n    flex-direction: column;\r\n    justify-content: center;\r\n    overflow: hidden;\r\n    opacity: 0;\r\n    pointer-events: none;\r\n    transform: translateX(40px) scale(0.98);\r\n    transition: opacity var(--duration-medium) var(--spring-fast), transform var(--duration-medium) var(--spring-fast);\r\n  }\r\n\r\n  .kiosk-container-wrapper .slide-card.active {\r\n    opacity: 1;\r\n    pointer-events: auto;\r\n    transform: translateX(0) scale(1);\r\n    z-index: 2;\r\n  }\r\n\r\n  \/* PANELES EF\u00cdMEROS (PANEL 01 Y PANEL 02): PANTALLA COMPLETA SIN M\u00c1SCARA NI BORDE *\/\r\n  .kiosk-container-wrapper .slide-card.slide-fullscreen-bg {\r\n    max-width: 100vw !important;\r\n    height: 100vh !important;\r\n    max-height: 100vh !important;\r\n    border-radius: 0 !important;\r\n    box-shadow: none !important;\r\n    padding: 0 !important;\r\n    align-items: center;\r\n    justify-content: center;\r\n  }\r\n\r\n  \/* ESTILOS PANEL 01: VIDEO DE YOUTUBE EN PANTALLA COMPLETA *\/\r\n  .kiosk-container-wrapper .slide-hero-video {\r\n    background-color: #000000 !important;\r\n  }\r\n\r\n  .kiosk-container-wrapper .hero-video-wrapper {\r\n    position: absolute;\r\n    top: 50%;\r\n    left: 50%;\r\n    width: 100vw;\r\n    height: 100vh;\r\n    transform: translate(-50%, -50%);\r\n    pointer-events: none;\r\n    z-index: 1;\r\n    overflow: hidden;\r\n  }\r\n\r\n  .kiosk-container-wrapper .hero-video-wrapper iframe {\r\n    position: absolute;\r\n    top: 50%;\r\n    left: 50%;\r\n    width: 100vw;\r\n    height: 56.25vw;\r\n    min-height: 100vh;\r\n    min-width: 177.77vh;\r\n    transform: translate(-50%, -50%) scale(1.2);\r\n  }\r\n\r\n  .kiosk-container-wrapper .hero-overlay-green {\r\n    position: absolute;\r\n    inset: 0;\r\n    background-color: rgba(0, 162, 111, 0.70);\r\n    z-index: 2;\r\n    pointer-events: none;\r\n  }\r\n\r\n  \/* Tarjeta Blanca Contenedora Panel 01 *\/\r\n  .kiosk-container-wrapper .hero-card {\r\n    position: relative;\r\n    z-index: 3;\r\n    background-color: #ffffff;\r\n    width: 90%;\r\n    max-width: 960px;\r\n    border-radius: 32px;\r\n    padding: 48px 40px;\r\n    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.22);\r\n    display: flex;\r\n    flex-direction: column;\r\n    align-items: center;\r\n    justify-content: center;\r\n    text-align: center;\r\n    margin-bottom: 60px;\r\n  }\r\n\r\n  .kiosk-container-wrapper .hero-logo {\r\n    max-width: 170px;\r\n    width: 100%;\r\n    height: auto;\r\n    margin-bottom: 20px;\r\n    display: block;\r\n  }\r\n\r\n  .kiosk-container-wrapper .hero-title-main {\r\n    font-family: 'Source Sans 3', system-ui, -apple-system, sans-serif;\r\n    font-weight: 800;\r\n    color: #000000;\r\n    font-size: clamp(2.2rem, 4.8vw, 3.8rem);\r\n    line-height: 1.05;\r\n    letter-spacing: -1px;\r\n    margin-bottom: 24px;\r\n  }\r\n\r\n  .kiosk-container-wrapper .hero-pill-main {\r\n    background-color: var(--pill-green);\r\n    color: #ffffff;\r\n    font-family: 'Source Sans 3', system-ui, -apple-system, sans-serif;\r\n    font-weight: 600;\r\n    font-size: clamp(1rem, 1.8vw, 1.25rem);\r\n    border-radius: var(--shape-full);\r\n    display: inline-flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    padding: 20px 48px;\r\n    min-height: 90px;\r\n    max-width: 680px;\r\n    box-shadow: 0 6px 20px rgba(2, 192, 132, 0.25);\r\n    line-height: 1.35;\r\n    margin-bottom: 16px;\r\n    text-align: center;\r\n  }\r\n\r\n  .kiosk-container-wrapper .hero-cta-group {\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    gap: 16px;\r\n    width: 100%;\r\n    margin-top: 16px;\r\n  }\r\n\r\n  .kiosk-container-wrapper .pill-button-secondary {\r\n    background-color: #f1f3f5;\r\n    color: #333333;\r\n    border: 2px solid #e0e0e0;\r\n    font-family: 'Source Sans 3', system-ui, -apple-system, sans-serif;\r\n    font-weight: 700;\r\n    font-size: 0.9rem;\r\n    line-height: 1.15;\r\n    padding: 10px 24px;\r\n    border-radius: var(--shape-full);\r\n    text-decoration: none;\r\n    display: inline-flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    gap: 8px;\r\n    min-height: 52px;\r\n    text-align: center;\r\n    transition: all 0.25s ease-in-out;\r\n  }\r\n\r\n  .kiosk-container-wrapper .pill-button-secondary:hover {\r\n    background-color: #e9ecef;\r\n    border-color: #cccccc;\r\n    color: #000000;\r\n    transform: translateY(-2px);\r\n  }\r\n\r\n  \/* ESTILOS PANEL 02: IMAGEN FONDOPEP EN PANTALLA COMPLETA *\/\r\n  .kiosk-container-wrapper .slide-jornada {\r\n    background-image: url('https:\/\/posadas.gov.ar\/planurbano\/wp-content\/uploads\/2026\/09\/fondopep-scaled.jpg') !important;\r\n    background-position: center center !important;\r\n    background-repeat: no-repeat !important;\r\n    background-size: cover !important;\r\n  }\r\n\r\n  .kiosk-container-wrapper .jornada-wrapper {\r\n    width: 90%;\r\n    max-width: 720px;\r\n    display: flex;\r\n    flex-direction: column;\r\n    align-items: center;\r\n    gap: 20px;\r\n    z-index: 2;\r\n    margin-bottom: 60px;\r\n  }\r\n\r\n  .kiosk-container-wrapper .card-main-jornada {\r\n    background-color: #ffffff;\r\n    width: 100%;\r\n    border-radius: 36px;\r\n    padding: 36px 32px 28px;\r\n    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.2);\r\n    display: flex;\r\n    flex-direction: column;\r\n    align-items: center;\r\n    text-align: center;\r\n  }\r\n\r\n  .kiosk-container-wrapper .card-main-jornada .title-img {\r\n    max-width: 400px;\r\n    width: 100%;\r\n    height: auto;\r\n    margin-bottom: 24px;\r\n    display: block;\r\n  }\r\n\r\n  .kiosk-container-wrapper .modules-grid {\r\n    display: flex;\r\n    gap: 20px;\r\n    width: 100%;\r\n    justify-content: center;\r\n  }\r\n\r\n  .kiosk-container-wrapper .module-img {\r\n    flex: 1;\r\n    width: 50%;\r\n    height: auto;\r\n    display: block;\r\n    object-fit: contain;\r\n  }\r\n\r\n  .kiosk-container-wrapper .card-info-jornada {\r\n    background-color: #ffffff;\r\n    width: 100%;\r\n    border-radius: 28px;\r\n    padding: 24px 32px;\r\n    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);\r\n    display: flex;\r\n    flex-direction: column;\r\n    gap: 16px;\r\n  }\r\n\r\n  .kiosk-container-wrapper .info-item {\r\n    display: flex;\r\n    align-items: center;\r\n    gap: 14px;\r\n    font-size: 1.2rem;\r\n    color: #1a1a1a;\r\n    flex-wrap: wrap;\r\n  }\r\n\r\n  .kiosk-container-wrapper .icon-circle {\r\n    width: 38px;\r\n    height: 38px;\r\n    background-color: var(--magenta-dark);\r\n    border-radius: 50%;\r\n    display: inline-flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    flex-shrink: 0;\r\n  }\r\n\r\n  .kiosk-container-wrapper .icon-circle .material-symbols-outlined {\r\n    color: #ffffff !important;\r\n    font-size: 1.35rem;\r\n  }\r\n\r\n  .kiosk-container-wrapper .info-group {\r\n    display: inline-flex;\r\n    align-items: center;\r\n    gap: 10px;\r\n  }\r\n\r\n  .kiosk-container-wrapper .btn-participa {\r\n    display: inline-flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    gap: 10px;\r\n    background-color: var(--btn-blue);\r\n    color: #ffffff;\r\n    font-weight: 800;\r\n    font-size: 1.2rem;\r\n    padding: 14px 36px;\r\n    border-radius: var(--shape-full);\r\n    text-decoration: none;\r\n    box-shadow: 0 6px 20px rgba(0, 136, 204, 0.35);\r\n    transition: all 0.25s ease-in-out;\r\n    margin-top: 4px;\r\n    align-self: center;\r\n  }\r\n\r\n  .kiosk-container-wrapper .btn-participa:hover {\r\n    background-color: var(--btn-blue-hover);\r\n    transform: translateY(-2px);\r\n    box-shadow: 0 8px 25px rgba(0, 136, 204, 0.5);\r\n  }\r\n\r\n  .kiosk-container-wrapper .slide-card .m3-anim {\r\n    opacity: 0;\r\n    transform: translateY(20px);\r\n    transition: opacity 350ms var(--spring-fast), transform 400ms var(--spring-fast);\r\n  }\r\n\r\n  .kiosk-container-wrapper .slide-card.active .m3-anim:nth-child(1) { opacity: 1; transform: translateY(0); transition-delay: 80ms; }\r\n  .kiosk-container-wrapper .slide-card.active .m3-anim:nth-child(2) { opacity: 1; transform: translateY(0); transition-delay: 150ms; }\r\n  .kiosk-container-wrapper .slide-card.active .m3-anim:nth-child(3) { opacity: 1; transform: translateY(0); transition-delay: 220ms; }\r\n  .kiosk-container-wrapper .slide-card.active .m3-anim:nth-child(4) { opacity: 1; transform: translateY(0); transition-delay: 300ms; }\r\n\r\n  .kiosk-container-wrapper h1, \r\n  .kiosk-container-wrapper h2, \r\n  .kiosk-container-wrapper h3, \r\n  .kiosk-container-wrapper h4 { \r\n    font-weight: 800; \r\n    letter-spacing: -0.02em; \r\n    line-height: 1.08; \r\n  }\r\n\r\n  .kiosk-container-wrapper .slide-why { display: grid; grid-template-columns: 1.1fr 1fr; gap: 48px; align-items: center; }\r\n  .kiosk-container-wrapper .why-image-wrapper { position: relative; border-radius: var(--shape-lg); overflow: hidden; height: 440px; background: var(--surface-variant); }\r\n  .kiosk-container-wrapper .why-image-wrapper img { width: 100%; height: auto; min-height: 150%; object-fit: cover; animation: autoParallax 14s ease-in-out infinite alternate; will-change: transform; }\r\n\r\n  @keyframes autoParallax {\r\n    0% { transform: translateY(0%); }\r\n    100% { transform: translateY(-28%); }\r\n  }\r\n\r\n  .kiosk-container-wrapper .why-title { font-size: 3.2rem; margin-top: 24px; }\r\n  .kiosk-container-wrapper .why-title span { color: var(--cyan); }\r\n  .kiosk-container-wrapper .why-text { font-size: 1.3rem; color: var(--on-surface-variant); line-height: 1.6; }\r\n\r\n  .kiosk-container-wrapper .slide-dual-card { background: var(--green-mid); color: #FFFFFF; display: flex; flex-direction: column; justify-content: space-between; align-items: center; text-align: center; }\r\n  .kiosk-container-wrapper .dual-header { font-size: 2.8rem; line-height: 1.15; max-width: 900px; margin-bottom: 24px; color: #FFFFFF; }\r\n  .kiosk-container-wrapper .dual-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; width: 100%; max-width: 980px; }\r\n  .kiosk-container-wrapper .dual-card-item { background: var(--surface-container); color: var(--on-surface); border-radius: var(--shape-lg); padding: 32px; display: flex; flex-direction: column; align-items: center; box-shadow: 0 12px 24px rgba(0,0,0,0.15); }\r\n  .kiosk-container-wrapper .dual-card-item h3 { font-size: 1.6rem; margin-bottom: 16px; }\r\n  .kiosk-container-wrapper .dual-card-badge { background: var(--green-mid); color: #FFFFFF; padding: 16px 20px; border-radius: var(--shape-md); font-size: 1.05rem; font-weight: 600; width: 100%; }\r\n  .kiosk-container-wrapper .dual-footer { font-size: 1.8rem; font-weight: 800; margin-top: 24px; }\r\n\r\n  \/* EMPRESAS HABILITADAS *\/\r\n  .kiosk-container-wrapper .slide-empresas { display: flex; flex-direction: column; align-items: center; justify-content: center; }\r\n  .kiosk-container-wrapper .empresas-title { font-size: 3.2rem; font-weight: 800; color: var(--dark-green); text-align: center; margin-bottom: 32px; line-height: 1.05; }\r\n  .kiosk-container-wrapper .empresas-content { display: flex; gap: 40px; align-items: center; justify-content: center; width: 100%; max-width: 1000px; }\r\n  .kiosk-container-wrapper .empresas-image-wrapper { width: 550px; height: 380px; border-radius: var(--shape-lg); overflow: hidden; background: var(--surface-variant); display: flex; align-items: center; }\r\n  .kiosk-container-wrapper .empresas-image-wrapper img { height: 100%; width: auto; min-width: 160%; object-fit: cover; animation: horizontalPan 25s ease-in-out infinite alternate; }\r\n  @keyframes horizontalPan { 0% { transform: translateX(0%); } 100% { transform: translateX(-35%); } }\r\n  .kiosk-container-wrapper .empresas-qr-section { display: flex; flex-direction: column; align-items: center; gap: 20px; }\r\n  .kiosk-container-wrapper .empresas-qr-wrapper { width: 240px; height: 240px; border-radius: var(--shape-md); overflow: hidden; }\r\n  .kiosk-container-wrapper .empresas-qr-wrapper img { width: 100%; height: 100%; object-fit: cover; }\r\n  .kiosk-container-wrapper .empresas-btn { background: var(--green-light); color: #FFFFFF; padding: 16px 28px; border-radius: var(--shape-full); text-decoration: none; font-weight: 800; font-size: 1.15rem; text-align: center; line-height: 1.2; box-shadow: 0 8px 24px rgba(4, 191, 104, 0.4); transition: transform 250ms var(--spring-fast), box-shadow 250ms ease; }\r\n  .kiosk-container-wrapper .empresas-btn:hover { transform: translateY(-4px) scale(1.02); box-shadow: 0 12px 30px rgba(4, 191, 104, 0.5); }\r\n  .kiosk-container-wrapper .empresas-description { font-size: 1.15rem; font-weight: 600; color: var(--on-surface-variant); text-align: center; max-width: 900px; margin-top: 32px; line-height: 1.5; }\r\n\r\n  .kiosk-container-wrapper .expressive-pill-link { background: #E8F5E9; color: var(--dark-green); padding: 10px 18px 10px 10px; border-radius: var(--shape-full); display: inline-flex; align-items: center; justify-content: space-between; text-decoration: none; font-weight: 700; font-size: 1.05rem; border: 2px solid rgba(4, 191, 104, 0.3); box-shadow: 0 4px 12px rgba(0,0,0,0.03); max-width: 100%; overflow: hidden; white-space: nowrap; opacity: 0; transform: scale(0.5) translateY(15px); width: 56px; transition: width var(--duration-fast) var(--spring-fast), transform var(--duration-fast) var(--spring-fast), opacity 250ms ease, background 250ms ease, border-color 250ms ease; }\r\n  .kiosk-container-wrapper .expressive-pill-link .pill-text, .kiosk-container-wrapper .expressive-pill-link .pill-icon { opacity: 0; transform: translateX(-10px); transition: opacity 200ms ease 100ms, transform var(--duration-fast) var(--spring-fast) 100ms; }\r\n  .kiosk-container-wrapper .expressive-pill-link .pill-text { margin-left: 16px; margin-right: 12px; }\r\n  .kiosk-container-wrapper .slide-card.active .expressive-pill-link.step-1 { opacity: 1; transform: scale(1) translateY(0); width: 375px; transition-delay: 150ms; }\r\n  .kiosk-container-wrapper .slide-card.active .expressive-pill-link.step-1 .pill-text, .kiosk-container-wrapper .slide-card.active .expressive-pill-link.step-1 .pill-icon { opacity: 1; transform: translateX(0); transition-delay: 250ms; }\r\n  .kiosk-container-wrapper .slide-card.active .expressive-pill-link.step-2 { opacity: 1; transform: scale(1) translateY(0); width: 410px; transition-delay: 280ms; }\r\n  .kiosk-container-wrapper .slide-card.active .expressive-pill-link.step-2 .pill-text, .kiosk-container-wrapper .slide-card.active .expressive-pill-link.step-2 .pill-icon { opacity: 1; transform: translateX(0); transition-delay: 380ms; }\r\n  .kiosk-container-wrapper .slide-card.active .expressive-pill-link.step-3 { opacity: 1; transform: scale(1) translateY(0); width: 295px; transition-delay: 410ms; }\r\n  .kiosk-container-wrapper .slide-card.active .expressive-pill-link.step-3 .pill-text, .kiosk-container-wrapper .slide-card.active .expressive-pill-link.step-3 .pill-icon { opacity: 1; transform: translateX(0); transition-delay: 510ms; }\r\n\r\n  .kiosk-container-wrapper .pill-number-circle { background: var(--green-light); color: #FFFFFF; width: 36px; height: 36px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 1rem; font-weight: 800; flex-shrink: 0; }\r\n\r\n  \/* NOVEDADES SISTEMA GOP *\/\r\n  .kiosk-container-wrapper .gop-illustrator-container { \r\n    background: #FFFFFF; \r\n    color: var(--on-surface); \r\n    border-radius: 45px; \r\n    padding: 48px 64px; \r\n    display: grid; \r\n    grid-template-columns: 320px 1fr; \r\n    gap: 48px; \r\n    align-items: center; \r\n    position: relative; \r\n    overflow: hidden; \r\n    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.3); \r\n    height: 100%;\r\n  }\r\n  \r\n  .kiosk-container-wrapper .gop-left-col { display: flex; flex-direction: column; justify-content: center; gap: 24px; }\r\n  .kiosk-container-wrapper .gop-main-title { font-size: 3.2rem; font-weight: 800; line-height: 1.1; color: #000000; letter-spacing: -0.02em; }\r\n  .kiosk-container-wrapper .gop-sidebar-menu { display: flex; flex-direction: column; gap: 12px; align-items: flex-start; }\r\n\r\n  .kiosk-container-wrapper .gop-side-pill { background: var(--gop-blue); color: #FFFFFF; padding: 16px 28px; border-radius: var(--shape-full); display: inline-flex; align-items: center; gap: 12px; font-size: 1.1rem; font-weight: 600; position: relative; cursor: pointer; width: fit-content; max-width: 100%; opacity: 0; transform: translateY(20px); transition: opacity 350ms var(--spring-fast), transform 400ms var(--spring-fast), background 300ms ease; }\r\n\r\n  .kiosk-container-wrapper .slide-card.active .gop-side-pill:nth-child(1) { opacity: 1; transform: translateY(0); transition-delay: 80ms; }\r\n  .kiosk-container-wrapper .slide-card.active .gop-side-pill:nth-child(2) { opacity: 1; transform: translateY(0); transition-delay: 140ms; }\r\n  .kiosk-container-wrapper .slide-card.active .gop-side-pill:nth-child(3) { opacity: 1; transform: translateY(0); transition-delay: 200ms; }\r\n  .kiosk-container-wrapper .slide-card.active .gop-side-pill:nth-child(4) { opacity: 1; transform: translateY(0); transition-delay: 260ms; }\r\n  .kiosk-container-wrapper .slide-card.active .gop-side-pill:nth-child(5) { opacity: 1; transform: translateY(0); transition-delay: 320ms; }\r\n  .kiosk-container-wrapper .slide-card.active .gop-side-pill:nth-child(6) { opacity: 1; transform: translateY(0); transition-delay: 380ms; }\r\n\r\n  .kiosk-container-wrapper .gop-side-pill.clicked-sim { background: var(--green-light); transform: scale(1.05); box-shadow: 0 6px 20px rgba(4, 191, 104, 0.4); z-index: 3; }\r\n  .kiosk-container-wrapper .slide-card.active .gop-sidebar-menu.simulating-back .gop-side-pill:not(.clicked-sim) { opacity: 0.35 !important; transform: translateX(-8px) scale(0.96); transition: all 400ms var(--spring-fast); }\r\n\r\n  .kiosk-container-wrapper .gop-connector-line { position: absolute; left: 100%; top: 50%; width: 0; height: 3px; background: var(--gop-blue); z-index: 5; opacity: 0; transform: translateY(-50%); transition: width 400ms var(--spring-fast), opacity 300ms ease; }\r\n  .kiosk-container-wrapper .gop-connector-line.show-line { width: 48px; opacity: 1; }\r\n\r\n  .kiosk-container-wrapper .gop-right-panel { \r\n    border: 2px solid var(--gop-blue); \r\n    border-radius: 36px; \r\n    padding: 32px; \r\n    width: 100%;\r\n    height: 100%;\r\n    max-height: 580px; \r\n    margin: auto 0;\r\n    display: flex; \r\n    flex-direction: column; \r\n    background: #FFFFFF; \r\n    position: relative; \r\n    overflow-y: auto; \r\n    scroll-behavior: smooth; \r\n    opacity: 0; \r\n    transform: translateX(40px) scale(0.96); \r\n    transition: opacity 400ms var(--spring-fast), transform 400ms var(--spring-fast); \r\n    pointer-events: none; \r\n  }\r\n  .kiosk-container-wrapper .gop-right-panel.panel-visible { opacity: 1; transform: translateX(0) scale(1); pointer-events: auto; }\r\n\r\n  .kiosk-container-wrapper .gop-guide-header p { font-size: 0.95rem; font-weight: 600; color: var(--on-surface-variant); line-height: 1.4; margin-bottom: 20px; }\r\n  .kiosk-container-wrapper .gop-section-label { font-size: 1rem; font-weight: 800; color: var(--dark-green); margin-bottom: 12px; margin-top: 16px; }\r\n\r\n  .kiosk-container-wrapper .gop-subgrid-obras, .kiosk-container-wrapper .gop-subgrid-urbanismo { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; margin-bottom: 12px; }\r\n\r\n  .kiosk-container-wrapper .gop-tramite-pill { background: var(--green-mid); color: #FFFFFF; padding: 18px 24px; border-radius: var(--shape-full); display: flex; align-items: center; gap: 14px; font-size: 1.05rem; font-weight: 600; width: 100%; cursor: pointer; transition: transform 250ms var(--spring-fast), background 250ms ease; }\r\n  .kiosk-container-wrapper .gop-tramite-pill.urbanismo-pill { background: var(--gop-blue); }\r\n  .kiosk-container-wrapper .pill-num { background: #FFFFFF; color: var(--green-mid); width: 32px; height: 32px; border-radius: var(--shape-xs); display: flex; align-items: center; justify-content: center; font-size: 0.95rem; font-weight: 800; flex-shrink: 0; }\r\n  .kiosk-container-wrapper .urbanismo-pill .pill-num { color: var(--gop-blue); }\r\n\r\n  .kiosk-container-wrapper .gop-tramite-boxes-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; padding-bottom: 16px; }\r\n  .kiosk-container-wrapper .tramite-box-card { background: #FFFFFF; color: var(--dark-green); border: 2px solid var(--green-mid); border-radius: var(--shape-full); padding: 12px 16px; display: flex; align-items: center; gap: 12px; font-size: 0.95rem; font-weight: 700; line-height: 1.25; position: relative; cursor: pointer; transition: all 400ms var(--spring-fast); }\r\n  .kiosk-container-wrapper .tramite-box-card .box-icon { color: var(--gop-blue); font-size: 28px; flex-shrink: 0; }\r\n\r\n  .kiosk-container-wrapper .tramite-box-card.highlight-new-tramite { background: #E8F5E9; border-color: var(--green-light); transform: scale(1.05); box-shadow: 0 8px 24px rgba(4, 191, 104, 0.4); z-index: 2; }\r\n  .kiosk-container-wrapper .tramite-box-card.highlight-new-tramite .box-icon { color: var(--green-light); }\r\n  .kiosk-container-wrapper .gop-tramite-boxes-grid.is-highlighting .tramite-box-card:not(.highlight-new-tramite) { opacity: 0.35; transform: scale(0.96); }\r\n\r\n  .kiosk-container-wrapper .badge-nuevo-tag { position: absolute; top: -10px; right: 14px; background: var(--magenta); color: #FFFFFF; font-size: 0.7rem; font-weight: 800; padding: 2px 8px; border-radius: var(--shape-full); text-transform: uppercase; letter-spacing: 0.05em; opacity: 0; transform: scale(0.6); transition: all 300ms var(--spring-fast); z-index: 5; }\r\n  .kiosk-container-wrapper .tramite-box-card.highlight-new-tramite .badge-nuevo-tag,\r\n  .kiosk-container-wrapper .utilidad-card.highlight-new-utilidad .badge-nuevo-tag { opacity: 1; transform: scale(1); }\r\n\r\n  .kiosk-container-wrapper .gop-utilidades-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; padding: 10px 0 20px 0; }\r\n  .kiosk-container-wrapper .utilidad-card { background: var(--gop-lime); color: #000000; border-radius: 20px; padding: 24px 18px; display: flex; align-items: center; justify-content: center; text-align: center; font-weight: 700; font-size: 1rem; line-height: 1.25; min-height: 150px; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06); cursor: pointer; text-decoration: none; position: relative; transition: all 400ms var(--spring-fast); }\r\n  .kiosk-container-wrapper .utilidad-card:hover { background: var(--gop-lime-dark); color: #000000; transform: translateY(-4px) scale(1.02); box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15); }\r\n\r\n  .kiosk-container-wrapper .utilidad-card.highlight-new-utilidad { background: var(--gop-lime-dark); color: #000000; transform: scale(1.05); box-shadow: 0 8px 24px rgba(178, 201, 38, 0.5); z-index: 2; }\r\n  .kiosk-container-wrapper .gop-utilidades-grid.is-highlighting .utilidad-card:not(.highlight-new-utilidad) { opacity: 0.35; transform: scale(0.96); }\r\n\r\n  .kiosk-container-wrapper .gop-stages-view { display: none; flex-direction: column; gap: 12px; padding-bottom: 24px; }\r\n  .kiosk-container-wrapper .gop-stages-view.active-stages { display: flex; }\r\n  .kiosk-container-wrapper .stage-item-row { display: flex; align-items: center; gap: 14px; padding: 12px 18px; background: var(--surface-variant); border-radius: var(--shape-full); border: 1px solid rgba(1, 38, 35, 0.1); }\r\n  .kiosk-container-wrapper .stage-badge { background: var(--dark-green); color: #FFFFFF; padding: 6px 14px; border-radius: var(--shape-xs); font-size: 0.85rem; font-weight: 800; flex-shrink: 0; }\r\n  .kiosk-container-wrapper .stage-title { font-size: 0.95rem; font-weight: 700; color: var(--dark-green); }\r\n  .kiosk-container-wrapper .back-to-menu-btn { background: var(--dark-green); color: #FFFFFF; border: none; padding: 10px 20px; border-radius: var(--shape-full); font-weight: 700; font-size: 0.95rem; cursor: pointer; display: inline-flex; align-items: center; gap: 8px; margin-bottom: 16px; width: max-content; }\r\n\r\n  \/* CONTROLES INFERIORES FLOTANTES SOBRE TODO EL DECK *\/\r\n  .kiosk-container-wrapper .m3-controls { \r\n    position: absolute;\r\n    bottom: 24px;\r\n    left: 50%;\r\n    transform: translateX(-50%);\r\n    width: 90%; \r\n    max-width: 1400px; \r\n    display: flex; \r\n    align-items: center; \r\n    justify-content: space-between; \r\n    gap: 24px; \r\n    transition: opacity 350ms var(--spring-fast); \r\n    opacity: 1; \r\n    z-index: 10;\r\n  }\r\n  .kiosk-container-wrapper .progress-track { flex: 1; height: 8px; background: rgba(255, 255, 255, 0.3); border-radius: var(--shape-full); overflow: hidden; backdrop-filter: blur(4px); }\r\n  .kiosk-container-wrapper .progress-fill { height: 100%; width: 0%; background: var(--cyan); border-radius: var(--shape-full); transition: width 80ms linear; }\r\n  .kiosk-container-wrapper .nav-buttons { display: flex; gap: 12px; align-items: center; }\r\n  .kiosk-container-wrapper .m3-btn { background: var(--surface-container); color: var(--dark-green); border: none; width: 52px; height: 52px; border-radius: var(--shape-full); cursor: pointer; display: flex; align-items: center; justify-content: center; box-shadow: 0 4px 12px rgba(0,0,0,0.2); transition: all var(--duration-fast) var(--spring-fast); }\r\n\r\n  \/* Ajustes Responsivos Portada y Jornada *\/\r\n  @media (max-width: 768px) {\r\n    .kiosk-container-wrapper .hero-cta-group {\r\n      flex-direction: column;\r\n      align-items: center;\r\n      justify-content: center;\r\n    }\r\n    .kiosk-container-wrapper .pill-button-secondary {\r\n      width: 100%;\r\n      justify-content: center;\r\n    }\r\n    .kiosk-container-wrapper .modules-grid {\r\n      flex-direction: column;\r\n      gap: 16px;\r\n    }\r\n    .kiosk-container-wrapper .module-img {\r\n      width: 100%;\r\n    }\r\n    .kiosk-container-wrapper .card-info-jornada {\r\n      padding: 20px;\r\n      border-radius: 20px;\r\n      gap: 14px;\r\n    }\r\n    .kiosk-container-wrapper .info-item {\r\n      font-size: 1.05rem;\r\n      gap: 10px;\r\n    }\r\n    .kiosk-container-wrapper .icon-circle {\r\n      width: 32px;\r\n      height: 32px;\r\n    }\r\n    .kiosk-container-wrapper .icon-circle .material-symbols-outlined {\r\n      font-size: 1.15rem;\r\n    }\r\n    .kiosk-container-wrapper .btn-participa {\r\n      width: 100%;\r\n      font-size: 1.1rem;\r\n      padding: 14px 24px;\r\n    }\r\n  }\r\n<\/style>\r\n\r\n<div class=\"kiosk-container-wrapper\">\r\n\r\n  <main class=\"deck-viewport\" id=\"deck\">\r\n\r\n    <!-- PANEL 02: JORNADA DE ACTUALIZACI\u00d3N PROFESIONAL (FONDOPEP PANTALLA COMPLETA) -->\r\n    <section id=\"panel_02\" class=\"slide-card slide-fullscreen-bg slide-jornada active\">\r\n      <div class=\"jornada-wrapper\">\r\n        <div class=\"card-main-jornada m3-anim\">\r\n          <img decoding=\"async\" src=\"https:\/\/posadas.gov.ar\/planurbano\/wp-content\/uploads\/2026\/09\/titulo.png\" alt=\"Jornada de Actualizaci\u00f3n Profesional 2da Edici\u00f3n\" class=\"title-img\">\r\n          <div class=\"modules-grid\">\r\n            <img decoding=\"async\" src=\"https:\/\/posadas.gov.ar\/planurbano\/wp-content\/uploads\/2026\/09\/M1.png\" alt=\"M\u00f3dulo 1: Tramitaci\u00f3n GOP\" class=\"module-img\">\r\n            <img decoding=\"async\" src=\"https:\/\/posadas.gov.ar\/planurbano\/wp-content\/uploads\/2026\/09\/M2-1.png\" alt=\"M\u00f3dulo 2: Armado de plano de arquitectura Municipal\" class=\"module-img\">\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"card-info-jornada m3-anim\">\r\n          <div class=\"info-item\">\r\n            <div class=\"info-group\">\r\n              <span class=\"icon-circle\">\r\n                <span class=\"material-symbols-outlined\">calendar_month<\/span>\r\n              <\/span>\r\n              <span class=\"text\"><strong>Mi\u00e9rcoles 23 de septiembre<\/strong><\/span>\r\n            <\/div>\r\n            <div class=\"info-group\" style=\"margin-left: 8px;\">\r\n              <span class=\"icon-circle\">\r\n                <span class=\"material-symbols-outlined\">schedule<\/span>\r\n              <\/span>\r\n              <span class=\"text\"><strong>19:00 hs.<\/strong><\/span>\r\n            <\/div>\r\n          <\/div>\r\n          <div class=\"info-item\">\r\n            <span class=\"icon-circle\">\r\n              <span class=\"material-symbols-outlined\">location_on<\/span>\r\n            <\/span>\r\n            <span class=\"text\"><strong>SUM - 5.\u00b0 piso<\/strong> | Municipalidad de Posadas<\/span>\r\n          <\/div>\r\n          <a href=\"https:\/\/docs.google.com\/forms\/d\/1uklFtMcNbEP7p8PNJURUqWp2o1vgBP1z0mYH1NYEiHE\/viewform?edit_requested=true\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"btn-participa\">\r\n            <span>Particip\u00e1<\/span>\r\n            <span class=\"material-symbols-outlined\">arrow_forward<\/span>\r\n          <\/a>\r\n        <\/div>\r\n      <\/div>\r\n    <\/section>\r\n\r\n    <!-- PANEL 01: SEGUNDO PLENARIO POSADAS 2035 (FONDO VIDEO PANTALLA COMPLETA) -->\r\n    <section id=\"panel_01\" class=\"slide-card slide-fullscreen-bg slide-hero-video\">\r\n      <div class=\"hero-video-wrapper\">\r\n        <iframe \r\n          src=\"https:\/\/www.youtube.com\/embed\/K9V3Kw0KS3E?autoplay=1&mute=1&controls=0&loop=1&playlist=K9V3Kw0KS3E&playsinline=1&enablejsapi=1\" \r\n          title=\"Fondo Video Posadas\" \r\n          frameborder=\"0\" \r\n          allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\" \r\n          allowfullscreen>\r\n        <\/iframe>\r\n      <\/div>\r\n      <div class=\"hero-overlay-green\"><\/div>\r\n      <div class=\"hero-card\">\r\n        <img decoding=\"async\" src=\"https:\/\/posadas.gov.ar\/planurbano\/wp-content\/uploads\/2026\/09\/logo-pep2035.png\" alt=\"Logo Plan Estrat\u00e9gico Posadas 2035\" class=\"hero-logo m3-anim\">\r\n        <h1 class=\"hero-title-main m3-anim\">\r\n          Segundo Plenario<br>Posadas 2035\r\n        <\/h1>\r\n        <div class=\"hero-pill-main m3-anim\">\r\n          Priorizar las acciones para<br>transformar la ciudad\r\n        <\/div>\r\n        <div class=\"hero-cta-group m3-anim\">\r\n          <a href=\"https:\/\/drive.google.com\/drive\/u\/0\/folders\/19V59Oac3rujN-0_ebb83dyYGg0ujbQQu\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"pill-button-secondary\">\r\n            <span>Material de<br>consulta<\/span>\r\n            <span class=\"material-symbols-outlined\">folder<\/span>\r\n          <\/a>\r\n        <\/div>\r\n      <\/div>\r\n    <\/section>\r\n\r\n    <!-- PANEL 03: C\u00d3DIGO DE EDIFICACI\u00d3N -->\r\n    <section id=\"panel_03\" class=\"slide-card slide-why\">\r\n      <div class=\"m3-anim\" style=\"display: flex; flex-direction: column; justify-content: center;\">\r\n        <div style=\"display: flex; align-items: center; gap: 12px; margin-bottom: 16px;\">\r\n          <span style=\"background: var(--green-light); color: #FFFFFF; font-weight: 800; font-size: 0.95rem; padding: 6px 18px; border-radius: var(--shape-full); text-transform: uppercase;\">Nuevo<\/span>\r\n        <\/div>\r\n        <h2 class=\"why-title\" style=\"margin-top: 0; font-size: 3.4rem; line-height: 1.05;\">C\u00f3digo de<br><span style=\"color: var(--dark-green)\">Edificaci\u00f3n<\/span><\/h2>\r\n        \r\n        <div style=\"margin-top: 28px;\">\r\n          <p class=\"m3-anim\" style=\"font-size: 1.15rem; font-weight: 700; color: var(--on-surface-variant); margin-bottom: 14px;\">D\u00f3nde encontrarlo:<\/p>\r\n          <div style=\"display: flex; flex-direction: column; gap: 12px;\" id=\"pillContainer\">\r\n            <a href=\"https:\/\/drive.google.com\/file\/d\/1eyLxb_MMhSKjQor9YqzGRm3XGLKgSDh_\/view\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"expressive-pill-link step-1\">\r\n              <div style=\"display: flex; align-items: center;\">\r\n                <div class=\"pill-number-circle\">1<\/div>\r\n                <span class=\"pill-text\">GOP (Secci\u00f3n: Legislaci\u00f3n Vigente)<\/span>\r\n              <\/div>\r\n              <span class=\"material-symbols-rounded pill-icon\" style=\"color: var(--green-mid); font-size: 24px;\">open_in_new<\/span>\r\n            <\/a>\r\n\r\n            <a href=\"https:\/\/posadas.gov.ar\/images\/guiatramite\/doc\/planificacion\/codigoEdificacion.pdf\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"expressive-pill-link step-2\">\r\n              <div style=\"display: flex; align-items: center;\">\r\n                <div class=\"pill-number-circle\">2<\/div>\r\n                <span class=\"pill-text\">P\u00e1gina oficial Municipalidad de Posadas<\/span>\r\n              <\/div>\r\n              <span class=\"material-symbols-rounded pill-icon\" style=\"color: var(--green-mid); font-size: 24px;\">open_in_new<\/span>\r\n            <\/a>\r\n\r\n            <a href=\"https:\/\/digesto.hcdposadas.gob.ar\/ver_ordenanza\/1777\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"expressive-pill-link step-3\">\r\n              <div style=\"display: flex; align-items: center;\">\r\n                <div class=\"pill-number-circle\">3<\/div>\r\n                <span class=\"pill-text\">Digesto Jur\u00eddico (HCD)<\/span>\r\n              <\/div>\r\n              <span class=\"material-symbols-rounded pill-icon\" style=\"color: var(--green-mid); font-size: 24px;\">open_in_new<\/span>\r\n            <\/a>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n      <div class=\"m3-anim\">\r\n        <div class=\"why-image-wrapper\">\r\n          <img fetchpriority=\"high\" src=\"https:\/\/posadas.gov.ar\/planurbano\/wp-content\/uploads\/2026\/08\/codigo-edificacion.png\" alt=\"C\u00f3digo de Edificaci\u00f3n Municipal\" width=\"1200\" height=\"800\" fetchpriority=\"high\" decoding=\"async\">\r\n        <\/div>\r\n      <\/div>\r\n    <\/section>\r\n\r\n    <!-- PANEL 04: NOVEDADES DEL SISTEMA -->\r\n    <section id=\"panel_04\" class=\"slide-card gop-illustrator-container\">\r\n      <div class=\"gop-left-col\">\r\n        <h2 class=\"gop-main-title m3-anim\">Novedades<br>del sistema<\/h2>\r\n        <div class=\"gop-sidebar-menu\" id=\"simMenuWrapper\">\r\n          <div class=\"gop-side-pill\" id=\"simInicioBtn\"><span class=\"material-symbols-rounded\">home<\/span>Inicio<\/div>\r\n          \r\n          <div class=\"gop-side-pill\" id=\"simNuevoTramiteBtn\">\r\n            <span class=\"material-symbols-rounded\">note_add<\/span>Nuevo Tr\u00e1mite\r\n            <div class=\"gop-connector-line\" id=\"simConnectorLine2\"><\/div>\r\n          <\/div>\r\n          \r\n          <div class=\"gop-side-pill\" id=\"simMisTramitesBtn\"><span class=\"material-symbols-rounded\">folder<\/span>Mis Tr\u00e1mites<\/div>\r\n          \r\n          <div class=\"gop-side-pill\" id=\"simUtilidadesBtn\">\r\n            <span class=\"material-symbols-rounded\">list<\/span>Utilidades\r\n            <div class=\"gop-connector-line\" id=\"simConnectorLine3\"><\/div>\r\n          <\/div>\r\n          \r\n          <div class=\"gop-side-pill\" id=\"simGuiaBtn\">\r\n            <span class=\"material-symbols-rounded\">help<\/span>Gu\u00eda de Tr\u00e1mites\r\n            <div class=\"gop-connector-line\" id=\"simConnectorLine\"><\/div>\r\n          <\/div>\r\n          \r\n          <div class=\"gop-side-pill\" id=\"simLegVigenteBtn\"><span class=\"material-symbols-rounded\">library_books<\/span>Legislaci\u00f3n Vigente<\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"gop-right-panel\" id=\"simRightPanel\">\r\n        \r\n        <!-- VISTA 1: GU\u00cdA DE TR\u00c1MITES -->\r\n        <div id=\"viewMainGuide\">\r\n          <div class=\"gop-guide-header\">\r\n            <div style=\"font-weight: 800; font-size: 1.15rem; color: var(--dark-green); margin-bottom: 6px;\">Gu\u00eda de tr\u00e1mites :<\/div>\r\n            <p>En el siguiente apartado vas a encontrar informaci\u00f3n sobre los pasos que conlleva cada tr\u00e1mite y en la primer clase de cada uno vas a poder encontrar la documentaci\u00f3n para comenzar su tramitaci\u00f3n<\/p>\r\n          <\/div>\r\n\r\n          <div>\r\n            <div class=\"gop-section-label\">Direcci\u00f3n de Obras privadas<\/div>\r\n            <div class=\"gop-subgrid-obras\">\r\n              <div class=\"gop-tramite-pill\" data-tramite=\"Obra nueva\"><div class=\"pill-num\">03<\/div>Obra nueva<\/div>\r\n              <div class=\"gop-tramite-pill\" data-tramite=\"Registraci\u00f3n\"><div class=\"pill-num\">04<\/div>Registraci\u00f3n<\/div>\r\n              <div class=\"gop-tramite-pill\" data-tramite=\"Reforma\"><div class=\"pill-num\">06<\/div>Reforma<\/div>\r\n              <div class=\"gop-tramite-pill\" data-tramite=\"Ampliaci\u00f3n\"><div class=\"pill-num\">07<\/div>Ampliaci\u00f3n<\/div>\r\n            <\/div>\r\n          <\/div>\r\n\r\n          <div>\r\n            <div class=\"gop-section-label\">Direcci\u00f3n de Urbanismo<\/div>\r\n            <div class=\"gop-subgrid-urbanismo\">\r\n              <div class=\"gop-tramite-pill urbanismo-pill\"><div class=\"pill-num\">01<\/div>Fact. de obras - Edificios<\/div>\r\n              <div class=\"gop-tramite-pill urbanismo-pill\"><div class=\"pill-num\">01<\/div>Fact. de obras - Fraccionamientos \/ Conjunto inmobiliario<\/div>\r\n              <div class=\"gop-tramite-pill urbanismo-pill\"><div class=\"pill-num\">01<\/div>Factibilidad de Antenas<\/div>\r\n              <div class=\"gop-tramite-pill urbanismo-pill\"><div class=\"pill-num\">01<\/div>Factibilidad de Actividad \/ Uso de suelo<\/div>\r\n              <div class=\"gop-tramite-pill urbanismo-pill\"><div class=\"pill-num\">01<\/div>Indicadores urban\u00edsticos<\/div>\r\n              <div class=\"gop-tramite-pill urbanismo-pill\"><div class=\"pill-num\">01<\/div>Informe patrimonial<\/div>\r\n              <div class=\"gop-tramite-pill urbanismo-pill\"><div class=\"pill-num\">08<\/div>Certificado de numeraci\u00f3n de finca<\/div>\r\n            <\/div>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <!-- VISTA 2: NUEVO TR\u00c1MITE -->\r\n        <div id=\"viewNewTramite\" style=\"display: none;\">\r\n          <div class=\"gop-guide-header\">\r\n            <div style=\"font-weight: 800; font-size: 1.15rem; color: var(--dark-green); margin-bottom: 20px;\">Nuevo Tr\u00e1mite<\/div>\r\n          <\/div>\r\n\r\n          <div class=\"gop-tramite-boxes-grid\" id=\"newTramiteGrid\">\r\n            <div class=\"tramite-box-card\"><span class=\"material-symbols-rounded box-icon\">inventory_2<\/span><span>01 - Factibilidad urban\u00edstica<\/span><\/div>\r\n            <div class=\"tramite-box-card\"><span class=\"material-symbols-rounded box-icon\">inventory_2<\/span><span>03 - Obra Nueva<\/span><\/div>\r\n            <div class=\"tramite-box-card\"><span class=\"material-symbols-rounded box-icon\">inventory_2<\/span><span>04 - Registraci\u00f3n<\/span><\/div>\r\n            <div class=\"tramite-box-card\"><span class=\"material-symbols-rounded box-icon\">inventory_2<\/span><span>05 - Demolici\u00f3n<\/span><\/div>\r\n            <div class=\"tramite-box-card\"><span class=\"material-symbols-rounded box-icon\">inventory_2<\/span><span>06 - Reforma<\/span><\/div>\r\n            <div class=\"tramite-box-card\"><span class=\"material-symbols-rounded box-icon\">inventory_2<\/span><span>07 - Ampliaci\u00f3n<\/span><\/div>\r\n            <div class=\"tramite-box-card\"><span class=\"material-symbols-rounded box-icon\">inventory_2<\/span><span>08 - Certificado de Numeraci\u00f3n de Finca<\/span><\/div>\r\n            <div class=\"tramite-box-card\"><span class=\"material-symbols-rounded box-icon\">inventory_2<\/span><span>09 - Permiso para trabajos preliminares<\/span><\/div>\r\n            <div class=\"tramite-box-card\"><span class=\"material-symbols-rounded box-icon\">inventory_2<\/span><span>10 - Permiso de inicio de obra<\/span><\/div>\r\n            \r\n            <div class=\"tramite-box-card\" id=\"targetTramiteAgil\">\r\n              <span class=\"badge-nuevo-tag\">Nuevo<\/span>\r\n              <span class=\"material-symbols-rounded box-icon\">inventory_2<\/span>\r\n              <span>11 - Obra Nueva Tr\u00e1mite \u00c1gil<\/span>\r\n            <\/div>\r\n\r\n            <div class=\"tramite-box-card\"><span class=\"material-symbols-rounded box-icon\">inventory_2<\/span><span>12 - Final de Obra<\/span><\/div>\r\n            <div class=\"tramite-box-card\"><span class=\"material-symbols-rounded box-icon\">inventory_2<\/span><span>14 - Otras gestiones<\/span><\/div>\r\n            <div class=\"tramite-box-card\"><span class=\"material-symbols-rounded box-icon\">inventory_2<\/span><span>15 - Mensura de propiedad horizontal<\/span><\/div>\r\n            <div class=\"tramite-box-card\"><span class=\"material-symbols-rounded box-icon\">inventory_2<\/span><span>16 - Mensura particular simple<\/span><\/div>\r\n            <div class=\"tramite-box-card\"><span class=\"material-symbols-rounded box-icon\">inventory_2<\/span><span>17 - Mensura<\/span><\/div>\r\n            <div class=\"tramite-box-card\"><span class=\"material-symbols-rounded box-icon\">inventory_2<\/span><span>18 - Mensura de conjunto inmobiliario<\/span><\/div>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <!-- VISTA 3: UTILIDADES -->\r\n        <div id=\"viewUtilidades\" style=\"display: none;\">\r\n          <div style=\"font-weight: 800; font-size: 1.15rem; color: var(--dark-green); margin-bottom: 20px;\">Utilidades<\/div>\r\n\r\n          <div class=\"gop-utilidades-grid\" id=\"utilidadesGrid\">\r\n            <div class=\"utilidad-card\">Declaraci\u00f3n jurada<br>para obras de<br>registraci\u00f3n<\/div>\r\n            <div class=\"utilidad-card\">Renuncia y cambio de profesional para Tr\u00e1mite 14 - Otras gestiones<\/div>\r\n            <div class=\"utilidad-card\">Pasos para<br>registrarse en GOP 2026<\/div>\r\n            <div class=\"utilidad-card\">Planilla de<br>certificaci\u00f3n de<br>firma<\/div>\r\n            <div class=\"utilidad-card\">Archivos y car\u00e1tulas<br>municipales<\/div>\r\n            <div class=\"utilidad-card\">Solicitud para:<br>Digitalizaci\u00f3n de<br>planos<\/div>\r\n            <div class=\"utilidad-card\">Modelos veredas<\/div>\r\n            \r\n            <a href=\"https:\/\/calcular-honorarios.infinityfreeapp.com\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"utilidad-card\" id=\"targetCalculadora\">\r\n              <span class=\"badge-nuevo-tag\">Nuevo<\/span>\r\n              Calculadora de simulaci\u00f3n de derechos de construcci\u00f3n\r\n            <\/a>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <!-- VISTA DESGLOSE DE ETAPAS -->\r\n        <div id=\"viewStagesDetail\" class=\"gop-stages-view\">\r\n          <button class=\"back-to-menu-btn\" id=\"backToMenuBtn\">\r\n            <span class=\"material-symbols-rounded\">arrow_back<\/span> Volver a Gu\u00edas\r\n          <\/button>\r\n          <div style=\"font-weight: 800; font-size: 1.2rem; color: var(--dark-green); margin-bottom: 14px;\" id=\"stageHeaderTitle\">Tr\u00e1mite<\/div>\r\n          \r\n          <div class=\"stage-item-row\"><div class=\"stage-badge\">Etapa 01<\/div><div class=\"stage-title\">Inicio de tr\u00e1mite y suba de documentaci\u00f3n<\/div><\/div>\r\n          <div class=\"stage-item-row\"><div class=\"stage-badge\">Etapa 02<\/div><div class=\"stage-title\">Control inicial<\/div><\/div>\r\n          <div class=\"stage-item-row\"><div class=\"stage-badge\">Etapa 03<\/div><div class=\"stage-title\">Libre deuda del inmueble<\/div><\/div>\r\n          <div class=\"stage-item-row\"><div class=\"stage-badge\">Etapa 04<\/div><div class=\"stage-title\">Control de actas<\/div><\/div>\r\n          <div class=\"stage-item-row\"><div class=\"stage-badge\">Etapa 05<\/div><div class=\"stage-title\">Coordinaci\u00f3n de inspecci\u00f3n<\/div><\/div>\r\n          <div class=\"stage-item-row\"><div class=\"stage-badge\">Etapa 06<\/div><div class=\"stage-title\">Control de estado de dominio y estado parcelario<\/div><\/div>\r\n          <div class=\"stage-item-row\"><div class=\"stage-badge\">Etapa 07<\/div><div class=\"stage-title\">Visado urbanismo - verificaci\u00f3n de patrimonio<\/div><\/div>\r\n          <div class=\"stage-item-row\"><div class=\"stage-badge\">Etapa 08<\/div><div class=\"stage-title\">Visado de vereda<\/div><\/div>\r\n          <div class=\"stage-item-row\"><div class=\"stage-badge\">Etapa 09<\/div><div class=\"stage-title\">Control intermedio de la documentaci\u00f3n<\/div><\/div>\r\n          <div class=\"stage-item-row\"><div class=\"stage-badge\">Etapa 10<\/div><div class=\"stage-title\">Visado de documentaci\u00f3n t\u00e9cnica<\/div><\/div>\r\n          <div class=\"stage-item-row\"><div class=\"stage-badge\">Etapa 11<\/div><div class=\"stage-title\">Aprobaci\u00f3n de bomberos<\/div><\/div>\r\n          <div class=\"stage-item-row\"><div class=\"stage-badge\">Etapa 12<\/div><div class=\"stage-title\">Liquidaci\u00f3n de derechos de construcci\u00f3n (FDU)<\/div><\/div>\r\n          <div class=\"stage-item-row\"><div class=\"stage-badge\">Etapa 13<\/div><div class=\"stage-title\">Visado de instalaciones complementarias<\/div><\/div>\r\n          <div class=\"stage-item-row\"><div class=\"stage-badge\">Etapa 14<\/div><div class=\"stage-title\">Estudio de expediente y control de planos para QR<\/div><\/div>\r\n          <div class=\"stage-item-row\"><div class=\"stage-badge\">Etapa 15<\/div><div class=\"stage-title\">Aprobaci\u00f3n final con QR de planos<\/div><\/div>\r\n        <\/div>\r\n\r\n      <\/div>\r\n    <\/section>\r\n\r\n    <!-- PANEL 05: TR\u00c1MITE \u00c1GIL -->\r\n    <section id=\"panel_05\" class=\"slide-card\" style=\"background: var(--green-mid); color: #FFFFFF; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 48px 64px;\">\r\n      <div class=\"m3-anim\" style=\"text-align: center; margin-bottom: 28px;\">\r\n        <div style=\"margin-bottom: 10px;\">\r\n          <span style=\"background: var(--magenta); color: #FFFFFF; font-size: 0.9rem; font-weight: 800; padding: 4px 18px; border-radius: var(--shape-full); text-transform: uppercase; letter-spacing: 0.08em; display: inline-block;\">Nuevo<\/span>\r\n        <\/div>\r\n        <h2 style=\"font-size: 2.8rem; font-weight: 800; color: #FFFFFF; line-height: 1.15; margin-bottom: 6px;\">Tr\u00e1mite \u00c1gil<\/h2>\r\n        <h3 style=\"font-size: 2rem; font-weight: 700; color: rgba(255,255,255,0.9); line-height: 1.15;\">para Obras Nuevas de menor escala<\/h3>\r\n      <\/div>\r\n      \r\n      <div class=\"m3-anim\" style=\"display: grid; grid-template-columns: 1fr 1fr; gap: 36px; width: 100%; max-width: 1100px; align-items: stretch;\">\r\n        <div style=\"background: #FFFFFF; color: var(--dark-green); border-radius: var(--shape-xl); padding: 36px 40px; display: flex; flex-direction: column; justify-content: space-between; box-shadow: 0 12px 30px rgba(0,0,0,0.2);\">\r\n          <div>\r\n            <h3 style=\"font-size: 2.2rem; font-weight: 800; color: #000000; text-align: center; margin-bottom: 24px; letter-spacing: -0.02em;\">\u00bfA qui\u00e9n est\u00e1 destinado?<\/h3>\r\n            <p style=\"font-size: 1.1rem; font-weight: 600; color: var(--on-surface-variant); margin-bottom: 16px;\">Obras nuevas de escala menor:<br>Viviendas de:<\/p>\r\n            <div style=\"background: var(--green-light); color: #FFFFFF; font-weight: 800; font-size: 1.15rem; padding: 12px 24px; border-radius: var(--shape-full); text-align: center; margin-bottom: 20px; box-shadow: 0 4px 12px rgba(4,191,104,0.3);\">\r\n              hasta 2 niveles y 200 m\u00b2\r\n            <\/div>\r\n            <p style=\"font-size: 1.1rem; font-weight: 600; color: var(--on-surface-variant); margin-bottom: 16px;\">o locales comerciales de:<\/p>\r\n          <\/div>\r\n          <div style=\"background: var(--green-light); color: #FFFFFF; font-weight: 800; font-size: 1.15rem; padding: 12px 24px; border-radius: var(--shape-full); text-align: center; box-shadow: 0 4px 12px rgba(4,191,104,0.3);\">\r\n            hasta 100 m\u00b2\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div style=\"background: #FFFFFF; color: var(--dark-green); border-radius: var(--shape-xl); padding: 36px 40px; display: flex; flex-direction: column; justify-content: space-between; box-shadow: 0 12px 30px rgba(0,0,0,0.2); position: relative; overflow: hidden;\">\r\n          <div>\r\n            <h3 style=\"font-size: 2.2rem; font-weight: 800; color: #000000; text-align: center; margin-bottom: 24px; letter-spacing: -0.02em;\">\u00bfC\u00f3mo iniciar el tr\u00e1mite?<\/h3>\r\n            <p style=\"font-size: 1.15rem; font-weight: 600; color: var(--on-surface-variant); margin-bottom: 24px;\">Carg\u00e1 la documentaci\u00f3n en la bandeja de:<\/p>\r\n          <\/div>\r\n\r\n          <div style=\"display: flex; flex-direction: column; gap: 16px; align-items: center; min-height: 120px; justify-content: center;\" id=\"agilSimContainer\">\r\n            <div id=\"simulatedNewTramiteBtn\" style=\"background: var(--gop-blue); color: #FFFFFF; padding: 16px 28px; border-radius: var(--shape-full); display: inline-flex; align-items: center; justify-content: center; gap: 12px; font-size: 1.1rem; font-weight: 600; width: fit-content; box-shadow: 0 6px 18px rgba(0,119,145,0.3); opacity: 0; transform: translateY(15px) scale(0.95); transition: all 400ms var(--spring-fast);\">\r\n              <span class=\"material-symbols-rounded\" style=\"font-size: 24px;\">note_add<\/span>\r\n              <span>Nuevo Tr\u00e1mite<\/span>\r\n            <\/div>\r\n\r\n            <div id=\"simulatedFinalPill\" style=\"background: #FFFFFF; color: var(--dark-green); border: 2px solid var(--green-mid); border-radius: var(--shape-full); padding: 14px 20px; display: flex; align-items: center; gap: 14px; font-size: 1.05rem; font-weight: 700; box-shadow: 0 6px 18px rgba(3,140,90,0.15); width: 100%; justify-content: center; opacity: 0; transform: translateY(15px) scale(0.95); transition: all 400ms var(--spring-fast);\">\r\n              <span class=\"material-symbols-rounded\" style=\"color: var(--gop-blue); font-size: 28px;\">inventory_2<\/span>\r\n              <span>11 - Obra Nueva Tr\u00e1mite \u00c1gil<\/span>\r\n            <\/div>\r\n          <\/div>\r\n          <div style=\"height: 12px;\"><\/div>\r\n        <\/div>\r\n      <\/div>\r\n    <\/section>\r\n\r\n    <!-- PANEL 06: CALCULADORA DE DERECHOS -->\r\n    <section id=\"panel_06\" class=\"slide-card slide-why\">\r\n      <div class=\"m3-anim\" style=\"display: flex; flex-direction: column; justify-content: center;\">\r\n        <div style=\"display: flex; align-items: center; gap: 12px; margin-bottom: 16px;\">\r\n          <span style=\"background: var(--green-light); color: #FFFFFF; font-weight: 800; font-size: 0.95rem; padding: 6px 18px; border-radius: var(--shape-full); text-transform: uppercase;\">Nuevo<\/span>\r\n        <\/div>\r\n        <h2 class=\"why-title\" style=\"margin-top: 0; font-size: 2.8rem; line-height: 1.05;\">Calculadora de<br><span style=\"color: var(--dark-green)\">Derechos de Construcci\u00f3n<\/span><\/h2>\r\n        \r\n        <div style=\"margin-top: 20px; display: flex; flex-direction: column; gap: 12px;\">\r\n          <p style=\"font-size: 1.1rem; font-weight: 800; color: var(--on-surface);\">\u00a1Todo a un clic!<\/p>\r\n          <p style=\"font-size: 1.05rem; font-weight: 600; color: var(--on-surface-variant); font-style: italic;\">\u201cSolo carg\u00e1s los datos de tu obra y el sistema simula el c\u00e1lculo.\u201d<\/p>\r\n          <p style=\"font-size: 0.95rem; font-weight: 700; color: var(--on-surface-variant); margin-top: 4px;\">D\u00f3nde encontrarlo (Utilidades):<\/p>\r\n          \r\n          <div style=\"display: flex; flex-direction: column; gap: 12px; align-items: flex-start; min-height: 150px; justify-content: center;\" id=\"calcDemoContainer\">\r\n            <div id=\"calcSimUtilBtn\" style=\"background: var(--gop-blue); color: #FFFFFF; padding: 16px 28px; border-radius: var(--shape-full); display: inline-flex; align-items: center; gap: 12px; font-size: 1.1rem; font-weight: 600; width: fit-content; box-shadow: 0 6px 18px rgba(0,119,145,0.3); opacity: 0; transform: translateY(15px) scale(0.95); transition: all 400ms var(--spring-fast);\">\r\n              <span class=\"material-symbols-rounded\" style=\"font-size: 24px;\">list<\/span>\r\n              <span>Utilidades<\/span>\r\n            <\/div>\r\n\r\n            <div id=\"calcSimCard\" style=\"background: var(--gop-lime); color: #000000; border-radius: 28px; width: 220px; height: 180px; padding: 20px; display: flex; align-items: center; justify-content: center; text-align: center; font-weight: 700; font-size: 1rem; line-height: 1.35; box-shadow: 0 8px 24px rgba(178, 201, 38, 0.4); opacity: 0; transform: translateY(15px) scale(0.95); transition: all 400ms var(--spring-fast);\">\r\n              Calculadora de<br>simulaci\u00f3n de<br>derechos de<br>construcci\u00f3n\r\n            <\/div>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"m3-anim\">\r\n        <div class=\"why-image-wrapper\">\r\n          <img loading=\"lazy\" src=\"https:\/\/posadas.gov.ar\/planurbano\/wp-content\/uploads\/2026\/08\/calculadora-derecho.png\" alt=\"Calculadora de derechos de construcci\u00f3n\" width=\"1200\" height=\"800\" loading=\"lazy\" decoding=\"async\">\r\n        <\/div>\r\n      <\/div>\r\n    <\/section>\r\n\r\n    <!-- PANEL 07: ORDENANZAS VIGENTES -->\r\n    <section id=\"panel_07\" class=\"slide-card slide-dual-card\">\r\n      <h2 class=\"dual-header m3-anim\">Ordenanzas vigentes para la<br>Regularizaci\u00f3n de Obras<\/h2>\r\n      <div class=\"dual-grid m3-anim\">\r\n        <div class=\"dual-card-item\"><h3>Ordenanza XVIII n\u00ba 304<\/h3><div class=\"dual-card-badge\">Dirigida a <b>construcciones Antirreglamentarias<\/b> que no cuentan con su certificado final de Obra.<\/div><\/div>\r\n        <div class=\"dual-card-item\"><h3>Ordenanza XVIII n\u00ba 309<\/h3><div class=\"dual-card-badge\">Dirigida a <b>viviendas o peque\u00f1os comercios no declarados<\/b>, con el beneficio de acceder a una <b>reducci\u00f3n del 50 %<\/b> de los derechos de construcci\u00f3n.<\/div><\/div>\r\n      <\/div>\r\n      <div class=\"dual-footer m3-anim\">Contin\u00faa vigente el r\u00e9gimen hasta el 15 de octubre de 2026<\/div>\r\n    <\/section>\r\n\r\n    <!-- PANEL 08: EMPRESAS HABILITADAS -->\r\n    <section id=\"panel_08\" class=\"slide-card slide-empresas\">\r\n      <h2 class=\"empresas-title m3-anim\">Empresas habilitadas para la<br>conservaci\u00f3n de instalaciones<br>electromec\u00e1nicas<\/h2>\r\n      \r\n      <div class=\"empresas-content m3-anim\">\r\n        <div class=\"empresas-image-wrapper\">\r\n          <img decoding=\"async\" src=\"https:\/\/posadas.gov.ar\/planurbano\/wp-content\/uploads\/2026\/09\/drone_01.jpg\" alt=\"Vista a\u00e9rea municipio con drone\">\r\n        <\/div>\r\n        \r\n        <div class=\"empresas-qr-section\">\r\n          <div class=\"empresas-qr-wrapper\">\r\n            <img decoding=\"async\" src=\"https:\/\/posadas.gov.ar\/planurbano\/wp-content\/uploads\/2026\/09\/qr_01.jpg\" alt=\"QR Empresas Habilitadas\">\r\n          <\/div>\r\n          <a href=\"https:\/\/posadas.gov.ar\/planurbano\/registro-de-conservadores\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"empresas-btn\">\r\n            Consult\u00e1 aqu\u00ed<br>empresas habilitadas\r\n          <\/a>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <p class=\"empresas-description m3-anim\">Empresas encargadas de la instalaci\u00f3n, conservaci\u00f3n y servicio de: Ascensores, Montacargas, Escaleras mec\u00e1nicas, Guarda mecanizada de veh\u00edculos y Rampas m\u00f3viles.<\/p>\r\n    <\/section>\r\n\r\n  <\/main>\r\n\r\n  <!-- CONTROLES INFERIORES FLOTANTES -->\r\n  <div class=\"m3-controls\" id=\"controlsBar\">\r\n    <div class=\"progress-track\"><div class=\"progress-fill\" id=\"progressFill\"><\/div><\/div>\r\n    <div class=\"nav-buttons\">\r\n      <button class=\"m3-btn\" id=\"prevBtn\" title=\"Anterior\"><span class=\"material-symbols-rounded\">arrow_back<\/span><\/button>\r\n      <button class=\"m3-btn\" id=\"pauseBtn\" title=\"Pausar\/Reanudar\"><span class=\"material-symbols-rounded\" id=\"pauseIcon\">pause<\/span><\/button>\r\n      <button class=\"m3-btn\" id=\"nextBtn\" title=\"Siguiente\"><span class=\"material-symbols-rounded\">arrow_forward<\/span><\/button>\r\n    <\/div>\r\n  <\/div>\r\n<\/div>\r\n\r\n<script>\r\n  (function() {\r\n    \/\/ 1. SELECCI\u00d3N DE ELEMENTOS DEL DOM (Definidos al inicio para evitar ReferenceError)\r\n    const slides = document.querySelectorAll('.slide-card');\r\n    const progressFill = document.getElementById('progressFill');\r\n    const prevBtn = document.getElementById('prevBtn');\r\n    const nextBtn = document.getElementById('nextBtn');\r\n    const pauseBtn = document.getElementById('pauseBtn');\r\n    const pauseIcon = document.getElementById('pauseIcon');\r\n\r\n    let isCarouselPaused = false;\r\n    let currentIndex = 0;\r\n    const slideDuration = 18000;\r\n    let elapsedTime = 0;\r\n    let timerInterval = null;\r\n\r\n    function setPauseState(paused) {\r\n      isCarouselPaused = paused;\r\n      if (pauseIcon) {\r\n        pauseIcon.textContent = isCarouselPaused ? 'play_arrow' : 'pause';\r\n      }\r\n    }\r\n\r\n    \/\/ ENLACES EXTERNOS PANEL C\u00d3DIGO EDIFICACI\u00d3N\r\n    const pillLinks = document.querySelectorAll('.expressive-pill-link');\r\n    pillLinks.forEach(link => {\r\n      link.addEventListener('click', function() {\r\n        setPauseState(true);\r\n      });\r\n    });\r\n\r\n    function resetPanel03() { \r\n      pillLinks.forEach(link => link.classList.remove('expanding-target', 'contracting')); \r\n    }\r\n\r\n    window.addEventListener('focus', () => { \r\n      resetPanel03(); \r\n      setPauseState(false); \r\n    });\r\n\r\n    function resetSlideAnimations(index) {\r\n      if (index === 2) resetPanel03();\r\n      if (index === 3) restartIllustratorDemo();\r\n      if (index === 4) restartAgilDemo();\r\n      if (index === 5) restartCalcDemo();\r\n    }\r\n\r\n    \/\/ ANIMACIONES INTERNAS TR\u00c1MITE \u00c1GIL\r\n    const simulatedNewTramiteBtn = document.getElementById('simulatedNewTramiteBtn');\r\n    const simulatedFinalPill = document.getElementById('simulatedFinalPill');\r\n    let agilTimeouts = [];\r\n\r\n    function restartAgilDemo() {\r\n      agilTimeouts.forEach(t => clearTimeout(t));\r\n      agilTimeouts = [];\r\n\r\n      if (!simulatedNewTramiteBtn || !simulatedFinalPill) return;\r\n\r\n      simulatedNewTramiteBtn.style.opacity = '0';\r\n      simulatedNewTramiteBtn.style.transform = 'translateY(15px) scale(0.95)';\r\n      simulatedNewTramiteBtn.style.background = 'var(--gop-blue)';\r\n\r\n      simulatedFinalPill.style.opacity = '0';\r\n      simulatedFinalPill.style.transform = 'translateY(15px) scale(0.95)';\r\n\r\n      agilTimeouts.push(setTimeout(() => {\r\n        simulatedNewTramiteBtn.style.opacity = '1';\r\n        simulatedNewTramiteBtn.style.transform = 'translateY(0) scale(1)';\r\n      }, 600));\r\n\r\n      agilTimeouts.push(setTimeout(() => {\r\n        simulatedNewTramiteBtn.style.background = 'var(--green-light)';\r\n        simulatedNewTramiteBtn.style.transform = 'scale(1.03)';\r\n      }, 1600));\r\n\r\n      agilTimeouts.push(setTimeout(() => {\r\n        simulatedNewTramiteBtn.style.background = 'var(--gop-blue)';\r\n        simulatedNewTramiteBtn.style.transform = 'scale(1)';\r\n        simulatedFinalPill.style.opacity = '1';\r\n        simulatedFinalPill.style.transform = 'translateY(0) scale(1)';\r\n      }, 2100));\r\n    }\r\n\r\n    \/\/ ANIMACIONES INTERNAS CALCULADORA\r\n    const calcSimUtilBtn = document.getElementById('calcSimUtilBtn');\r\n    const calcSimCard = document.getElementById('calcSimCard');\r\n    let calcInterval = null;\r\n\r\n    function restartCalcDemo() {\r\n      if (calcInterval) clearInterval(calcInterval);\r\n\r\n      if (!calcSimUtilBtn || !calcSimCard) return;\r\n\r\n      function runCalcLoop() {\r\n        calcSimUtilBtn.style.opacity = '0';\r\n        calcSimUtilBtn.style.transform = 'translateY(15px) scale(0.95)';\r\n        calcSimUtilBtn.style.background = 'var(--gop-blue)';\r\n\r\n        calcSimCard.style.opacity = '0';\r\n        calcSimCard.style.transform = 'translateY(15px) scale(0.95)';\r\n\r\n        setTimeout(() => {\r\n          calcSimUtilBtn.style.opacity = '1';\r\n          calcSimUtilBtn.style.transform = 'translateY(0) scale(1)';\r\n        }, 600);\r\n\r\n        setTimeout(() => {\r\n          calcSimUtilBtn.style.background = 'var(--green-light)';\r\n          calcSimUtilBtn.style.transform = 'scale(1.03)';\r\n        }, 1600);\r\n\r\n        setTimeout(() => {\r\n          calcSimUtilBtn.style.background = 'var(--gop-blue)';\r\n          calcSimUtilBtn.style.transform = 'scale(1)';\r\n          calcSimCard.style.opacity = '1';\r\n          calcSimCard.style.transform = 'translateY(0) scale(1)';\r\n        }, 2200);\r\n      }\r\n\r\n      runCalcLoop();\r\n      calcInterval = setInterval(runCalcLoop, 7000);\r\n    }\r\n\r\n    \/\/ ANIMACIONES NOVEDADES SISTEMA GOP\r\n    const simInicioBtn = document.getElementById('simInicioBtn');\r\n    const simMisTramitesBtn = document.getElementById('simMisTramitesBtn');\r\n    const simLegVigenteBtn = document.getElementById('simLegVigenteBtn');\r\n    const simGuiaBtn = document.getElementById('simGuiaBtn');\r\n    const simNuevoTramiteBtn = document.getElementById('simNuevoTramiteBtn');\r\n    const simUtilidadesBtn = document.getElementById('simUtilidadesBtn');\r\n\r\n    const simConnectorLine = document.getElementById('simConnectorLine');\r\n    const simConnectorLine2 = document.getElementById('simConnectorLine2');\r\n    const simConnectorLine3 = document.getElementById('simConnectorLine3');\r\n\r\n    const simRightPanel = document.getElementById('simRightPanel');\r\n    const simMenuWrapper = document.getElementById('simMenuWrapper');\r\n    const panel04 = document.getElementById('panel_04');\r\n    \r\n    const viewMainGuide = document.getElementById('viewMainGuide');\r\n    const viewNewTramite = document.getElementById('viewNewTramite');\r\n    const viewUtilidades = document.getElementById('viewUtilidades');\r\n    const viewStagesDetail = document.getElementById('viewStagesDetail');\r\n    \r\n    const newTramiteGrid = document.getElementById('newTramiteGrid');\r\n    const targetTramiteAgil = document.getElementById('targetTramiteAgil');\r\n\r\n    const utilidadesGrid = document.getElementById('utilidadesGrid');\r\n    const targetCalculadora = document.getElementById('targetCalculadora');\r\n    \r\n    const backToMenuBtn = document.getElementById('backToMenuBtn');\r\n    const stageHeaderTitle = document.getElementById('stageHeaderTitle');\r\n    const tramitePills = document.querySelectorAll('.gop-tramite-pill[data-tramite]');\r\n\r\n    let demoTimeouts = [];\r\n    let autoScrollInterval = null;\r\n\r\n    function clearPillStates() {\r\n      if (simGuiaBtn) simGuiaBtn.classList.remove('clicked-sim');\r\n      if (simNuevoTramiteBtn) simNuevoTramiteBtn.classList.remove('clicked-sim');\r\n      if (simUtilidadesBtn) simUtilidadesBtn.classList.remove('clicked-sim');\r\n\r\n      if (simConnectorLine) simConnectorLine.classList.remove('show-line');\r\n      if (simConnectorLine2) simConnectorLine2.classList.remove('show-line');\r\n      if (simConnectorLine3) simConnectorLine3.classList.remove('show-line');\r\n\r\n      if (simMenuWrapper) simMenuWrapper.classList.remove('simulating-back');\r\n\r\n      if (newTramiteGrid) newTramiteGrid.classList.remove('is-highlighting');\r\n      if (targetTramiteAgil) targetTramiteAgil.classList.remove('highlight-new-tramite');\r\n\r\n      if (utilidadesGrid) utilidadesGrid.classList.remove('is-highlighting');\r\n      if (targetCalculadora) targetCalculadora.classList.remove('highlight-new-utilidad');\r\n    }\r\n\r\n    function restartIllustratorDemo() {\r\n      demoTimeouts.forEach(t => clearTimeout(t));\r\n      demoTimeouts = [];\r\n      if (autoScrollInterval) clearInterval(autoScrollInterval);\r\n\r\n      clearPillStates();\r\n      if (simRightPanel) simRightPanel.classList.remove('panel-visible');\r\n      \r\n      if (viewMainGuide) viewMainGuide.style.display = 'block';\r\n      if (viewNewTramite) viewNewTramite.style.display = 'none';\r\n      if (viewUtilidades) viewUtilidades.style.display = 'none';\r\n      if (viewStagesDetail) viewStagesDetail.classList.remove('active-stages');\r\n      \r\n      if (simRightPanel) simRightPanel.scrollTop = 0;\r\n\r\n      demoTimeouts.push(setTimeout(() => {\r\n        if (isCarouselPaused) return;\r\n        if (simGuiaBtn) simGuiaBtn.classList.add('clicked-sim');\r\n        if (simMenuWrapper) simMenuWrapper.classList.add('simulating-back');\r\n        if (simConnectorLine) simConnectorLine.classList.add('show-line');\r\n      }, 1200));\r\n\r\n      demoTimeouts.push(setTimeout(() => {\r\n        if (isCarouselPaused) return;\r\n        if (simRightPanel) simRightPanel.classList.add('panel-visible');\r\n        startAutoScroll(50, 0.9);\r\n      }, 1700));\r\n\r\n      demoTimeouts.push(setTimeout(() => {\r\n        if (isCarouselPaused) return;\r\n        if (simRightPanel) simRightPanel.classList.remove('panel-visible');\r\n        clearPillStates();\r\n        if (autoScrollInterval) clearInterval(autoScrollInterval);\r\n      }, 6200));\r\n\r\n      demoTimeouts.push(setTimeout(() => {\r\n        if (isCarouselPaused) return;\r\n        if (viewMainGuide) viewMainGuide.style.display = 'none';\r\n        if (viewUtilidades) viewUtilidades.style.display = 'none';\r\n        if (viewNewTramite) viewNewTramite.style.display = 'block';\r\n        if (simRightPanel) simRightPanel.scrollTop = 0;\r\n        \r\n        if (simNuevoTramiteBtn) simNuevoTramiteBtn.classList.add('clicked-sim');\r\n        if (simConnectorLine2) simConnectorLine2.classList.add('show-line');\r\n        if (simMenuWrapper) simMenuWrapper.classList.add('simulating-back');\r\n      }, 7500));\r\n\r\n      demoTimeouts.push(setTimeout(() => {\r\n        if (isCarouselPaused) return;\r\n        if (simRightPanel) simRightPanel.classList.add('panel-visible');\r\n      }, 8200));\r\n\r\n      demoTimeouts.push(setTimeout(() => {\r\n        if (isCarouselPaused) return;\r\n        if (targetTramiteAgil) targetTramiteAgil.scrollIntoView({ behavior: 'smooth', block: 'center' });\r\n        if (newTramiteGrid) newTramiteGrid.classList.add('is-highlighting');\r\n        if (targetTramiteAgil) targetTramiteAgil.classList.add('highlight-new-tramite');\r\n      }, 8800));\r\n\r\n      demoTimeouts.push(setTimeout(() => {\r\n        if (isCarouselPaused) return;\r\n        if (simRightPanel) simRightPanel.classList.remove('panel-visible');\r\n        clearPillStates();\r\n      }, 11500));\r\n\r\n      demoTimeouts.push(setTimeout(() => {\r\n        if (isCarouselPaused) return;\r\n        if (viewNewTramite) viewNewTramite.style.display = 'none';\r\n        if (viewMainGuide) viewMainGuide.style.display = 'none';\r\n        if (viewUtilidades) viewUtilidades.style.display = 'block';\r\n        if (simRightPanel) simRightPanel.scrollTop = 0;\r\n\r\n        if (simUtilidadesBtn) simUtilidadesBtn.classList.add('clicked-sim');\r\n        if (simConnectorLine3) simConnectorLine3.classList.add('show-line');\r\n        if (simMenuWrapper) simMenuWrapper.classList.add('simulating-back');\r\n      }, 12800));\r\n\r\n      demoTimeouts.push(setTimeout(() => {\r\n        if (isCarouselPaused) return;\r\n        if (simRightPanel) simRightPanel.classList.add('panel-visible');\r\n      }, 13400));\r\n\r\n      demoTimeouts.push(setTimeout(() => {\r\n        if (isCarouselPaused) return;\r\n        if (targetCalculadora) targetCalculadora.scrollIntoView({ behavior: 'smooth', block: 'center' });\r\n        if (utilidadesGrid) utilidadesGrid.classList.add('is-highlighting');\r\n        if (targetCalculadora) targetCalculadora.classList.add('highlight-new-utilidad');\r\n      }, 14000));\r\n    }\r\n\r\n    function startAutoScroll(intervalMs = 50, step = 1.0) {\r\n      if (autoScrollInterval) clearInterval(autoScrollInterval);\r\n      autoScrollInterval = setInterval(() => {\r\n        if (!isCarouselPaused && simRightPanel && simRightPanel.classList.contains('panel-visible')) {\r\n          simRightPanel.scrollTop += step;\r\n          if (simRightPanel.scrollTop + simRightPanel.clientHeight >= simRightPanel.scrollHeight - 2) {\r\n            clearInterval(autoScrollInterval);\r\n          }\r\n        }\r\n      }, intervalMs);\r\n    }\r\n\r\n    function handleInteractionPause() {\r\n      if (!isCarouselPaused) {\r\n        demoTimeouts.forEach(t => clearTimeout(t));\r\n        if (autoScrollInterval) clearInterval(autoScrollInterval);\r\n        setPauseState(true);\r\n      }\r\n    }\r\n\r\n    if (panel04) {\r\n      panel04.addEventListener('mousedown', handleInteractionPause);\r\n      panel04.addEventListener('wheel', handleInteractionPause);\r\n      panel04.addEventListener('touchstart', handleInteractionPause);\r\n    }\r\n\r\n    if (simGuiaBtn) {\r\n      simGuiaBtn.addEventListener('click', () => {\r\n        handleInteractionPause();\r\n        clearPillStates();\r\n        simGuiaBtn.classList.add('clicked-sim');\r\n        simConnectorLine.classList.add('show-line');\r\n        simMenuWrapper.classList.add('simulating-back');\r\n        \r\n        viewNewTramite.style.display = 'none';\r\n        viewUtilidades.style.display = 'none';\r\n        viewStagesDetail.classList.remove('active-stages');\r\n        viewMainGuide.style.display = 'block';\r\n        simRightPanel.classList.add('panel-visible');\r\n        simRightPanel.scrollTop = 0;\r\n      });\r\n    }\r\n\r\n    if (simNuevoTramiteBtn) {\r\n      simNuevoTramiteBtn.addEventListener('click', () => {\r\n        handleInteractionPause();\r\n        clearPillStates();\r\n        simNuevoTramiteBtn.classList.add('clicked-sim');\r\n        simConnectorLine2.classList.add('show-line');\r\n        simMenuWrapper.classList.add('simulating-back');\r\n        \r\n        viewMainGuide.style.display = 'none';\r\n        viewUtilidades.style.display = 'none';\r\n        viewStagesDetail.classList.remove('active-stages');\r\n        viewNewTramite.style.display = 'block';\r\n        simRightPanel.classList.add('panel-visible');\r\n        simRightPanel.scrollTop = 0;\r\n      });\r\n    }\r\n\r\n    if (simUtilidadesBtn) {\r\n      simUtilidadesBtn.addEventListener('click', () => {\r\n        handleInteractionPause();\r\n        clearPillStates();\r\n        simUtilidadesBtn.classList.add('clicked-sim');\r\n        simConnectorLine3.classList.add('show-line');\r\n        simMenuWrapper.classList.add('simulating-back');\r\n\r\n        viewMainGuide.style.display = 'none';\r\n        viewNewTramite.style.display = 'none';\r\n        viewStagesDetail.classList.remove('active-stages');\r\n        viewUtilidades.style.display = 'block';\r\n        simRightPanel.classList.add('panel-visible');\r\n        simRightPanel.scrollTop = 0;\r\n      });\r\n    }\r\n\r\n    tramitePills.forEach(pill => {\r\n      pill.addEventListener('click', (e) => {\r\n        e.stopPropagation();\r\n        handleInteractionPause();\r\n        const tramiteName = pill.getAttribute('data-tramite');\r\n        if (stageHeaderTitle) stageHeaderTitle.textContent = `Tr\u00e1mite: ${tramiteName}`;\r\n        if (viewMainGuide) viewMainGuide.style.display = 'none';\r\n        if (viewNewTramite) viewNewTramite.style.display = 'none';\r\n        if (viewUtilidades) viewUtilidades.style.display = 'none';\r\n        if (viewStagesDetail) viewStagesDetail.classList.add('active-stages');\r\n        if (simRightPanel) simRightPanel.scrollTop = 0;\r\n      });\r\n    });\r\n\r\n    if (backToMenuBtn) {\r\n      backToMenuBtn.addEventListener('click', (e) => {\r\n        e.stopPropagation();\r\n        if (viewStagesDetail) viewStagesDetail.classList.remove('active-stages');\r\n        if (viewMainGuide) viewMainGuide.style.display = 'block';\r\n        if (simRightPanel) simRightPanel.scrollTop = 0;\r\n      });\r\n    }\r\n\r\n    \/\/ MOTOR PRINCIPAL DE NAVEGACI\u00d3N\r\n    function goToSlide(index) {\r\n      slides[currentIndex].classList.remove('active');\r\n      currentIndex = (index + slides.length) % slides.length;\r\n      slides[currentIndex].classList.add('active');\r\n      resetSlideAnimations(currentIndex);\r\n      elapsedTime = 0;\r\n      if (progressFill) progressFill.style.width = '0%';\r\n    }\r\n\r\n    function startAutoPlay() {\r\n      if (timerInterval) clearInterval(timerInterval);\r\n      const intervalStep = 50;\r\n\r\n      timerInterval = setInterval(() => {\r\n        if (!isCarouselPaused) {\r\n          elapsedTime += intervalStep;\r\n          const progressPercentage = (elapsedTime \/ slideDuration) * 100;\r\n          if (progressFill) progressFill.style.width = `${progressPercentage}%`;\r\n\r\n          if (elapsedTime >= slideDuration) {\r\n            goToSlide(currentIndex + 1);\r\n          }\r\n        }\r\n      }, intervalStep);\r\n    }\r\n\r\n    \/\/ EVENTOS DE LOS BOTONES DE NAVEGACI\u00d3N (Resuelven la interrupci\u00f3n del carrusel)\r\n    if (nextBtn) {\r\n      nextBtn.addEventListener('click', () => { \r\n        setPauseState(false);\r\n        goToSlide(currentIndex + 1); \r\n      });\r\n    }\r\n\r\n    if (prevBtn) {\r\n      prevBtn.addEventListener('click', () => { \r\n        setPauseState(false);\r\n        goToSlide(currentIndex - 1); \r\n      });\r\n    }\r\n    \r\n    if (pauseBtn) {\r\n      pauseBtn.addEventListener('click', () => { \r\n        setPauseState(!isCarouselPaused); \r\n      });\r\n    }\r\n\r\n    \/\/ INICIALIZACI\u00d3N\r\n    startAutoPlay();\r\n    restartIllustratorDemo();\r\n    restartAgilDemo();\r\n    restartCalcDemo();\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>calendar_month Mi\u00e9rcoles 23 de septiembre schedule 19:00 hs. location_on SUM &#8211; 5.\u00b0 piso | Municipalidad de Posadas Particip\u00e1 arrow_forward Segundo PlenarioPosadas 2035 Priorizar las acciones paratransformar la ciudad Material deconsulta folder Nuevo C\u00f3digo deEdificaci\u00f3n D\u00f3nde encontrarlo: 1 GOP (Secci\u00f3n: Legislaci\u00f3n Vigente) open_in_new 2 P\u00e1gina oficial Municipalidad de Posadas open_in_new 3 Digesto Jur\u00eddico (HCD) open_in_new Novedadesdel [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":7980,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"open","template":"page-full-width.php","meta":{"footnotes":""},"class_list":["post-3958","page","type-page","status-publish","has-post-thumbnail","hentry"],"_links":{"self":[{"href":"https:\/\/posadas.gov.ar\/planurbano\/wp-json\/wp\/v2\/pages\/3958"}],"collection":[{"href":"https:\/\/posadas.gov.ar\/planurbano\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/posadas.gov.ar\/planurbano\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/posadas.gov.ar\/planurbano\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/posadas.gov.ar\/planurbano\/wp-json\/wp\/v2\/comments?post=3958"}],"version-history":[{"count":148,"href":"https:\/\/posadas.gov.ar\/planurbano\/wp-json\/wp\/v2\/pages\/3958\/revisions"}],"predecessor-version":[{"id":8605,"href":"https:\/\/posadas.gov.ar\/planurbano\/wp-json\/wp\/v2\/pages\/3958\/revisions\/8605"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/posadas.gov.ar\/planurbano\/wp-json\/wp\/v2\/media\/7980"}],"wp:attachment":[{"href":"https:\/\/posadas.gov.ar\/planurbano\/wp-json\/wp\/v2\/media?parent=3958"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}