/* CODIFICANDO | Portada. Prefijo cdp-. Selectores con #wrapwrap #wrap e !important para ganarle al tema.
   Poppins, naranja #FF7900 solo en acciones, blanco cálido y carbón; verde solo para WhatsApp. */
#wrapwrap #wrap.cdp {
  --n: #FF7900; --n2: #E86E00; --c: #1E2128; --g: #4A4F5A; --cal: #FFFBF5; --are: #F6F0E6; --bor: #E6DED1; --wa: #25D366;
  background: var(--cal) !important; color: var(--c) !important; padding: 0 !important; margin: 0 !important;
  font-family: 'Poppins', -apple-system, 'Segoe UI', Arial, sans-serif !important; font-size: 16px !important; line-height: 1.55 !important;
  overflow-x: clip;
}
#wrapwrap #wrap.cdp *, #wrapwrap #wrap.cdp *::before, #wrapwrap #wrap.cdp *::after { box-sizing: border-box !important; }
#wrapwrap #wrap.cdp h1, #wrapwrap #wrap.cdp h2, #wrapwrap #wrap.cdp h3, #wrapwrap #wrap.cdp p,
#wrapwrap #wrap.cdp ul, #wrapwrap #wrap.cdp ol, #wrapwrap #wrap.cdp li, #wrapwrap #wrap.cdp figure, #wrapwrap #wrap.cdp a,
#wrapwrap #wrap.cdp span, #wrapwrap #wrap.cdp b, #wrapwrap #wrap.cdp small, #wrapwrap #wrap.cdp figcaption {
  font-family: 'Poppins', -apple-system, 'Segoe UI', Arial, sans-serif !important;
  margin: 0 !important; padding: 0 !important; letter-spacing: normal !important; text-transform: none !important;
  text-shadow: none !important; -webkit-text-fill-color: currentColor !important; background-image: none !important;
}
#wrapwrap #wrap.cdp ul, #wrapwrap #wrap.cdp ol { list-style: none !important; }
#wrapwrap #wrap.cdp img { display: block !important; max-width: 100% !important; height: auto !important; }
#wrapwrap #wrap.cdp .cdp-oculto { position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; white-space: nowrap !important; }

#wrapwrap #wrap.cdp .cdp-sec { padding: 56px 0 !important; margin: 0 !important; background: transparent !important; scroll-margin-top: 84px; position: relative !important; min-height: 0 !important; }
#wrapwrap #wrap.cdp .cdp-env { width: 100% !important; max-width: 1200px !important; margin: 0 auto !important; padding: 0 20px !important; }
#wrapwrap #wrap.cdp .cdp-env--angosto { max-width: 820px !important; }
#wrapwrap #wrap.cdp h1 { font-size: clamp(29px, 3.5vw, 44px) !important; line-height: 1.15 !important; font-weight: 700 !important; color: var(--c) !important; }
#wrapwrap #wrap.cdp h2 { font-size: clamp(25px, 3vw, 36px) !important; line-height: 1.2 !important; font-weight: 700 !important; color: var(--c) !important; }
#wrapwrap #wrap.cdp h3 { font-size: 19px !important; line-height: 1.3 !important; font-weight: 600 !important; color: var(--c) !important; }
#wrapwrap #wrap.cdp p, #wrapwrap #wrap.cdp li, #wrapwrap #wrap.cdp span { color: inherit; font-size: inherit; line-height: inherit; }
#wrapwrap #wrap.cdp .cdp-cab { max-width: 720px !important; margin: 0 0 32px !important; }
#wrapwrap #wrap.cdp .cdp-cab p { margin-top: 10px !important; color: var(--g) !important; font-size: 17px !important; }

