/* ═══════════════════════════════════════════════════════════════════════════
   planos-v1.css — lo visual de la página de Real estate: la ficha del
   hero, «El problema» en tres cifras, «Del plano al mapa», las seis tarjetas y
   la línea de tiempo de la vigilancia. Se apoya en sector-v1.css (tokens, píldoras,
   bandas) y no lo modifica. Todo lo que se mueve lleva un estado final que se ve
   sin animar: sin JS, o con «reducir movimiento», la página se lee entera.
   El JS (planos-v1.js) sólo añade .rx-anim a <html> si el movimiento está permitido;
   los estados de partida de las animaciones cuelgan de esa clase.
   ═══════════════════════════════════════════════════════════════════════════ */
:root { --rx-agua:#2f86c8; --rx-rojo:#d6322e; --rx-verde:#2e9e62; --rx-ambar:#d08a00; --rx-tinta:#14161c; }
.rx-ancho { width:min(100% - 2*var(--gut), 2040px); margin-inline:auto }
.rx-pill-ej { display:inline-flex; align-items:center; gap:8px; font-size:15px; color:#7a5200; background:#fff3d1; border-radius:999px; padding:6px 12px; white-space:nowrap }
.rx-pill-ej::before { content:""; width:7px; height:7px; border-radius:50%; background:#d08a00; flex:none }
.rx-norma { white-space:nowrap; font-size:15px; color:#2f3d66; background:#eef0f6; border-radius:6px; padding:1px 7px; display:inline-block }
.rx-sec-t { margin:0; font-weight:300; font-size:clamp(32px, 3.3vw, 46px); line-height:1.1; letter-spacing:-.025em }
.rx-sec-p { margin-top:14px; font-size:19px; line-height:1.55; max-width:36em; color:var(--ink-2) }

/* ── HERO: titular corto + la ficha de la parcela ─────────────────────── */
.rx-hero { padding:80px 0 56px }
.rx-ficha { margin-top:0; background:#fff; border:1px solid var(--line); border-radius:var(--r-xl); box-shadow:0 34px 80px -52px rgba(0,0,0,.4); overflow:hidden }
.rx-ficha-cab { display:flex; align-items:center; gap:10px 18px; flex-wrap:wrap; padding:12px 24px; border-bottom:1px solid var(--line); background:#fbfaf8 }
.rx-ficha-cab b { font-weight:500; font-size:19px; letter-spacing:-.01em }
.rx-ficha-cab .mono { font:400 14px var(--mono); color:var(--ink-3) }
.rx-ficha-pie .rx-pill-ej { margin-left:auto }
.rx-ficha-dib { padding:10px 14px 4px; background:#fdfcfb }
.rx-ficha-dib svg { width:100%; height:auto; overflow:visible }
.rx-ficha-lado { display:grid; grid-template-columns:repeat(3, 1fr); gap:10px 22px; padding:16px 26px 14px; border-top:1px solid var(--line) }
.rx-stat b { display:block; font-weight:300; font-size:clamp(38px, 3.5vw, 56px); line-height:.95; letter-spacing:-.04em; font-variant-numeric:tabular-nums }
.rx-stat b i { font-style:normal; font-size:.46em; letter-spacing:-.01em; margin-left:.12em; color:var(--ink-3) }
.rx-stat > span { display:block; margin-top:6px; font-size:16px; line-height:1.3; color:var(--ink-2) }
.rx-stat.is-free b { color:#1f7a4a }
.rx-ficha-pie { display:flex; flex-wrap:wrap; gap:8px; padding:14px 24px 18px; border-top:1px solid var(--line); background:#fbfaf8 }
/* el dibujo (SVG) */
.rxf-road { fill:#4a4f59 } .rxf-dash { stroke:#fff; stroke-width:2; stroke-dasharray:10 8; fill:none }
.rxf-t { font:500 13px var(--mono); fill:#3a3a3a } .rxf-t.w { fill:#fff } .rxf-t.s { font-size:12px; fill:var(--ink-3) }
.rxf-t.h { paint-order:stroke; stroke:#fff; stroke-width:4px; stroke-linejoin:round }
.rxf-plot { fill:#fffef8; stroke:#111; stroke-width:2 }
.rxf-nb { fill:#f2f0ec; stroke:#d4d1ca; stroke-width:1.2 }
.rxf-lle { stroke:var(--rx-rojo); stroke-width:2.4; stroke-dasharray:14 5 3 5; fill:none }
.rxf-strip { fill:url(#rx-f-lle) } .rxf-free { fill:rgba(46,158,98,.17) } .rxf-flood { fill:url(#rx-f-agua) }
.rxf-river { fill:#cfe5f6 } .rxf-wave { stroke:#7fb7e2; stroke-width:2; fill:none }
.rxf-dim { stroke:#222; stroke-width:1.4; fill:none } .rxf-dim.g { stroke:var(--rx-rojo) }

/* ── EL PROBLEMA: tres cifras gigantes ─────────────────────────────────── */
.rx-gran-fila { display:grid; grid-template-columns:repeat(3, 1fr); gap:0; margin-top:52px; border-top:1px solid var(--line) }
.rx-gran { padding:36px 32px 8px 0; display:flex; flex-direction:column; gap:12px; min-width:0 }
.rx-gran + .rx-gran { padding-left:32px; border-left:1px solid var(--line) }
.rx-gran-n { font-weight:300; font-size:clamp(56px, 6vw, 104px); line-height:.92; letter-spacing:-.05em; white-space:nowrap; font-variant-numeric:tabular-nums }
.rx-gran-n small { font-size:.34em; letter-spacing:-.01em; color:var(--ink-3); margin:0 .12em }
.rx-gran-n i { font-style:normal; font-size:.4em; letter-spacing:-.01em; margin-left:.14em; color:var(--ink-3) }
.rx-gran-e { font-size:19px; line-height:1.35; color:var(--ink-2); max-width:15em }
.rx-gran-v { height:44px; margin:6px 0 2px; display:block }
.rx-gran cite { font-style:normal; font-size:14px; color:var(--ink-3); margin-top:auto; padding-top:10px }
.rx-gran cite a { color:var(--ink-3); text-underline-offset:3px }
.rxg-a { fill:#d9d6d0 } .rxg-b { fill:var(--rx-tinta) } .rxg-c { fill:#b9843c }

/* ── DEL PLANO AL MAPA ─────────────────────────────────────────────────── */
.rx-plano-cab { display:flex; align-items:flex-end; justify-content:space-between; gap:18px 40px; flex-wrap:wrap; margin-bottom:26px }
.rx-mesa { --fs:clamp(14px, .5vw + 6.6px, 21px); font-size:var(--fs); background:#fff; border:1px solid var(--line); border-radius:28px; padding:1.05em; box-shadow:0 36px 90px -60px rgba(0,0,0,.45);
  --tinta:#1b2430; --bed:#eef1f5 }
.rx-barra { display:flex; flex-wrap:wrap; gap:.6em 1em; align-items:center; margin-bottom:.85em }
.rx-seg { display:inline-flex; background:var(--bg-2); border-radius:999px; padding:.2em; gap:.15em }
.rx-seg button { all:unset; cursor:pointer; padding:.5em 1.05em; border-radius:999px; color:var(--ink-3); white-space:nowrap; font-size:1em }
.rx-seg button[aria-pressed="true"] { background:#fff; color:var(--ink); box-shadow:0 0 0 1px var(--line) }
.rx-seg button:focus-visible, .rx-rep:focus-visible, .rx-fila:focus-visible, .rx-sw:focus-visible { outline:2px solid var(--blue); outline-offset:2px }
.rx-pasos { display:flex; gap:.4em; margin-inline:auto; flex-wrap:wrap; justify-content:center }
.rx-paso { display:inline-flex; align-items:center; gap:.5em; padding:.38em .85em .38em .45em; border-radius:999px; border:1px solid var(--line); color:var(--ink-3); transition:background-color .3s, color .3s, border-color .3s; white-space:nowrap }
.rx-paso b { display:inline-grid; place-items:center; width:1.55em; height:1.55em; border-radius:50%; background:var(--bg-2); color:var(--ink-3); font-weight:500; font-size:.88em; transition:background-color .3s, color .3s }
.rx-paso.on { background:#000; color:#fff; border-color:#000 } .rx-paso.on b { background:#fff; color:#000 }
.rx-paso.hecho { color:var(--ink); border-color:var(--line-2) } .rx-paso.hecho b { background:var(--rx-verde); color:#fff }
.rx-rep { all:unset; cursor:pointer; display:inline-flex; align-items:center; gap:.45em; padding:.5em 1em; border-radius:999px; border:1px solid var(--line-2); background:#fff }
.rx-rep:hover { border-color:#000 } .rx-rep svg { width:1em; height:1em; stroke:currentColor; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round }
.rx-cuerpo { position:relative; display:grid; grid-template-columns:minmax(0, 1.32fr) minmax(0, .86fr) minmax(0, 1fr); gap:.85em; align-items:start }
.rx-vista { position:relative; aspect-ratio:640 / 520; border-radius:1em; overflow:hidden; background:var(--bed); perspective:1700px; perspective-origin:50% 38%; isolation:isolate }
.rx-pila { position:absolute; inset:0; transform-style:preserve-3d; transition:transform 1.5s var(--ease) }
.rx-capa { position:absolute; inset:0; transition:transform 1.5s var(--ease), opacity .45s, box-shadow .6s, background-color .6s }
.rx-capa svg { position:absolute; inset:0; width:100%; height:100%; display:block; overflow:visible }
.rx-capa[data-off] { opacity:0; pointer-events:none }
.rx-capa .rx-n { display:none }
.rx-mesa[data-estilo="esc"]:not([data-vista="capas"]):not([data-vista="mapa"]) .rx-pila { transform:rotate(-.8deg) scale(1.02) }
.rx-mesa[data-estilo="esc"]:not([data-vista="capas"]):not([data-vista="mapa"]) .rx-capa:not(.c0) svg > g { filter:url(#rx-onda) }
.rx-mesa[data-estilo="esc"]:not([data-vista="capas"]):not([data-vista="mapa"]) .rx-capa.c0 { box-shadow:0 .5em 1.4em -.4em rgba(0,0,0,.45) }
.rx-mesa[data-vista="capas"] .rx-pila { transform:translate(9%, -3%) rotateX(60deg) rotateZ(-41deg) scale(.7) }
.rx-mesa[data-vista="capas"] .rx-capa { transform:translateZ(calc(var(--i) * 56px - 140px)); box-shadow:0 0 0 1px rgba(30,60,120,.32), 0 1.6em 2em -1.2em rgba(0,0,0,.4); background:rgba(255,255,255,.12) }
.rx-mesa[data-vista="capas"] .rx-capa.c0, .rx-mesa[data-vista="mapa"] .rx-capa.c0 { background:#eceff3 }
.rx-mesa[data-vista="capas"] .rx-capa .rx-n { display:inline-flex; align-items:center; gap:.5em; position:absolute; left:1.2%; top:1.6%; background:#000; color:#fff; font:500 1.15em var(--sans); padding:.18em .8em .18em .25em; border-radius:999px; white-space:nowrap }
.rx-capa .rx-n b { display:grid; place-items:center; width:1.55em; height:1.55em; border-radius:50%; background:#fff; color:#000; font-weight:600; font-size:.9em }
.rx-mesa[data-estilo="dig"] .s-esc, .rx-mesa[data-vista="capas"] .s-esc, .rx-mesa[data-vista="mapa"] .s-esc { display:none }
.rx-mesa[data-estilo="esc"]:not([data-vista="capas"]):not([data-vista="mapa"]) .s-dig { display:none }
/* paleta: digital (también la de las capas desplegadas) y escaneada */
.rx-mesa[data-estilo="dig"], .rx-mesa[data-vista="capas"], .rx-mesa[data-vista="mapa"] {
  --papel:#fff; --grid:#d3dae4; --tinta:#1b2430; --bed:#eef1f5; --halo:#fff;
  --cSUC:#f2d6cf; --cSUNC:#f9c795; --cSUS:rgba(255,244,184,.78); --cSUSl:#d6322e;
  --zR:#f2a65a; --zU:#f7df8b; --zI:#b9a2dc; --zT:#e98a8f; --zE:#8ea7de; --zV:#a8d98a; --zVIA:#f6f5f1; --zL:#3f4a5a;
  --aFP:#1e78c8; --aT500:rgba(120,176,236,.34); --aLLE:#d6322e; --aDPH:#165a9c; --calle:#b9bfc9 }
.rx-mesa[data-estilo="esc"]:not([data-vista="capas"]):not([data-vista="mapa"]) {
  --papel:#f1efe8; --grid:#8d949c; --tinta:#2d3340; --bed:#b9b6ae; --halo:#f1efe8;
  --cSUC:#e9c9c2; --cSUNC:#f7bf8b; --cSUS:rgba(255,238,170,.72); --cSUSl:#3a45b0;
  --zR:#fec08a; --zU:#f3df95; --zI:#9e84cf; --zT:#e8a0a0; --zE:#77bef5; --zV:#83b64e; --zVIA:#c9c8c4; --zL:#4a5160;
  --aFP:#355f8a; --aT500:rgba(90,130,190,.3); --aLLE:#a3261e; --aDPH:#2d4f78; --calle:#a9a79f }
.rx-capa svg * { transition:fill .8s, stroke .8s, opacity .6s }
.rx-capa .papel { fill:var(--papel) }
.rx-mesa[data-vista="capas"] .rx-capa.c0 .papel, .rx-mesa[data-vista="mapa"] .rx-capa.c0 .papel { fill:#eceff3 }
.rx-capa .marco { fill:none; stroke:var(--tinta); stroke-width:1.2 }
.rx-capa .rejilla { stroke:var(--grid); stroke-width:.6; fill:none; stroke-dasharray:2 4 }
.rx-capa .cruz { stroke:var(--grid); stroke-width:1; fill:none }
.rx-capa .tx { font:500 11px var(--mono); fill:var(--tinta); paint-order:stroke; stroke:var(--halo); stroke-width:2.6px; stroke-linejoin:round }
.rx-capa .tx.g { font-size:13px } .rx-capa .tx.p { font-size:9.5px; stroke:none; fill:var(--zL) }
.rx-capa .tx.i { font-family:Georgia, "Times New Roman", serif; font-style:italic; font-weight:400; font-size:15px }
.rx-capa .ctra { fill:#a9adb6; stroke:var(--tinta); stroke-width:.8 } .rx-mesa[data-estilo="esc"]:not([data-vista="capas"]):not([data-vista="mapa"]) .rx-capa .ctra { fill:#bfae86 }
.rx-capa .ctra-eje { stroke:#fff; stroke-width:1.4; stroke-dasharray:7 6; fill:none }
.rx-capa .cauce-b { stroke:#9ec3df; stroke-width:5; fill:none; stroke-linecap:round } .rx-capa .edif { fill:var(--calle); opacity:.7 }
.cSNUP { fill:url(#rx-p-snu-d) } .cSUC { fill:var(--cSUC); stroke:var(--tinta); stroke-width:1 } .cSUNC { fill:var(--cSUNC); stroke:var(--tinta); stroke-width:1 }
.cSUS { fill:var(--cSUS); stroke:var(--cSUSl); stroke-width:2; stroke-dasharray:9 4 2 4 }
.zR { fill:var(--zR) } .zU { fill:var(--zU) } .zI { fill:var(--zI) } .zT { fill:var(--zT) } .zE { fill:var(--zE) } .zV { fill:var(--zV) } .zVIA { fill:var(--zVIA) }
.z { stroke:var(--tinta); stroke-width:.7 }
.alt rect { fill:var(--papel); stroke:var(--tinta); stroke-width:.8 } .alt text { font:600 10.5px var(--mono); fill:var(--tinta); text-anchor:middle; dominant-baseline:central }
.aT500 { fill:var(--aT500) } .aFP { fill:url(#rx-p-fp-d) } .aLLEs { fill:url(#rx-p-lle-d) } .aDud { fill:url(#rx-p-dud-d); stroke:#d08a00; stroke-width:1.3; stroke-dasharray:4 3 }
.rx-mesa[data-estilo="esc"]:not([data-vista="capas"]):not([data-vista="mapa"]) .cSNUP { fill:url(#rx-p-snu-e) } .rx-mesa[data-estilo="esc"]:not([data-vista="capas"]):not([data-vista="mapa"]) .aFP { fill:url(#rx-p-fp-e) }
.rx-mesa[data-estilo="esc"]:not([data-vista="capas"]):not([data-vista="mapa"]) .aLLEs { fill:url(#rx-p-lle-e) } .rx-mesa[data-estilo="esc"]:not([data-vista="capas"]):not([data-vista="mapa"]) .aDud { fill:url(#rx-p-dud-e) }
.aLLE { stroke:var(--aLLE); stroke-width:2.2; stroke-dasharray:12 4 2 4; fill:none } .aDPH { stroke:var(--aDPH); stroke-width:3.4; fill:none; stroke-linecap:round }
.rx-capa .pR7 { fill:rgba(255,255,255,.18); stroke:#e11d2a; stroke-width:3.2 } .rx-capa .pm { stroke:#e11d2a; stroke-width:2; fill:none }
.rx-capa .pet rect { fill:#e11d2a } .rx-capa .pet text { font:600 12px var(--mono); fill:#fff; text-anchor:middle; dominant-baseline:central }
.rx-capa .sello { fill:none; stroke:#8a2a55; opacity:.72 } .rx-capa .sello-t { font:700 8px var(--mono); fill:#8a2a55; text-anchor:middle; opacity:.78; stroke:none }
.rx-capa .mancha { fill:none; stroke:#7a5a2a; opacity:.13 }
/* resaltado por la leyenda */
.rx-capa .rx-dim { opacity:.16 } .rx-capa .rx-hl { filter:drop-shadow(0 0 3px rgba(37,81,214,.95)); stroke:#2551d6 !important; stroke-width:2.6 }
.rx-capa .rx-lit { animation:rx-pulso 1.1s ease-out 1 } @keyframes rx-pulso { 0% { filter:drop-shadow(0 0 0 rgba(37,81,214,0)) } 35% { filter:drop-shadow(0 0 6px rgba(37,81,214,1)) } 100% { filter:drop-shadow(0 0 0 rgba(37,81,214,0)) } }
/* barrido de «mira el plano» */
.rx-barrido { position:absolute; top:0; bottom:0; left:0; width:16%; z-index:6; pointer-events:none; opacity:0;
  background:linear-gradient(90deg, rgba(37,81,214,0), rgba(37,81,214,.22) 70%, rgba(37,81,214,.55)); border-right:2px solid var(--blue) }
.rx-vista.va .rx-barrido { animation:rx-barre 2.1s var(--ease) 1 forwards } @keyframes rx-barre { 0% { transform:translateX(-100%); opacity:1 } 90% { opacity:1 } 100% { transform:translateX(630%); opacity:0 } }
.rx-vista-et { position:absolute; left:.7em; top:.7em; z-index:7; background:#000; color:#fff; font-size:.88em; padding:.3em .8em; border-radius:999px; opacity:0; transform:translateY(-.3em); transition:opacity .3s, transform .3s; pointer-events:none }
.rx-vista-et.on { opacity:1; transform:none }
.rx-dato { position:absolute; z-index:8; max-width:15em; background:#000; color:#fff; border-radius:.7em; padding:.45em .75em; font-size:.88em; line-height:1.35; box-shadow:0 .8em 1.6em -.8em rgba(0,0,0,.6); pointer-events:none; opacity:0; transform:translateY(.4em) scale(.96); transition:opacity .25s, transform .25s }
.rx-dato.on { opacity:1; transform:none } .rx-dato b { font:600 1em var(--mono); color:#ffe082; margin-right:.3em }
.rx-flechas { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; z-index:9; overflow:visible }
.rx-flechas path { fill:none; stroke:var(--blue); stroke-width:2; stroke-dasharray:1; stroke-dashoffset:0; filter:drop-shadow(0 0 2px rgba(255,255,255,.9)) }
.rx-flechas circle { fill:var(--blue); stroke:#fff; stroke-width:2 }
.rx-flechas path.dib { animation:rx-trazo .5s ease-out forwards } @keyframes rx-trazo { from { stroke-dashoffset:1 } to { stroke-dashoffset:0 } }
/* leyenda */
.rx-ley { background:var(--bg); border:1px solid var(--line); border-radius:1em; padding:.55em .65em .65em; display:flex; flex-direction:column; min-width:0 }
.rx-ley h4 { margin:.55em .3em .2em; font:500 .74em/1.1 var(--sans); letter-spacing:.07em; text-transform:uppercase; color:var(--ink-3) }
.rx-ley h4:first-child { margin-top:.2em }
.rx-fila { display:grid; grid-template-columns:2.3em minmax(0, 1fr) auto; gap:.6em; align-items:center; padding:.2em .35em; border-radius:.55em; cursor:default; position:relative; transition:background-color .25s, box-shadow .25s; min-height:1.95em }
.rx-fila .sw { width:2.3em; height:1.25em; border-radius:.2em; overflow:visible }
.rx-fila .nom { font-size:.95em; line-height:1.2; color:var(--ink-2) }
.rx-fila .cod { font:500 .78em var(--mono); color:var(--ink-4); min-width:2.2em; text-align:right }
.rx-fila.on { background:#e8eefd; box-shadow:0 0 0 1px #bccaf5 } .rx-fila.on .nom { color:var(--ink) }
.rx-fila.leida .cod { color:var(--rx-verde) }
.rx-fila:hover { background:#f0f2f8 }
.rx-ley svg .sw-l { stroke-width:2.6; fill:none }
/* lo que leyó el agente + capas */
.rx-der { display:flex; flex-direction:column; gap:.85em; min-width:0 }
.rx-lee, .rx-capas { background:var(--bg); border:1px solid var(--line); border-radius:1em; padding:.55em .65em .65em; min-width:0 }
.rx-lee h4, 
.rx-tabla { display:flex; flex-direction:column; gap:.18em }
.rx-lin { display:grid; grid-template-columns:3.6em minmax(0, 1fr); gap:.6em; align-items:center; padding:.3em .4em; border-radius:.55em; background:#fff; border:1px solid var(--line); min-height:2.5em }
.rx-lin .c { font:600 .84em var(--mono); background:var(--bg-2); border-radius:.45em; padding:.2em 0; text-align:center; color:var(--ink) }
.rx-lin .v { font-size:.9em; line-height:1.3; color:var(--ink-2) } 
.rx-lin.dud { background:#fff8e6; border-color:#f2d58b } .rx-lin.dud .c { background:#ffd66b; color:#5a3d00 }
.rx-lin.ok::after { content:""; display:none }
.rx-lin[hidden] { display:none }
.rx-capas { transition:opacity .5s }
.rx-capas-lista { display:flex; flex-direction:column; gap:.14em }
.rx-capa-f { display:grid; grid-template-columns:1.6em minmax(0, 1fr) auto; gap:.55em; align-items:center; padding:.22em .4em; border-radius:.55em; background:#fff; border:1px solid var(--line); min-height:2.15em }
.rx-capa-f .nn { display:grid; place-items:center; width:1.5em; height:1.5em; border-radius:50%; background:#000; color:#fff; font:500 .78em var(--sans) }
.rx-capa-f .nm { font-size:.95em; color:var(--ink) }
.rx-sw { all:unset; cursor:pointer; width:2.5em; height:1.4em; border-radius:999px; background:var(--line-2); position:relative; transition:background-color .25s; flex:none }
.rx-sw::after { content:""; position:absolute; left:.17em; top:.17em; width:1.06em; height:1.06em; border-radius:50%; background:#fff; transition:transform .25s var(--ease); box-shadow:0 1px 2px rgba(0,0,0,.3) }
.rx-sw[aria-checked="true"] { background:var(--blue) } .rx-sw[aria-checked="true"]::after { transform:translateX(1.1em) }
.rx-pie-mesa { margin-top:.8em; font-size:.88em; color:var(--ink-3); text-align:center }
.rx-mesa[data-fase="0"] .rx-capas, .rx-mesa[data-fase="1"] .rx-capas, .rx-mesa[data-fase="2"] .rx-capas, .rx-mesa[data-fase="3"] .rx-capas { opacity:.35 }

/* ── LAS SEIS TARJETAS ─────────────────────────────────────────────────── */
.rx-bento { display:grid; grid-template-columns:repeat(12, 1fr); gap:12px; margin-top:48px }
.rx-t { position:relative; border-radius:var(--r-xl); overflow:hidden; display:flex; flex-direction:column; background:var(--card); min-width:0 }
.rx-t1 { grid-column:span 7; background:#fff; border:1px solid var(--line); flex-direction:row }
.rx-t2 { grid-column:span 5; background:#fff4d6 }
.rx-t3 { grid-column:span 4; background:#e6effb }
.rx-t4 { grid-column:span 4; background:var(--rx-tinta); color:#fff }
.rx-t5 { grid-column:span 4; background:#fff; border:1px solid var(--line) }
.rx-t6 { grid-column:1 / -1; background:#ece9e4; flex-direction:row-reverse }
.rx-t-vis { position:relative; flex:none; display:flex; align-items:center; justify-content:center; padding:18px; min-height:230px }
.rx-t1 .rx-t-vis { width:56%; padding:10px; background:#fbfaf8; border-right:1px solid var(--line) }
.rx-t6 .rx-t-vis { width:46%; background:#f6f4f0 }
.rx-t-vis svg { width:100%; height:auto; max-height:300px; overflow:visible }
.rx-t-txt { padding:22px 26px 24px; display:flex; flex-direction:column; gap:14px; flex:1; min-width:0 }
.rx-t h3 { margin:0; font-weight:450; font-size:clamp(21px, 1.7vw, 26px); line-height:1.15; letter-spacing:-.015em }
.rx-flujo { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:7px }
.rx-flujo li { display:grid; grid-template-columns:30px minmax(0, 1fr); gap:10px; align-items:center; font-size:16.5px; line-height:1.3 }
.rx-flujo .ic { width:30px; height:30px; border-radius:9px; background:rgba(255,255,255,.75); box-shadow:0 0 0 1px rgba(0,0,0,.08); padding:6px; stroke:#222; fill:none; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round }
.rx-flujo li:nth-child(3) .ic { background:#000; stroke:#fff }
.rx-flujo .k { display:block; font-size:12.5px; letter-spacing:.06em; text-transform:uppercase; color:rgba(0,0,0,.45); line-height:1.1 }
.rx-flujo li:nth-child(1) { color:var(--ink-3) } .rx-flujo li:nth-child(3) { font-weight:500 }
.rx-clave { display:flex; align-items:baseline; gap:10px 14px; flex-wrap:wrap }
.rx-clave b { font-weight:300; font-size:clamp(40px, 3.6vw, 60px); line-height:1; letter-spacing:-.035em; font-variant-numeric:tabular-nums; white-space:nowrap }
.rx-clave > span { font-size:16px; color:var(--ink-2) }
.rx-clave b i { font-style:normal; font-size:.46em; letter-spacing:-.01em; margin-left:.12em; color:var(--ink-3) }
.rx-par { display:inline-block; font-size:15px; color:var(--ink-2); background:#f1efea; border-radius:6px; padding:1px 8px }
.rx-ring { position:relative; width:150px; height:150px; flex:none } .rx-ring svg { position:absolute; inset:0; width:100%; height:100% } .rx-ring b { position:absolute; inset:0; display:grid; place-content:center; text-align:center; font-weight:300; font-size:46px; line-height:1; letter-spacing:-.04em } .rx-ring b small { display:block; font-size:13px; letter-spacing:.02em; color:var(--ink-3); margin-top:4px; font-weight:400 }
.rx-t3 .rx-clave b { color:#1a5fa6 } .rx-t2 .rx-clave b { color:#8a5a00 } .rx-t1 .rx-clave b { color:#1f7a4a }
.rx-normas { display:flex; flex-wrap:wrap; gap:6px; margin-top:auto }
.rx-t4 .rx-flujo li:nth-child(1), .rx-t4 .rx-clave > span, .rx-t4 .rx-flujo .k { color:rgba(255,255,255,.62) }
.rx-t4 .rx-flujo .ic { background:rgba(255,255,255,.1); stroke:#fff; box-shadow:0 0 0 1px rgba(255,255,255,.18) } .rx-t4 .rx-flujo li:nth-child(3) .ic { background:#fff; stroke:#000 }
.rx-t4 .rx-norma { background:rgba(255,255,255,.12); color:#dfe6ff }
.rx-t6 .rx-flujo { flex-direction:row; gap:18px } .rx-t6 .rx-flujo li { grid-template-columns:1fr; gap:8px; align-content:start; flex:1 }
.rx-t4 .rx-t-vis { background:#1d2029 }
.rx-t4 .rx-t-vis svg { max-height:230px }
/* contenidos HTML de las tarjetas 2 y 5 */
.rx-nota { width:min(100%, 330px); background:#fff; border-radius:14px; box-shadow:0 18px 40px -26px rgba(0,0,0,.45); padding:16px 18px 18px; position:relative; border:1px solid #efe3bd }
.rx-nota .cab { display:flex; justify-content:space-between; align-items:center; font:500 13px var(--mono); color:var(--ink-3) } .rx-nota .cab i { font-style:normal; background:#fff3d1; color:#7a5200; border-radius:999px; padding:1px 8px }
.rx-nota .ln { height:8px; border-radius:4px; background:#ece9e2; margin-top:11px } .rx-nota .ln.s { width:62% } .rx-nota .ln.m { width:84% }
.rx-nota .imp { margin-top:16px; display:flex; align-items:baseline; gap:8px; flex-wrap:wrap } .rx-nota .imp b { font-weight:400; font-size:34px; letter-spacing:-.03em; font-variant-numeric:tabular-nums; white-space:nowrap }
.rx-nota .imp small { font-size:13px; color:var(--ink-3) }
.rx-nota .mod { position:absolute; right:-10px; top:46px; background:var(--rx-rojo); color:#fff; font:600 12px var(--mono); padding:5px 10px; border-radius:6px; transform:rotate(5deg); box-shadow:0 6px 14px -8px rgba(0,0,0,.6) }
.rx-nota .delta { display:inline-block; margin-top:10px; background:#fde7e5; color:#a3231f; font:600 14px var(--mono); border-radius:8px; padding:4px 10px }
.rx-cart { width:100%; max-width:380px; display:grid; grid-template-columns:auto repeat(4, 1fr); gap:5px; font-size:13px }
.rx-cart .h { font:500 12px var(--mono); color:var(--ink-3); padding:0 2px 4px; text-transform:uppercase; letter-spacing:.04em }
.rx-cart .a { font:500 13px var(--mono); color:var(--ink-3); display:flex; align-items:center; padding-right:6px }
.rx-cart .c { height:30px; border-radius:7px; background:#f1efea; display:grid; place-items:center; font:500 12.5px var(--mono); color:var(--ink-2); position:relative; overflow:hidden }
.rx-cart .c.ok { background:#dff3e6; color:#1a6a40 } .rx-cart .c.rv { background:#ffe9b0; color:#7a5200 }
.rx-cart .c { white-space:nowrap } .rx-cart .c.rv::after { content:"!"; position:absolute; right:5px; top:50%; transform:translateY(-50%); font-size:11px; opacity:.7 }

/* ── VIGILANCIA: línea de tiempo ──────────────────────────────────────── */
.rx-tl { position:relative; display:grid; grid-template-columns:repeat(3, 1fr); gap:20px; margin-top:52px; padding-top:34px }
.rx-tl-hilo { position:absolute; left:16.6%; right:16.6%; top:0; height:4px; border-radius:2px; background:var(--line-2); overflow:hidden }
.rx-tl-hilo i { position:absolute; inset:0; background:var(--blue); transform-origin:0 50%; transform:scaleX(1) }
.rx-tl-punto { position:absolute; top:-5px; left:16.6%; width:14px; height:14px; border-radius:50%; background:var(--blue); box-shadow:0 0 0 5px rgba(37,81,214,.18); margin-left:-7px }
.rx-tl-n { position:relative; background:#fff; border:1px solid var(--line); border-radius:var(--r-l); padding:22px 22px 24px; display:flex; flex-direction:column; gap:14px; min-height:280px }
.rx-tl-n::before { content:""; position:absolute; top:-34px; left:50%; width:2px; height:34px; background:var(--line-2); margin-left:-1px }
.rx-tl-n::after { content:""; position:absolute; top:-40px; left:50%; width:14px; height:14px; border-radius:50%; margin-left:-7px; background:#fff; border:3px solid var(--blue) }
.rx-tl-n .k { font-size:15px; color:var(--ink-3) } .rx-tl-n h3 { margin:0; font-weight:450; font-size:21px; letter-spacing:-.01em }
.rx-tl-n.alerta { background:var(--rx-tinta); color:#fff; border-color:var(--rx-tinta) } .rx-tl-n.alerta .k { color:rgba(255,255,255,.6) }
.rx-bol { background:#f6f4ee; border:1px solid #e3ddcc; border-radius:10px; padding:14px 16px; font-family:Georgia, "Times New Roman", serif; position:relative }
.rx-bol small { display:block; font:500 12px var(--mono); letter-spacing:.06em; text-transform:uppercase; color:#8a7e5e; margin-bottom:6px }
.rx-bol b { display:block; font-weight:600; font-size:17px; line-height:1.25; color:#2a2417 }
.rx-bol .ln { height:6px; border-radius:3px; background:#e4dfd0; margin-top:9px } .rx-bol .ln.m { width:80% } .rx-bol .ln.s { width:55% }
.rx-bol mark { background:var(--mark); color:inherit; border-radius:3px; padding:0 3px }
.rx-radar { width:92px; height:92px; position:relative; margin:2px 0 0 }
.rx-radar svg { width:100%; height:100%; overflow:visible } .rx-radar .anillo { fill:none; stroke:var(--blue); stroke-width:2; opacity:.5 }
.rx-det { font-size:17px; line-height:1.35; color:var(--ink-2) } .rx-det b { color:var(--ink); font-weight:500 }
.rx-av { display:grid; gap:8px; margin-top:2px }
.rx-av div { display:grid; grid-template-columns:5.2em minmax(0, 1fr); gap:10px; align-items:baseline; font-size:16.5px; line-height:1.3; padding-top:8px; border-top:1px solid rgba(255,255,255,.14) }
.rx-av div:first-child { border-top:0; padding-top:0 } .rx-av span { font-size:13.5px; letter-spacing:.05em; text-transform:uppercase; color:rgba(255,255,255,.55) } .rx-av b { font-weight:500; color:#fff }
.rx-av b.pl { color:#ffe082 }
.rx-vig-chips { display:flex; flex-wrap:wrap; gap:10px; margin-top:28px }
.rx-vig-chips span { display:inline-flex; align-items:center; gap:8px; background:#fff; border:1px solid var(--line); border-radius:999px; padding:8px 16px 8px 12px; font-size:16.5px }
.rx-vig-chips svg { width:18px; height:18px; stroke:#222; fill:none; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round }

/* ── cómo trabajamos / confianza: más ligero ──────────────────────────── */
.rx-ligero .bento .card { min-height:170px }

/* ═══ MOVIMIENTO: sólo si el JS lo permite (clase rx-anim en <html>) ═══ */
.rx-anim .rxa { opacity:0 }
.rx-anim .go .rxa { animation:rx-in .7s var(--ease) var(--d, 0s) both }
@keyframes rx-in { from { opacity:0; transform:translateY(10px) } to { opacity:1; transform:none } }
.rx-anim .rxa-p { stroke-dasharray:1; stroke-dashoffset:1; opacity:1 }
.rx-anim .go .rxa-p { animation:rx-draw 1s var(--ease) var(--d, 0s) both }
@keyframes rx-draw { from { stroke-dashoffset:1 } to { stroke-dashoffset:0 } }
.rx-anim .rxa-f { opacity:0 }
.rx-anim .go .rxa-f { animation:rx-fade .8s ease var(--d, 0s) both }
@keyframes rx-fade { from { opacity:0 } to { opacity:1 } }
.rx-anim .rxa-w { transform-box:fill-box; transform-origin:0 100%; transform:scaleY(0) }
.rx-anim .go .rxa-w { animation:rx-grow 1.2s var(--ease) var(--d, 0s) both }
@keyframes rx-grow { from { transform:scaleY(0) } to { transform:scaleY(1) } }
.rx-anim .rxa-h { transform-box:fill-box; transform-origin:0 50%; transform:scaleX(0) }
.rx-anim .go .rxa-h { animation:rx-growx 1s var(--ease) var(--d, 0s) both }
@keyframes rx-growx { from { transform:scaleX(0) } to { transform:scaleX(1) } }
.rx-anim .rxa-pop { transform-box:fill-box; transform-origin:50% 50%; opacity:0 }
.rx-anim .go .rxa-pop { animation:rx-pop .55s cubic-bezier(.3,1.5,.5,1) var(--d, 0s) both }
@keyframes rx-pop { from { opacity:0; transform:scale(.3) } to { opacity:1; transform:none } }
.rx-anim .go .rx-flujo li { animation:rx-in .6s var(--ease) both } .rx-anim .go .rx-flujo li:nth-child(1) { animation-delay:.2s } .rx-anim .go .rx-flujo li:nth-child(2) { animation-delay:.5s } .rx-anim .go .rx-flujo li:nth-child(3) { animation-delay:.8s }
.rx-anim .rx-flujo li, .rx-anim .rx-clave { opacity:0 } .rx-anim .go .rx-clave { animation:rx-in .6s var(--ease) 1.1s both }
.rx-anim .rxa-c { opacity:0 } .rx-anim .go .rxa-c { animation:rx-in .5s ease var(--d, 0s) both }
@keyframes rx-flujo { to { stroke-dashoffset:-60 } }
.rx-anim .go .rxf-waveg { animation:rx-ola 5s linear infinite } @keyframes rx-ola { from { transform:translateX(0) } to { transform:translateX(-80px) } }
.rx-anim .go .rx-t3-ola { animation:rx-ola 4s linear infinite }
.rx-anim .go .rx-radar .anillo { animation:rx-ping 2.2s ease-out infinite } .rx-anim .go .rx-radar .anillo:nth-child(2) { animation-delay:.7s } .rx-anim .go .rx-radar .anillo:nth-child(3) { animation-delay:1.4s }
@keyframes rx-ping { from { transform:scale(.25); opacity:.8 } to { transform:scale(1.5); opacity:0 } }
.rx-radar .anillo { transform-box:fill-box; transform-origin:50% 50% }
.rx-anim .go .rx-hilo-i { animation:rx-growx 3.2s linear 0s both }
.rx-anim .rx-hilo-i { transform:scaleX(0) }
.rx-anim .go .rx-tl-punto { animation:rx-viaja 3.2s linear 0s both }
@keyframes rx-viaja { from { left:16.6% } to { left:83.4% } }
.rx-anim .rx-tl-n { opacity:.4; transform:translateY(8px); transition:opacity .6s, transform .6s }
.rx-anim .go .rx-tl-n { opacity:1; transform:none } .rx-anim .go .rx-tl-n:nth-of-type(1) { transition-delay:.1s } .rx-anim .go .rx-tl-n:nth-of-type(2) { transition-delay:1.5s } .rx-anim .go .rx-tl-n:nth-of-type(3) { transition-delay:3s }
.rx-anim .rx-av div { opacity:0 } .rx-anim .go .rx-av div { animation:rx-in .5s var(--ease) both } .rx-anim .go .rx-av div:nth-child(1) { animation-delay:3.2s } .rx-anim .go .rx-av div:nth-child(2) { animation-delay:3.5s } .rx-anim .go .rx-av div:nth-child(3) { animation-delay:3.8s }
.rx-tick { stroke:var(--blue); stroke-width:3; stroke-linecap:round }
.rx-anim .go .rx-tick { animation:rx-tickon .25s ease both } @keyframes rx-tickon { from { stroke:#cfcac2 } to { stroke:var(--blue) } }
.rx-anim .go .rx-nota .mod { animation:rx-sello .5s cubic-bezier(.3,1.5,.5,1) 1.5s both } .rx-anim .rx-nota .mod { opacity:0 }
@keyframes rx-sello { from { opacity:0; transform:rotate(5deg) scale(2.2) } to { opacity:1; transform:rotate(5deg) } }
.rx-anim .rx-nota .delta { opacity:0 } .rx-anim .go .rx-nota .delta { animation:rx-in .5s ease 2.4s both }
.rx-anim .rx-cart .c { opacity:.0 } .rx-anim .go .rx-cart .c { animation:rx-in .45s ease both; animation-delay:calc(var(--n) * .11s + .3s) }

/* ═══ RESPONSIVE ═══ */
@media (max-width:1180px) {
  .rx-cuerpo { grid-template-columns:minmax(0, 1.1fr) minmax(0, .9fr) }
  .rx-der { grid-column:1 / -1; flex-direction:row } .rx-der > * { flex:1 }
  .rx-pasos { order:3; width:100%; margin-inline:0; justify-content:flex-start }
}
@media (max-width:980px) {
  .rx-hero-grid { grid-template-columns:1fr; gap:30px } .rx-hero { padding-top:56px }
  .rx-gran-fila { grid-template-columns:1fr } .rx-gran, .rx-gran + .rx-gran { padding:28px 0 14px; border-left:0; border-top:1px solid var(--line) } .rx-gran:first-child { border-top:0 }
  .rx-t1, .rx-t6 { grid-column:1 / -1; flex-direction:column } .rx-t1 .rx-t-vis, .rx-t6 .rx-t-vis { width:100%; border-right:0 }
  .rx-t2 { grid-column:1 / -1 } .rx-t3, .rx-t4, .rx-t5 { grid-column:span 6 }
  .rx-t6 .rx-flujo { flex-direction:column }
  .rx-tl { grid-template-columns:1fr; gap:30px; padding-top:0 } .rx-tl-hilo, .rx-tl-punto, .rx-tl-n::before, .rx-tl-n::after { display:none } .rx-tl-n { min-height:0 }
}
@media (max-width:760px) {
  .rx-cuerpo { grid-template-columns:1fr } .rx-der { flex-direction:column }
  .rx-mesa { --fs:14.5px; padding:.7em; border-radius:20px } .rx-seg button { padding:.5em .8em }
  .rx-flechas { display:none } .rx-mesa[data-vista="capas"] .rx-pila { transform:none !important }
  .rx-mesa[data-vista="capas"] .rx-capa { transform:none !important; box-shadow:none; background:transparent }
  .rx-mesa[data-vista="capas"] .rx-capa .rx-n { display:none } .rx-mesa[data-vista="capas"] .rx-capa.c0, .rx-mesa[data-vista="mapa"] .rx-capa.c0 { background:#eceff3 }
  .rx-capa .tx { font-size:17px } .rx-capa .tx.g { font-size:21px } .rx-capa .tx.p, .rx-capa .minor { display:none } .alt text { font-size:15px } .alt rect { transform:scale(1.35); transform-box:fill-box; transform-origin:center }
  .rx-dato { max-width:62%; font-size:13.5px }
}
@media (max-width:640px) {
  .rx-hero { padding:44px 0 36px } .rx-ficha { margin-top:30px; border-radius:20px } .rx-ficha-cab { padding:14px 16px } .rx-ficha-cab .rx-pill-ej { margin-left:0 }
  .rx-ficha-dib { padding:8px 8px 4px } .rx-ficha-lado { padding:16px 16px 12px; gap:8px 14px } .rx-stat b { font-size:34px } .rx-stat > span { font-size:14px }
  .rx-ficha-pie { padding:12px 16px 14px }
  .rxf-t { font-size:22px } .rxf-t.s { font-size:20px } .rxf-t.big { font-size:34px } .rxf-lg { display:none !important } .rxf-sh { display:inline !important }
  .rx-gran-n { font-size:clamp(64px, 20vw, 92px) }
  .rx-t3, .rx-t4, .rx-t5 { grid-column:1 / -1 } .rx-t-txt { padding:18px 18px 20px } .rx-t-vis { min-height:0; padding:14px }
  .rx-plano-cab { margin-bottom:18px } .rx-pill-ej { white-space:normal }
  .rx-tl { margin-top:36px }
  .rx-nota .mod { right:-4px }
}
.rxf-sh { display:none } .rxf-lg { display:inline }
@media (prefers-reduced-motion: reduce) {
  .rx-anim .rxa, .rx-anim .rxa-p, .rx-anim .rxa-f, .rx-anim .rxa-w, .rx-anim .rxa-h, .rx-anim .rxa-pop, .rx-anim .rxa-c { opacity:1; transform:none; stroke-dashoffset:0 }
  .rx-pila, .rx-capa { transition:none !important }
}

/* etiquetas de certeza: interpretado (azul) · documentado (verde) · revisar (ámbar) */
.tg { display:inline-block; font:500 .8em/1.25 var(--sans); border-radius:999px; padding:.04em .6em; white-space:nowrap; vertical-align:.05em }
.tg.int { background:#e8eefd; color:#2b3f8f } .tg.doc { background:#dff3e6; color:#1a6a40 } .tg.rev { background:#ffe3a3; color:#6b4600 }
.rx-dato .tg.int { background:rgba(255,255,255,.16); color:#dbe4ff } .rx-dato .tg.doc { background:#1f5a3c; color:#d8f5e2 } .rx-dato .tg.rev { background:#ffd66b; color:#4a3300 }
.rx-dato .dc { display:block; margin-top:.25em; color:#cfd6ff; font-size:.92em }
.rx-orig { position:absolute; right:.7em; top:.7em; z-index:7; display:inline-flex; align-items:center; gap:.4em; background:rgba(255,255,255,.92); color:var(--ink-2); font-size:.82em; padding:.28em .75em; border-radius:999px; box-shadow:0 0 0 1px rgba(0,0,0,.12); pointer-events:none }
.rx-orig svg { width:1em; height:1em; stroke:currentColor; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round }
.rx-mesa[data-vista="capas"] .rx-orig, .rx-mesa[data-vista="mapa"] .rx-orig { display:none }
.rx-capa-f .nm { line-height:1.25 } .rx-capa-f .nm .tg { margin-left:.2em }

/* ═══ v2 de la pieza: inspector, capas en tres grupos, cruce, capas de servicios y entorno ═══ */
.rx-capa .sub-off { opacity:0; pointer-events:none }
.rx-mesa[data-vista="plano"] [data-ext], .rx-mesa[data-vista="plano"] .rx-capa.c4 { display:none }
.aNat { fill:rgba(46,158,98,.28); stroke:#1f7a4a; stroke-width:1.4; stroke-dasharray:5 3 }
.ePob { fill:#7a50aa; stroke:#7a50aa; stroke-width:1; stroke-dasharray:6 4; stroke-opacity:.6; pointer-events:all }
.eRenta { fill:#2e9e62; stroke:none; pointer-events:all }
.eTrn { stroke:#6b3fb0; stroke-width:3.4; stroke-dasharray:1 7; stroke-linecap:round; fill:none }
.eStop circle { fill:#fff; stroke:#6b3fb0; stroke-width:3 } .eStop rect { fill:#6b3fb0 }
.tg.srv { background:#efe6fb; color:#5a2f9a } .tg.pend { background:#eceae6; color:#6b6760 }
.rx-dato .tg.srv { background:#4a2c78; color:#eadcff }
.rx-seg-s { align-self:flex-start; font-size:.92em; margin:0 0 .5em .15em }
.rx-panel { background:var(--bg); border:1px solid var(--line); border-radius:1em; padding:.6em .65em .65em; min-width:0; min-height:21em }
.rx-mesa[data-panel="lee"] .rx-insp, .rx-mesa[data-panel="insp"] .rx-tabla { display:none }
.rx-insp-cab { display:flex; align-items:baseline; justify-content:space-between; gap:.6em; margin:0 .2em .45em } .rx-insp-cab b { font-weight:600; font-size:1.02em }
.rx-insp-cab .pt { font:500 .82em var(--mono); color:var(--ink-3) }
.rx-hint { margin:.6em .3em; color:var(--ink-3); font-size:.95em }
.rx-cad { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:0 }
.rx-esl { position:relative; display:grid; grid-template-columns:5.2em minmax(0, 1fr); gap:.1em .6em; padding:.42em .4em .42em .55em; margin-left:.35em; border-left:2px solid var(--line-2); font-size:.92em; line-height:1.3; align-items:baseline }
.rx-esl + .rx-esl::before { content:""; position:absolute; left:-2px; top:-.9em; width:2px; height:.9em; background:var(--blue); transform-origin:50% 0; animation:rx-baja .35s ease-out both }
.rx-esl + .rx-esl::after { content:""; position:absolute; left:-5px; top:-.12em; border:solid transparent; border-width:5px 4px 0; border-top-color:var(--blue); animation:rx-fade .2s ease .3s both }
@keyframes rx-baja { from { transform:scaleY(0) } to { transform:scaleY(1) } }
.rx-esl .et { grid-column:1; font:500 .78em var(--sans); letter-spacing:.05em; text-transform:uppercase; color:var(--ink-3); align-self:start; padding-top:.15em }
.rx-esl .tx { grid-column:2; color:var(--ink-2) } .rx-esl .tx b { font:600 .95em var(--mono); background:var(--bg-2); border-radius:.35em; padding:.05em .4em; margin-right:.25em; color:var(--ink) }
.rx-esl .tg, .rx-esl .rs { grid-column:2; justify-self:start }
.rx-esl .rs { font:600 .88em var(--mono); color:#a3231f; background:#fde7e5; border-radius:.4em; padding:.05em .5em }
.rx-esl { animation:rx-in .4s var(--ease) both } .rx-esl:nth-child(2) { animation-delay:.12s } .rx-esl:nth-child(3) { animation-delay:.24s } .rx-esl:nth-child(4) { animation-delay:.36s } .rx-esl:nth-child(5) { animation-delay:.48s } .rx-esl:nth-child(6) { animation-delay:.6s }
.rx-mira { position:absolute; z-index:9; width:1.7em; height:1.7em; margin:-.85em 0 0 -.85em; border-radius:50%; border:2px solid #fff; box-shadow:0 0 0 2px #000, 0 .4em 1em rgba(0,0,0,.4); pointer-events:none; opacity:0; transition:opacity .2s, left .25s var(--ease), top .25s var(--ease); background:rgba(37,81,214,.25) }
.rx-mira.on { opacity:1 }
.rx-vista { cursor:crosshair }
.rx-capas { background:var(--bg); border:1px solid var(--line); border-radius:1em; padding:.4em .65em .55em; min-width:0 }
.rx-gp h5 { margin:.55em .1em .25em; font:500 .74em/1.2 var(--sans); letter-spacing:.07em; text-transform:uppercase; color:var(--ink-3); display:flex; flex-wrap:wrap; align-items:center; gap:.3em .6em } .rx-gp h5 .tg { text-transform:none; letter-spacing:0; font-size:1.05em }
.rx-capa-f { min-height:1.9em; padding:.12em .4em } .rx-capa-f .nm { font-size:.93em }
.rx-capas-lista { gap:.1em }
.rx-capas-lista .rx-capa-f { grid-template-columns:minmax(0, 1fr) auto }
.rx-cruce { margin-top:.85em; background:linear-gradient(180deg, #fbfaf8, #f4f2ee); border:1px solid var(--line); border-radius:1em; padding:.8em 1em; display:grid; grid-template-columns:auto 1fr; gap:.4em 1.2em; align-items:center; opacity:.35; transition:opacity .5s }
.rx-mesa.cruce-on .rx-cruce { opacity:1 }
.cr-t { font:500 .78em var(--sans); letter-spacing:.07em; text-transform:uppercase; color:var(--ink-3) }
.cr-f { display:flex; flex-wrap:wrap; align-items:stretch; gap:.5em .6em } .cr-f > i { font-style:normal; align-self:center; font-size:1.5em; font-weight:300; color:var(--ink-3) }
.cr-c { background:#fff; border:1px solid var(--line-2); border-radius:.8em; padding:.45em .8em; display:flex; flex-direction:column; gap:.2em; min-width:10em; flex:1 1 11em }
.cr-c .cr-e { font:500 .74em var(--sans); letter-spacing:.06em; text-transform:uppercase; color:var(--ink-3) } .cr-c b { font-weight:500; font-size:.95em; line-height:1.25 }
.cr-c .tg { align-self:flex-start }
.cr-r { background:#14161c; color:#fff; border-color:#14161c; flex:1.2 1 13em } .cr-r .cr-e { color:rgba(255,255,255,.55) } .cr-r b { font-size:1.08em; color:#ffe082 } .cr-r .cr-s { font:500 .9em var(--mono); color:#d7dbea }
.rx-anim .rx-mesa .cr-f > * { opacity:0 } .rx-anim .rx-mesa.cruce-on .cr-f > * { animation:rx-in .5s var(--ease) both }
.rx-anim .rx-mesa.cruce-on .cr-f > *:nth-child(1) { animation-delay:.1s } .rx-anim .rx-mesa.cruce-on .cr-f > *:nth-child(2) { animation-delay:.4s } .rx-anim .rx-mesa.cruce-on .cr-f > *:nth-child(3) { animation-delay:.7s }
.rx-anim .rx-mesa.cruce-on .cr-f > *:nth-child(4) { animation-delay:1s } .rx-anim .rx-mesa.cruce-on .cr-f > *:nth-child(5) { animation-delay:1.3s } .rx-anim .rx-mesa.cruce-on .cr-f > *:nth-child(6) { animation-delay:1.6s } .rx-anim .rx-mesa.cruce-on .cr-f > *:nth-child(7) { animation-delay:1.9s }
@media (max-width:760px) { .rx-cruce { grid-template-columns:1fr } .cr-f > i { display:none } .rx-panel { min-height:0 } .rx-mira { display:none } }

/* ═══ HERO (titular de resultado + ficha), tira de 4 pasos ═══ */
.rx-hero { padding:36px 0 44px }
.rx-hero-grid { display:grid; grid-template-columns:minmax(0, .82fr) minmax(0, 1.18fr); gap:56px; align-items:center }
.rx-hero-txt h1 { font-size:clamp(38px, 3.7vw, 58px); max-width:10.5em }
.rx-hero-txt .hero-lede { margin-top:22px; font-size:21px; max-width:19em }
.rx-hero-txt .hero-cta { margin-top:34px }
.rx-tira { border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:#fbfaf8 }
.rx-pasos4 { list-style:none; margin:0; padding:26px 0; display:grid; grid-template-columns:repeat(4, 1fr) }
.rx-pasos4 li { position:relative; display:flex; align-items:center; gap:16px; padding:6px 22px }
.rx-pasos4 li + li::before { content:""; position:absolute; left:-14px; top:50%; width:28px; height:2px; margin-top:-1px; background:var(--line-2) }
.rx-pasos4 li + li::after { content:""; position:absolute; left:6px; top:50%; margin-top:-5px; border:solid transparent; border-width:5px 0 5px 7px; border-left-color:var(--line-2) }
.rx-pasos4 .ic { flex:none; width:68px; height:68px; border-radius:20px; background:#fff; box-shadow:0 0 0 1px var(--line); display:grid; place-items:center }
.rx-pasos4 .ic svg { width:46px; height:46px; overflow:visible }
.rx-pasos4 b { font-weight:450; font-size:clamp(18px, 1.5vw, 22px); line-height:1.2; letter-spacing:-.01em }
.rx-pasos4 .f { fill:#f4f2ed; stroke:#222; stroke-width:2 } .rx-pasos4 .s { fill:none; stroke:#222; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round } .rx-pasos4 .w { stroke:var(--blue) } .rx-pasos4 .b { fill:rgba(37,81,214,.12); stroke:var(--blue) }
.rx-lupa { animation:rx-lupa 4s ease-in-out infinite } @keyframes rx-lupa { 0%, 100% { transform:translate(0,0) } 50% { transform:translate(-14px,-8px) } }
.rx-barre { fill:var(--mark); opacity:.75; animation:rx-barre2 3s ease-in-out infinite } @keyframes rx-barre2 { 0%, 100% { transform:translateY(0) } 50% { transform:translateY(20px) } }
.rx-cruz { fill:var(--blue); opacity:.8; animation:rx-latido 2.4s ease-in-out infinite; transform-box:fill-box; transform-origin:center } @keyframes rx-latido { 0%, 100% { transform:scale(.8); opacity:.5 } 50% { transform:scale(1.08); opacity:.95 } }
.rx-campana { transform-origin:32px 12px; animation:rx-tañe 3s ease-in-out infinite } @keyframes rx-tañe { 0%, 60%, 100% { transform:rotate(0) } 66% { transform:rotate(14deg) } 72% { transform:rotate(-12deg) } 78% { transform:rotate(8deg) } 84% { transform:rotate(-4deg) } }
.rx-punto { fill:var(--rx-rojo); stroke:#fff; stroke-width:2; animation:rx-latido 1.6s ease-in-out infinite; transform-box:fill-box; transform-origin:center }

/* ═══ LOS TRES MOMENTOS: navega · lo ves · cruza ═══ */
.rx-mom { display:grid; grid-template-columns:repeat(12, 1fr); gap:14px }
.rx-m { background:#fff; border:1px solid var(--line); border-radius:var(--r-xl); padding:20px 22px 22px; display:flex; flex-direction:column; gap:14px; position:relative; overflow:hidden; min-width:0 }
.rx-m-a { grid-column:span 7 } .rx-m-b { grid-column:span 5 } .rx-m-c { grid-column:1 / -1 }
.rx-m-k { display:flex; align-items:center; gap:10px; font-size:18px; font-weight:450 } .rx-m-k b { flex:none; width:26px; height:26px; border-radius:50%; background:#000; color:#fff; display:grid; place-items:center; font-size:14px; font-weight:500 }
.rx-m-n { font-size:14.5px; color:var(--ink-3) }
.rx-nav { position:relative; border:1px solid var(--line-2); border-radius:14px; overflow:hidden; background:#fff; box-shadow:0 22px 44px -32px rgba(0,0,0,.45) }
.rx-nav-bar { display:flex; align-items:center; gap:6px; padding:9px 12px; background:#f1efea; border-bottom:1px solid var(--line) } .rx-nav-bar i { width:10px; height:10px; border-radius:50%; background:#d6d2ca }
.rx-nav-bar .url { flex:1; margin-left:10px; background:#fff; border-radius:999px; height:26px; position:relative; overflow:hidden; font:400 13px var(--mono); color:var(--ink-3) }
.rx-nav-bar .url span { position:absolute; left:14px; top:50%; transform:translateY(-50%); white-space:nowrap; opacity:0 } .rx-nav-bar .url .u3 { opacity:1 }
.rx-nav-cuerpo { display:grid; grid-template-columns:minmax(0, 1fr) minmax(0, 1.05fr); gap:18px; padding:16px; min-height:190px }
.rx-nav-busca { display:flex; align-items:center; gap:8px; border:1.5px solid var(--line-2); border-radius:10px; padding:8px 12px; font-size:15.5px } .rx-nav-busca svg { width:17px; height:17px; flex:none; stroke:#555; fill:none; stroke-width:2; stroke-linecap:round }
.rx-nav-busca .b1 { display:inline-block; overflow:hidden; white-space:nowrap }
.rx-nav-res span { display:block; height:13px; border-radius:4px; background:#ece9e2; margin-top:8px } .rx-nav-res .r2 { background:#cfdbf7 } .rx-nav-res .r3 { width:70% }
.rx-nav-btn { margin-top:14px; display:inline-flex; align-items:center; gap:8px; background:#000; color:#fff; border-radius:999px; padding:7px 14px; font-size:14.5px } .rx-nav-btn svg { width:15px; height:15px; stroke:#fff; fill:none; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round }
.rx-nav-mapa svg, .rx-vc-mapa svg { width:100%; height:100%; display:block; border-radius:8px; border:1px solid var(--line) }
/* cursores: la punta de la flecha está en (5, 3) del cursor de 24 px. Las posiciones --c0…--c3 las pone PoyntiaPlanos.cursores()
   con el centro REAL de cada objetivo; sin JS o con movimiento reducido el cursor se queda sobre el último objetivo. */
.rx-cursor { position:absolute; width:24px; height:24px; z-index:4; pointer-events:none; filter:drop-shadow(0 2px 3px rgba(0,0,0,.3)); transform-origin:5px 3px; left:calc(var(--c3x, 18%) - 5px); top:calc(var(--c3y, 70%) - 3px) }
.rx-clic { position:absolute; width:30px; height:30px; margin:-15px 0 0 -15px; border-radius:50%; border:2px solid var(--blue); opacity:0; z-index:3; pointer-events:none; left:var(--c3x, 18%); top:var(--c3y, 70%) }
.rx-paso-l { list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:8px 18px }
.rx-paso-l li { position:relative; padding-left:26px; font-size:16px; color:var(--ink-2) }
.rx-paso-l li::before { content:""; position:absolute; left:0; top:3px; width:17px; height:17px; border-radius:50%; border:2px solid var(--line-2) }
.rx-paso-l li::after { content:"✓"; position:absolute; left:0; top:1px; width:21px; height:21px; border-radius:50%; background:var(--rx-verde); color:#fff; font-size:13px; line-height:21px; text-align:center }
.rx-vc { position:relative; border:1px solid var(--line-2); border-radius:14px; padding:12px; background:#fbfaf8; display:flex; flex-direction:column; gap:10px }
.rx-vc-cab { display:flex; align-items:center; gap:10px; flex-wrap:wrap; font-size:14.5px } .vivo { display:inline-flex; align-items:center; gap:6px; background:#fde7e5; color:#a3231f; border-radius:999px; padding:2px 10px; font-weight:500; font-size:13px }
.vivo i { width:8px; height:8px; border-radius:50%; background:#d6322e; animation:rx-latido 1.4s ease-in-out infinite } .rx-vc-t { color:var(--ink-2) }
.rx-vc-mapa { position:relative; height:132px } .rx-vc-mapa svg { height:100% }
.rx-vc-chip { position:absolute; left:8px; bottom:8px; font:500 13px var(--mono); border-radius:999px; padding:4px 10px; background:#fff; box-shadow:0 0 0 1px var(--line-2) } .rx-vc-chip .c1, .rx-vc-chip .c2 { display:block } .rx-vc-chip .c1 { color:#7a5200 } .rx-vc-chip .c2 { display:none; color:#1a6a40 }
.rx-vc-bt { display:flex; gap:8px; flex-wrap:wrap } .bt { display:inline-flex; align-items:center; gap:7px; border:1px solid var(--line-2); border-radius:999px; background:#fff; padding:6px 14px; font-size:14.5px } .bt svg { width:14px; height:14px; stroke:currentColor; fill:none; stroke-width:2.4; stroke-linecap:round; stroke-linejoin:round } .bt.ok { background:#000; color:#fff; border-color:#000 }
.rx-cursor.c2 { left:calc(var(--c2x, 30%) - 5px); top:calc(var(--c2y, 87%) - 3px) } .rx-clic.c2 { left:var(--c2x, 30%); top:var(--c2y, 87%) }
.rx-up { display:grid; grid-template-columns:minmax(0, 1.1fr) 110px minmax(0, 1fr); align-items:center; min-height:220px }
.rx-up-zona { position:relative; border:2px dashed var(--line-2); border-radius:16px; min-height:200px; padding:16px; display:flex; flex-direction:column; gap:14px; justify-content:center; background:#fbfaf8; color:var(--ink-2); font-size:16px }
.rx-up-zona .sube { width:30px; height:30px; stroke:#555; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round }
.rx-up-f { display:flex; flex-wrap:wrap; gap:8px } .rx-up-f span { display:inline-flex; align-items:center; gap:7px; background:#fff; border:1px solid var(--line-2); border-radius:9px; padding:6px 10px; font:500 13.5px var(--mono); box-shadow:0 8px 16px -12px rgba(0,0,0,.4) } .rx-up-f i { font-style:normal; font-size:11px; background:#000; color:#fff; border-radius:4px; padding:1px 5px }
.rx-up-hilos { width:100%; height:200px; overflow:visible } .rx-up-hilos path { fill:none; stroke:var(--blue); stroke-width:2.4; vector-effect:non-scaling-stroke }
.rx-up-plano { position:relative; justify-self:stretch; max-width:340px } .rx-up-plano svg { width:100%; height:auto; border-radius:12px; border:1px solid var(--line) }
.rx-up-m { position:absolute; background:#000; color:#fff; border-radius:9px; padding:4px 9px; font-size:13px; line-height:1.25; box-shadow:0 10px 20px -12px rgba(0,0,0,.6); display:flex; flex-direction:column } .rx-up-m b { font:600 13px var(--mono); color:#ffe082 }
.rx-up-m.m1 { left:-12%; top:14% } .rx-up-m.m2 { right:-6%; top:46% } .rx-up-m.m3 { left:-12%; bottom:6% }

/* ═══ QUÉ RECIBÍS: la ficha de una página ═══ */
.rx-hoja-w { margin-top:44px; display:flex; justify-content:center; background:linear-gradient(180deg, #efede8, #e7e4de); border-radius:var(--r-xl); padding:34px 22px }
.rx-hoja { width:min(100%, 1040px); background:#fff; border-radius:12px; box-shadow:0 40px 80px -40px rgba(0,0,0,.5), 0 0 0 1px rgba(0,0,0,.06) }
.rx-hoja-cab { display:flex; align-items:center; gap:10px 18px; flex-wrap:wrap; padding:16px 24px; border-bottom:2px solid #111 } .rx-hoja-cab b { font-size:20px; font-weight:500 } .rx-hoja-cab .mono { font:400 14px var(--mono); color:var(--ink-3) } .rx-hoja-cab .rx-pill-ej { margin-left:auto }
.rx-hoja-cuerpo { display:grid; grid-template-columns:minmax(0, .8fr) minmax(0, .9fr) minmax(0, 1.3fr); gap:22px; padding:22px 24px 26px; align-items:start }
.rx-hoja-plano svg { width:100%; height:auto; border:1px solid var(--line); border-radius:8px }
.rx-hoja-cifras { display:grid; grid-template-columns:1fr 1fr; gap:14px 12px }
.cf b { display:block; font-weight:300; font-size:clamp(30px, 2.8vw, 44px); line-height:1; letter-spacing:-.035em } .cf b i { font-style:normal; font-size:.46em; color:var(--ink-3); margin-left:.1em }
.cf span { display:block; margin-top:5px; font-size:15px; color:var(--ink-3) } .cf.g b { color:#1f7a4a } .cf.r b { color:#b3261e }
.rx-sem { list-style:none; margin:0; padding:0 } .rx-sem li { display:grid; grid-template-columns:16px minmax(0, 1fr) auto; gap:10px; align-items:center; padding:9px 0; border-bottom:1px solid var(--line); font-size:15.5px; line-height:1.3 } .rx-sem li:last-child { border-bottom:0 }
.rx-sem .l { width:14px; height:14px; border-radius:50%; box-shadow:0 0 0 3px rgba(0,0,0,.06) } .l.v { background:var(--rx-verde) } .l.a { background:#f0a41a } .l.r { background:var(--rx-rojo) }
.rx-anim .go .rx-sem li { animation:rx-in .5s var(--ease) both } .rx-anim .go .rx-sem li:nth-child(1) { animation-delay:.3s } .rx-anim .go .rx-sem li:nth-child(2) { animation-delay:.6s } .rx-anim .go .rx-sem li:nth-child(3) { animation-delay:.9s } .rx-anim .go .rx-sem li:nth-child(4) { animation-delay:1.2s } .rx-anim .go .rx-sem li:nth-child(5) { animation-delay:1.5s } .rx-anim .go .rx-sem li:nth-child(6) { animation-delay:1.8s }
.rx-anim .rx-sem li, .rx-anim .cf { opacity:0 } .rx-anim .go .cf { animation:rx-in .5s var(--ease) both } .rx-anim .go .cf:nth-child(1) { animation-delay:.2s } .rx-anim .go .cf:nth-child(2) { animation-delay:.45s } .rx-anim .go .cf:nth-child(3) { animation-delay:.7s } .rx-anim .go .cf:nth-child(4) { animation-delay:.95s }

/* ═══ PARA QUIÉN ═══ */
.rx-quien { display:grid; grid-template-columns:repeat(5, 1fr); gap:12px; margin-top:48px }
.rx-q { background:var(--card); border-radius:var(--r-l); padding:22px 20px 24px; display:flex; flex-direction:column; gap:12px; min-height:250px; transition:transform .3s var(--ease), background-color .3s }
.rx-q:hover { transform:translateY(-4px); background:#fff; box-shadow:0 0 0 1px var(--line-2) }
.rx-q svg { width:44px; height:44px; stroke:#222; fill:none; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round }
.rx-q .k { font-size:15px; color:var(--ink-3); min-height:2.6em } .rx-q p { margin-top:auto; font-weight:300; font-size:clamp(21px, 1.7vw, 26px); line-height:1.2; letter-spacing:-.015em }

/* animación de los tres momentos (sólo con movimiento) */
.rx-anim .go .rx-nav-bar .url .u1 { animation:rx-u1 9s linear infinite } .rx-anim .go .rx-nav-bar .url .u2 { animation:rx-u2 9s linear infinite } .rx-anim .go .rx-nav-bar .url .u3 { animation:rx-u3 9s linear infinite }
@keyframes rx-u1 { 0%, 29% { opacity:1 } 30%, 100% { opacity:0 } } @keyframes rx-u2 { 0%, 29% { opacity:0 } 30%, 60% { opacity:1 } 61%, 100% { opacity:0 } } @keyframes rx-u3 { 0%, 60% { opacity:0 } 61%, 95% { opacity:1 } 100% { opacity:0 } }
.rx-anim .go .rx-cursor:not(.c2) { animation:rx-cur 9s ease-in-out infinite } .rx-anim .go .rx-clic:not(.c2) { animation:rx-ond 9s linear infinite }
@keyframes rx-cur { 0% { left:calc(var(--c0x, 50%) - 5px); top:calc(var(--c0y, 50%) - 3px); transform:scale(1) } 6% { left:calc(var(--c1x, 50%) - 5px); top:calc(var(--c1y, 50%) - 3px); transform:scale(1) } 7% { left:calc(var(--c1x, 50%) - 5px); top:calc(var(--c1y, 50%) - 3px); transform:scale(.82) } 9%, 20% { left:calc(var(--c1x, 50%) - 5px); top:calc(var(--c1y, 50%) - 3px); transform:scale(1) }
  28% { left:calc(var(--c2x, 50%) - 5px); top:calc(var(--c2y, 50%) - 3px); transform:scale(1) } 29% { left:calc(var(--c2x, 50%) - 5px); top:calc(var(--c2y, 50%) - 3px); transform:scale(.82) } 31%, 44% { left:calc(var(--c2x, 50%) - 5px); top:calc(var(--c2y, 50%) - 3px); transform:scale(1) } 59% { left:calc(var(--c3x, 50%) - 5px); top:calc(var(--c3y, 50%) - 3px); transform:scale(1) } 60% { left:calc(var(--c3x, 50%) - 5px); top:calc(var(--c3y, 50%) - 3px); transform:scale(.82) } 62%, 66% { left:calc(var(--c3x, 50%) - 5px); top:calc(var(--c3y, 50%) - 3px); transform:scale(1) } 100% { left:calc(var(--c0x, 50%) - 5px); top:calc(var(--c0y, 50%) - 3px); transform:scale(1) } }
@keyframes rx-ond { 0%, 5.9% { left:var(--c1x, 50%); top:var(--c1y, 50%); opacity:0; transform:scale(.4) } 6% { left:var(--c1x, 50%); top:var(--c1y, 50%); opacity:.9; transform:scale(.5) } 10% { left:var(--c1x, 50%); top:var(--c1y, 50%); opacity:0; transform:scale(1.9) }
  27.9% { left:var(--c2x, 50%); top:var(--c2y, 50%); opacity:0; transform:scale(.4) } 28% { left:var(--c2x, 50%); top:var(--c2y, 50%); opacity:.9; transform:scale(.5) } 32% { left:var(--c2x, 50%); top:var(--c2y, 50%); opacity:0; transform:scale(1.9) }
  58.9% { left:var(--c3x, 50%); top:var(--c3y, 50%); opacity:0; transform:scale(.4) } 59% { left:var(--c3x, 50%); top:var(--c3y, 50%); opacity:.9; transform:scale(.5) } 63%, 100% { left:var(--c3x, 50%); top:var(--c3y, 50%); opacity:0; transform:scale(1.9) } }
.rx-anim .go .rx-nav-busca .b1 { animation:rx-teclea 9s steps(10, end) infinite } @keyframes rx-teclea { 0% { max-width:0 } 8% { max-width:0 } 20%, 94% { max-width:9em } 100% { max-width:0 } }
.rx-anim .go .rx-nav-res span { animation:rx-in2 9s linear infinite } @keyframes rx-in2 { 0%, 22% { opacity:0 } 26%, 94% { opacity:1 } 100% { opacity:0 } }
.rx-anim .go .rx-nav-btn { animation:rx-btn 9s linear infinite } @keyframes rx-btn { 0%, 59% { transform:scale(1); background:#000 } 60.5% { transform:scale(.93); background:#000 } 63% { transform:scale(1.04); background:#1a6a40 } 68%, 100% { transform:scale(1); background:#000 } }
.rx-anim .go .rx-nav-busca { animation:rx-foco 9s linear infinite } @keyframes rx-foco { 0%, 6% { border-color:var(--line-2); box-shadow:0 0 0 0 rgba(37,81,214,0) } 8%, 94% { border-color:var(--blue); box-shadow:0 0 0 3px rgba(37,81,214,.16) } 100% { border-color:var(--line-2); box-shadow:0 0 0 0 rgba(37,81,214,0) } }
.rx-anim .go .rx-nav-res .r2 { animation:rx-in2 9s linear infinite, rx-r2 9s linear infinite } @keyframes rx-r2 { 0%, 28% { background:#cfdbf7; transform:none } 29.5% { background:#8fa9ee; transform:scaleX(.98) } 32%, 100% { background:#cfdbf7; transform:none } }
.rx-anim .go .rx-paso-l li::after { opacity:0; animation:rx-ck 9s linear infinite } .rx-anim .go .rx-paso-l .p1::after { --a:12%; animation-name:rx-ck1 } .rx-anim .go .rx-paso-l .p2::after { animation-name:rx-ck2 } .rx-anim .go .rx-paso-l .p3::after { animation-name:rx-ck3 }
@keyframes rx-ck1 { 0%, 20% { opacity:0 } 22%, 94% { opacity:1 } 100% { opacity:0 } } @keyframes rx-ck2 { 0%, 31% { opacity:0 } 33%, 94% { opacity:1 } 100% { opacity:0 } } @keyframes rx-ck3 { 0%, 62% { opacity:0 } 64%, 94% { opacity:1 } 100% { opacity:0 } }
.rx-anim .go .rx-cursor.c2 { animation:rx-cur2 8s ease-in-out infinite } .rx-anim .go .rx-clic.c2 { animation:rx-ond2 8s linear infinite }
@keyframes rx-cur2 { 0% { left:calc(var(--c0x, 50%) - 5px); top:calc(var(--c0y, 50%) - 3px); transform:scale(1) } 14%, 36% { left:calc(var(--c1x, 50%) - 5px); top:calc(var(--c1y, 50%) - 3px); transform:scale(1) } 58% { left:calc(var(--c2x, 50%) - 5px); top:calc(var(--c2y, 50%) - 3px); transform:scale(1) } 59.5% { left:calc(var(--c2x, 50%) - 5px); top:calc(var(--c2y, 50%) - 3px); transform:scale(.82) } 62%, 72% { left:calc(var(--c2x, 50%) - 5px); top:calc(var(--c2y, 50%) - 3px); transform:scale(1) } 100% { left:calc(var(--c0x, 50%) - 5px); top:calc(var(--c0y, 50%) - 3px); transform:scale(1) } }
@keyframes rx-ond2 { 0%, 57.9% { opacity:0; transform:scale(.4) } 58% { opacity:.9; transform:scale(.5) } 63%, 100% { opacity:0; transform:scale(1.9) } }
.rx-anim .go .rx-vc-chip .c1 { animation:rx-c1 8s linear infinite } .rx-anim .go .rx-vc-chip .c2 { display:block; position:absolute; left:10px; top:4px; white-space:nowrap; animation:rx-c2 8s linear infinite }
@keyframes rx-c1 { 0%, 60% { opacity:1 } 61%, 95% { opacity:0 } 100% { opacity:1 } } @keyframes rx-c2 { 0%, 60% { opacity:0 } 62%, 94% { opacity:1 } 100% { opacity:0 } }
.rx-anim .go .rx-vc-bt .bt.ok { animation:rx-okb 8s linear infinite } @keyframes rx-okb { 0%, 58% { background:#000; transform:scale(1) } 59.5% { background:#000; transform:scale(.94) } 62%, 94% { background:#1a6a40; transform:scale(1) } 100% { background:#000; transform:scale(1) } }
.rx-anim .go .rx-vc-mapa .sel { animation:rx-sel 1.4s ease-in-out infinite } @keyframes rx-sel { 50% { stroke-opacity:.35 } }
.rx-anim .go .rx-up-f .f1 { animation:rx-cae 7s ease-out infinite } .rx-anim .go .rx-up-f .f2 { animation:rx-cae 7s ease-out .5s infinite } .rx-anim .go .rx-up-f .f3 { animation:rx-cae 7s ease-out 1s infinite }
@keyframes rx-cae { 0% { opacity:0; transform:translateY(-34px) } 10%, 92% { opacity:1; transform:none } 100% { opacity:0 } }
.rx-anim .go .rx-up-hilos .h1 { animation:rx-trz 7s ease infinite 1.4s } .rx-anim .go .rx-up-hilos .h2 { animation:rx-trz 7s ease infinite 1.9s } .rx-anim .go .rx-up-hilos .h3 { animation:rx-trz 7s ease infinite 2.4s }
@keyframes rx-trz { 0% { stroke-dashoffset:1; opacity:1 } 15%, 90% { stroke-dashoffset:0; opacity:1 } 100% { stroke-dashoffset:0; opacity:0 } }
.rx-anim .go .rx-up-m { animation:rx-pm 7s ease infinite } .rx-anim .go .rx-up-m.m1 { animation-delay:1.8s } .rx-anim .go .rx-up-m.m2 { animation-delay:2.3s } .rx-anim .go .rx-up-m.m3 { animation-delay:2.8s }
@keyframes rx-pm { 0% { opacity:0; transform:scale(.6) } 8%, 88% { opacity:1; transform:none } 100% { opacity:0 } }
.rx-anim .rx-up-m { opacity:0 } .rx-anim .rx-nav-res span { opacity:0 }

@media (max-width:1100px) { .rx-hero-grid { grid-template-columns:1fr; gap:34px } .rx-hero-txt h1 { max-width:14em } .rx-quien { grid-template-columns:repeat(3, 1fr) } .rx-hoja-cuerpo { grid-template-columns:1fr 1fr } .rx-sem { grid-column:1 / -1 } }
@media (max-width:980px) { .rx-pasos4 { grid-template-columns:1fr 1fr; row-gap:10px } .rx-pasos4 li:nth-child(odd)::before, .rx-pasos4 li:nth-child(odd)::after { display:none } .rx-m-a, .rx-m-b { grid-column:1 / -1 } .rx-up { grid-template-columns:1fr; gap:14px } .rx-up-hilos { display:none } .rx-up-plano { max-width:none } .rx-up-m.m1 { left:2% } .rx-up-m.m3 { left:2% } .rx-up-m.m2 { right:2% } }
@media (max-width:640px) { .rx-pasos4 { grid-template-columns:1fr; padding:14px 0 } .rx-pasos4 li { padding:6px 4px } .rx-pasos4 li + li::before, .rx-pasos4 li + li::after { display:none } .rx-quien { grid-template-columns:1fr } .rx-q { min-height:0 } .rx-hoja-cuerpo { grid-template-columns:1fr; padding:16px } .rx-hoja-w { padding:16px 10px } .rx-hoja-cab { padding:14px 16px } .rx-nav-cuerpo { grid-template-columns:1fr; min-height:0 } .rx-nav-mapa { display:none } .rx-m { padding:16px } .rx-hero-txt h1 { font-size:42px } }

/* re-maquetación: columna A = mapa + capas; B = leyenda; C = inspector + cruce */
.rx-colA { display:flex; flex-direction:column; gap:.85em; min-width:0 }
.rx-ley { align-self:stretch } .rx-ley-n { margin:auto .3em .3em; padding-top:.7em; font-size:.88em; line-height:1.35; color:var(--ink-3) }
.rx-der { gap:.85em } .rx-der .rx-cruce { margin-top:0; grid-template-columns:1fr; padding:.65em .8em }
.rx-der .cr-f { flex-direction:column; align-items:stretch; gap:.3em } .rx-der .cr-f > i { align-self:center; font-size:1.1em; line-height:1 } .rx-der .cr-c { min-width:0; flex:none; padding:.3em .7em; flex-direction:row; flex-wrap:wrap; align-items:center; gap:.15em .6em }
.rx-der .cr-c .cr-e { min-width:5.5em } .rx-der .cr-c b { flex:1 1 10em } .rx-der .cr-r { flex-direction:column; align-items:flex-start }
.rx-panel { min-height:19em }
.rx-capas-lista { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:.2em .8em; align-items:start }
.rx-capas-lista .rx-capa-f { padding:.1em .3em } .rx-capas-lista .nm { font-size:.88em; line-height:1.2 }
.rx-capas { padding:.3em .7em .5em }
.ePob { stroke-dasharray:none !important; stroke-opacity:.35 !important }
@media (max-width:1180px) { .rx-colA { grid-column:1 } .rx-der { grid-column:1 / -1; display:grid; grid-template-columns:1fr 1fr; align-items:start } }
@media (max-width:760px) { .rx-capas-lista { grid-template-columns:1fr } .rx-der { display:flex; flex-direction:column } }

.rx-hoja-ins { grid-column:1 / -1; display:flex; flex-wrap:wrap; gap:6px; margin-top:4px }
.rx-hoja-cifras .rx-hoja-ins { margin-top:10px }
.rx-t1 svg .rxf-t { font-size:15px }

@media (max-width:760px) {
  .rx-paso { display:none } .rx-paso.on { display:inline-flex } .rx-pasos { margin-inline:0 }
  .rx-cuerpo { display:flex; flex-direction:column } .rx-colA { display:contents }
  .rx-vista { order:1 } .rx-der { order:2 } .rx-capas { order:3 } .rx-ley { order:4 }
}

/* ═══ v3 (3-oct noche): hero con precio, ficha urbanística + ficha de comité, precio en directo ═══ */
/* hero: el nombre del producto, la ficha con techo real y precio máximo */
.rx-prod { font-size:22px; font-weight:500; color:var(--ink); letter-spacing:-.01em; margin-bottom:16px }
.rx-hero-txt h1 { max-width:11em }
.rx-ficha-cab .rx-pill-ej { margin-left:auto }
.rx-ficha-lado { padding:14px 26px 14px; gap:10px 20px }
.rx-stat > small { display:block; margin-top:3px; font-size:15px; line-height:1.3; color:var(--ink-3) } .rx-stat > small s { text-decoration-thickness:1.5px; text-decoration-color:#b3261e }
.rx-stat.is-pay b { color:#1a3fb0 } .rx-stat b .pre { font-style:normal; font-size:.5em; margin:0 .1em 0 0; letter-spacing:0; color:inherit }
.rx-stat b span + i { margin-left:.1em }
.rxf-huella { fill:rgba(46,158,98,.4); stroke:#1f7a4a; stroke-width:1.8 }
.rx-ficha-pie { padding:11px 24px 14px }
/* tira de 4 pasos: verbo y media línea */
.rx-pasos4 .tx { display:flex; flex-direction:column; gap:3px; min-width:0 } .rx-pasos4 small { font-size:15px; line-height:1.25; color:var(--ink-3) }
/* insignias nuevas */
.tg.calc { background:#e3e8f0; color:#2f3d5c } .tg.fic { background:#efede8; color:#6a665f }
/* inspector: parámetros con su artículo y página, alertas */
.rx-pl { display:flex; flex-direction:column; gap:.18em } .rx-pl > span { display:grid; grid-template-columns:minmax(0, 7.2em) minmax(0, 1fr) auto; gap:.1em .5em; align-items:baseline }
.rx-pl em { font-style:normal; color:var(--ink-3) } .rx-pl strong { font-weight:600; color:var(--ink) } .rx-pl i { font:500 .82em var(--mono); font-style:normal; color:var(--ink-3); white-space:nowrap }
.rx-chk { display:block; margin-top:.15em; font-size:.92em; color:var(--ink-3) } .rx-chk::before { content:"→ " }
.rx-esl.cont::before, .rx-esl.cont::after { display:none } .rx-esl.cont { padding-top:.15em }
.aElec { fill:#f0a41a; stroke:#fff; stroke-width:2 } .aElecL { stroke:#f0a41a; stroke-width:2.4; stroke-dasharray:5 4; fill:none }
.rx-capa .pet2 rect { fill:#fff; stroke:#f0a41a; stroke-width:1.6 } .rx-capa .pet2 text { font:600 12px var(--mono); fill:#6b4600; text-anchor:middle; dominant-baseline:central }

/* las dos hojas */
.rx-hojas { margin-top:36px; display:grid; grid-template-columns:minmax(0, 1.06fr) minmax(0, 1fr); gap:22px; align-items:start; background:linear-gradient(180deg, #efede8, #e7e4de); border-radius:var(--r-xl); padding:30px 26px }
.rx-hojas-b { display:flex; flex-direction:column; gap:22px; min-width:0 }
.rx-pg { background:#fff; border-radius:12px; box-shadow:0 40px 80px -40px rgba(0,0,0,.5), 0 0 0 1px rgba(0,0,0,.06); min-width:0 }
.rx-pg-cab { display:flex; align-items:center; gap:8px 16px; flex-wrap:wrap; padding:15px 22px; border-bottom:2px solid #111 }
.rx-pg-cab b { font-size:20px; font-weight:500; letter-spacing:-.01em } .rx-pg-cab .mono { font:400 14px var(--mono); color:var(--ink-3) } .rx-pg-cab .n { margin-left:auto; font:500 14px var(--mono); color:var(--ink-3) }
.rx-bl { padding:15px 22px 17px } .rx-bl + .rx-bl { border-top:1px solid var(--line) }
.rx-bl h4 { display:flex; align-items:center; gap:10px; margin:0 0 10px; font:500 14px var(--sans); letter-spacing:.07em; text-transform:uppercase; color:var(--ink-3) } .rx-bl h4 .tg { letter-spacing:0; text-transform:none; margin-left:auto; font-size:14px }
.rx-id-g { display:grid; grid-template-columns:minmax(150px, 36%) minmax(0, 1fr); gap:20px; align-items:start }
.rx-id-map { width:100%; height:auto; display:block; border:1px solid var(--line); border-radius:8px }
.rx-ph { font:400 14px var(--mono); letter-spacing:.05em; color:#a3a09a; overflow-wrap:anywhere }
.rx-tb { width:100%; border-collapse:collapse; font-size:15.5px; line-height:1.3 }
.rx-tb th { text-align:left; font:500 14px var(--sans); color:var(--ink-3); padding:0 8px 6px 0; border-bottom:1px solid var(--line-2) } .rx-tb th.r, .rx-tb td.r { text-align:right }
.rx-tb td { padding:7px 8px 7px 0; border-bottom:1px solid var(--line); vertical-align:top } .rx-tb tr:last-child td { border-bottom:0 }
.rx-tb td.k { color:var(--ink-2); width:31% } .rx-tb td.v { font-weight:500; color:var(--ink) } .rx-tb td.s { font:400 14px var(--mono); color:var(--ink-3); white-space:nowrap; text-align:right; padding-right:0 }
.rx-tb tr.tot td { font-weight:600; border-top:2px solid #111; border-bottom:0 } .rx-tb td.cc { font-variant-numeric:tabular-nums }
.rx-nt { margin:8px 0 0; font-size:14.5px; line-height:1.4; color:var(--ink-3) }
.rx-rat { display:flex; align-items:center; flex-wrap:wrap; gap:8px 12px; margin:0 0 12px; font-size:15.5px; color:var(--ink-2) }
.rx-rat input { width:4.6em; font:500 17px var(--sans); padding:6px 8px; border:1px solid var(--line-2); border-radius:10px; background:#fff; color:var(--ink); text-align:right } .rx-rat input:focus-visible, .rx-fld input:focus-visible { outline:2px solid var(--blue); outline-offset:1px }
.rx-rat .tg { font-size:14px }
.rx-vp { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:10px } .rx-vp > div { background:var(--card); border-radius:12px; padding:11px 13px }
.rx-vp b { display:block; font-weight:300; font-size:30px; line-height:1; letter-spacing:-.03em; font-variant-numeric:tabular-nums } .rx-vp b s { font-size:.56em; color:var(--ink-4); margin-right:.25em; text-decoration-color:#b3261e } .rx-vp b i { font-style:normal; font-size:.5em; color:var(--ink-3); margin-left:.15em }
.rx-vp small { display:block; margin-top:6px; font-size:14.5px; line-height:1.3; color:var(--ink-3) }
.rx-vp-q { margin:10px 0 0; display:flex; flex-wrap:wrap; align-items:center; gap:6px 10px; font-size:15.5px; color:var(--ink-2) }
/* página 2: propuesta, semáforo, gestión */
.rx-prop-n { display:flex; flex-wrap:wrap; align-items:flex-end; gap:6px 30px } .rx-prop-n > div b { display:block; font-weight:300; font-size:clamp(40px, 3.6vw, 54px); line-height:.95; letter-spacing:-.04em; color:#1a3fb0; font-variant-numeric:tabular-nums } .rx-prop-n > div.ak b { color:var(--ink-2) }
.rx-prop-n > div span { display:block; margin-top:5px; font-size:15px; color:var(--ink-3) }
.rx-esc { position:relative; height:84px; margin:10px 6px 4px } .rx-esc .eje { position:absolute; left:0; right:0; top:34px; height:12px; border-radius:6px; background:#ecebe7 }
.rx-esc .m12 { position:absolute; left:0; top:34px; height:12px; border-radius:6px 0 0 6px; background:#2551d6; transition:width .4s var(--ease) } .rx-esc .m0 { position:absolute; top:34px; height:12px; background:repeating-linear-gradient(135deg, #2551d6 0 3px, #a9bcf0 3px 6px); transition:left .4s var(--ease), width .4s var(--ease) }
.rx-esc .mk { position:absolute; width:2px; transition:left .4s var(--ease) } .rx-esc .mk span { position:absolute; white-space:nowrap; font:500 14px var(--sans) }
.rx-esc .mk.ask { top:20px; height:40px; background:#3a3f4d; margin-left:-1px } .rx-esc .mk.ask span { bottom:100%; right:-2px; color:var(--ink-2); padding-bottom:2px }
.rx-esc .mk.fic { top:46px; height:20px; background:#8d8a83; margin-left:-1px } .rx-esc .mk.fic span { top:100%; right:-2px; color:var(--ink-3); padding-top:1px }
.rx-esc .tk b { position:absolute; top:46px; transform:translateX(-50%); font:500 13px var(--mono); color:var(--ink-4); padding-top:1px } .rx-esc .tk b:nth-child(1) { transform:none }
.rx-prop-fr { margin:8px 0 0; font-size:15.5px; line-height:1.4; color:var(--ink-2) } .rx-prop-fr b { font-weight:500; color:var(--ink) }
.rx-al { list-style:none; margin:0; padding:0 } .rx-al li { display:grid; grid-template-columns:16px minmax(0, 1fr); gap:3px 12px; padding:10px 0; border-bottom:1px solid var(--line) } .rx-al li:last-child { border-bottom:0; padding-bottom:0 } .rx-al li:first-child { padding-top:2px }
.rx-al .l { width:8px; height:8px; border-radius:50%; margin:8px 0 0 3px; background:var(--ink-3) }
.rx-al .t { display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 10px; font-size:15.5px; line-height:1.3 } .rx-al .t b { font-weight:500 } .rx-al .t .tg { font-size:14px }
.rx-al .d { grid-column:2; font-size:14.5px; line-height:1.4; color:var(--ink-3) } .rx-al .d em { font-style:normal; color:var(--ink-2) }
.rx-gest { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(5, minmax(0, 1fr)) }
.rx-gest li { position:relative; padding:26px 8px 0 0; font-size:14.5px; line-height:1.3 } .rx-gest li::before { content:""; position:absolute; left:0; top:4px; width:14px; height:14px; border-radius:50%; background:#fff; box-shadow:0 0 0 2px var(--line-2); z-index:1 }
.rx-gest li::after { content:""; position:absolute; left:14px; right:0; top:10px; height:2px; background:var(--line-2) } .rx-gest li:last-child::after { display:none }
.rx-gest li.ok::before { background:var(--ink-2); box-shadow:0 0 0 2px var(--ink-2) } .rx-gest li.ok::after { background:var(--ink-2) } .rx-gest li.en::before { background:#fff; box-shadow:0 0 0 2px var(--ink-2) }
.rx-gest b { display:block; font-weight:500; font-size:15px } .rx-gest span { display:block; color:var(--ink-3) } .rx-gest i { display:block; font:400 13px var(--mono); font-style:normal; color:var(--ink-4); margin-top:2px }
/* el precio en directo */
.rx-res { background:#fff; border-radius:16px; box-shadow:0 30px 60px -40px rgba(0,0,0,.45), 0 0 0 1px rgba(0,0,0,.06); padding:20px 22px 20px }
.rx-res-cab { display:flex; justify-content:space-between; align-items:flex-start; gap:8px 16px; flex-wrap:wrap } .rx-res-cab .eyebrow { margin-bottom:4px } .rx-res-cab h3 { margin:0; font-weight:400; font-size:clamp(22px, 1.9vw, 27px); line-height:1.15; letter-spacing:-.02em }
.rx-vivo { display:inline-flex; align-items:center; gap:7px; font-size:15px; color:#1a6a40; background:#dff3e6; border-radius:999px; padding:4px 12px } .rx-vivo i { width:8px; height:8px; border-radius:50%; background:#2e9e62; animation:rx-latido 1.6s ease-in-out infinite }
.rx-res-g { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:14px 20px; margin:16px 0 14px }
.rx-fld { display:flex; flex-direction:column; gap:5px; min-width:0 } .rx-fld .nm { display:flex; justify-content:space-between; align-items:baseline; gap:8px; font-size:15.5px; color:var(--ink-2) } .rx-fld .nm em { font-style:normal; font-size:14.5px; color:var(--ink-3) }
.rx-fld .row { display:flex; align-items:center; gap:10px } .rx-fld input[type=range] { flex:1; min-width:0; accent-color:#2551d6; height:28px; margin:0 }
.rx-fld input[type=number] { width:5.7em; font:500 17px var(--sans); padding:6px 8px; border:1px solid var(--line-2); border-radius:10px; text-align:right; background:#fff; color:var(--ink) }
.rx-bajo { font-size:14.5px; color:var(--ink-3) }
.rx-res-cifras { display:flex; flex-wrap:wrap; align-items:flex-end; gap:6px 32px; padding:14px 0 4px; border-top:1px solid var(--line) } .rx-res-cifras b { display:block; font-weight:300; font-size:clamp(40px, 3.6vw, 54px); line-height:.95; letter-spacing:-.04em; font-variant-numeric:tabular-nums }
.rx-res-cifras .mx b { color:#1a3fb0 } .rx-res-cifras .mx b.cero { color:var(--ink-4) } .rx-res-cifras .ak b { color:var(--ink-2) } .rx-res-cifras div > span { display:block; margin-top:5px; font-size:15px; color:var(--ink-3) } .rx-res-cifras div > span span { display:inline; margin:0 }
.rx-res-fr { margin:8px 0 12px; font-size:16px; line-height:1.4; color:var(--ink) }
.rx-bar-f { margin-top:8px } .rx-bar-f .et { display:flex; justify-content:space-between; align-items:baseline; gap:8px; margin-bottom:5px; font-size:15px } .rx-bar-f .et b { font-weight:500 } .rx-bar-f .et em { font-style:normal; font-weight:500; color:var(--ink-2) }
.rx-bar { display:flex; height:38px; border-radius:10px; overflow:hidden; background:#ecebe7; box-shadow:inset 0 0 0 1px rgba(0,0,0,.05) } .rx-bar i { display:block; height:100%; min-width:0; transition:flex-basis .35s var(--ease) }
.rx-bar i.c1, .rx-leg i.c1 { background:#7d818c } .rx-bar i.c2, .rx-leg i.c2 { background:#c3c6ce } .rx-bar i.c3, .rx-leg i.c3 { background:#c98a6b } .rx-bar i.c4, .rx-leg i.c4 { background:#2551d6 } .rx-bar i.c5, .rx-leg i.c5 { background:#f0a41a } .rx-bar i.c6, .rx-leg i.c6 { background:#2e9e62 } .rx-bar i.neg { background:#7d818c }
.rx-leg { display:flex; flex-wrap:wrap; gap:6px 16px; margin-top:10px; font-size:14.5px; color:var(--ink-2) } .rx-leg i { display:inline-block; width:12px; height:12px; border-radius:3px; margin-right:6px; vertical-align:-1px }
.rx-res-ficha { margin:12px 0 0; font-size:15.5px; color:var(--ink-2) } .rx-res-fijo { margin:6px 0 0; font-size:14.5px; line-height:1.4; color:var(--ink-3) }
.rx-res-pie { display:flex; flex-wrap:wrap; align-items:center; gap:8px 10px; margin-top:14px; padding-top:12px; border-top:1px solid var(--line) } .rx-res-nota { font-size:15px; font-weight:500; color:#7a5200; background:#fff3d1; border-radius:999px; padding:5px 13px }
.rx-res-rst { margin-left:auto; font:500 15px var(--sans); color:var(--ink-2); background:#fff; border:1px solid var(--line-2); border-radius:999px; padding:6px 14px; cursor:pointer } .rx-res-rst:hover { background:var(--card) } .rx-res-rst:focus-visible { outline:2px solid var(--blue); outline-offset:2px }
/* entrada animada de los bloques de las hojas (sólo con movimiento) */
.rx-anim .rx-hojas .rx-bl { opacity:0 } .rx-anim .rx-hojas.go .rx-bl { animation:rx-in .55s var(--ease) both } .rx-anim .rx-hojas.go .rx-bl:nth-of-type(2) { animation-delay:.12s } .rx-anim .rx-hojas.go .rx-bl:nth-of-type(3) { animation-delay:.24s } .rx-anim .rx-hojas.go .rx-bl:nth-of-type(4) { animation-delay:.36s } .rx-anim .rx-hojas.go .rx-bl:nth-of-type(5) { animation-delay:.48s }
@media (prefers-reduced-motion: reduce) { .rx-bar i, .rx-esc .m12, .rx-esc .m0, .rx-esc .mk { transition:none } .rx-vivo i { animation:none } }
@media (max-width:1180px) { .rx-hojas { grid-template-columns:1fr } }
@media (max-width:760px) { .rx-hojas { padding:14px 10px; gap:14px } .rx-id-g { grid-template-columns:1fr } .rx-id-map { max-width:260px } .rx-res-g { grid-template-columns:1fr } .rx-vp { grid-template-columns:1fr 1fr } .rx-gest { grid-template-columns:1fr } .rx-gest li { padding:0 0 14px 28px } .rx-gest li::before { top:2px } .rx-gest li::after { left:6px; right:auto; top:18px; bottom:-2px; width:2px; height:auto } .rx-pl > span { grid-template-columns:1fr } }
@media (max-width:640px) { .rx-bl { padding:14px 14px 16px } .rx-pg-cab { padding:14px 14px } .rx-res { padding:16px 14px } .rx-tb td.k { width:auto } .rx-tb td.s { white-space:normal } .rx-pasos4 small { display:none } }

/* v3: el cruce, como franja a todo lo ancho bajo las tres columnas */
.rx-cuerpo > .rx-cruce { grid-column:1 / -1; margin-top:0; padding:.7em 1em }
.rx-pl > span { grid-template-columns:minmax(0, 7.4em) minmax(0, 1fr) }
@media (max-width:1180px) { .rx-der { grid-template-columns:1fr } }
@media (max-width:760px) { .rx-cruce { order:3 } .rx-capas { order:4 } .rx-ley { order:5 } }

/* v3: afinados de la auditoría de solapes */
.rx-stat > span { margin-top:10px }
@media (max-width:640px) { .rx-ficha-dib svg .m-no { display:none } }
.rx-ring b small { margin-top:9px }
.rx-esl { grid-template-columns:6.4em minmax(0, 1fr) } .rx-esl .et { overflow-wrap:anywhere }
/* v3: tablas de las hojas en móvil: etiqueta | valor y la fuente debajo, en una línea */
@media (max-width:640px) {
  .rx-tb:not(.rx-tb-n), .rx-tb:not(.rx-tb-n) tbody { display:block }
  .rx-tb:not(.rx-tb-n) thead { display:none }
  .rx-tb:not(.rx-tb-n) tr { display:grid; grid-template-columns:minmax(0, 36%) minmax(0, 1fr); gap:2px 12px; padding:8px 0; border-bottom:1px solid var(--line) }
  .rx-tb:not(.rx-tb-n) tr:last-child { border-bottom:0 }
  .rx-tb:not(.rx-tb-n) td { display:block; padding:0; border:0 }
  .rx-tb:not(.rx-tb-n) td.s { grid-column:2; text-align:left; white-space:nowrap; font-size:13.5px }
  .rx-tb-n td, .rx-tb-n th { padding-right:6px }
}
.rx-pg-pie { margin:0; padding:13px 22px 16px; border-top:1px solid var(--line); font-size:14.5px; line-height:1.4; color:var(--ink-3) }

/* ═══ 4-oct (tarde): tono descriptivo y ajustes ═══ */
/* el rótulo del tercer dato del hero ocupa dos líneas: se recupera la altura en el dibujo (viewBox) y en los márgenes para que la ficha siga cabiendo en 840 */
@media (min-width:641px) { .rx-ficha-lado { padding:10px 26px 8px } .rx-ficha-pie { padding:8px 24px 10px } }
/* lo tachado es lo que dice la ficha, sin rojo que lo juzgue */
.rx-stat > small s, .rx-vp b s { text-decoration-color:var(--ink-4) }
/* los dos avisos del pie de «Vuestros números» se parten en pantallas estrechas */
.rx-res-pie .rx-norma { white-space:normal; max-width:100% }