/* En Balance · Materia Clara — páginas de contenido (Nosotros, Retos, Contacto,
   Testimonios y formularios). Ver eb-paginas.php y SISTEMA.md §6 "Páginas".
   Se apoya en eb-inicio.css (secciones, destacado, testimonios, preguntas). */

.mc-pagina { --mc-alto-amanecer: 640px; min-height: 100vh; }
.mc-pagina [id] { scroll-margin-top: 89px; }
/* El tema le pone 120 px abajo a #main-content: con el aire del sistema, el cierre quedaba lejos del pie. */
#main-content.mc-pagina { padding-bottom: 0; }
.mc-pagina > .mc-secciones { padding-bottom: var(--mc-e6); }

/* ---- Cabeza: sobre el cielo, sin material ---- */
.mc-pag-cabeza { position: relative; z-index: 2; display: flex; flex-direction: column; align-items: flex-start; gap: var(--mc-e3); padding-top: var(--mc-e5); }
.mc-pag-cabeza .mc-rotulo { color: var(--mc-acento); }
.mc-pag-titulo { font-size: clamp(36px, 1.4rem + 2.6vw, 60px); max-width: 17ch; }
.mc-pag-cabeza .mc-lede { max-width: 52ch; }

/* ---- Introducción de una sección ---- */

/* Título pequeño de tarjeta o razón */
.mc-mundo .mc-razon-titulo { margin: 0; font-family: var(--mc-fuente); font-size: 18px; font-weight: 700; line-height: 1.25; letter-spacing: -.015em; color: var(--mc-tinta); text-wrap: balance; }


/* ---- Tres razones con icono (sobre el suelo) ---- */
.mc-razon .mc-texto, .mc-incluye .mc-texto, .mc-recorrido .mc-texto { font-size: 15px; color: var(--mc-texto-2); }

.mc-razones { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--mc-e4); }
.mc-razon { display: grid; grid-template-columns: 44px minmax(0, 1fr); column-gap: var(--mc-e3); row-gap: var(--mc-e1); align-items: start; align-content: start; }
.mc-razon .mc-icono { grid-row: span 2; color: var(--mc-acento); }
.mc-razon .mc-razon-titulo { padding-top: 11px; }


/* ============================================================ CONTACTO
   "¿En qué te ayudamos?": la página que resuelve. Luz de mediodía sereno: verde salvia arriba
   (el único cielo verde: calma, "todo va a estar bien"), sol alto al centro, halos suaves. */
body.mc-pagina-contacto, body.mc-pagina-contacto .mc-mundo {   /* también en body: el rebote y el fondo general */
  --mc-cielo-1: #cde5d9;
  --mc-cielo-2: #e5f0ea;
  --mc-horizonte: #f1efe3;
  --mc-bruma: #f0f1ea;
  --mc-linea-horizonte: rgba(255, 255, 250, .6);
  --mc-halo-1: rgba(150, 214, 178, .5);    /* salvia */
  --mc-halo-2: var(--mc-halo-cielo);
  --mc-halo-3: rgba(78, 203, 217, .36);
  --mc-halo-4: rgba(150, 214, 178, .4);
}
body.mc-pagina-contacto .mc-sol {
  background:
    radial-gradient(640px 380px at 52% 4%, rgba(255, 253, 244, .95), transparent 70%),
    radial-gradient(130% 70px at 50% 68.4%, var(--mc-linea-horizonte), transparent 75%);
}
.mc-hola-heroe { position: relative; display: grid; gap: var(--mc-e5); align-items: center; padding-top: var(--mc-e4); }
.mc-hola-heroe-texto { position: relative; z-index: 2; display: flex; flex-direction: column; align-items: flex-start; gap: var(--mc-e3); }
.mc-hola-heroe-texto .mc-lede { max-width: 42ch; }

/* El ayudante: opciones como píldoras; la guía (tinta) se desliza a la elegida */
.mc-ayuda { position: relative; z-index: 2; padding: var(--mc-e4); display: flex; flex-direction: column; gap: var(--mc-e3); }
.mc-ayuda-opciones { display: flex; flex-wrap: wrap; gap: var(--mc-e2); }
.mc-mundo button.mc-ayuda-opcion {
  min-height: 44px; padding: 0 var(--mc-e4) !important; margin: 0 !important; border: 0 !important; border-radius: var(--mc-r-pildora) !important;
  background: transparent !important; box-shadow: inset 0 0 0 1px rgba(22, 21, 20, .16) !important; color: var(--mc-tinta) !important;
  font: 600 14px/1 var(--mc-fuente) !important; letter-spacing: 0 !important; text-transform: none !important; cursor: pointer;
  transition: color .3s ease .08s, box-shadow .3s ease, background .2s ease;
}
.mc-mundo button.mc-ayuda-opcion:hover { background: rgba(255, 255, 255, .5) !important; }
.mc-mundo button.mc-ayuda-opcion.mc-activo { color: #fff !important; box-shadow: none !important; }
.mc-ayuda:not(.mc-js) button.mc-ayuda-opcion.mc-activo { background: var(--mc-tinta) !important; }   /* sin JS no hay guía */
.mc-mundo .mc-con-guia button.mc-ayuda-opcion.mc-activo:hover { background: transparent !important; }
.mc-ayuda-paneles { padding-top: var(--mc-e3); border-top: 1px solid var(--mc-filete); display: flex; flex-direction: column; gap: var(--mc-e4); }
/* Con JS, las respuestas comparten caja: la más alta marca el alto y nada salta al cambiar */
.mc-ayuda.mc-js .mc-ayuda-paneles { display: grid; }
.mc-ayuda.mc-js .mc-ayuda-panel { grid-area: 1 / 1; }
.mc-mundo .mc-ayuda.mc-js .mc-ayuda-panel[hidden] { display: flex !important; visibility: hidden; }
.mc-ayuda-panel { display: flex; flex-direction: column; align-items: flex-start; gap: var(--mc-e3); }
.mc-ayuda-panel .mc-texto { font-size: 16px; }
.mc-ayuda-acciones { display: flex; flex-wrap: wrap; align-items: center; gap: var(--mc-e3); }

/* Otras formas: sobre el suelo, entre filetes */
.mc-hola-canales { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--mc-e4); }
.mc-hola-canales li { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; }
.mc-hola-canales .mc-icono { margin-bottom: var(--mc-e2); color: var(--mc-acento); }
.mc-hola-canales .mc-icono svg { width: 20px; height: 20px; }
.mc-hola-canales b { font-size: 15px; }
.mc-hola-canales li > a:not(.mc-enlace) { font-size: 16px; font-weight: 600; font-variant-numeric: tabular-nums; }
.mc-hola-canales .mc-enlace { margin-top: var(--mc-e1); font-size: 14px; }

/* ============================================================ NOSOTROS
   "Quién está detrás": de la duda a la confianza. Su luz es la de la confianza:
   azul más profundo arriba (el color que más se asocia con confiar) y un horizonte
   verde salvia (salud), sin durazno: ni el celeste-durazno de la portada ni el
   turquesa-menta de Retos. La persona es la pieza protagonista; casi nada se mueve. */
body.mc-pagina-nosotros, body.mc-pagina-nosotros .mc-mundo {   /* también en body: el rebote del scroll y el fondo general toman su cielo */
  --mc-cielo-1: #b6cdea;
  --mc-cielo-2: #dbe5f2;
  --mc-horizonte: #e6edf3;   /* claro azulado: el salvia se leía como una franja verde cortada */
  --mc-bruma: #eef2f3;
  --mc-linea-horizonte: rgba(255, 255, 255, .55);
  --mc-halo-1: rgba(122, 164, 226, .42);   /* azul */
  --mc-halo-2: rgba(150, 206, 170, .55);   /* salvia */
  --mc-halo-3: var(--mc-halo-cielo);
  --mc-halo-4: rgba(122, 164, 226, .34);
}
/* Luz clara (no cálida), arriba a la derecha, detrás de la persona. */
body.mc-pagina-nosotros .mc-sol {
  background:
    radial-gradient(520px 420px at 80% 22%, rgba(250, 252, 255, .9), transparent 70%),
    radial-gradient(130% 70px at 50% 68.4%, var(--mc-linea-horizonte), transparent 75%);
}