/* Botones y enlaces: 48 px de alto, foco visible */
#wrapwrap #wrap.cdp .cdp-boton {
  display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important;
  min-height: 48px !important; padding: 0 22px !important; border-radius: 10px !important; border: 2px solid transparent !important;
  font-size: 16px !important; font-weight: 600 !important; line-height: 1.2 !important; text-decoration: none !important; text-align: center !important;
  cursor: pointer !important; box-shadow: none !important; transform: none !important;
  transition: background-color .18s ease, border-color .18s ease, color .18s ease !important;
}
#wrapwrap #wrap.cdp .cdp-boton--accion { background: var(--n) !important; color: #fff !important; border-color: var(--n) !important; }
#wrapwrap #wrap.cdp .cdp-boton--accion:hover { background: var(--n2) !important; border-color: var(--n2) !important; color: var(--c) !important; }
#wrapwrap #wrap.cdp .cdp-boton--borde { background: #fff !important; color: var(--c) !important; border-color: var(--c) !important; }
#wrapwrap #wrap.cdp .cdp-boton--borde:hover { background: var(--are) !important; color: var(--c) !important; }
#wrapwrap #wrap.cdp .cdp-boton--wa { background: var(--wa) !important; color: var(--c) !important; border-color: var(--wa) !important; }
#wrapwrap #wrap.cdp .cdp-boton--wa:hover { background: #1FBF5B !important; border-color: #1FBF5B !important; color: var(--c) !important; }
#wrapwrap #wrap.cdp .cdp-boton span, #wrapwrap #wrap.cdp .cdp-boton svg { color: inherit !important; flex-shrink: 0; }
#wrapwrap #wrap.cdp .cdp-boton span { flex-shrink: 1; }
#wrapwrap #wrap.cdp .cdp-enlace {
  display: inline-flex !important; align-items: center !important; min-height: 44px !important; color: var(--c) !important;
  font-weight: 600 !important; text-decoration: underline !important; text-decoration-color: var(--n) !important;
  text-decoration-thickness: 2px !important; text-underline-offset: 5px !important;
}
#wrapwrap #wrap.cdp .cdp-enlace:hover { text-decoration-color: var(--c) !important; }
#wrapwrap #wrap.cdp a:focus-visible { outline: 3px solid var(--c) !important; outline-offset: 3px !important; box-shadow: 0 0 0 6px #fff !important; }
#wrapwrap #wrap.cdp .cdp-acciones { display: flex !important; flex-wrap: wrap !important; gap: 12px !important; margin-top: 26px !important; }
#wrapwrap #wrap.cdp .cdp-acciones--centro { justify-content: center !important; }
#wrapwrap #wrap.cdp .cdp-firma { color: var(--g) !important; font-size: 14px !important; font-weight: 600 !important; letter-spacing: .08em !important; text-transform: uppercase !important; }

/* 1. Propuesta */
#wrapwrap #wrap.cdp .cdp-inicio { padding: 44px 0 52px !important; }
#wrapwrap #wrap.cdp .cdp-inicio__rejilla { display: grid !important; grid-template-columns: minmax(0, 1fr) minmax(0, 1.08fr) !important; gap: 44px !important; align-items: center !important; }
#wrapwrap #wrap.cdp .cdp-inicio h1 { margin-top: 12px !important; }
#wrapwrap #wrap.cdp .cdp-apoyo { margin-top: 18px !important; font-size: 18px !important; color: var(--g) !important; max-width: 560px !important; }
#wrapwrap #wrap.cdp .cdp-beneficios { display: grid !important; gap: 8px !important; margin-top: 24px !important; }
#wrapwrap #wrap.cdp .cdp-beneficios li { display: flex !important; align-items: flex-start !important; gap: 10px !important; font-weight: 500 !important; color: var(--c) !important; }
#wrapwrap #wrap.cdp .cdp-beneficios svg { flex-shrink: 0 !important; margin-top: 4px !important; color: var(--c) !important; }
#wrapwrap #wrap.cdp .cdp-wa-linea { margin-top: 18px !important; }
#wrapwrap #wrap.cdp .cdp-wa {
  display: inline-flex !important; align-items: center !important; gap: 10px !important; min-height: 48px !important; padding: 0 16px 0 12px !important;
  border-radius: 10px !important; background: #E4F9EC !important; border: 1.5px solid #128C4A !important; color: var(--c) !important;
  font-weight: 500 !important; text-decoration: none !important; transition: background-color .18s ease !important;
}
#wrapwrap #wrap.cdp .cdp-wa:hover { background: #CDF3DB !important; }
#wrapwrap #wrap.cdp .cdp-wa svg { color: #0B6B37 !important; flex-shrink: 0 !important; }
#wrapwrap #wrap.cdp .cdp-wa b { font-weight: 700 !important; white-space: nowrap !important; }
#wrapwrap #wrap.cdp figure picture { display: block !important; }
#wrapwrap #wrap.cdp figure img { width: 100% !important; border-radius: 12px !important; border: 1px solid var(--bor) !important; background: #fff !important; box-shadow: 0 18px 44px rgba(30, 33, 40, .12) !important; }
#wrapwrap #wrap.cdp figcaption { margin-top: 10px !important; color: var(--g) !important; font-size: 14px !important; }

