/* Monta tu línea, Pedir oferta y Casos (01-10; piel B desde el 08-10, con piel-b.css delante). Fondo claro, azul de marca;
   el amarillo solo marca la máquina que fija el ritmo. Cajas en gris muy claro y redondeadas, sin bordes; botones píldora.
   Móvil ≤ 760 px: la línea arriba, se toca en vez de arrastrar. */

/* ── Comunes ── */
.mtl-mini{display:block;font-size:12.5px;font-weight:600;letter-spacing:-.005em;color:var(--azul)}
.mtl .boton,.po-main .boton,.caso .boton{font-weight:500;letter-spacing:-.01em}
.mtl .boton-sec,.po-main .boton-sec{border:0!important;background:transparent;color:var(--azul);box-shadow:inset 0 0 0 1.5px var(--azul)}
.mtl .boton-sec:hover,.po-main .boton-sec:hover{background:rgba(0,76,151,.06)}
.mtl-nota{font-size:13px;line-height:1.45;color:var(--gris)}
.ver{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:600;padding:2px 8px;border-radius:999px;white-space:nowrap;background:rgba(21,40,61,.06);color:var(--gris)}
.ver::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.ver.cabe{background:#E6F3EC;color:#17663F}
.ver.fuera{background:#FCEBE9;color:#B42318}
.ver.sin-dato{background:rgba(21,40,61,.06);color:var(--gris)}

/* ── Barra de la página ── */
body.mtl{background:#fff}
.mtl-cab{--b-pt:clamp(48px,6vw,80px);--b-pb:clamp(40px,4.4vw,56px)}
.mtl-barra{position:sticky;top:var(--b-menu,48px);z-index:30;background:rgba(255,255,255,.82);-webkit-backdrop-filter:saturate(1.8) blur(20px);backdrop-filter:saturate(1.8) blur(20px);border-top:1px solid var(--b-linea,rgba(21,40,61,.1));border-bottom:1px solid var(--b-linea,rgba(21,40,61,.1))}
.mtl-barra-dentro{max-width:1600px;margin:0 auto;padding:9px 24px;display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.mtl-barra-t{font-size:21px;font-weight:600;letter-spacing:-.02em;white-space:nowrap}
.mtl-puertas{display:flex;gap:2px;background:rgba(21,40,61,.06);border-radius:999px;padding:3px}
.mtl-puertas button{border:0;background:none;font:500 14px var(--b-letra,Inter),sans-serif;color:var(--tinta);opacity:.75;padding:8px 16px;border-radius:999px;cursor:pointer}
.mtl-puertas button[aria-selected=true]{background:#fff;opacity:1;font-weight:600;box-shadow:0 1px 3px rgba(21,40,61,.12)}
.mtl-acciones{display:flex;gap:10px;margin-left:auto;flex-wrap:wrap}
.mtl-acciones .boton{padding:10px 18px;font-size:14px;cursor:pointer;border:0}
.ico-correr{width:0;height:0;border-left:9px solid currentColor;border-top:6px solid transparent;border-bottom:6px solid transparent}
#correr.on .ico-correr{width:9px;height:11px;border:0;border-left:3px solid currentColor;border-right:3px solid currentColor}

/* ── Rejilla: lateral + escena ── */
.mtl-main{max-width:1600px;margin:0 auto;padding:24px 24px clamp(64px,8vw,104px)}
.mtl-rejilla{display:grid;grid-template-columns:330px minmax(0,1fr);gap:20px;align-items:start}
.mtl-lado{display:grid;gap:16px;min-width:0}
.mtl-escena-col{min-width:0}
.mtl-panel,.mtl-ritmo{background:var(--b-gris,#F5F7FA);border-radius:24px;padding:18px 18px 20px}
.mtl-panel-cab{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}
.mtl-panel h2,.mtl-ritmo h2{font-size:19px;font-weight:600;letter-spacing:-.015em;line-height:1.3}
.mtl-bandeja-cab h2{font-size:24px;font-weight:600;letter-spacing:-.02em;line-height:1.2}
.mtl-ejemplo{font-size:11.5px;font-weight:600;padding:3px 10px;border-radius:999px;background:#fff;color:var(--gris);border:1px dashed #B9C6D6}
.mtl-ejemplo.tuya{background:var(--azul-t);color:var(--azul);border:1px solid transparent}

/* Tu placa */
.mtl-placa-dibujo{height:104px;border-radius:16px;background:#fff;border:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;margin-bottom:12px}
.mtl-placa-dibujo i{display:block;background:#1F6B45;border-radius:3px;box-shadow:0 6px 12px -6px rgba(0,0,0,.4);transition:width .25s,height .25s}
.mtl-placa-dibujo span{text-align:center;font-size:11.5px;color:var(--gris);font-weight:600}
.mtl-campos{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.mtl-campos label{display:grid;grid-template-columns:1fr auto;align-items:center;gap:2px 6px;background:#fff;border:1px solid transparent;border-radius:14px;padding:8px 12px;transition:border-color .15s}
.mtl-campos label:focus-within{border-color:var(--azul)}
.mtl-campos label.ancho2{grid-column:1/-1}
.mtl-campos label>span{grid-column:1/-1;font-size:11.5px;font-weight:600;color:var(--gris2)}
.mtl-campos input{border:0;background:none;padding:0;font-size:19px;font-weight:600;letter-spacing:-.015em;border-radius:4px;min-width:0}
.mtl-campos input:focus{outline:0}
.mtl-campos em{font-style:normal;font-size:12px;color:var(--gris)}
.mtl-panel>.mtl-nota{margin-top:12px}

/* Cuéntanoslo */
.mtl-paso{font-size:12px;font-weight:600;color:var(--gris)}
.mtl-hilo{display:grid;gap:6px;margin-bottom:10px}
.mtl-hilo p{font-size:13px;line-height:1.4;margin:0}
.mtl-hilo .tu{justify-self:end;background:var(--azul);color:#fff;padding:6px 12px;border-radius:16px 16px 4px 16px;font-weight:500;max-width:90%}
.mtl-hilo .bwit{color:var(--gris);padding-left:10px;border-left:2px solid var(--b-filete,#DCE3EB)}
.mtl-pregunta{font-size:22px;font-weight:600;letter-spacing:-.02em;line-height:1.2;margin:8px 0 6px}
.mtl-opciones{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 12px}
.mtl-opciones .boton{padding:10px 16px;font-size:14px}
.opcion{font:500 14px var(--b-letra,Inter),sans-serif;color:var(--tinta);background:#fff;border:1px solid transparent;border-radius:999px;padding:9px 14px;cursor:pointer;transition:border-color .15s,background .15s}
.opcion:hover{border-color:var(--azul);color:var(--azul)}
.opcion.on{background:var(--azul);border-color:var(--azul);color:#fff}
.mtl-saltar{font:500 13px var(--b-letra,Inter),sans-serif;color:var(--gris);background:none;border:0;padding:0;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.mtl-sabido{margin-top:16px;padding-top:14px;border-top:1px solid var(--b-filete,#DCE3EB)}
.mtl-sabido h3{font-size:14px;font-weight:600;margin-bottom:8px}
.mtl-sabido ol{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.mtl-sabido li{background:rgba(255,255,255,.6);border:1px solid transparent;border-radius:12px;padding:6px 9px;font-size:12px;line-height:1.3}
.mtl-sabido li b{display:block;font-size:11.5px}
.mtl-sabido li span{color:var(--gris)}
.mtl-sabido li.si{background:#fff;border-color:transparent}.mtl-sabido li.si span{color:var(--tinta)}
.mtl-sabido li.ahora{border-color:var(--azul);box-shadow:0 0 0 2px var(--azul-t)}

/* Desde un caso */
.mtl-casos{display:grid;gap:8px;margin-top:12px}
.mtl-caso{display:grid;gap:2px;text-align:left;font:inherit;background:#fff;border:1px solid transparent;border-radius:16px;padding:12px 14px;cursor:pointer;color:var(--tinta)}
.mtl-caso b{font-size:15px}.mtl-caso>span:last-child{font-size:12.5px;color:var(--gris)}
.mtl-caso:hover{border-color:#9DB8D9}
.mtl-caso.on{border-color:var(--azul);box-shadow:0 0 0 2px var(--azul-t)}
.mtl-enlace{display:inline-block;margin-top:12px;font-size:15px}

/* Ritmo por puesto */
.mtl-ritmo-cab{margin-bottom:10px}.mtl-ritmo-cab .mtl-nota{display:block;margin-top:2px}
.mtl-barras{display:grid;gap:10px}
.mtl-barra-p{display:grid;gap:4px}
.mtl-barra-n{display:flex;justify-content:space-between;font-size:13px}.mtl-barra-n b{font-weight:600}.mtl-barra-n span{font-weight:600;font-variant-numeric:tabular-nums}
.mtl-barra-v{height:8px;border-radius:999px;background:rgba(21,40,61,.07);overflow:hidden}
.mtl-barra-v i{display:block;height:100%;border-radius:999px;background:var(--azul);transition:width .35s}
.mtl-barra-p.manda .mtl-barra-v i{background:var(--amarillo)}
.mtl-barra-p.sd .mtl-barra-v i{background:repeating-linear-gradient(135deg,#DCE4EE 0 5px,#F1F5F9 5px 10px)}
.mtl-barra-p.sd .mtl-barra-n span{color:var(--gris);font-weight:500}
.mtl-barra-d{display:flex;gap:8px;align-items:center;font-size:11.5px;color:var(--gris);line-height:1.3}
.mtl-barra-d>span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ── Escena 3D ── */
.mtl-escena-col,.mtl-lado>section{padding-top:0;padding-bottom:0}
.mtl-lado>section.mtl-panel,.mtl-lado>section.mtl-ritmo{padding:18px 18px 20px}
.mtl-escena{display:flex;flex-direction:column;height:clamp(420px,calc(100vh - 240px),680px);border-radius:28px;overflow:hidden;background:#F1F4F8;border:1px solid rgba(21,40,61,.08)}
.mtl-vista{position:relative;flex:1;min-height:0}
#lienzo{position:absolute;inset:0}
#lienzo canvas{display:block;touch-action:pan-y}
.mtl-escena.soltando .mtl-vista{box-shadow:inset 0 0 0 3px var(--azul)}
.mtl-etiquetas{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;overflow:hidden}
.mtl-etq{position:absolute;left:0;top:0;pointer-events:auto;background:rgba(255,255,255,.94);border:1px solid rgba(21,40,61,.08);border-radius:12px;padding:6px 26px 6px 10px;font-size:12px;line-height:1.25;text-align:center;box-shadow:0 6px 18px -10px rgba(21,40,61,.35);white-space:nowrap;margin-top:-6px}
.mtl-etq b{display:block;font-weight:600}
.mtl-etq .corto{display:none}
.mtl-etq .s{display:block;font-size:15px;font-weight:600;letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.mtl-etq.sd .s{color:var(--gris);font-size:13px;font-weight:600}
.mtl-etq small{display:block;font-size:11px;font-weight:600;color:#7A5E0C}
.mtl-etq.manda{border:2px solid var(--amarillo);background:#FFFDF5}
.mtl-etq .ver{margin-top:3px}
.mtl-etq .quitar{position:absolute;right:3px;top:3px;width:20px;height:20px;border-radius:50%;border:0;background:none;color:var(--gris2);font-size:15px;line-height:1;cursor:pointer;padding:0}
.mtl-etq .quitar:hover{background:var(--hueco);color:#B42318}
.mtl-cola{position:absolute;left:0;top:0;pointer-events:none;font-size:12px;font-weight:600;color:var(--gris);background:rgba(255,255,255,.92);border:1px solid rgba(21,40,61,.08);border-radius:999px;padding:3px 10px;white-space:nowrap}
.mtl-cola.hay{color:var(--tinta);border-color:#9DB8D9}
.mtl-marcador{display:grid;grid-template-columns:auto 1fr;gap:6px 28px;align-items:center;background:#fff;border-bottom:1px solid rgba(21,40,61,.07);padding:14px 24px;min-height:88px}
.mtl-cifra{display:flex;align-items:baseline;gap:10px;margin:2px 0 0;white-space:nowrap}
.mtl-cifra b{font-size:44px;line-height:1.05;letter-spacing:-.04em;font-weight:600;font-variant-numeric:tabular-nums}
.mtl-cifra b.sd{font-size:26px;color:var(--gris)}
.mtl-cifra #ph-luego{color:var(--azul)}
.mtl-cifra span{font-size:28px;color:var(--gris2)}
.mtl-marcador p{font-size:13.5px;line-height:1.45;color:var(--gris);margin:0;max-width:640px}
.mtl-girar{position:absolute;left:14px;bottom:12px;font-size:12px;color:var(--gris2);pointer-events:none}
.mtl-marcador p b{color:var(--tinta)}
.mtl-fuera{display:block;margin-top:6px;color:#B42318;font-weight:600}
.mtl-soltar{position:absolute;left:50%;bottom:18px;transform:translateX(-50%);background:var(--azul);color:#fff;font-size:13.5px;font-weight:600;padding:8px 16px;border-radius:999px;pointer-events:none}
.mtl-correr-info{position:absolute;right:16px;top:16px;background:rgba(255,255,255,.88);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:0;border-radius:999px;padding:8px 12px;font-size:13px;color:var(--gris);display:flex;gap:6px;align-items:baseline}
.mtl-correr-info span{font-weight:600;color:var(--azul);margin-right:6px}.mtl-correr-info b{color:var(--tinta);font-size:15px}
.mtl-correr-info[hidden],.mtl-soltar[hidden]{display:none}
.mtl-carga{position:absolute;inset:0;display:grid;place-items:center;font-weight:600;color:var(--gris);background:#F1F4F8}
.mtl-carga[hidden]{display:none}
.mtl-aviso{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:center;font-size:13px;color:var(--gris);margin:12px 6px 0;line-height:1.4}

/* Bandeja */
.mtl-bandeja-cab{display:flex;align-items:baseline;gap:14px;margin:36px 4px 14px;flex-wrap:wrap}
.mtl-bandeja{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.mtl-pieza{position:relative;display:flex;flex-direction:column;background:var(--b-gris,#F5F7FA);border:1px solid transparent;border-radius:22px;padding:10px 10px 54px;cursor:grab;user-select:none;transition:border-color .15s,box-shadow .15s,transform .15s}
.mtl-pieza:hover{box-shadow:0 18px 40px -24px rgba(21,40,61,.35);transform:translateY(-2px)}
.mtl-pieza.en{border-color:rgba(0,76,151,.35);background:#fff}
.mtl-pieza figure{margin:0;height:96px;border-radius:14px;background:#fff;overflow:hidden;display:grid;place-items:center}
.mtl-pieza img{width:100%;height:100%;object-fit:contain}
.mtl-pieza-txt{padding:6px 4px 0}
.mtl-pieza h3{font-size:15.5px;font-weight:600;letter-spacing:-.01em;line-height:1.25;margin:1px 0 6px}
.mtl-pieza .mtl-mini{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mtl-pieza p{display:flex;flex-wrap:wrap;gap:4px 8px;align-items:center;margin:0;font-size:12px;color:var(--gris)}
.mtl-pieza p .s{font-weight:600;color:var(--tinta)}
.mtl-poner{position:absolute;left:10px;right:10px;bottom:10px;font:500 13.5px var(--b-letra,Inter),sans-serif;border-radius:999px;padding:8px;cursor:pointer;border:0;background:#fff;color:var(--azul);box-shadow:inset 0 0 0 1.5px var(--azul)}
.mtl-poner.mas{background:var(--azul);color:#fff;box-shadow:none}
.mtl-poner.puesta:hover{color:#B42318;box-shadow:inset 0 0 0 1.5px #E3B4AE}
.mtl-cuenta{position:absolute;left:10px;right:10px;bottom:10px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:6px}
.mtl-cuenta button{font:500 17px var(--b-letra,Inter),sans-serif;border-radius:999px;padding:4px;cursor:pointer;border:0;background:#fff;color:var(--azul);box-shadow:inset 0 0 0 1.5px var(--azul)}
.mtl-cuenta button.mas{background:var(--azul);color:#fff;box-shadow:none}
.mtl-cuenta button:disabled{opacity:.35;cursor:default}
.mtl-cuenta b{font-size:15px;min-width:20px;text-align:center}

.mtl-pedir-fijo{display:none}

@media (max-width:1280px){.mtl-bandeja{grid-template-columns:repeat(3,minmax(0,1fr))}.mtl-rejilla{grid-template-columns:300px minmax(0,1fr)}}
@media (max-width:980px){
  .mtl-rejilla{grid-template-columns:minmax(0,1fr)}
  .mtl-lado{display:contents}
  .mtl-escena-col{order:1}.mtl-panel{order:2}.mtl-ritmo{order:3}
  .mtl-escena{height:540px}
}
@media (max-width:760px){
  .mtl-barra{position:static}
  .mtl-barra-dentro{padding:10px 16px;gap:10px}
  .mtl-barra-t{display:none}
  .mtl-puertas{order:3;width:100%}.mtl-puertas button{flex:1;padding:8px 6px;font-size:13px}
  .mtl-acciones{margin-left:auto}.mtl-acciones .boton{padding:9px 12px;font-size:13px}
  .mtl-acciones #pedir{display:none}
  .mtl-main{padding:12px 16px 96px}
  .mtl-escena{height:auto;border-radius:22px}
  .mtl-vista{flex:none;height:280px;order:1}
  .mtl-marcador{order:2;grid-template-columns:1fr;border:0;border-radius:0;padding:12px 16px}
  .mtl-girar{display:none}
  .mtl-cifra b{font-size:36px}
  .mtl-etq{padding:2px 7px;font-size:10.5px;border-radius:7px;margin-top:-4px}
  .mtl-etq b,.mtl-etq .s{display:inline;font-size:10.5px}.mtl-etq .s{margin-left:4px}
  .mtl-etq .largo{display:none}.mtl-etq .corto{display:inline}
  .mtl-etq small,.mtl-etq .ver,.mtl-etq .quitar{display:none}
  .mtl-etq.manda{border-width:2px}
  .mtl-correr-info{top:10px;right:10px;font-size:12px}
  .mtl-bandeja{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(170px,46%);overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:6px;margin:0 -16px;padding-left:16px;padding-right:16px}
  .mtl-pieza{scroll-snap-align:start;cursor:pointer}
  .mtl-bandeja-cab{margin-top:14px}
  .mtl-sabido ol{grid-template-columns:1fr 1fr}
  html .boton.mtl-pedir-fijo{display:flex;justify-content:center;position:fixed;left:16px;right:16px;width:auto;bottom:14px;z-index:40;border-radius:999px;font-weight:500;box-shadow:0 10px 30px -8px rgba(0,76,151,.55)}
}

/* ── Pedir oferta (piel B): cabecera con conectores; debajo, en banda gris, tu línea a la izquierda y el formulario a la derecha ── */
.po-cab{--b-pt:clamp(48px,6vw,80px);--b-pb:clamp(40px,4.4vw,60px)}
.po-banda{--b-pt:clamp(40px,5vw,64px)}
.po-rejilla{display:grid;grid-template-columns:1.15fr .85fr;gap:20px;align-items:start;text-align:left}
.po-caja{background:#fff;border-radius:28px;padding:clamp(24px,2.6vw,34px)}
.po-caja h2{font-size:clamp(22px,2vw,28px);line-height:1.14;font-weight:600;letter-spacing:-.02em}
.po-caja h2 small{font-size:15px;font-weight:500;color:var(--gris);letter-spacing:0;margin-left:6px}
.po-placa{font-size:15px;color:var(--gris);margin-top:6px}
.po-puestos{margin-top:16px;display:grid}
.po-puesto{display:grid;grid-template-columns:84px 1fr auto;gap:16px;align-items:center;padding:12px 0;border-top:1px solid var(--b-filete,#DCE3EB)}
.po-puesto:first-child{border-top:0}
.po-puesto figure{margin:0;width:84px;height:60px;border-radius:14px;overflow:hidden;background:var(--b-gris,#F5F7FA)}
.po-puesto img{width:100%;height:100%;object-fit:cover}
.po-puesto h3{font-size:16.5px;font-weight:600;letter-spacing:-.01em}.po-puesto p{font-size:14px;color:var(--gris);margin:1px 0 0}
.po-puesto .po-der{display:grid;justify-items:end;gap:4px;text-align:right}
.po-puesto .po-der .b-enlace{font-size:15px;white-space:nowrap}
.po-puesto .po-s{font-size:15.5px;font-weight:600;font-variant-numeric:tabular-nums}
.po-puesto .po-s.sd{font-size:13.5px;font-weight:500;color:var(--gris)}
.po-puesto.manda .po-s{box-shadow:inset 0 -3px 0 var(--amarillo)}
.po-ritmo{display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:center;margin-top:12px;padding-top:18px;border-top:1px solid var(--b-filete,#DCE3EB)}
.po-ritmo b{font-size:48px;font-weight:600;letter-spacing:-.04em;color:var(--azul);line-height:1}
.po-ritmo p{font-size:14px;color:var(--gris);margin:0;line-height:1.45}.po-ritmo p strong{color:var(--tinta);font-weight:600}
.po-config{margin-top:14px;padding:16px 18px;border-radius:18px;background:var(--b-gris,#F5F7FA)}
.po-config h3{font-size:15px;font-weight:600}
.po-config ul{margin:8px 0 0;padding:0 0 0 18px;font-size:14.5px;line-height:1.5;color:var(--tinta)}
.po-botones{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}
.po-botones .boton{padding:10px 18px;font-size:15px;cursor:pointer;border:0}
.po-falta,.po-dicho{margin-top:20px}
.po-falta h2,.po-dicho h2{font-size:22px}
.po-falta ul{display:grid;gap:8px;margin-top:14px;padding:0;list-style:none}
.po-falta li{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:start;font-size:15px;line-height:1.45;background:var(--b-gris,#F5F7FA);border-radius:16px;padding:12px 14px}
.po-falta li::before{content:"?";width:22px;height:22px;border-radius:50%;background:#fff;color:var(--gris);display:grid;place-items:center;font-size:12px;font-weight:700}
.po-falta li.ficha::before{content:"!";color:#7A5E0C;background:#FBF3D6}
.po-falta li.fuera::before{content:"×";color:#B42318;background:#FCEBE9}
.po-falta li b{font-weight:600}
.po-dicho dl{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:14px}
.po-dicho dl div{background:var(--b-gris,#F5F7FA);border-radius:14px;padding:10px 12px}
.po-dicho dt{font-size:12px;color:var(--gris);font-weight:600}.po-dicho dd{margin:0;font-size:14.5px}
.po-form{display:grid;gap:14px}
.po-form .lv-dosc{gap:14px}
.po-form label.campo{display:grid;gap:6px;font-size:13.5px;font-weight:600}
.po-form input:not([type=checkbox]),.po-form textarea{padding:13px 16px;border:1px solid transparent;border-radius:14px;background:var(--b-gris,#F5F7FA);font-size:16px;transition:border-color .15s,background .15s}
.po-form input:not([type=checkbox]):focus,.po-form textarea:focus{outline:0;border-color:var(--azul);background:#fff}
.po-form .lv-check{margin-top:0}
.po-form .b-boton{width:100%;margin-top:4px}
/* La máquina que llega de la ficha (21-10): un campo más del formulario, con el aspecto de los otros, «Quitar» y el desplegable para cambiarla */
.po-maquina{display:grid;gap:14px}.po-maquina[hidden]{display:none}
.po-maquina-fila{display:grid;gap:6px}
.po-maquina-cab{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-size:13.5px;font-weight:600}
.po-quitar{padding:0;border:0;background:none;font:inherit;font-weight:500;color:var(--azul);cursor:pointer}
.po-quitar:hover{text-decoration:underline;text-underline-offset:3px}
.po-quitar:focus-visible{outline:2px solid var(--azul);outline-offset:3px;border-radius:6px}
.po-form select{width:100%;min-width:0;padding:13px 44px 13px 16px;border:1px solid transparent;border-radius:14px;background:var(--b-gris,#F5F7FA) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5l5-5' fill='none' stroke='%2315283D' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 16px center/12px 8px;font:inherit;font-size:16px;color:var(--tinta);text-overflow:ellipsis;-webkit-appearance:none;appearance:none;cursor:pointer;transition:border-color .15s,background-color .15s}
.po-form select:focus{outline:0;border-color:var(--azul);background-color:#fff}
.po-quien{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:center;margin-top:6px;padding-top:18px;border-top:1px solid var(--b-filete,#DCE3EB)}
.po-quien .inicial{width:56px;height:56px;font-size:18px;border:2px dashed #B9CCE4;background:var(--b-gris,#F5F7FA)}
.po-quien-logo{box-sizing:border-box;width:56px;height:56px;padding:13px;border-radius:50%;background:var(--b-gris,#F5F7FA)}
/* «Te contesta» (22-10): David, con su foto (assets/img/equipo/david-retrato.jpg, la pone equipo-fotos.js) o, mientras no esté, sus iniciales */
.po-quien-foto{position:relative;width:56px;height:56px;border-radius:50%;overflow:hidden;background:linear-gradient(165deg,#EEF2F7 0%,#DFE7F0 100%)}
.po-quien-foto .cx-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 18%}
.po-quien .po-quien-ini{position:absolute;inset:0;display:grid;place-items:center;font-size:18px;font-weight:600;letter-spacing:.02em;color:var(--azul)}   /* dos clases: si no, «.po-quien span» la pone en gris y pequeña */
.po-quien-foto[data-fotos="1"] .po-quien-ini{visibility:hidden}
.po-quien b{display:block;font-size:15.5px;font-weight:600}.po-quien span{font-size:13.5px;color:var(--gris)}
.po-enviado{background:rgba(0,76,151,.07);border-radius:16px;padding:14px 16px;font-size:14.5px;line-height:1.5}
.po-enviado b{color:var(--azul)}
.po-enviado a{color:var(--azul);font-weight:500;text-decoration:none}.po-enviado a:hover{text-decoration:underline;text-underline-offset:3px}
.po-vacio{text-align:center;padding:36px 12px}
.po-vacio p{color:var(--gris);margin:10px 0 20px;font-size:16px}
@media (max-width:980px){.po-rejilla{grid-template-columns:1fr}}
@media (max-width:760px){.po-caja{padding:22px 18px;border-radius:24px}.po-puesto{grid-template-columns:64px 1fr;gap:12px}.po-puesto figure{width:64px;height:48px}.po-puesto .po-der{grid-column:2;justify-items:start;text-align:left;display:flex;gap:8px;align-items:center;flex-wrap:wrap}.po-dicho dl{grid-template-columns:1fr}.po-ritmo b{font-size:38px}}

/* ── Casos (piel B): cada caso, una tarjeta blanca sobre la banda gris; la cita a la izquierda y su línea tipo a la derecha ── */
.casos{display:grid;gap:20px;margin-top:clamp(36px,5vw,56px);text-align:left}
.caso{display:grid;grid-template-columns:1.1fr .9fr;gap:0;background:#fff;border-radius:28px;overflow:hidden}
.caso-cita{padding:clamp(26px,3vw,40px)}
.caso-cita .testimonio{box-shadow:none;border:0;background:none;padding:40px 0 0;border-radius:0}
.caso-cita .testimonio::before{right:auto;left:-4px;top:-14px;font-size:72px}
.caso-cita .estrellas{position:absolute;right:0;top:4px}
.caso-cita blockquote p{font-size:17px;line-height:1.55;color:var(--tinta)}.caso-cita blockquote p+p{margin-top:10px}.caso-cita blockquote b{font-weight:600;color:var(--tinta)}
.caso-cita .testimonio footer{border-top-color:var(--b-filete,#DCE3EB)}
.caso-cita footer a{display:block;font-size:12.5px;color:var(--gris)}
.caso-linea{padding:clamp(26px,3vw,40px);display:flex;flex-direction:column;gap:10px;background:var(--b-gris,#F5F7FA);margin:10px;border-radius:22px}
.caso-tipo{align-self:flex-start;font-size:12.5px;font-weight:600;color:var(--azul)}
.caso-linea h3{font-size:clamp(22px,2vw,28px);line-height:1.14;font-weight:600;letter-spacing:-.02em}
.caso-linea p{color:var(--gris);font-size:16px;line-height:1.5;margin:0}
.caso-puestos{display:flex;flex-wrap:wrap;gap:8px 22px;align-items:center;margin:6px 0 2px;padding:0;list-style:none}
.caso-puestos li{font-size:13.5px;font-weight:600;background:#fff;border-radius:999px;padding:6px 12px}
.caso-puestos li+li::before{content:"→";position:absolute;left:-17px;top:50%;transform:translateY(-50%);color:var(--gris2);font-weight:400}
.caso-puestos li+li{position:relative}
.caso-linea .pendiente{align-self:flex-start}
.caso-linea .b-enlaces{justify-content:flex-start;margin-top:auto;padding-top:8px;font-size:17px}
/* Oculto 20-10: sin las líneas tipo, los tres testimonios van en fila (uno debajo de otro en el móvil) */
.casos.solo-citas{grid-template-columns:repeat(3,minmax(0,1fr))}
.casos.solo-citas .caso{grid-template-columns:1fr}
/* El documental (sin vídeo): los cinco capítulos de una línea, en fila */
.capitulos{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;margin:clamp(36px,5vw,56px) auto 0;padding:0;list-style:none;text-align:left}
.capitulo{display:flex;flex-direction:column;background:var(--b-gris,#F5F7FA);border-radius:24px;overflow:hidden}
.capitulo figure{margin:0;height:clamp(120px,11vw,156px);padding:14px 14px 0;box-sizing:border-box}
.capitulos .capitulo img{display:block;width:100%;height:100%;object-fit:contain}
.capitulo>div{padding:14px 18px 20px}
.capitulo b{display:block;font-size:17px;font-weight:600;letter-spacing:-.01em;margin-top:2px}.capitulo span{font-size:14px;color:var(--gris);line-height:1.45;display:block;margin-top:4px}
.capitulo small{font-size:12.5px;font-weight:600;color:var(--azul)}
.capitulos-sim{display:flex;justify-content:center;margin-top:14px}
@media (max-width:980px){.casos.solo-citas{grid-template-columns:1fr}.caso{grid-template-columns:1fr}.capitulos{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:760px){.caso-cita{padding:22px 20px 8px}.caso-linea{padding:22px 20px}.capitulos{grid-template-columns:1fr}.capitulo{flex-direction:row;align-items:center}.capitulo figure{flex:none;width:104px;height:96px;padding:10px 0 10px 10px}.capitulo>div{padding:12px 16px}}