/* p-procesos.css · R9-D3 · las 8 páginas de proceso: escenas fijadas al scroll (.pp-esc), piezas vivas (.pp-auto),
   cierre sin foto (.pp-ct) y héroe más grande en las 3 que ya tenían demo (.pp-grande).
   Sin JS o con movimiento reducido todo se ve en su estado final (sin .pp-vivo). Letra mínima 12 px. */

/* ---------- héroe más grande ---------- */
@media (min-width:1100px){
  .pp-cab .mt-demo{max-width:560px}
  .ps-cab.pp-grande .ps-cab-in{grid-template-columns:minmax(0,1fr) 620px;gap:56px}
  .ps-cab.pp-grande .ps-demo{zoom:1.17}
}
@media (min-width:1280px){
  .ps-cab.pp-grande .ps-cab-in{grid-template-columns:minmax(0,1fr) 680px}
  .ps-cab.pp-grande .ps-demo{zoom:1.28}
}

/* ---------- ventanas de ejemplo ---------- */
.pp-v{position:relative;background:var(--blanco);border:1px solid var(--linea);border-radius:18px;box-shadow:0 1px 2px rgba(29,29,31,.05),0 30px 60px -40px rgba(29,29,31,.45);overflow:hidden;font-size:14px;line-height:1.4;color:var(--ink);text-align:left}
.pp-v-top{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 14px;border-bottom:1px solid var(--linea);background:var(--gris)}
.pp-v-top b{font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pp-v-top small{font-size:12px;color:var(--tenue);white-space:nowrap}
.pp-hoja{padding:14px 16px;margin:0}
.pp-hoja h4{margin:0 0 6px;font-size:17px;line-height:1.25;font-weight:600}
.pp-hoja p{margin:0 0 8px}
.pp-hoja ul,ul.pp-hoja{margin:6px 0 0;padding-left:20px;display:grid;gap:4px}
ul.pp-hoja{padding:14px 16px 14px 34px}
.pp-l{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 14px;border-top:1px solid var(--linea)}
.pp-v-top+.pp-l{border-top:0}
.pp-l>span{color:var(--tenue);min-width:0}
.pp-l>b{font-weight:600;text-align:right}
.pp-v-pie{display:flex;align-items:center;flex-wrap:wrap;gap:8px;padding:12px 14px;border-top:1px solid var(--linea)}
.pp-btn{display:inline-flex;align-items:center;height:32px;padding:0 14px;border-radius:999px;background:var(--ink);color:#fff;font-size:13px;font-weight:600;white-space:nowrap;transition:transform .25s var(--ease),background .25s var(--ease)}
.pp-btn.o{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1px var(--linea)}
.pp-chip{font-size:12px;line-height:1.3;padding:5px 10px;border-radius:999px;background:var(--bruma);color:var(--acero);font-weight:600}
.pp-v .mt-tag,.pp-alerta .mt-tag,.pp-cel .mt-tag{font-size:12px}
.pp-nota{background:#FFF1B8;padding:14px 16px;border-radius:6px;box-shadow:0 18px 30px -22px rgba(29,29,31,.5);display:grid;gap:4px;font-size:14px;transform:rotate(-2deg)}
.pp-nota b{font-size:13px;text-transform:uppercase;letter-spacing:.04em}
.pp-cursor{height:2px;width:46%;background:var(--linea);margin-top:14px!important}
.pp-tipo{white-space:pre-wrap}

/* ---------- escena fijada ---------- */
.pp-esc{position:relative;background:var(--blanco)}
.pp-esc.gris{background:var(--gris)}
.pp-fijo{padding:64px 0}
.pp-esc-in{display:grid;gap:28px;align-items:center}
.pp-esc .sec-tit{font-size:34px;line-height:1.08;letter-spacing:-.02em;margin:0 0 18px}
.pp-pasos{list-style:none;margin:0;padding:0;display:grid;gap:14px;counter-reset:pp}
.pp-pasos li{counter-increment:pp;display:grid;gap:4px;padding-left:42px;position:relative}
.pp-pasos li::before{content:counter(pp);position:absolute;left:0;top:-1px;width:28px;height:28px;border-radius:50%;background:var(--ink);color:#fff;font-size:14px;font-weight:600;display:grid;place-items:center}
.pp-pasos b{font-size:19px;line-height:1.3;font-weight:600}
.pp-pasos span{font-size:16px;line-height:1.45;color:var(--tenue)}
.pp-barra{display:none}
.pp-pieza{min-width:0}
.pp-marco{position:relative;height:440px;max-width:560px;margin:0 auto}
.pp-marco>.pp-v,.pp-marco>.pp-nota,.pp-marco>.pp-alerta{position:absolute}
@media (min-width:1100px){
  .pp-fijo{padding:96px 0}
  .pp-esc-in{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:64px}
  .pp-esc .sec-tit{font-size:52px;margin-bottom:28px}
  .pp-marco{height:540px;max-width:640px}
  .pp-v{font-size:15px}
}
/* a 1280 o más la pieza de la escena manda: más ancha y un 12 % más grande (sin tocar su maqueta interna) */
@media (min-width:1280px){
  .pp-esc-in{grid-template-columns:minmax(0,4.2fr) minmax(0,7.8fr);gap:56px}
  .pp-esc .sec-tit{font-size:48px}
  .pp-marco{zoom:1.12}
}
/* vivo: la sección mide n pasos y la caja se queda fija mientras la pieza se monta */
html.pp-vivo .pp-esc{height:calc(100svh + (var(--n) - 1) * 60svh)}
html.pp-vivo .pp-fijo{position:sticky;top:var(--nav);height:calc(100svh - var(--nav));padding:0;display:flex;align-items:center;overflow:hidden}
html.pp-vivo .pp-fijo>.caja{width:100%}
/* la caja fija va centrada: su aire de arriba y de abajo se come el relleno de la sección vecina, sin huecos dobles */
html.pp-vivo .pp-esc{margin-top:-48px;margin-bottom:-72px}
@media (min-width:1100px){html.pp-vivo .pp-esc{margin-top:-64px;margin-bottom:-96px}}
html.pp-vivo .pp-pasos li{opacity:.38;transition:opacity .4s var(--ease)}
html.pp-vivo .pp-pasos li.act{opacity:1}
html.pp-vivo .pp-pasos li>span{display:none}
html.pp-vivo .pp-pasos li.act>span{display:block}
html.pp-vivo .pp-pieza [data-en],html.pp-vivo .pp-auto [data-en]{transition:opacity .5s var(--ease),transform .6s var(--ease),visibility 0s linear 0s}
html.pp-vivo .pp-pieza [data-en]:not(.si){opacity:0;transform:translateY(18px) scale(.97);visibility:hidden;transition:opacity .35s var(--ease),transform .35s var(--ease),visibility 0s linear .35s}
html.pp-vivo .pp-auto [data-en]:not(.si){opacity:0;transform:translateY(10px);visibility:hidden;transition:opacity .35s var(--ease),transform .35s var(--ease),visibility 0s linear .35s}
html:not(.pp-vivo) .pp-pieza [data-hasta]{display:none}
html.pp-vivo .pp-auto[data-paso="1"] .pp-pulsa{transform:scale(.92);background:var(--acero)}
@media (max-width:1099px){
  html.pp-vivo .pp-esc-in{gap:14px;align-content:center}
  html.pp-vivo .pp-esc .sec-tit{font-size:30px;margin-bottom:12px}
  html.pp-vivo .pp-pasos li{display:none}
  html.pp-vivo .pp-pasos li.act{display:grid}
  html.pp-vivo .pp-barra{display:flex;gap:6px;margin-top:14px}
  .pp-barra i{flex:1;height:4px;border-radius:2px;background:var(--linea);transition:background .4s var(--ease)}
  html.pp-vivo .pp-barra i.si{background:var(--ink);opacity:1;transform:none}
  html.pp-vivo .pp-barra i:not(.si){opacity:1;transform:none}
  html.pp-vivo .pp-marco{height:min(440px,calc(100svh - var(--nav) - 230px));min-height:380px}
}
.pp-prog{height:3px;background:var(--linea)}
.pp-prog i{display:block;height:100%;background:var(--acero);transform-origin:left;transform:scaleX(var(--p,1))}

/* propuestas */
.pp-word{left:0;top:0;width:80%;z-index:1}
.pp-word .pp-hoja{height:170px;font-family:Georgia,'Times New Roman',serif;font-size:16px}
.pp-marco>.pp-nota{right:2%;top:150px;width:52%;z-index:2}
.pp-notas{right:0;top:0;width:66%;z-index:3}
.pp-prop{left:0;bottom:0;width:94%;z-index:4}
/* onboarding */
.pp-primer{inset:0}
.pp-hitos{list-style:none;margin:0;padding:14px 16px;display:grid;gap:14px}
.pp-hitos li{display:grid;grid-template-columns:84px minmax(0,1fr);gap:10px;align-items:start}
.pp-hitos time{font-size:13px;font-weight:600;color:var(--acero);padding-top:2px}
.pp-hitos li>div{display:grid;gap:3px;justify-items:start}
.pp-hitos li>div>span{font-size:14px;color:var(--tenue)}
.pp-aviso{background:var(--bruma);border-radius:12px;padding:10px 12px;width:100%}
.pp-aviso>span{color:var(--ink)!important}
/* clientes */
.pp-form{left:0;top:0;width:86%;z-index:1}
.pp-campos{display:grid;gap:10px;padding:14px 16px}
.pp-campo-f{display:grid;gap:4px}
.pp-campo-f span{font-size:12px;color:var(--tenue)}
.pp-campo-f b{font-weight:500;border:1px solid var(--linea);border-radius:10px;padding:9px 12px;min-height:40px}
.pp-campos .pp-btn{justify-self:start}
.pp-crm{right:0;top:0;width:82%;z-index:2}
.pp-bienv{left:0;bottom:0;width:90%;z-index:3}
.pp-canal{font-style:normal;font-size:12px;font-weight:600;padding:4px 10px;border-radius:999px;background:var(--bruma);color:var(--acero);white-space:nowrap}
.pp-canales .pp-l>span{color:var(--ink)}
/* facturas */
.pp-pdfv{left:0;top:0;width:74%;z-index:1}
.pp-fact{display:grid;gap:6px}
.pp-campo{position:relative;display:flex;justify-content:space-between;gap:10px;padding:7px 9px}
.pp-campo span{color:var(--tenue);position:relative}
.pp-campo b{font-weight:600;position:relative;text-align:right}
.pp-marca{position:absolute;inset:0;border:2px solid var(--cielo-hondo);border-radius:8px;background:rgba(166,206,233,.22)}
.pp-hojav{right:0;bottom:0;width:100%;z-index:2}
.pp-tabla{display:grid;font-size:13px}
.pp-tabla .cab,.pp-tabla .fila{display:grid;grid-template-columns:1.5fr .8fr 1fr;gap:8px;padding:9px 14px;align-items:center;border-top:1px solid var(--linea)}
.pp-tabla .cab{color:var(--tenue);font-size:12px;border-top:0}
.pp-tabla i{font-style:normal;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pp-nueva{background:#EAF6EE}
@media (max-width:560px){.pp-tabla .cab,.pp-tabla .fila{grid-template-columns:1.4fr .8fr 1fr}}
.pp-correo>span:first-child{display:grid;flex:1;color:var(--ink)}
.pp-correo>span:first-child b{font-weight:600}
.pp-pdf{font-size:12px;font-weight:700;color:#B3261E;border:1px solid #F0C8C5;border-radius:6px;padding:2px 6px}
.pp-ya{min-width:86px;text-align:right}
.pp-hero-auto .pp-l{padding:14px 16px}
/* seguimiento */
.pp-cal{left:0;top:0;width:100%;z-index:1}
.pp-cal-g{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;padding:12px}
.pp-dsem{font-size:12px;color:var(--tenue);text-align:center;font-weight:600}
.pp-cel{min-height:74px;border-radius:10px;background:var(--gris);padding:6px;display:grid;align-content:start;gap:4px}
.pp-cel small{font-size:12px;color:var(--tenue)}
.pp-cel .mt-tag{white-space:normal;line-height:1.2}
.pp-alerta{right:0;bottom:0;width:80%;z-index:2;background:var(--ink);color:#fff;border-radius:16px;padding:16px;display:grid;gap:6px;box-shadow:0 30px 50px -30px rgba(29,29,31,.6);font-size:15px}
.pp-alerta>span{color:#E5E5EA}
.pp-alerta-b{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}
.pp-alerta .pp-btn{background:#fff;color:var(--ink)}
.pp-alerta .pp-btn.o{background:transparent;color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.45)}
@media (min-width:1100px){.pp-cel{min-height:96px}.pp-alerta{width:70%}}

/* ---------- bloques a dos columnas con pieza que se mueve sola ---------- */
.pp-dos .pp-auto{max-width:460px;width:100%;margin:0 auto}
.pp-tu .pp-hecho{margin-left:auto}

/* ---------- cierre: pieza del proceso + chat, sin foto ---------- */
.pp-ct .pp-ct-pieza{grid-area:1/1;align-self:start;justify-self:start;width:70%;position:relative;z-index:0}
.pp-ct .ct-chat{z-index:1;margin-top:150px}
.pp-res .pp-l{font-size:14px}
.pp-res .pp-l>span{color:var(--ink)}
@media (min-width:900px){.pp-ct .pp-ct-pieza{width:66%}.pp-ct .ct-chat{margin-top:160px}}

/* «Va bien con»: pieza real en lugar del esqueleto */
.pp-tarjs .pp-tm{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:64px;padding:12px 14px;border-radius:14px;background:var(--bruma);font-size:14px;color:var(--ink)}
.pp-tarjs .pp-tm b{margin:0;font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.pp-tarjs .pp-tm .mt-tag{font-size:12px;flex:none}
/* LH: la etiqueta del pie de la propuesta no se queda a media opacidad (contraste): aparece con visibility, se mueve con transform */
html.js:not(.quieto) body .mt-doc .mt-doc-pie{transition:transform .5s var(--ease),visibility 0s}
html.js:not(.quieto) body .mt-doc:not(.lista) .mt-doc-pie{opacity:1;visibility:hidden}
/* propuestas, escritorio: más aire entre el héroe y la escena para que no hablen a la vez a media pantalla (cruce de 97 palabras en y=480) */
@media (min-width:1100px){html.pp-vivo .pp-esc:has(#llamada-tit){margin-top:72px}}

/* ===================== R9-E3 (30-oct) ===================== */
/* «Va bien con»: tarjetas propias (sin .mt-tarjs, cuyo foco las volvía grises en móvil); en reposo, blancas y texto negro */
.pp-tarjs{list-style:none;margin:32px 0 0;padding:0;display:grid;gap:16px}
@media (min-width:720px){.pp-tarjs{grid-template-columns:repeat(3,minmax(0,1fr))}}
.pp-tarjs .mt-tarj,html.js .pp-tarjs .mt-tarj.foco,html.js:not(.quieto) .pp-tarjs .mt-tarj.foco{background-color:#fff;color:var(--ink)}
.pp-tarjs .mt-tarj>span:last-child{color:var(--tenue)}
/* qué pasa solo y qué no: cada paso cambia de «A mano» a «Solo» (o «Para ti») */
.pp-sw{display:grid;justify-items:end;flex:none}
.pp-sw>*{grid-area:1/1}
.mt-tag.pp-antes{background:var(--gris);color:#55555A;box-shadow:inset 0 0 0 1px var(--linea)}
html:not(.pp-vivo) .pp-sw>.pp-antes,html.pp-vivo .pp-sw>.si+.pp-antes{visibility:hidden}
.pp-pasa .pp-l>span:first-child,.pp-rep .pp-l>span{min-width:0}
.pp-rep .pp-l>span{color:var(--tenue)}
.pp-rep .pp-l>b{font-weight:600;text-align:right}
/* onboarding: la lista del primer día se marca sola */
.pp-ck{justify-content:flex-start}
.pp-ck>span{flex:1;min-width:0}
.pp-caja{position:relative;flex:none;width:24px;height:24px;border-radius:7px;box-shadow:inset 0 0 0 1.5px #C7C7CC}
.pp-tick{position:absolute;inset:0;border-radius:7px;background:#34A853;display:grid;place-items:center}
.pp-ckt{margin-left:auto;flex:none}
/* facturas: la hoja de cálculo */
.pp-xg{display:grid;grid-template-columns:26px minmax(0,1.3fr) minmax(0,.7fr) minmax(0,1.2fr);gap:1px;background:var(--linea)}
.pp-xg>*{background:#fff;padding:8px;min-width:0;font-size:14px;line-height:1.3}
.pp-xg>.pp-xn{background:var(--gris);color:#55555A;font-size:12px;text-align:center;padding:6px 2px}
.pp-xg>b{background:#EAF6EE;font-size:13px;font-weight:600}
.pp-xg i{font-style:normal}
.pp-xg .mt-tag{white-space:normal;line-height:1.2}
/* dos columnas más anchas para la pieza en escritorio */
@media (min-width:1100px){
  .mt-dos.pp-ancho{grid-template-columns:minmax(0,4fr) minmax(0,6fr)}
  .mt-dos.pp-ancho.inv{grid-template-columns:minmax(0,6fr) minmax(0,4fr)}
  .mt-dos.pp-ancho.inv>:first-child{order:2}
  .mt-dos.pp-ancho.inv>:last-child{order:1}
  .pp-ancho .pp-auto,.pp-ancho .mt-demo{max-width:600px;width:100%;margin:0 auto}
  .pp-ancho .pp-v{font-size:16px}
}
/* escena: la pieza va dentro de una pantalla dibujada (sombra, no ocupa sitio), así no queda ventana blanca sobre blanco */
@media (min-width:900px){
  .pp-esc .pp-marco{border-radius:18px;background:var(--bruma);box-shadow:0 0 0 18px var(--bruma),0 0 0 28px var(--ink)}
}
/* preguntas y cierre sin aire muerto en escritorio */
@media (min-width:900px){
  html body main>section.faq.pp-faq{min-height:0;padding-top:112px;padding-bottom:112px}
}
/* tableros pequeños: en móvil sin contador; el de propuestas, a una columna hasta 1280 para que quepan las horas */
@media (max-width:520px){.pp-cab .dk-col b,.pp-dk .dk-col b{font-size:12px}.pp-cab .dk-n,.pp-dk .dk-n{display:none}}
@media (min-width:900px) and (max-width:1279px){.mt-dos.pp-ancho:has(.pp-dk),.mt-dos.pp-ancho.inv:has(.pp-dk){grid-template-columns:minmax(0,1fr)}.pp-ancho .pp-dk{max-width:640px}}
/* tablero de propuestas: sin la hora (no cabe en la tarjeta), como en las cabeceras */
.pp-dk .dk-h{display:none}

/* ===================== R9-F3 (30-oct) ===================== */
/* contraste AA: las etiquetas de las piezas automáticas se descubren con una cortinilla, nunca a media opacidad */
html.pp-vivo .pp-auto .pp-ya[data-en],html.pp-vivo .pp-auto .mt-tag[data-en],html.pp-vivo .pp-auto .pp-hecho[data-en]{opacity:1;transform:none;clip-path:inset(0 0 0 0 round 13px);transition:clip-path .45s var(--ease),visibility 0s linear 0s}
html.pp-vivo .pp-auto .pp-ya[data-en]:not(.si),html.pp-vivo .pp-auto .mt-tag[data-en]:not(.si),html.pp-vivo .pp-auto .pp-hecho[data-en]:not(.si){opacity:1;transform:none;clip-path:inset(0 100% 0 0 round 13px);visibility:hidden;transition:clip-path .3s var(--ease),visibility 0s linear .3s}
/* cada pieza automática lleva su barra de avance: la demo está corriendo y se ve cuándo llega el paso siguiente */
.pp-prog{display:block;width:88px;height:3px;margin:16px auto 0;border-radius:3px;background:var(--linea);overflow:hidden}
.pp-prog b{display:block;height:100%;background:var(--ink);transform:scaleX(0);transform-origin:left}
.pp-prog.va b{animation:pp-prog var(--ms,1400ms) linear infinite}
@keyframes pp-prog{to{transform:scaleX(1)}}
.pp-prog.arriba{margin:0 0 16px}.mt-dos .pp-prog.arriba{margin:0 auto 16px}.pp-tarjs~.pp-prog,.rel-tit~.pp-prog.arriba{margin:20px 0 0}
/* la escena también va dentro de su pantalla dibujada en móvil: sin ventana blanca sobre blanco */
@media (max-width:899px){.pp-esc .pp-marco{border-radius:14px;background:var(--bruma);box-shadow:0 0 0 8px var(--bruma),0 0 0 12px var(--ink)}}
/* cierre sin el aire muerto de abajo en escritorio */
@media (min-width:900px){html:root body section.contacto.pp-ct{min-height:0;padding-top:112px;padding-bottom:112px}}

/* ===================== R9-G3 (30-oct) · la pieza de cada proceso manda ===================== */
/* placa de color: la pieza va siempre dentro de una superficie de la paleta, nunca blanca sobre blanco */
.pp-placa{position:relative;background:var(--cielo);border-radius:24px;padding:20px;display:flex;flex-direction:column;justify-content:center;align-items:center;min-width:0}
.pp-placa.hondo{background:var(--cielo-hondo)}
.pp-placa>.pp-auto,.pp-placa>.mt-demo,.pp-placa>.ps-filtro{width:100%;max-width:600px}
.pp-placa .pp-prog.arriba{margin:0 auto 16px;background:rgba(29,29,31,.16)}
.pp-placa .pp-prog b{background:var(--ink)}
.pp-placa.foto{padding:0;overflow:hidden;display:block}
.pp-placa.foto .mt-foto{border-radius:0;height:100%}
.pp-placa.foto.pp-fmovil{padding:28px;display:grid;place-items:center}
.pp-placa.foto.pp-fmovil .mt-foto{border-radius:22px;height:auto;max-width:260px;width:100%}
.pp-placa.pp-fplaca{display:block}
.ps-cab .pp-hp{border-radius:24px;padding:16px;display:block}
.ps-cab .pp-hp>.mt-demo{max-width:none}
/* secciones de color a sangre */
.ps-sec.pp-acero{background:var(--acero);color:#fff}
.ps-sec.pp-acero .sec-tit{color:#fff}
.ps-sec.pp-acero .ps-txt{color:#E3EEF6}
.ps-sec.pp-acero .pp-placa{background:#4F7FA4}
.ps-sec.pp-acero .pp-prog.arriba{background:rgba(255,255,255,.28)}
.ps-sec.pp-acero .pp-prog b{background:#fff}
.ps-sec.pp-g{padding:64px 0;overflow-x:clip}
.pp-gg{display:grid;gap:28px}
.pp-gt{min-width:0}
.pp-gt .ps-txt{max-width:36ch}
/* sin marcos gruesos en ninguna anchura */
.pp-esc .pp-marco{box-shadow:none}
@media (min-width:1100px){
  .ps-sec.pp-g{padding:104px 0}
  .ps-sec.pp-g>.caja{max-width:none;padding:0}
  .pp-gg{grid-template-columns:minmax(32px,1fr) minmax(0,420px) 64px minmax(0,716px) minmax(32px,1fr);gap:0;align-items:center}
  .pp-gt{grid-column:2;grid-row:1}
  .pp-gv{grid-column:4/6;grid-row:1;min-width:0}
  .pp-gg.inv{grid-template-columns:minmax(32px,1fr) minmax(0,716px) 64px minmax(0,420px) minmax(32px,1fr)}
  .pp-gg.inv .pp-gt{grid-column:4}
  .pp-gg.inv .pp-gv{grid-column:1/3}
  .pp-gv>.pp-placa{min-height:600px;border-radius:32px 0 0 32px;padding:64px max(64px,calc((100vw - 1220px)/2 + 32px)) 64px 72px}
  .pp-gg.inv .pp-gv>.pp-placa{border-radius:0 32px 32px 0;padding:64px 72px 64px max(64px,calc((100vw - 1220px)/2 + 32px))}
  .pp-gv>.pp-placa.foto{padding:0}
  .pp-gv>.pp-placa.foto.pp-fmovil{padding:48px}
  .pp-gv>.pp-placa.foto .mt-foto{position:absolute;inset:0;aspect-ratio:auto}
  .pp-gv>.pp-placa.foto.pp-fmovil .mt-foto{position:relative;inset:auto;aspect-ratio:1200/2328;max-width:300px}
  .pp-placa .pp-v{font-size:16px}
  .pp-placa .pp-v-top b{font-size:15px}
  .pp-gt .sec-tit{margin-bottom:20px}
  .ps-cab .pp-hp{border-radius:28px;padding:36px}
  .ps-cab.pp-grande .pp-hp .ps-demo{zoom:1}
  /* escena: texto a 4 columnas, la pieza a 8 sobre su placa hasta el borde */
  .pp-esc .pp-fijo>.caja.pp-esc-in{max-width:none;padding:0;grid-template-columns:minmax(32px,1fr) minmax(0,420px) 64px minmax(0,716px) minmax(32px,1fr);gap:0;align-items:center}
  .pp-esc .pp-esc-txt{grid-column:2;grid-row:1;min-width:0}
  .pp-esc .pp-pieza{grid-column:4/6;grid-row:1;align-self:stretch;display:flex;align-items:center;background:var(--cielo);border-radius:32px 0 0 32px;padding:56px max(64px,calc((100vw - 1220px)/2 + 32px)) 56px 72px}
  .pp-esc.hondo .pp-pieza{background:var(--cielo-hondo)}
  .pp-esc .pp-marco{zoom:1;width:100%;max-width:600px;height:540px;margin:0 auto;background:transparent;border-radius:0}
  .pp-esc .pp-v{font-size:16px}
}
@media (min-width:1280px){
  .ps-cab.pp-grande .pp-hp .ps-demo{zoom:1.12}
  .pp-esc .pp-marco{zoom:1}
}
/* móvil: la pantalla fijada se ve entera desde el paso 1, con borde fino y la altura de lo que lleva */
@media (max-width:1099px){
  .pp-esc .pp-marco{box-shadow:none}
  html.pp-vivo .pp-esc .pp-marco{display:grid;height:auto;min-height:0;max-width:560px;border:1px solid var(--linea);border-radius:16px;background:var(--cielo);padding:12px;box-shadow:none}
  html.pp-vivo .pp-esc .pp-marco>*{position:relative;inset:auto;left:auto;right:auto;top:auto;bottom:auto;width:auto;grid-area:1/1;align-self:start;transform:none}
  html.pp-vivo .pp-esc .pp-marco>.pp-nota,html.pp-vivo .pp-esc .pp-marco>.pp-alerta{align-self:end;justify-self:end;width:86%}
  html.pp-vivo .pp-esc .pp-marco>.pp-ficha{align-self:end;justify-self:end;width:72%}
  html:not(.pp-vivo) .pp-esc .pp-marco{display:grid;gap:12px;height:auto;background:var(--cielo);border:1px solid var(--linea);border-radius:16px;padding:12px}
  html:not(.pp-vivo) .pp-esc .pp-marco>*{position:relative;inset:auto;width:auto}
  .ps-cab .pp-hp .ps-demo{zoom:1}
}
/* preguntas en oscuro, con los procesos que van con este debajo del título */
html body main>section#faq.faq.pp-faq{background:var(--ink);color:#fff}
.pp-faq .faq-tit{color:#fff}
.pp-faq .faq-lista{border-top-color:rgba(255,255,255,.18)}
.pp-faq .faq-item{border-bottom-color:rgba(255,255,255,.18)}
.pp-faq .faq-item h3{color:#fff}
.pp-faq .faq-item summary:hover h3{color:var(--cielo)}
.pp-faq .faq-item summary:focus-visible{outline-color:var(--cielo)}
.pp-faq .faq-mas{background:rgba(255,255,255,.14)}
.pp-faq .faq-mas::before,.pp-faq .faq-mas::after{background:#fff}
.pp-faq .faq-item[open] .faq-mas{background:rgba(166,206,233,.32)}
.pp-faq .faq-item p{color:#C7C7CC}
.pp-junto{display:flex;flex-wrap:wrap;gap:10px;margin:8px 0 32px}
.pp-junto a{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 18px;border-radius:999px;background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px rgba(255,255,255,.26);color:#fff;font-size:16px;font-weight:500;text-decoration:none;transition:background .2s var(--ease),color .2s var(--ease)}
.pp-junto a::after{content:"→";font-size:15px;opacity:.7}
.pp-junto a:hover{background:var(--cielo);color:var(--ink)}
.pp-junto a:focus-visible{outline:2px solid var(--cielo);outline-offset:3px}
@media (min-width:900px){
  .pp-faq-cab{position:sticky;top:calc(var(--nav) + 32px);align-self:start}
  .pp-faq-cab .faq-tit{position:static;margin-bottom:28px}
  .pp-junto{margin:0}
}
/* cierre de los 4 que van en el reporte: solo el reporte, centrado, sin chat */
.pp-ct.pp-solo .ct-vivo{display:block;max-width:560px;margin-inline:auto}
.pp-ct.pp-solo .pp-ct-pieza{width:100%}
.pp-ct-nota{margin:18px 0 0;font-size:17px;line-height:1.5;color:var(--tenue);text-align:center}
.pp-ct-nota a{color:var(--acero);font-weight:600;text-decoration:underline;text-underline-offset:3px;display:inline-flex;align-items:center;min-height:44px}
.pp-ct .pp-rep{font-size:16px}
/* propuestas: la plantilla */
.pp-doc-in{padding:20px 22px;display:grid;gap:6px}
.pp-doc-in h4{margin:6px 0 4px;font-size:20px;line-height:1.2;font-weight:600}
.pp-logo{display:flex;align-items:center;gap:10px;padding-bottom:12px;border-bottom:2px solid var(--ink);font-weight:600}
.pp-logo i{width:28px;height:28px;border-radius:8px;background:var(--acero)}
/* onboarding */
.pp-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:2px}
.pp-chips em{font-style:normal;font-size:12px;line-height:1.3;font-weight:600;padding:4px 9px;border-radius:999px;background:var(--bruma);color:var(--acero)}
/* clientes nuevos */
.pp-canales .pp-canal{margin-left:8px}
.pp-reparto .pp-l>span:first-child{color:var(--ink)}
/* seguimiento: la línea del presupuesto */
.pp-linea{left:0;top:0;width:100%;z-index:1}
.pp-tren{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));padding:20px 12px 16px}
.pp-via{position:absolute;left:16.66%;right:16.66%;top:28px;height:3px;border-radius:3px;background:var(--linea);display:grid;grid-template-columns:1fr 1fr}
.pp-via b{display:block;height:100%;background:var(--acero);transform-origin:left}
html.pp-vivo .pp-pieza .pp-via b[data-en]{opacity:1;visibility:visible;transition:transform .7s var(--ease)}
html.pp-vivo .pp-pieza .pp-via b[data-en]:not(.si){opacity:1;visibility:visible;transform:scaleX(0)}
.pp-par{position:relative;display:grid;justify-items:center;gap:4px;text-align:center}
.pp-par i{width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:inset 0 0 0 4px var(--acero)}
.pp-par em{font-style:normal;font-size:12px;color:var(--tenue);margin-top:4px}
.pp-par b{font-size:14px;font-weight:600}
.pp-msjs{display:grid;padding:4px 14px 16px}
.pp-msjs>*{grid-area:1/1}
.pp-msj{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;background:var(--gris)}
.pp-msj>span:last-child{display:grid;gap:2px}
.pp-msj small{font-size:12px;color:var(--tenue)}
.pp-burb{background:var(--bruma)}
/* citas: la agenda de mañana */
.pp-agenda{left:0;top:0;width:100%;z-index:1}
.pp-franja{justify-content:flex-start;gap:14px}
.pp-franja time{flex:none;width:48px;font-size:14px;font-weight:600;color:var(--acero)}
.pp-st{display:grid;flex:1;min-width:0}
.pp-st>*{grid-area:1/1}
.pp-franja>.pp-st:first-of-type{color:var(--ink);font-weight:500}
.pp-franja>.pp-st:last-child{flex:none;justify-items:end;min-width:128px}
/* whatsapp y presupuestos: la conversación */
.pp-wa{left:0;top:0;width:76%;z-index:1}
.pp-chat{display:grid;gap:8px;padding:14px;background:#EFEAE2}
.pp-b{margin:0;max-width:88%;padding:9px 12px;border-radius:14px;background:#fff;justify-self:start;box-shadow:0 1px 1px rgba(29,29,31,.08)}
.pp-b.yo{justify-self:end;background:#D9FDD3}
.pp-adj{display:flex;align-items:center;gap:8px}
.pp-ficha{right:0;top:210px;width:58%;z-index:2}
.pp-carpeta{right:0;top:120px;width:64%;z-index:2}
.pp-partidas{left:0;bottom:0;width:94%;z-index:3}
.pp-sinp{font-size:13px;font-weight:500;color:#55555A;border:1px dashed #A1A1A6;border-radius:999px;padding:3px 10px;white-space:nowrap}
.pp-precio .pp-l>b{color:#55555A;font-weight:500}
@media (min-width:1100px){.pp-esc .pp-marco>.pp-alerta{width:74%}}
/* R9-G3: en la placa, las pestañas del oficio se ven todas (sin scroll lateral escondido) */
.pp-fplaca .ps-tabs{flex-wrap:wrap;overflow:visible;border-radius:24px}
.pp-fplaca .ps-tab{flex:1 1 auto}
/* R9-G3: en móvil la escena fijada arranca arriba (título y pieza juntos), sin medio alto vacío encima del título */
@media (max-width:1099px){html.pp-vivo .pp-esc .pp-fijo{align-items:flex-start;padding-top:20px}}
/* R9-G3 · móvil: la escena con color de verdad y entera desde el paso 1 */
@media (max-width:1099px){
  .pp-esc.hondo{background:var(--cielo-hondo)}
  html.pp-vivo .pp-esc.hondo .pp-marco{border-color:transparent}
  .pp-esc.hondo .pp-pasos span{color:var(--ink)}
  html.pp-vivo .pp-pieza .pp-hitos li[data-en]:not(.si){opacity:1;visibility:visible;transform:none}
  html.pp-vivo .pp-pieza .pp-hitos li[data-en]:not(.si) :is(time,b,span){color:var(--tenue)}
  html.pp-vivo .pp-pieza .pp-hitos li[data-en]:not(.si) :is(.mt-tag,.pp-chips,.pp-tipo){visibility:hidden}
}
@media (max-width:1279px){.ps-cab .pp-hp{padding:16px}}
/* R9-G3 · a 1280+ la tarjeta llena su placa: 48 % del ancho a 1440 sobre una placa del 58 % */
@media (min-width:1280px) and (min-height:800px){
  .pp-esc .pp-pieza{padding-right:max(48px,calc((100vw - 1220px)/2 - 32px));padding-left:56px}
  html .pp-esc .pp-marco{zoom:1.14;max-width:610px}
  .pp-gg:not(.inv) .pp-gv>.pp-placa:not(.foto){padding-right:max(48px,calc((100vw - 1220px)/2 - 32px));padding-left:56px}
  .pp-gg.inv .pp-gv>.pp-placa:not(.foto){padding-left:max(48px,calc((100vw - 1220px)/2 - 32px));padding-right:56px}
  .pp-gv>.pp-placa:not(.foto)>:is(.pp-auto,.mt-demo){zoom:1.14;max-width:610px}
}
/* R9-G3: por debajo de 1280 la cabecera del chat de citas deja sitio a «escribiendo…» */
@media (max-width:1279px){.ct-chat .dm-icos{display:none}.ct-chat .dm-quien{flex:1 1 auto;min-width:0}.ct-chat .dm-estado{white-space:nowrap}}
/* R9-G3 · también en escritorio: la tarjeta de hitos nace entera en tono tenue y cada paso enciende su fila (nada de tarjeta en blanco en el paso 1) */
html.pp-vivo .pp-pieza .pp-hitos li[data-en]:not(.si){opacity:1;visibility:visible;transform:none}
html.pp-vivo .pp-pieza .pp-hitos li[data-en]:not(.si) :is(time,b,span){color:var(--tenue)}
html.pp-vivo .pp-pieza .pp-hitos li[data-en]:not(.si) :is(.mt-tag,.pp-chips,.pp-tipo){visibility:hidden}

/* ===================== R10 (30-oct) ===================== */
/* arreglo 8: la barra de avance se llena una vez, en toda la pasada, y se queda llena */
.pp-prog.va b{animation:pp-prog var(--ms,1400ms) linear 1 forwards}
.pp-prog.fin b{animation:none;transform:none}
/* los chats ya no borran burbujas: caben enteros */
.pp-ct .ct-chat .dm-cuerpo{height:auto;min-height:272px}

/* arreglo 1: en móvil la pieza llena la pantalla fijada. Lo marcado .pp-m solo existe en móvil, para que la tarjeta no quede en blanco */
@media (min-width:1100px){.pp-m,.pp-mg{display:none!important}}
@media (max-width:1099px){
  html.pp-vivo .pp-lleno{margin-top:0;margin-bottom:0}
  html.pp-vivo .pp-lleno .pp-fijo{align-items:stretch;padding:12px 0}
  html.pp-vivo .pp-lleno .pp-esc-in{flex:1;width:100%;min-height:0;display:flex;flex-direction:column;align-content:normal;gap:10px}
  html.pp-vivo .pp-lleno .pp-esc-txt{flex:none}
  html.pp-vivo .pp-lleno .pp-barra{margin-top:10px}
  html.pp-vivo .pp-lleno .pp-pieza{flex:1;min-height:0;display:flex}
  html.pp-vivo .pp-lleno .pp-marco{flex:1;min-width:0;width:auto;max-width:600px;height:auto;min-height:0;margin:0 auto;padding:10px;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr);overflow:hidden}
  html.pp-vivo .pp-lleno .pp-marco>.pp-v{align-self:center;justify-self:stretch;width:auto;height:100%;max-height:510px;min-height:0;display:flex;flex-direction:column;box-shadow:none;font-size:17px;line-height:1.4}
  html.pp-vivo .pp-lleno .pp-v-top{flex:none;padding:12px 16px}
  html.pp-vivo .pp-lleno .pp-v-top b,html.pp-vivo .pp-lleno .pp-v-top small{font-size:16px}
  html.pp-vivo .pp-lleno .pp-l{flex:1 1 0;min-height:0;padding:6px 16px}
  html.pp-vivo .pp-lleno .pp-hoja{flex:1 1 auto;min-height:0}
  html.pp-vivo .pp-lleno .pp-v-pie{flex:none;padding:12px 16px}
  html.pp-vivo .pp-lleno .pp-v-pie[data-en]:not(.si){display:none}
  html.pp-vivo .pp-lleno .mt-tag{height:30px;padding:0 12px;border-radius:15px;font-size:16px}
  html.pp-vivo .pp-lleno .pp-btn{font-size:16px}
  /* al entrar una tarjeta, la anterior se aparta: en móvil nunca se pisan */
  html.pp-vivo .pp-lleno:is([data-paso="1"],[data-paso="2"],[data-paso="3"]) :is(.pp-word,.pp-marco>.pp-nota,.pp-wa:has(+.pp-carpeta)){opacity:0;visibility:hidden}
  html.pp-vivo .pp-lleno:is([data-paso="2"],[data-paso="3"]) :is(.pp-notas,.pp-carpeta){opacity:0;visibility:hidden}
  /* propuestas */
  html.pp-vivo .pp-lleno .pp-word .pp-hoja{height:auto;font-size:18px;line-height:1.5;padding:16px}
  html.pp-vivo .pp-lleno .pp-word .pp-cursor{margin:4px 0 12px!important}
  html.pp-vivo .pp-lleno .pp-word mark{background:#FFF1B8;color:inherit;padding:0 3px}
  html.pp-vivo .pp-lleno .pp-marco>.pp-nota{align-self:end;justify-self:end;width:92%;margin:0 0 14px;padding:12px 16px;font-size:16px;z-index:2}
  html.pp-vivo .pp-lleno .pp-nota b{font-size:16px;text-transform:none;letter-spacing:0}
  html.pp-vivo .pp-lleno ul.pp-hoja{display:flex;flex-direction:column;gap:0;padding:0 16px;list-style:none;background:#FFFDF4}
  html.pp-vivo .pp-lleno ul.pp-hoja li{flex:1 1 0;display:flex;align-items:center;min-height:0;border-bottom:1px solid #E7E0C8}
  html.pp-vivo .pp-lleno ul.pp-hoja li:last-child{border-bottom:0}
  html.pp-vivo .pp-lleno .pp-prop .pp-hoja{flex:none;padding:16px}
  html.pp-vivo .pp-lleno .pp-prop .pp-hoja h4{font-size:22px}
  html.pp-vivo .pp-lleno .pp-prop .pp-l>span{color:var(--tenue)}
  /* citas */
  html.pp-vivo .pp-lleno .pp-franja{gap:10px}
  html.pp-vivo .pp-lleno .pp-franja time{font-size:16px}
  html.pp-vivo .pp-lleno .pp-alerta{margin:0 0 10px;padding:14px 16px;font-size:16px}
  /* presupuestos */
  html.pp-vivo .pp-lleno .pp-chat{flex:1 1 auto;min-height:0;align-content:space-evenly;gap:6px;padding:12px}
  html.pp-vivo .pp-lleno .pp-chat .pp-b{font-size:17px}
  html.pp-vivo .pp-lleno .pp-pdf{font-size:16px}
}
@media (max-width:1099px) and (max-height:720px){.pp-mg{display:none!important}}
/* pantalla baja (hasta unos 620 px de alto): fuera lo que solo rellena y título más corto */
@media (max-width:1099px) and (max-height:620px){
  .pp-m{display:none!important}
  html.pp-vivo .pp-lleno .pp-esc .sec-tit,html.pp-vivo .pp-lleno .sec-tit{font-size:24px;margin-bottom:6px}
  html.pp-vivo .pp-lleno .pp-pasos li>span{display:none}
  html.pp-vivo .pp-lleno .pp-marco>.pp-nota{display:none}
}


/* arreglo 1, resto de escenas: cada tarjeta se reparte su alto y en móvil se relevan */
@media (max-width:1099px){
  html.pp-vivo .pp-lleno .pp-marco>.pp-alerta{width:92%;margin:0 0 14px;z-index:3}
  html.pp-vivo .pp-lleno .pp-marco>.pp-ficha{justify-self:stretch}
  html.pp-vivo .pp-lleno .pp-chips em,html.pp-vivo .pp-lleno .pp-chip{font-size:16px}
  /* onboarding */
  html.pp-vivo .pp-lleno .pp-primer .pp-hitos{flex:1 1 auto;min-height:0;grid-auto-rows:minmax(0,1fr);align-content:stretch;gap:0;padding:6px 16px}
  html.pp-vivo .pp-lleno .pp-hitos li{grid-template-columns:62px minmax(0,1fr);align-items:center;border-top:1px solid var(--linea)}
  html.pp-vivo .pp-lleno .pp-hitos li:first-child{border-top:0}
  html.pp-vivo .pp-lleno .pp-hitos time,html.pp-vivo .pp-lleno .pp-hitos li>div>span{font-size:16px}
  /* facturas */
  html.pp-vivo .pp-lleno:is([data-paso="0"],[data-paso="1"]) .pp-marco>.pp-hojav,html.pp-vivo .pp-lleno[data-paso="2"] .pp-marco>.pp-pdfv{opacity:0;visibility:hidden}
  html.pp-vivo .pp-lleno .pp-fact{flex:1 1 auto;grid-auto-rows:minmax(0,1fr);gap:6px;padding:12px 14px}
  html.pp-vivo .pp-lleno .pp-campo{align-items:center;padding:6px 12px}
  html.pp-vivo .pp-lleno .pp-tabla{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;font-size:16px}
  html.pp-vivo .pp-lleno .pp-tabla .cab,html.pp-vivo .pp-lleno .pp-tabla .fila{grid-template-columns:minmax(0,1fr) 54px 92px}
  html.pp-vivo .pp-lleno .pp-tabla .cab{flex:none;font-size:16px}
  html.pp-vivo .pp-lleno .pp-tabla .fila{flex:1 1 0;min-height:0}
  html.pp-vivo .pp-lleno .pp-tabla .mt-tag{padding:0 8px}
  /* seguimiento: la línea, de arriba abajo */
  html.pp-vivo .pp-lleno .pp-tren{flex:1 1 auto;min-height:0;grid-template-columns:minmax(0,1fr);grid-auto-rows:minmax(0,1fr);padding:10px 16px}
  html.pp-vivo .pp-lleno .pp-via{left:25px;right:auto;top:16.66%;bottom:16.66%;width:3px;height:auto;grid-template-columns:1fr;grid-template-rows:1fr 1fr}
  html.pp-vivo .pp-lleno .pp-via b{transform-origin:top}
  html.pp-vivo .pp-lleno .pp-pieza .pp-via b[data-en]:not(.si){transform:scaleY(0)}
  html.pp-vivo .pp-lleno .pp-par{grid-template-columns:20px minmax(0,1fr);column-gap:14px;row-gap:0;justify-items:start;align-content:center;text-align:left}
  html.pp-vivo .pp-lleno .pp-par i{grid-row:1/3;align-self:center}
  html.pp-vivo .pp-lleno .pp-pieza .pp-par[data-en]:not(.si){opacity:.38;visibility:visible;transform:none}
  html.pp-vivo .pp-lleno .pp-par em{margin:0;font-size:16px}
  html.pp-vivo .pp-lleno .pp-par b{font-size:18px}
  html.pp-vivo .pp-lleno .pp-msjs{flex:none;padding:4px 14px 14px}
  html.pp-vivo .pp-lleno .pp-msj small{font-size:16px}
  html.pp-vivo .pp-lleno[data-paso="2"] .pp-msjs{display:none}
  /* clientes nuevos */
  html.pp-vivo .pp-lleno .pp-campos{flex:1 1 auto;min-height:0;align-content:space-evenly;padding:8px 16px 12px;gap:6px}
  html.pp-vivo .pp-lleno .pp-campo-f span{font-size:16px}
  html.pp-vivo .pp-lleno .pp-campo-f b{min-height:40px;padding:7px 12px}
  html.pp-vivo .pp-lleno[data-paso="2"] .pp-marco>.pp-crm{opacity:0;visibility:hidden}
  html.pp-vivo .pp-lleno .pp-bienv .pp-hoja{font-size:18px;line-height:1.45}
  /* whatsapp: cada burbuja entra cuando toca y el fondo es el del chat */
  html.pp-vivo .pp-lleno .pp-wa:not(:has(+.pp-carpeta)) .pp-b[data-en]:not(.si){display:none}
  html.pp-vivo .pp-lleno .pp-chat{background-image:radial-gradient(#DAD2C4 1.2px,transparent 1.5px);background-size:18px 18px}
  html.pp-vivo .pp-lleno .pp-chat:has(.pp-dia){position:relative;padding-top:50px}
  html.pp-vivo .pp-lleno .pp-dia{position:absolute;top:10px;left:50%;transform:translateX(-50%);margin:0;padding:4px 12px;border-radius:10px;background:var(--blanco);font-size:16px;color:var(--tenue)}
  html.pp-vivo .pp-lleno[data-paso="2"] .pp-marco>.pp-wa:not(:has(+.pp-carpeta)){opacity:0;visibility:hidden}
  html.pp-vivo .pp-lleno[data-paso="3"] .pp-marco>.pp-ficha{opacity:0;visibility:hidden}
  html.pp-vivo .pp-lleno[data-paso="3"] .pp-marco>.pp-wa:not(:has(+.pp-carpeta)) .pp-chat{align-content:start}
}
@media (max-width:1099px) and (max-height:720px){
  html.pp-vivo .pp-lleno[data-paso="3"] .pp-marco>.pp-wa:not(:has(+.pp-carpeta)) .pp-b:not(.yo):not([data-en="3"]){display:none}
}
@media (max-width:360px){
  html.pp-vivo .pp-lleno .pp-tabla .cab,html.pp-vivo .pp-lleno .pp-tabla .fila{grid-template-columns:minmax(0,1fr) 88px}
  html.pp-vivo .pp-lleno .pp-tabla i:nth-child(2){display:none}
  html.pp-vivo .pp-lleno .pp-franja{gap:8px}
}

/* arreglo 4: bloques propios de cada proceso */
.pp-nv .mt-tag{height:30px;padding:0 12px;border-radius:15px;font-size:16px}
.pp-nv .pp-v-top b,.pp-nv .pp-v-top small{font-size:16px}
.pp-nv .pp-prog.arriba{margin:0 auto 16px}

/* propuestas: lo que entra, al lado de lo que sale */
.ps-sec.pp-voz{background:var(--cielo);padding:88px 0 72px}
.pp-voz .sec-tit,.pp-voz .ps-txt{text-align:center;margin-inline:auto}
.pp-voz .ps-txt{color:var(--ink);max-width:40ch;margin-bottom:24px}
.pp-voz-in{display:grid;gap:8px;max-width:880px;margin:0 auto}
.pp-voz-a{display:grid;gap:10px;align-content:start;padding:18px;border-radius:20px;background:var(--ink);color:#fff}
.pp-voz-top{display:flex;align-items:center;gap:12px;font-size:17px;font-weight:600}
.pp-play{position:relative;flex:none;width:40px;height:40px;border-radius:50%;background:#fff}
.pp-play::after{content:"";position:absolute;left:15px;top:12px;border-left:13px solid var(--ink);border-top:8px solid transparent;border-bottom:8px solid transparent}
.pp-onda{display:flex;align-items:center;gap:3px;height:44px}
.pp-onda i{flex:1 1 0;min-width:2px;height:calc(var(--h)*1%);border-radius:2px;background:var(--cielo)}
html.pp-vivo .pp-voz-in:not([data-paso="6"]) .pp-onda i{animation:pp-onda .7s ease-in-out infinite alternate;animation-delay:calc(var(--h)*-9ms)}
@keyframes pp-onda{to{transform:scaleY(.45)}}
.pp-voz-a p{margin:0;padding:10px 14px;border-radius:12px;background:rgba(255,255,255,.13);font-size:17px;line-height:1.35}
.pp-voz-f{display:grid;place-items:center;color:var(--ink);transform:rotate(90deg)}
.pp-voz-b{display:flex;flex-direction:column;font-size:17px;line-height:1.35}
.pp-voz-b .pp-l{flex:1 1 auto;align-items:baseline;padding:14px 16px}
.pp-voz-b .pp-l>span{flex:none;color:var(--tenue)}
.pp-voz-b .pp-l>b{font-weight:600;text-align:right}
@media (min-width:900px){
  .ps-sec.pp-voz{padding:176px 0 112px}
  .pp-voz-in{grid-template-columns:minmax(0,5fr) 44px minmax(0,7fr);align-items:stretch}
  .pp-voz-f{transform:none}
  .pp-voz-b{font-size:18px}
  .pp-voz-a{padding:22px}
}

/* onboarding: la semana del nuevo, escalón a escalón */
.pp-sem-t{max-width:680px}
.pp-muro{margin-top:24px}
.pp-muro-q{display:flex;align-items:center;gap:10px;margin:0 0 14px;font-size:18px;color:#fff}
.pp-muro-q i{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:#fff;color:var(--acero);font-style:normal;font-weight:700}
.pp-muro-q b{font-size:20px;font-weight:600}
.pp-muro ol{position:relative;list-style:none;margin:0;padding:0;display:grid;gap:10px}
.pp-muro ol::before{content:"";position:absolute;left:30px;top:0;bottom:0;width:2px;background:rgba(255,255,255,.45)}
.pp-muro li{position:relative;display:grid;gap:4px;justify-items:start;padding:14px 16px;border-radius:16px;background:var(--blanco);color:var(--ink)}
.pp-muro li>b{font-size:22px;line-height:1.2;font-weight:600}
.pp-muro li>span{font-size:17px;line-height:1.35;color:var(--tenue)}
.pp-muro li>em{margin-top:6px}
@media (min-width:1024px){
  .pp-muro{margin-top:32px}
  .pp-muro ol{grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;align-items:start}
  .pp-muro ol::before{display:none}
  .pp-muro li{margin-top:calc((4 - var(--i))*34px);min-height:224px;align-content:start;padding:20px}
  .pp-muro li>b{font-size:26px}
  .pp-muro li>span{font-size:18px}
  .pp-muro li>em{margin-top:14px}
}

/* citas: la semana que se llena y el recordatorio que sale */
.ps-sec.pp-cal{background:var(--gris);padding:88px 0 72px}
.pp-cal-in{display:grid;gap:14px;margin-top:24px}
.pp-cal-v{min-width:0}
.pp-cal-g{display:grid;grid-template-columns:52px repeat(3,minmax(0,1fr));gap:6px;padding:12px}
.pp-cal-g>b{padding:4px 0;font-size:16px;font-weight:600;text-align:center}
.pp-cal-g>time{align-self:center;font-size:16px;font-weight:600;color:var(--acero)}
.pp-c{display:grid;min-height:56px;border-radius:10px;overflow:hidden;font-size:16px}
.pp-c>*{grid-area:1/1;display:grid;place-items:center;font-style:normal;text-decoration:none}
.pp-c>u{background:var(--bruma);color:var(--tenue)}
.pp-c>i{background:var(--ink);color:#fff;font-weight:600}
.pp-ds{display:none}
.pp-recu{display:flex;flex-direction:column;border-radius:20px;overflow:hidden;background:#EFEAE2;box-shadow:inset 0 0 0 1px var(--linea)}
.pp-recu-top{display:flex;justify-content:space-between;gap:10px;padding:12px 16px;background:var(--blanco);font-size:16px}
.pp-recu-top b{font-weight:600}
.pp-recu-top small{font-size:16px;color:var(--tenue)}
.pp-recu-c{flex:1;display:grid;gap:8px;align-content:end;padding:14px}
.pp-recu-c p{margin:0;padding:8px 12px;border-radius:10px;font-size:17px;line-height:1.35;max-width:88%}
.pp-r-el{justify-self:start;background:var(--blanco)}
.pp-r-yo{justify-self:end;background:#D9FDD3}
.pp-recu-bs{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.pp-recu-bs span{display:grid;place-items:center;min-height:44px;border-radius:10px;background:var(--blanco);color:var(--acero);font-size:16px;font-weight:600}
@media (min-width:900px){
  .ps-sec.pp-cal{padding:176px 0 112px}
  .pp-cal-in{grid-template-columns:minmax(0,8fr) minmax(0,4fr);gap:20px;align-items:stretch;margin-top:32px}
  .pp-ds{display:grid}
  .pp-cal-g>b.pp-ds{display:block}
  .pp-cal-g{grid-template-columns:68px repeat(5,minmax(0,1fr));gap:8px;padding:16px}
  .pp-c{min-height:72px;font-size:17px}
}

/* presupuestos: del dato suelto a la partida */
.ps-sec.pp-dat{background:var(--bruma);padding:88px 0 72px}
.pp-dat-in{display:grid;gap:24px}
.pp-dat-v{--k:.14;overflow:hidden;border-radius:20px;background:var(--blanco);box-shadow:inset 0 0 0 1px var(--linea);font-size:17px}
.pp-fila{display:grid;gap:8px;padding:12px 16px;border-top:1px solid var(--linea)}
.pp-v-top+.pp-fila{border-top:0}
.pp-dato{justify-self:start;display:inline-flex;align-items:center;min-height:40px;padding:6px 12px;border-radius:8px;background:#FFF1B8;font-size:17px;line-height:1.3;box-shadow:0 8px 16px -12px rgba(29,29,31,.5)}
.pp-fila>i{display:none}
.pp-part{display:flex;align-items:center;justify-content:space-between;gap:12px}
.pp-part b{font-size:18px;line-height:1.3;font-weight:600}
.pp-part em{flex:none;font-size:16px;font-style:normal;color:var(--tenue)}
html.pp-vivo .pp-auto .pp-dato[data-en]{transition:transform .7s var(--ease)}
html.pp-vivo .pp-auto .pp-dato[data-en]:not(.si){opacity:1;visibility:visible;transform:translate(calc(var(--x)*var(--k)),var(--y)) rotate(var(--r));transition:none}
@media (min-width:900px){
  .ps-sec.pp-dat{padding:176px 0 112px}
  .pp-dat-in{grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:56px;align-items:center}
  .pp-dat-v{--k:1}
  .pp-fila{grid-template-columns:minmax(0,5fr) 36px minmax(0,7fr);align-items:center;padding:18px 22px}
  .pp-fila>i{display:block;height:2px;background:var(--linea)}
  .pp-part b{font-size:20px}
}

/* cierres: cada proceso con el suyo */
html:root body section.contacto.pp-ct-carta,html:root body section.contacto.pp-ct-hueco,html:root body section.contacto.pp-ct-tique,html:root body section.contacto.pp-ct-carne{min-height:0}
.contacto.pp-ct-carta{background:var(--cielo)}
.pp-ct-carta .ct-vivo{display:block;max-width:560px;margin-inline:auto}
.pp-ct-carta .pp-ct-pieza{width:100%}
.pp-ct-carta .pp-prog{display:none}
.pp-ct-carta .pp-rep{transform:rotate(1.4deg);font-size:17px;box-shadow:0 30px 60px -30px rgba(29,29,31,.5)}
.pp-ct-carta .pp-rep .pp-l{padding:14px 18px}
.pp-ct-carta .contacto-sub a{border-bottom-color:var(--ink)}
.pp-ct-carta .contacto-sub{color:var(--ink)}

.contacto.pp-ct-carne{background:var(--acero)}
html:root body section.contacto.pp-ct-carne{padding-top:0;color:#fff}
.pp-carne-col{display:grid;justify-items:center;padding-inline:var(--gut)}
.pp-cinta{display:block;width:30px;height:72px;background:linear-gradient(90deg,var(--cielo) 0 12%,var(--cielo-hondo) 12% 88%,var(--cielo) 88%)}
.pp-carne-col .pp-prog{display:none}
.pp-carne{position:relative;display:grid;gap:4px;justify-items:center;width:min(288px,100%);padding:30px 22px 14px;border-radius:22px;background:var(--blanco);color:var(--ink);text-align:center;box-shadow:0 30px 60px -28px rgba(0,0,0,.55)}
html.pp-vivo .pp-carne[data-paso]{animation:pp-colgar 1.9s var(--ease) both;transform-origin:50% -72px}
@keyframes pp-colgar{0%{transform:rotate(-3.5deg)}45%{transform:rotate(1.6deg)}100%{transform:none}}
.pp-ojal{position:absolute;top:11px;left:50%;width:46px;height:9px;margin-left:-23px;border-radius:9px;background:var(--acero)}
.pp-carne-q{display:grid;place-items:center;width:84px;height:84px;margin:6px 0 8px;border-radius:50%;background:var(--cielo);font-size:36px;font-weight:600}
.pp-carne>b{font-size:26px;font-weight:600;letter-spacing:-.02em;line-height:1.1}
.pp-carne>small{font-size:17px;color:var(--tenue)}
.pp-carne ul{display:grid;width:100%;margin:12px 0 0;padding:0;list-style:none}
.pp-carne li{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:46px;border-top:1px solid var(--linea);font-size:17px;text-align:left}
.pp-ct-carne .ct-in{padding-top:44px}
.pp-ct-carne .ct-vivo{display:block;max-width:560px;margin-inline:auto}
.pp-ct-carne .pp-ct-pieza{width:100%}
html:root body .pp-ct-carne .ct-in .contacto-tit{color:#fff}
.pp-ct-carne .contacto-sub,.pp-ct-carne .contacto-sub a{color:#fff;border-bottom-color:#fff}

.contacto.pp-ct-hueco{background:var(--bruma)}
.pp-ct-hueco .ct-vivo{display:block;max-width:none;margin:0}
.pp-tira{display:grid;grid-template-columns:minmax(0,1fr);gap:8px}
.pp-tira-f{display:grid;grid-template-columns:56px minmax(0,1fr) auto;gap:10px;align-items:center;padding:16px;border-radius:16px;background:var(--blanco);font-size:18px;text-align:left}
.pp-tira-f time{font-size:16px;font-weight:600;color:var(--acero)}
.pp-tira-f>span{font-weight:500}
.pp-libre{grid-template-columns:56px minmax(0,1fr);background:var(--cielo);box-shadow:inset 0 0 0 2px var(--acero)}
.pp-libre .iman{grid-column:1/-1;justify-self:stretch}
.pp-libre .btn{width:100%}
.pp-libre time{color:var(--ink)}

.contacto.pp-ct-tique{background:var(--acero)}
.pp-ct-tique .contacto-tit{color:#fff}
.pp-ct-tique .ct-vivo{display:block;max-width:520px;margin:0 auto;filter:drop-shadow(0 26px 30px rgba(5,5,5,.3))}
.pp-tique{padding:28px 22px 30px;background:var(--blanco);color:var(--ink);--m:conic-gradient(from 135deg at top,#0000,#000 1deg 89deg,#0000 90deg) top/22px 51% repeat-x,conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) bottom/22px 51% repeat-x;-webkit-mask:var(--m);mask:var(--m)}
.pp-tique .pp-prog{display:none}
.pp-tique-c{display:flex;align-items:baseline;justify-content:space-between;gap:10px;padding-bottom:12px;font-size:20px;text-align:left}
.pp-tique-c b{font-weight:600}
.pp-tique-c small{font-size:16px;color:var(--tenue)}
.pp-tique .pp-l{padding:14px 0;font-size:17px;text-align:left;border-top:1px solid var(--linea)}
.pp-tique .pp-l>span{color:var(--ink)}
.pp-tique-pie{margin-top:14px;padding-top:22px;border-top:2px dashed var(--apagado);text-align:center}
.pp-tique-pie .iman{display:block}
.pp-tique-pie .btn{width:100%}
.pp-tique-pie .contacto-sub{margin-top:16px;font-size:17px}

@media (min-width:900px){
  html:root body section.contacto.pp-ct-carta{padding-top:128px;padding-bottom:128px}
  .pp-ct-carta .ct-in{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
  .pp-ct-carta .ct-vivo{max-width:none}
  html:root body .pp-ct-carta .ct-in .contacto-tit,html:root body .pp-ct-carne .ct-in .contacto-tit{font-size:60px;line-height:1.04;max-width:15ch;margin-bottom:32px}
  .pp-ct-carta .ct-in .contacto-tit{max-width:12ch}

  html:root body section.contacto.pp-ct-carne{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:start;padding:0 0 104px}
  .pp-carne-col{padding-inline:0}
  .pp-cinta{height:112px}
  html.pp-vivo .pp-carne[data-paso]{transform-origin:50% -112px}
  .pp-carne{width:348px;padding:34px 28px 16px}
  .pp-carne-q{width:104px;height:104px;font-size:44px}
  .pp-carne>b{font-size:32px}
  .pp-carne>small,.pp-carne li{font-size:18px}
  .pp-carne li{min-height:52px}
  .pp-ct-carne .ct-in{display:block;width:auto;max-width:800px;margin:0;padding:112px 72px 0 0;text-align:left}
  .pp-ct-carne .ct-vivo{max-width:none;margin:0 0 28px}

  html:root body .pp-ct-hueco .ct-in{display:block;text-align:left}
  html:root body .pp-ct-hueco .ct-in .contacto-tit{font-size:72px;max-width:none;margin-bottom:40px}
  .pp-tira{grid-template-columns:minmax(0,3fr) minmax(0,5fr) minmax(0,3fr);gap:12px;align-items:stretch}
  .pp-tira-f{grid-template-columns:1fr;align-content:space-between;justify-items:start;min-height:230px;padding:22px;font-size:22px}
  .pp-tira-f time{font-size:20px}
  .pp-libre{justify-items:stretch}
  html:root body .pp-libre .iman{grid-column:auto}

  html:root body .pp-ct-tique .ct-in{display:block;text-align:center}
  html:root body .pp-ct-tique .ct-in .contacto-tit{font-size:72px;max-width:none;margin:0 auto 44px}
  .pp-tique{padding:34px 30px 36px}
}

/* R10 · pulidos tras mirar las hojas */
/* nota de voz: las frases ya están, se encienden al decirlas; el panel negro nunca sale vacío */
html.pp-vivo .pp-auto.pp-voz-in .pp-voz-a p[data-en]:not(.si){opacity:.3;visibility:visible;transform:none;transition:opacity .35s var(--ease)}
/* citas: el teléfono se ajusta a lo que hay y se llena desde arriba */
.pp-recu{align-self:start}
.pp-recu-c{align-content:start}
html.pp-vivo .pp-auto .pp-recu-c [data-en]:not(.si){display:none}
html.pp-vivo .pp-auto .pp-recu-c [data-en].si{animation:pp-burb .35s var(--ease) both}
@keyframes pp-burb{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
/* R10-B · citas 390: el botón va dentro de la tira, a todo su ancho (el grid-area de .ct-in lo sacaba a una columna implícita) */
html:root body .pp-libre .iman{grid-area:auto;grid-column:1/-1;justify-self:stretch;min-width:0}
/* cierres con botón dentro: una sola línea */
html:root body .pp-libre .btn,html:root body .pp-tique-pie .btn{white-space:nowrap;padding-inline:12px;font-size:clamp(16px,4.6vw,18px)}
/* presupuestos a 1440: la barra de progreso se cuela en la rejilla y tiraba la pieza a la primera columna */
@media (min-width:1100px){
  .pp-dat-in{row-gap:10px}
  .pp-dat-t{grid-column:1;grid-row:1/span 2}
  .pp-dat-in>.pp-prog{grid-column:2;grid-row:1;align-self:end}
  .pp-dat-in>.pp-dat-v{grid-column:2;grid-row:2}
}
/* letra: nada por debajo de 16 */
html:root body .pp-chip,html:root body .pp-sinp{font-size:16px}

/* R10 · tarjetas altas: el texto del papel se reparte y no deja una banda en blanco */
@media (max-width:1099px){
  html.pp-vivo .pp-lleno div.pp-hoja{display:flex;flex-direction:column;justify-content:space-evenly}
  html.pp-vivo .pp-lleno .pp-prop .pp-hoja{height:auto;min-height:0}
}

/* R11-C · citas 390, cierre: aire entre «Confirmada» y el botón (la tira ya va con el margen de la caja, 16 px como el título) */
@media (max-width:899px){
  .pp-tira{gap:14px}
  .pp-libre{padding:18px 16px}
}