/* 2. Confianza */
#wrapwrap #wrap.cdp .cdp-confianza { padding: 28px 0 !important; background: #fff !important; border-top: 1px solid var(--bor) !important; border-bottom: 1px solid var(--bor) !important; }
#wrapwrap #wrap.cdp .cdp-confianza__lista { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 24px !important; }
#wrapwrap #wrap.cdp .cdp-confianza__lista li { display: flex !important; flex-direction: column !important; gap: 4px !important; padding-left: 14px !important; border-left: 3px solid var(--c) !important; }
#wrapwrap #wrap.cdp .cdp-confianza__lista b { font-size: 16px !important; font-weight: 600 !important; color: var(--c) !important; }
#wrapwrap #wrap.cdp .cdp-confianza__lista span { font-size: 15px !important; color: var(--g) !important; }

/* 3. Demostración */
#wrapwrap #wrap.cdp .cdp-demo__lista { display: grid !important; gap: 44px !important; }
#wrapwrap #wrap.cdp .cdp-demo__item { display: grid !important; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr) !important; gap: 36px !important; align-items: center !important; }
#wrapwrap #wrap.cdp .cdp-demo__item--inv { grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr) !important; }
#wrapwrap #wrap.cdp .cdp-demo__item--inv figure { order: 2 !important; }
#wrapwrap #wrap.cdp .cdp-demo__item p { margin: 10px 0 8px !important; color: var(--g) !important; }
#wrapwrap #wrap.cdp .cdp-demo__item h3 { font-size: 24px !important; }
#wrapwrap #wrap.cdp .cdp-demo__pie { margin-top: 40px !important; }

/* 4. Giros */
#wrapwrap #wrap.cdp .cdp-giros { background: #fff !important; border-top: 1px solid var(--bor) !important; border-bottom: 1px solid var(--bor) !important; }
#wrapwrap #wrap.cdp .cdp-giros__lista { display: grid !important; grid-template-columns: repeat(5, minmax(0, 1fr)) !important; gap: 12px !important; }
#wrapwrap #wrap.cdp .cdp-giros__lista a {
  display: flex !important; align-items: center !important; min-height: 64px !important; padding: 10px 16px !important; height: 100% !important;
  border: 1.5px solid var(--bor) !important; border-radius: 12px !important; background: var(--cal) !important; color: var(--c) !important;
  font-weight: 600 !important; font-size: 16px !important; line-height: 1.3 !important; text-decoration: none !important;
  transition: border-color .18s ease, background-color .18s ease !important;
}
#wrapwrap #wrap.cdp .cdp-giros__lista a:hover { border-color: var(--c) !important; background: #fff !important; }
#wrapwrap #wrap.cdp .cdp-giros__pie { margin-top: 20px !important; }

