/* La calculadora de reseñas (/recursos/calculadora-de-resenas, 4 nov): lo que solo tiene esta página, sobre el kit v2 (paginas.css). La
   herramienta es la página: una tarjeta con los campos a la izquierda y el resultado, que se dibuja, en su panel hundido a la derecha (en
   el móvil, debajo). Solo transform y opacity; con «reducir movimiento», todo quieto. La página del plan usa esta misma hoja. */

/* ── Cabecera compacta: la herramienta tiene que asomar en la primera pantalla */
.cabecera.compacta{padding:calc(var(--cab) + clamp(28px,5vw,64px)) 0 clamp(24px,3vw,36px)}
.compacta .cabecera-texto{max-width:52em;gap:18px}
.compacta .titular{max-width:19em;font-size:clamp(30px,3.7vw,52px)}
.compacta .entradilla{max-width:40em}
.privado{display:flex;align-items:center;gap:9px;font-size:14.5px;font-weight:560;color:var(--texto-2)}
.privado .ic{width:18px;height:18px;color:var(--naranja)}
@media (max-width:760px){.compacta .titular{font-size:clamp(26px,7vw,32px)}.compacta .entradilla{font-size:16px}.cabecera.compacta{padding-bottom:20px}}

/* ── La tarjeta de la herramienta */
.calc [hidden]{display:none!important}
.calc-bloque{padding-bottom:clamp(40px,5vw,72px)}
.calc{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);border-radius:28px;background:var(--tarjeta);box-shadow:0 0 0 1px var(--linea),var(--sombra-flota)}
.calc-form{display:grid;gap:22px;align-content:start;align-self:start;padding:clamp(24px,3.4vw,44px)}
@media (min-width:1000px){.calc-form{position:sticky;top:calc(var(--cab) + 16px)}}
.calc-form h2{font-size:clamp(23px,2vw,28px);font-weight:420;font-stretch:112%;letter-spacing:-.025em}
.calc-grupo{display:grid;gap:12px;min-width:0;border:0;padding:0}
.calc-grupo legend{float:left;width:100%;margin-bottom:12px;font-size:12.5px;font-weight:600;letter-spacing:.01em;color:var(--texto-3)}
.calc .campo{align-content:start}
.calc-grupo .campo input{font-variant-numeric:tabular-nums}
.calc-grupo .campo input[readonly]{background:var(--hundido);border-color:transparent;color:var(--texto-2)}
.calc-ayuda{font-size:12.5px;line-height:1.4;color:var(--texto-3)}
.calc-error{font-size:13.5px;line-height:1.4;font-weight:550;color:var(--malo-texto)}
.campo input[aria-invalid]{border-color:var(--malo)}
.calc-exacto{justify-self:start;display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 14px 0 10px;border:0;border-radius:999px;background:var(--hundido);font:560 14px var(--letra);color:var(--texto);cursor:pointer;text-align:left;transition:transform .15s var(--e)}
.calc-exacto .ic{width:16px;height:16px;transition:transform .25s var(--e)}
.calc-exacto:hover{transform:translateY(-1px)}
.calc-exacto:active{transform:scale(.98)}
.calc-exacto[aria-expanded="true"] .ic{transform:rotate(45deg)}
.calc-estrellas-campos{display:grid;gap:8px;padding:14px;border-radius:16px;background:var(--hundido)}
.calc-fila{display:grid;grid-template-columns:minmax(0,1fr) minmax(48px,.8fr) 108px;align-items:center;gap:4px 12px}
.calc-fila label{font-size:14px;font-weight:560;color:var(--texto)}
.calc-fila input{height:42px;width:100%;padding:0 12px;border-radius:10px;border:1px solid var(--linea-2);background:#fff;font:16px var(--letra);text-align:right;font-variant-numeric:tabular-nums;color:var(--texto)}
.calc-fila input:focus{outline:none;border-color:var(--tinta);box-shadow:0 0 0 3px rgba(18,20,22,.08)}
.calc-fila .calc-error{grid-column:1 / -1}
.calc-reparto{height:8px;border-radius:4px;background:var(--pista);overflow:hidden}
.calc-reparto::before{content:"";display:block;height:100%;background:var(--texto);transform-origin:0 50%;transform:scaleX(var(--w,0));transition:transform .3s var(--e)}
.calc-opciones label{min-width:0;flex:1 1 auto}
.calc-opciones label small{font-variant-numeric:tabular-nums}
.calc-opciones label:active{transform:scale(.98)}
.calc-opciones label.sugerida:not(:has(:checked)){border-color:var(--naranja);box-shadow:0 0 0 1px var(--naranja)}
.calc-otra{max-width:180px}
.calc-ir{justify-self:stretch}
.calc-formula{font-size:13.5px;color:var(--texto-3)}
.calc-formula a{color:var(--texto-2);text-underline-offset:3px}

/* ── El resultado */
.calc-resultado{position:relative;isolation:isolate;display:grid;gap:18px;align-content:start;min-height:560px;padding:clamp(24px,3.4vw,44px);border-radius:0 28px 28px 0;background:var(--hundido)}
.calc-resultado::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:var(--trama) 0 0/14px 14px;mask-image:radial-gradient(70% 55% at 100% 0%,#000 8%,transparent 70%)}
.calc-salida{display:grid;grid-template-columns:minmax(0,1fr);align-content:start;min-width:0}
.calc-vacio{max-width:22em;padding-top:8px;font-size:clamp(19px,1.7vw,23px);line-height:1.4;color:var(--texto-3)}
.calc:not(.con-resultado) .calc-salida::after{content:"";display:block;width:180px;height:32px;margin-top:28px;background:var(--linea-2);-webkit-mask:var(--estrella) 0 0/36px 32px repeat-x;mask:var(--estrella) 0 0/36px 32px repeat-x}
.calc,.ficha-mini,.calc-estrellas{--estrella:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 32'%3E%3Cpath d='M16 3.5l3.6 7.4 8.1 1.2-5.9 5.7 1.4 8.1-7.2-3.8-7.2 3.8 1.4-8.1-5.9-5.7 8.1-1.2z'/%3E%3C/svg%3E")}
.calc-ok{display:grid;grid-template-columns:minmax(0,1fr);gap:22px}
.calc-r0{padding:12px 14px;border-radius:12px;background:var(--fondo);font-size:14px;line-height:1.5;color:var(--texto-2)}
.calc-r1{display:grid;gap:12px}
.calc-notas{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;font-size:15px;font-weight:600;color:var(--texto)}
.calc-nota{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 12px;border-radius:10px;background:var(--tarjeta);box-shadow:0 0 0 1px var(--linea)}
.calc-nota b{font-weight:600;font-variant-numeric:tabular-nums}
.calc-nota.quiere{box-shadow:0 0 0 1.5px var(--naranja)}
.calc-flecha{width:22px;height:2px;border-radius:1px;background:var(--linea-3);position:relative}
.calc-flecha::after{content:"";position:absolute;right:0;top:-3px;width:8px;height:8px;border:solid var(--linea-3);border-width:2px 2px 0 0;transform:rotate(45deg)}
.calc-estrellas{position:relative;display:inline-block;width:75px;height:14px;background:var(--pista);-webkit-mask:var(--estrella) 0 0/15px 14px repeat-x;mask:var(--estrella) 0 0/15px 14px repeat-x}
.calc-estrellas::after{content:"";position:absolute;inset:0;background:var(--texto);transform-origin:0 50%;transform:scaleX(var(--v,0))}
.quiere .calc-estrellas::after{background:var(--naranja)}
.calc-cifra{display:flex;flex-wrap:wrap;align-items:baseline;gap:.12em;font-size:clamp(52px,7vw,104px);font-weight:300;font-stretch:118%;letter-spacing:-.05em;line-height:.9;color:var(--texto);font-variant-numeric:tabular-nums}
.calc-cifra b{font-weight:inherit}
.calc-cifra b:last-child{color:var(--tuyo)}
.calc-guion{color:var(--texto-3)}
.calc-r1-texto{font-size:clamp(18px,1.6vw,22px);font-weight:420;font-stretch:104%;letter-spacing:-.012em;line-height:1.38;color:var(--texto);max-width:26em}
.calc-r1-texto b{font-weight:600}
.calc-r1-sub{font-size:15px;line-height:1.55;color:var(--texto-2);max-width:34em}
.calc-check{position:relative;display:block;width:64px;height:64px;border-radius:50%;background:var(--naranja)}
.calc-check::before{content:"";position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4L18 8'/%3E%3C/svg%3E") center/30px no-repeat}
.calc-check::after{content:"";position:absolute;left:16px;top:20px;width:32px;height:24px;background:var(--naranja);transform-origin:100% 50%;transform:scaleX(0)}
.calc-puntos{display:grid;gap:12px;padding:18px;border-radius:18px;background:var(--tarjeta);box-shadow:0 0 0 1px var(--linea)}
.calc-rejilla{display:flex;flex-wrap:wrap;gap:4px}
.calc-rejilla i,.calc-leyenda span::before,.calc-mini-vis i{flex:none;width:9px;height:9px;border-radius:50%;background:rgba(18,20,22,.2)}
.calc-rejilla .f,.calc-leyenda .f::before,.calc-mini-vis .cinco{background:var(--naranja)}
.calc-rejilla .p,.calc-leyenda .p::before{background:none;box-shadow:inset 0 0 0 1.5px var(--naranja)}
.calc-rejilla small{font-size:11px;font-weight:600;color:var(--texto-3)}
.calc-leyenda{display:flex;flex-wrap:wrap;gap:4px 16px;font-size:12.5px;color:var(--texto-3)}
.calc-leyenda span{display:inline-flex;align-items:center;gap:6px}
.calc-leyenda span::before{content:""}
.calc-leyenda .cada{margin-left:auto}
.calc-leyenda .cada::before{display:none}
.calc-escalera{display:grid;gap:10px}
.calc-escalera .tabla{border-radius:16px;background:var(--tarjeta);box-shadow:0 0 0 1px var(--linea);overflow:hidden}
.calc-escalera .tabla :is(th,td){padding:11px 16px;vertical-align:middle}
.calc-escalera thead :is(th,td){padding:10px 16px}
.calc-escalera tbody th{width:9.5em;font-variant-numeric:tabular-nums}
.con-barra{display:flex;align-items:center;gap:12px}
.calc-k,.tabla-barras .con-barra>span{flex:none;min-width:5.6em;font-weight:600;color:var(--texto);font-variant-numeric:tabular-nums}
.calc-barra,.tabla-barras td i{position:relative;flex:1;height:8px;border-radius:4px;background:var(--pista);overflow:hidden}
.calc-barra::before,.calc-barra::after,.tabla-barras td i::before{content:"";position:absolute;inset:0;border-radius:4px;transform-origin:0 50%}
.calc-barra::before{box-shadow:inset 0 0 0 1.5px var(--naranja);transform:scaleX(var(--b))}
.calc-barra::after,.tabla-barras td i::before{background:var(--naranja);transform:scaleX(var(--a,var(--w)))}
.calc-pie,.calc-r3{font-size:14px;line-height:1.5;color:var(--texto-2)}
.calc-r3{padding:12px 14px;border-radius:12px;box-shadow:inset 0 0 0 1px var(--linea-2)}
.calc-r3 a{color:var(--texto);font-weight:600;text-underline-offset:3px}
.calc-dos{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:10px}
.calc-mini{display:grid;gap:12px;align-content:start;padding:16px;border-radius:16px;background:var(--tarjeta);box-shadow:0 0 0 1px var(--linea);font-size:14.5px;line-height:1.5;color:var(--texto-2)}
.calc-mini-vis{display:flex;flex-wrap:wrap;align-items:center;gap:4px;min-height:12px}
.calc-mini-vis .baja{background:var(--malo)}
.calc-mini-vis small{font-size:11px;font-weight:600;color:var(--texto-3)}
.calc-igual{margin:0 4px;font-size:13px;font-weight:600;line-height:9px;color:var(--texto-3)}
@media (max-width:420px){.calc-notas{flex-wrap:nowrap;gap:6px}.calc-nota{gap:6px;padding:0 9px}.calc-flecha{flex:none;width:14px}.calc-estrellas{width:55px;height:11px;-webkit-mask-size:11px 11px;mask-size:11px 11px}}
.calc-contexto{display:grid;gap:6px}
.calc-contexto li{position:relative;padding-left:16px;font-size:14px;line-height:1.5;color:var(--texto-3)}
.calc-contexto li::before{content:"";position:absolute;left:2px;top:.62em;width:6px;height:2px;border-radius:1px;background:var(--texto-3)}
@media (prefers-reduced-motion:no-preference){
  .calc-ok.entra>*{animation:calc-entra .55s var(--e) calc(var(--i,0) * 70ms) both}
  .entra .calc-estrellas::after{animation:calc-crece .9s var(--e) .25s both}
  .entra :is(.calc-rejilla .f,.calc-rejilla .p){animation:calc-pop .4s var(--e-back2,ease) calc(.35s + var(--j,0) * 14ms) both}
  .entra .calc-escalera tr{animation:calc-entra .45s var(--e) calc(.3s + var(--j,0) * 60ms) both}
  .entra .calc-barra::after,.entra .calc-barra::before{animation:calc-crece .7s var(--e) .45s both}
  .entra .calc-check::after,.calc-plan-hecho .calc-check::after{animation:calc-traza .45s cubic-bezier(.6,0,.3,1) .25s both}
  .calc-estrellas-campos{animation:aparece .3s var(--e)}
  .calc-plan{animation:calc-entra .5s var(--e) .4s both}
  .tabla-barras.anima:not(.en) td i::before{transform:scaleX(0)}
  .tabla-barras.en td i::before{transition:transform .8s var(--e) calc(var(--j,0) * 70ms + .2s)}
}
@keyframes calc-entra{from{opacity:0;transform:translateY(10px)}}
@keyframes calc-pop{from{opacity:0;transform:scale(.3)}}
@keyframes calc-crece{from{transform:scaleX(0)}}
@keyframes calc-traza{from{transform:scaleX(1)}to{transform:scaleX(0)}}
.tabla-barras tr:nth-child(2){--j:1}.tabla-barras tr:nth-child(3){--j:2}.tabla-barras tr:nth-child(4){--j:3}.tabla-barras tr:nth-child(5){--j:4}

/* ── El plan por correo y lo siguiente, dentro del resultado */
.calc-plan{display:grid;gap:14px;padding:clamp(18px,2.4vw,26px);border-radius:20px;background:var(--tarjeta);box-shadow:0 0 0 1px var(--linea),var(--sombra-tarjeta)}
.calc-plan-tit{font-size:clamp(19px,1.6vw,22px);font-weight:420;font-stretch:108%;letter-spacing:-.018em;line-height:1.25;color:var(--texto)}
.calc-plan-tit b{font-weight:inherit}
.calc-plan-sub,.calc-plan-pie{font-size:14px;line-height:1.5;color:var(--texto-2)}
.calc-plan-pie{font-size:13px;color:var(--texto-3)}
.calc-casilla{display:grid;grid-template-columns:22px minmax(0,1fr);gap:10px;align-items:start;font-size:13.5px;line-height:1.45;color:var(--texto-2);cursor:pointer}
.calc-casilla input{width:20px;height:20px;margin:0;accent-color:var(--tinta)}
.calc-casilla a{color:var(--texto);text-underline-offset:2px}
.calc-plan-ir{justify-self:start}
.calc-plan-ir:disabled{opacity:.45;cursor:not-allowed;transform:none}
.calc-plan-error{font-size:14px;font-weight:550;color:var(--malo-texto)}
.calc-plan-hecho{display:grid;grid-template-columns:44px minmax(0,1fr);gap:14px;align-items:center;font-size:15px;line-height:1.5;color:var(--texto-2)}
.calc-plan-hecho .calc-check{width:44px;height:44px}
.calc-plan-hecho .calc-check::before{background-size:22px}
.calc-plan-hecho .calc-check::after{left:11px;top:14px;width:22px;height:16px}
.calc-plan-hecho b{color:var(--texto)}
.calc-plan.enviado>:not([data-hecho]){display:none}
.calc-siguiente{display:grid;gap:16px;padding-top:20px;border-top:1px solid var(--linea-2);font-size:15px;line-height:1.55;color:var(--texto-2)}
.calc-siguiente b{color:var(--texto)}
.calc-acciones{display:flex;flex-wrap:wrap;gap:16px 22px}
@media (max-width:999px){
  .calc{grid-template-columns:minmax(0,1fr)}
  .calc-resultado{min-height:0;border-radius:0 0 28px 28px}
}
@media (max-width:760px){
  .calc{border-radius:22px}
  .calc-resultado{border-radius:0 0 22px 22px}
  .calc-form{gap:18px}
  .calc-fila{grid-template-columns:minmax(0,1fr) 96px}
  .calc-reparto{display:none}
  .calc-acciones{flex-direction:column}
  .calc-acciones .boton{width:100%}
}
.calc-grupo .campo-doble{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
@media (max-width:340px){.calc-grupo .campo-doble{grid-template-columns:minmax(0,1fr)}}


/* ── S4: la fórmula, en texto, y el ejemplo con sus barras */
.cuenta{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:28px clamp(32px,5vw,80px);margin-top:clamp(48px,6vw,80px);align-items:start}
.cuenta-formula,.cuenta-ejemplo{display:grid;gap:18px}
.formula{padding:clamp(20px,2.4vw,28px);border-radius:20px;background:var(--tarjeta);box-shadow:0 0 0 1px var(--linea),var(--sombra-tarjeta);font-size:clamp(18px,1.6vw,22px);line-height:1.5;color:var(--texto)}
.formula b{font-weight:420}
.formula>b>span{display:block}
.formula var{font-style:normal;font-weight:600;padding:0 .18em;border-radius:.3em;background:var(--hundido)}
.formula-chica{padding:16px 18px;font-size:16px}
.tabla-barras td i,.tabla-peso td i{max-width:260px}
@media (max-width:999px){.cuenta{grid-template-columns:minmax(0,1fr)}}

/* ── S5: el redondeo, su regla y la tabla de lo que pide de más */
.redondeo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.85fr);grid-template-areas:"a c" "b c";gap:20px clamp(32px,5vw,80px);margin-top:28px;align-items:start}
.redondeo-1{grid-area:a}.redondeo-2{grid-area:b}.redondeo-cifra{grid-area:c}
.regla{display:grid;gap:6px;margin-top:24px}
.regla-zonas{display:grid;grid-template-columns:1fr 1fr;height:34px;border-radius:9px;overflow:hidden;font-size:12.5px;font-weight:600}
.regla-zonas i{display:grid;place-items:center;font-style:normal;background:var(--hundido);color:var(--texto-2)}
.regla-zonas i+i{background:var(--tuyo-suave);color:var(--tuyo);box-shadow:inset 2px 0 0 var(--naranja)}
.regla-marcas{display:flex;justify-content:space-between;font-size:11.5px;font-weight:600;color:var(--texto-3);font-variant-numeric:tabular-nums}
.regla-marcas .umbral{color:var(--tuyo)}
h3.sub{margin:clamp(56px,7vw,88px) 0 12px;font-size:clamp(21px,1.8vw,26px);font-weight:450;font-stretch:110%;letter-spacing:-.02em}
.tabla-redondeo{margin-top:24px}
.tabla-redondeo .tabla{min-width:640px}
.tabla-redondeo .de-mas{color:var(--texto-3);text-decoration:line-through;text-decoration-color:var(--linea-3)}
.tabla-redondeo .bien{font-weight:650;color:var(--texto)}
.tabla-redondeo td,.tabla-redondeo tbody th{font-variant-numeric:tabular-nums;white-space:nowrap}
.nota-tabla{margin-top:12px;font-size:13.5px;line-height:1.5;color:var(--texto-3);max-width:46em}
@media (max-width:760px){.tabla-redondeo :is(th,td):first-child{position:sticky;left:0;z-index:1;background:var(--tarjeta);box-shadow:1px 0 0 var(--linea)}.tabla-redondeo thead>tr>:first-child{background:var(--lienzo)}}
@media (max-width:999px){.redondeo{grid-template-columns:minmax(0,1fr);grid-template-areas:"a" "c" "b"}}

/* ── S6: el 5,0 en puntos: 79 de cinco y una de una */
.cinco{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:28px clamp(32px,5vw,72px);align-items:center}
.cinco .frase-destacada{margin:28px 0 24px;font-size:clamp(26px,2.6vw,38px)}
.cinco-vis{display:grid;gap:16px;justify-items:start;padding:clamp(20px,2.6vw,32px);border-radius:22px;background:var(--tarjeta);box-shadow:0 0 0 1px var(--linea),var(--sombra-flota)}
.cinco-puntos{display:grid;gap:7px}
.cinco-puntos i{display:block;width:calc(10 * 22px - 6px);height:16px;background:radial-gradient(circle,var(--naranja) 7px,transparent 7.6px) -3px 0/22px 16px repeat-x}
.cinco-puntos .ultima{position:relative;width:calc(9 * 22px - 6px)}
.cinco-puntos .ultima::after,.cinco-ley .una{content:"";position:absolute;left:calc(100% + 6px);top:1px;width:14px;height:14px;border-radius:50%;background:var(--malo)}
.cinco-ley{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:12.5px;font-weight:600;color:var(--texto-3)}
.cinco-ley span{display:inline-flex;align-items:center;gap:6px}
.cinco-ley i{position:static!important;width:9px;height:9px;border-radius:50%;background:var(--naranja)}
.cinco-ley .una{background:var(--malo)}
.cinco-cuenta{display:grid;grid-template-columns:auto auto;gap:2px 12px;align-items:baseline;padding-top:14px;border-top:1px solid var(--linea);font-size:13px;color:var(--texto-3)}
.cinco-cuenta b{font-size:32px;font-weight:340;font-stretch:118%;letter-spacing:-.04em;line-height:1;color:var(--texto);font-variant-numeric:tabular-nums}
.cinco-cuenta .se-ve{color:var(--tuyo)}
.cinco-vis.anima:not(.en) .cinco-puntos i{opacity:0;transform:translateY(6px)}
.cinco-vis.en .cinco-puntos i{transition:opacity .35s ease calc(var(--d,0) * 50ms + .2s),transform .5s var(--e) calc(var(--d,0) * 50ms + .2s)}
.cinco-puntos i:nth-child(2){--d:1}.cinco-puntos i:nth-child(3){--d:2}.cinco-puntos i:nth-child(4){--d:3}.cinco-puntos i:nth-child(5){--d:4}.cinco-puntos i:nth-child(6){--d:5}.cinco-puntos i:nth-child(7){--d:6}.cinco-puntos i:nth-child(8){--d:7}
@media (max-width:999px){.cinco{grid-template-columns:minmax(0,1fr)}}
@media (max-width:400px){.cinco-puntos i{width:calc(10 * 19px - 5px);background-size:19px 16px;background-position:-2px 0}.cinco-puntos .ultima{width:calc(9 * 19px - 5px)}}

/* ── S7: lo que pesa una de una estrella y el margen */
.compensa{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:28px clamp(40px,6vw,96px);margin-top:clamp(40px,5vw,64px);align-items:start}
.compensa-lado{display:grid;gap:18px}
.compensa-lado h3{margin-top:12px;font-size:clamp(20px,1.6vw,23px);font-weight:500}
.tabla-peso .con-barra>span{flex:none;min-width:1.6em;font-weight:600;color:var(--texto);font-variant-numeric:tabular-nums}
.tabla-peso td i{height:10px;width:calc(var(--n) * 7px);background:radial-gradient(circle,var(--naranja) 3px,transparent 3.5px) 0 0/7px 10px repeat-x}
.tabla-peso tbody th,.tabla-barras tbody th{font-variant-numeric:tabular-nums}
@media (max-width:760px){.tabla-peso td i{width:calc(var(--n) * 3.6px);background:radial-gradient(circle,var(--naranja) 1.4px,transparent 1.8px) 0 0/3.6px 10px repeat-x}.tabla-peso :is(th,td){padding-left:12px;padding-right:12px}}
.margenes{display:flex;flex-wrap:wrap;gap:10px}
.margen-ficha{display:grid;grid-template-columns:auto auto;gap:2px 10px;align-items:center;padding:12px 16px;border-radius:14px;background:var(--tarjeta);box-shadow:0 0 0 1px var(--linea);font-size:12.5px;color:var(--texto-3)}
.margen-ficha b{grid-row:span 2;font-size:24px;font-weight:360;font-stretch:116%;letter-spacing:-.03em;color:var(--texto)}
@media (max-width:999px){.compensa{grid-template-columns:minmax(0,1fr)}}

/* ── S8: la banda, con la ficha que lee el análisis */
.banda-calc .banda-cta-in{grid-template-areas:"frase prueba" "sub prueba" "botones prueba"}
.banda-cta-sub{grid-area:sub;max-width:30em;font-size:clamp(16px,1.3vw,18px);line-height:1.55;color:rgba(255,255,255,.74)}
.banda-calc .banda-cta-botones{gap:16px 22px}
.banda-calc .cabecera-accion p{color:rgba(255,255,255,.6)}
.ficha-mini{gap:12px;padding:20px;background:var(--tarjeta);box-shadow:var(--sombra-flota);color:var(--texto-2);font-size:13px;transform:rotate(1.5deg)}
.ficha-mini-cab,.ficha-mini-90{display:flex;align-items:center;justify-content:space-between;gap:12px;font-weight:600;color:var(--texto-3)}
.ficha-mini .esq{width:64px}
.ficha-mini-nota{display:flex;align-items:center;gap:10px}
.ficha-mini-nota b{font-size:34px;font-weight:340;font-stretch:118%;letter-spacing:-.04em;color:var(--texto)}
.ficha-mini-reparto{display:grid;gap:4px}
.ficha-mini-reparto span{display:grid;grid-template-columns:10px 1fr;align-items:center;gap:8px;font-size:11px;font-weight:600}
.ficha-mini-reparto i{height:7px;border-radius:4px;background:var(--pista);overflow:hidden}
.ficha-mini-reparto i::before{content:"";display:block;height:100%;background:var(--texto);transform-origin:0 50%;transform:scaleX(var(--w))}
.ficha-mini-falta{padding:10px 12px;border-radius:12px;background:var(--tuyo-suave);color:var(--tuyo);font-weight:600}
.ficha-mini-falta b{font-size:18px}
@media (max-width:899px){.banda-calc .banda-cta-in{grid-template-areas:"frase" "sub" "botones"}.banda-calc .cabecera-accion{width:100%}}

/* ── S9, S10, S11 y S12: el texto con su pieza al lado. Lo que va debajo de una cabecera en dos columnas (y S4 y S7, arriba) usa sus
   mismas columnas: la columna de la derecha empieza siempre donde su entradilla, sin saltos al bajar (el usuario, 4 nov: el hilo). */
.nuevas,.tarda,.conseguir,.incumplen-pie{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px clamp(32px,5vw,80px);align-items:center}
.nuevas,.conseguir,.incumplen-pie{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);column-gap:clamp(40px,6vw,96px)}
.nuevas,.conseguir{margin-top:clamp(40px,5vw,64px);align-items:start}
.nuevas .cifra{max-width:420px}
.tarda .prosa{margin-top:28px}
.ritmo{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));align-items:end;gap:10px;height:280px;padding:clamp(20px,2.6vw,32px);border-radius:24px;background:var(--hundido);position:relative}
.ritmo-meta{position:absolute;left:clamp(20px,2.6vw,32px);right:clamp(20px,2.6vw,32px);top:clamp(20px,2.6vw,32px);padding-bottom:6px;border-bottom:1.5px dashed var(--naranja);font-size:12.5px;font-weight:600;color:var(--tuyo)}
.ritmo-meta b{font-size:15px}
.ritmo-mes,.ritmo-google{display:grid;gap:6px;justify-items:center;height:100%;align-content:end;font-size:12px;color:var(--texto-3)}
.ritmo-mes i,.ritmo-google i{width:100%;max-width:56px;height:150px;border-radius:10px 10px 4px 4px;background:var(--texto);transform-origin:50% 100%;transform:scaleY(var(--h))}
.ritmo-mes.llega i{background:var(--naranja)}
.ritmo-google i{transform:scaleY(.12);background:none;box-shadow:inset 0 0 0 1.5px var(--linea-3)}
.ritmo b{font-size:15px;font-weight:600;color:var(--texto);font-variant-numeric:tabular-nums}
.ritmo.anima:not(.en) i{transform:scaleY(0)}
.ritmo.en i{transition:transform .7s var(--e) calc(var(--i) * 110ms + .15s)}
.conseguir-lado{display:grid;gap:4px}
.incumplen .frase-destacada{margin-top:clamp(40px,5vw,64px)}
.panel.tinta .frase-destacada p{color:#fff}
.panel.tinta .frase-destacada .tenue{color:rgba(255,255,255,.5)}
.incumplen-pie{margin-top:clamp(28px,3.5vw,44px);align-items:start}
.iguala{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:14px 16px;align-items:center;padding:22px;border-radius:20px;background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1);font-size:12.5px;color:rgba(255,255,255,.6)}
.iguala-lado{display:grid;gap:8px}
.iguala-signo{font-size:28px;line-height:1;color:rgba(255,255,255,.4)}
.iguala .calc-mini-vis i{width:12px;height:12px}
.iguala-fin{grid-column:1 / -1;display:flex;align-items:baseline;gap:12px;padding-top:14px;border-top:1px solid rgba(255,255,255,.12);color:rgba(255,255,255,.5)}
.iguala-fin b{font-size:30px;font-weight:340;font-stretch:118%;letter-spacing:-.04em;color:#fff;font-variant-numeric:tabular-nums}
.iguala-fin b:last-child{color:var(--naranja)}
@media (max-width:999px){.nuevas,.tarda,.conseguir,.incumplen-pie{grid-template-columns:minmax(0,1fr)}.ritmo{height:240px}}

/* ── S13, S14 y S17 */
.cmp-plana tbody :is(td,th):last-child{background:none}
.cmp-plana .fila-suave>:last-child{background:var(--tarjeta)}
.cmp-plana thead th:last-child{color:var(--texto-3)}
.cmp-plana tbody td:last-child{color:inherit}
.cmp-plana .fila-suave td:last-child::after{background:var(--lienzo)}
.cuando-no h2{font-size:clamp(26px,2.6vw,38px)}
.ver-todas{margin-top:24px}

/* ── La página del plan: los pasos, con su raíl, de uno en uno */
.plan-bloque{padding-top:8px}
.plan-bloque [hidden]{display:none!important}
.plan-pasos{max-width:880px}
.plan-pasos .paso-t{display:grid;gap:12px}
.plan-pasos .paso-t>p{font-size:16.5px;line-height:1.6;color:var(--texto-2)}
.plan-media{display:grid;gap:10px;border:0;padding:0;min-width:0}
.plan-media legend{float:left;width:100%;margin-bottom:10px;font-size:13.5px;font-weight:600;color:var(--texto-3)}
.plan-otra,.plan-retira{max-width:420px}
.plan-tabla .tabla :is(th,td){padding:12px 18px}
.plan-mal{max-width:34em;font-size:18px;line-height:1.5;color:var(--texto-2)}