diff --git a/Ogestan_andractiv/Quiz.xlsx b/Ogestan_andractiv/Quiz.xlsx deleted file mode 100644 index 767fdd0..0000000 Binary files a/Ogestan_andractiv/Quiz.xlsx and /dev/null differ diff --git a/Ogestan_andractiv/audio/audioh00.mp3 b/Ogestan_andractiv/audio/audioh00.mp3 index 7640fc1..862162d 100644 Binary files a/Ogestan_andractiv/audio/audioh00.mp3 and b/Ogestan_andractiv/audio/audioh00.mp3 differ diff --git a/Ogestan_andractiv/audio/audioh01.mp3 b/Ogestan_andractiv/audio/audioh01.mp3 index a62761f..293b246 100644 Binary files a/Ogestan_andractiv/audio/audioh01.mp3 and b/Ogestan_andractiv/audio/audioh01.mp3 differ diff --git a/Ogestan_andractiv/audio/audioh03.mp3 b/Ogestan_andractiv/audio/audioh03.mp3 index 12c3ab1..ca03051 100644 Binary files a/Ogestan_andractiv/audio/audioh03.mp3 and b/Ogestan_andractiv/audio/audioh03.mp3 differ diff --git a/Ogestan_andractiv/audio/audioh05.mp3 b/Ogestan_andractiv/audio/audioh05.mp3 index f6a3fe7..44dd986 100644 Binary files a/Ogestan_andractiv/audio/audioh05.mp3 and b/Ogestan_andractiv/audio/audioh05.mp3 differ diff --git a/Ogestan_andractiv/audio/audioh06.mp3 b/Ogestan_andractiv/audio/audioh06.mp3 index a5140d4..84725e4 100644 Binary files a/Ogestan_andractiv/audio/audioh06.mp3 and b/Ogestan_andractiv/audio/audioh06.mp3 differ diff --git a/Ogestan_andractiv/audio/audioh17.mp3 b/Ogestan_andractiv/audio/audioh17.mp3 index 84b8fcf..812835b 100644 Binary files a/Ogestan_andractiv/audio/audioh17.mp3 and b/Ogestan_andractiv/audio/audioh17.mp3 differ diff --git a/Ogestan_andractiv/audio/audioh20.mp3 b/Ogestan_andractiv/audio/audioh20.mp3 index dd5db34..03a82b7 100644 Binary files a/Ogestan_andractiv/audio/audioh20.mp3 and b/Ogestan_andractiv/audio/audioh20.mp3 differ diff --git a/Ogestan_andractiv/audio/audioh25.mp3 b/Ogestan_andractiv/audio/audioh25.mp3 index 988574f..8ea6027 100644 Binary files a/Ogestan_andractiv/audio/audioh25.mp3 and b/Ogestan_andractiv/audio/audioh25.mp3 differ diff --git a/Ogestan_andractiv/audio/audioh26.mp3 b/Ogestan_andractiv/audio/audioh26.mp3 index 146228e..17a214d 100644 Binary files a/Ogestan_andractiv/audio/audioh26.mp3 and b/Ogestan_andractiv/audio/audioh26.mp3 differ diff --git a/Ogestan_andractiv/audio/audioh27.mp3 b/Ogestan_andractiv/audio/audioh27.mp3 index 98360f7..050211a 100644 Binary files a/Ogestan_andractiv/audio/audioh27.mp3 and b/Ogestan_andractiv/audio/audioh27.mp3 differ diff --git a/Ogestan_andractiv/config.json b/Ogestan_andractiv/config.json index ced10ea..d8f0de5 100644 --- a/Ogestan_andractiv/config.json +++ b/Ogestan_andractiv/config.json @@ -9,27 +9,27 @@ "content": "contenido/01.html" }, { - "title": "La familia OGestan", + "title": "Introducción a OGestan ® Andractiv", "content": "contenido/02.html" }, { - "title": "¿Qué es OGestan® Plus?", + "title": "Componentes y beneficios", "content": "contenido/03.html" }, { - "title": "Beneficios", + "title": "Información nutricional", "content": "contenido/04.html" }, { - "title": "Información Nutricional", + "title": "Competidores y diferenciadores", "content": "contenido/05.html" }, { - "title": "Competencia", + "title": "Competidores y diferenciadores", "content": "contenido/06.html" }, { - "title": "Manejo de Objeciones", + "title": "Manejo de Objeciones (Actividad de aprendizaje)", "content": "contenido/07.html" }, { diff --git a/Ogestan_andractiv/contenido/01.html b/Ogestan_andractiv/contenido/01.html index efe30ac..c9aec56 100644 --- a/Ogestan_andractiv/contenido/01.html +++ b/Ogestan_andractiv/contenido/01.html @@ -24,20 +24,20 @@
-
+
-
-
+
+

¡Bienvenido a
OGestan® Andractiv!

-
+
+ class="btn btn-begin text-white fw-bold border border-3 border-blue-6 animate__animated animate__pulse animate__infinite py-1"> Comenzar
@@ -66,16 +66,16 @@
-

¿Qué aprenderás hoy?

-

En este módulo conocerás qué es OGestan® Andractiv, +

¿Qué aprenderás hoy?

+

En este módulo conocerás qué es OGestan® Andractiv, para quién está diseñado y cuál es su papel dentro - de la fertilidad masculina.

+ de la fertilidad masculina.

Comprenderás su propósito como suplemento y por qué su formulación resulta tan importante para apoyar la - calidad y funcionamiento del esperma. + calidad y funcionamiento del esperma.

diff --git a/Ogestan_andractiv/contenido/02.html b/Ogestan_andractiv/contenido/02.html index 1bd5e07..a8dedb9 100644 --- a/Ogestan_andractiv/contenido/02.html +++ b/Ogestan_andractiv/contenido/02.html @@ -11,9 +11,46 @@ } .pop_lateral { - background: linear-gradient(180deg, #003d53, #005a6f); + background: linear-gradient(180deg, #0064cf, #0064cf); } + .card { + background: linear-gradient(#0064cf, #00285b); + color: white; + } + + .card.completed { + background: linear-gradient(#8c8f91, #4d5d73); + color: white; + border: solid 3px #86d3ff !important; + } + + /* Marcadores personalizados para listas */ + ul.custom-li { + list-style: none; + padding-left: 0; + } + + ul.custom-li li { + position: relative; + padding-left: 2em; + margin-bottom: 0.5em; + } + + ul.custom-li li::before { + content: ""; + position: absolute; + left: 0; + top: 0.4em; + /* Ajusta este valor para alinear verticalmente */ + width: 1.2em; + height: 1.2em; + background-image: url('img/li1.png'); + background-size: contain; + background-repeat: no-repeat; + background-position: center; + display: inline-block; + } @media(min-width: 768px) { .content-pop-lateral { @@ -22,7 +59,7 @@ .pop_lateral { grid-template-columns: 1fr !important; - grid-template-rows: 75% 25% !important; + grid-template-rows: 85% auto !important; grid-row: 1 / 1 !important; place-self: start !important; width: 75% !important; @@ -36,46 +73,65 @@
-
-

Introducción a OGestan® Andractiv

-

Para comenzar, exploraremos la información esencial de OGestan® Andractiv. +

+

Introducción a OGestan® Andractiv

+

Para comenzar, exploraremos la información esencial de OGestan® Andractiv. Aquí - podrás revisar su nombre comercial, su presentación, su indicación y su - modo + podrás revisar su nombre comercial, su presentación, su indicación y su + modo de empleo. Estos elementos forman la base del producto y te permitirán comprender con claridad qué es, cómo se utiliza y a quién está dirigido.

-
-
+
-

Nombre comercial

+
+ +

Nombre comercial

+
+
-
-
+
-

Presentación

+
+ +

Presentación

+
-
-
+
-

Indicación

+
+ +

Indicación

+
-
-
+
-

Modo de empleo

+
+ +

Modo de empleo

+
@@ -93,15 +149,16 @@

Nombre comercial

-
    +
    • OGestan® Andractiv
    • Suplemento alimenticio en cápsulas.
      • -
    • Combinación de Antioxidantes, Vitaminas, Minerales y Omega-3 desarrollada para el +
    • Combinación de Antioxidantes, Vitaminas, Minerales y + Omega-3 desarrollada para el hombre.
-
- Nombre comercial +
+ Nombre comercial
@@ -115,10 +172,10 @@

Presentación

-

Caja de cartón con 30 cápsulas de 1.617gr.

+

Caja de cartón con 30 cápsulas de 1.617gr.

-
- Nombre comercial +
+ Nombre comercial
@@ -130,13 +187,13 @@
-
+

Indicación

Suplemento alimenticio, para complementar la alimentación en los hombres.

-
- Nombre comercial +
+ Nombre comercial
@@ -148,14 +205,16 @@
-
+

Modo de empleo

-

Dosis: 1 cápsula al día con algún alimento.

-

Edad: A partir de 18 años.

-

No exceder la dosis recomendada.

+
    +
  • Dosis: 1 cápsula al día con algún alimento.
    • +
  • Edad: A partir de 18 años.
    • +
  • No exceder la dosis recomendada.
    • +
-
- Nombre comercial +
+ Nombre comercial
@@ -200,14 +259,14 @@ popup: 'pop_lateral', htmlContainer: 'd-flex justify-content-center align-items-center', actions: 'my-0', - confirmButton: 'btn bg-primary text-white fw-semibold animate__animated animate__pulse animate__infinite' + confirmButton: 'btn btn-begin border-3 border-blue-6 text-white fw-bold animate__animated animate__pulse animate__infinite py-1 px-4' }, confirmButtonText: "Cerrar", showConfirmButton: true, allowOutsideClick: false, allowEscapeKey: false, focusConfirm: false, - backdrop: "rgba(65, 60, 60, .95)", + backdrop: "rgba(0, 40, 91, .80)", grow: 'fullscreen', showClass: { popup: 'animate__animated animate__fadeInLeft animate__faster' // Animación dinámica (derecha/izquierda) diff --git a/Ogestan_andractiv/contenido/03.html b/Ogestan_andractiv/contenido/03.html index 987ac8f..10e600a 100644 --- a/Ogestan_andractiv/contenido/03.html +++ b/Ogestan_andractiv/contenido/03.html @@ -7,8 +7,8 @@ } .wrap-sw { - background: rgba(0, 211, 95, 10); - background: linear-gradient(270deg, rgba(0, 211, 95, 0.7) 0%, rgba(0, 96, 255, 0.7) 100%); + background: rgba(0, 0, 0, 0); + /* background: linear-gradient(270deg, rgba(0, 211, 95, 0.7) 0%, rgba(0, 96, 255, 0.7) 100%); */ display: none; } @@ -17,18 +17,43 @@ filter: grayscale(1); } - .card.flat { - padding: 0; - background-color: transparent; - border: none; - box-shadow: none; + + /* Marcadores personalizados para listas */ + ul.custom-li { + list-style: none; + padding-left: 0; } - .card.flat .card-body { - padding: 0; - background-color: transparent; - border: none; - box-shadow: none; + ul.custom-li li { + position: relative; + padding-left: 2em; + margin-bottom: 0.5em; + } + + ul.custom-li li::before { + content: ""; + position: absolute; + left: 0; + top: 0em; + /* Ajusta este valor para alinear verticalmente */ + width: 1.2em; + height: 1.2em; + background-image: url('img/li1.png'); + background-size: contain; + background-repeat: no-repeat; + background-position: center; + display: inline-block; + } + + + /* Borde degradado para elementos con border-custom */ + .border-custom { + border: 4px solid transparent; + border-radius: 16px; + background-image: linear-gradient(white, white), linear-gradient(90deg, #37adff, #0064cf); + background-origin: border-box; + background-clip: content-box, border-box; + box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08); } .mySwiper { @@ -37,6 +62,7 @@ display: flex; flex-direction: column; justify-content: center; + z-index: 500; } .mySwiper .swiper-slide { @@ -92,7 +118,7 @@ height: 100%; left: 0; right: 0; - z-index: 55; + /* z-index: 55; */ top: 0; -webkit-justify-content: space-between; -ms-flex-pack: justify; @@ -104,101 +130,76 @@ .swiper-custom-button-next img, .swiper-custom-button-prev img { - height: 85px; + height: 35px; width: auto; + z-index: 100; + } + + .swiper-custom-button-prev { + border-radius: 20%; + z-index: 500; } .swiper-custom-button-next { border-radius: 20%; - } - - .row-card { - border-radius: 15px; - background-color: rgba(255, 255, 255, .6); - box-shadow: rgba(0, 0, 0, 0.15) 0px 15px 25px, rgba(0, 0, 0, 0.05) 0px 5px 10px; - border: none; - } - - .custom-card .swiper-slide { - overflow: hidden; - } - - .btn-open-info { - cursor: pointer; - width: 100%; - max-width: 70px; - border-radius: 50%; - margin-left: 1em; + z-index: 500; } .customSwiper .swiper-slide { height: 300px !important; } + .customSwiper .swiper-slide { + width: 100% !important; + box-sizing: border-box; + } + @media (min-width: 768px) { .swiper-custom-button-next img, .swiper-custom-button-prev img { - height: 150px; + height: 50px; width: auto; } .mySwiper { height: 200px !important; } + + .swiper-nav::before { + content: ""; + display: block; + width: 60%; + height: 86%; + background: url(img/soport.png) no-repeat center center; + background-size: 100% 100%; + position: absolute; + left: 20%; + top: 50%; + transform: translateY(-50%); + pointer-events: none; + z-index: 1; + } + } - - .card-with-avatar { - position: relative; - background: linear-gradient(to right, #D4F8E8, #C0F1FF); - border-radius: 12px; - padding: 2rem; - /* deja espacio para el avatar a la derecha */ - padding-right: 300px; - overflow: visible; - - /* para que el avatar “salga” sin recortarse */ + @media (min-width: 1200px) { + .swiper-nav::before { + content: ""; + display: block; + width: 60%; + height: 88%; + background: url(img/soport.png) no-repeat center center; + background-size: 100% 100%; + position: absolute; + left: 20%; + top: 50%; + transform: translateY(-50%); + pointer-events: none; + z-index: 1; + } } - /* Texto dentro de la tarjeta */ - .card-body p { - margin: 0; - } - - /* El círculo que contendrá la imagen */ - .avatar-circle { - position: absolute; - top: 50%; - right: 0; - transform: translateY(-50%); - height: 260px; - } - - /* La imagen ocupa todo el círculo y se recorta */ - .avatar-circle img { - width: 100%; - height: 100%; - object-fit: cover; - display: block; - } - - - .swal2-popup.swal-fullscreen { - align-items: center; - height: auto !important; - min-height: 100vh; - align-content: center; - } - - .swal2-popup.swal-fullscreen .swal2-html-container { - overflow: hidden; - } - - .custom-card-swal { - background-color: transparent; - border: none; - } @media (max-width: 576px) { @@ -206,14 +207,6 @@ height: 370px !important; } - .avatar-circle { - position: relative; - top: 0; - transform: translateY(0px); - max-width: 70%; - margin: 0 auto; - } - .avatar-circle img { object-fit: scale-down; } @@ -222,17 +215,6 @@ padding: 9px; } - .card-with-avatar { - position: relative; - background: linear-gradient(to right, #D4F8E8, #C0F1FF); - border-radius: 12px; - padding: 1rem; - /* deja espacio para el avatar a la derecha */ - padding-right: 0; - overflow: visible; - - /* para que el avatar “salga” sin recortarse */ - } }
@@ -241,8 +223,8 @@
-

Componentes y beneficios

-

En infertilidad masculina

+

Componentes y beneficios

+

En infertilidad masculina

@@ -274,15 +256,45 @@
+
+
+ +
+
+
+
+ +
+
+
+
+ +
+
+
+
+ +
+
+
+
+ +
+
+
+
+ +
+
- +
- +
@@ -300,60 +312,152 @@
-
-
-
-
+
+
+
+
+

Omega-3

- Conocimiento de tus compromisos: - diario, semanal y quincenal. + Aumenta el recuento + total, la concentración y morfología de los + espermatozoides.

-
- Avatar ilustrado -
-
-
-
-
-
-

Grito de - guerra: motivación para arrancar con - fuerza.

-
-
- Avatar ilustrado +
+
+
+
+

L-Carnitina

+
    +
  • Mejora la motilidad + de los espermatozoides.
    • +
  • Incrementa el + número total de espermatozoides. +
    • +
-
-
-
-

Role Play: - ejercicios para mejorar tu discurso de ventas.

-
-
- Avatar ilustrado +
+
+
+

Vitamina C

+
    +
  • Reduce el estrés + oxidativo.
    • +
  • Incrementa la + motilidad de los espermatozoides. +
    • +
  • Mejora la calidad + del semen.
    • +
-
-
-
-

Prospección: - ya sea por telemarketing, cambaceo tradicional, en - negocios o seguimiento.

+
+
+
+

Vitamina E

+
    +
  • Mejora la calidad de las mitocondrias.
    • +
  • Disminuye el daño a + los espermatozoides.
    • +
-
- Avatar ilustrado +
+
+
+
+
+
+
+

Licopeno

+
    +
  • Mejora los parámetros + del esperma.
    • +
  • Reduce el daño del ADN.
    • +
  • Mejora la morfología de los espermatozoides. +
    • +
+
+
+
+
+
+
+
+
+

Coenzima Q10 (Q10) +

+
    +
  • Aumenta la concentración de + esperma.
    • +
  • Mejora la motilidad.
    • +
+
+
+
+
+
+
+
+
+

Zinc (Zn)

+
    +
  • Antibacteriano en + el tracto reproductivo.
    • +
  • Mejora la motilidad y la fecundación de los + espermatozoides.
    • +
+
+
+
+
+
+
+
+
+

Selenio (Se)

+

Mejora la morfología y aumenta la motilidad + de los espermatozoides.

+
+
+
+
+
+
+
+
+

Vitamina D

+

Mejora la calidad del semen y la fertilidad + masculina.

+
+
+
+
+
+
+
+
+

Vitaminas B9 y B12 +

+
    +
  • Incrementan el recuento + total de + espermatozoides.
    • +
  • Aumentan la motilidad y mejoran la morfología. +
    • +
@@ -424,15 +528,20 @@ }); CourseNav.audioController.stopAllSoundsAndPlay(audioh06); const audioFiles = [ - CourseNav.createSound("audio/audio11.mp3"), - CourseNav.createSound("audio/audio12.mp3"), - CourseNav.createSound("audio/audio13.mp3"), - CourseNav.createSound("audio/audio14.mp3"), + CourseNav.createSound("audio/audioh07.mp3"), + CourseNav.createSound("audio/audioh08.mp3"), + CourseNav.createSound("audio/audioh09.mp3"), + CourseNav.createSound("audio/audioh10.mp3"), + CourseNav.createSound("audio/audioh11.mp3"), + CourseNav.createSound("audio/audioh12.mp3"), + CourseNav.createSound("audio/audioh13.mp3"), + CourseNav.createSound("audio/audioh14.mp3"), + CourseNav.createSound("audio/audioh15.mp3"), + CourseNav.createSound("audio/audioh16.mp3"), ]; function onAllSlidesVisited() { - console.log("completado"); $('.swiper-custom-button-next').removeClass('animate__animated animate__pulse animate__infinite'); CourseNav.setSlideVisited(); } @@ -444,7 +553,6 @@ // Validación del audio let audio = null; const audioData = $element.data("sound"); - console.log(audioData); if (audioData) { try { audio = eval(audioData); diff --git a/Ogestan_andractiv/contenido/04.html b/Ogestan_andractiv/contenido/04.html index bf9e799..2e9ee49 100644 --- a/Ogestan_andractiv/contenido/04.html +++ b/Ogestan_andractiv/contenido/04.html @@ -46,9 +46,9 @@ } .foco-bubble { - background: rgba(24, 24, 24, 0.7); + background: rgba(55, 173, 255, 0.7); color: #fff; - border: 2px solid #fff; + border: 0px solid #fff; border-radius: 2rem; padding: 1.5rem 2rem; line-height: 1.45; @@ -72,6 +72,10 @@ font-weight: 600; } + .text-yellow { + color: #ffc306 !important; + } + @media (max-width: 767.98px) { .foco-wrap { width: 100%; @@ -84,27 +88,17 @@ } .foco-bubble { - padding: 1rem 1.2rem; } } .back0 { - background-image: url('img/bg02.jpg'); + background-image: url('img/bg04.jpg'); background-attachment: fixed; background-size: cover; background-position: center; background-repeat: no-repeat; } - - /* - .btn-open-pop { - width: 70px; - height: 70px; - line-height: 30px; - text-align: center; - font-size: 40px; - } */
@@ -113,22 +107,22 @@
-->
-
-