/* 5. Planes */
#wrapwrap #wrap.cdp .cdp-planes__lista { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 16px !important; align-items: stretch !important; }
#wrapwrap #wrap.cdp .cdp-plan { display: flex !important; flex-direction: column !important; padding: 24px 20px !important; background: #fff !important; border: 1.5px solid var(--bor) !important; border-radius: 14px !important; }
#wrapwrap #wrap.cdp .cdp-plan h3 { font-size: 21px !important; }
#wrapwrap #wrap.cdp .cdp-plan__precio { margin-top: 10px !important; font-size: 18px !important; font-weight: 600 !important; color: var(--c) !important; white-space: nowrap !important; }
#wrapwrap #wrap.cdp .cdp-plan__precio b { font-size: 34px !important; font-weight: 700 !important; line-height: 1.1 !important; }
#wrapwrap #wrap.cdp .cdp-plan__precio small { font-size: 15px !important; font-weight: 500 !important; color: var(--g) !important; }
#wrapwrap #wrap.cdp .cdp-plan__alcance { margin-top: 8px !important; padding-bottom: 14px !important; border-bottom: 1px solid var(--bor) !important; font-weight: 600 !important; color: var(--c) !important; }
#wrapwrap #wrap.cdp .cdp-plan__incluye { display: grid !important; gap: 8px !important; margin: 14px 0 20px !important; flex: 1 1 auto !important; align-content: start !important; }
#wrapwrap #wrap.cdp .cdp-plan__incluye li { display: flex !important; align-items: flex-start !important; gap: 8px !important; font-size: 15px !important; color: var(--g) !important; }
#wrapwrap #wrap.cdp .cdp-plan__incluye svg { flex-shrink: 0 !important; margin-top: 3px !important; color: var(--c) !important; }
#wrapwrap #wrap.cdp .cdp-plan .cdp-boton { width: 100% !important; }
#wrapwrap #wrap.cdp .cdp-planes__notas { margin-top: 24px !important; padding: 18px 20px !important; background: var(--are) !important; border-radius: 12px !important; display: grid !important; gap: 6px !important; }
#wrapwrap #wrap.cdp .cdp-planes__notas p { color: var(--c) !important; font-size: 16px !important; }
#wrapwrap #wrap.cdp .cdp-planes__pie { margin-top: 24px !important; }

/* 6. Tienda */
#wrapwrap #wrap.cdp .cdp-tienda { padding: 0 0 56px !important; }
#wrapwrap #wrap.cdp .cdp-tienda__caja { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 24px !important; flex-wrap: wrap !important; }
#wrapwrap #wrap.cdp .cdp-tienda__caja > div { flex: 1 1 320px !important; }
#wrapwrap #wrap.cdp .cdp-tienda .cdp-env { padding: 28px 28px !important; background: var(--c) !important; border-radius: 16px !important; max-width: 1160px !important; width: calc(100% - 40px) !important; }
#wrapwrap #wrap.cdp .cdp-tienda h2 { color: #fff !important; font-size: clamp(22px, 2.4vw, 28px) !important; }
#wrapwrap #wrap.cdp .cdp-tienda p { margin-top: 6px !important; color: #E9E6E0 !important; }
#wrapwrap #wrap.cdp .cdp-tienda a:focus-visible { outline-color: #fff !important; box-shadow: 0 0 0 6px var(--c) !important; }

/* 7. Implementación */
#wrapwrap #wrap.cdp .cdp-impl { background: #fff !important; border-top: 1px solid var(--bor) !important; border-bottom: 1px solid var(--bor) !important; }
#wrapwrap #wrap.cdp .cdp-impl__pasos { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 20px !important; counter-reset: paso !important; }
#wrapwrap #wrap.cdp .cdp-impl__pasos li { counter-increment: paso !important; padding-top: 16px !important; border-top: 3px solid var(--c) !important; }
#wrapwrap #wrap.cdp .cdp-impl__pasos li::before { content: counter(paso) !important; display: block !important; margin-bottom: 6px !important; font-size: 15px !important; font-weight: 700 !important; color: var(--g) !important; }
#wrapwrap #wrap.cdp .cdp-impl__pasos p { margin-top: 6px !important; color: var(--g) !important; }

