/* /contenido-y-prensa (4 nov), con el kit v2: lo que solo tiene esta página. La primera página de tu nombre en la cabecera, las cifras de
   S3, las piezas de los ocho pasos, las razones de S5 junto al gráfico de la portada (sus clases, de landing.css), la tabla de lo que se
   publica y su herramienta con la rejilla de diez filas, la tabla de ganada, pagada o propia, el panel de la prensa (C1 y C2), los cinco
   pasos y la comparativa sin destacar a nadie. Solo transform y opacity en lo que se mueve. */

/* ── Comunes de la página ─────────────────────────────────────────────────────────────────────────────────────────────────── */
.pastilla.tuyo{background:var(--tuyo-suave);color:var(--tuyo)}
.pastilla.tuyo::before{background:var(--naranja)}
.cp-col{max-width:34em}

/* ── S2: los ocho pasos a la vista en la primera pantalla (revisión, 4 nov). Quien busca «cómo salir en prensa» quiere los pasos: aquí
   están sus títulos, cada uno lleva a su paso; el último, en naranja, es la otra mitad del titular. ─────────────────────────────── */
.cp-ocho{position:relative;isolation:isolate;padding:clamp(24px,3vw,40px) clamp(16px,2.4vw,36px);border-radius:28px;background:var(--hundido)}
.cp-ocho::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:var(--trama) 0 0/14px 14px;mask-image:radial-gradient(75% 70% at 100% 100%,#000 10%,transparent 72%)}
.cp-ocho-tarjeta{padding:8px;border-radius:20px;background:var(--tarjeta);box-shadow:0 0 0 1px var(--linea),var(--sombra-flota)}
.cp-ocho-tit a{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 12px 14px 14px;font-size:17px;font-weight:560;font-stretch:104%;letter-spacing:-.012em;line-height:1.3;color:var(--texto);text-decoration:none}
.cp-ocho-tit a::after{content:"";flex:none;width:30px;height:30px;border-radius:50%;background:var(--hundido) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23121416' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 5v14M6 13l6 6 6-6'/%3E%3C/svg%3E") center/15px no-repeat;transition:transform .2s var(--e)}
.cp-ocho-tit a:hover::after{transform:translateY(2px)}
.cp-ocho ol{counter-reset:paso}
.cp-ocho li{counter-increment:paso;border-top:1px solid var(--linea)}
.cp-ocho li a{display:grid;grid-template-columns:2.1em minmax(0,1fr) 16px;align-items:center;gap:10px;min-height:46px;padding:7px 10px 7px 14px;border-radius:12px;font-size:15.5px;font-weight:520;line-height:1.3;color:var(--texto);text-decoration:none;transition:background-color .15s ease,transform .1s var(--e)}
.cp-ocho li a::before{content:counter(paso,decimal-leading-zero);font-size:21px;font-weight:300;font-stretch:118%;letter-spacing:-.05em;line-height:1;color:var(--texto-3);font-variant-numeric:tabular-nums}
.cp-ocho li a::after{content:"";width:16px;height:16px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23121416' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h15M13 6l6 6-6 6'/%3E%3C/svg%3E") center/16px no-repeat;opacity:0;transform:translateX(-4px);transition:opacity .15s ease,transform .2s var(--e)}
.cp-ocho li a:hover{background:var(--hundido)}
.cp-ocho li a:hover::after,.cp-ocho li a:focus-visible::after{opacity:.6;transform:none}
.cp-ocho li a:active{transform:scale(.985)}
.cp-ocho a:focus-visible{outline:2px solid var(--tinta);outline-offset:-2px;border-radius:12px}
.cp-ocho li.queda a::before{color:var(--naranja);font-weight:400}
@media (prefers-reduced-motion:no-preference){
  .cp-ocho-tarjeta{animation:ec-entra .5s var(--e) .15s both}
  .cp-ocho li{animation:ec-entra .45s var(--e) calc(.3s + var(--i,0) * 50ms) both}
}
@media (max-width:999px){.cp-ocho{max-width:620px;border-radius:24px}}
@media (max-width:420px){.cp-ocho{padding:12px}.cp-ocho li a{min-height:48px;padding-left:10px;font-size:15px}.cp-ocho-tit a{padding-left:10px}}
/* El paso al que se salta, con su título subrayado en naranja: sabes que has llegado. */
.cp-pasos>li{scroll-margin-top:16px}
.cp-pasos>li:target .paso-t>b{text-decoration:underline 2px var(--naranja);text-underline-offset:5px}

/* La primera página de tu nombre, en pequeño, en la banda tras la prueba (S11). */
.cp-banda-prueba .ec-pregunta em{background:var(--tuyo-suave);color:var(--tuyo)}
.cp-banda-prueba .ec-r{grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:12px;padding:12px 16px;margin:0!important}
.cp-banda-prueba .ec-r .pastilla{grid-column:auto;margin:0}
.cp-banda-prueba .ec-logo{grid-row:auto;color:var(--texto-2)}
.cp-banda-prueba .ec-logo .ic{width:17px;height:17px}
.cp-banda-prueba .ec-pregunta{display:flex;align-items:center;gap:10px;justify-self:stretch;max-width:none;border-radius:999px}
.cp-banda-prueba .ec-pregunta img{width:18px;height:18px}

/* ── S3: las dos cifras, sus dibujos ──────────────────────────────────────────────────────────────────────────────────────── */
.cp-antes{margin-top:clamp(56px,7vw,96px)}
.cp-dos{grid-template-columns:repeat(2,minmax(0,1fr));max-width:820px;margin-top:28px}
.cp-figuras i.p{background:linear-gradient(90deg,var(--naranja) 60%,var(--pista) 60%)}
.cp-bloques{display:flex;align-items:center;gap:8px}
.cp-bloques i{position:relative;flex:1;height:48px;border-radius:10px;background:var(--pista);overflow:hidden}
.cp-bloques i.p::after{content:"";position:absolute;inset:0;background:var(--naranja);transform-origin:0 50%;transform:scaleX(.7)}
.cifras.anima .cp-bloques i.p::after{transform:scaleX(0)}
.cifras.en .cp-bloques i.p::after{transform:scaleX(.7);transition:transform .9s var(--e) .5s}
@media (max-width:760px){.cp-dos{grid-template-columns:minmax(0,1fr)}}

/* ── S4: las piezas de los pasos ──────────────────────────────────────────────────────────────────────────────────────────── */
.cp-pasos .pz-fuentes>span.no,.cp-pasos .pz-fuentes>span.lejos{background:none;box-shadow:inset 0 0 0 1px var(--linea-2);color:var(--texto-3)}
.cp-pasos .pz-fuentes s{text-decoration-color:var(--texto-3)}
.cp-pasos .pz-fuentes>i{font-style:normal;font-weight:600;color:var(--texto-3)}
.cp-pasos .pz-ventana b{display:inline-flex;align-items:center;gap:6px;justify-self:start;height:24px;margin-top:2px;padding:0 9px;border-radius:7px;background:var(--tuyo-suave);font-size:11.5px;font-weight:600;color:var(--tuyo)}
.cp-pasos .pz-ventana b .ic{width:13px;height:13px}
.cp-pz-experto>span.tu{align-self:flex-start;border-radius:12px 12px 12px 4px;background:var(--tuyo-suave);box-shadow:none;color:var(--tuyo)}
.cp-pz-no>span:not(.no) .ic{color:var(--bueno)}

/* ── S5: las cuatro razones, al lado del gráfico de la portada ────────────────────────────────────────────────────────────── */
.cp-apaga{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(32px,5vw,72px);align-items:start;margin-top:clamp(40px,5vw,64px)}
.cp-apaga-texto{max-width:34em}
.cp-razones{counter-reset:razon}
.cp-razones>li{counter-increment:razon;position:relative;padding:22px 0 24px 68px;border-top:1px solid rgba(255,255,255,.14);font-size:16.5px;line-height:1.6;color:rgba(255,255,255,.7)}
.cp-razones>li:first-child{border-top:0;padding-top:0}
.cp-razones>li::before{content:counter(razon,decimal-leading-zero);position:absolute;left:0;top:18px;font-size:40px;font-weight:250;font-stretch:118%;letter-spacing:-.06em;line-height:1;color:rgba(255,255,255,.5);font-variant-numeric:tabular-nums}
.cp-razones>li:first-child::before{top:-4px}
.cp-razones>li>b{display:block;margin-bottom:4px;font-size:19px;font-weight:520;font-stretch:106%;letter-spacing:-.014em;line-height:1.35;color:#fff}
.cp-razones.anima>li{opacity:0;transform:translateY(12px)}
.cp-razones.en>li{opacity:1;transform:none;transition:opacity .45s ease calc(var(--i) * 80ms),transform .6s var(--e) calc(var(--i) * 80ms)}
.cp-grafico{position:sticky;top:calc(var(--cab) + 96px);box-shadow:0 48px 110px -40px rgba(0,0,0,.9)}
.cp-frase-larga{max-width:26em;font-size:clamp(26px,2.6vw,38px)}
@media (max-width:999px){.cp-apaga{grid-template-columns:minmax(0,1fr)}.cp-grafico{position:static}}
@media (max-width:760px){.cp-razones>li{padding-left:54px}.cp-razones>li::before{font-size:32px}}

/* ── S6: lo que se publica, la prueba y su herramienta ────────────────────────────────────────────────────────────────────── */
.bloque-cab .cp-sigue{margin-top:16px}
.cp-publicar .tabla-ia{align-items:flex-start}
.cp-publicar .tabla-ia .ic{box-sizing:content-box;width:20px;height:20px;padding:9px;border-radius:11px;background:var(--hundido);color:var(--texto)}
.cp-publicar tbody th{width:42%;font-size:15.5px;font-weight:500;line-height:1.5}
.cp-publicar a{color:var(--texto);text-underline-offset:3px}
@media (max-width:760px){.cp-publicar tbody th{width:auto}.cp-publicar.tabla-desliza tbody :is(th,td){padding:0}}
.cp-diez{max-width:46em;margin-top:clamp(40px,5vw,56px);padding:4px 0 4px 26px;border-left:3px solid var(--naranja)}
.cp-diez h3{font-size:clamp(20px,1.7vw,23px);font-weight:500;font-stretch:108%;letter-spacing:-.018em}
.cp-diez p{margin-top:8px;font-size:clamp(17px,1.25vw,18.5px);line-height:1.6;color:var(--texto-2)}
.cp-herramienta{margin-top:clamp(32px,4vw,48px)}
.cp-cuenta{display:grid;gap:18px;margin-top:12px;padding:clamp(22px,2.8vw,32px);border-radius:24px;background:var(--tarjeta);box-shadow:0 0 0 1px var(--linea),var(--sombra-flota)}
.cp-cuenta[hidden]{display:none}
.cp-cuenta-cab{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 24px}
.cp-cuenta-busqueda{display:flex;gap:4px;padding:4px;border-radius:999px;background:var(--hundido)}
.cp-cuenta-busqueda button{position:relative;isolation:isolate;height:36px;padding:0 16px;border:0;border-radius:999px;background:none;font-size:14px;font-weight:560;color:var(--texto-2);cursor:pointer;transition:transform .1s var(--e)}
.cp-cuenta-busqueda button::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:var(--tinta);opacity:0;transform:scale(.9);transition:opacity .2s ease,transform .25s var(--e)}
.cp-cuenta-busqueda button[aria-pressed="true"]{color:#fff}
.cp-cuenta-busqueda button[aria-pressed="true"]::before{opacity:1;transform:none}
.cp-cuenta-busqueda button:active{transform:scale(.97)}
/* La rejilla (revisión, 4 nov): diez filas por cinco columnas, una casilla de 48 px de alto por resultado, que se toca con el pulgar;
   los nombres de las columnas, arriba y una sola vez, con su color. Antes eran cincuenta pastillas en dos líneas por fila. */
.cp-cuenta-cuerpo{display:grid;gap:22px}
.cp-cuenta-lado{display:grid;gap:16px;align-content:start}
@media (min-width:1000px){.cp-cuenta-cuerpo{grid-template-columns:minmax(0,680px) minmax(0,1fr);gap:clamp(32px,4vw,56px);align-items:start}.cp-cuenta-lado{position:sticky;top:calc(var(--cab) + 96px)}}
.cp-cuenta-rejilla{--num:48px;--c:var(--texto)}
.cp-cuenta-cols,.cp-f{display:grid;grid-template-columns:var(--num) repeat(5,minmax(0,1fr))}
.cp-cuenta-cols{align-items:start;padding-bottom:10px;font-size:12.5px;font-weight:600;line-height:1.2;color:var(--texto-2);text-align:center}
.cp-cuenta-cols span{padding:0 2px;overflow-wrap:break-word}
.cp-cuenta-cols span::before{content:"";display:block;width:10px;height:10px;margin:0 auto 6px;border-radius:50%;background:var(--c)}
.cp-cuenta-cols span:first-child::before{content:none}
/* El color de cada columna, en la etiqueta: el círculo va detrás del input y hereda de ella (tuyo, a favor, neutro, en contra, otro). */
.cp-cuenta-cols span[data-c="tuyo"],.cp-f label:nth-of-type(1){--c:var(--naranja)}
.cp-cuenta-cols span[data-c="favor"],.cp-f label:nth-of-type(2){--c:var(--bueno)}
.cp-cuenta-cols span[data-c="neutro"],.cp-f label:nth-of-type(3){--c:var(--texto-3)}
.cp-cuenta-cols span[data-c="contra"],.cp-f label:nth-of-type(4){--c:var(--malo)}
.cp-cuenta-cols span[data-c="otro"],.cp-f label:nth-of-type(5){--c:var(--tinta)}
.cp-cuenta-filas{border-radius:16px;background:var(--fondo);box-shadow:0 0 0 1px var(--linea)}
.cp-cuenta-filas li+li{border-top:1px solid var(--linea)}
.cp-cuenta-filas fieldset{min-width:0;margin:0;padding:0;border:0}
.cp-f{align-items:center}
.cp-f b{padding-left:14px;font-size:20px;font-weight:300;font-stretch:118%;letter-spacing:-.04em;color:var(--texto-3);font-variant-numeric:tabular-nums;transition:color .2s ease}
.marcada .cp-f b{color:var(--texto)}
.cp-f label{position:relative;display:grid;place-items:center;height:48px;cursor:pointer;-webkit-tap-highlight-color:transparent}
.cp-f input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.cp-f i{width:24px;height:24px;border-radius:50%;background:var(--tarjeta);box-shadow:inset 0 0 0 1.5px var(--linea-3);pointer-events:none;transition:transform .12s var(--e),box-shadow .15s ease,background-color .15s ease}
.cp-f label:hover i{box-shadow:inset 0 0 0 1.5px var(--c)}
.cp-f label:active i{transform:scale(.86)}
.cp-f input:focus-visible+i{outline:2px solid var(--tinta);outline-offset:3px}
.cp-f input:checked+i{background:var(--c) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-9'/%3E%3C/svg%3E") center/14px no-repeat;box-shadow:none}
@media (prefers-reduced-motion:no-preference){.cp-f input:checked+i{animation:cp-punto .3s var(--e)}}
@media (max-width:420px){
  .cp-cuenta-rejilla{--num:34px}
  .cp-cuenta-cols{font-size:11px;letter-spacing:-.01em}
  .cp-cuenta-cols span{padding:0;overflow-wrap:normal}
  .cp-cuenta-busqueda button{padding:0 8px;font-size:13.5px;white-space:nowrap}
  .cp-f b{padding-left:9px;font-size:17px}
  .cp-f i{width:22px;height:22px}
}
.cp-cuenta-res{display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px;padding-top:6px}
.cp-cuenta-puntos{display:flex;gap:6px}
.cp-cuenta-puntos i{width:16px;height:16px;border-radius:50%;box-shadow:inset 0 0 0 1.5px var(--linea-3);transition:transform .25s var(--e)}
.cp-cuenta-puntos i[data-c]{box-shadow:none}
@media (prefers-reduced-motion:no-preference){.cp-cuenta-puntos i[data-c]{animation:cp-punto .3s var(--e)}}
.cp-cuenta-puntos i[data-c="tuyo"]{background:var(--naranja)}
.cp-cuenta-puntos i[data-c="favor"]{background:var(--bueno)}
.cp-cuenta-puntos i[data-c="neutro"]{background:var(--texto-3)}
.cp-cuenta-puntos i[data-c="otro"]{background:var(--tinta)}
.cp-cuenta-puntos i[data-c="contra"]{background:var(--malo)}
@keyframes cp-punto{from{transform:scale(.4)}}
.cp-cuenta-res output{font-size:15px;font-weight:600;color:var(--texto);font-variant-numeric:tabular-nums}
.cp-cuenta-fin{display:grid;gap:12px;justify-items:start;padding:18px;border-radius:18px;background:var(--hundido);font-size:15px;line-height:1.5;color:var(--texto)}
.cp-cuenta-fin:not(.gen-cierre)>i{display:none}
.cp-cuenta-fin.gen-cierre{justify-items:stretch;background:var(--tinta);color:rgba(255,255,255,.74)}
.cp-cuenta-fin.gen-cierre .boton{justify-self:start}
@media (prefers-reduced-motion:no-preference){.cp-cuenta:not([hidden]) .cp-cuenta-filas li{animation:aparece .4s var(--e) calc(var(--i) * 40ms) both}}
@media (max-width:760px){
  .cp-cuenta-busqueda{width:100%}
  .cp-cuenta-busqueda button{flex:1}
  .cp-cuenta-fin .boton{width:100%}
}

/* ── S7: lo que pesa más para las IA ──────────────────────────────────────────────────────────────────────────────────────── */
.cp-nombran{display:grid;grid-template-columns:minmax(0,34em) minmax(0,360px);gap:24px clamp(32px,5vw,72px);align-items:center}
.cp-correl{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px 14px;padding:22px 24px;border-radius:20px;background:var(--hundido)}
.cp-correl p{grid-column:1 / -1;font-size:13.5px;font-weight:600;color:var(--texto-2)}
.cp-correl p+span+b+p{margin-top:8px}
.cp-correl span{display:block;height:10px;border-radius:5px;background:var(--pista);overflow:hidden}
.cp-correl i{display:block;height:100%;border-radius:5px;background:var(--texto);transform-origin:0 50%;transform:scaleX(var(--b))}
.cp-correl p:first-child+span i{background:var(--naranja)}
.cp-correl b{font-size:13px;font-weight:600;color:var(--texto);font-variant-numeric:tabular-nums}
.cp-nombran.anima .cp-correl i{transform:scaleX(0)}
.cp-nombran.en .cp-correl i{transform:scaleX(var(--b));transition:transform .9s var(--e) .3s}
@media (max-width:899px){.cp-nombran{grid-template-columns:minmax(0,1fr)}}

/* ── S8: ganada, pagada o propia, sin destacar ninguna; cada una con su sello ─────────────────────────────────────────────── */
.cp-gpp :is(td,th):last-child,.cp-gpp .fila-suave>:last-child{background:none}
.cp-gpp thead>tr>:last-child{background:var(--lienzo)}
.cp-gpp td:last-child{color:var(--texto-2)}
.cp-gpp .fila-suave td:last-child::after{background:var(--lienzo)}
.cp-gpp thead th{font-size:14.5px;font-weight:600;color:var(--texto)}
/* Los volados y el foco, oscuros dentro de la tabla blanca (la sección es tinta: el kit los pone blancos y no se veían). */
:is(.bloque,.panel).tinta .cp-gpp sup a{color:var(--texto-3)}
:is(.bloque,.panel).tinta .cp-gpp .tabla :focus-visible{outline-color:var(--tinta)}
/* Cada columna, su filete arriba, dentro de la tabla. La pagada, además, enmarcada con trazo discontinuo de arriba abajo y con su
   «Publicidad», como va un anuncio en un periódico: lo pagado se ve pagado en cada fila, también al deslizar en el móvil. */
.cp-gpp thead th:is(:nth-child(2),:nth-child(4))::before{content:"";position:absolute;top:8px;left:3px;right:3px;height:3px;border-radius:2px;background:var(--tinta)}
.cp-gpp thead th:nth-child(4)::before{background:var(--naranja)}
.cp-gpp :is(th,td):nth-child(3)::before{content:"";position:absolute;inset:0 3px;border-inline:1.5px dashed var(--texto-3);pointer-events:none}
.cp-gpp thead th:nth-child(3)::before{top:8px;border-top:1.5px dashed var(--texto-3);border-radius:10px 10px 0 0}
.cp-gpp tbody tr:last-child>:nth-child(3)::before{bottom:6px;border-bottom:1.5px dashed var(--texto-3);border-radius:0 0 10px 10px}
@media (max-width:760px){
  .cp-gpp{scroll-snap-type:x mandatory;scroll-padding-left:118px}
  .cp-gpp thead :is(th,td){scroll-snap-align:start}
}
.cp-sello{display:flex;align-items:center;justify-content:center;width:38px;height:38px;margin-bottom:12px;border-radius:12px}
.cp-sello .ic{width:19px;height:19px}
.cp-sello.ganada{background:var(--tinta);color:#fff}
.cp-sello.pagada{width:max-content;height:26px;margin-block:6px 18px;padding:0 9px;border-radius:5px;box-shadow:inset 0 0 0 1.5px var(--texto-3);font-size:11px;font-weight:700;letter-spacing:.02em;color:var(--texto-2)}
.cp-sello.propia{background:var(--tuyo-suave);color:var(--tuyo)}

/* ── S9: el panel de la prensa, al lado del texto; la tabla, debajo ───────────────────────────────────────────────────────── */
.cp-mide{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,5vw,72px);align-items:center}
.cp-mide .captura{margin-top:0}
.cp-ley{display:inline-flex;align-items:center;gap:6px;margin-left:auto;font-size:11.5px;font-weight:500;color:var(--texto-3)}
.cp-ley i{width:9px;height:9px;border-radius:2px;background:var(--texto)}
.cp-ley i.n{margin-left:6px;background:var(--naranja)}
.cp-meses{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));align-items:end;gap:6px;height:92px;padding-top:4px;border-bottom:1px solid var(--linea)}
.cp-meses i{display:flex;flex-direction:column;justify-content:flex-end;gap:2px;height:100%;transform-origin:50% 100%}
.cp-meses i::before{content:"";height:calc(var(--n) * 100%);border-radius:3px 3px 0 0;background:var(--naranja)}
.cp-meses i::after{content:"";height:calc(var(--g) * 100%);border-radius:3px 3px 0 0;background:var(--texto)}
.escena.anima .cp-meses i{transform:scaleY(0)}
.escena.en .cp-meses i{transform:none;transition:transform .8s var(--e) .5s}
.cp-tonos{display:flex;flex-wrap:wrap;gap:6px}
.cp-fav img{width:15px;height:15px}
.cp-panel .escena-flota .grande small{margin-left:4px}
.cp-panel .escena-flota .cp-chip{justify-self:start}
/* El pie y «Ver otra vez», por debajo de la nota flotante, que asoma 28 px bajo el panel y tapaba el botón (revisión, 4 nov). */
@media (min-width:761px){.cp-panel figcaption p{margin-top:44px;max-width:30em}.cp-panel .escena-otra{margin-top:44px}}
.cp-mide-tabla tbody th{width:21%}
.cp-mide-tabla .cp-si{width:22%;padding-left:46px;color:var(--texto)}
.cp-mide-tabla .cp-si::after{content:"";position:absolute;left:22px;top:26px;width:12px;height:12px;border-radius:50%;background:var(--texto)}
.cp-mide-tabla .cp-si[data-si="0"]{color:var(--texto-3)}
.cp-mide-tabla .cp-si[data-si="0"]::after{background:none;box-shadow:inset 0 0 0 1.5px var(--linea-3)}
@media (max-width:999px){.cp-mide{grid-template-columns:minmax(0,1fr)}}
@media (max-width:760px){
  .cp-mide-tabla tr{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:12px}
  .cp-mide-tabla :is(th,td):not(.cp-si){grid-column:1 / -1;width:auto}
  .cp-mide-tabla .cp-si{width:auto;margin-top:14px!important;padding:12px 30px 12px 12px!important;border-radius:12px;background:var(--hundido);font-size:14px}
  .cp-mide-tabla .cp-si::after{left:auto;right:12px;top:14px}
  .cp-mide-tabla .cp-si::before{margin-bottom:4px!important}
}

/* ── S10: ganable ya, con más autoridad o no hoy; la autoridad, siempre frente a otra ─────────────────────────────────────── */
.cp-ganable{display:grid;grid-template-columns:minmax(0,34em) minmax(0,380px);gap:24px clamp(32px,5vw,72px);align-items:center}
.cp-ganable-vis{display:grid;gap:18px;padding:22px 24px;border-radius:20px;background:var(--hundido)}
.cp-vs{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:10px 14px;font-size:13px;font-weight:600;color:var(--texto-2)}
.cp-vs i{display:block;height:10px;border-radius:5px;background:var(--pista);overflow:hidden}
.cp-vs i::before{content:"";display:block;height:100%;background:var(--texto);transform-origin:0 50%;transform:scaleX(var(--w))}
.cp-vs i.tu::before{background:var(--naranja)}
.cp-tres{display:flex;flex-wrap:wrap;gap:6px}
.cp-tres .pastilla{background:var(--tarjeta)}
@media (max-width:899px){.cp-ganable{grid-template-columns:minmax(0,1fr)}}

/* ── S12: cinco pasos en fila, unidos por su flecha; el cuarto, en tinta ──────────────────────────────────────────────────── */
.cp-cinco{--hueco:16px;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--hueco);margin-top:clamp(40px,5vw,56px)}
.cp-cinco>li{position:relative;display:grid;align-content:start;gap:clamp(36px,4vw,64px);min-height:280px;padding:24px 22px;border-radius:22px;background:var(--tarjeta);border:1px solid var(--linea);box-shadow:var(--sombra-tarjeta)}
.cp-cinco-n{font-size:clamp(44px,4vw,60px);font-weight:250;font-stretch:118%;letter-spacing:-.06em;line-height:.9;color:var(--texto);font-variant-numeric:tabular-nums}
.cp-cinco p{font-size:15px;line-height:1.5;color:var(--texto-2)}
.cp-cinco p b{display:block;margin-bottom:6px;font-size:18px;font-weight:560;font-stretch:104%;letter-spacing:-.012em;line-height:1.3;color:var(--texto)}
.cp-cinco>li.tinta{background:var(--tinta);border-color:var(--tinta);color:rgba(255,255,255,.72)}
.cp-cinco>li.tinta :is(.cp-cinco-n,b){color:#fff}
.cp-cinco>li.tinta p{color:rgba(255,255,255,.74)}
.cp-cinco>li:not(:last-child)::after{content:"";position:absolute;z-index:1;top:50%;right:calc(var(--hueco) / -2 - 17px);width:34px;height:34px;margin-top:-17px;border-radius:50%;background:var(--fondo) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23121416' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h15M13 6l6 6-6 6'/%3E%3C/svg%3E") center/16px no-repeat;box-shadow:0 0 0 1px var(--linea-2)}
.cp-cinco.anima>li{opacity:0;transform:translateY(16px)}
.cp-cinco.en>li{opacity:1;transform:none;transition:opacity .5s ease calc(var(--i) * 80ms),transform .7s var(--e) calc(var(--i) * 80ms)}
@media (max-width:1099px){
  .cp-cinco{--hueco:14px;grid-template-columns:minmax(0,1fr);max-width:720px}
  .cp-cinco>li{grid-template-columns:auto minmax(0,1fr);align-items:start;gap:18px;min-height:0;padding:22px 22px 22px 20px}
  .cp-cinco-n{font-size:40px;min-width:1.3em}
  .cp-cinco>li:not(:last-child)::after{top:auto;right:auto;bottom:-24px;left:30px;margin:0;transform:rotate(90deg)}
}

/* ── S13: la comparativa, sin destacar la columna de Reviot más que con su sitio ──────────────────────────────────────────── */
.cp-neutra tbody :is(td,th):last-child,.cp-neutra .fila-suave>:last-child{background:none}
.cp-neutra thead>tr>:last-child{background:var(--lienzo)}
.cp-neutra td:last-child{color:var(--texto-2)}
.cp-neutra .fila-suave td:last-child::after{background:var(--lienzo)}
:is(.cp-neutra,.cp-gpp) .fila-suave td:last-child{color:var(--texto)}