body { font-family: Poppins,sans-serif }
     


      {} *{} /*endBaseStyles*/
     


      #IE-warning {
        display: none;
        position: fixed;
        width: 100%;
        height: 100%;
        z-index: 9999;
        background: white;
      }
      .IE-warning-message {
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        text-align: center;
      }
    


        @media (max-width: 639px) {
          
        .global-style-vtw69z6b2 {
          background-image: url("https://images.groovetech.io/mOTYDauoV7CI8UXM6NZl-Hmhp5ILMNL4puNkyUmnl9A/rs:fit:0:0:0/g:no:0:0/c:0:0/aHR0cHM6Ly9hc3NldHMuZ3Jvb3ZlYXBwcy5jb20vaW1hZ2VzL2Y1OTk2YWI5LTcxMmMtNGRjNy1hNTUyLWJhYWFkNjdhZTYwZi8xNzAxODAzNTkyX01va3VwUENXZWI1RGFzQ29tcHJvbWlzby5wbmc.webp");background-size: cover;margin-left: 0px;margin-right: 0px;margin-top: 0px;margin-bottom: 0px;padding-left: 0px;padding-right: 0px;padding-top: 0px;padding-bottom: 0px;width: null;height: auto;max-width: null;z-index: auto;background-position-x: 50%;background-position-y: 50%;min-height: 50px;position: relative;background-repeat-x: no-repeat;background-repeat-y: no-repeat;
      }
        }
        @media (max-width: 767px) and (min-width: 640px) {
          
        .global-style-vtw69z6b2 {
          background-image: url("https://images.groovetech.io/mOTYDauoV7CI8UXM6NZl-Hmhp5ILMNL4puNkyUmnl9A/rs:fit:0:0:0/g:no:0:0/c:0:0/aHR0cHM6Ly9hc3NldHMuZ3Jvb3ZlYXBwcy5jb20vaW1hZ2VzL2Y1OTk2YWI5LTcxMmMtNGRjNy1hNTUyLWJhYWFkNjdhZTYwZi8xNzAxODAzNTkyX01va3VwUENXZWI1RGFzQ29tcHJvbWlzby5wbmc.webp");background-size: cover;margin-left: 0px;margin-right: 0px;margin-top: 0px;margin-bottom: 0px;padding-left: 0px;padding-right: 0px;padding-top: 0px;padding-bottom: 0px;width: null;height: auto;max-width: null;z-index: auto;background-position-x: 50%;background-position-y: 50%;min-height: 50px;position: relative;background-repeat-x: no-repeat;background-repeat-y: no-repeat;
      }
        }
        @media (max-width: 991px) and (min-width: 768px) {
          
        .global-style-vtw69z6b2 {
          background-image: url("https://images.groovetech.io/mOTYDauoV7CI8UXM6NZl-Hmhp5ILMNL4puNkyUmnl9A/rs:fit:0:0:0/g:no:0:0/c:0:0/aHR0cHM6Ly9hc3NldHMuZ3Jvb3ZlYXBwcy5jb20vaW1hZ2VzL2Y1OTk2YWI5LTcxMmMtNGRjNy1hNTUyLWJhYWFkNjdhZTYwZi8xNzAxODAzNTkyX01va3VwUENXZWI1RGFzQ29tcHJvbWlzby5wbmc.webp");background-size: cover;margin-left: 0px;margin-right: 0px;margin-top: 0px;margin-bottom: 0px;padding-left: 0px;padding-right: 0px;padding-top: 0px;padding-bottom: 0px;width: null;height: auto;max-width: null;z-index: auto;background-position-x: 50%;background-position-y: 50%;min-height: 50px;position: relative;background-repeat-x: no-repeat;background-repeat-y: no-repeat;
      }
        }
        @media (max-width: 1199px) and (min-width: 992px) {
          
        .global-style-vtw69z6b2 {
          background-image: url("https://images.groovetech.io/mOTYDauoV7CI8UXM6NZl-Hmhp5ILMNL4puNkyUmnl9A/rs:fit:0:0:0/g:no:0:0/c:0:0/aHR0cHM6Ly9hc3NldHMuZ3Jvb3ZlYXBwcy5jb20vaW1hZ2VzL2Y1OTk2YWI5LTcxMmMtNGRjNy1hNTUyLWJhYWFkNjdhZTYwZi8xNzAxODAzNTkyX01va3VwUENXZWI1RGFzQ29tcHJvbWlzby5wbmc.webp");background-size: cover;margin-left: 0px;margin-right: 0px;margin-top: 0px;margin-bottom: 0px;padding-left: 0px;padding-right: 0px;padding-top: 0px;padding-bottom: 0px;width: null;height: auto;max-width: null;z-index: auto;background-position-x: 50%;background-position-y: 50%;min-height: 50px;position: relative;background-repeat-x: no-repeat;background-repeat-y: no-repeat;
      }
        }
        @media (min-width: 1200px) {
          
        .global-style-vtw69z6b2 {
          background-image: url("https://images.groovetech.io/mOTYDauoV7CI8UXM6NZl-Hmhp5ILMNL4puNkyUmnl9A/rs:fit:0:0:0/g:no:0:0/c:0:0/aHR0cHM6Ly9hc3NldHMuZ3Jvb3ZlYXBwcy5jb20vaW1hZ2VzL2Y1OTk2YWI5LTcxMmMtNGRjNy1hNTUyLWJhYWFkNjdhZTYwZi8xNzAxODAzNTkyX01va3VwUENXZWI1RGFzQ29tcHJvbWlzby5wbmc.webp");background-size: cover;margin-left: 0px;margin-right: 0px;margin-top: 0px;margin-bottom: 0px;padding-left: 0px;padding-right: 0px;padding-top: 0px;padding-bottom: 0px;width: null;height: auto;max-width: null;z-index: auto;background-position-x: 50%;background-position-y: 50%;min-height: 50px;position: relative;background-repeat-x: no-repeat;background-repeat-y: no-repeat;
      }
        }

 /* ============================================================ PALETA CLARA, CÁLIDA Y DE ALTO CONTRASTE Pensada para personas de 45 a 65 años que recién empiezan. Letra grande, botones grandes, una sola columna. ============================================================ */ #hdp-app{ --crema: #FFFAFC; /* fondo principal claro */ --crema-2: #F9EDF3; /* magenta muy suave */ --blanco: #FFFFFF; --tinta: #202D3C; /* azul negro de la marca */ --tinta-suave: #4F5965; /* texto secundario */ --naranja: #C21B6F; /* magenta ProgrAmarte.ts */ --naranja-osc: #94184D; --verde: #1E8E5A; /* confirmaciones, aciertos */ --verde-osc: #15703F; --verde-claro: #E6F4EC; --azul: #94184D; /* acento institucional */ --azul-claro: #F8E7EF; --amarillo: #FFB806; --whatsapp: #25D366; --whatsapp-osc: #128C7E; --borde: #E8CFDB; --sombra-suave: 0 6px 20px rgba(148, 24, 77, 0.08); --sombra-media: 0 12px 34px rgba(148, 24, 77, 0.12); --radio: 18px; --radio-lg: 26px; --ease: cubic-bezier(0.22, 1, 0.36, 1); } #hdp-app *{ box-sizing: border-box; } #hdp-app{ margin:0; padding:0; overflow-x:hidden; } #hdp-app{ font-family: "Poppins", system-ui, -apple-system, Arial, sans-serif; background: var(--crema); color: var(--tinta); line-height: 1.7; font-size: 19px; /* base grande para legibilidad */ -webkit-font-smoothing: antialiased; } #hdp-app img{ max-width:100%; display:block; } #hdp-app a{ color: var(--azul); } #hdp-app h1, #hdp-app h2, #hdp-app h3{ margin:0; line-height:1.18; font-family:"Poppins", system-ui, sans-serif; font-weight:700; } #hdp-app p{ margin:0; } #hdp-app ul{ margin:0; padding:0; list-style:none; } #hdp-app button{ font-family:inherit; cursor:pointer; } #hdp-app .contenedor{ width:min(860px, 100% - 2.2rem); margin-inline:auto; } #hdp-app .seccion{ padding: clamp(2.6rem, 6vw, 4.4rem) 0; } #hdp-app #inscripcion{ scroll-margin-top:1rem; } #hdp-app em.resalta{ font-style:italic; color: var(--naranja-osc); font-weight:500; } /* ---------- ENCABEZADO / HERO ---------- */ #hdp-app .hero{ background: radial-gradient(120% 80% at 50% 0%, #FFFFFF 0%, var(--crema) 60%), var(--crema); text-align:center; padding: clamp(2.4rem, 6vw, 4rem) 0 clamp(2.2rem, 5vw, 3.4rem); border-bottom: 1px solid var(--borde); } #hdp-app .marca{ width:clamp(220px, 48vw, 390px); height:auto; margin:0 auto 1.1rem; } #hdp-app .marca-contexto{ color:var(--naranja-osc); font-size:clamp(.96rem,2vw,1.08rem); font-weight:800; margin-bottom:.8rem; } #hdp-app .insignia{ display:inline-flex; align-items:center; gap:.5rem; background: var(--azul-claro); color: var(--azul); font-weight:700; font-size:.92rem; padding:.5rem 1rem; border-radius:999px; margin-bottom:1.4rem; } #hdp-app .hero h1{ font-size: clamp(2rem, 5.4vw, 3.1rem); letter-spacing:-0.01em; margin-bottom:1.1rem; text-wrap:balance; } #hdp-app .hero .lead{ font-size: clamp(1.12rem, 2.2vw, 1.32rem); color: var(--tinta-suave); max-width: 38ch; margin:0 auto 1.8rem; text-wrap:pretty; } #hdp-app .hero-visual{ margin:2rem auto 0; max-width:780px; overflow:hidden; border-radius:var(--radio-lg); border:1px solid var(--borde); box-shadow:var(--sombra-media); background:var(--crema-2); } #hdp-app .hero-visual img{ width:100%; aspect-ratio:16/8.9; object-fit:cover; } /* ---------- BOTONES ---------- */ #hdp-app .btn{ display:inline-flex; align-items:center; justify-content:center; gap:.6rem; font-weight:800; font-size:1.12rem; min-height:60px; padding: 1rem 2rem; border:none; border-radius:999px; transition: transform .3s var(--ease), box-shadow .3s var(--ease), background .3s var(--ease); text-decoration:none; line-height:1.2; max-width:100%; } #hdp-app .btn--accion{ background: linear-gradient(135deg, var(--naranja) 0%, var(--naranja-osc) 100%); color:#fff; box-shadow: 0 10px 26px rgba(199, 93, 11, .32); } #hdp-app .btn--accion:hover{ transform: translateY(-3px); box-shadow: 0 16px 34px rgba(199, 93, 11, .42); } #hdp-app .btn--wa{ background: linear-gradient(135deg, var(--whatsapp) 0%, var(--whatsapp-osc) 100%); color:#fff; box-shadow: 0 12px 30px rgba(18, 140, 126, .4); width:100%; } #hdp-app .btn--wa:hover{ transform: translateY(-3px); } #hdp-app .btn--grande{ width:100%; font-size:1.2rem; min-height:66px; } #hdp-app .nota-precio{ margin-top:1rem; font-size:1rem; color:var(--tinta-suave); } #hdp-app .nota-precio strong{ color:var(--tinta); } /* ---------- BLOQUES DE CONTENIDO ---------- */ #hdp-app .bloque-titulo{ font-size: clamp(1.6rem, 3.6vw, 2.2rem); text-align:center; margin-bottom:.6rem; text-wrap:balance; } #hdp-app .bloque-intro{ text-align:center; color:var(--tinta-suave); max-width:46ch; margin:0 auto 2.2rem; font-size:1.08rem; } #hdp-app .lista-logros{ display:grid; gap:1rem; max-width:620px; margin:0 auto; } #hdp-app .logro{ display:flex; gap:1rem; align-items:flex-start; background:var(--blanco); border:1px solid var(--borde); border-radius:var(--radio); padding:1.2rem 1.3rem; box-shadow:var(--sombra-suave); } #hdp-app .logro .check{ flex:none; width:38px; height:38px; border-radius:50%; background:var(--verde-claro); color:var(--verde-osc); display:flex; align-items:center; justify-content:center; font-size:1.3rem; font-weight:800; } #hdp-app .logro p{ font-size:1.06rem; } #hdp-app .logro strong{ color:var(--tinta); } /* ---------- PARA QUIÉN ES (manejo de objeción) ---------- */ #hdp-app .para-quien{ background:var(--crema-2); border-block:1px solid var(--borde); } #hdp-app .tarjeta-empatia{ background:var(--blanco); border:1px solid var(--borde); border-left:6px solid var(--naranja); border-radius:var(--radio); padding:1.6rem 1.5rem; max-width:640px; margin:0 auto; box-shadow:var(--sombra-suave); font-size:1.1rem; } #hdp-app .tarjeta-empatia p + p{ margin-top:1rem; } /* ---------- ENTRENADOR ---------- */ #hdp-app .entrenador{ background:var(--tinta); color:#fff; } #hdp-app .entrenador .bloque-titulo, #hdp-app .entrenador .bloque-intro{ color:#fff; } #hdp-app .bio-entrenador{ display:grid; grid-template-columns:minmax(230px, .85fr) 1.25fr; gap:clamp(1.4rem,5vw,3rem); align-items:center; max-width:760px; margin:0 auto; } #hdp-app .bio-foto{ width:100%; max-width:260px; justify-self:center; border-radius:28px; background:linear-gradient(145deg,#F9EDF3,#E8CFDB); overflow:hidden; box-shadow:0 18px 40px rgba(0,0,0,.28); } #hdp-app .bio-foto img{ width:100%; height:auto; display:block; } #hdp-app .bio-contenido h3{ color:#fff; font-size:clamp(1.45rem,3.5vw,2rem); margin-bottom:.35rem; } #hdp-app .bio-cargo{ color:#F3BBD4; font-weight:700; margin-bottom:1rem; } #hdp-app .bio-contenido > p:not(.bio-cargo){ color:#EFF1F4; } #hdp-app .bio-puntos{ display:grid; grid-template-columns:1fr 1fr; gap:.65rem; margin-top:1.2rem; } #hdp-app .bio-puntos li{ background:rgba(255,255,255,.09); border:1px solid rgba(255,255,255,.16); border-radius:12px; padding:.7rem .8rem; font-size:.93rem; font-weight:600; } /* ============================================================ FORMULARIO DE DIAGNÓSTICO (3 PASOS, ADAPTATIVO) ============================================================ */ #hdp-app .form-seccion{ background:var(--crema-2); border-top:1px solid var(--borde); } #hdp-app .form-tarjeta{ background:var(--blanco); border:1px solid var(--borde); border-radius:var(--radio-lg); padding: clamp(1.4rem, 4vw, 2.4rem); max-width:680px; margin:0 auto; box-shadow:var(--sombra-media); } /* Barra de progreso */ #hdp-app .progreso-info{ text-align:center; font-weight:700; color:var(--tinta-suave); margin-bottom:.5rem; font-size:1rem; } #hdp-app .barra{ height:12px; background:var(--crema-2); border-radius:999px; overflow:hidden; margin-bottom:1.8rem; border:1px solid var(--borde); } #hdp-app .barra__relleno{ height:100%; width:33%; background:linear-gradient(90deg,var(--naranja),var(--naranja-osc)); border-radius:999px; transition:width .4s var(--ease); } #hdp-app .paso{ display:none; } #hdp-app .paso.activo{ display:block; animation:aparece .4s var(--ease); } @keyframes aparece{ from{opacity:0; transform:translateY(10px);} to{opacity:1; transform:translateY(0);} } #hdp-app .pregunta{ margin-bottom:1.8rem; } #hdp-app .pregunta > label.titulo-preg, #hdp-app .pregunta > p.titulo-preg{ display:block; font-weight:800; font-size:1.18rem; margin-bottom:.9rem; color:var(--tinta); } #hdp-app .ayuda-preg{ font-weight:600; font-size:1rem; color:var(--tinta-suave); margin-top:-.5rem; margin-bottom:.9rem; } /* Opciones tipo tarjeta seleccionable (radio grande) */ #hdp-app .opciones{ display:grid; gap:.8rem; } #hdp-app .opcion{ display:flex; align-items:center; gap:.9rem; border:2px solid var(--borde); border-radius:14px; padding:1.05rem 1.1rem; background:var(--crema); font-size:1.08rem; font-weight:600; color:var(--tinta); transition:border-color .2s var(--ease), background .2s var(--ease); cursor:pointer; min-height:60px; } #hdp-app .opcion:hover{ border-color:var(--naranja); } #hdp-app .opcion input{ width:26px; height:26px; flex:none; accent-color:var(--naranja); cursor:pointer; } #hdp-app .opcion.elegida{ border-color:var(--naranja); background:#FFF3E8; } /* Campos de texto */ #hdp-app .campo{ margin-bottom:1.4rem; } #hdp-app .campo label{ display:block; font-weight:800; font-size:1.1rem; margin-bottom:.5rem; } #hdp-app .campo input[type="text"], #hdp-app .campo input[type="email"], #hdp-app .campo input[type="tel"], #hdp-app .campo textarea{ width:100%; font-family:inherit; font-size:1.08rem; padding:.95rem 1.1rem; border:2px solid var(--borde); border-radius:12px; background:var(--crema); color:var(--tinta); min-height:58px; } #hdp-app .campo textarea{ min-height:96px; resize:vertical; } #hdp-app .campo input:focus, #hdp-app .campo textarea:focus{ outline:none; border-color:var(--azul); background:#fff; } #hdp-app .telefono-ayuda{ color:var(--tinta-suave); font-size:.92rem; margin:-.25rem 0 .6rem; } #hdp-app .telefono-grupo{ display:grid; grid-template-columns:minmax(145px,.9fr) minmax(0,1.1fr); gap:.65rem; } #hdp-app .telefono-grupo .pais-buscador, #hdp-app .telefono-grupo input[type="tel"]{ width:100%; min-width:0; min-height:58px; padding:.8rem .75rem; border:2px solid var(--borde); border-radius:12px; background:var(--crema); color:var(--tinta); font:inherit; font-size:1rem; } #hdp-app .telefono-grupo .pais-buscador{ cursor:text; } #hdp-app .telefono-grupo .pais-buscador:focus, #hdp-app .telefono-grupo input[type="tel"]:focus{ outline:none; border-color:var(--azul); background:#fff; } /* Recursos: casillas múltiples */ #hdp-app .recursos{ display:grid; gap:.7rem; } #hdp-app .recurso{ display:flex; align-items:center; gap:.8rem; border:2px solid var(--borde); border-radius:12px; padding:.85rem 1rem; background:var(--crema); font-size:1.05rem; font-weight:600; cursor:pointer; min-height:54px; } #hdp-app .recurso input{ width:24px; height:24px; flex:none; accent-color:var(--verde); cursor:pointer; } #hdp-app .recurso.marcado{ background:var(--verde-claro); border-color:var(--verde); } #hdp-app .condicional{ display:none; } #hdp-app .condicional.visible{ display:block; animation:aparece .4s var(--ease); } /* Navegación del formulario */ #hdp-app .form-nav{ display:flex; gap:1rem; margin-top:1.6rem; flex-wrap:wrap; } #hdp-app .btn--volver{ background:transparent; border:2px solid var(--borde); color:var(--tinta-suave); font-weight:700; font-size:1.05rem; min-height:58px; padding:.9rem 1.6rem; border-radius:999px; flex:1; min-width:130px; } #hdp-app .btn--volver:hover{ border-color:var(--tinta-suave); } #hdp-app .btn--siguiente{ flex:2; min-width:180px; } #hdp-app .error-msg{ background:#FDECEC; border:1px solid #E0807F; color:#A22; border-radius:12px; padding:.8rem 1rem; margin-top:1rem; font-weight:600; display:none; font-size:1rem; } #hdp-app .error-msg.visible{ display:block; } #hdp-app .tranquiliza{ text-align:center; color:var(--tinta-suave); font-size:.98rem; margin-top:1.2rem; } /* ---------- PIE ---------- */ #hdp-app .pie{ background:var(--tinta); color:#D6D9E0; text-align:center; padding:2.4rem 0; font-size:.98rem; } #hdp-app .pie a{ color:#fff; } #hdp-app .cta-movil{ display:none; } /* ---------- ANIMACIÓN DE ENTRADA ---------- */ #hdp-app [data-revelar]{ opacity:0; transform:translateY(18px); transition:opacity .7s var(--ease), transform .7s var(--ease); } #hdp-app [data-revelar].visible{ opacity:1; transform:translateY(0); } @media (prefers-reduced-motion: reduce){ #hdp-app *, #hdp-app *::before, #hdp-app *::after{ animation-duration:.01ms !important; transition-duration:.01ms !important; } #hdp-app [data-revelar]{ opacity:1; transform:none; } } /* ---------- AJUSTES MÓVIL ---------- */ @media (max-width:700px){ #hdp-app{ font-size:18px; } #hdp-app{ padding-bottom:78px; } #hdp-app .contenedor{ width:min(100% - 1.25rem, 860px); } #hdp-app .seccion{ padding:2.5rem 0; } #hdp-app .hero{ padding:1.35rem 0 2.2rem; } #hdp-app .marca{ width:min(100%, 310px); margin-bottom:.9rem; } #hdp-app .hero h1{ font-size:clamp(1.85rem,9vw,2.3rem); } #hdp-app .hero .lead{ font-size:1.05rem; line-height:1.65; } #hdp-app .hero-visual{ margin-top:1.5rem; border-radius:18px; } #hdp-app .hero-visual img{ aspect-ratio:4/3; object-position:68% center; } #hdp-app .btn{ width:100%; font-size:1.04rem; padding:.9rem 1rem; min-height:58px; } #hdp-app .logro{ padding:1rem; gap:.8rem; } #hdp-app .tarjeta-empatia{ padding:1.25rem 1.1rem; } #hdp-app .bio-entrenador{ grid-template-columns:1fr; text-align:center; } #hdp-app .bio-foto{ max-width:190px; } #hdp-app .bio-puntos{ grid-template-columns:1fr; text-align:left; } #hdp-app .form-tarjeta{ padding:1.1rem .85rem; border-radius:18px; } #hdp-app .opcion, #hdp-app .recurso{ padding:.9rem .8rem; font-size:1rem; } #hdp-app .campo input[type="text"], #hdp-app .campo input[type="email"], #hdp-app .campo input[type="tel"], #hdp-app .campo textarea, #hdp-app .telefono-grupo .pais-buscador{ font-size:16px; } #hdp-app .telefono-grupo{ grid-template-columns:minmax(132px,.85fr) minmax(0,1.15fr); gap:.45rem; } #hdp-app .form-nav{ flex-direction:column-reverse; } #hdp-app .btn--volver, #hdp-app .btn--siguiente{ width:100%; } #hdp-app .cta-movil{ display:flex; position:relative; z-index:1; margin:.8rem; bottom:auto; min-height:56px; align-items:center; justify-content:center; padding:.7rem 1rem; border-radius:999px; background:linear-gradient(135deg,var(--naranja),var(--naranja-osc)); color:#fff; text-decoration:none; font-weight:800; font-size:.98rem; box-shadow:0 10px 28px rgba(32,45,60,.22); } } /* GroovePages calcula mal la altura cuando el fragmento es hijo directo del lienzo. */ body.gpblsh { height: auto !important; max-height: none !important; overflow-y: auto !important; } body.gpblsh #page-container { height: auto !important; min-height: 100vh !important; } body.gpblsh #blocks-container { position: relative !important; height: auto !important; max-height: none !important; min-height: 100vh !important; }