/* 8. Preguntas */
#wrapwrap #wrap.cdp .cdp-faq__lista { display: grid !important; gap: 0 !important; }
#wrapwrap #wrap.cdp .cdp-faq__item { padding: 20px 0 !important; border-top: 1px solid var(--bor) !important; }
#wrapwrap #wrap.cdp .cdp-faq__item:last-child { border-bottom: 1px solid var(--bor) !important; }
#wrapwrap #wrap.cdp .cdp-faq__item p { margin-top: 8px !important; color: var(--g) !important; }

/* 9. Cierre */
#wrapwrap #wrap.cdp .cdp-cierre { background: var(--are) !important; text-align: center !important; padding: 64px 0 !important; }
#wrapwrap #wrap.cdp .cdp-cierre > .cdp-env > p { margin-top: 12px !important; color: var(--g) !important; font-size: 17px !important; }
#wrapwrap #wrap.cdp .cdp-firma--cierre { margin-top: 28px !important; font-size: 14px !important; }

/* Tabletas */
@media (max-width: 991px) {
  #wrapwrap #wrap.cdp .cdp-sec { padding: 44px 0 !important; }
  #wrapwrap #wrap.cdp .cdp-inicio { padding: 28px 0 40px !important; }
  #wrapwrap #wrap.cdp .cdp-inicio__rejilla { grid-template-columns: minmax(0, 1fr) !important; gap: 28px !important; }
  #wrapwrap #wrap.cdp .cdp-confianza { padding: 24px 0 !important; }
  #wrapwrap #wrap.cdp .cdp-confianza__lista { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 18px !important; }
  #wrapwrap #wrap.cdp .cdp-demo__item, #wrapwrap #wrap.cdp .cdp-demo__item--inv { grid-template-columns: minmax(0, 1fr) !important; gap: 16px !important; }
  #wrapwrap #wrap.cdp .cdp-demo__item--inv figure { order: 0 !important; }
  #wrapwrap #wrap.cdp .cdp-giros__lista { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  #wrapwrap #wrap.cdp .cdp-planes__lista { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  #wrapwrap #wrap.cdp .cdp-impl__pasos { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  #wrapwrap #wrap.cdp .cdp-tienda { padding-bottom: 44px !important; }
}
/* Celulares */
@media (max-width: 599px) {
  #wrapwrap #wrap.cdp .cdp-env { padding: 0 16px !important; }
  #wrapwrap #wrap.cdp .cdp-apoyo { font-size: 17px !important; }
  #wrapwrap #wrap.cdp .cdp-acciones .cdp-boton, #wrapwrap #wrap.cdp .cdp-demo__pie .cdp-boton,
  #wrapwrap #wrap.cdp .cdp-planes__pie .cdp-boton, #wrapwrap #wrap.cdp .cdp-tienda .cdp-boton { width: 100% !important; }
  #wrapwrap #wrap.cdp .cdp-wa { width: 100% !important; padding: 8px 12px !important; }
  #wrapwrap #wrap.cdp .cdp-confianza__lista { grid-template-columns: minmax(0, 1fr) !important; gap: 14px !important; }
  #wrapwrap #wrap.cdp .cdp-giros__lista { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px !important; }
  #wrapwrap #wrap.cdp .cdp-giros__lista a { padding: 10px 12px !important; font-size: 15px !important; }
  #wrapwrap #wrap.cdp .cdp-planes__lista { grid-template-columns: minmax(0, 1fr) !important; }
  #wrapwrap #wrap.cdp .cdp-impl__pasos { grid-template-columns: minmax(0, 1fr) !important; }
  #wrapwrap #wrap.cdp .cdp-tienda .cdp-env { width: calc(100% - 32px) !important; padding: 24px 20px !important; }
  #wrapwrap #wrap.cdp .cdp-cierre { padding: 48px 0 !important; }
}
@media (max-width: 359px) {
  #wrapwrap #wrap.cdp .cdp-giros__lista { grid-template-columns: minmax(0, 1fr) !important; }
}
@media (prefers-reduced-motion: reduce) {
  #wrapwrap #wrap.cdp *, #wrapwrap #wrap.cdp *::before, #wrapwrap #wrap.cdp *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; scroll-behavior: auto !important; }
}
