{"id":941,"date":"2026-08-25T00:28:32","date_gmt":"2026-08-25T03:28:32","guid":{"rendered":"https:\/\/chispabiz.online\/?page_id=941"},"modified":"2026-08-25T00:28:32","modified_gmt":"2026-08-25T03:28:32","slug":"catalogo","status":"publish","type":"page","link":"https:\/\/chispabiz.online\/?page_id=941","title":{"rendered":"Cat\u00e1logo de Productos"},"content":{"rendered":"<div class=\"svi-shortcode\" style=\"--c-bg:#ffffff;--c-card:#ffffff;--c-border:#e8e2d3;--c-text:#000000;--c-head:#000000;--c-muted:#6b7280;--c-accent:#d4af37;--c-accent-hover:#b8962e;--c-primary:#d4af37;--c-primary-hover:#b8962e;--c-good:#22c55e;--c-bad:#ef4444;background:var(--c-bg);color:var(--c-text);font-family:-apple-system,BlinkMacSystemFont,\\\\\"Segoe UI\\\\\",Roboto,Helvetica,Arial,sans-serif;min-height:80vh;padding:24px 0;box-sizing:border-box;\"><style>:root{\n            --c-bg:#ffffff;--c-card:#ffffff;--c-border:#e8e2d3;--c-text:#000000;\n            --c-head:#000000;--c-muted:#6b7280;--c-accent:<?php echo esc_attr($svi_c1); ?>;--c-accent-2:<?php echo esc_attr($svi_c2); ?>;--c-accent-3:<?php echo esc_attr($svi_c3); ?>;--c-accent-hover:color-mix(in srgb,var(--c-accent) 85%,#000);\n            --c-primary:var(--c-accent);--c-primary-hover:var(--c-accent-hover);--c-good:#22c55e;--c-bad:#ef4444;\n        }\n        \/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n           DESIGN SYSTEM cb- SUBSET FOR THE PUBLIC SITE\n           Comparte el vocabulario visual con la app (cb-design-system.css):\n           tokens + tarjetas, botones, badges, tablas, inputs y t\u00edtulos.\n           Clases con prefijo cb- \u2192 no colisionan con .btn\/.p-card\/.chip\/.tag del sitio.\n           ================================================================ *\/\n        .cb-root{--cb-gold:var(--c-accent);--cb-gold-hover:var(--c-accent-3);--cb-dark:#111111;--cb-dark-2:#1f1f1f;--cb-bg:#f1f1f3;--cb-border:#e5e7eb;--cb-rowborder:#f4f4f5;--cb-head:#111111;--cb-body:#1f1f1f;--cb-muted:#6b7280;--cb-faint:#9ca3af;--cb-green:#16a34a;--cb-red:#dc2626;--cb-amber:var(--c-accent-3);--cb-blue:var(--c-accent-3);--cb-radius:14px}\n        \/* \u2500\u2500 Tarjeta \u2500\u2500 *\/\n        .cb-card{background:#ffffff;border:1px solid var(--cb-border,#e5e7eb);border-radius:var(--cb-radius,14px);box-shadow:0 1px 3px rgba(0,0,0,.03);overflow:hidden;margin-bottom:20px}\n        .cb-card-head{display:flex;align-items:center;gap:10px;padding:16px 22px;border-bottom:1px solid var(--cb-border,#e5e7eb);background:#ffffff}\n        .cb-card-title{margin:0;font-size:15px;font-weight:800;color:var(--cb-head,#111111);display:inline-flex;align-items:center;gap:9px}\n        .cb-card-title .cb-ico{color:var(--cb-gold,var(--c-accent));display:inline-flex}\n        .cb-card-body{padding:22px;background:#ffffff}\n        .cb-card-body--tint{background:#fafafa}\n        .cb-card--hero{background:linear-gradient(135deg,#111111,#1a1a1a);border:1px solid #1a1a1a;color:#e5e7eb}\n        .cb-card--hero .cb-card-title{color:#ffffff}\n        .cb-card--hero .cb-gold-text{color:var(--cb-gold,var(--c-accent))}\n        .cb-card--hero .cb-muted-text{color:#9ca3af}\n        \/* \u2500\u2500 Botones \u2500\u2500 *\/\n        .cb-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 18px;border-radius:8px;border:1px solid transparent;font-size:13.5px;font-weight:700;line-height:1.2;cursor:pointer;text-decoration:none;transition:all .2s ease;white-space:nowrap;font-family:inherit}\n        .cb-btn:disabled{opacity:.55;cursor:not-allowed}\n        .cb-btn-primary{background:var(--cb-gold,var(--c-accent));color:#111111;box-shadow:0 1px 3px rgba(212,175,55,.35)}\n        .cb-btn-primary:hover:not(:disabled){background:var(--cb-gold-hover,var(--c-accent-3));transform:translateY(-1px);box-shadow:0 4px 12px rgba(212,175,55,.4)}\n        .cb-btn-dark{background:var(--cb-dark,#111111);color:#ffffff;box-shadow:0 1px 3px rgba(17,17,17,.2)}\n        .cb-btn-dark:hover:not(:disabled){background:var(--cb-dark-2,#1f1f1f);transform:translateY(-1px)}\n        .cb-btn-ghost{background:#ffffff;color:#374151;border-color:#d1d5db}\n        .cb-btn-ghost:hover:not(:disabled){background:#fafafa;border-color:#9ca3af}\n        .cb-btn-danger{background:#fef2f2;color:var(--cb-red,#dc2626);border-color:#fecaca}\n        .cb-btn-danger:hover:not(:disabled){background:#fee2e2}\n        .cb-btn-sm{padding:7px 13px;font-size:12px;border-radius:7px}\n        .cb-btn-block{width:100%}\n        \/* \u2500\u2500 Inputs \/ selects \/ textarea \u2500\u2500 *\/\n        .cb-input,.cb-select,.cb-textarea{width:100%;background:#ffffff;border:1px solid #d1d5db;color:#111111;padding:10px 14px;border-radius:8px;font-family:inherit;font-size:14px;box-sizing:border-box;box-shadow:0 1px 2px rgba(0,0,0,.02);transition:border-color .2s,box-shadow .2s}\n        .cb-input:focus,.cb-select:focus,.cb-textarea:focus{outline:none;border-color:var(--cb-gold,var(--c-accent));box-shadow:0 0 0 2px rgba(212,175,55,.2)}\n        .cb-form-group{margin-bottom:18px}\n        .cb-label{display:block;color:#374151;font-weight:700;margin-bottom:6px;font-size:13px}\n        .cb-hint{font-size:12px;color:var(--cb-faint,#9ca3af);margin-top:5px}\n        .cb-form-row{display:flex;gap:18px;flex-wrap:wrap}\n        .cb-form-row .cb-form-group{flex:1;min-width:220px}\n        \/* \u2500\u2500 Badges \/ estados (p\u00edldoras 999px con fondos suaves) \u2500\u2500 *\/\n        .cb-badge{display:inline-block;padding:5px 12px;border-radius:999px;font-size:12px;font-weight:700;letter-spacing:.2px;white-space:nowrap}\n        .cb-badge-green{background:rgba(22,163,74,.14);color:#16a34a}\n        .cb-badge-red{background:rgba(220,38,38,.13);color:#dc2626}\n        .cb-badge-amber{background:rgba(240,173,78,.18);color:#8a6d1f}\n        .cb-badge-blue{background:rgba(212,175,55,.12);color:var(--c-accent-3)}\n        .cb-badge-gray{background:rgba(156,163,175,.16);color:#6b7280}\n        .cb-badge-gold{background:rgba(212,175,55,.18);color:#8a6d1f}\n        .cb-badge-solid-green{background:#16a34a;color:#ffffff}\n        .cb-badge-solid-red{background:#dc2626;color:#ffffff}\n        \/* \u2500\u2500 Tablas con scroll t\u00e1ctil \u2500\u2500 *\/\n        .cb-table-wrap{background:#ffffff;border:1px solid var(--cb-border,#e5e7eb);border-radius:var(--cb-radius,14px);overflow-x:auto !important;-webkit-overflow-scrolling:touch;box-shadow:0 1px 3px rgba(0,0,0,.03);margin-bottom:20px}\n        .cb-table-wrap::-webkit-scrollbar{height:6px;display:block !important}\n        .cb-table-wrap::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:4px}\n        .cb-table{width:100%;border-collapse:collapse;font-size:13px;min-width:640px}\n        .cb-table th{background:#fafafa;color:var(--cb-muted,#6b7280);text-align:left;padding:11px 14px;font-weight:700;text-transform:uppercase;font-size:11px;letter-spacing:.5px;white-space:nowrap;border-bottom:1px solid var(--cb-border,#e5e7eb)}\n        .cb-table td{padding:12px 14px;border-top:1px solid var(--cb-rowborder,#f4f4f5);color:var(--cb-body,#1f1f1f);vertical-align:middle}\n        .cb-table tbody tr:hover td{background:#fafafa}\n        \/* \u2500\u2500 Estados vac\u00edos \/ t\u00edtulos \u2500\u2500 *\/\n        .cb-empty{text-align:center;color:var(--cb-faint,#9ca3af);padding:48px 24px;font-size:14px}\n        .cb-title{font-size:17px;font-weight:800;color:var(--cb-head,#111111);margin:0 0 6px;display:flex;align-items:center;gap:9px}\n        .cb-title .cb-ico{color:var(--cb-gold,var(--c-accent));display:inline-flex}\n        .cb-sub{color:var(--cb-muted,#6b7280);font-size:13px;margin:0 0 20px}\n        .cb-section-title{font-size:15px;font-weight:800;color:var(--cb-head,#111111);display:flex;align-items:center;gap:9px;margin:26px 0 14px}\n        .cb-section-title .cb-ico{color:var(--cb-gold,var(--c-accent));display:inline-flex}\n        \/* \u2500\u2500 Texto \/ divisores \/ grids \u2500\u2500 *\/\n        .cb-gold-text{color:var(--cb-gold,var(--c-accent)) !important}\n        .cb-muted-text{color:var(--cb-muted,#6b7280) !important}\n        .cb-divider{border-top:1px solid var(--cb-border,#e5e7eb);margin:18px 0}\n        .cb-grid{display:grid;gap:18px}\n        .cb-grid-2{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}\n        \/* Mobile: el design-system nunca desborda el viewport *\/\n        @media (max-width:600px){.cb-form-row{flex-direction:column}.cb-card-body{padding:16px}.cb-grid-2{grid-template-columns:1fr}}\n        \/* \u2550\u2550 \/FIN DESIGN SYSTEM cb- SUBSET \u2550\u2550 *\/\n        html, body, button, input, select, textarea, h1, h2, h3, h4, h5, h6, .container, .hero, details, summary {\n            font-family: 'Inter', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, sans-serif !important;\n        }\n        html,body{margin:0!important;padding:0!important;width:100%!important;max-width:100vw!important;\n            background-color:var(--c-bg)!important;color:var(--c-text);\n            overflow-x:hidden!important;-webkit-font-smoothing:antialiased;}\n        *,*::before,*::after{box-sizing:border-box}\n        img,svg{max-width:100%;height:auto}\n        iframe,video{max-width:100%}\n        a{color:var(--c-primary);text-decoration:none}\n        a:hover{color:var(--c-primary-hover)}\n        \/* \u2500\u2500 BADGES CENTRALIZADOS \u2500\u2500 *\/\n        .svi-badge-oferta{background-color:#dc2626!important;color:#fff!important;font-weight:800;font-size:12px;letter-spacing:.5px;padding:6px 14px;border-radius:999px;display:inline-block}\n        .svi-badge-destacado{background-color:var(--c-accent-3)!important;color:#fff!important;font-weight:800;font-size:12px;letter-spacing:.5px;padding:6px 14px;border-radius:999px;display:inline-block}\n        .wrap{width:100vw!important;max-width:100vw!important;min-height:100vh!important;\n            position:relative!important;left:50%!important;right:50%!important;\n            margin-left:-50vw!important;margin-right:-50vw!important;box-sizing:border-box!important;\n            display:flex;flex-direction:column;}\n        body.admin-bar .wrap{padding-top:32px!important}\n        @media screen and (max-width:782px){body.admin-bar .wrap{padding-top:46px!important}}\n        .container{width:100%;max-width:1180px;margin:0 auto;padding:0 12px;flex:1}\n        \/* HEADER *\/\n        .site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);\n            backdrop-filter:blur(12px);border-bottom:1px solid var(--c-border)}\n        .site-header .inner{display:flex;align-items:center;justify-content:space-between;height:68px;gap:16px}\n        .brand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:20px;color:var(--c-head)}\n        .brand .logo{width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,var(--c-primary),var(--c-accent));\n            display:flex;align-items:center;justify-content:center;color:#000;font-size:18px;font-weight:900}\n        .site-nav{display:flex;align-items:center;gap:22px}\n        .site-nav a{color:var(--c-text);font-weight:600;font-size:15px;transition:color .15s}\n        .site-nav a:hover{color:var(--c-head)}\n        .site-nav .cta{background:var(--c-accent);color:#000!important;padding:9px 16px;border-radius:10px;font-weight:700}\n        .site-nav .cta:hover{background:var(--c-accent-hover)}\n        .menu-toggle{display:none;background:none;border:1px solid var(--c-border);border-radius:8px;color:var(--c-head);padding:10px 14px;cursor:pointer;font-size:24px;line-height:1;font-family:inherit}\n        \/* HERO \u2014 secciones de contraste dorado\/negro (dise\u00f1o Chispabiz) *\/\n        .hero{position:relative;text-align:center;padding:84px 0 72px;background:radial-gradient(1100px 480px at 20% -10%,color-mix(in srgb,var(--c-accent) 22%,transparent),transparent 60%),radial-gradient(900px 420px at 85% -10%,color-mix(in srgb,var(--c-accent) 14%,transparent),transparent 55%),linear-gradient(160deg,#0a0a0a 0%,#111111 55%,#1a1a1a 100%);border-bottom:1px solid color-mix(in srgb,var(--c-accent) 35%,transparent)}\n        .hero h1{font-size:clamp(32px,5vw,54px);line-height:1.08;color:#ffffff;margin:0 0 18px;font-weight:800;letter-spacing:-1px}\n        .hero h1 span{background:linear-gradient(90deg,var(--c-accent-2),var(--c-accent));-webkit-background-clip:text;background-clip:text;color:transparent}\n        .hero p{font-size:clamp(16px,2vw,19px);color:#d4d4d4;max-width:680px;margin:0 auto;line-height:1.7}\n        .hero-btns{display:flex;gap:14px;justify-content:center;margin-top:30px;flex-wrap:wrap}\n        .btn{display:inline-block;padding:14px 26px;border-radius:12px;font-weight:700;font-size:16px;border:1px solid var(--c-border);color:var(--c-head);background:var(--c-card);cursor:pointer;transition:.18s;text-align:center;white-space:nowrap}\n        .btn:hover{border-color:var(--c-accent)}\n        .btn-primary{border:none;background:linear-gradient(135deg,var(--c-accent-2),var(--c-accent));color:#111111;box-shadow:0 8px 22px color-mix(in srgb,var(--c-accent) 35%,transparent)}\n        .btn-primary:hover{border:none;background:linear-gradient(135deg,var(--c-accent),var(--c-accent-3));color:#111111;transform:translateY(-1px);box-shadow:0 12px 28px color-mix(in srgb,var(--c-accent) 45%,transparent)}\n        .btn-outline{background:transparent;color:var(--c-head);border:1.5px solid var(--c-accent)}\n        .btn-outline:hover{border-color:var(--c-accent-hover);color:var(--c-accent-hover)}\n        .hero .btn-outline{color:#ffffff;border-color:rgba(255,255,255,.8)}\n        .hero .btn-outline:hover{color:#ffffff;border-color:#ffffff;background:rgba(255,255,255,.1)}\n        \/* Variante clara para p\u00e1ginas internas (beneficios, FAQ, contacto) *\/\n        .hero--light{background:radial-gradient(1000px 420px at 20% -10%,color-mix(in srgb,var(--c-accent) 16%,transparent),transparent 60%),radial-gradient(900px 400px at 85% -10%,color-mix(in srgb,var(--c-accent) 10%,transparent),transparent 55%),linear-gradient(180deg,#fffef8 0%,#fdf6e2 100%);border-bottom:1px solid var(--c-border)}\n        .hero--light h1{color:var(--c-head)}\n        .hero--light h1 span{background:linear-gradient(90deg,var(--c-accent-3),var(--c-accent));-webkit-background-clip:text;background-clip:text;color:transparent}\n        .hero--light p{color:var(--c-muted)}\n        .hero--light .btn-outline{color:var(--c-head);border-color:var(--c-accent)}\n        .hero--light .btn-outline:hover{color:var(--c-accent-hover);border-color:var(--c-accent-hover)}\n        \/* GRID PRODUCTOS *\/\n        .section-title{font-size:26px;color:var(--c-head);font-weight:800;margin:48px 0 24px}\n        .section-title .sub{display:block;font-size:15px;color:var(--c-muted);font-weight:500;margin-top:6px}\n        .product-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;padding-bottom:48px}\n        @media(max-width:1100px){.product-grid{grid-template-columns:repeat(2,1fr)!important}}\n        @media(max-width:1023px){.product-grid{grid-template-columns:1fr!important}}\n        .p-card{background:var(--c-card);border:1px solid var(--c-border);border-radius:16px;overflow:hidden;display:flex;flex-direction:column;transition:.22s}\n        .p-card:hover{transform:translateY(-4px);border-color:var(--c-accent);box-shadow:0 12px 32px rgba(0,0,0,.12)}\n        .p-card img{width:100%;height:190px;object-fit:cover;display:block;background:linear-gradient(135deg,#f8f4e8,#efe4c8)}\n        .svi-cat-card,.svi-home-card{height:100%}\n        .svi-cat-card .p-card,.svi-home-card .p-card{height:100%}\n        .p-card .body{padding:18px;display:flex;flex-direction:column;flex:1;gap:10px}\n        .p-card .tags{display:flex;gap:6px;flex-wrap:wrap}\n        .tag{font-size:11px;font-weight:700;padding:4px 9px;border-radius:999px;background:rgba(212,175,55,.14);color:#8a6d1f;letter-spacing:.3px}\n        .p-card h3{color:var(--c-head);font-size:18px;margin:0}\n        .p-card .p-desc{color:var(--c-muted);font-size:14px;margin:0;flex:1}\n        .p-price{display:flex;align-items:baseline;gap:10px}\n        .p-price .now{font-size:24px;font-weight:800;color:var(--c-head)}\n        .p-price .was{color:var(--c-muted);text-decoration:line-through;font-size:15px}\n        .p-card .btn-sm{display:block;text-align:center;background:var(--c-primary);color:#000;padding:12px;border-radius:10px;font-weight:700;font-size:15px}\n        .p-card .btn-sm:hover{background:var(--c-primary-hover);color:#000}\n        \/* C\u00c1TEGOR\u00cdA \/ FILTROS *\/\n        .chip-row{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:28px}\n        .chip{padding:9px 16px;border-radius:999px;border:1px solid var(--c-border);background:var(--c-card);color:var(--c-text);cursor:pointer;font-weight:600;font-size:14px;transition:.15s}\n        .chip.active,.chip:hover{background:var(--c-primary);border-color:var(--c-primary);color:#000}\n        \/* FOOTER *\/\n        .site-footer,.site-footer *,.site-footer::before{border-color:#27272a!important}\n        .site-footer{border-top:1px solid #27272a!important;margin-top:auto!important;padding:36px 0 24px!important;background:#000!important;color:#9ca3af!important}\n        .site-footer .grid{display:grid!important;grid-template-columns:2fr 1fr 1fr!important;gap:28px!important;padding-bottom:26px!important}\n        .site-footer h4{color:#fafafa!important;margin:0 0 12px!important;font-size:16px!important}\n        .site-footer ul{list-style:none!important;margin:0!important;padding:0!important;display:flex!important;flex-direction:column!important;gap:9px!important}\n        .site-footer li a,.site-footer p{color:#9ca3af!important;font-size:14px!important}\n        .site-footer li a:hover{color:var(--c-accent)!important}\n        .site-footer .disclaimer,.disclaimer{font-size:12px!important;color:#9ca3af!important;border-top:1px solid #27272a!important;padding-top:22px!important;margin-top:6px!important;line-height:1.6!important;background:#000!important}\n        @media(max-width:860px){\n            .site-nav{display:none;position:absolute;top:68px;left:0;right:0;background:var(--c-bg);flex-direction:column;align-items:flex-end!important;text-align:right!important;padding:18px 24px;border-bottom:1px solid var(--c-border)}\n            .site-nav.open{display:flex}\n            .menu-toggle{display:block}\n            .site-footer .grid{grid-template-columns:1fr}\n        }\n        .entry-content,.site-content,.content-area,main{max-width:100%!important;padding:0!important;margin:0!important}\n        \/* Asegurar padding lateral interno en todas las secciones del sitio (nunca pegado a las orillas) *\/\n        main > .container,\n        main .container,\n        main > section,\n        main section,\n        .svi-detail-grid,\n        .hero,\n        .product-grid,\n        .site-content,\n        .content-area,\n        .entry-content {\n            box-sizing: border-box !important;\n        }\n        @media (max-width: 1024px) {\n            main > .container, main .container { padding-left: 12px !important; padding-right: 12px !important; }\n            main > section, main section { padding-left: 0 !important; padding-right: 0 !important; }\n        }\n        @media (max-width: 600px) {\n            main > .container, main .container { padding-left: 12px !important; padding-right: 12px !important; }\n            main > section, main section { padding-left: 0 !important; padding-right: 0 !important; }\n            main .hero { padding-left: 0 !important; padding-right: 0 !important; }\n        }\n        \/* Renderizado WYSIWYG limpio 1:1 (Lienzo libre de vi\u00f1etas dobles) *\/\n        .product-includes ul, .product-includes ol, .svi-wysiwyg-content ul, .svi-wysiwyg-content ol { list-style: none !important; padding-left: 0 !important; margin: 14px 0; color: #1a1a1a; }\n        .product-includes li, .svi-wysiwyg-content li { list-style: none !important; padding-left: 0 !important; margin-bottom: 8px; color: #1a1a1a; line-height: 1.65; }\n        .product-includes p, .svi-wysiwyg-content p { margin: 0 0 2px; color: #1a1a1a; line-height: 1.6; }\n        \/* Tablas en contenido WYSIWYG: desplazamiento horizontal en m\u00f3vil (nunca desbordan) *\/\n        .svi-wysiwyg-content table, .product-includes table, .svi-detail-body table, .entry-content table {\n            display:block;width:100%;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;\n        }\n        .svi-wysiwyg-content pre, .product-includes pre, .entry-content pre { white-space:pre-wrap;word-break:break-word; }\n        .svi-wysiwyg-content h1, .svi-wysiwyg-content h2, .svi-wysiwyg-content h3, .svi-wysiwyg-content h4 { color: #111111; font-weight: 800; margin: 20px 0 10px; }\n        .svi-wysiwyg-content strong { color: #111111; font-weight: 700; }\n        .product-includes ul li::before, .product-includes ol li::before,\n        .svi-wysiwyg-content ul li::before, .svi-wysiwyg-content ol li::before,\n        .svi-wysiwyg-content ul li::after, .svi-wysiwyg-content ol li::after { content: none !important; }\n\n        \/* ============================================================\n           RESPONSIVIDAD TOTAL DEL SITIO P\u00daBLICO (cualquier dispositivo)\n           Fuerza a 1 columna los grids internos y evita desbordes\n           ============================================================ *\/\n        .container { padding: 0 24px; }\n        img, video, iframe { max-width: 100% !important; height: auto; }\n\n        \/* Tablet \/ laptop peque\u00f1a *\/\n        @media (max-width: 1024px) {\n            .container { padding: 0 12px; }\n            .svi-detail-grid { grid-template-columns: 1fr !important; gap: 24px !important; }\n        }\n\n        \/* M\u00f3vil *\/\n        @media (max-width: 600px) {\n            .container { padding: 0 12px; }\n            .hero { padding: 44px 0 38px; }\n            .hero p { padding: 0 4px; }\n            .section-title { font-size: 22px; margin: 36px 0 18px; }\n            .btn { width: 100%; max-width: 100%; }\n            .hero-btns { gap: 10px; }\n            \/* Tarjeta de producto *\/\n            .p-card img { height: 160px; }\n            .p-card .body { padding: 16px 16px 18px; }\n            .p-card h3 { font-size: 17px; }\n            .p-card .p-desc { font-size: 13px; }\n            .p-price { flex-wrap: wrap; }\n            .p-price .now { font-size: 20px; }\n            \/* Textos y cajas: que respiren de los bordes *\/\n            .svi-wysiwyg-content, .product-includes, .svi-detail-body,\n            main p, main ul, main ol, main h1, main h2, main h3, main h4,\n            main .narrative, main .rich-text { padding-left: 2px; padding-right: 2px; }\n            \/* Footer *\/\n            .site-footer { padding: 28px 0 18px !important; }\n            .site-footer .grid { grid-template-columns: 1fr !important; gap: 22px !important; }\n            .site-footer .grid > div { padding-right: 0 !important; padding-left: 0 !important; }\n            .site-footer p, .site-footer li a { padding-right: 14px; }\n        }\n\n        \/* Fuerza a 1 columna cualquier grid inline con ancho m\u00ednimo grande en m\u00f3vil *\/\n        @media (max-width: 600px) {\n            [style*=\"grid-template-columns\"]:not(.product-grid):not(.site-footer .grid) {\n                grid-template-columns: 1fr !important;\n            }\n        }\n\n        \/* Men\u00fa m\u00f3vil m\u00e1s c\u00f3modo *\/\n        @media (max-width: 600px) {\n            .site-nav { top: 60px; padding: 14px 14px; }\n            .site-header .inner { height: 60px; }\n            .brand { font-size: 18px; }\n            .brand .logo { width: 30px; height: 30px; font-size: 16px; border-radius: 8px; }\n        }\n        \/* \u2550\u2550 DINAMISMO Y RELIEVES (dise\u00f1o Chispabiz) \u2550\u2550 *\/\n        html{scroll-behavior:smooth}\n        main [id]{scroll-margin-top:96px}\n        .svi-reveal{opacity:0;transform:translateY(26px);transition:opacity .65s ease,transform .65s ease;will-change:opacity,transform}\n        .svi-reveal.svi-in{opacity:1;transform:none}\n        @media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}.svi-reveal{opacity:1;transform:none;transition:none}}\n        \/* M\u00f3vil\/tablet: el contenido SIEMPRE visible (el observer puede no dispararse en pantallas peque\u00f1as) *\/\n        @media (max-width:767px){.svi-reveal{opacity:1!important;transform:none!important;transition:none!important}}\n        ::selection{background:color-mix(in srgb,var(--c-accent) 35%,transparent)}\n        :focus-visible{outline:2px solid var(--c-accent);outline-offset:2px}\n        input,select,textarea{accent-color:var(--c-accent)}\n        \/* \u2550\u2550 CONTENEDOR EST\u00c1NDAR UNIFICADO CON LA TIENDA (1180px \u00b7 24 desktop \/ 2 m\u00f3vil) \u2550\u2550 *\/\n        .chispabiz-container{width:100%;max-width:1180px;margin-left:auto;margin-right:auto;padding-left:24px;padding-right:24px}\n        \/* SECCIONES: el fondo SIEMPRE 100% de ancho (borde a borde); el ancho lo controla el contenedor interno *\/\n        .hero,.hero--light,.svi-tcea-hero,.svi-tcea-section,.svi-tcea-dark{width:100%;max-width:100%;margin-left:0;margin-right:0;box-sizing:border-box}\n        \/* M\u00f3vil: hero compacto y botones CTA a ancho completo *\/\n        @media(max-width:767px){.hero{padding:52px 0 44px}.hero-btns{flex-direction:column;gap:12px}.hero-btns .btn{width:100%!important}}\n        \/* M\u00f3vil: las cajas con padding inline 26px se compactan (16px 14px) para dar m\u00e1s espacio al texto *\/\n        @media(max-width:767px){div[style*=\"padding:26px\"]{padding:16px 14px!important}}\n        \/* Relieve en tarjetas y secciones *\/\n        .p-card{transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}\n        .p-card:hover{transform:translateY(-5px);border-color:var(--c-accent);box-shadow:0 24px 52px -16px rgba(0,0,0,.24)}\n        .section-title{letter-spacing:-.4px}\n        .section-title .sub{letter-spacing:0}<\/style><div class=\"container\" style=\"width:100%;max-width:1180px;margin:0 auto;padding:0 24px;\"><style>\n    \/* \u2550\u2550 CAT\u00c1LOGO \u00b7 filtro horizontal (buscador + selectores) \u2550\u2550 *\/\n    .svi-cat-filters{display:flex;gap:12px;align-items:center;flex-wrap:wrap;background:var(--c-card,#ffffff);border:1px solid var(--c-border,#e8e2d3);border-radius:16px;padding:14px;box-shadow:0 2px 8px rgba(0,0,0,.05);margin-bottom:20px}\n    .svi-cat-search{flex:1;min-width:230px;display:flex;align-items:center;gap:10px;background:#ffffff;border:1.5px solid var(--c-border,#e8e2d3);border-radius:12px;padding:4px 6px 4px 14px;transition:border-color .2s,box-shadow .2s}\n    .svi-cat-search:focus-within{border-color:var(--c-accent,#d4af37);box-shadow:0 0 0 3px color-mix(in srgb,var(--c-accent,#d4af37) 16%,transparent)}\n    .svi-cat-search .svi-cat-search-ico{font-size:17px;flex-shrink:0}\n    .svi-cat-search input{flex:1;min-width:0;border:none;outline:none;font-size:14.5px;font-family:inherit;color:#111111;background:transparent;padding:10px 0}\n    .svi-cat-search input::placeholder{color:#9ca3af}\n    .svi-cat-clear{background:transparent;border:none;color:var(--c-accent-hover,#b8962e);font-weight:700;font-size:12.5px;cursor:pointer;padding:8px 10px;white-space:nowrap;display:none}\n    .svi-cat-select{appearance:none;-webkit-appearance:none;-moz-appearance:none;background:#ffffff url(\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%238a6d1f' stroke-width='2' stroke-linecap='round'\/%3E%3C\/svg%3E\") no-repeat right 12px center;border:1.5px solid var(--c-border,#e8e2d3);border-radius:12px;padding:11px 32px 11px 14px;font-size:14px;font-weight:600;font-family:inherit;color:#111111;cursor:pointer;outline:none;max-width:100%;transition:border-color .2s}\n    .svi-cat-select:focus{border-color:var(--c-accent,#d4af37)}\n    @keyframes svi-spin{to{transform:rotate(360deg)}}\n    #svi-cat-grid.filtering{opacity:.4;transition:opacity .15s}\n    \/* Tarjetas: altura completa dentro del grid (sin display:contents, compatible con Safari m\u00f3vil) *\/\n    .svi-cat-card{height:100%}\n    .svi-cat-card .p-card{height:100%}\n    \/* Filtro horizontal en m\u00f3vil: buscador ancho y selectores flexibles *\/\n    @media(max-width:1023px){\n        .svi-cat-search{flex:1 1 100%}\n        .svi-cat-select{flex:1 1 100%}\n    }\n    @media(max-width:480px){\n        .svi-cat-filters{padding:10px;gap:8px}\n    }\n    @media(max-width:400px){\n        .svi-cat-select{font-size:13px;padding:10px 32px 10px 10px}\n    }\n<\/style>\n\n<!-- \u2550\u2550 HERO (claro, como el resto del sitio) \u2550\u2550 -->\n<section class=\"hero hero--light svi-reveal\" style=\"padding:56px 0 40px\">\n    <div class=\"container\">\n        <h1>Cat\u00e1logo de productos<\/h1>\n        <p>Explora todos nuestros programas digitales en un solo lugar: precios claros, ofertas activas y acceso inmediato tras la compra.<\/p>\n    <\/div>\n<\/section>\n\n<section class=\"svi-reveal\" style=\"padding-top:36px\">\n    <div class=\"container\">\n    <!-- \u2550\u2550\u2550 FILTRO HORIZONTAL: buscador + selectores \u2550\u2550\u2550 -->\n    <div class=\"svi-cat-filters\">\n        <div class=\"svi-cat-search\">\n            <span class=\"svi-cat-search-ico\">\ud83d\udd0d<\/span>\n            <input type=\"search\" id=\"svi-search\" placeholder=\"Buscar por t\u00edtulo, categor\u00eda, etiqueta\u2026\">\n            <button type=\"button\" id=\"svi-search-clear\" class=\"svi-cat-clear\">\u2715 Limpiar<\/button>\n        <\/div>\n        <select id=\"svi-cat-select\" class=\"svi-cat-select\" aria-label=\"Categor\u00eda\">\n            <option value=\"\">Todas las categor\u00edas<\/option>\n                            <option value=\"desarrollo-personal\">Desarrollo Personal<\/option>\n                            <option value=\"educacion\">Educaci\u00f3n<\/option>\n                            <option value=\"finanzas\">Finanzas<\/option>\n                            <option value=\"marketing\">Marketing<\/option>\n                            <option value=\"negocios\">Negocios<\/option>\n                            <option value=\"salud\">Salud<\/option>\n                            <option value=\"tecnologia\">Tecnolog\u00eda<\/option>\n                    <\/select>\n        <select id=\"svi-tipo-select\" class=\"svi-cat-select\" aria-label=\"Tipo de producto\">\n            <option value=\"\">Todos los productos<\/option>\n            <option value=\"destacados\">\u2605 Destacados<\/option>\n            <option value=\"ofertas\">\ud83d\udd25 Ofertas<\/option>\n        <\/select>\n        <select id=\"svi-orden-select\" class=\"svi-cat-select\" aria-label=\"Ordenar\">\n            <option value=\"\">Relevancia<\/option>\n            <option value=\"precio_asc\" >Precio: menor a mayor<\/option>\n            <option value=\"precio_desc\" >Precio: mayor a menor<\/option>\n        <\/select>\n    <\/div>\n\n    <!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 LOADING INDICATOR \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\n    <div id=\"svi-cat-loading\" style=\"display:none;text-align:center;padding:20px\">\n        <span style=\"display:inline-block;width:28px;height:28px;border:3px solid var(--c-border);border-top-color:var(--c-accent);border-radius:50%;animation:svi-spin .6s linear infinite\"><\/span>\n    <\/div>\n\n    <!-- Nota de moneda -->\n    <p style=\"color:var(--c-muted);font-size:12px;text-align:center;margin:0 0 20px\">Los precios se muestran en d\u00f3lares estadounidenses (US$). El cobro se realiza en tu moneda local seg\u00fan tu pa\u00eds en la pasarela de pago.<\/p>\n\n    <!-- \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 PRODUCT GRID \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 -->\n            <div id=\"svi-cat-empty\" style=\"text-align:center;padding:60px 0\">\n            <h2 style=\"color:var(--c-head)\">Sin resultados<\/h2>\n            <p style=\"color:var(--c-muted)\">No encontramos productos que coincidan con tu b\u00fasqueda.<\/p>\n            <a class=\"btn btn-primary\" href=\"https:\/\/chispabiz.online\/catalogo\/\">Ver cat\u00e1logo completo<\/a>\n        <\/div>\n        <\/div>\n<\/section>\n\n<script>\n(function () {\n    var grid    = document.getElementById('svi-cat-grid');\n    var empty   = document.getElementById('svi-cat-empty');\n    var loader  = document.getElementById('svi-cat-loading');\n    var search  = document.getElementById('svi-search');\n    var clearBtn = document.getElementById('svi-search-clear');\n    var catSel  = document.getElementById('svi-cat-select');\n    var tipoSel = document.getElementById('svi-tipo-select');\n    var ordenSel = document.getElementById('svi-orden-select');\n    if (!grid) return;\n\n    var cards = [].slice.call(grid.querySelectorAll('.svi-cat-card'));\n    var state = { q: '', cat: '', tab: '' };\n\n    function debounce(fn, ms) {\n        var timer;\n        return function () { clearTimeout(timer); timer = setTimeout(fn, ms); };\n    }\n    function showLoading() { if (loader) loader.style.display = 'block'; grid.classList.add('filtering'); }\n    function hideLoading() { if (loader) loader.style.display = 'none'; grid.classList.remove('filtering'); }\n\n    var applyFilters = debounce(function () {\n        var visible = 0;\n        var terms = state.q.toLowerCase().split(\/\\s+\/).filter(Boolean);\n        cards.forEach(function (card) {\n            var catMatch  = !state.cat || card.getAttribute('data-cat') === state.cat;\n            var tabMatch  = true;\n            if (state.tab === 'destacados') tabMatch = card.getAttribute('data-featured') === '1';\n            if (state.tab === 'ofertas')    tabMatch = card.getAttribute('data-offer') === '1';\n            var qMatch = true;\n            if (terms.length > 0) {\n                var haystack = card.getAttribute('data-search') || '';\n                qMatch = terms.every(function (t) { return haystack.indexOf(t) !== -1; });\n            }\n            var match = catMatch && tabMatch && qMatch;\n            card.style.display = match ? 'block' : 'none';\n            if (match) visible++;\n        });\n        if (empty) {\n            var msg = 'No hay productos con los filtros actuales.';\n            if (state.q) msg = 'No se encontraron productos relacionados con \"' + state.q + '\".';\n            empty.textContent = msg;\n            empty.style.display = visible === 0 ? 'block' : 'none';\n        }\n        if (clearBtn) clearBtn.style.display = state.q ? 'inline-block' : 'none';\n        hideLoading();\n    }, 150);\n\n    function updateURL() {\n        var url = new URL(window.location.href);\n        if (state.q)   url.searchParams.set('q', state.q);   else url.searchParams.delete('q');\n        if (state.cat) url.searchParams.set('categoria', state.cat); else url.searchParams.delete('categoria');\n        if (state.tab) url.searchParams.set('filtro', state.tab);     else url.searchParams.delete('filtro');\n        history.replaceState(null, '', url.toString());\n    }\n\n    function filter() {\n        showLoading();\n        if (catSel)  catSel.value  = state.cat;\n        if (tipoSel) tipoSel.value = state.tab;\n        updateURL();\n        applyFilters();\n    }\n\n    if (search) {\n        search.addEventListener('input', debounce(function () {\n            state.q = search.value.trim();\n            filter();\n        }, 200));\n    }\n    if (clearBtn) {\n        clearBtn.addEventListener('click', function () {\n            search.value = '';\n            state.q = '';\n            filter();\n        });\n    }\n    if (catSel) {\n        catSel.addEventListener('change', function () {\n            state.cat = catSel.value;\n            filter();\n        });\n    }\n    if (tipoSel) {\n        tipoSel.addEventListener('change', function () {\n            state.tab = tipoSel.value;\n            filter();\n        });\n    }\n    if (ordenSel) {\n        ordenSel.addEventListener('change', function () {\n            var url = new URL(window.location.href);\n            if (state.q)   url.searchParams.set('q', state.q);   else url.searchParams.delete('q');\n            if (state.cat) url.searchParams.set('categoria', state.cat); else url.searchParams.delete('categoria');\n            if (state.tab) url.searchParams.set('filtro', state.tab);     else url.searchParams.delete('filtro');\n            if (ordenSel.value) url.searchParams.set('orden', ordenSel.value); else url.searchParams.delete('orden');\n            window.location.href = url.toString();\n        });\n    }\n\n    \/\/ Init from URL params\n    var params = new URLSearchParams(window.location.search);\n    state.cat = params.get('categoria') || '';\n    state.tab = params.get('filtro') || '';\n    state.q   = params.get('q') || '';\n    if (state.q && search) search.value = state.q;\n    if (catSel) catSel.value = state.cat;\n    if (tipoSel) tipoSel.value = state.tab;\n    filter();\n})();\n<\/script>\n<\/div><\/div>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-941","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/chispabiz.online\/index.php?rest_route=\/wp\/v2\/pages\/941","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/chispabiz.online\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/chispabiz.online\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/chispabiz.online\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/chispabiz.online\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=941"}],"version-history":[{"count":0,"href":"https:\/\/chispabiz.online\/index.php?rest_route=\/wp\/v2\/pages\/941\/revisions"}],"wp:attachment":[{"href":"https:\/\/chispabiz.online\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=941"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}