/* Arranque: la promesa a la izquierda; la persona, en su carta, a la derecha */
.mc-nos-heroe { position: relative; display: grid; gap: var(--mc-e5); align-items: center; padding-top: var(--mc-e4); }
.mc-nos-heroe::before {   /* luz clara detrás de la carta (suave: Safari satura el cristal) */
  content: ""; position: absolute; z-index: 0; right: -6%; bottom: -8%; width: 540px; height: 540px; max-width: 110vw; pointer-events: none;
  background: radial-gradient(closest-side, rgba(214, 228, 248, .34), rgba(190, 212, 240, .12) 55%, transparent);
}
.mc-nos-heroe-texto { position: relative; z-index: 2; display: flex; flex-direction: column; align-items: flex-start; gap: var(--mc-e3); }
.mc-nos-heroe-texto .mc-display { max-width: 13ch; }
.mc-nos-heroe-texto .mc-lede { max-width: 42ch; }
.mc-nos-carta { position: relative; z-index: 2; margin: 0; padding: var(--mc-e3) var(--mc-e3) var(--mc-e4); display: flex; flex-direction: column; gap: var(--mc-e3); }
.mc-nos-foto { display: block; width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: var(--mc-r-pieza); }   /* 21 + 13 = 34 */
.mc-mundo blockquote.mc-nos-cita {
  margin: 0; padding: 0 var(--mc-e2); border: 0; background: none; font-style: normal; quotes: none;
  font-size: clamp(19px, .9rem + .8vw, 23px); font-weight: 600; line-height: 1.35; letter-spacing: -.015em; color: var(--mc-tinta); text-wrap: pretty;
}
.mc-mundo blockquote.mc-nos-cita::before, .mc-mundo blockquote.mc-nos-cita::after { content: none; display: none; }
.mc-nos-carta figcaption { display: flex; flex-direction: column; gap: 2px; padding: 0 var(--mc-e2); font-size: 16px; }

/* Señales de confianza, justo después de la persona: lo que reduce el riesgo, sin cristal */
.mc-nos-confianza { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--mc-e4) var(--mc-e3); }
.mc-nos-confianza li { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; }
.mc-nos-confianza .mc-icono { margin-bottom: var(--mc-e2); color: var(--mc-acento); }
.mc-nos-confianza .mc-icono svg { width: 20px; height: 20px; }
.mc-nos-confianza b { font-size: 15px; font-weight: 700; }
.mc-nos-confianza .mc-nota { line-height: 1.4; }

/* Lo que nos mueve: una frase grande y tres promesas entre filetes (sin cristal) */
.mc-nos-mision { display: grid; gap: var(--mc-e5); }
.mc-nos-mision-texto { display: flex; flex-direction: column; gap: var(--mc-e3); }
.mc-nos-grande { margin: 0; font-size: clamp(26px, 1.1rem + 1.8vw, 42px); font-weight: 700; line-height: 1.12; letter-spacing: -.035em; text-wrap: balance; max-width: 22ch; }
.mc-nos-promesas { list-style: none; margin: 0; padding: 0; display: grid; }
.mc-nos-promesas li { display: flex; flex-direction: column; gap: var(--mc-e1); padding: var(--mc-e4) 0; border-top: 1px solid var(--mc-filete); }
.mc-nos-promesas li:last-child { border-bottom: 1px solid var(--mc-filete); }
.mc-nos-promesas .mc-texto { font-size: 15px; color: var(--mc-texto-2); }

/* Lo que sí y lo que nunca: un cristal, dos columnas; el "nunca" más callado */
.mc-nos-si-no { display: grid; padding: var(--mc-e2) var(--mc-e4); }
.mc-nos-si, .mc-nos-no { display: flex; flex-direction: column; gap: var(--mc-e2); padding: var(--mc-e4) 0; }
.mc-nos-no { border-top: 1px solid var(--mc-filete); }
.mc-nos-si .mc-rotulo { color: var(--mc-acento); }
.mc-nos-no .mc-rotulo { color: var(--mc-texto-3); }
.mc-nos-si-no ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--mc-e3); }
.mc-nos-si-no li { display: flex; align-items: flex-start; gap: var(--mc-e2); font-size: 16px; line-height: 1.45; }
.mc-nos-si-no svg { flex: none; margin-top: 2px; }
.mc-nos-si li { font-weight: 500; }
.mc-nos-si svg { color: var(--mc-acento); }
.mc-nos-no li { color: var(--mc-texto-2); }
.mc-nos-no svg { color: var(--mc-texto-3); margin-top: 3px; }

/* La prueba: la foto del laboratorio y, sobre ella, el cristal (toma el color de la foto) */
.mc-nos-prueba { position: relative; margin: 0; display: flex; flex-direction: column; }
.mc-nos-prueba-foto { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--mc-r-panel); }
.mc-nos-prueba-texto { position: relative; margin: calc(-1 * var(--mc-e6)) var(--mc-e3) 0; padding: var(--mc-e4); display: flex; flex-direction: column; align-items: flex-start; gap: var(--mc-e2); }
.mc-nos-prueba-texto .mc-texto { color: var(--mc-texto-2); font-size: 15px; }

/* Una voz: la cita grande, sobre el suelo */
.mc-nos-voz { display: flex; flex-direction: column; align-items: flex-start; gap: var(--mc-e3); }
.mc-mundo blockquote.mc-nos-cita--voz { padding: 0; max-width: 30ch; font-size: clamp(22px, 1rem + 1.5vw, 34px); font-weight: 700; line-height: 1.2; letter-spacing: -.03em; text-wrap: balance; }
.mc-nos-voz .mc-nota { font-size: 14px; }

/* Dos puertas: "ya sé lo que busco" / "quiero que me orienten" */
.mc-nos-puertas { display: grid; gap: var(--mc-e3); }
.mc-nos-puerta { padding: var(--mc-e5) var(--mc-e4); display: flex; flex-direction: column; align-items: flex-start; gap: var(--mc-e2); }
.mc-nos-puerta .mc-rotulo { color: var(--mc-acento); }
.mc-nos-puerta .mc-texto { color: var(--mc-texto-2); }
.mc-nos-puerta .mc-boton { margin-top: var(--mc-e3); }

/* ========================================================= TESTIMONIOS
   "Voces": la prueba de que alguien como tú lo logró. Luz de tarde rosada-lila
   (calidez humana, distinta a todas): cada voz con quién es y su resultado en negritas. */