Beneficios Generales

-

Conoce los beneficios generales de OGestan® Andractiv. Descubre cómo mejora +

+

Beneficios Generales

+

Conoce los beneficios generales de OGestan® Andractiv. Descubre cómo mejora parámetros esenciales del semen y fortalece la fertilidad masculina.

-
+
-
+
Foco encendido
-
+
Esta combinación de Antioxidantes, Vitaminas, Minerales y Omega–3 está diseñada para la mejora en la @@ -137,17 +131,17 @@
-
-
+
Foco apagado
-
+
  • Mejora la motilidad de los espermatozoides.
    • @@ -212,7 +206,7 @@ CourseNav.audioController.stopAllSoundsAndPlay(audioh18); // Cambiar estado visual setFocoState($focoIzquierda, 'on'); - setFocoState($focoDerecha, 'off'); + // setFocoState($focoDerecha, 'off'); $(this).removeClass('animate__animated animate__headShake animate__infinite') }); @@ -225,7 +219,7 @@ CourseNav.audioController.stopAllSoundsAndPlay(audioh19); // Cambiar estado visual setFocoState($focoDerecha, 'on'); - setFocoState($focoIzquierda, 'off'); + // setFocoState($focoIzquierda, 'off'); $(this).removeClass('animate__animated animate__heartBeat animate__infinite') }); @@ -235,9 +229,9 @@ const bubble2Visible = $('.foco-bubble').eq(1).hasClass('show'); if (bubble1Visible && bubble2Visible) { // Prende ambos focos al completar - setFocoState($focoIzquierda, 'on'); - setFocoState($focoDerecha, 'on'); - // CourseNav.setSlideVisited(); + // setFocoState($focoIzquierda, 'on'); + // setFocoState($focoDerecha, 'on'); + CourseNav.setSlideVisited(); } } diff --git a/Ogestan_andractiv/contenido/05.html b/Ogestan_andractiv/contenido/05.html index 546fc7c..9f1de41 100644 --- a/Ogestan_andractiv/contenido/05.html +++ b/Ogestan_andractiv/contenido/05.html @@ -1,6 +1,6 @@ -
    +
    -

    Me acompañó, no solo me afilió

    -

    Erika no fue - convencida. Fue escuchada, comprendida… y eso la llevó a decir que sí.​
    - Descubre cómo una conversación sin presión puede abrir una puerta real.

    +

    Información Nutricional ​

    @@ -70,13 +70,17 @@ "use strict"; $('body').addClass('fake'); - const audioh23 = CourseNav.createSound('audio/audioh23.mp3'); + // const audioh23 = CourseNav.createSound('audio/audioh23.mp3'); - CourseNav.audioController.stopAllSoundsAndPlay(audioh23); + // CourseNav.audioController.stopAllSoundsAndPlay(audioh23); - audioh23.on('end', function () { - $("#btn_video").removeClass("disabled"); - }); + // audioh23.on('end', function () { + // $("#btn_video").removeClass("disabled"); + // }); + + setTimeout(function () { + $("#btn_video").removeClass("disabled").click(); + }, 200); var video = document.getElementById("video"); var btnVideo = document.getElementById("btn_video"); diff --git a/Ogestan_andractiv/contenido/06.html b/Ogestan_andractiv/contenido/06.html index 232dcec..bb3cea7 100644 --- a/Ogestan_andractiv/contenido/06.html +++ b/Ogestan_andractiv/contenido/06.html @@ -1,4 +1,43 @@ -
    +
    -
    -

    Competidores

    +
    +

    Competidores

    -
    +
    - -
    DAXEED
    + + Dexeed Logo
    -
    +
    - -
    OTROS​
    + + Otros Logo
    @@ -154,13 +141,13 @@
    -
    -
    -
      +
      +
      +
      • Comercializado por Corne.
      • 8 componentes: antioxidantes, aminoácidos, vitaminas y zinc.
        • -
      • No contiene Omega-3.
        • -
      • No contiene Selenio.
        • +
      • No contiene Omega-3.
        • +
      • No contiene Selenio.
      • Ácido fólico estándar.
      • Alto costo.
      • Limitada disponibilidad en puntos de venta.
        • @@ -168,6 +155,9 @@
      • Presentación en sobres.
      +
      + +