{"id":13,"date":"2026-10-19T20:37:53","date_gmt":"2026-10-19T20:37:53","guid":{"rendered":"https:\/\/jisuseduar.cl\/?page_id=13"},"modified":"2026-10-19T20:38:43","modified_gmt":"2026-10-19T20:38:43","slug":"elementor-13","status":"publish","type":"page","link":"https:\/\/jisuseduar.cl\/?page_id=13","title":{"rendered":"Elementor #13"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"13\" class=\"elementor elementor-13\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-7fc872b e-con e-atomic-element e-flexbox-base e-default-div e-8e42021 \" data-id=\"7fc872b\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"7fc872b\" data-e-type=\"e-flexbox\" data-id=\"7fc872b\">\n    \t\t<div class=\"elementor-element elementor-element-f1317ff elementor-widget elementor-widget-html\" data-id=\"f1317ff\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t\r\n<!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\">\r\n\r\n  <title>Dise\u00f1o Web y Marketing Digital | Jisuseduar<\/title>\r\n  <meta name=\"description\"\r\n        content=\"Dise\u00f1o y desarrollo de sitios web profesionales para empresas y emprendedores. Mejora tu presencia digital con Jisuseduar.\">\r\n  <meta name=\"theme-color\" content=\"#101713\">\r\n\r\n  <!-- Reemplazar por la URL can\u00f3nica definitiva al publicar -->\r\n  <link rel=\"canonical\" href=\"https:\/\/jisuseduar.cl\/\">\r\n\r\n  <style>\r\n    :root {\r\n      --bg: #f7f7f2;\r\n      --ink: #17221b;\r\n      --dark: #101713;\r\n      --green: #c8f169;\r\n      --muted: #68716a;\r\n      --line: #dfe3da;\r\n      --white: #fff;\r\n      --radius: 20px;\r\n      --max: 1160px;\r\n    }\r\n\r\n    * { box-sizing: border-box; }\r\n\r\n    html {\r\n      scroll-behavior: smooth;\r\n      scroll-padding-top: 90px;\r\n    }\r\n\r\n    body {\r\n      margin: 0;\r\n      background: var(--bg);\r\n      color: var(--ink);\r\n      font-family: Inter, system-ui, -apple-system, sans-serif;\r\n      line-height: 1.6;\r\n    }\r\n\r\n    a { color: inherit; text-decoration: none; }\r\n\r\n    a:focus-visible, button:focus-visible,\r\n    input:focus-visible, textarea:focus-visible {\r\n      outline: 3px solid #629322;\r\n      outline-offset: 4px;\r\n    }\r\n\r\n    img { max-width: 100%; }\r\n\r\n    .container {\r\n      width: min(var(--max), calc(100% - 40px));\r\n      margin-inline: auto;\r\n    }\r\n\r\n    .eyebrow {\r\n      font-size: .76rem;\r\n      font-weight: 800;\r\n      text-transform: uppercase;\r\n      letter-spacing: .14em;\r\n    }\r\n\r\n    .muted { color: var(--muted); }\r\n\r\n    .section { padding: 100px 0; }\r\n\r\n    .section-head {\r\n      display: flex;\r\n      justify-content: space-between;\r\n      align-items: end;\r\n      gap: 30px;\r\n      margin-bottom: 42px;\r\n    }\r\n\r\n    h1, h2, h3, p { margin-top: 0; }\r\n\r\n    h1, h2, h3 {\r\n      line-height: 1.08;\r\n      letter-spacing: -.045em;\r\n    }\r\n\r\n    h1 { font-size: clamp(2.8rem, 7vw, 5.7rem); }\r\n    h2 { font-size: clamp(2.1rem, 4vw, 3.5rem); }\r\n    h3 { font-size: 1.4rem; }\r\n\r\n    .section-head p {\r\n      max-width: 430px;\r\n      margin-bottom: 0;\r\n      color: var(--muted);\r\n    }\r\n\r\n    .button {\r\n      display: inline-flex;\r\n      justify-content: center;\r\n      align-items: center;\r\n      gap: 10px;\r\n      padding: 14px 21px;\r\n      min-height: 48px;\r\n      border: 1px solid var(--ink);\r\n      border-radius: 100px;\r\n      background: var(--ink);\r\n      color: var(--white);\r\n      font-weight: 750;\r\n      transition: transform .2s, background .2s;\r\n      cursor: pointer;\r\n    }\r\n\r\n    .button:hover { transform: translateY(-2px); }\r\n\r\n    .button-light {\r\n      background: var(--green);\r\n      color: var(--ink);\r\n      border-color: var(--green);\r\n    }\r\n\r\n    .button-outline {\r\n      background: transparent;\r\n      color: var(--ink);\r\n    }\r\n\r\n    \/* Navegaci\u00f3n *\/\r\n\r\n    .header {\r\n      position: sticky;\r\n      top: 0;\r\n      z-index: 10;\r\n      background: rgba(247,247,242,.94);\r\n      backdrop-filter: blur(12px);\r\n      border-bottom: 1px solid var(--line);\r\n    }\r\n\r\n    .nav {\r\n      min-height: 78px;\r\n      display: flex;\r\n      justify-content: space-between;\r\n      align-items: center;\r\n      gap: 24px;\r\n    }\r\n\r\n    .logo {\r\n      font-size: 1.3rem;\r\n      font-weight: 900;\r\n      letter-spacing: -.06em;\r\n    }\r\n\r\n    .logo span { color: #648c26; }\r\n\r\n    .nav-links {\r\n      display: flex;\r\n      align-items: center;\r\n      gap: 26px;\r\n      font-size: .9rem;\r\n      font-weight: 650;\r\n    }\r\n\r\n    .nav-links a:not(.button):hover { color: #648c26; }\r\n\r\n    .menu-toggle {\r\n      display: none;\r\n      border: 1px solid var(--line);\r\n      border-radius: 10px;\r\n      padding: 9px 12px;\r\n      background: transparent;\r\n      font-size: 1.2rem;\r\n      color: var(--ink);\r\n    }\r\n\r\n    \/* Hero *\/\r\n\r\n    .hero {\r\n      background: var(--dark);\r\n      color: var(--white);\r\n      overflow: hidden;\r\n    }\r\n\r\n    .hero-inner {\r\n      min-height: 600px;\r\n      padding-block: 90px;\r\n      display: grid;\r\n      grid-template-columns: 1.15fr .85fr;\r\n      gap: 55px;\r\n      align-items: center;\r\n    }\r\n\r\n    .hero .eyebrow { color: var(--green); }\r\n\r\n    .hero h1 { margin: 22px 0; }\r\n\r\n    .hero h1 em {\r\n      color: var(--green);\r\n      font-style: normal;\r\n    }\r\n\r\n    .hero-copy {\r\n      max-width: 560px;\r\n      color: #c1cbc2;\r\n      font-size: 1.08rem;\r\n      margin-bottom: 30px;\r\n    }\r\n\r\n    .hero-actions {\r\n      display: flex;\r\n      flex-wrap: wrap;\r\n      gap: 12px;\r\n    }\r\n\r\n    .hero .button-outline {\r\n      color: white;\r\n      border-color: #69766b;\r\n    }\r\n\r\n    .hero-art {\r\n      position: relative;\r\n      min-height: 370px;\r\n      padding: 22px;\r\n      display: flex;\r\n      align-items: center;\r\n      justify-content: center;\r\n      background:\r\n        radial-gradient(circle at 70% 25%, #405b2c, transparent 43%),\r\n        #202c23;\r\n      border: 1px solid #38453a;\r\n      border-radius: 26px;\r\n    }\r\n\r\n    .browser {\r\n      width: 100%;\r\n      background: #f7f7f2;\r\n      color: var(--ink);\r\n      border-radius: 14px;\r\n      overflow: hidden;\r\n      transform: rotate(-3deg);\r\n      box-shadow: 0 25px 65px #0005;\r\n    }\r\n\r\n    .browser-top {\r\n      padding: 12px 15px;\r\n      border-bottom: 1px solid var(--line);\r\n      font-size: .75rem;\r\n      color: var(--muted);\r\n    }\r\n\r\n    .browser-body { padding: 25px; }\r\n\r\n    .browser-label {\r\n      font-size: .62rem;\r\n      letter-spacing: .15em;\r\n      font-weight: 800;\r\n    }\r\n\r\n    .browser-body h2 {\r\n      font-size: clamp(1.7rem, 3vw, 2.8rem);\r\n      margin: 16px 0;\r\n    }\r\n\r\n    .browser-shapes {\r\n      display: grid;\r\n      grid-template-columns: 1.3fr 1fr;\r\n      gap: 10px;\r\n      margin-top: 22px;\r\n    }\r\n\r\n    .shape {\r\n      height: 100px;\r\n      border-radius: 9px;\r\n      background: #dbe7c8;\r\n    }\r\n\r\n    .shape:last-child { background: #c9d6cb; }\r\n\r\n    .hero-note {\r\n      position: absolute;\r\n      bottom: 12px;\r\n      right: 14px;\r\n      color: #d3dfd0;\r\n      font-size: .7rem;\r\n    }\r\n\r\n    \/* Franja de valor *\/\r\n\r\n    .value-strip {\r\n      background: var(--green);\r\n      padding: 22px 0;\r\n    }\r\n\r\n    .value-inner {\r\n      display: flex;\r\n      flex-wrap: wrap;\r\n      justify-content: space-between;\r\n      gap: 15px 30px;\r\n      font-weight: 800;\r\n      font-size: .9rem;\r\n    }\r\n\r\n    \/* Servicios *\/\r\n\r\n    .services-grid {\r\n      display: grid;\r\n      grid-template-columns: repeat(3, 1fr);\r\n      gap: 18px;\r\n    }\r\n\r\n    .service-card {\r\n      padding: 30px;\r\n      border: 1px solid var(--line);\r\n      border-radius: var(--radius);\r\n      background: var(--white);\r\n    }\r\n\r\n    .service-number {\r\n      display: inline-grid;\r\n      place-items: center;\r\n      width: 43px;\r\n      height: 43px;\r\n      margin-bottom: 30px;\r\n      background: #eaf4d9;\r\n      border-radius: 12px;\r\n      font-weight: 900;\r\n    }\r\n\r\n    .service-card p { color: var(--muted); }\r\n\r\n    .text-link {\r\n      display: inline-block;\r\n      margin-top: 8px;\r\n      font-weight: 800;\r\n      text-decoration: underline;\r\n      text-underline-offset: 4px;\r\n    }\r\n\r\n    \/* Portafolio *\/\r\n\r\n    .portfolio { background: #ecefe7; }\r\n\r\n    .portfolio-grid {\r\n      display: grid;\r\n      grid-template-columns: 1fr 1fr;\r\n      gap: 24px;\r\n    }\r\n\r\n    .project-visual {\r\n      min-height: 280px;\r\n      padding: 25px;\r\n      display: flex;\r\n      align-items: center;\r\n      justify-content: center;\r\n      border-radius: 18px;\r\n      overflow: hidden;\r\n    }\r\n\r\n    .project-visual-one { background: #d8e7cb; }\r\n    .project-visual-two { background: #d8dce7; }\r\n\r\n    .mock-site {\r\n      width: 88%;\r\n      padding: 20px;\r\n      background: white;\r\n      border-radius: 9px;\r\n      box-shadow: 0 15px 35px #17221b16;\r\n    }\r\n\r\n    .mock-line {\r\n      height: 7px;\r\n      width: 42%;\r\n      margin-bottom: 12px;\r\n      border-radius: 10px;\r\n      background: #d9dfd7;\r\n    }\r\n\r\n    .mock-title {\r\n      max-width: 260px;\r\n      margin: 20px 0;\r\n      font-size: clamp(1.6rem, 3vw, 2.5rem);\r\n      line-height: 1.02;\r\n      font-weight: 900;\r\n      letter-spacing: -.06em;\r\n    }\r\n\r\n    .mock-cta {\r\n      width: 90px;\r\n      height: 25px;\r\n      background: var(--green);\r\n      border-radius: 30px;\r\n    }\r\n\r\n    .mock-blocks {\r\n      display: grid;\r\n      grid-template-columns: 1fr 1fr;\r\n      gap: 8px;\r\n      margin-top: 18px;\r\n    }\r\n\r\n    .mock-block {\r\n      height: 60px;\r\n      background: #e6eae1;\r\n      border-radius: 5px;\r\n    }\r\n\r\n    .project-info { padding: 22px 4px; }\r\n\r\n    .project-info h3 { margin-bottom: 8px; }\r\n\r\n    .project-info p {\r\n      color: var(--muted);\r\n      margin-bottom: 0;\r\n    }\r\n\r\n    .placeholder-note {\r\n      display: inline-block;\r\n      margin-top: 10px;\r\n      color: #59635b;\r\n      font-size: .78rem;\r\n      font-weight: 700;\r\n    }\r\n\r\n    \/* Proceso *\/\r\n\r\n    .process-grid {\r\n      display: grid;\r\n      grid-template-columns: repeat(4, 1fr);\r\n      gap: 24px;\r\n    }\r\n\r\n    .process-step {\r\n      padding-top: 20px;\r\n      border-top: 2px solid var(--ink);\r\n    }\r\n\r\n    .process-step .eyebrow { color: #6c8d3b; }\r\n    .process-step p { color: var(--muted); }\r\n\r\n    \/* Diferenciaci\u00f3n *\/\r\n\r\n    .about { background: var(--dark); color: white; }\r\n\r\n    .about-grid {\r\n      display: grid;\r\n      grid-template-columns: .9fr 1.1fr;\r\n      align-items: center;\r\n      gap: 70px;\r\n    }\r\n\r\n    .about-panel {\r\n      padding: 35px;\r\n      border: 1px solid #3a463c;\r\n      border-radius: var(--radius);\r\n      background: #1a251c;\r\n    }\r\n\r\n    .about-panel p { color: #c1cbc2; }\r\n\r\n    .about-list {\r\n      padding: 0;\r\n      list-style: none;\r\n    }\r\n\r\n    .about-list li {\r\n      padding: 17px 0;\r\n      border-bottom: 1px solid #354136;\r\n    }\r\n\r\n    .about-list li::before {\r\n      content: \"\u2197\";\r\n      color: var(--green);\r\n      margin-right: 12px;\r\n      font-weight: 900;\r\n    }\r\n\r\n    \/* Preguntas frecuentes *\/\r\n\r\n    .faq-wrap {\r\n      max-width: 850px;\r\n      margin: 0 auto;\r\n    }\r\n\r\n    .faq-wrap h2 { margin-bottom: 35px; }\r\n\r\n    details {\r\n      padding: 22px 0;\r\n      border-bottom: 1px solid var(--line);\r\n    }\r\n\r\n    summary {\r\n      cursor: pointer;\r\n      font-size: 1.08rem;\r\n      font-weight: 800;\r\n    }\r\n\r\n    details p {\r\n      max-width: 720px;\r\n      padding-top: 15px;\r\n      margin-bottom: 0;\r\n      color: var(--muted);\r\n    }\r\n\r\n    \/* Contacto *\/\r\n\r\n    .contact { background: var(--green); }\r\n\r\n    .contact-grid {\r\n      display: grid;\r\n      grid-template-columns: 1fr 1fr;\r\n      gap: 60px;\r\n      align-items: start;\r\n    }\r\n\r\n    .contact-copy p { max-width: 440px; }\r\n\r\n    .contact-form {\r\n      padding: 30px;\r\n      border-radius: var(--radius);\r\n      background: white;\r\n    }\r\n\r\n    .field { margin-bottom: 18px; }\r\n\r\n    .field label {\r\n      display: block;\r\n      margin-bottom: 7px;\r\n      font-size: .88rem;\r\n      font-weight: 800;\r\n    }\r\n\r\n    .field input, .field textarea, .field select {\r\n      display: block;\r\n      width: 100%;\r\n      padding: 13px 14px;\r\n      border: 1px solid #d8ded5;\r\n      border-radius: 10px;\r\n      background: #fcfcfa;\r\n      color: var(--ink);\r\n      font: inherit;\r\n    }\r\n\r\n    .field textarea {\r\n      min-height: 120px;\r\n      resize: vertical;\r\n    }\r\n\r\n    .form-note {\r\n      margin: 12px 0 0;\r\n      color: var(--muted);\r\n      font-size: .78rem;\r\n    }\r\n\r\n    .form-status {\r\n      margin-top: 15px;\r\n      font-weight: 700;\r\n    }\r\n\r\n    \/* Footer *\/\r\n\r\n    .footer {\r\n      padding: 35px 0;\r\n      background: var(--dark);\r\n      color: white;\r\n    }\r\n\r\n    .footer-inner {\r\n      display: flex;\r\n      justify-content: space-between;\r\n      align-items: center;\r\n      gap: 25px;\r\n      flex-wrap: wrap;\r\n    }\r\n\r\n    .footer p {\r\n      margin: 0;\r\n      color: #bac4ba;\r\n      font-size: .85rem;\r\n    }\r\n\r\n    .footer-links {\r\n      display: flex;\r\n      gap: 20px;\r\n      flex-wrap: wrap;\r\n      font-size: .85rem;\r\n    }\r\n\r\n    @media (max-width: 850px) {\r\n      .menu-toggle { display: block; }\r\n\r\n      .nav { flex-wrap: wrap; padding-block: 15px; }\r\n\r\n      .nav-links {\r\n        display: none;\r\n        width: 100%;\r\n        align-items: stretch;\r\n        flex-direction: column;\r\n        gap: 0;\r\n      }\r\n\r\n      .nav-links.open { display: flex; }\r\n\r\n      .nav-links a { padding: 12px 4px; }\r\n\r\n      .nav-links .button { margin-top: 8px; }\r\n\r\n      .hero-inner, .about-grid, .contact-grid {\r\n        grid-template-columns: 1fr;\r\n      }\r\n\r\n      .hero-inner { padding-block: 65px; gap: 35px; }\r\n\r\n      .hero-art { min-height: 310px; }\r\n\r\n      .services-grid { grid-template-columns: 1fr 1fr; }\r\n\r\n      .process-grid { grid-template-columns: 1fr 1fr; }\r\n\r\n      .about-grid { gap: 30px; }\r\n\r\n      .section { padding: 72px 0; }\r\n    }\r\n\r\n    @media (max-width: 560px) {\r\n      .container { width: min(100% - 30px, var(--max)); }\r\n\r\n      .section-head {\r\n        display: block;\r\n      }\r\n\r\n      .section-head p { margin-top: 16px; }\r\n\r\n      .services-grid, .portfolio-grid, .process-grid {\r\n        grid-template-columns: 1fr;\r\n      }\r\n\r\n      .hero-inner { min-height: auto; }\r\n\r\n      .hero h1 { font-size: clamp(2.7rem, 13vw, 4rem); }\r\n\r\n      .hero-art { min-height: 260px; padding: 15px; }\r\n\r\n      .browser-body { padding: 18px; }\r\n\r\n      .project-visual { min-height: 230px; }\r\n\r\n      .contact-form { padding: 22px; }\r\n\r\n      .value-inner { flex-direction: column; gap: 8px; }\r\n    }\r\n\r\n    @media (prefers-reduced-motion: reduce) {\r\n      *, *::before, *::after {\r\n        scroll-behavior: auto !important;\r\n        transition: none !important;\r\n      }\r\n    }\r\n  <\/style>\r\n<\/head>\r\n\r\n<body>\r\n\r\n  <!-- 1. NAVEGACI\u00d3N PRINCIPAL -->\r\n  <header class=\"header\">\r\n    <div class=\"container nav\">\r\n      <a class=\"logo\" href=\"#inicio\" aria-label=\"Jisuseduar, inicio\">\r\n        JISUSEDUAR<span>.<\/span>\r\n      <\/a>\r\n\r\n      <button class=\"menu-toggle\"\r\n              aria-label=\"Abrir men\u00fa\"\r\n              aria-expanded=\"false\"\r\n              aria-controls=\"nav-links\">\r\n        \u2630\r\n      <\/button>\r\n\r\n      <nav class=\"nav-links\" id=\"nav-links\" aria-label=\"Navegaci\u00f3n principal\">\r\n        <a href=\"#servicios\">Servicios<\/a>\r\n        <a href=\"#proyectos\">Proyectos<\/a>\r\n        <a href=\"#proceso\">Proceso<\/a>\r\n        <a href=\"#preguntas\">Preguntas frecuentes<\/a>\r\n        <a class=\"button\" href=\"#contacto\">Hablemos \u2197<\/a>\r\n      <\/nav>\r\n    <\/div>\r\n  <\/header>\r\n\r\n  <main>\r\n    <!-- 2. HERO: PROPUESTA DE VALOR -->\r\n    <section class=\"hero\" id=\"inicio\">\r\n      <div class=\"container hero-inner\">\r\n        <div>\r\n          <p class=\"eyebrow\">Dise\u00f1o web \u00b7 Estrategia digital<\/p>\r\n\r\n          <h1>\r\n            Tu pr\u00f3ximo sitio web empieza con una\r\n            <em>buena idea.<\/em>\r\n          <\/h1>\r\n\r\n          <p class=\"hero-copy\">\r\n            Dise\u00f1o y desarrollo de sitios web pensados para comunicar\r\n            el valor de tu negocio, generar confianza y facilitar el\r\n            contacto con tus potenciales clientes.\r\n          <\/p>\r\n\r\n          <div class=\"hero-actions\">\r\n            <a class=\"button button-light\" href=\"#contacto\">\r\n              Cu\u00e9ntame tu proyecto \u2197\r\n            <\/a>\r\n            <a class=\"button button-outline\" href=\"#servicios\">\r\n              Explorar servicios\r\n            <\/a>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"hero-art\" aria-label=\"Representaci\u00f3n visual de una p\u00e1gina web\">\r\n          <div class=\"browser\">\r\n            <div class=\"browser-top\">\u25cf \u25cf \u25cf &nbsp; Vista previa del sitio<\/div>\r\n            <div class=\"browser-body\">\r\n              <span class=\"browser-label\">TU MARCA DIGITAL<\/span>\r\n              <h2>Ideas que conectan. Sitios que comunican.<\/h2>\r\n              <div class=\"mock-line\"><\/div>\r\n              <div class=\"mock-line\" style=\"width:65%\"><\/div>\r\n              <div class=\"browser-shapes\">\r\n                <div class=\"shape\"><\/div>\r\n                <div class=\"shape\"><\/div>\r\n              <\/div>\r\n            <\/div>\r\n          <\/div>\r\n          <span class=\"hero-note\">Concepto visual de muestra<\/span>\r\n        <\/div>\r\n      <\/div>\r\n    <\/section>\r\n\r\n    <!-- 3. BENEFICIOS PRINCIPALES -->\r\n    <section class=\"value-strip\" aria-label=\"Enfoque del servicio\">\r\n      <div class=\"container value-inner\">\r\n        <span>Dise\u00f1o centrado en las personas<\/span>\r\n        <span>Experiencia m\u00f3vil<\/span>\r\n        <span>SEO desde la estructura<\/span>\r\n        <span>Objetivos de negocio<\/span>\r\n      <\/div>\r\n    <\/section>\r\n\r\n    <!-- 4. SERVICIOS -->\r\n    <section class=\"section\" id=\"servicios\">\r\n      <div class=\"container\">\r\n        <div class=\"section-head\">\r\n          <div>\r\n            <p class=\"eyebrow\">Qu\u00e9 puedo hacer por tu negocio<\/p>\r\n            <h2>Servicios digitales<br>con prop\u00f3sito.<\/h2>\r\n          <\/div>\r\n          <p>\r\n            Una presencia digital coherente empieza por entender\r\n            tus objetivos, tus clientes y lo que hace diferente a tu negocio.\r\n          <\/p>\r\n        <\/div>\r\n\r\n        <div class=\"services-grid\">\r\n          <article class=\"service-card\">\r\n            <span class=\"service-number\">01<\/span>\r\n            <h3>Dise\u00f1o de p\u00e1ginas web<\/h3>\r\n            <p>\r\n              Sitios web profesionales con una jerarqu\u00eda visual clara,\r\n              contenido organizado y una experiencia adaptable a m\u00f3viles.\r\n            <\/p>\r\n            <a class=\"text-link\" href=\"#contacto\">Consultar servicio \u2197<\/a>\r\n          <\/article>\r\n\r\n          <article class=\"service-card\">\r\n            <span class=\"service-number\">02<\/span>\r\n            <h3>Desarrollo web<\/h3>\r\n            <p>\r\n              Implementaci\u00f3n de p\u00e1ginas, landing pages y sitios corporativos\r\n              seg\u00fan los requerimientos y objetivos de cada proyecto.\r\n            <\/p>\r\n            <a class=\"text-link\" href=\"#contacto\">Consultar servicio \u2197<\/a>\r\n          <\/article>\r\n\r\n          <article class=\"service-card\">\r\n            <span class=\"service-number\">03<\/span>\r\n            <h3>SEO y optimizaci\u00f3n<\/h3>\r\n            <p>\r\n              Mejoras en la estructura, los contenidos y los aspectos\r\n              t\u00e9cnicos para facilitar la comprensi\u00f3n del sitio por buscadores.\r\n            <\/p>\r\n            <a class=\"text-link\" href=\"#contacto\">Consultar servicio \u2197<\/a>\r\n          <\/article>\r\n\r\n          <article class=\"service-card\">\r\n            <span class=\"service-number\">04<\/span>\r\n            <h3>Landing pages<\/h3>\r\n            <p>\r\n              P\u00e1ginas enfocadas en una oferta o acci\u00f3n concreta,\r\n              con informaci\u00f3n relevante y llamadas a la acci\u00f3n visibles.\r\n            <\/p>\r\n            <a class=\"text-link\" href=\"#contacto\">Consultar servicio \u2197<\/a>\r\n          <\/article>\r\n\r\n          <article class=\"service-card\">\r\n            <span class=\"service-number\">05<\/span>\r\n            <h3>Mantenimiento web<\/h3>\r\n            <p>\r\n              Actualizaciones, revisiones y mejoras para mantener\r\n              el sitio en condiciones adecuadas de funcionamiento.\r\n            <\/p>\r\n            <a class=\"text-link\" href=\"#contacto\">Consultar servicio \u2197<\/a>\r\n          <\/article>\r\n\r\n          <article class=\"service-card\">\r\n            <span class=\"service-number\">06<\/span>\r\n            <h3>Estrategia digital<\/h3>\r\n            <p>\r\n              Orientaci\u00f3n sobre contenido, objetivos de conversi\u00f3n\r\n              y prioridades para desarrollar una presencia digital coherente.\r\n            <\/p>\r\n            <a class=\"text-link\" href=\"#contacto\">Consultar servicio \u2197<\/a>\r\n          <\/article>\r\n        <\/div>\r\n      <\/div>\r\n    <\/section>\r\n\r\n    <!-- 5. PORTAFOLIO: REEMPLAZAR POR PROYECTOS REALES -->\r\n    <section class=\"section portfolio\" id=\"proyectos\">\r\n      <div class=\"container\">\r\n        <div class=\"section-head\">\r\n          <div>\r\n            <p class=\"eyebrow\">Trabajo y soluciones<\/p>\r\n            <h2>Dise\u00f1o que se<br>ve y se entiende.<\/h2>\r\n          <\/div>\r\n          <p>\r\n            Presenta proyectos reales para mostrar tu criterio de dise\u00f1o,\r\n            tu forma de resolver problemas y el valor de tu trabajo.\r\n          <\/p>\r\n        <\/div>\r\n\r\n        <div class=\"portfolio-grid\">\r\n          <article>\r\n            <div class=\"project-visual project-visual-one\"\r\n                 aria-label=\"Maqueta ilustrativa de una web corporativa\">\r\n              <div class=\"mock-site\">\r\n                <div class=\"mock-line\"><\/div>\r\n                <div class=\"mock-title\">Una marca con identidad propia.<\/div>\r\n                <div class=\"mock-cta\"><\/div>\r\n                <div class=\"mock-blocks\">\r\n                  <div class=\"mock-block\"><\/div>\r\n                  <div class=\"mock-block\"><\/div>\r\n                <\/div>\r\n              <\/div>\r\n            <\/div>\r\n            <div class=\"project-info\">\r\n              <p class=\"eyebrow\">Proyecto 01 \u00b7 Ejemplo de presentaci\u00f3n<\/p>\r\n              <h3>Sitio web corporativo<\/h3>\r\n              <p>\r\n                Explica aqu\u00ed el desaf\u00edo del cliente, la soluci\u00f3n desarrollada\r\n                y los resultados que puedas demostrar.\r\n              <\/p>\r\n              <span class=\"placeholder-note\">\r\n                Maqueta de ejemplo; sustituir por un caso real.\r\n              <\/span>\r\n            <\/div>\r\n          <\/article>\r\n\r\n          <article>\r\n            <div class=\"project-visual project-visual-two\"\r\n                 aria-label=\"Maqueta ilustrativa de una landing page\">\r\n              <div class=\"mock-site\">\r\n                <div class=\"mock-line\"><\/div>\r\n                <div class=\"mock-title\">Una propuesta clara para tu p\u00fablico.<\/div>\r\n                <div class=\"mock-cta\"><\/div>\r\n                <div class=\"mock-blocks\">\r\n                  <div class=\"mock-block\"><\/div>\r\n                  <div class=\"mock-block\"><\/div>\r\n                <\/div>\r\n              <\/div>\r\n            <\/div>\r\n            <div class=\"project-info\">\r\n              <p class=\"eyebrow\">Proyecto 02 \u00b7 Ejemplo de presentaci\u00f3n<\/p>\r\n              <h3>Landing page comercial<\/h3>\r\n              <p>\r\n                Describe c\u00f3mo organizaste la informaci\u00f3n, qu\u00e9 acci\u00f3n\r\n                priorizaste y c\u00f3mo evaluaste el desempe\u00f1o.\r\n              <\/p>\r\n              <span class=\"placeholder-note\">\r\n                Maqueta de ejemplo; sustituir por un caso real.\r\n              <\/span>\r\n            <\/div>\r\n          <\/article>\r\n        <\/div>\r\n      <\/div>\r\n    <\/section>\r\n\r\n    <!-- 6. PROCESO DE TRABAJO -->\r\n    <section class=\"section\" id=\"proceso\">\r\n      <div class=\"container\">\r\n        <div class=\"section-head\">\r\n          <div>\r\n            <p class=\"eyebrow\">C\u00f3mo trabajamos<\/p>\r\n            <h2>Un proceso claro,<br>de principio a fin.<\/h2>\r\n          <\/div>\r\n          <p>\r\n            Define las etapas de tu servicio para que cada cliente\r\n            entienda qu\u00e9 esperar antes de comenzar.\r\n          <\/p>\r\n        <\/div>\r\n\r\n        <div class=\"process-grid\">\r\n          <article class=\"process-step\">\r\n            <p class=\"eyebrow\">Paso 01<\/p>\r\n            <h3>Descubrimiento<\/h3>\r\n            <p>Conversamos sobre tu negocio, tus clientes y tus objetivos.<\/p>\r\n          <\/article>\r\n\r\n          <article class=\"process-step\">\r\n            <p class=\"eyebrow\">Paso 02<\/p>\r\n            <h3>Estrategia y dise\u00f1o<\/h3>\r\n            <p>Organizamos los contenidos, la estructura y la propuesta visual.<\/p>\r\n          <\/article>\r\n\r\n          <article class=\"process-step\">\r\n            <p class=\"eyebrow\">Paso 03<\/p>\r\n            <h3>Desarrollo<\/h3>\r\n            <p>Construimos el sitio y revisamos su funcionamiento en distintos dispositivos.<\/p>\r\n          <\/article>\r\n\r\n          <article class=\"process-step\">\r\n            <p class=\"eyebrow\">Paso 04<\/p>\r\n            <h3>Lanzamiento<\/h3>\r\n            <p>Verificamos los elementos acordados y preparamos la publicaci\u00f3n.<\/p>\r\n          <\/article>\r\n        <\/div>\r\n      <\/div>\r\n    <\/section>\r\n\r\n    <!-- 7. PROPUESTA DIFERENCIADORA -->\r\n    <section class=\"section about\" id=\"sobre-mi\">\r\n      <div class=\"container about-grid\">\r\n        <div>\r\n          <p class=\"eyebrow\">Sobre Jisuseduar<\/p>\r\n          <h2>Tu web debe trabajar para los objetivos de tu negocio.<\/h2>\r\n        <\/div>\r\n\r\n        <div class=\"about-panel\">\r\n          <p>\r\n            Aqu\u00ed debes presentar qui\u00e9n eres, tu experiencia, tu metodolog\u00eda\r\n            y las razones concretas por las que un cliente deber\u00eda trabajar\r\n            contigo.\r\n          <\/p>\r\n          <ul class=\"about-list\">\r\n            <li>Dise\u00f1o alineado con la identidad de tu marca.<\/li>\r\n            <li>Contenido organizado para facilitar la navegaci\u00f3n.<\/li>\r\n            <li>Consideraciones de SEO t\u00e9cnico y rendimiento.<\/li>\r\n            <li>Objetivos y alcance definidos antes del desarrollo.<\/li>\r\n          <\/ul>\r\n          <a class=\"button button-light\" href=\"#contacto\">\r\n            Conversemos sobre tu proyecto \u2197\r\n          <\/a>\r\n        <\/div>\r\n      <\/div>\r\n    <\/section>\r\n\r\n    <!-- 8. PREGUNTAS FRECUENTES -->\r\n    <section class=\"section\" id=\"preguntas\">\r\n      <div class=\"container faq-wrap\">\r\n        <p class=\"eyebrow\">Resolvamos tus dudas<\/p>\r\n        <h2>Preguntas frecuentes.<\/h2>\r\n\r\n        <details>\r\n          <summary>\u00bfCu\u00e1nto cuesta dise\u00f1ar una p\u00e1gina web?<\/summary>\r\n          <p>\r\n            El precio depende del alcance, el n\u00famero de p\u00e1ginas,\r\n            las funcionalidades, el contenido y los servicios adicionales.\r\n            Solicita una propuesta basada en las necesidades de tu proyecto.\r\n          <\/p>\r\n        <\/details>\r\n\r\n        <details>\r\n          <summary>\u00bfCu\u00e1nto demora desarrollar un sitio web?<\/summary>\r\n          <p>\r\n            El plazo depende de la complejidad del sitio, la disponibilidad\r\n            de los contenidos y las rondas de revisi\u00f3n acordadas.\r\n          <\/p>\r\n        <\/details>\r\n\r\n        <details>\r\n          <summary>\u00bfMi p\u00e1gina estar\u00e1 optimizada para m\u00f3viles?<\/summary>\r\n          <p>\r\n            El dise\u00f1o propuesto considera una estructura adaptable.\r\n            Antes del lanzamiento deben probarse los dispositivos,\r\n            los navegadores y las interacciones relevantes.\r\n          <\/p>\r\n        <\/details>\r\n\r\n        <details>\r\n          <summary>\u00bfEl dise\u00f1o web incluye posicionamiento SEO?<\/summary>\r\n          <p>\r\n            La estructura puede contemplar fundamentos de SEO t\u00e9cnico y\r\n            contenidos. El posicionamiento org\u00e1nico requiere trabajo continuo\r\n            y no se puede garantizar una posici\u00f3n espec\u00edfica en Google.\r\n          <\/p>\r\n        <\/details>\r\n\r\n        <details>\r\n          <summary>\u00bfPuedo actualizar el contenido de mi sitio?<\/summary>\r\n          <p>\r\n            Las posibilidades de edici\u00f3n dependen de la tecnolog\u00eda y del\r\n            sistema de gesti\u00f3n de contenidos que se acuerde para el proyecto.\r\n          <\/p>\r\n        <\/details>\r\n      <\/div>\r\n    <\/section>\r\n\r\n    <!-- 9. CONTACTO Y CAPTACI\u00d3N DE CLIENTES -->\r\n    <section class=\"section contact\" id=\"contacto\">\r\n      <div class=\"container contact-grid\">\r\n        <div class=\"contact-copy\">\r\n          <p class=\"eyebrow\">Hablemos de tu idea<\/p>\r\n          <h2>Hagamos que tu presencia digital avance.<\/h2>\r\n          <p>\r\n            Cu\u00e9ntame qu\u00e9 necesitas, qu\u00e9 quieres conseguir y en qu\u00e9 etapa\r\n            est\u00e1 tu proyecto. Con esa informaci\u00f3n podremos definir\r\n            los pr\u00f3ximos pasos.\r\n          <\/p>\r\n          <p><strong>Jisuseduar.cl<\/strong><br>\r\n            Dise\u00f1o web y soluciones digitales<\/p>\r\n        <\/div>\r\n\r\n        <form class=\"contact-form\" id=\"contact-form\">\r\n          <h3>Cu\u00e9ntame sobre tu proyecto<\/h3>\r\n\r\n          <div class=\"field\">\r\n            <label for=\"nombre\">Nombre<\/label>\r\n            <input id=\"nombre\" name=\"nombre\" autocomplete=\"name\"\r\n                   required placeholder=\"Tu nombre\">\r\n          <\/div>\r\n\r\n          <div class=\"field\">\r\n            <label for=\"email\">Correo electr\u00f3nico<\/label>\r\n            <input id=\"email\" name=\"email\" type=\"email\"\r\n                   autocomplete=\"email\" required\r\n                   placeholder=\"tu@empresa.cl\">\r\n          <\/div>\r\n\r\n          <div class=\"field\">\r\n            <label for=\"servicio\">\u00bfQu\u00e9 necesitas?<\/label>\r\n            <select id=\"servicio\" name=\"servicio\" required>\r\n              <option value=\"\">Selecciona un servicio<\/option>\r\n              <option>Dise\u00f1o de sitio web<\/option>\r\n              <option>Desarrollo web<\/option>\r\n              <option>Landing page<\/option>\r\n              <option>SEO y optimizaci\u00f3n<\/option>\r\n              <option>Mantenimiento web<\/option>\r\n              <option>Otro proyecto<\/option>\r\n            <\/select>\r\n          <\/div>\r\n\r\n          <div class=\"field\">\r\n            <label for=\"mensaje\">Detalles del proyecto<\/label>\r\n            <textarea id=\"mensaje\" name=\"mensaje\" required\r\n              placeholder=\"Cu\u00e9ntame qu\u00e9 tienes en mente...\"><\/textarea>\r\n          <\/div>\r\n\r\n          <button class=\"button button-light\" type=\"submit\">\r\n            Preparar consulta \u2197\r\n          <\/button>\r\n\r\n          <p class=\"form-note\">\r\n            Maqueta de demostraci\u00f3n: este formulario todav\u00eda no env\u00eda datos.\r\n            Debes conectarlo a un servicio de formularios o a tu backend\r\n            antes de publicar.\r\n          <\/p>\r\n          <p class=\"form-status\" id=\"form-status\" aria-live=\"polite\"><\/p>\r\n        <\/form>\r\n      <\/div>\r\n    <\/section>\r\n  <\/main>\r\n\r\n  <!-- 10. PIE DE P\u00c1GINA -->\r\n  <footer class=\"footer\">\r\n    <div class=\"container footer-inner\">\r\n      <div>\r\n        <a class=\"logo\" href=\"#inicio\">JISUSEDUAR<span>.<\/span><\/a>\r\n        <p>Dise\u00f1o web con prop\u00f3sito.<\/p>\r\n      <\/div>\r\n\r\n      <nav class=\"footer-links\" aria-label=\"Enlaces del pie de p\u00e1gina\">\r\n        <a href=\"#servicios\">Servicios<\/a>\r\n        <a href=\"#proyectos\">Proyectos<\/a>\r\n        <a href=\"#sobre-mi\">Sobre m\u00ed<\/a>\r\n        <a href=\"#contacto\">Contacto<\/a>\r\n      <\/nav>\r\n\r\n      <p>\u00a9 <span id=\"year\"><\/span> Jisuseduar. Todos los derechos reservados.<\/p>\r\n    <\/div>\r\n  <\/footer>\r\n\r\n  <script>\r\n    \/\/ Men\u00fa adaptable a dispositivos m\u00f3viles\r\n    const menuButton = document.querySelector(\".menu-toggle\");\r\n    const navLinks = document.querySelector(\".nav-links\");\r\n\r\n    menuButton.addEventListener(\"click\", () => {\r\n      const isOpen = navLinks.classList.toggle(\"open\");\r\n      menuButton.setAttribute(\"aria-expanded\", String(isOpen));\r\n      menuButton.setAttribute(\r\n        \"aria-label\",\r\n        isOpen ? \"Cerrar men\u00fa\" : \"Abrir men\u00fa\"\r\n      );\r\n    });\r\n\r\n    navLinks.querySelectorAll(\"a\").forEach(link => {\r\n      link.addEventListener(\"click\", () => {\r\n        navLinks.classList.remove(\"open\");\r\n        menuButton.setAttribute(\"aria-expanded\", \"false\");\r\n        menuButton.setAttribute(\"aria-label\", \"Abrir men\u00fa\");\r\n      });\r\n    });\r\n\r\n    \/\/ A\u00f1o autom\u00e1tico\r\n    document.getElementById(\"year\").textContent =\r\n      new Date().getFullYear();\r\n\r\n    \/\/ Demostraci\u00f3n: no transmite ni almacena los datos del formulario.\r\n    document.getElementById(\"contact-form\").addEventListener(\r\n      \"submit\",\r\n      event => {\r\n        event.preventDefault();\r\n        document.getElementById(\"form-status\").textContent =\r\n          \"Formulario de muestra validado. Conecta un servicio de env\u00edo para recibir consultas reales.\";\r\n      }\r\n    );\r\n  <\/script>\r\n<\/body>\r\n<\/html>\r\n\t\t\t\t<\/div>\n\t\t\n<\/div>\n\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Dise\u00f1o Web y Marketing Digital | Jisuseduar JISUSEDUAR. \u2630 Servicios Proyectos Proceso Preguntas frecuentes Hablemos \u2197 Dise\u00f1o web \u00b7 Estrategia [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-13","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/jisuseduar.cl\/index.php?rest_route=\/wp\/v2\/pages\/13","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/jisuseduar.cl\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/jisuseduar.cl\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/jisuseduar.cl\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/jisuseduar.cl\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=13"}],"version-history":[{"count":3,"href":"https:\/\/jisuseduar.cl\/index.php?rest_route=\/wp\/v2\/pages\/13\/revisions"}],"predecessor-version":[{"id":16,"href":"https:\/\/jisuseduar.cl\/index.php?rest_route=\/wp\/v2\/pages\/13\/revisions\/16"}],"wp:attachment":[{"href":"https:\/\/jisuseduar.cl\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=13"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}