body.mc-pagina-testimonios, body.mc-pagina-testimonios .mc-mundo {   /* también en body: el rebote del scroll y el fondo general toman su cielo */
  --mc-cielo-1: #dcd6ec;
  --mc-cielo-2: #ebe6f1;
  --mc-horizonte: #f5e2e2;
  --mc-bruma: #f4ecec;
  --mc-linea-horizonte: rgba(255, 240, 240, .7);
  --mc-halo-1: rgba(232, 164, 186, .38);   /* rosa */
  --mc-halo-2: rgba(176, 160, 226, .38);   /* lila */
  --mc-halo-3: var(--mc-halo-menta);
  --mc-halo-4: rgba(240, 180, 150, .3);    /* durazno, apenas */
}
body.mc-pagina-testimonios .mc-sol {
  background:
    radial-gradient(480px 380px at 78% 30%, rgba(255, 244, 246, .9), transparent 70%),
    radial-gradient(130% 70px at 50% 68.4%, var(--mc-linea-horizonte), transparent 75%);
}
.mc-voz-heroe { position: relative; display: grid; gap: var(--mc-e5); align-items: center; padding-top: var(--mc-e4); }
.mc-voz-heroe-texto { position: relative; z-index: 2; display: flex; flex-direction: column; align-items: flex-start; gap: var(--mc-e3); }
.mc-voz-heroe-texto .mc-display { max-width: 12ch; }
/* La voz que manda: grande, con su comilla en acento */
.mc-voz-destacada { position: relative; z-index: 2; margin: 0; padding: var(--mc-e5) var(--mc-e4) var(--mc-e4); display: flex; flex-direction: column; gap: var(--mc-e4); }
.mc-voz-comillas { position: absolute; top: var(--mc-e2); left: var(--mc-e4); font-size: 89px; font-weight: 700; line-height: 1; color: var(--mc-acento); opacity: .22; }
.mc-mundo blockquote.mc-voz-cita {
  position: relative; margin: 0; padding: var(--mc-e3) 0 0; border: 0; background: none; font-style: normal; quotes: none;
  font-size: clamp(20px, .95rem + 1vw, 26px); font-weight: 500; line-height: 1.4; letter-spacing: -.015em; color: var(--mc-tinta); text-wrap: pretty;
}
.mc-mundo blockquote.mc-voz-cita::before, .mc-mundo blockquote.mc-voz-cita::after { content: none; display: none; }
.mc-voz-cita b, .mc-voz blockquote b { font-weight: 700; color: var(--mc-tinta); background: linear-gradient(transparent 62%, rgba(31, 116, 128, .16) 62%); }
/* Quién lo dice: iniciales en círculo (sin foto no se inventa una cara), nombre y edad */
.mc-voz-quien { display: flex; align-items: center; gap: var(--mc-e3); }
.mc-voz-quien > span:last-child { display: flex; flex-direction: column; gap: 1px; font-size: 15px; }
.mc-voz-inicial {
  flex: none; width: 44px; height: 44px; display: grid; place-items: center; border-radius: var(--mc-r-pildora);
  background: rgba(31, 116, 128, .1); color: var(--mc-acento); font-size: 14px; font-weight: 700; letter-spacing: .02em;
}
.mc-voces { display: grid; gap: var(--mc-e3); align-items: start; }
.mc-voz { margin: 0; padding: var(--mc-e4); display: flex; flex-direction: column; gap: var(--mc-e3); }
/* Contar la tuya: tres pasos reales (el formulario los pide en ese orden) */
.mc-voz-pasos { list-style: none; counter-reset: paso; margin: var(--mc-e2) 0 0; padding: 0; display: flex; flex-direction: column; gap: var(--mc-e3); }
.mc-voz-pasos li { counter-increment: paso; position: relative; padding-left: 47px; display: flex; flex-direction: column; gap: 2px; font-size: 15px; }
.mc-voz-pasos li::before {
  content: counter(paso); position: absolute; left: 0; top: -2px; width: 34px; height: 34px; display: grid; place-items: center;
  border-radius: var(--mc-r-pildora); box-shadow: inset 0 0 0 1.5px var(--mc-tinta); font-size: 14px; font-weight: 700;
}
.mc-voz-pasos .mc-nota a { color: var(--mc-acento) !important; font-weight: 600; }

/* =============================================================== RETOS
   "Tu día 1": una línea de salida. Energía sin salir del sistema:
   · la luz: media mañana (la portada es el amanecer): cielo claro, sin franja naranja,
     el sol alto a la derecha, detrás del pase; los halos en otro orden y frescos;
   · la escala: el 90 grande, el podio con tres alturas;
   · el movimiento lo pone quien lee: el anillo y el recorrido avanzan al bajar. */
body.mc-pagina-retos, body.mc-pagina-retos .mc-mundo {   /* también en body: el rebote del scroll y el fondo general toman su cielo */
  --mc-cielo-1: #c3e1ef;
  --mc-cielo-2: #dff0f5;
  --mc-horizonte: #e6f3ee;
  --mc-bruma: #edf4f0;
  --mc-linea-horizonte: rgba(255, 255, 255, .6);
  --mc-halo-1: rgba(78, 203, 217, .4);     /* agua, más tenue y esparcida */
  --mc-halo-2: rgba(159, 220, 175, .52);   /* menta */
  --mc-halo-3: rgba(168, 214, 236, .5);    /* cielo */
  --mc-halo-4: rgba(240, 168, 112, .2);    /* el durazno, apenas */
}
body.mc-pagina-retos .mc-sol {
  background:
    radial-gradient(1000px 560px at 76% 6%, rgba(255, 251, 238, .78), transparent 72%),
    radial-gradient(130% 70px at 50% 68.4%, var(--mc-linea-horizonte), transparent 75%);
}
.mc-centro { align-items: center; text-align: center; }

/* Arranque: texto a la izquierda, el pase del Kick90 a la derecha */
.mc-reto-heroe { position: relative; display: grid; gap: var(--mc-e5); align-items: center; padding-top: var(--mc-e4); }
/* Luz fresca detrás del pase (menta y agua): el cristal la toma (la luz atrapada), no se pinta. */
.mc-reto-heroe::before {
  content: ""; position: absolute; z-index: 0; right: -14%; bottom: -24%; width: 920px; height: 720px; max-width: 130vw; pointer-events: none;
  background: radial-gradient(closest-side, rgba(176, 232, 222, .2), rgba(120, 212, 222, .06) 60%, transparent);
}
.mc-reto-heroe-texto { position: relative; z-index: 2; display: flex; flex-direction: column; align-items: flex-start; gap: var(--mc-e3); }
.mc-reto-heroe-texto .mc-lede { max-width: 44ch; }
.mc-mundo a.mc-reto-otra { display: inline-flex; align-items: center; gap: var(--mc-e1); font-size: 15px; font-weight: 600; color: var(--mc-texto-2); }
.mc-mundo a.mc-reto-otra:hover { color: var(--mc-acento); }
.mc-reto-otra svg { width: 16px; height: 16px; transform: rotate(90deg); transition: transform .3s var(--mc-curva-layout); }
.mc-reto-otra:hover svg { transform: rotate(90deg) translateX(3px); }

.mc-pase { position: relative; z-index: 2; padding: var(--mc-e4); display: flex; flex-direction: column; gap: var(--mc-e4); }
.mc-pase-cabeza { display: flex; justify-content: space-between; align-items: center; }
.mc-pase-cabeza .mc-rotulo { color: var(--mc-acento); }
.mc-pase-pie { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--mc-e3); padding-top: var(--mc-e3); border-top: 1px solid var(--mc-filete); }
.mc-pase-pie > span { display: flex; flex-direction: column; gap: 2px; }
.mc-pase-pie b { font-size: 16px; font-weight: 700; font-variant-numeric: tabular-nums; }

/* El anillo de 90 días: pista, avance (empieza en el día 1) y marcas de los días 1, 30 y 60 */
.mc-anillo { position: relative; width: min(100%, 256px); aspect-ratio: 1; margin: 0 auto; }
.mc-anillo svg { display: block; width: 100%; height: 100%; overflow: visible; }
.mc-anillo-pista, .mc-anillo-avance { fill: none; stroke-width: 14; }
.mc-anillo-pista { stroke: rgba(22, 21, 20, .08); }
.mc-anillo-avance {
  stroke: var(--mc-acento); stroke-linecap: round; stroke-dasharray: 100 100; stroke-dashoffset: 99;
  transform-box: view-box; transform-origin: 50% 50%; transform: rotate(-90deg);
}
.mc-anillo--lleno .mc-anillo-avance { stroke-dashoffset: 0; }
.mc-anillo-marca { fill: #fff; }
.mc-anillo-centro { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--mc-e1); }
.mc-anillo-centro b { font-size: clamp(76px, 2rem + 5vw, 104px); font-weight: 700; line-height: .85; letter-spacing: -.06em; font-variant-numeric: tabular-nums; }
.mc-anillo-centro span { font-size: 12px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--mc-texto-2); }

