{"id":1058,"date":"2022-03-27T21:05:23","date_gmt":"2022-03-27T21:05:23","guid":{"rendered":"http:\/\/localhost:8888\/sanalejosite\/?page_id=1058"},"modified":"2026-07-03T14:00:17","modified_gmt":"2026-07-03T20:00:17","slug":"ahorros","status":"publish","type":"page","link":"https:\/\/ccsanalejo.com\/?page_id=1058","title":{"rendered":"Ahorros"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"1058\" class=\"elementor elementor-1058\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-d00387a elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"d00387a\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-55aedab\" data-id=\"55aedab\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap\">\n\t\t\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<section class=\"elementor-section elementor-top-section elementor-element elementor-element-e571483 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"e571483\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-3dd1376\" data-id=\"3dd1376\" data-element_type=\"column\" data-e-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-7b5bc74 elementor-widget elementor-widget-html\" data-id=\"7b5bc74\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div style=\"width: 100%; margin: 0; padding: 0; line-height: 0; border-radius: 18px; overflow: hidden; box-shadow: 0 1px 3px rgba(0,0,0,0.04), 0 8px 24px rgba(0,0,0,0.05); border: 1px solid rgba(0,0,0,0.06);\">\r\n    <iframe \r\n        src=\"https:\/\/script.google.com\/macros\/s\/AKfycbwTpp5M27pOIOEb29RVTT8jhlqmkxoAgq9AE6IH8X4bxuAWt5LQh1PzokotWTh2FHA\/exec\"\r\n        width=\"100%\"\r\n        height=\"440\"\r\n        frameborder=\"0\"\r\n        style=\"display: block; border: none; margin: 0; padding: 0;\"\r\n        title=\"Formulario de Solicitud\">\r\n    <\/iframe>\r\n<\/div>\t\t\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<section class=\"elementor-section elementor-top-section elementor-element elementor-element-bcf87e0 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"bcf87e0\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-bef00f6\" data-id=\"bef00f6\" data-element_type=\"column\" data-e-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-a3cbb04 elementor-widget elementor-widget-html\" data-id=\"a3cbb04\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"es\">\r\n<head>\r\n    <meta charset=\"UTF-8\">\r\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n    <title>Crece Mujer | Ahorro<\/title>\r\n    \r\n    <style>\r\n        #crece-mujer,\r\n        #crece-mujer *,\r\n        #crece-mujer *::before,\r\n        #crece-mujer *::after {\r\n            box-sizing: border-box;\r\n            margin: 0;\r\n            padding: 0;\r\n        }\r\n\r\n        #crece-mujer {\r\n            --surface: #ffffff;\r\n            --text-primary: #1a1a1a;\r\n            --text-secondary: #5f6b7a;\r\n            --text-muted: #8a94a3;\r\n            --border: rgba(0, 0, 0, 0.06);\r\n            --border-light: rgba(0, 0, 0, 0.04);\r\n            --accent: #0b734d;\r\n            --accent-soft: rgba(11, 115, 77, 0.04);\r\n            \r\n            --shadow-card: \r\n                0 1px 3px rgba(0,0,0,0.03),\r\n                0 8px 24px rgba(0,0,0,0.04);\r\n            --shadow-hover: \r\n                0 4px 8px rgba(0,0,0,0.05),\r\n                0 16px 32px rgba(11, 115, 77, 0.06);\r\n            --shadow-pressed: \r\n                0 1px 2px rgba(0,0,0,0.04),\r\n                0 2px 4px rgba(0,0,0,0.04);\r\n            \r\n            --radius-sm: 10px;\r\n            --radius-md: 16px;\r\n            --radius-lg: 20px;\r\n            \r\n            --transition-smooth: 0.25s cubic-bezier(0.2, 0.0, 0, 1.0);\r\n            \r\n            font-family: 'Inter', system-ui, -apple-system, sans-serif;\r\n            line-height: 1.5;\r\n            -webkit-font-smoothing: antialiased;\r\n            -moz-osx-font-smoothing: grayscale;\r\n            \r\n            background: #ffffff;\r\n            color: var(--text-primary);\r\n            width: 100%;\r\n            max-width: 100%;\r\n            padding: 0;\r\n            margin: 0;\r\n        }\r\n\r\n        #crece-mujer .container {\r\n            max-width: 100%;\r\n            width: 100%;\r\n            margin: 0;\r\n            padding: 0;\r\n        }\r\n\r\n        #crece-mujer .hero {\r\n            text-align: left;\r\n            margin-bottom: 24px;\r\n            padding: 0 4px;\r\n            background: transparent;\r\n            border: none;\r\n            box-shadow: none;\r\n        }\r\n\r\n        #crece-mujer .hero-label {\r\n            font-size: 0.65rem;\r\n            font-weight: 600;\r\n            text-transform: uppercase;\r\n            letter-spacing: 2px;\r\n            color: var(--accent);\r\n            margin-bottom: 8px;\r\n            display: block;\r\n        }\r\n\r\n        #crece-mujer .hero h1 {\r\n            font-size: 1.8rem;\r\n            font-weight: 400;\r\n            letter-spacing: -1px;\r\n            color: var(--text-primary);\r\n            line-height: 1.1;\r\n        }\r\n\r\n        #crece-mujer .hero h1 strong {\r\n            font-weight: 600;\r\n            color: var(--accent);\r\n        }\r\n\r\n        #crece-mujer .hero p {\r\n            font-size: 0.9rem;\r\n            color: var(--text-secondary);\r\n            font-weight: 400;\r\n            line-height: 1.5;\r\n            margin-top: 6px;\r\n        }\r\n\r\n        #crece-mujer .hero-divider {\r\n            width: 40px;\r\n            height: 3px;\r\n            background-color: var(--accent);\r\n            margin-top: 14px;\r\n            border-radius: 2px;\r\n            opacity: 0.6;\r\n        }\r\n\r\n        \/* ===== LAYOUT DOBLE COLUMNA ===== *\/\r\n        #crece-mujer .split-layout {\r\n            display: grid;\r\n            grid-template-columns: 1fr 1fr;\r\n            gap: 20px;\r\n            align-items: start;\r\n        }\r\n\r\n        \/* Columna izquierda: Imagen 4:3 *\/\r\n        #crece-mujer .image-panel {\r\n            position: sticky;\r\n            top: 20px;\r\n        }\r\n\r\n        #crece-mujer .image-container {\r\n            background: var(--surface);\r\n            border-radius: var(--radius-lg);\r\n            overflow: hidden;\r\n            box-shadow: var(--shadow-card);\r\n            border: 1px solid var(--border);\r\n            aspect-ratio: 4 \/ 3;\r\n            display: flex;\r\n            align-items: center;\r\n            justify-content: center;\r\n            background: #fafbfa;\r\n        }\r\n\r\n        #crece-mujer .image-container img {\r\n            width: 100%;\r\n            height: 100%;\r\n            object-fit: contain;\r\n            display: block;\r\n            padding: 12px;\r\n        }\r\n\r\n        \/* ===== TARJETA DIN\u00c1MICA CON EFECTO T\u00c1CTIL ===== *\/\r\n        #crece-mujer .card {\r\n            background: var(--surface);\r\n            border-radius: var(--radius-lg);\r\n            display: flex;\r\n            flex-direction: column;\r\n            box-shadow: var(--shadow-card);\r\n            border: 1px solid var(--border);\r\n            transition: all var(--transition-smooth);\r\n            transform: translateY(0);\r\n            position: relative;\r\n            overflow: hidden;\r\n            outline: none;\r\n            cursor: pointer;\r\n            -webkit-tap-highlight-color: transparent;\r\n        }\r\n\r\n        #crece-mujer .card:focus,\r\n        #crece-mujer .card:focus-visible,\r\n        #crece-mujer .card:active,\r\n        #crece-mujer .card:focus-within {\r\n            outline: none;\r\n            box-shadow: var(--shadow-pressed);\r\n            background-color: #fafbfa;\r\n        }\r\n\r\n        \/* L\u00ednea verde superior animada *\/\r\n        #crece-mujer .card::before {\r\n            content: '';\r\n            position: absolute;\r\n            top: 0;\r\n            left: 0;\r\n            right: 0;\r\n            height: 3px;\r\n            background: var(--accent);\r\n            transform: scaleX(0);\r\n            transform-origin: left;\r\n            transition: transform 0.4s cubic-bezier(0.2, 0.0, 0, 1.0);\r\n            border-radius: 0 0 2px 0;\r\n            z-index: 2;\r\n        }\r\n\r\n        #crece-mujer .card:hover::before {\r\n            transform: scaleX(1);\r\n        }\r\n\r\n        \/* Elevaci\u00f3n al hover *\/\r\n        #crece-mujer .card:hover {\r\n            transform: translateY(-4px);\r\n            box-shadow: var(--shadow-hover);\r\n            border-color: transparent;\r\n            z-index: 2;\r\n        }\r\n\r\n        \/* Presi\u00f3n al click *\/\r\n        #crece-mujer .card:active {\r\n            transform: translateY(0px) scale(0.995);\r\n            box-shadow: var(--shadow-pressed);\r\n            background-color: #fafbfa;\r\n            transition: all 0.05s ease;\r\n        }\r\n\r\n        @media (max-width: 768px) {\r\n            #crece-mujer .card:hover {\r\n                transform: none;\r\n                box-shadow: var(--shadow-card);\r\n            }\r\n            #crece-mujer .card::before {\r\n                transform: scaleX(0);\r\n            }\r\n            #crece-mujer .card:active {\r\n                transform: scale(0.985);\r\n                background-color: #f5f5f5;\r\n            }\r\n        }\r\n\r\n        #crece-mujer .card-body {\r\n            padding: 28px 28px;\r\n            display: flex;\r\n            flex-direction: column;\r\n        }\r\n\r\n        #crece-mujer .card-header {\r\n            display: flex;\r\n            align-items: flex-start;\r\n            justify-content: space-between;\r\n            margin-bottom: 8px;\r\n            gap: 10px;\r\n        }\r\n\r\n        #crece-mujer .card-title-group {\r\n            display: flex;\r\n            flex-direction: column;\r\n        }\r\n\r\n        #crece-mujer .card-badge {\r\n            font-size: 0.65rem;\r\n            font-weight: 600;\r\n            text-transform: uppercase;\r\n            letter-spacing: 1.5px;\r\n            color: var(--accent);\r\n            opacity: 0.7;\r\n            margin-bottom: 4px;\r\n            transition: opacity 0.3s ease;\r\n        }\r\n\r\n        #crece-mujer .card:hover .card-badge {\r\n            opacity: 1;\r\n        }\r\n\r\n        #crece-mujer .card-title {\r\n            font-size: 1.4rem;\r\n            font-weight: 600;\r\n            color: var(--text-primary);\r\n            letter-spacing: -0.3px;\r\n            line-height: 1.2;\r\n        }\r\n\r\n        #crece-mujer .card-number {\r\n            font-size: 0.65rem;\r\n            font-weight: 600;\r\n            color: var(--accent);\r\n            opacity: 0.4;\r\n            letter-spacing: 1px;\r\n            font-feature-settings: \"tnum\";\r\n            transition: opacity 0.3s ease;\r\n        }\r\n\r\n        #crece-mujer .card:hover .card-number {\r\n            opacity: 0.8;\r\n        }\r\n\r\n        #crece-mujer .card-subtitle {\r\n            font-size: 0.85rem;\r\n            color: var(--text-secondary);\r\n            margin-bottom: 20px;\r\n            line-height: 1.5;\r\n            font-weight: 400;\r\n            transition: color 0.3s ease;\r\n        }\r\n\r\n        #crece-mujer .card:hover .card-subtitle {\r\n            color: #4a5a50;\r\n        }\r\n\r\n        \/* Grid de caracter\u00edsticas con efecto hover *\/\r\n        #crece-mujer .features-grid {\r\n            display: grid;\r\n            grid-template-columns: 1fr 1fr;\r\n            gap: 1px;\r\n            border: 1px solid var(--border-light);\r\n            border-radius: var(--radius-md);\r\n            overflow: hidden;\r\n            transition: border-color 0.3s ease;\r\n        }\r\n\r\n        #crece-mujer .card:hover .features-grid {\r\n            border-color: rgba(11, 115, 77, 0.15);\r\n        }\r\n\r\n        #crece-mujer .feature-item {\r\n            font-size: 0.82rem;\r\n            color: var(--text-secondary);\r\n            font-weight: 450;\r\n            line-height: 1.5;\r\n            padding: 14px 16px;\r\n            background: #fafbfa;\r\n            transition: color 0.2s ease, transform 0.2s ease;\r\n        }\r\n\r\n        #crece-mujer .card:hover .feature-item {\r\n            color: #3a4a40;\r\n            transform: translateX(2px);\r\n        }\r\n\r\n        \/* Indicador sutil en cada feature al hover *\/\r\n        #crece-mujer .feature-item {\r\n            position: relative;\r\n            padding-left: 22px;\r\n        }\r\n\r\n        #crece-mujer .feature-item::before {\r\n            content: '';\r\n            position: absolute;\r\n            left: 10px;\r\n            top: 19px;\r\n            width: 4px;\r\n            height: 4px;\r\n            border-radius: 50%;\r\n            background: var(--accent);\r\n            opacity: 0;\r\n            transition: opacity 0.3s ease, transform 0.3s ease;\r\n            transform: scale(0);\r\n        }\r\n\r\n        #crece-mujer .card:hover .feature-item::before {\r\n            opacity: 0.5;\r\n            transform: scale(1);\r\n        }\r\n\r\n        @media (max-width: 768px) {\r\n            #crece-mujer .split-layout {\r\n                grid-template-columns: 1fr;\r\n                gap: 16px;\r\n            }\r\n\r\n            #crece-mujer .image-panel {\r\n                position: static;\r\n            }\r\n\r\n            #crece-mujer .image-container {\r\n                aspect-ratio: 4 \/ 3;\r\n                max-height: 300px;\r\n            }\r\n\r\n            #crece-mujer .hero h1 {\r\n                font-size: 1.5rem;\r\n            }\r\n\r\n            #crece-mujer .card-body {\r\n                padding: 22px 18px;\r\n            }\r\n\r\n            #crece-mujer .card-title {\r\n                font-size: 1.2rem;\r\n            }\r\n\r\n            #crece-mujer .features-grid {\r\n                grid-template-columns: 1fr;\r\n            }\r\n\r\n            #crece-mujer .feature-item {\r\n                padding-left: 18px;\r\n            }\r\n        }\r\n    <\/style>\r\n<\/head>\r\n<body>\r\n\r\n    <div id=\"crece-mujer\">\r\n\r\n        <main class=\"container\">\r\n\r\n            <header class=\"hero\">\r\n                <span class=\"hero-label\">Cuenta Especializada<\/span>\r\n                <h1><strong>Crece Mujer<\/strong><\/h1>\r\n                <p>Impulsando tus finanzas con beneficios dise\u00f1ados exclusivamente para la mujer.<\/p>\r\n                <div class=\"hero-divider\"><\/div>\r\n            <\/header>\r\n\r\n            <div class=\"split-layout\">\r\n\r\n                <!-- COLUMNA IZQUIERDA: IMAGEN 4:3 -->\r\n                <aside class=\"image-panel\">\r\n                    <div class=\"image-container\">\r\n                        <img decoding=\"async\" src=\"https:\/\/ccsanalejo.com\/wp-content\/uploads\/2026\/06\/Gemini_Generated_Image_x0y8ilx0y8ilx0y8.png\" alt=\"Crece Mujer\">\r\n                    <\/div>\r\n                <\/aside>\r\n\r\n                <!-- COLUMNA DERECHA: TARJETA DIN\u00c1MICA -->\r\n                <div class=\"card\">\r\n                    <div class=\"card-body\">\r\n                        <div class=\"card-header\">\r\n                            <div class=\"card-title-group\">\r\n                                <span class=\"card-badge\">Ahorro<\/span>\r\n                                <div class=\"card-title\">Crece Mujer<\/div>\r\n                            <\/div>\r\n                            <span class=\"card-number\">01<\/span>\r\n                        <\/div>\r\n\r\n                        <p class=\"card-subtitle\">Beneficios dise\u00f1ados exclusivamente para la mujer, con disponibilidad inmediata y respaldo institucional.<\/p>\r\n\r\n                        <div class=\"features-grid\">\r\n                            <div class=\"feature-item\">Dirigida exclusivamente para la mujer<\/div>\r\n                            <div class=\"feature-item\">Disponibilidad inmediata de fondos<\/div>\r\n                            <div class=\"feature-item\">Generaci\u00f3n y pago de intereses<\/div>\r\n                            <div class=\"feature-item\">Libreta de ahorros para control<\/div>\r\n                            <div class=\"feature-item\">Acceso a Fedebanking y Fedemovil<\/div>\r\n                            <div class=\"feature-item\">M\u00e1s de 600 puntos de atenci\u00f3n<\/div>\r\n                            <div class=\"feature-item\" style=\"grid-column: 1 \/ -1;\">Beneficios m\u00e9dicos gratuitos con Salud a Tu Alcance<\/div>\r\n                        <\/div>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n            <\/div>\r\n\r\n        <\/main>\r\n\r\n    <\/div>\r\n\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-6802886 elementor-widget elementor-widget-spacer\" data-id=\"6802886\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"spacer.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\t\t\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<section class=\"elementor-section elementor-top-section elementor-element elementor-element-49a1f19 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"49a1f19\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-7d9d019\" data-id=\"7d9d019\" data-element_type=\"column\" data-e-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-ec23b2f elementor-widget elementor-widget-html\" data-id=\"ec23b2f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"es\">\r\n<head>\r\n    <meta charset=\"UTF-8\">\r\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n    <title>Plazo Fijo | Ahorro<\/title>\r\n    \r\n    <style>\r\n        #plazo-fijo,\r\n        #plazo-fijo *,\r\n        #plazo-fijo *::before,\r\n        #plazo-fijo *::after {\r\n            box-sizing: border-box;\r\n            margin: 0;\r\n            padding: 0;\r\n        }\r\n\r\n        #plazo-fijo {\r\n            --surface: #ffffff;\r\n            --text-primary: #1a1a1a;\r\n            --text-secondary: #5f6b7a;\r\n            --text-muted: #8a94a3;\r\n            --border: rgba(0, 0, 0, 0.06);\r\n            --border-light: rgba(0, 0, 0, 0.04);\r\n            --accent: #0b734d;\r\n            --accent-soft: rgba(11, 115, 77, 0.04);\r\n            \r\n            --shadow-card: \r\n                0 1px 3px rgba(0,0,0,0.03),\r\n                0 8px 24px rgba(0,0,0,0.04);\r\n            --shadow-hover: \r\n                0 4px 8px rgba(0,0,0,0.05),\r\n                0 16px 32px rgba(11, 115, 77, 0.06);\r\n            --shadow-pressed: \r\n                0 1px 2px rgba(0,0,0,0.04),\r\n                0 2px 4px rgba(0,0,0,0.04);\r\n            \r\n            --radius-sm: 10px;\r\n            --radius-md: 16px;\r\n            --radius-lg: 20px;\r\n            \r\n            --transition-smooth: 0.25s cubic-bezier(0.2, 0.0, 0, 1.0);\r\n            \r\n            font-family: 'Inter', system-ui, -apple-system, sans-serif;\r\n            line-height: 1.5;\r\n            -webkit-font-smoothing: antialiased;\r\n            -moz-osx-font-smoothing: grayscale;\r\n            \r\n            background: #ffffff;\r\n            color: var(--text-primary);\r\n            width: 100%;\r\n            max-width: 100%;\r\n            padding: 0;\r\n            margin: 0;\r\n        }\r\n\r\n        #plazo-fijo .container {\r\n            max-width: 100%;\r\n            width: 100%;\r\n            margin: 0;\r\n            padding: 0;\r\n        }\r\n\r\n        #plazo-fijo .hero {\r\n            text-align: left;\r\n            margin-bottom: 24px;\r\n            padding: 0 4px;\r\n            background: transparent;\r\n            border: none;\r\n            box-shadow: none;\r\n        }\r\n\r\n        #plazo-fijo .hero-label {\r\n            font-size: 0.65rem;\r\n            font-weight: 600;\r\n            text-transform: uppercase;\r\n            letter-spacing: 2px;\r\n            color: var(--accent);\r\n            margin-bottom: 8px;\r\n            display: block;\r\n        }\r\n\r\n        #plazo-fijo .hero h1 {\r\n            font-size: 1.8rem;\r\n            font-weight: 400;\r\n            letter-spacing: -1px;\r\n            color: var(--text-primary);\r\n            line-height: 1.1;\r\n        }\r\n\r\n        #plazo-fijo .hero h1 strong {\r\n            font-weight: 600;\r\n            color: var(--accent);\r\n        }\r\n\r\n        #plazo-fijo .hero p {\r\n            font-size: 0.9rem;\r\n            color: var(--text-secondary);\r\n            font-weight: 400;\r\n            line-height: 1.5;\r\n            margin-top: 6px;\r\n        }\r\n\r\n        #plazo-fijo .hero-divider {\r\n            width: 40px;\r\n            height: 3px;\r\n            background-color: var(--accent);\r\n            margin-top: 14px;\r\n            border-radius: 2px;\r\n            opacity: 0.6;\r\n        }\r\n\r\n        \/* ===== LAYOUT DOBLE COLUMNA ===== *\/\r\n        #plazo-fijo .split-layout {\r\n            display: grid;\r\n            grid-template-columns: 1fr 1fr;\r\n            gap: 20px;\r\n            align-items: start;\r\n        }\r\n\r\n        \/* Columna izquierda: Imagen 4:3 *\/\r\n        #plazo-fijo .image-panel {\r\n            position: sticky;\r\n            top: 20px;\r\n        }\r\n\r\n        #plazo-fijo .image-container {\r\n            background: var(--surface);\r\n            border-radius: var(--radius-lg);\r\n            overflow: hidden;\r\n            box-shadow: var(--shadow-card);\r\n            border: 1px solid var(--border);\r\n            aspect-ratio: 4 \/ 3;\r\n            display: flex;\r\n            align-items: center;\r\n            justify-content: center;\r\n            background: #fafbfa;\r\n        }\r\n\r\n        #plazo-fijo .image-container img {\r\n            width: 100%;\r\n            height: 100%;\r\n            object-fit: contain;\r\n            display: block;\r\n            padding: 12px;\r\n        }\r\n\r\n        \/* ===== TARJETA DIN\u00c1MICA CON EFECTO T\u00c1CTIL ===== *\/\r\n        #plazo-fijo .card {\r\n            background: var(--surface);\r\n            border-radius: var(--radius-lg);\r\n            display: flex;\r\n            flex-direction: column;\r\n            box-shadow: var(--shadow-card);\r\n            border: 1px solid var(--border);\r\n            transition: all var(--transition-smooth);\r\n            transform: translateY(0);\r\n            position: relative;\r\n            overflow: hidden;\r\n            outline: none;\r\n            cursor: pointer;\r\n            -webkit-tap-highlight-color: transparent;\r\n        }\r\n\r\n        #plazo-fijo .card:focus,\r\n        #plazo-fijo .card:focus-visible,\r\n        #plazo-fijo .card:active,\r\n        #plazo-fijo .card:focus-within {\r\n            outline: none;\r\n            box-shadow: var(--shadow-pressed);\r\n            background-color: #fafbfa;\r\n        }\r\n\r\n        #plazo-fijo .card::before {\r\n            content: '';\r\n            position: absolute;\r\n            top: 0;\r\n            left: 0;\r\n            right: 0;\r\n            height: 3px;\r\n            background: var(--accent);\r\n            transform: scaleX(0);\r\n            transform-origin: left;\r\n            transition: transform 0.4s cubic-bezier(0.2, 0.0, 0, 1.0);\r\n            border-radius: 0 0 2px 0;\r\n            z-index: 2;\r\n        }\r\n\r\n        #plazo-fijo .card:hover::before {\r\n            transform: scaleX(1);\r\n        }\r\n\r\n        #plazo-fijo .card:hover {\r\n            transform: translateY(-4px);\r\n            box-shadow: var(--shadow-hover);\r\n            border-color: transparent;\r\n            z-index: 2;\r\n        }\r\n\r\n        #plazo-fijo .card:active {\r\n            transform: translateY(0px) scale(0.995);\r\n            box-shadow: var(--shadow-pressed);\r\n            background-color: #fafbfa;\r\n            transition: all 0.05s ease;\r\n        }\r\n\r\n        @media (max-width: 768px) {\r\n            #plazo-fijo .card:hover {\r\n                transform: none;\r\n                box-shadow: var(--shadow-card);\r\n            }\r\n            #plazo-fijo .card::before {\r\n                transform: scaleX(0);\r\n            }\r\n            #plazo-fijo .card:active {\r\n                transform: scale(0.985);\r\n                background-color: #f5f5f5;\r\n            }\r\n        }\r\n\r\n        #plazo-fijo .card-body {\r\n            padding: 28px 28px;\r\n            display: flex;\r\n            flex-direction: column;\r\n        }\r\n\r\n        #plazo-fijo .card-header {\r\n            display: flex;\r\n            align-items: flex-start;\r\n            justify-content: space-between;\r\n            margin-bottom: 8px;\r\n            gap: 10px;\r\n        }\r\n\r\n        #plazo-fijo .card-title-group {\r\n            display: flex;\r\n            flex-direction: column;\r\n        }\r\n\r\n        #plazo-fijo .card-badge {\r\n            font-size: 0.65rem;\r\n            font-weight: 600;\r\n            text-transform: uppercase;\r\n            letter-spacing: 1.5px;\r\n            color: var(--accent);\r\n            opacity: 0.7;\r\n            margin-bottom: 4px;\r\n            transition: opacity 0.3s ease;\r\n        }\r\n\r\n        #plazo-fijo .card:hover .card-badge {\r\n            opacity: 1;\r\n        }\r\n\r\n        #plazo-fijo .card-title {\r\n            font-size: 1.4rem;\r\n            font-weight: 600;\r\n            color: var(--text-primary);\r\n            letter-spacing: -0.3px;\r\n            line-height: 1.2;\r\n        }\r\n\r\n        #plazo-fijo .card-number {\r\n            font-size: 0.65rem;\r\n            font-weight: 600;\r\n            color: var(--accent);\r\n            opacity: 0.4;\r\n            letter-spacing: 1px;\r\n            font-feature-settings: \"tnum\";\r\n            transition: opacity 0.3s ease;\r\n        }\r\n\r\n        #plazo-fijo .card:hover .card-number {\r\n            opacity: 0.8;\r\n        }\r\n\r\n        #plazo-fijo .card-subtitle {\r\n            font-size: 0.85rem;\r\n            color: var(--text-secondary);\r\n            margin-bottom: 20px;\r\n            line-height: 1.5;\r\n            font-weight: 400;\r\n            transition: color 0.3s ease;\r\n        }\r\n\r\n        #plazo-fijo .card:hover .card-subtitle {\r\n            color: #4a5a50;\r\n        }\r\n\r\n        #plazo-fijo .features-grid {\r\n            display: grid;\r\n            grid-template-columns: 1fr 1fr;\r\n            gap: 1px;\r\n            border: 1px solid var(--border-light);\r\n            border-radius: var(--radius-md);\r\n            overflow: hidden;\r\n            transition: border-color 0.3s ease;\r\n        }\r\n\r\n        #plazo-fijo .card:hover .features-grid {\r\n            border-color: rgba(11, 115, 77, 0.15);\r\n        }\r\n\r\n        #plazo-fijo .feature-item {\r\n            font-size: 0.82rem;\r\n            color: var(--text-secondary);\r\n            font-weight: 450;\r\n            line-height: 1.5;\r\n            padding: 14px 16px 14px 22px;\r\n            background: #fafbfa;\r\n            transition: color 0.2s ease, transform 0.2s ease;\r\n            position: relative;\r\n        }\r\n\r\n        #plazo-fijo .card:hover .feature-item {\r\n            color: #3a4a40;\r\n            transform: translateX(2px);\r\n        }\r\n\r\n        #plazo-fijo .feature-item::before {\r\n            content: '';\r\n            position: absolute;\r\n            left: 10px;\r\n            top: 19px;\r\n            width: 4px;\r\n            height: 4px;\r\n            border-radius: 50%;\r\n            background: var(--accent);\r\n            opacity: 0;\r\n            transition: opacity 0.3s ease, transform 0.3s ease;\r\n            transform: scale(0);\r\n        }\r\n\r\n        #plazo-fijo .card:hover .feature-item::before {\r\n            opacity: 0.5;\r\n            transform: scale(1);\r\n        }\r\n\r\n        @media (max-width: 768px) {\r\n            #plazo-fijo .split-layout {\r\n                grid-template-columns: 1fr;\r\n                gap: 16px;\r\n            }\r\n\r\n            #plazo-fijo .image-panel {\r\n                position: static;\r\n            }\r\n\r\n            #plazo-fijo .image-container {\r\n                aspect-ratio: 4 \/ 3;\r\n                max-height: 300px;\r\n            }\r\n\r\n            #plazo-fijo .hero h1 {\r\n                font-size: 1.5rem;\r\n            }\r\n\r\n            #plazo-fijo .card-body {\r\n                padding: 22px 18px;\r\n            }\r\n\r\n            #plazo-fijo .card-title {\r\n                font-size: 1.2rem;\r\n            }\r\n\r\n            #plazo-fijo .features-grid {\r\n                grid-template-columns: 1fr;\r\n            }\r\n\r\n            #plazo-fijo .feature-item {\r\n                padding-left: 18px;\r\n            }\r\n        }\r\n    <\/style>\r\n<\/head>\r\n<body>\r\n\r\n    <div id=\"plazo-fijo\">\r\n\r\n        <main class=\"container\">\r\n\r\n            <header class=\"hero\">\r\n                <span class=\"hero-label\">Alta Rentabilidad<\/span>\r\n                <h1><strong>Plazo Fijo<\/strong><\/h1>\r\n                <p>Hac\u00e9 crecer tu capital con tasas competitivas y plazos adaptables a tu medida.<\/p>\r\n                <div class=\"hero-divider\"><\/div>\r\n            <\/header>\r\n\r\n            <div class=\"split-layout\">\r\n\r\n                <!-- COLUMNA IZQUIERDA: IMAGEN 4:3 -->\r\n                <aside class=\"image-panel\">\r\n                    <div class=\"image-container\">\r\n                        <img decoding=\"async\" src=\"https:\/\/ccsanalejo.com\/wp-content\/uploads\/2026\/07\/Deposito-a-plazo.png\" alt=\"Plazo Fijo\">\r\n                    <\/div>\r\n                <\/aside>\r\n\r\n                <!-- COLUMNA DERECHA: TARJETA DIN\u00c1MICA -->\r\n                <div class=\"card\">\r\n                    <div class=\"card-body\">\r\n                        <div class=\"card-header\">\r\n                            <div class=\"card-title-group\">\r\n                                <span class=\"card-badge\">Ahorro<\/span>\r\n                                <div class=\"card-title\">Plazo Fijo<\/div>\r\n                            <\/div>\r\n                            <span class=\"card-number\">02<\/span>\r\n                        <\/div>\r\n\r\n                        <p class=\"card-subtitle\">Rentabilidad superior con tasas preferenciales y plazos que se ajustan a tus objetivos financieros.<\/p>\r\n\r\n                        <div class=\"features-grid\">\r\n                            <div class=\"feature-item\">Tasa de inter\u00e9s altamente competitiva<\/div>\r\n                            <div class=\"feature-item\">Mayor rentabilidad que una cuenta tradicional<\/div>\r\n                            <div class=\"feature-item\">Disponible para persona natural o jur\u00eddica<\/div>\r\n                            <div class=\"feature-item\">Plazos accesibles y adaptables a tu capacidad<\/div>\r\n                        <\/div>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n            <\/div>\r\n\r\n        <\/main>\r\n\r\n    <\/div>\r\n\r\n<\/body>\r\n<\/html>\t\t\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<section class=\"elementor-section elementor-top-section elementor-element elementor-element-52759bc elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"52759bc\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-9569296\" data-id=\"9569296\" data-element_type=\"column\" data-e-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-2ada1cc elementor-widget elementor-widget-html\" data-id=\"2ada1cc\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"es\">\r\n<head>\r\n    <meta charset=\"UTF-8\">\r\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n    <title>Cuenta Corriente | Ahorro<\/title>\r\n    \r\n    <style>\r\n        #cuenta-corriente,\r\n        #cuenta-corriente *,\r\n        #cuenta-corriente *::before,\r\n        #cuenta-corriente *::after {\r\n            box-sizing: border-box;\r\n            margin: 0;\r\n            padding: 0;\r\n        }\r\n\r\n        #cuenta-corriente {\r\n            --surface: #ffffff;\r\n            --text-primary: #1a1a1a;\r\n            --text-secondary: #5f6b7a;\r\n            --text-muted: #8a94a3;\r\n            --border: rgba(0, 0, 0, 0.06);\r\n            --border-light: rgba(0, 0, 0, 0.04);\r\n            --accent: #0b734d;\r\n            --accent-soft: rgba(11, 115, 77, 0.04);\r\n            \r\n            --shadow-card: \r\n                0 1px 3px rgba(0,0,0,0.03),\r\n                0 8px 24px rgba(0,0,0,0.04);\r\n            --shadow-hover: \r\n                0 4px 8px rgba(0,0,0,0.05),\r\n                0 16px 32px rgba(11, 115, 77, 0.06);\r\n            --shadow-pressed: \r\n                0 1px 2px rgba(0,0,0,0.04),\r\n                0 2px 4px rgba(0,0,0,0.04);\r\n            \r\n            --radius-sm: 10px;\r\n            --radius-md: 16px;\r\n            --radius-lg: 20px;\r\n            \r\n            --transition-smooth: 0.25s cubic-bezier(0.2, 0.0, 0, 1.0);\r\n            \r\n            font-family: 'Inter', system-ui, -apple-system, sans-serif;\r\n            line-height: 1.5;\r\n            -webkit-font-smoothing: antialiased;\r\n            -moz-osx-font-smoothing: grayscale;\r\n            \r\n            background: #ffffff;\r\n            color: var(--text-primary);\r\n            width: 100%;\r\n            max-width: 100%;\r\n            padding: 0;\r\n            margin: 0;\r\n        }\r\n\r\n        #cuenta-corriente .container {\r\n            max-width: 100%;\r\n            width: 100%;\r\n            margin: 0;\r\n            padding: 0;\r\n        }\r\n\r\n        #cuenta-corriente .hero {\r\n            text-align: left;\r\n            margin-bottom: 24px;\r\n            padding: 0 4px;\r\n            background: transparent;\r\n            border: none;\r\n            box-shadow: none;\r\n        }\r\n\r\n        #cuenta-corriente .hero-label {\r\n            font-size: 0.65rem;\r\n            font-weight: 600;\r\n            text-transform: uppercase;\r\n            letter-spacing: 2px;\r\n            color: var(--accent);\r\n            margin-bottom: 8px;\r\n            display: block;\r\n        }\r\n\r\n        #cuenta-corriente .hero h1 {\r\n            font-size: 1.8rem;\r\n            font-weight: 400;\r\n            letter-spacing: -1px;\r\n            color: var(--text-primary);\r\n            line-height: 1.1;\r\n        }\r\n\r\n        #cuenta-corriente .hero h1 strong {\r\n            font-weight: 600;\r\n            color: var(--accent);\r\n        }\r\n\r\n        #cuenta-corriente .hero p {\r\n            font-size: 0.9rem;\r\n            color: var(--text-secondary);\r\n            font-weight: 400;\r\n            line-height: 1.5;\r\n            margin-top: 6px;\r\n        }\r\n\r\n        #cuenta-corriente .hero-divider {\r\n            width: 40px;\r\n            height: 3px;\r\n            background-color: var(--accent);\r\n            margin-top: 14px;\r\n            border-radius: 2px;\r\n            opacity: 0.6;\r\n        }\r\n\r\n        \/* ===== LAYOUT DOBLE COLUMNA ===== *\/\r\n        #cuenta-corriente .split-layout {\r\n            display: grid;\r\n            grid-template-columns: 1fr 1fr;\r\n            gap: 20px;\r\n            align-items: start;\r\n        }\r\n\r\n        \/* Columna izquierda: Imagen 4:3 *\/\r\n        #cuenta-corriente .image-panel {\r\n            position: sticky;\r\n            top: 20px;\r\n        }\r\n\r\n        #cuenta-corriente .image-container {\r\n            background: var(--surface);\r\n            border-radius: var(--radius-lg);\r\n            overflow: hidden;\r\n            box-shadow: var(--shadow-card);\r\n            border: 1px solid var(--border);\r\n            aspect-ratio: 4 \/ 3;\r\n            display: flex;\r\n            align-items: center;\r\n            justify-content: center;\r\n            background: #fafbfa;\r\n        }\r\n\r\n        #cuenta-corriente .image-container img {\r\n            width: 100%;\r\n            height: 100%;\r\n            object-fit: contain;\r\n            display: block;\r\n            padding: 12px;\r\n        }\r\n\r\n        \/* ===== TARJETA DIN\u00c1MICA CON EFECTO T\u00c1CTIL ===== *\/\r\n        #cuenta-corriente .card {\r\n            background: var(--surface);\r\n            border-radius: var(--radius-lg);\r\n            display: flex;\r\n            flex-direction: column;\r\n            box-shadow: var(--shadow-card);\r\n            border: 1px solid var(--border);\r\n            transition: all var(--transition-smooth);\r\n            transform: translateY(0);\r\n            position: relative;\r\n            overflow: hidden;\r\n            outline: none;\r\n            cursor: pointer;\r\n            -webkit-tap-highlight-color: transparent;\r\n        }\r\n\r\n        #cuenta-corriente .card:focus,\r\n        #cuenta-corriente .card:focus-visible,\r\n        #cuenta-corriente .card:active,\r\n        #cuenta-corriente .card:focus-within {\r\n            outline: none;\r\n            box-shadow: var(--shadow-pressed);\r\n            background-color: #fafbfa;\r\n        }\r\n\r\n        #cuenta-corriente .card::before {\r\n            content: '';\r\n            position: absolute;\r\n            top: 0;\r\n            left: 0;\r\n            right: 0;\r\n            height: 3px;\r\n            background: var(--accent);\r\n            transform: scaleX(0);\r\n            transform-origin: left;\r\n            transition: transform 0.4s cubic-bezier(0.2, 0.0, 0, 1.0);\r\n            border-radius: 0 0 2px 0;\r\n            z-index: 2;\r\n        }\r\n\r\n        #cuenta-corriente .card:hover::before {\r\n            transform: scaleX(1);\r\n        }\r\n\r\n        #cuenta-corriente .card:hover {\r\n            transform: translateY(-4px);\r\n            box-shadow: var(--shadow-hover);\r\n            border-color: transparent;\r\n            z-index: 2;\r\n        }\r\n\r\n        #cuenta-corriente .card:active {\r\n            transform: translateY(0px) scale(0.995);\r\n            box-shadow: var(--shadow-pressed);\r\n            background-color: #fafbfa;\r\n            transition: all 0.05s ease;\r\n        }\r\n\r\n        @media (max-width: 768px) {\r\n            #cuenta-corriente .card:hover {\r\n                transform: none;\r\n                box-shadow: var(--shadow-card);\r\n            }\r\n            #cuenta-corriente .card::before {\r\n                transform: scaleX(0);\r\n            }\r\n            #cuenta-corriente .card:active {\r\n                transform: scale(0.985);\r\n                background-color: #f5f5f5;\r\n            }\r\n        }\r\n\r\n        #cuenta-corriente .card-body {\r\n            padding: 28px 28px;\r\n            display: flex;\r\n            flex-direction: column;\r\n        }\r\n\r\n        #cuenta-corriente .card-header {\r\n            display: flex;\r\n            align-items: flex-start;\r\n            justify-content: space-between;\r\n            margin-bottom: 8px;\r\n            gap: 10px;\r\n        }\r\n\r\n        #cuenta-corriente .card-title-group {\r\n            display: flex;\r\n            flex-direction: column;\r\n        }\r\n\r\n        #cuenta-corriente .card-badge {\r\n            font-size: 0.65rem;\r\n            font-weight: 600;\r\n            text-transform: uppercase;\r\n            letter-spacing: 1.5px;\r\n            color: var(--accent);\r\n            opacity: 0.7;\r\n            margin-bottom: 4px;\r\n            transition: opacity 0.3s ease;\r\n        }\r\n\r\n        #cuenta-corriente .card:hover .card-badge {\r\n            opacity: 1;\r\n        }\r\n\r\n        #cuenta-corriente .card-title {\r\n            font-size: 1.4rem;\r\n            font-weight: 600;\r\n            color: var(--text-primary);\r\n            letter-spacing: -0.3px;\r\n            line-height: 1.2;\r\n        }\r\n\r\n        #cuenta-corriente .card-number {\r\n            font-size: 0.65rem;\r\n            font-weight: 600;\r\n            color: var(--accent);\r\n            opacity: 0.4;\r\n            letter-spacing: 1px;\r\n            font-feature-settings: \"tnum\";\r\n            transition: opacity 0.3s ease;\r\n        }\r\n\r\n        #cuenta-corriente .card:hover .card-number {\r\n            opacity: 0.8;\r\n        }\r\n\r\n        #cuenta-corriente .card-subtitle {\r\n            font-size: 0.85rem;\r\n            color: var(--text-secondary);\r\n            margin-bottom: 20px;\r\n            line-height: 1.5;\r\n            font-weight: 400;\r\n            transition: color 0.3s ease;\r\n        }\r\n\r\n        #cuenta-corriente .card:hover .card-subtitle {\r\n            color: #4a5a50;\r\n        }\r\n\r\n        #cuenta-corriente .features-grid {\r\n            display: grid;\r\n            grid-template-columns: 1fr 1fr;\r\n            gap: 1px;\r\n            border: 1px solid var(--border-light);\r\n            border-radius: var(--radius-md);\r\n            overflow: hidden;\r\n            transition: border-color 0.3s ease;\r\n        }\r\n\r\n        #cuenta-corriente .card:hover .features-grid {\r\n            border-color: rgba(11, 115, 77, 0.15);\r\n        }\r\n\r\n        #cuenta-corriente .feature-item {\r\n            font-size: 0.82rem;\r\n            color: var(--text-secondary);\r\n            font-weight: 450;\r\n            line-height: 1.5;\r\n            padding: 14px 16px 14px 22px;\r\n            background: #fafbfa;\r\n            transition: color 0.2s ease, transform 0.2s ease;\r\n            position: relative;\r\n        }\r\n\r\n        #cuenta-corriente .card:hover .feature-item {\r\n            color: #3a4a40;\r\n            transform: translateX(2px);\r\n        }\r\n\r\n        #cuenta-corriente .feature-item::before {\r\n            content: '';\r\n            position: absolute;\r\n            left: 10px;\r\n            top: 19px;\r\n            width: 4px;\r\n            height: 4px;\r\n            border-radius: 50%;\r\n            background: var(--accent);\r\n            opacity: 0;\r\n            transition: opacity 0.3s ease, transform 0.3s ease;\r\n            transform: scale(0);\r\n        }\r\n\r\n        #cuenta-corriente .card:hover .feature-item::before {\r\n            opacity: 0.5;\r\n            transform: scale(1);\r\n        }\r\n\r\n        \/* Nota *\/\r\n        #cuenta-corriente .card-note {\r\n            margin-top: 16px;\r\n            font-size: 0.75rem;\r\n            color: var(--text-muted);\r\n            padding: 12px 16px;\r\n            background: var(--accent-soft);\r\n            border-radius: var(--radius-sm);\r\n            border-left: 2px solid var(--accent);\r\n            transition: background 0.3s ease;\r\n        }\r\n\r\n        #cuenta-corriente .card:hover .card-note {\r\n            background: rgba(11, 115, 77, 0.07);\r\n        }\r\n\r\n        @media (max-width: 768px) {\r\n            #cuenta-corriente .split-layout {\r\n                grid-template-columns: 1fr;\r\n                gap: 16px;\r\n            }\r\n\r\n            #cuenta-corriente .image-panel {\r\n                position: static;\r\n            }\r\n\r\n            #cuenta-corriente .image-container {\r\n                aspect-ratio: 4 \/ 3;\r\n                max-height: 300px;\r\n            }\r\n\r\n            #cuenta-corriente .hero h1 {\r\n                font-size: 1.5rem;\r\n            }\r\n\r\n            #cuenta-corriente .card-body {\r\n                padding: 22px 18px;\r\n            }\r\n\r\n            #cuenta-corriente .card-title {\r\n                font-size: 1.2rem;\r\n            }\r\n\r\n            #cuenta-corriente .features-grid {\r\n                grid-template-columns: 1fr;\r\n            }\r\n\r\n            #cuenta-corriente .feature-item {\r\n                padding-left: 18px;\r\n            }\r\n        }\r\n    <\/style>\r\n<\/head>\r\n<body>\r\n\r\n    <div id=\"cuenta-corriente\">\r\n\r\n        <main class=\"container\">\r\n\r\n            <header class=\"hero\">\r\n                <span class=\"hero-label\">Transaccional<\/span>\r\n                <h1><strong>Cuenta Corriente<\/strong><\/h1>\r\n                <p>Liquidez y control total para tus operaciones diarias con respaldo institucional.<\/p>\r\n                <div class=\"hero-divider\"><\/div>\r\n            <\/header>\r\n\r\n            <div class=\"split-layout\">\r\n\r\n           <!-- COLUMNA IZQUIERDA: IMAGEN 4:3 -->\r\n                <aside class=\"image-panel\">\r\n                    <div class=\"image-container\">\r\n                        <img decoding=\"async\" src=\"https:\/\/ccsanalejo.com\/wp-content\/uploads\/2026\/07\/Cuenta-de-Ahorro-Corriente.png\" alt=\"Ahorro Programado\">\r\n                    <\/div>\r\n                <\/aside>\r\n                <!-- COLUMNA DERECHA: TARJETA DIN\u00c1MICA -->\r\n                <div class=\"card\">\r\n                    <div class=\"card-body\">\r\n                        <div class=\"card-header\">\r\n                            <div class=\"card-title-group\">\r\n                                <span class=\"card-badge\">Ahorro<\/span>\r\n                                <div class=\"card-title\">Cuenta Corriente<\/div>\r\n                            <\/div>\r\n                            <span class=\"card-number\">03<\/span>\r\n                        <\/div>\r\n\r\n                        <p class=\"card-subtitle\">Control total de tus finanzas con liquidez inmediata y acceso a tarjeta de d\u00e9bito internacional.<\/p>\r\n\r\n                        <div class=\"features-grid\">\r\n                            <div class=\"feature-item\">Liquidez inmediata en dep\u00f3sitos y retiros<\/div>\r\n                            <div class=\"feature-item\">Intereses sobre saldos diarios, capitalizables trimestralmente<\/div>\r\n                            <div class=\"feature-item\">Control total de abonos y d\u00e9bitos mediante libreta<\/div>\r\n                            <div class=\"feature-item\">Te conviertes en socio integrante de la Caja<\/div>\r\n                            <div class=\"feature-item\" style=\"grid-column: 1 \/ -1;\">Acceso a Tarjeta de D\u00e9bito VISA Internacional<\/div>\r\n                        <\/div>\r\n\r\n                        <p class=\"card-note\">Exclusivo para socios.<\/p>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n            <\/div>\r\n\r\n        <\/main>\r\n\r\n    <\/div>\r\n\r\n<\/body>\r\n<\/html>\t\t\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<section class=\"elementor-section elementor-top-section elementor-element elementor-element-820675e elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"820675e\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-bedd230\" data-id=\"bedd230\" data-element_type=\"column\" data-e-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-5a96871 elementor-widget elementor-widget-html\" data-id=\"5a96871\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"es\">\r\n<head>\r\n    <meta charset=\"UTF-8\">\r\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n    <title>Ahorro Programado | Ahorro<\/title>\r\n    \r\n    <style>\r\n        #ahorro-programado,\r\n        #ahorro-programado *,\r\n        #ahorro-programado *::before,\r\n        #ahorro-programado *::after {\r\n            box-sizing: border-box;\r\n            margin: 0;\r\n            padding: 0;\r\n        }\r\n\r\n        #ahorro-programado {\r\n            --surface: #ffffff;\r\n            --text-primary: #1a1a1a;\r\n            --text-secondary: #5f6b7a;\r\n            --text-muted: #8a94a3;\r\n            --border: rgba(0, 0, 0, 0.06);\r\n            --border-light: rgba(0, 0, 0, 0.04);\r\n            --accent: #0b734d;\r\n            --accent-soft: rgba(11, 115, 77, 0.04);\r\n            \r\n            --shadow-card: \r\n                0 1px 3px rgba(0,0,0,0.03),\r\n                0 8px 24px rgba(0,0,0,0.04);\r\n            --shadow-hover: \r\n                0 4px 8px rgba(0,0,0,0.05),\r\n                0 16px 32px rgba(11, 115, 77, 0.06);\r\n            --shadow-pressed: \r\n                0 1px 2px rgba(0,0,0,0.04),\r\n                0 2px 4px rgba(0,0,0,0.04);\r\n            \r\n            --radius-sm: 10px;\r\n            --radius-md: 16px;\r\n            --radius-lg: 20px;\r\n            \r\n            --transition-smooth: 0.25s cubic-bezier(0.2, 0.0, 0, 1.0);\r\n            \r\n            font-family: 'Inter', system-ui, -apple-system, sans-serif;\r\n            line-height: 1.5;\r\n            -webkit-font-smoothing: antialiased;\r\n            -moz-osx-font-smoothing: grayscale;\r\n            \r\n            background: #ffffff;\r\n            color: var(--text-primary);\r\n            width: 100%;\r\n            max-width: 100%;\r\n            padding: 0;\r\n            margin: 0;\r\n        }\r\n\r\n        #ahorro-programado .container {\r\n            max-width: 100%;\r\n            width: 100%;\r\n            margin: 0;\r\n            padding: 0;\r\n        }\r\n\r\n        #ahorro-programado .hero {\r\n            text-align: left;\r\n            margin-bottom: 24px;\r\n            padding: 0 4px;\r\n            background: transparent;\r\n            border: none;\r\n            box-shadow: none;\r\n        }\r\n\r\n        #ahorro-programado .hero-label {\r\n            font-size: 0.65rem;\r\n            font-weight: 600;\r\n            text-transform: uppercase;\r\n            letter-spacing: 2px;\r\n            color: var(--accent);\r\n            margin-bottom: 8px;\r\n            display: block;\r\n        }\r\n\r\n        #ahorro-programado .hero h1 {\r\n            font-size: 1.8rem;\r\n            font-weight: 400;\r\n            letter-spacing: -1px;\r\n            color: var(--text-primary);\r\n            line-height: 1.1;\r\n        }\r\n\r\n        #ahorro-programado .hero h1 strong {\r\n            font-weight: 600;\r\n            color: var(--accent);\r\n        }\r\n\r\n        #ahorro-programado .hero p {\r\n            font-size: 0.9rem;\r\n            color: var(--text-secondary);\r\n            font-weight: 400;\r\n            line-height: 1.5;\r\n            margin-top: 6px;\r\n        }\r\n\r\n        #ahorro-programado .hero-divider {\r\n            width: 40px;\r\n            height: 3px;\r\n            background-color: var(--accent);\r\n            margin-top: 14px;\r\n            border-radius: 2px;\r\n            opacity: 0.6;\r\n        }\r\n\r\n        \/* ===== LAYOUT DOBLE COLUMNA ===== *\/\r\n        #ahorro-programado .split-layout {\r\n            display: grid;\r\n            grid-template-columns: 1fr 1fr;\r\n            gap: 20px;\r\n            align-items: start;\r\n        }\r\n\r\n        \/* Columna izquierda: Imagen 4:3 *\/\r\n        #ahorro-programado .image-panel {\r\n            position: sticky;\r\n            top: 20px;\r\n        }\r\n\r\n        #ahorro-programado .image-container {\r\n            background: var(--surface);\r\n            border-radius: var(--radius-lg);\r\n            overflow: hidden;\r\n            box-shadow: var(--shadow-card);\r\n            border: 1px solid var(--border);\r\n            aspect-ratio: 4 \/ 3;\r\n            display: flex;\r\n            align-items: center;\r\n            justify-content: center;\r\n            background: #fafbfa;\r\n        }\r\n\r\n        #ahorro-programado .image-container img {\r\n            width: 100%;\r\n            height: 100%;\r\n            object-fit: contain;\r\n            display: block;\r\n            padding: 12px;\r\n        }\r\n\r\n        \/* ===== TARJETA DIN\u00c1MICA CON EFECTO T\u00c1CTIL ===== *\/\r\n        #ahorro-programado .card {\r\n            background: var(--surface);\r\n            border-radius: var(--radius-lg);\r\n            display: flex;\r\n            flex-direction: column;\r\n            box-shadow: var(--shadow-card);\r\n            border: 1px solid var(--border);\r\n            transition: all var(--transition-smooth);\r\n            transform: translateY(0);\r\n            position: relative;\r\n            overflow: hidden;\r\n            outline: none;\r\n            cursor: pointer;\r\n            -webkit-tap-highlight-color: transparent;\r\n        }\r\n\r\n        #ahorro-programado .card:focus,\r\n        #ahorro-programado .card:focus-visible,\r\n        #ahorro-programado .card:active,\r\n        #ahorro-programado .card:focus-within {\r\n            outline: none;\r\n            box-shadow: var(--shadow-pressed);\r\n            background-color: #fafbfa;\r\n        }\r\n\r\n        #ahorro-programado .card::before {\r\n            content: '';\r\n            position: absolute;\r\n            top: 0;\r\n            left: 0;\r\n            right: 0;\r\n            height: 3px;\r\n            background: var(--accent);\r\n            transform: scaleX(0);\r\n            transform-origin: left;\r\n            transition: transform 0.4s cubic-bezier(0.2, 0.0, 0, 1.0);\r\n            border-radius: 0 0 2px 0;\r\n            z-index: 2;\r\n        }\r\n\r\n        #ahorro-programado .card:hover::before {\r\n            transform: scaleX(1);\r\n        }\r\n\r\n        #ahorro-programado .card:hover {\r\n            transform: translateY(-4px);\r\n            box-shadow: var(--shadow-hover);\r\n            border-color: transparent;\r\n            z-index: 2;\r\n        }\r\n\r\n        #ahorro-programado .card:active {\r\n            transform: translateY(0px) scale(0.995);\r\n            box-shadow: var(--shadow-pressed);\r\n            background-color: #fafbfa;\r\n            transition: all 0.05s ease;\r\n        }\r\n\r\n        @media (max-width: 768px) {\r\n            #ahorro-programado .card:hover {\r\n                transform: none;\r\n                box-shadow: var(--shadow-card);\r\n            }\r\n            #ahorro-programado .card::before {\r\n                transform: scaleX(0);\r\n            }\r\n            #ahorro-programado .card:active {\r\n                transform: scale(0.985);\r\n                background-color: #f5f5f5;\r\n            }\r\n        }\r\n\r\n        #ahorro-programado .card-body {\r\n            padding: 28px 28px;\r\n            display: flex;\r\n            flex-direction: column;\r\n        }\r\n\r\n        #ahorro-programado .card-header {\r\n            display: flex;\r\n            align-items: flex-start;\r\n            justify-content: space-between;\r\n            margin-bottom: 8px;\r\n            gap: 10px;\r\n        }\r\n\r\n        #ahorro-programado .card-title-group {\r\n            display: flex;\r\n            flex-direction: column;\r\n        }\r\n\r\n        #ahorro-programado .card-badge {\r\n            font-size: 0.65rem;\r\n            font-weight: 600;\r\n            text-transform: uppercase;\r\n            letter-spacing: 1.5px;\r\n            color: var(--accent);\r\n            opacity: 0.7;\r\n            margin-bottom: 4px;\r\n            transition: opacity 0.3s ease;\r\n        }\r\n\r\n        #ahorro-programado .card:hover .card-badge {\r\n            opacity: 1;\r\n        }\r\n\r\n        #ahorro-programado .card-title {\r\n            font-size: 1.4rem;\r\n            font-weight: 600;\r\n            color: var(--text-primary);\r\n            letter-spacing: -0.3px;\r\n            line-height: 1.2;\r\n        }\r\n\r\n        #ahorro-programado .card-number {\r\n            font-size: 0.65rem;\r\n            font-weight: 600;\r\n            color: var(--accent);\r\n            opacity: 0.4;\r\n            letter-spacing: 1px;\r\n            font-feature-settings: \"tnum\";\r\n            transition: opacity 0.3s ease;\r\n        }\r\n\r\n        #ahorro-programado .card:hover .card-number {\r\n            opacity: 0.8;\r\n        }\r\n\r\n        #ahorro-programado .card-subtitle {\r\n            font-size: 0.85rem;\r\n            color: var(--text-secondary);\r\n            margin-bottom: 20px;\r\n            line-height: 1.5;\r\n            font-weight: 400;\r\n            transition: color 0.3s ease;\r\n        }\r\n\r\n        #ahorro-programado .card:hover .card-subtitle {\r\n            color: #4a5a50;\r\n        }\r\n\r\n        #ahorro-programado .features-grid {\r\n            display: grid;\r\n            grid-template-columns: 1fr 1fr;\r\n            gap: 1px;\r\n            border: 1px solid var(--border-light);\r\n            border-radius: var(--radius-md);\r\n            overflow: hidden;\r\n            transition: border-color 0.3s ease;\r\n        }\r\n\r\n        #ahorro-programado .card:hover .features-grid {\r\n            border-color: rgba(11, 115, 77, 0.15);\r\n        }\r\n\r\n        #ahorro-programado .feature-item {\r\n            font-size: 0.82rem;\r\n            color: var(--text-secondary);\r\n            font-weight: 450;\r\n            line-height: 1.5;\r\n            padding: 14px 16px 14px 22px;\r\n            background: #fafbfa;\r\n            transition: color 0.2s ease, transform 0.2s ease;\r\n            position: relative;\r\n        }\r\n\r\n        #ahorro-programado .card:hover .feature-item {\r\n            color: #3a4a40;\r\n            transform: translateX(2px);\r\n        }\r\n\r\n        #ahorro-programado .feature-item::before {\r\n            content: '';\r\n            position: absolute;\r\n            left: 10px;\r\n            top: 19px;\r\n            width: 4px;\r\n            height: 4px;\r\n            border-radius: 50%;\r\n            background: var(--accent);\r\n            opacity: 0;\r\n            transition: opacity 0.3s ease, transform 0.3s ease;\r\n            transform: scale(0);\r\n        }\r\n\r\n        #ahorro-programado .card:hover .feature-item::before {\r\n            opacity: 0.5;\r\n            transform: scale(1);\r\n        }\r\n\r\n        \/* Secci\u00f3n de opciones de dep\u00f3sito *\/\r\n        #ahorro-programado .feature-full {\r\n            grid-column: 1 \/ -1;\r\n            background: var(--accent-soft);\r\n            padding: 18px 20px;\r\n            border-top: 1px solid var(--border-light);\r\n        }\r\n\r\n        #ahorro-programado .feature-full-label {\r\n            font-size: 0.62rem;\r\n            font-weight: 600;\r\n            text-transform: uppercase;\r\n            letter-spacing: 1.2px;\r\n            color: var(--accent);\r\n            opacity: 0.7;\r\n            margin-bottom: 12px;\r\n        }\r\n\r\n        #ahorro-programado .feature-sublist {\r\n            list-style: none;\r\n            display: flex;\r\n            flex-wrap: wrap;\r\n            gap: 8px 20px;\r\n        }\r\n\r\n        #ahorro-programado .feature-sublist li {\r\n            font-size: 0.78rem;\r\n            color: var(--text-secondary);\r\n            font-weight: 450;\r\n            padding-left: 16px;\r\n            position: relative;\r\n            transition: color 0.2s ease;\r\n        }\r\n\r\n        #ahorro-programado .card:hover .feature-sublist li {\r\n            color: #3a4a40;\r\n        }\r\n\r\n        #ahorro-programado .feature-sublist li::before {\r\n            content: '';\r\n            position: absolute;\r\n            left: 0;\r\n            top: 7px;\r\n            width: 5px;\r\n            height: 5px;\r\n            border-radius: 50%;\r\n            background: var(--accent);\r\n            opacity: 0;\r\n            transition: opacity 0.3s ease, transform 0.3s ease;\r\n            transform: scale(0);\r\n        }\r\n\r\n        #ahorro-programado .card:hover .feature-sublist li::before {\r\n            opacity: 0.4;\r\n            transform: scale(1);\r\n        }\r\n\r\n        @media (max-width: 768px) {\r\n            #ahorro-programado .split-layout {\r\n                grid-template-columns: 1fr;\r\n                gap: 16px;\r\n            }\r\n\r\n            #ahorro-programado .image-panel {\r\n                position: static;\r\n            }\r\n\r\n            #ahorro-programado .image-container {\r\n                aspect-ratio: 4 \/ 3;\r\n                max-height: 300px;\r\n            }\r\n\r\n            #ahorro-programado .hero h1 {\r\n                font-size: 1.5rem;\r\n            }\r\n\r\n            #ahorro-programado .card-body {\r\n                padding: 22px 18px;\r\n            }\r\n\r\n            #ahorro-programado .card-title {\r\n                font-size: 1.2rem;\r\n            }\r\n\r\n            #ahorro-programado .features-grid {\r\n                grid-template-columns: 1fr;\r\n            }\r\n\r\n            #ahorro-programado .feature-item {\r\n                padding-left: 18px;\r\n            }\r\n\r\n            #ahorro-programado .feature-sublist {\r\n                flex-direction: column;\r\n                gap: 6px;\r\n            }\r\n        }\r\n    <\/style>\r\n<\/head>\r\n<body>\r\n\r\n    <div id=\"ahorro-programado\">\r\n\r\n        <main class=\"container\">\r\n\r\n            <header class=\"hero\">\r\n                <span class=\"hero-label\">Cumplimiento de Metas<\/span>\r\n                <h1><strong>Ahorro Programado<\/strong><\/h1>\r\n                <p>Alcanz\u00e1 tus objetivos con planes flexibles y dep\u00f3sitos autom\u00e1ticos.<\/p>\r\n                <div class=\"hero-divider\"><\/div>\r\n            <\/header>\r\n\r\n            <div class=\"split-layout\">\r\n\r\n                <!-- COLUMNA IZQUIERDA: IMAGEN 4:3 -->\r\n                <aside class=\"image-panel\">\r\n                    <div class=\"image-container\">\r\n                        <img decoding=\"async\" src=\"https:\/\/ccsanalejo.com\/wp-content\/uploads\/2026\/07\/AHORRO-PROGRAMADO-1.png\" alt=\"Ahorro Programado\">\r\n                    <\/div>\r\n                <\/aside>\r\n\r\n                <!-- COLUMNA DERECHA: TARJETA DIN\u00c1MICA -->\r\n                <div class=\"card\">\r\n                    <div class=\"card-body\">\r\n                        <div class=\"card-header\">\r\n                            <div class=\"card-title-group\">\r\n                                <span class=\"card-badge\">Ahorro<\/span>\r\n                                <div class=\"card-title\">Ahorro Programado<\/div>\r\n                            <\/div>\r\n                            <span class=\"card-number\">04<\/span>\r\n                        <\/div>\r\n\r\n                        <p class=\"card-subtitle\">Planes de ahorro flexibles con dep\u00f3sitos autom\u00e1ticos para que alcances tus metas sin esfuerzo.<\/p>\r\n\r\n                        <div class=\"features-grid\">\r\n                            <div class=\"feature-item\">Planes de 6 hasta 60 meses<\/div>\r\n                            <div class=\"feature-item\">Dep\u00f3sitos semanales, quincenales o mensuales<\/div>\r\n                            <div class=\"feature-item\">Intereses capitalizables trimestralmente<\/div>\r\n                            <div class=\"feature-full\">\r\n                                <div class=\"feature-full-label\">Opciones de dep\u00f3sito<\/div>\r\n                                <ul class=\"feature-sublist\">\r\n                                    <li>Pago directo en ventanilla<\/li>\r\n                                    <li>Cargo autom\u00e1tico a cuenta de ahorros<\/li>\r\n                                    <li>Transferencia digital (Fedebanking \/ Fedemovil)<\/li>\r\n                                    <li>Dep\u00f3sito en Cajero Autom\u00e1tico y Fedepunto Vecino<\/li>\r\n                                <\/ul>\r\n                            <\/div>\r\n                        <\/div>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n            <\/div>\r\n\r\n        <\/main>\r\n\r\n    <\/div>\r\n\r\n<\/body>\r\n<\/html>\t\t\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<section class=\"elementor-section elementor-top-section elementor-element elementor-element-03c90a8 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"03c90a8\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-4d079a5\" data-id=\"4d079a5\" data-element_type=\"column\" data-e-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-c0ce474 elementor-widget elementor-widget-html\" data-id=\"c0ce474\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"es\">\r\n<head>\r\n    <meta charset=\"UTF-8\">\r\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n    <title>Ahorro Infantil | Ahorro<\/title>\r\n    \r\n    <style>\r\n        #ahorro-infantil,\r\n        #ahorro-infantil *,\r\n        #ahorro-infantil *::before,\r\n        #ahorro-infantil *::after {\r\n            box-sizing: border-box;\r\n            margin: 0;\r\n            padding: 0;\r\n        }\r\n\r\n        #ahorro-infantil {\r\n            --surface: #ffffff;\r\n            --text-primary: #1a1a1a;\r\n            --text-secondary: #5f6b7a;\r\n            --text-muted: #8a94a3;\r\n            --border: rgba(0, 0, 0, 0.06);\r\n            --border-light: rgba(0, 0, 0, 0.04);\r\n            --accent: #0b734d;\r\n            --accent-soft: rgba(11, 115, 77, 0.04);\r\n            \r\n            --shadow-card: \r\n                0 1px 3px rgba(0,0,0,0.03),\r\n                0 8px 24px rgba(0,0,0,0.04);\r\n            --shadow-hover: \r\n                0 4px 8px rgba(0,0,0,0.05),\r\n                0 16px 32px rgba(11, 115, 77, 0.06);\r\n            --shadow-pressed: \r\n                0 1px 2px rgba(0,0,0,0.04),\r\n                0 2px 4px rgba(0,0,0,0.04);\r\n            \r\n            --radius-sm: 10px;\r\n            --radius-md: 16px;\r\n            --radius-lg: 20px;\r\n            \r\n            --transition-smooth: 0.25s cubic-bezier(0.2, 0.0, 0, 1.0);\r\n            \r\n            font-family: 'Inter', system-ui, -apple-system, sans-serif;\r\n            line-height: 1.5;\r\n            -webkit-font-smoothing: antialiased;\r\n            -moz-osx-font-smoothing: grayscale;\r\n            \r\n            background: #ffffff;\r\n            color: var(--text-primary);\r\n            width: 100%;\r\n            max-width: 100%;\r\n            padding: 0;\r\n            margin: 0;\r\n        }\r\n\r\n        #ahorro-infantil .container {\r\n            max-width: 100%;\r\n            width: 100%;\r\n            margin: 0;\r\n            padding: 0;\r\n        }\r\n\r\n        #ahorro-infantil .hero {\r\n            text-align: left;\r\n            margin-bottom: 24px;\r\n            padding: 0 4px;\r\n            background: transparent;\r\n            border: none;\r\n            box-shadow: none;\r\n        }\r\n\r\n        #ahorro-infantil .hero-label {\r\n            font-size: 0.65rem;\r\n            font-weight: 600;\r\n            text-transform: uppercase;\r\n            letter-spacing: 2px;\r\n            color: var(--accent);\r\n            margin-bottom: 8px;\r\n            display: block;\r\n        }\r\n\r\n        #ahorro-infantil .hero h1 {\r\n            font-size: 1.8rem;\r\n            font-weight: 400;\r\n            letter-spacing: -1px;\r\n            color: var(--text-primary);\r\n            line-height: 1.1;\r\n        }\r\n\r\n        #ahorro-infantil .hero h1 strong {\r\n            font-weight: 600;\r\n            color: var(--accent);\r\n        }\r\n\r\n        #ahorro-infantil .hero p {\r\n            font-size: 0.9rem;\r\n            color: var(--text-secondary);\r\n            font-weight: 400;\r\n            line-height: 1.5;\r\n            margin-top: 6px;\r\n        }\r\n\r\n        #ahorro-infantil .hero-divider {\r\n            width: 40px;\r\n            height: 3px;\r\n            background-color: var(--accent);\r\n            margin-top: 14px;\r\n            border-radius: 2px;\r\n            opacity: 0.6;\r\n        }\r\n\r\n        \/* ===== LAYOUT DOBLE COLUMNA ===== *\/\r\n        #ahorro-infantil .split-layout {\r\n            display: grid;\r\n            grid-template-columns: 1fr 1fr;\r\n            gap: 20px;\r\n            align-items: start;\r\n        }\r\n\r\n        #ahorro-infantil .image-panel {\r\n            position: sticky;\r\n            top: 20px;\r\n        }\r\n\r\n        #ahorro-infantil .image-container {\r\n            background: var(--surface);\r\n            border-radius: var(--radius-lg);\r\n            overflow: hidden;\r\n            box-shadow: var(--shadow-card);\r\n            border: 1px solid var(--border);\r\n            aspect-ratio: 4 \/ 3;\r\n            display: flex;\r\n            align-items: center;\r\n            justify-content: center;\r\n            background: #fafbfa;\r\n        }\r\n\r\n        #ahorro-infantil .image-container img {\r\n            width: 100%;\r\n            height: 100%;\r\n            object-fit: contain;\r\n            display: block;\r\n            padding: 12px;\r\n        }\r\n\r\n        \/* ===== TARJETA DIN\u00c1MICA ===== *\/\r\n        #ahorro-infantil .card {\r\n            background: var(--surface);\r\n            border-radius: var(--radius-lg);\r\n            display: flex;\r\n            flex-direction: column;\r\n            box-shadow: var(--shadow-card);\r\n            border: 1px solid var(--border);\r\n            transition: all var(--transition-smooth);\r\n            transform: translateY(0);\r\n            position: relative;\r\n            overflow: hidden;\r\n            outline: none;\r\n            cursor: pointer;\r\n            -webkit-tap-highlight-color: transparent;\r\n        }\r\n\r\n        #ahorro-infantil .card:focus,\r\n        #ahorro-infantil .card:focus-visible,\r\n        #ahorro-infantil .card:active,\r\n        #ahorro-infantil .card:focus-within {\r\n            outline: none;\r\n            box-shadow: var(--shadow-pressed);\r\n            background-color: #fafbfa;\r\n        }\r\n\r\n        #ahorro-infantil .card::before {\r\n            content: '';\r\n            position: absolute;\r\n            top: 0;\r\n            left: 0;\r\n            right: 0;\r\n            height: 3px;\r\n            background: var(--accent);\r\n            transform: scaleX(0);\r\n            transform-origin: left;\r\n            transition: transform 0.4s cubic-bezier(0.2, 0.0, 0, 1.0);\r\n            border-radius: 0 0 2px 0;\r\n            z-index: 2;\r\n        }\r\n\r\n        #ahorro-infantil .card:hover::before {\r\n            transform: scaleX(1);\r\n        }\r\n\r\n        #ahorro-infantil .card:hover {\r\n            transform: translateY(-4px);\r\n            box-shadow: var(--shadow-hover);\r\n            border-color: transparent;\r\n            z-index: 2;\r\n        }\r\n\r\n        #ahorro-infantil .card:active {\r\n            transform: translateY(0px) scale(0.995);\r\n            box-shadow: var(--shadow-pressed);\r\n            background-color: #fafbfa;\r\n            transition: all 0.05s ease;\r\n        }\r\n\r\n        @media (max-width: 768px) {\r\n            #ahorro-infantil .card:hover {\r\n                transform: none;\r\n                box-shadow: var(--shadow-card);\r\n            }\r\n            #ahorro-infantil .card::before {\r\n                transform: scaleX(0);\r\n            }\r\n            #ahorro-infantil .card:active {\r\n                transform: scale(0.985);\r\n                background-color: #f5f5f5;\r\n            }\r\n        }\r\n\r\n        #ahorro-infantil .card-body {\r\n            padding: 28px 28px;\r\n            display: flex;\r\n            flex-direction: column;\r\n        }\r\n\r\n        #ahorro-infantil .card-header {\r\n            display: flex;\r\n            align-items: flex-start;\r\n            justify-content: space-between;\r\n            margin-bottom: 8px;\r\n            gap: 10px;\r\n        }\r\n\r\n        #ahorro-infantil .card-title-group {\r\n            display: flex;\r\n            flex-direction: column;\r\n        }\r\n\r\n        #ahorro-infantil .card-badge {\r\n            font-size: 0.65rem;\r\n            font-weight: 600;\r\n            text-transform: uppercase;\r\n            letter-spacing: 1.5px;\r\n            color: var(--accent);\r\n            opacity: 0.7;\r\n            margin-bottom: 4px;\r\n            transition: opacity 0.3s ease;\r\n        }\r\n\r\n        #ahorro-infantil .card:hover .card-badge {\r\n            opacity: 1;\r\n        }\r\n\r\n        #ahorro-infantil .card-title {\r\n            font-size: 1.4rem;\r\n            font-weight: 600;\r\n            color: var(--text-primary);\r\n            letter-spacing: -0.3px;\r\n            line-height: 1.2;\r\n        }\r\n\r\n        #ahorro-infantil .card-number {\r\n            font-size: 0.65rem;\r\n            font-weight: 600;\r\n            color: var(--accent);\r\n            opacity: 0.4;\r\n            letter-spacing: 1px;\r\n            font-feature-settings: \"tnum\";\r\n            transition: opacity 0.3s ease;\r\n        }\r\n\r\n        #ahorro-infantil .card:hover .card-number {\r\n            opacity: 0.8;\r\n        }\r\n\r\n        #ahorro-infantil .card-subtitle {\r\n            font-size: 0.85rem;\r\n            color: var(--text-secondary);\r\n            margin-bottom: 20px;\r\n            line-height: 1.5;\r\n            font-weight: 400;\r\n            transition: color 0.3s ease;\r\n        }\r\n\r\n        #ahorro-infantil .card:hover .card-subtitle {\r\n            color: #4a5a50;\r\n        }\r\n\r\n        #ahorro-infantil .features-grid {\r\n            display: grid;\r\n            grid-template-columns: 1fr 1fr;\r\n            gap: 1px;\r\n            border: 1px solid var(--border-light);\r\n            border-radius: var(--radius-md);\r\n            overflow: hidden;\r\n            transition: border-color 0.3s ease;\r\n        }\r\n\r\n        #ahorro-infantil .card:hover .features-grid {\r\n            border-color: rgba(11, 115, 77, 0.15);\r\n        }\r\n\r\n        #ahorro-infantil .feature-item {\r\n            font-size: 0.82rem;\r\n            color: var(--text-secondary);\r\n            font-weight: 450;\r\n            line-height: 1.5;\r\n            padding: 14px 16px 14px 22px;\r\n            background: #fafbfa;\r\n            transition: color 0.2s ease, transform 0.2s ease;\r\n            position: relative;\r\n        }\r\n\r\n        #ahorro-infantil .card:hover .feature-item {\r\n            color: #3a4a40;\r\n            transform: translateX(2px);\r\n        }\r\n\r\n        #ahorro-infantil .feature-item::before {\r\n            content: '';\r\n            position: absolute;\r\n            left: 10px;\r\n            top: 19px;\r\n            width: 4px;\r\n            height: 4px;\r\n            border-radius: 50%;\r\n            background: var(--accent);\r\n            opacity: 0;\r\n            transition: opacity 0.3s ease, transform 0.3s ease;\r\n            transform: scale(0);\r\n        }\r\n\r\n        #ahorro-infantil .card:hover .feature-item::before {\r\n            opacity: 0.5;\r\n            transform: scale(1);\r\n        }\r\n\r\n        @media (max-width: 768px) {\r\n            #ahorro-infantil .split-layout {\r\n                grid-template-columns: 1fr;\r\n                gap: 16px;\r\n            }\r\n\r\n            #ahorro-infantil .image-panel {\r\n                position: static;\r\n            }\r\n\r\n            #ahorro-infantil .image-container {\r\n                aspect-ratio: 4 \/ 3;\r\n                max-height: 300px;\r\n            }\r\n\r\n            #ahorro-infantil .hero h1 {\r\n                font-size: 1.5rem;\r\n            }\r\n\r\n            #ahorro-infantil .card-body {\r\n                padding: 22px 18px;\r\n            }\r\n\r\n            #ahorro-infantil .card-title {\r\n                font-size: 1.2rem;\r\n            }\r\n\r\n            #ahorro-infantil .features-grid {\r\n                grid-template-columns: 1fr;\r\n            }\r\n\r\n            #ahorro-infantil .feature-item {\r\n                padding-left: 18px;\r\n            }\r\n        }\r\n    <\/style>\r\n<\/head>\r\n<body>\r\n\r\n    <div id=\"ahorro-infantil\">\r\n\r\n        <main class=\"container\">\r\n\r\n            <header class=\"hero\">\r\n                <span class=\"hero-label\">Futuro Seguro<\/span>\r\n                <h1><strong>Ahorro Infantil<\/strong><\/h1>\r\n                <p>El primer paso al \u00e9xito: constru\u00ed un futuro s\u00f3lido para los m\u00e1s peque\u00f1os.<\/p>\r\n                <div class=\"hero-divider\"><\/div>\r\n            <\/header>\r\n\r\n            <div class=\"split-layout\">\r\n\r\n             <!-- COLUMNA IZQUIERDA: IMAGEN 4:3 -->\r\n                <aside class=\"image-panel\">\r\n                    <div class=\"image-container\">\r\n                        <img decoding=\"async\" src=\"https:\/\/ccsanalejo.com\/wp-content\/uploads\/2026\/07\/AHORRO-INFANTIL-1.png\" alt=\"Ahorro Programado\">\r\n                    <\/div>\r\n                <\/aside>\r\n                <!-- COLUMNA DERECHA: TARJETA DIN\u00c1MICA -->\r\n                <div class=\"card\">\r\n                    <div class=\"card-body\">\r\n                        <div class=\"card-header\">\r\n                            <div class=\"card-title-group\">\r\n                                <span class=\"card-badge\">Ahorro<\/span>\r\n                                <div class=\"card-title\">Ahorro Infantil<\/div>\r\n                            <\/div>\r\n                            <span class=\"card-number\">05<\/span>\r\n                        <\/div>\r\n\r\n                        <p class=\"card-subtitle\">Cre\u00e1 un fondo seguro para el menor con rentabilidad continua y convertite en socio de la Caja.<\/p>\r\n\r\n                        <div class=\"features-grid\">\r\n                            <div class=\"feature-item\">Crea un fondo seguro para el menor<\/div>\r\n                            <div class=\"feature-item\">Rentabilidad continua de los ahorros<\/div>\r\n                            <div class=\"feature-item\">Intereses sobre saldos diarios capitalizables<\/div>\r\n                            <div class=\"feature-item\">Te conviertes en socio integrante de la Caja<\/div>\r\n                        <\/div>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n            <\/div>\r\n\r\n        <\/main>\r\n\r\n    <\/div>\r\n\r\n<\/body>\r\n<\/html>\t\t\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>Crece Mujer | Ahorro Cuenta Especializada Crece Mujer Impulsando tus finanzas con beneficios dise\u00f1ados exclusivamente para la mujer. Ahorro Crece Mujer 01 Beneficios dise\u00f1ados exclusivamente para [&hellip;]<\/p>\n","protected":false},"author":3,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"page-templates\/page_front-page.php","meta":{"footnotes":""},"class_list":["post-1058","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/ccsanalejo.com\/index.php?rest_route=\/wp\/v2\/pages\/1058","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ccsanalejo.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/ccsanalejo.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/ccsanalejo.com\/index.php?rest_route=\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/ccsanalejo.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1058"}],"version-history":[{"count":78,"href":"https:\/\/ccsanalejo.com\/index.php?rest_route=\/wp\/v2\/pages\/1058\/revisions"}],"predecessor-version":[{"id":7449,"href":"https:\/\/ccsanalejo.com\/index.php?rest_route=\/wp\/v2\/pages\/1058\/revisions\/7449"}],"wp:attachment":[{"href":"https:\/\/ccsanalejo.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1058"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}