/* Qué te llevas: un solo cristal con tres celdas (no tres tarjetas iguales) */
.mc-incluye { display: grid; padding: 0 var(--mc-e4); }
.mc-incluye-celda { display: grid; grid-template-columns: 44px minmax(0, 1fr); column-gap: var(--mc-e3); row-gap: var(--mc-e1); align-content: start; padding: var(--mc-e4) 0; }
.mc-incluye-celda + .mc-incluye-celda { border-top: 1px solid var(--mc-filete); }
.mc-incluye-icono { grid-row: span 2; width: 44px; height: 44px; display: grid; place-items: center; border-radius: var(--mc-r-pildora); color: var(--mc-acento); box-shadow: inset 0 0 0 1px rgba(31, 116, 128, .28); }
.mc-incluye-icono svg { width: 20px; height: 20px; }
.mc-incluye .mc-razon-titulo { padding-top: 11px; }

/* El podio: tres alturas en proporción áurea (1 · 1.272 · 1.618); el 1 en acento */
.mc-podio { --mc-escalon: 110px; list-style: none; margin: 0 auto; padding: 0; width: 100%; max-width: 760px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: end; gap: var(--mc-e2); }
.mc-podio li { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: var(--mc-e4) var(--mc-e2) var(--mc-e3); text-align: center; }
.mc-podio-1 { order: 2; min-height: calc(var(--mc-escalon) * 1.618); }
.mc-podio-2 { order: 1; min-height: calc(var(--mc-escalon) * 1.272); }
.mc-podio-3 { order: 3; min-height: var(--mc-escalon); }
.mc-podio-lugar { margin-bottom: auto; font-size: clamp(34px, 1.2rem + 2.6vw, 55px); font-weight: 700; line-height: 1; letter-spacing: -.05em; }
.mc-podio-1 .mc-podio-lugar { color: var(--mc-acento); }
.mc-podio-monto { margin-top: var(--mc-e3); font-size: clamp(16px, .8rem + 1vw, 26px); font-weight: 700; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.mc-podio .mc-nota { font-size: 13px; }
/* Al llegar: los escalones suben del 3 al 1 */
.mc-podio.mc-aparece { opacity: 1; transform: none; }
.mc-podio.mc-aparece li { opacity: 0; transform: translateY(34px); }
.mc-podio.mc-aparecio li { opacity: 1; transform: none; transition: transform .56s var(--mc-curva-layout), opacity .42s ease; }
.mc-podio.mc-aparecio .mc-podio-2 { transition-delay: .09s; }
.mc-podio.mc-aparecio .mc-podio-1 { transition-delay: .18s; }

/* Tu recorrido: la línea se llena mientras bajas; cada punto se enciende al alcanzarlo */
.mc-recorrido { --mc-avance: 0; --mc-linea-ini: 0px; --mc-linea-largo: 0px; position: relative; list-style: none; margin: 0; padding: 0; display: grid; gap: var(--mc-e5); }
.mc-recorrido::before, .mc-recorrido::after {
  content: ""; position: absolute; left: 8px; top: calc(var(--mc-linea-ini) + 10px); width: 2px; height: var(--mc-linea-largo);
  border-radius: 2px; background: rgba(22, 21, 20, .1);
}
.mc-recorrido::after { background: var(--mc-acento); transform-origin: 50% 0; transform: scaleY(var(--mc-avance)); }
.mc-recorrido li { position: relative; z-index: 1; padding-left: var(--mc-e5); display: flex; flex-direction: column; gap: var(--mc-e1); }
.mc-recorrido li::before {
  content: ""; position: absolute; left: 0; top: 1px; width: 18px; height: 18px; border-radius: 50%;
  background: #fff; box-shadow: inset 0 0 0 2px rgba(22, 21, 20, .18); transition: background .3s ease, box-shadow .3s ease;
}
.mc-recorrido li.mc-alcanzado::before { background: var(--mc-acento); box-shadow: inset 0 0 0 2px var(--mc-acento), 0 0 0 5px rgba(31, 116, 128, .16); }
.mc-recorrido-dia { font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--mc-acento); }
.mc-recorrido .mc-texto { max-width: 34ch; }

/* Cierre: el anillo ya completo y el cristal con luz fresca detrás */
.mc-reto-final { position: relative; }
.mc-reto-final::before {
  content: ""; position: absolute; left: 50%; top: 50%; width: min(96vw, 820px); height: 480px; transform: translate(-50%, -50%); pointer-events: none;
  background: radial-gradient(closest-side, rgba(176, 232, 222, .2), rgba(120, 212, 222, .06) 60%, transparent);
}
.mc-reto-cierre { position: relative; display: grid; justify-items: center; gap: var(--mc-e4); padding: var(--mc-e5) var(--mc-e4); text-align: center; }
.mc-reto-cierre .mc-anillo { width: 144px; }
.mc-reto-cierre .mc-anillo-centro b { font-size: 48px; }
.mc-reto-cierre .mc-anillo-centro span { font-size: 11px; }
.mc-reto-cierre-texto { display: flex; flex-direction: column; align-items: center; gap: var(--mc-e3); }
.mc-reto-cierre-texto .mc-lede { max-width: 46ch; }
.mc-reto-cierre .mc-heroe-botones { justify-content: center; }

/* Objetivos: vitrina chica 13 + 8 de relleno = cristal 21 */
.mc-objetivos { display: grid; gap: var(--mc-e3); }
.mc-mundo a.mc-objetivo { padding: var(--mc-e2); display: grid; grid-template-columns: 104px minmax(0, 1fr); gap: var(--mc-e3); align-items: center; color: var(--mc-tinta); }
.mc-objetivo-texto { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; padding: var(--mc-e2) var(--mc-e2) var(--mc-e2) 0; }
.mc-objetivo .mc-texto { font-size: 14px; line-height: 1.45; color: var(--mc-texto-2); }
.mc-objetivo-ir { display: inline-flex; align-items: center; gap: var(--mc-e1); margin-top: var(--mc-e1); font-size: 14px; font-weight: 600; color: var(--mc-acento); }
.mc-objetivo-ir svg { width: 16px; height: 16px; transition: transform .3s var(--mc-curva-layout); }
.mc-objetivo:hover .mc-objetivo-ir svg { transform: translateX(3px); }

/* ---- Cierre ---- */
.mc-pag-cierre { padding: var(--mc-e5) var(--mc-e4); display: flex; flex-direction: column; align-items: flex-start; gap: var(--mc-e3); }
.mc-pag-cierre .mc-lede { max-width: 52ch; }

/* ---- Contacto: atajos ---- */
.mc-atajos-lista { display: flex; flex-direction: column; }
.mc-atajos-lista .mc-h2 { margin-bottom: var(--mc-e3); }
.mc-atajos-lista .mc-fila:last-child { border-bottom: 1px solid var(--mc-filete); }
.mc-atajos-lista .mc-fila svg { width: 18px; height: 18px; color: var(--mc-texto-3); transition: transform .3s var(--mc-curva-layout), color .2s ease; }
.mc-atajos-lista .mc-fila:hover svg { color: var(--mc-acento); transform: translateX(3px); }

/* ---- Formularios (WPForms), con los mismos campos que el pago ---- */
.mc-pag-forma { padding: var(--mc-e4); }
.mc-pag-solo-forma { display: flex; flex-direction: column; gap: var(--mc-e3); max-width: 680px; }
.mc-pag-solo-forma > .mc-nota a { color: var(--mc-acento) !important; font-weight: 600; }
.mc-mundo .mc-pag-forma .wpforms-container {
  --wpforms-field-border-radius: var(--mc-r-campo);
  --wpforms-field-background-color: rgba(255, 255, 255, .72);
  --wpforms-field-border-color: rgba(22, 21, 20, .14);
  --wpforms-field-border-color-spare: rgba(22, 21, 20, .14);
  --wpforms-field-text-color: var(--mc-tinta);
  --wpforms-field-menu-color: #fff;
  --wpforms-label-color: var(--mc-texto-2);
  --wpforms-label-sublabel-color: var(--mc-texto-3);
  --wpforms-label-error-color: #a8402d;
  --wpforms-button-border-radius: var(--mc-r-pildora);
  --wpforms-button-background-color: var(--mc-acento);
  --wpforms-button-border-color: var(--mc-acento);
  --wpforms-button-text-color: #fff;
  --wpforms-field-size-input-height: 48px;
  --wpforms-field-size-input-spacing: 13px;
  --wpforms-field-size-font-size: 16px;
  --wpforms-field-size-padding-h: 13px;
  --wpforms-field-size-checkbox-size: 18px;
  --wpforms-field-size-sublabel-spacing: 5px;
  --wpforms-label-size-font-size: 13px;
  --wpforms-label-size-line-height: 18px;
  --wpforms-label-size-sublabel-font-size: 12px;
  --wpforms-label-size-sublabel-line-height: 16px;
  --wpforms-button-size-height: 48px;
  --wpforms-button-size-font-size: 15px;
  --wpforms-button-size-padding-h: 34px;
  --wpforms-button-size-margin-top: 8px;
  margin: 0; font-family: var(--mc-fuente); -webkit-hyphens: manual; hyphens: manual;
}
.mc-mundo .mc-pag-forma .wpforms-container .wpforms-form .wpforms-field { padding: 0 0 var(--mc-e4); }
.mc-mundo .mc-pag-forma .wpforms-container .wpforms-form .wpforms-field-label { font-weight: 600; }
/* WPForms parte las palabras con guion ("histo-ria"): aquí, nunca. */
.mc-mundo .mc-pag-forma .wpforms-container .wpforms-form :is(label, legend, .wpforms-field-label, .wpforms-field-label-inline) { -webkit-hyphens: manual !important; hyphens: manual !important; word-break: normal !important; overflow-wrap: normal !important; }
.mc-mundo .mc-pag-forma .wpforms-container .wpforms-form .wpforms-field-label-inline { font-size: 15px; font-weight: 500; color: var(--mc-tinta); }
.mc-mundo .mc-pag-forma .wpforms-container .wpforms-form .wpforms-required-label { color: var(--mc-texto-3) !important; font-weight: 400; }
/* Todo a lo ancho; nombre y apellido lado a lado */
.mc-mundo .mc-pag-forma .wpforms-container .wpforms-form .wpforms-field-medium { max-width: 100% !important; }
/* La fila ya es flex (WPForms). Sin gap: dentro del fieldset, Chrome en celular dejaba de dibujar los campos. */
.mc-mundo .mc-pag-forma .wpforms-container .wpforms-form .wpforms-field-row::before, .mc-mundo .mc-pag-forma .wpforms-container .wpforms-form .wpforms-field-row::after { content: none; display: none; }
.mc-mundo .mc-pag-forma .wpforms-container .wpforms-form .wpforms-field-row-block { flex: 1 1 0; min-width: 0; width: auto; float: none; margin: 0; padding: 0; }
.mc-mundo .mc-pag-forma .wpforms-container .wpforms-form .wpforms-field-row-block + .wpforms-field-row-block { margin-left: var(--mc-e3); }
.mc-mundo .mc-pag-forma .wpforms-container .wpforms-form ul li { margin-bottom: var(--mc-e2); display: flex; align-items: flex-start; gap: var(--mc-e2); }
.mc-mundo .mc-pag-forma .wpforms-container .wpforms-form input[type="radio"] {
  -webkit-appearance: radio; appearance: auto; position: static; opacity: 1; width: 18px; height: 18px; margin: 2px 0 0; flex: none; accent-color: var(--mc-acento);
}
.mc-mundo .mc-pag-forma .wpforms-container .wpforms-form input[type="radio"]::before,
.mc-mundo .mc-pag-forma .wpforms-container .wpforms-form input[type="radio"]::after { content: none; display: none; }
.mc-mundo .mc-pag-forma .wpforms-container .wpforms-form input:is([type="text"], [type="email"], [type="number"], [type="tel"]):focus { background: #fff; }
.mc-mundo .mc-pag-forma .wpforms-container .wpforms-form .wpforms-submit-container { padding-top: var(--mc-e2); }
.mc-mundo .mc-pag-forma .wpforms-container .wpforms-form button.wpforms-submit {
  min-height: 48px; padding: 0 var(--mc-e5) !important; border: 0 !important; border-radius: var(--mc-r-pildora) !important; box-shadow: none !important;
  background: var(--mc-acento) !important; color: #fff !important; font: 600 15px/1 var(--mc-fuente) !important; letter-spacing: 0 !important; text-transform: none !important;
  transition: background .2s ease, transform .16s ease-out;
}
.mc-mundo .mc-pag-forma .wpforms-container .wpforms-form button.wpforms-submit:hover { background: var(--mc-acento-hover) !important; }
.mc-mundo .mc-pag-forma .wpforms-container .wpforms-form button.wpforms-submit:active { transform: scale(.96); }
.mc-mundo .mc-pag-forma .wpforms-confirmation-container-full {
  margin: 0; padding: var(--mc-e4); border: 0; border-radius: var(--mc-r-pieza); background: rgba(255, 255, 255, .6); color: var(--mc-tinta); font-size: 16px;
}

/* ---- Tableta y escritorio ---- */
@media (min-width: 768px) {
  .mc-objetivos { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--mc-e4); }
  .mc-razones { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--mc-e5); }
  .mc-razon { grid-template-columns: minmax(0, 1fr); row-gap: var(--mc-e2); }
  .mc-razon .mc-icono { grid-row: auto; }
  .mc-razon .mc-razon-titulo { padding-top: var(--mc-e2); }
  .mc-mundo a.mc-objetivo { grid-template-columns: 144px minmax(0, 1fr); gap: var(--mc-e4); }
  .mc-pag-forma { padding: var(--mc-e5); }
}
@media (min-width: 1024px) {
  .mc-pagina { --mc-alto-amanecer: 760px; }
  .mc-pag-cabeza { padding-top: var(--mc-e6); }
  .mc-pag-cierre { padding: var(--mc-e6); align-items: center; text-align: center; }
  .mc-pag-cierre .mc-heroe-botones { justify-content: center; }
  /* Contacto */
  .mc-hola-heroe { grid-template-columns: minmax(0, 1fr) 460px; gap: var(--mc-e6); padding-top: var(--mc-e5); }
  .mc-ayuda { padding: var(--mc-e5); }
  .mc-hola-canales { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--mc-e5); padding: var(--mc-e4) 0; border-top: 1px solid var(--mc-filete); border-bottom: 1px solid var(--mc-filete); }
  /* Testimonios */
  .mc-voz-heroe { grid-template-columns: minmax(0, 1fr) 460px; gap: var(--mc-e6); padding-top: var(--mc-e5); }
  .mc-voz-destacada { padding: var(--mc-e6) var(--mc-e5) var(--mc-e5); }
  .mc-voz-comillas { left: var(--mc-e5); top: var(--mc-e3); }
  .mc-voces { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--mc-e4); }
  /* Nosotros */
  .mc-nos-heroe { grid-template-columns: minmax(0, 1fr) 400px; gap: var(--mc-e6); padding-top: var(--mc-e5); }
  .mc-nos-confianza { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--mc-e5); padding: var(--mc-e4) 0; border-top: 1px solid var(--mc-filete); border-bottom: 1px solid var(--mc-filete); }
  .mc-nos-mision { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: var(--mc-e6); align-items: start; }
  .mc-nos-si-no { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: var(--mc-e5) 0; }
  .mc-nos-si, .mc-nos-no { padding: 0 var(--mc-e5); }
  .mc-nos-no { border-top: 0; border-left: 1px solid var(--mc-filete); }
  .mc-nos-prueba-foto { aspect-ratio: 21 / 9; }
  .mc-nos-prueba-texto { position: absolute; left: var(--mc-e5); bottom: var(--mc-e5); margin: 0; max-width: 420px; padding: var(--mc-e5); }
  .mc-nos-puertas { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--mc-e4); }
  /* Retos */
  .mc-reto-heroe { grid-template-columns: minmax(0, 1fr) 420px; gap: var(--mc-e6); padding-top: var(--mc-e5); }
  .mc-pase { padding: var(--mc-e5); }
  .mc-incluye { grid-template-columns: repeat(3, minmax(0, 1fr)); padding: var(--mc-e5) 0; }
  .mc-incluye-celda { grid-template-columns: minmax(0, 1fr); row-gap: var(--mc-e2); padding: 0 var(--mc-e5); }
  .mc-incluye-celda + .mc-incluye-celda { border-top: 0; border-left: 1px solid var(--mc-filete); }
  .mc-incluye-icono { grid-row: auto; }
  .mc-incluye .mc-razon-titulo { padding-top: var(--mc-e2); }
  .mc-podio { --mc-escalon: 144px; gap: var(--mc-e3); }
  .mc-recorrido { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--mc-e5); }
  .mc-recorrido::before, .mc-recorrido::after { left: calc(var(--mc-linea-ini) + 10px); top: 8px; width: var(--mc-linea-largo); height: 2px; }
  .mc-recorrido::after { transform-origin: 0 50%; transform: scaleX(var(--mc-avance)); }
  .mc-recorrido li { padding: var(--mc-e5) 0 0; }
  .mc-reto-cierre { grid-template-columns: 233px minmax(0, 1fr); justify-items: start; gap: var(--mc-e6); padding: var(--mc-e6); text-align: left; }
  .mc-reto-cierre .mc-anillo { width: 233px; }
  .mc-reto-cierre .mc-anillo-centro b { font-size: 76px; }
  .mc-reto-cierre-texto { align-items: flex-start; }
  .mc-reto-cierre .mc-heroe-botones { justify-content: flex-start; }
  .mc-comparte { align-items: start; }
  .mc-comparte .mc-pag-intro { position: sticky; top: 110px; }
}

/* ============================================================ ARMA TU PLAN
   Una consulta, no un formulario (mc-pagina-plan.php + eb-plan.js). Su luz es el primer rayo: un
   comienzo. Cielo lavanda muy claro arriba, horizonte de oro pálido, y un rayo cálido que entra por
   la izquierda, detrás de quien te va a responder. Distinta del amanecer celeste-durazno de la
   portada y de la tarde rosada de Testimonios. */
body.mc-pagina-plan, body.mc-pagina-plan .mc-mundo {
  /* difuminado: el lavanda se aclara hacia el oro sin franja (antes #d3d9f0 se leía como línea) */
  --mc-cielo-1: #dfe3f4;
  --mc-cielo-2: #eceaf2;
  --mc-horizonte: #f6ecdc;
  --mc-bruma: #f4f1ec;
  --mc-linea-horizonte: rgba(255, 250, 240, .6);
  --mc-halo-1: rgba(250, 214, 150, .34);   /* oro del primer rayo */
  --mc-halo-2: rgba(176, 188, 236, .24);   /* lavanda */
  --mc-halo-3: rgba(132, 206, 210, .22);   /* un toque del acento */
  --mc-halo-4: rgba(250, 214, 150, .22);
}
body.mc-pagina-plan .mc-sol {
  background:
    radial-gradient(760px 560px at 14% 30%, rgba(255, 244, 222, .85), transparent 70%),
    radial-gradient(130% 70px at 50% 68.4%, var(--mc-linea-horizonte), transparent 75%);
}

.mc-plan { display: grid; gap: var(--mc-e5); padding-top: var(--mc-e4); align-items: start; }
.mc-plan-lado { display: flex; flex-direction: column; align-items: flex-start; gap: var(--mc-e3); }
.mc-plan-lado .mc-display { font-size: clamp(34px, 7.4vw, 56px); }
.mc-plan-persona { margin: var(--mc-e2) 0 0; display: flex; align-items: center; gap: var(--mc-e3); }
.mc-plan-persona img { flex: none; width: 56px; height: 56px; border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 3px rgba(255, 255, 255, .8), 0 10px 20px -12px rgba(22, 21, 20, .35); }
.mc-plan-persona figcaption { display: flex; flex-direction: column; gap: 2px; }
.mc-plan-persona b { font-size: 16px; }
.mc-plan-confianza { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--mc-e2) var(--mc-e4); }
.mc-plan-confianza li { display: flex; align-items: center; gap: var(--mc-e2); font-size: 14px; color: var(--mc-texto-2); }
.mc-plan-confianza svg { width: 18px; height: 18px; color: var(--mc-acento); flex: none; }

/* La caja: arriba, atrás · paso · siguiente, y una línea de avance que se llena */
.mc-plan-caja { position: relative; }
.mc-plan-cabeza { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: var(--mc-e2); margin-bottom: var(--mc-e4); }
.mc-plan-paso { grid-column: 2; font-size: 13px; font-weight: 600; color: var(--mc-texto-3); font-variant-numeric: tabular-nums; }
.mc-mundo .mc-plan-cabeza button {
  height: 36px; padding: 0 var(--mc-e2) !important; margin: 0 !important; border: 0 !important; border-radius: var(--mc-r-pildora) !important;
  background: transparent !important; box-shadow: none !important; color: var(--mc-acento) !important;
  font: 600 14px var(--mc-fuente); letter-spacing: 0; text-transform: none; cursor: pointer;
}
.mc-mundo .mc-plan-cabeza button:hover { background: rgba(255, 255, 255, .6) !important; }
.mc-plan-atras { grid-column: 1; justify-self: start; }
.mc-plan-sigue-btn { grid-column: 3; justify-self: end; }
.mc-plan-barra { grid-column: 1 / -1; display: block; height: 4px; border-radius: var(--mc-r-pildora); background: rgba(22, 21, 20, .07); overflow: hidden; }
.mc-plan-barra span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #5bb8c1, var(--mc-acento)); transform-origin: left; transform: scaleX(.2); transition: transform .6s var(--mc-curva-layout); }

/* Cada paso: la pregunta grande, su nota, y las respuestas para tocar */
.mc-plan-activo .mc-plan-hoja { display: flex; flex-direction: column; }
.mc-plan-cambia { overflow: clip; overflow-clip-margin: 24px; }
.mc-plan-pregunta { margin: 0; font-size: clamp(22px, 5.4vw, 28px); font-weight: 600; line-height: 1.2; letter-spacing: -.02em; outline: none; text-wrap: balance; }
.mc-mundo .mc-plan-caja .mc-plan-nota { margin: var(--mc-e1) 0 var(--mc-e4); font-size: 15px; line-height: 1.45; color: var(--mc-texto-3); }
.mc-mundo .mc-plan-caja .mc-plan-pregunta:focus, .mc-mundo .mc-plan-listo:focus { outline: none !important; box-shadow: none !important; }
/* La casilla de términos ya dice lo que es: su título ("Enviar respuestas") sobra */
.mc-mundo .mc-plan-caja .wpforms-field-checkbox > .wpforms-field-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.mc-mundo .mc-plan-caja .wpforms-field-checkbox .wpforms-field-label-inline { font-size: 14px; color: var(--mc-texto-2); }
.mc-plan-escondido { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; border: 0 !important; opacity: 0; }
.mc-plan-opciones { display: flex; flex-wrap: wrap; gap: var(--mc-e2); }
.mc-plan-opciones--tarjetas { display: grid; grid-template-columns: minmax(0, 1fr); }
.mc-mundo button.mc-plan-opcion {
  display: flex; flex-direction: column; align-items: flex-start; gap: 2px; min-height: 48px; margin: 0 !important;
  padding: var(--mc-e3) var(--mc-e4) !important; border: 0 !important; border-radius: var(--mc-r-pildora) !important; text-align: left;
  background: rgba(255, 255, 255, .7) !important; color: var(--mc-tinta) !important; font: 600 16px/1.25 var(--mc-fuente); letter-spacing: 0; text-transform: none; cursor: pointer;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .9), 0 1px 1px -.5px rgba(22, 21, 20, .05), 0 6px 12px -8px rgba(22, 21, 20, .16) !important;
  transition: background .25s ease, transform .45s var(--mc-curva-layout), box-shadow .45s var(--mc-curva-layout);
}
.mc-plan-opciones--tarjetas button.mc-plan-opcion { border-radius: var(--mc-r-pieza) !important; padding: var(--mc-e3) var(--mc-e4) !important; }
.mc-plan-opcion b { font-weight: 600; }
.mc-plan-opcion span { font-size: 13.5px; font-weight: 400; color: var(--mc-texto-3); }
.mc-mundo button.mc-plan-opcion:hover { background: #fff !important; transform: translateY(-1px); }
/* Elegida: levita, con su canto de acento y la luz turquesa suave debajo, detrás */
.mc-mundo button.mc-plan-opcion[aria-pressed="true"] {
  background: #fff !important; transform: translateY(-3px);
  box-shadow: inset 0 0 0 1.5px rgba(31, 116, 128, .5), 0 16px 28px -18px rgba(56, 168, 178, .55) !important;
}
.mc-mundo button.mc-plan-opcion:focus-visible { outline: none !important; box-shadow: inset 0 0 0 1.5px var(--mc-acento), 0 6px 12px -8px rgba(22, 21, 20, .16) !important; }

/* Respuestas de WPForms (una o varias) como píldoras: el círculo o la casilla se esconde encima */
.mc-mundo .mc-plan-caja .wpforms-container .wpforms-form .mc-plan-pildoras ul { display: flex; flex-wrap: wrap; gap: var(--mc-e2); margin: var(--mc-e2) 0 0; padding: 0; }
.mc-mundo .mc-plan-caja .wpforms-container .wpforms-form .mc-plan-pildoras li { position: relative; margin: 0; padding: 0; display: block; }
.mc-mundo .mc-plan-caja .wpforms-container .wpforms-form .mc-plan-pildoras :is(input[type="radio"], input[type="checkbox"]) { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; z-index: 1; }
.mc-mundo .mc-plan-caja .wpforms-container .wpforms-form .mc-plan-pildoras .wpforms-field-label-inline {
  display: grid; place-items: center; min-width: 88px; min-height: 48px; padding: 0 var(--mc-e4); box-sizing: border-box; text-align: center; line-height: 1.2; border-radius: var(--mc-r-pildora); font-size: 16px; font-weight: 600;
  background: rgba(255, 255, 255, .7); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .9), 0 6px 12px -8px rgba(22, 21, 20, .16);
  transition: background .25s ease, transform .45s var(--mc-curva-layout), box-shadow .45s var(--mc-curva-layout);
}
.mc-mundo .mc-plan-caja .wpforms-container .wpforms-form .mc-plan-pildoras input:checked + .wpforms-field-label-inline {
  background: #fff; transform: translateY(-3px); box-shadow: inset 0 0 0 1.5px rgba(31, 116, 128, .5), 0 16px 28px -18px rgba(56, 168, 178, .55);
}
.mc-mundo .mc-plan-caja .wpforms-container .wpforms-form .mc-plan-pildoras input:focus-visible + .wpforms-field-label-inline { box-shadow: inset 0 0 0 1.5px var(--mc-acento); }
.mc-mundo .mc-plan-caja .wpforms-container .wpforms-form .mc-plan-pildoras .wpforms-field-label { font-size: 15px; color: var(--mc-tinta); }
.mc-mundo .mc-plan-caja .wpforms-container .wpforms-form .mc-plan-pildoras .wpforms-field-label { margin-bottom: 0; }
.mc-mundo .mc-plan-caja .wpforms-container .wpforms-form .mc-plan-pildoras input[type="checkbox"]::before, .mc-mundo .mc-plan-caja .wpforms-container .wpforms-form .mc-plan-pildoras input[type="checkbox"]::after { content: none; display: none; }
/* eb-formas.css fuerza las casillas visibles (con !important): en las píldoras van escondidas encima */
.mc-mundo.mc-forma .mc-plan-caja .mc-plan-pildoras input[type="checkbox"] { position: absolute !important; inset: 0; width: 100% !important; height: 100% !important; margin: 0 !important; opacity: 0 !important; z-index: 1; cursor: pointer; }
@media (max-width: 559px) { .mc-plan-producto .mc-tarjeta-nombre { white-space: normal; } }
/* En las píldoras todo se contesta para avanzar: el asterisco sobra */
.mc-mundo .mc-plan-caja .mc-plan-pildoras .wpforms-required-label { display: none; }
/* Uso interno: la sugerencia que la página manda a Maribel */
.mc-mundo .mc-plan-caja .mc-plan-interno { display: none !important; }
/* Pantallas de varias respuestas: se sigue con un botón */
.mc-mundo .mc-plan-caja button.mc-plan-continuar {
  align-self: flex-start; min-height: 48px; margin: var(--mc-e2) 0 0 !important; padding: 0 var(--mc-e5) !important; border: 0 !important; border-radius: var(--mc-r-pildora) !important;
  background: var(--mc-acento) !important; color: #fff !important; box-shadow: 0 12px 22px -16px rgba(31, 116, 128, .8) !important;
  font: 600 15px var(--mc-fuente); letter-spacing: 0; text-transform: none; cursor: pointer; transition: opacity .3s ease, background .2s ease;
}
.mc-mundo .mc-plan-caja button.mc-plan-continuar:hover { background: var(--mc-acento-hover) !important; }
.mc-mundo .mc-plan-caja button.mc-plan-continuar:disabled { opacity: .38; cursor: default; box-shadow: none !important; }
/* Tu punto de partida: filas como en la búsqueda (foto, qué es y por qué, precio y "+") */
.mc-plan-sugiere { width: 100%; display: flex; flex-direction: column; gap: var(--mc-e2); margin: var(--mc-e2) 0; padding: var(--mc-e4); box-sizing: border-box; border-radius: var(--mc-r-pieza); background: rgba(255, 255, 255, .55); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .85); }
.mc-plan-sugiere .mc-rotulo { margin: 0; color: var(--mc-acento); }
.mc-plan-sugiere-por, .mc-plan-sugiere .mc-plan-sugiere-nota { margin: 0; }
.mc-plan-sugiere-por:empty { display: none; }
.mc-plan-sugiere-lista { display: flex; flex-direction: column; gap: var(--mc-e2); }
.mc-plan-producto { display: flex; align-items: center; gap: var(--mc-e3); padding: var(--mc-e2); border-radius: var(--mc-r-pieza); background: #fff; box-shadow: 0 8px 16px -12px rgba(22, 21, 20, .16); }
.mc-mundo a.mc-plan-producto-ir { flex: 1; min-width: 0; display: grid; grid-template-columns: 56px minmax(0, 1fr) auto; align-items: center; column-gap: var(--mc-e3); color: var(--mc-tinta); }
.mc-plan-producto-foto { width: 56px; height: 56px; border-radius: var(--mc-r-campo); overflow: hidden; display: grid; place-items: center; background: #fff; }
.mc-plan-producto-foto img { width: 100%; height: 100%; object-fit: contain; }
.mc-plan-producto-texto { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.mc-plan-producto .mc-tarjeta-nombre { padding: 0; display: block; font-size: 15.5px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: unset; }
.mc-plan-producto-por { font-size: 13px; line-height: 1.35; color: var(--mc-texto-3); }
.mc-plan-producto .mc-precio, .mc-plan-producto .mc-precio .price { font-size: 15px; font-weight: 700; margin: 0; white-space: nowrap; }
.mc-plan-producto > .mc-icono { flex: none; }
.mc-plan-total { margin: 0; text-align: right; font-size: 14px; color: var(--mc-texto-2); }
.mc-plan-cuidado { margin: 0; padding: var(--mc-e2) var(--mc-e3); border-radius: var(--mc-r-campo); background: rgba(250, 214, 150, .22); font-size: 14px; color: var(--mc-tinta); }
@media (max-width: 559px) {
  .mc-mundo a.mc-plan-producto-ir { grid-template-columns: 56px minmax(0, 1fr); }
  .mc-plan-producto-ir > .mc-precio { grid-column: 2; }
}
/* Las flechitas del número (edad) no van */
.mc-mundo .mc-plan-caja input[type="number"] { -moz-appearance: textfield; appearance: textfield; }
.mc-mundo .mc-plan-caja input[type="number"]::-webkit-inner-spin-button, .mc-mundo .mc-plan-caja input[type="number"]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.mc-mundo .mc-plan-caja button.mc-plan-agrega {
  align-self: flex-start; margin: 0 0 var(--mc-e4) !important; padding: 0 !important; border: 0 !important; background: none !important; box-shadow: none !important;
  color: var(--mc-acento) !important; font: 600 15px var(--mc-fuente); letter-spacing: 0; text-transform: none; cursor: pointer;
}
/* Solo al final aparece el botón de enviar */
.mc-plan-activo:not(.mc-plan-ultimo) .wpforms-submit-container { display: none !important; }
.mc-mundo .mc-plan-caja .wpforms-container .wpforms-form button.wpforms-submit { width: 100%; }

/* Listo: qué sigue, en orden */
.mc-plan-listo { display: flex; flex-direction: column; align-items: flex-start; gap: var(--mc-e3); outline: none; }
.mc-plan-palomita { position: absolute; top: 20px; right: 20px; display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; color: var(--mc-acento); background: #fff; box-shadow: inset 0 0 0 1.5px rgba(31, 116, 128, .35), 0 16px 28px -18px rgba(56, 168, 178, .55); }
.mc-plan-listo .mc-h2, .mc-plan-listo .mc-lede { margin: 0; }
.mc-plan-listo-titulo { display: flex; align-items: center; width: 100%; min-height: 48px; padding-right: 64px; box-sizing: border-box; overflow-wrap: anywhere; }
.mc-mundo .mc-plan-listo .mc-plan-wa { width: 100%; box-sizing: border-box; justify-content: center; }
.mc-mundo .mc-plan-inicio { margin-top: 10px; width: 100%; box-sizing: border-box; background: rgba(255,255,255,.5); box-shadow: inset 0 0 0 1px rgba(30,50,70,.16); color: var(--mc-tinta); font-weight: 500; }
.mc-plan-guardado { display: flex; flex-direction: column; align-items: flex-start; gap: var(--mc-e3); }
.mc-plan-guardado :is(.mc-h2, p) { margin: 0; }
.mc-plan-guardado-resumen { overflow-wrap: anywhere; }
.mc-plan-guardado .mc-plan-editar { width: 100%; }
.mc-plan-caja[data-mc-plan-guardado] :is(.wpforms-container, .mc-plan-cabeza) { display: none; }
.mc-plan-sigue { list-style: none; margin: var(--mc-e2) 0; padding: 0; display: flex; flex-direction: column; gap: var(--mc-e3); counter-reset: paso; }
.mc-plan-sigue li { counter-increment: paso; display: grid; grid-template-columns: 32px 1fr; column-gap: var(--mc-e3); }
.mc-plan-sigue li::before { content: counter(paso); grid-row: span 2; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: rgba(255, 255, 255, .8); font-size: 14px; font-weight: 700; color: var(--mc-acento); }
.mc-plan-sigue b { font-size: 16px; }

@media (min-width: 560px) {
  .mc-plan-opciones--tarjetas { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1024px) {
  .mc-plan { grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: var(--mc-e6); padding-top: var(--mc-e6); }
  .mc-plan-lado { position: sticky; top: calc(var(--mc-alto-marco) + var(--mc-e5)); gap: var(--mc-e4); }
  .mc-plan-persona img { width: 72px; height: 72px; }
  .mc-plan-confianza { flex-direction: column; }
}
@media (prefers-reduced-motion: reduce) {
  .mc-mundo button.mc-plan-opcion, .mc-plan-barra span { transition: none !important; }
  .mc-mundo button.mc-plan-opcion[aria-pressed="true"] { transform: none; }
}

/* ---- Páginas legales: luz propia ----
   Un degradado vertical azul-niebla a jade-agua y, encima, cinco manchas de luz fijas (radial-gradient
   que se desvanece a transparente: sin blur, sin imágenes, sin movimiento). Tonos de azul y jade muy
   suaves para transmitir calma y seguridad. La capa es fija al viewport: no hay cortes al hacer scroll.
   El mundo del tema (.mc-mundo) pasa a transparente y sus capas de amanecer/halos se apagan aquí,
   para que la capa de luces (z-index -1, detrás del contenido) se vea. El cristal de la columna de
   lectura no cambia. */
/* body.mc-con-cielo (eb-inicio.css) fija su fondo y apaga los ::before con !important: aquí se le gana por especificidad. */
body.mc-con-cielo.mc-pagina-legal { background: linear-gradient(180deg, #edf4f8 0%, #f1f6f7 55%, #eef5f2 100%) !important; }
body.mc-con-cielo.mc-pagina-legal::before {
  content: "" !important;
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(circle at 12% 18%, rgba(150, 196, 222, .38) 0, transparent 42vmax),
    radial-gradient(circle at 88% 10%, rgba(186, 216, 236, .45) 0, transparent 36vmax),
    radial-gradient(circle at 82% 78%, rgba(140, 205, 182, .30) 0, transparent 40vmax),
    radial-gradient(circle at 8% 92%, rgba(120, 165, 200, .20) 0, transparent 34vmax),
    radial-gradient(circle at 50% 55%, rgba(170, 222, 214, .22) 0, transparent 30vmax);
}
body.mc-pagina-legal .mc-mundo { background: transparent; }
body.mc-pagina-legal .mc-amanecer,
body.mc-pagina-legal .mc-sol,
body.mc-pagina-legal .mc-aurora,
body.mc-pagina-legal .mc-luz { display: none; }

/* ---- Páginas legales: columna de lectura angosta (≈ 68 caracteres) ---- */
/* Cabeza, texto y cierre comparten la misma columna, para que todo se alinee. */
body.mc-pagina-legal .mc-secciones > .mc-ancho { max-width: calc(720px + 2 * var(--mc-margen)); }
.mc-legal { display: flex; flex-direction: column; gap: var(--mc-e4); margin-top: calc(-1 * var(--mc-e5)); }
.mc-legal-fecha { margin: 0; }
.mc-legal-indice { display: flex; flex-direction: column; gap: var(--mc-e2); }
.mc-legal-indice .mc-rotulo { color: var(--mc-texto-3); }
.mc-legal-indice ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--mc-e2) var(--mc-e3); }
.mc-mundo .mc-legal-indice a { display: inline-flex; align-items: center; min-height: 32px; font-size: 14px; font-weight: 600; color: var(--mc-acento); }
.mc-mundo .mc-legal-indice a:hover { color: var(--mc-acento-hover); }
.mc-legal-cuerpo { padding: var(--mc-e4); background: rgba(255, 255, 255, .78); font-size: 16px; line-height: 1.7; color: var(--mc-tinta); }
.mc-legal-cuerpo > :first-child { margin-top: 0; }
.mc-legal-cuerpo > :last-child { margin-bottom: 0; }
.mc-mundo .mc-legal-cuerpo h2 { margin: var(--mc-e5) 0 var(--mc-e2); font-size: clamp(20px, 1rem + .6vw, 24px); font-weight: 700; line-height: 1.2; letter-spacing: -.025em; text-wrap: balance; }
.mc-mundo .mc-legal-cuerpo h2:first-child { margin-top: 0; }
.mc-mundo .mc-legal-cuerpo p { margin: 0 0 var(--mc-e3); color: var(--mc-texto-2); text-wrap: pretty; }
.mc-mundo .mc-legal-cuerpo strong { color: var(--mc-tinta); font-weight: 600; }
.mc-mundo .mc-legal-cuerpo ul, .mc-mundo .mc-legal-cuerpo ol { margin: 0 0 var(--mc-e3); padding-left: var(--mc-e4); color: var(--mc-texto-2); }
.mc-mundo .mc-legal-cuerpo li { margin: 0 0 var(--mc-e2); padding-left: var(--mc-e1); }
.mc-mundo .mc-legal-cuerpo a { color: var(--mc-acento); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; overflow-wrap: anywhere; }
.mc-mundo .mc-legal-cuerpo a:hover { color: var(--mc-acento-hover); }
@media (min-width: 768px) {
  .mc-legal-cuerpo { padding: var(--mc-e5) var(--mc-e6); }
}