/* tokens.css · Creators Latam y Martín Velasco · sistema visual canónico v1 · 29-sep-2026
   Fuente única: 02-estrategia/SISTEMA.md (manda sobre 06-referencias/investigacion/*). Pareja: tokens.json (DTCG).
   Claro en :root y [data-theme="light"]; oscuro en [data-theme="dark"]; escenario LED: [data-theme="dark"][data-escenario].
   La web NO sigue el modo oscuro del teléfono: la landing declara <meta name="color-scheme" content="light">.
   Dentro de una pieza oscura, la pantalla del teléfono vuelve a claro con data-theme="light". */

/* CL Sans: la Helvetica Neue del equipo si existe; si no, TeX Gyre Heros autoalojada (licencia GUST).
   Pendiente: convertir los OTF de GUST a WOFF2 en fonts/ (sin recortar caracteres) y guardar la licencia al lado. */
@font-face{font-family:"CL Sans";font-weight:400;font-style:normal;font-display:swap;
  src:local("Helvetica Neue"),local("HelveticaNeue"),url("/fonts/texgyreheros-regular.woff2") format("woff2")}
@font-face{font-family:"CL Sans";font-weight:700;font-style:normal;font-display:swap;
  src:local("Helvetica Neue Bold"),local("HelveticaNeue-Bold"),url("/fonts/texgyreheros-bold.woff2") format("woff2")}

:root{
  /* Paleta con nombre. Las piezas usan los roles de abajo, no estos valores. */
  --blanco:#FFFFFF; --papel:#F6F7F8; --linea:#E5E7EB; --apagado:#8A919C;
  --pizarra:#5F6672; --tinta:#1D1D1F; --encendido:#007AFF; --encendido-suave:#F2F8FF;
  --error:#D70015;                        /* solo errores de formulario en la web */

  /* Letra: dos pesos, una escala */
  --fuente:"CL Sans", Arial, sans-serif;
  --regular:400; --bold:700;
  --t-12:12px; --t-15:15px; --t-17:17px; --t-19:19px; --t-24:24px; --t-30:30px;
  --t-42:42px; --t-58:58px; --t-80:80px; --t-112:112px; --t-160:160px;

  /* Tracking por tamaño VISIBLE (web y lámina: tal cual; redes: a un tercio; A4: pt × 1,7; entre dos pasos, el menor) */
  --trk-17:0; --trk-19:-.01em; --trk-24:-.015em; --trk-30:-.02em; --trk-42:-.028em;
  --trk-58:-.035em; --trk-80:-.04em; --trk-112:-.045em; --trk-160:-.05em;
  --trk-eyebrow:.1em;

  /* Interlineado por papel */
  --lh-cifra:1; --lh-titular:1.03; /* con mayúscula con tilde bajo un descendente: 1.18 */ --lh-titulo-42:1.08; --lh-titulo-30:1.15; --lh-titulo-24:1.25;
  --lh-eyebrow:1.2; --lh-pieza:1.35; --lh-bajada:1.4; --lh-cuerpo:1.5;
  --medida:32em; --medida-bajada:40em;

  /* Web: papeles en escritorio (celular, en la media query de abajo) */
  --web-h1:var(--t-80); --web-h1-trk:var(--trk-80);
  --web-h2:var(--t-58); --web-h2-trk:var(--trk-58);
  --web-h3:var(--t-24); --web-h3-trk:var(--trk-24);
  --web-bajada:var(--t-24); --web-bajada-trk:var(--trk-24);
  --web-cifra:var(--t-58); --web-cifra-trk:var(--trk-58);
  --web-cuerpo:var(--t-17); --web-chico:var(--t-15); --web-eyebrow:var(--t-12); --web-pie:var(--t-12); --web-boton:var(--t-19);

  /* Espacio (sistema de 8) y retícula web */
  --s-4:4px; --s-8:8px; --s-12:12px; --s-16:16px; --s-24:24px; --s-32:32px;
  --s-48:48px; --s-64:64px; --s-80:80px; --s-96:96px; --s-128:128px; --s-160:160px;
  --contenedor:1200px; --margen-web:48px; --medianil:24px; --seccion:128px;
  --cabecera:64px; --boton-alto:52px; --tocable:44px;

  /* Forma (pantalla y lámina; en el lienzo de 1080: 16 / 32 / 40 y bordes de 2 px) */
  --r-campo:8px; --r-captura:12px; --r-tarjeta:16px; --r-pill:999px;
  --borde-ancho:1px; --borde-encendido:1.5px; --foco-ancho:2px;

  /* Interruptor, en unidades del ancho w de la cápsula (medidas de simbolo.svg) */
  --sw-alto:3.076; --sw-boton:.911; --sw-margen:.045; --sw-recorrido:2.076;
  --sw-separacion:.374; --sw-filas:1; --sw-min:12px; --sw-web:24px; --sw-web-hilera:16px;

  /* Íconos (Lucide, retícula de 24) */
  --icono-trazo:1.75; --icono-tam:1.17em;

  /* Movimiento en la web (en video: 6 · 9 · 8 · 14 · 15 · 21 · 24 fotogramas a 30 fps) */
  --mov-entrada:cubic-bezier(.05,.7,.1,1); --mov-estado:cubic-bezier(.4,0,0,1);
  --mov-salida:cubic-bezier(.3,0,.8,.15);  --mov-micro:cubic-bezier(.2,0,0,1);
  --dur-micro:150ms; --dur-fundido:200ms; --dur-salida:150ms; --dur-entrada:300ms; --dur-estado:300ms; --dur-dato:800ms;
}

@media (max-width:1023px){ :root{ --margen-web:40px; } }
@media (max-width:767px){
  :root{
    --web-h1:var(--t-42); --web-h1-trk:var(--trk-42);
    --web-h2:var(--t-30); --web-h2-trk:var(--trk-30);
    --web-h3:var(--t-19); --web-h3-trk:var(--trk-19);
    --web-bajada:var(--t-19); --web-bajada-trk:var(--trk-19);
    --web-cifra:var(--t-42); --web-cifra-trk:var(--trk-42);
    --margen-web:24px; --medianil:16px; --seccion:80px;
  }
}

:root,[data-theme="light"]{
  color-scheme:light;
  --fondo:var(--blanco);
  --superficie:var(--papel);              /* tarjetas, bandas, pantalla del teléfono */
  --elevado:var(--blanco);                /* burbujas, chips y campos dentro de una tarjeta */
  --texto:var(--tinta);
  --texto-2:var(--pizarra);               /* secundario, eyebrows y pies: cualquier tamaño */
  --texto-3:var(--apagado);               /* solo desde 24 px (o 19 px Bold) y sobre blanco */
  --borde:var(--linea);
  --borde-control:var(--apagado);         /* campos de formulario: 3,18:1 */
  --acento:var(--encendido);              /* relleno: botón, punto, barra, interruptor «ahora» */
  --acento-texto:var(--encendido);        /* solo desde 24 px o 19 px Bold */
  --acento-suave:var(--encendido-suave);  /* fondo del único elemento encendido */
  --sobre-acento:#FFFFFF;                 /* texto del botón: Bold desde 19 px */
  --control-apagado:var(--apagado);
  --control-hecho:var(--tinta);
  --telefono-marco:var(--tinta);
  --telefono-pantalla:var(--papel);
  --logo:var(--tinta);
  --logo-pie:var(--apagado);
  --trk-ajuste-titular:0; --trk-ajuste-texto:0;
  background:var(--fondo); color:var(--texto);
}

[data-theme="dark"]{
  color-scheme:dark;
  --fondo:var(--tinta);                   /* de noche, la tinta es el papel */
  --superficie:#2C2C2E;
  --elevado:#3A3A3C;
  --texto:var(--papel);
  --texto-2:#AEAEB2;
  --texto-3:var(--apagado);               /* el mismo valor que en claro */
  --borde:#3A3A3C;
  --borde-control:var(--apagado);
  --acento:#0A84FF;
  --acento-texto:#409CFF;
  --acento-suave:#1A2D43;                 /* #0A84FF al 16 % sobre la tinta */
  --sobre-acento:#FFFFFF;
  --control-apagado:var(--apagado);
  --control-hecho:var(--papel);
  --telefono-marco:#3A3A3C;               /* la pantalla sigue clara: el teléfono lleva data-theme="light" */
  --telefono-pantalla:var(--papel);
  --logo:var(--papel);
  --logo-pie:var(--apagado);
  --trk-ajuste-titular:.005em; --trk-ajuste-texto:.01em;  /* el claro sobre oscuro engorda */
  background:var(--fondo); color:var(--texto);
}
[data-theme="dark"][data-escenario]{ --fondo:#000000; background:var(--fondo); }

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:opacity var(--dur-fundido) linear!important}
}
/* Manual de marca 2026 · Creators Latam y Martín Velasco · estilo.css
   build.py carga ANTES 03-assets/tokens/tokens.css: de ahí salen la paleta (--blanco, --papel, --linea, --apagado,
   --pizarra, --tinta, --encendido, --encendido-suave), los roles que cambian con el tema (--fondo, --superficie,
   --elevado, --texto, --texto-2, --texto-3, --borde, --acento, --acento-texto, --acento-suave, --control-*,
   --telefono-*, --logo, --logo-pie), la escala, el tracking y las curvas.
   Aquí no se escribe ningún color: solo roles. Así el tema oscuro ([data-theme="dark"]) funciona sin tocar nada.
   Única excepción: las guías de retícula (azul translúcido) y el sello de duración de YouTube (interfaz ajena). */

*{margin:0;padding:0;box-sizing:border-box}
html,body{background:var(--linea);color:var(--texto);font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;font-kerning:normal;font-synthesis:none}
img{display:block}
b,strong{font-weight:700}

/* ───────────────────────── papeles por formato (SISTEMA §3.4 y §3.5)
   Las clases de texto (h1, h2, h3, p, .bajada, .eyebrow, .cifra, .pie, .chico) leen estas variables:
   un h2 es «el título» en cualquier formato, sea lámina (42), post (80), web (58) o A4 (20 pt).
   Tracking por tamaño VISIBLE: lienzos de redes ÷ 3, A4 × 1,7. */
.slide,.f-lamina{
  --pie:12px;--eyebrow:15px;--chico:12px;--cuerpo:15px;--bajada:19px;--tarjeta:19px;
  --titulo:42px;--portada:58px;--cifra:112px;--cifra-fila:58px;
  --boton:19px;--boton-h:48px;--boton-pad:24px;--chip-h:28px;--chip-pad:12px;
  --trk-bajada:var(--trk-19);--trk-tarjeta:var(--trk-19);--trk-titulo:var(--trk-42);--trk-portada:var(--trk-58);
  --trk-cifra:var(--trk-112);--trk-cifra-fila:var(--trk-58);
  --lh-titulo:var(--lh-titulo-42);--lh-portada:var(--lh-titular);--lh-texto:var(--lh-cuerpo);
  --gap:12px;--radio:16px;--radio-in:12px;--filete:1px;--filete-on:1.5px;--relleno:24px;--punto:8px}
.f-lienzo{   /* post, carrusel, anuncio de Meta, historia, reel, miniatura: lienzo de 1080 que se ve a un tercio */
  --pie:30px;--eyebrow:30px;--chico:30px;--cuerpo:42px;--bajada:58px;--tarjeta:42px;
  --titulo:80px;--portada:112px;--cifra:160px;--cifra-fila:112px;
  --boton:42px;--boton-h:96px;--boton-pad:48px;--chip-h:56px;--chip-pad:24px;
  --trk-bajada:var(--trk-19);--trk-tarjeta:0em;--trk-titulo:var(--trk-24);--trk-portada:var(--trk-30);
  --trk-cifra:var(--trk-42);--trk-cifra-fila:var(--trk-30);
  --lh-titulo:var(--lh-titular);--lh-portada:var(--lh-titular);--lh-texto:var(--lh-pieza);
  --gap:32px;--radio:40px;--radio-in:32px;--filete:2px;--filete-on:3px;--relleno:48px;--punto:20px}
.f-og{       /* imagen OG 1200 × 630 */
  --pie:19px;--eyebrow:19px;--chico:19px;--cuerpo:30px;--bajada:30px;--tarjeta:30px;
  --titulo:80px;--portada:80px;--cifra:112px;--cifra-fila:80px;
  --boton:30px;--boton-h:72px;--boton-pad:32px;--chip-h:40px;--chip-pad:16px;
  --trk-bajada:0em;--trk-tarjeta:0em;--trk-titulo:var(--trk-24);--trk-portada:var(--trk-24);
  --trk-cifra:var(--trk-42);--trk-cifra-fila:var(--trk-24);
  --lh-titulo:var(--lh-titular);--lh-portada:var(--lh-titular);--lh-texto:var(--lh-pieza);
  --gap:24px;--radio:32px;--radio-in:24px;--filete:2px;--filete-on:3px;--relleno:40px;--punto:16px}
.f-banner{   /* banners de LinkedIn (1584 × 396 y 1512 × 256) */
  --pie:19px;--eyebrow:19px;--chico:19px;--cuerpo:24px;--bajada:24px;--tarjeta:24px;
  --titulo:42px;--portada:42px;--cifra:58px;--cifra-fila:42px;
  --boton:24px;--boton-h:56px;--boton-pad:24px;--chip-h:36px;--chip-pad:16px;
  --trk-bajada:0em;--trk-tarjeta:0em;--trk-titulo:0em;--trk-portada:0em;--trk-cifra:var(--trk-19);--trk-cifra-fila:0em;
  --lh-titulo:var(--lh-titulo-42);--lh-portada:var(--lh-titulo-42);--lh-texto:var(--lh-pieza);
  --gap:16px;--radio:24px;--radio-in:16px;--filete:2px;--filete-on:3px;--relleno:32px;--punto:12px}
.f-web{      /* web de escritorio (contenedor 1200) */
  --pie:12px;--eyebrow:12px;--chico:15px;--cuerpo:17px;--bajada:24px;--tarjeta:24px;
  --titulo:58px;--portada:80px;--cifra:58px;--cifra-fila:58px;
  --boton:19px;--boton-h:52px;--boton-pad:24px;--chip-h:28px;--chip-pad:12px;
  --trk-bajada:var(--trk-24);--trk-tarjeta:var(--trk-24);--trk-titulo:var(--trk-58);--trk-portada:var(--trk-80);
  --trk-cifra:var(--trk-58);--trk-cifra-fila:var(--trk-58);
  --lh-titulo:var(--lh-titular);--lh-portada:var(--lh-titular);--lh-texto:var(--lh-cuerpo);
  --gap:24px;--radio:16px;--radio-in:12px;--filete:1px;--filete-on:1.5px;--relleno:24px;--punto:8px}
.f-cel{      /* web en celular (390 de ancho) */
  --pie:12px;--eyebrow:12px;--chico:15px;--cuerpo:17px;--bajada:19px;--tarjeta:19px;
  --titulo:30px;--portada:42px;--cifra:42px;--cifra-fila:42px;
  --boton:19px;--boton-h:52px;--boton-pad:24px;--chip-h:28px;--chip-pad:12px;
  --trk-bajada:var(--trk-19);--trk-tarjeta:var(--trk-19);--trk-titulo:var(--trk-30);--trk-portada:var(--trk-42);
  --trk-cifra:var(--trk-42);--trk-cifra-fila:var(--trk-42);
  --lh-titulo:var(--lh-titulo-30);--lh-portada:var(--lh-titulo-42);--lh-texto:var(--lh-cuerpo);
  --gap:16px;--radio:16px;--radio-in:12px;--filete:1px;--filete-on:1.5px;--relleno:24px;--punto:8px}
.f-a4{       /* A4 en pt: 7 · 9 · 10 · 12 · 14 · 20 · 28 · 36 · 48 */
  --pie:7pt;--eyebrow:7pt;--chico:9pt;--cuerpo:10pt;--bajada:12pt;--tarjeta:12pt;
  --titulo:20pt;--portada:36pt;--cifra:48pt;--cifra-fila:28pt;
  --boton:10pt;--boton-h:8mm;--boton-pad:4mm;--chip-h:6mm;--chip-pad:3mm;
  --trk-bajada:var(--trk-19);--trk-tarjeta:var(--trk-19);--trk-titulo:var(--trk-30);--trk-portada:var(--trk-58);
  --trk-cifra:var(--trk-80);--trk-cifra-fila:var(--trk-42);
  --lh-titulo:1.2;--lh-portada:1.055;--lh-texto:1.417;
  --gap:5mm;--radio:4mm;--radio-in:3mm;--filete:.5pt;--filete-on:1pt;--relleno:5mm;--punto:2mm}

/* ───────────────────────── texto (mismas clases en todos los formatos) */
.eyebrow{font-size:var(--eyebrow);font-weight:700;letter-spacing:var(--trk-eyebrow);text-transform:uppercase;
  line-height:var(--lh-eyebrow);color:var(--texto-2)}
h1,.portada{font-size:var(--portada);font-weight:700;line-height:var(--lh-portada);
  letter-spacing:calc(var(--trk-portada) + var(--trk-ajuste-titular));text-wrap:balance;color:var(--texto)}
h2,.titulo{font-size:var(--titulo);font-weight:700;line-height:var(--lh-titulo);
  letter-spacing:calc(var(--trk-titulo) + var(--trk-ajuste-titular));text-wrap:balance;color:var(--texto)}
h3{font-size:var(--tarjeta);font-weight:700;line-height:var(--lh-titulo-24);letter-spacing:var(--trk-tarjeta);color:var(--texto)}
p,li{font-size:var(--cuerpo);line-height:var(--lh-texto);color:var(--texto-2);text-wrap:pretty;
  letter-spacing:var(--trk-ajuste-texto);max-width:var(--medida)}   /* cuerpo hasta 32 em (SISTEMA §3.5); en A4 = c2-c5 */
p+p{margin-top:var(--gap)}                                          /* en A4, una línea base de 5 mm */
.bajada,.kicker{font-size:var(--bajada);line-height:var(--lh-pieza);color:var(--texto-2);max-width:var(--medida-bajada);
  letter-spacing:calc(var(--trk-bajada) + var(--trk-ajuste-texto));text-wrap:pretty}
.f-web .bajada,.f-cel .bajada{line-height:var(--lh-bajada)}         /* bajada de la web: 1,4 */
.f-a4 .bajada{line-height:1.417}                                     /* 12 / 17 pt */
p b,li b,.bajada b,.pie b{color:var(--texto)}
ul{padding-left:1.1em} li+li{margin-top:.35em}
.chico{font-size:var(--chico);line-height:var(--lh-pieza)}
.pie{font-size:var(--pie);line-height:var(--lh-pieza);color:var(--texto-2)}
.cifra{font-size:var(--cifra);font-weight:700;line-height:var(--lh-cifra);letter-spacing:var(--trk-cifra);
  font-variant-numeric:proportional-nums;color:var(--texto);white-space:nowrap}
.cifra.fila{font-size:var(--cifra-fila);letter-spacing:var(--trk-cifra-fila)}
.rotulo{font-size:var(--chico);font-weight:700;letter-spacing:var(--trk-eyebrow);text-transform:uppercase;
  line-height:var(--lh-eyebrow);color:var(--texto-2)}
.num{font-variant-numeric:tabular-nums}
.tiempo{display:block}            /* segundo tiempo en su propia línea (y balanceado aparte) */
.t2{color:var(--texto-3)}           /* segundo tiempo del titular, en Apagado (solo ≥ 24 px y sobre Blanco) */
.t2p{color:var(--texto-2)}          /* segundo tiempo en Pizarra: fondo no blanco o < 24 px */
.ahora{color:var(--acento-texto)}   /* el único texto encendido de la pieza (≥ 24 px o 19 px Bold) */
.tinta{color:var(--texto)}
.lectura{font-size:var(--cuerpo);font-weight:700;line-height:var(--lh-pieza);color:var(--texto);
  padding-left:16px;border-left:3px solid var(--texto);max-width:var(--medida-bajada);text-wrap:pretty}
.lectura span{display:block;font-weight:400;color:var(--texto-2);margin-top:2px}

/* ───────────────────────── lámina 1280 × 720 (SISTEMA §4.4)
   Márgenes 80 a los lados, 56 arriba, 64 abajo. 12 columnas de 64 con medianil 32: la columna n empieza en
   x = 80 + 96 (n − 1) y k columnas miden 96 k − 32. Cabeza en y 56-240, contenido en la banda y 272-632,
   línea del 30 % en y 216, pie con línea base en y 696. */
.slide{width:1280px;height:720px;position:relative;overflow:hidden;margin:24px auto;padding:56px 80px 64px;
  background:var(--fondo);color:var(--texto);page-break-after:always;break-after:page;
  contain:strict}   /* caja sellada: nada de adentro ensancha el documento (si no, Chrome achica el PDF entero) */
@media print{html,body{background:var(--blanco)}.slide{margin:0}@page{size:1280px 720px;margin:0}}
.head{max-width:928px}                                   /* c1-c10 */
.head h2{margin-top:12px}
.head .bajada{margin-top:12px;max-width:760px}
.zona{position:absolute;left:80px;right:80px;top:272px;height:360px}
.zona.alta{top:184px;height:448px}                       /* solo con título de una línea y sin bajada */
.abre{position:absolute;left:80px;top:216px;width:640px} /* lo que abre cuelga de la línea del 30 % */
.abre h1+.bajada,.abre h2+.bajada{margin-top:16px}
.fig-der{position:absolute;right:80px;top:56px;bottom:64px;display:flex;align-items:flex-end;justify-content:flex-end}
.foot{position:absolute;left:80px;right:80px;bottom:24px;height:16px;display:flex;justify-content:space-between;
  align-items:flex-end;font-size:12px;line-height:1;color:var(--texto-2)}
.foot .logo{height:16px;color:var(--logo-pie)}
.foot-der{display:flex;gap:24px;font-variant-numeric:tabular-nums}
.firma-portada{position:absolute;left:80px;top:632px;height:24px}
.fecha-portada{position:absolute;right:80px;top:632px;height:24px;display:flex;align-items:flex-end;font-size:12px;line-height:1;color:var(--texto-2)}
.esquina{position:absolute;right:80px;top:56px;text-align:right}
.es-portada .fig-der{bottom:112px}   /* la imagen de la portada termina en y 608: abajo va la firma */
/* lado(): texto en c1-c(12-k-1), figura en las últimas k columnas, de y 56 a 656 */
.lado-txt{position:absolute;left:80px;top:56px;bottom:64px}
.lado-txt .zona-txt{position:absolute;left:0;right:0;top:216px}
.lado-fig{position:absolute;top:56px;bottom:64px;display:flex;align-items:center;justify-content:center}
.lado-fig.abajo{align-items:flex-end}
.lado-fig.papel{top:0;bottom:0;right:0!important;background:var(--superficie);padding:0 80px 0 0}

/* retícula dentro de la banda (1120 útiles): <div class="r12"><div class="s4">…</div><div class="s8">…</div></div> */
.r12{display:grid;grid-template-columns:repeat(12,64px);column-gap:32px;row-gap:16px}
.s1{grid-column:span 1}.s2{grid-column:span 2}.s3{grid-column:span 3}.s4{grid-column:span 4}.s5{grid-column:span 5}
.s6{grid-column:span 6}.s7{grid-column:span 7}.s8{grid-column:span 8}.s9{grid-column:span 9}.s10{grid-column:span 10}
.s11{grid-column:span 11}.s12{grid-column:span 12}
.g2c{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}  /* entre tarjetas, 16 (SISTEMA §4.1) */
.g3c{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.g4c{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.pila{display:flex;flex-direction:column;gap:16px}
.pila>.boton,.pila>.chip{align-self:flex-start}
.hilo{display:flex;align-items:center;gap:16px}
.llena{height:100%}

/* guías de retícula (lámina y piezas): solo para el capítulo de retícula y para revisar */
.guias{position:absolute;inset:0;pointer-events:none;z-index:50}
.guias i{position:absolute;top:0;bottom:0;background:rgba(0,122,255,.07)}
.guias u{position:absolute;left:0;right:0;height:0;border-top:1px solid rgba(0,122,255,.55)}
.guias s{position:absolute;outline:1px solid rgba(0,122,255,.55);box-shadow:0 0 0 4000px rgba(0,122,255,.06)}

/* ───────────────────────── marca */
.logo{display:inline-flex;color:var(--logo);flex:none}
.logo svg{height:100%;width:auto;display:block}
.logo svg path{fill:currentColor}
.ico{display:inline-flex;flex:none;color:var(--texto-2)}
.ico svg{width:100%;height:100%;fill:currentColor}
.lg-row{display:flex;align-items:center;justify-content:space-between;gap:16px}
.lg-row img{max-height:30px;max-width:86px;min-width:0;width:auto;object-fit:contain;filter:grayscale(1) contrast(1.2);opacity:.6}

/* ───────────────────────── componentes (SISTEMA §9 y §10). Lo encendido tiene UNA receta:
   fondo --acento-suave, borde --acento de 1,5 px (3 en el lienzo), texto en tinta. */
.card{background:var(--superficie);border-radius:var(--radio);padding:var(--relleno)}
.card.linea{background:var(--fondo);border:var(--filete) solid var(--borde)}
.card.on{background:var(--acento-suave);border:var(--filete-on) solid var(--acento)}
.card.tu{background:var(--control-hecho);color:var(--fondo)}           /* la persona que aprueba */
.card.tu h3,.card.tu p,.card.tu .rotulo{color:inherit}.card.tu p{opacity:.8}
.card .rotulo{margin-bottom:12px}.card h3+p{margin-top:6px}
.chip{display:inline-flex;align-items:center;gap:6px;height:var(--chip-h);padding:0 var(--chip-pad);border-radius:999px;
  border:var(--filete) solid var(--borde);background:var(--fondo);font-size:var(--chico);color:var(--texto-2);white-space:nowrap;line-height:1}
.chip b{color:var(--texto)}
.chip.on{background:var(--acento-suave);border:var(--filete-on) solid var(--acento);color:var(--texto)}
.boton{display:inline-flex;align-items:center;gap:8px;height:var(--boton-h);padding:0 var(--boton-pad);border-radius:999px;
  background:var(--acento);color:var(--sobre-acento);font-size:var(--boton);font-weight:700;white-space:nowrap;line-height:1}
.boton.sec{background:none;color:var(--texto);padding:0;height:auto}
.boton.sec svg{width:var(--icono-tam);height:var(--icono-tam)}      /* la flecha crece con el botón: 22 en lámina, 49 en lienzo */
.punto{display:inline-block;width:var(--punto);height:var(--punto);border-radius:50%;background:var(--acento);flex:none}
.rule{height:var(--filete);background:var(--borde)}
.cifra-b p{margin-top:8px}
.escena{position:relative;background:var(--superficie);border-radius:var(--radio);display:flex;align-items:center;
  justify-content:center;overflow:hidden;min-height:0}
.escena.blanca{background:var(--fondo);border:1px solid var(--borde)}
.escena.nada{background:none;border-radius:0}

/* ───────────────────────── primitivas de lámina */
.rye{display:grid;grid-template-columns:352px 736px;column-gap:32px;height:100%}
.rye-txt .rotulo+p{margin-top:8px}
.rye-regla{font-size:var(--tarjeta);font-weight:700;line-height:var(--lh-titulo-24);letter-spacing:var(--trk-tarjeta);color:var(--texto);margin-bottom:32px}
.rye-ej{display:flex;flex-direction:column;gap:8px;min-height:0}
.rye-ej .escena{flex:1}
.ci{display:grid;grid-template-columns:1fr 1fr;column-gap:32px;height:100%}
.ci-col{display:flex;flex-direction:column;min-height:0}
.ci-col .escena{flex:1}
.ci-et{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:700;color:var(--texto);margin-bottom:12px;line-height:1}
.ci-et.no{color:var(--texto-2)}
.ci-col>p{margin-top:12px;max-width:none}
.gal{display:grid;column-gap:32px;row-gap:12px;align-content:start}
.gal-fig{display:flex;align-items:flex-end;align-self:end;min-width:0}
.gal-fig.escena{align-self:stretch;align-items:center;justify-content:center;padding:24px}
.gal-pie{font-size:12px;line-height:1.35;color:var(--texto-2);align-self:start}
.gal-pie b{display:block;font-size:15px;color:var(--texto);margin-bottom:2px}
.nos{display:grid;column-gap:16px;height:100%}
.nos .escena{border-radius:var(--radio-in);min-height:0}
.nos-pie{display:flex;gap:8px;align-items:flex-start;padding:8px 0 16px;font-size:12px;line-height:1.35;color:var(--texto-2)}
.nos-pie svg{margin-top:1px}
.nos.grande .nos-pie{font-size:15px}
.nos.grande .nos-pie svg{margin-top:3px}
.ficha{display:flex;flex-direction:column}
/* ficha, tabla, barras y reporte leen el papel del formato: en la lámina miden lo de siempre (filas de 36, SISTEMA §4.1)
   y dentro de un post o de un A4 toman sus tamaños (reporte en 1080: filas 42 R, etiquetas 30 R; tabla A4: 9 / 12 pt, filas de 10 mm) */
.ficha>div{display:grid;grid-template-columns:40% 1fr;column-gap:16px;padding:8px 0;border-top:var(--filete) solid var(--borde);align-items:baseline}
.ficha>div:last-child{border-bottom:var(--filete) solid var(--borde)}
.ficha dt{font-size:var(--chico);color:var(--texto-2);line-height:var(--lh-pieza)}
.ficha dd{font-size:var(--cuerpo);color:var(--texto);line-height:var(--lh-pieza);font-variant-numeric:tabular-nums}
.ficha-b>.rotulo{margin-bottom:12px}
.tabla{width:100%;border-collapse:collapse}
.tabla th{font-size:var(--chico);font-weight:700;letter-spacing:var(--trk-eyebrow);text-transform:uppercase;color:var(--texto-2);
  text-align:left;padding:0 1.333em .667em 0;vertical-align:bottom}
.tabla td{font-size:var(--cuerpo);line-height:var(--lh-pieza);color:var(--texto-2);padding:.533em 1.067em .533em 0;
  border-top:var(--filete) solid var(--borde);vertical-align:top}
.tabla td:first-child{color:var(--texto);font-weight:700}
.tabla tr:last-child td{border-bottom:var(--filete) solid var(--borde)}
.f-a4 .tabla th{font-size:var(--eyebrow)}
.f-a4 .tabla td{font-size:var(--chico);line-height:12pt;padding:2.8mm 3mm 2.8mm 0}
.tira{display:flex;gap:16px;align-items:flex-start}
.tira figure{display:flex;flex-direction:column;gap:10px}
.tira figcaption{font-size:12px;line-height:1.35;color:var(--texto-2)}
.tira figcaption b{display:block;color:var(--texto);font-variant-numeric:tabular-nums}

/* diagramas: tres formas y un cable (SISTEMA §11) */
.flujo{display:flex;align-items:center}
.nodo{background:var(--fondo);border:var(--filete) solid var(--borde);border-radius:var(--radio);padding:12px 16px;
  font-size:15px;line-height:var(--lh-pieza);color:var(--texto);display:flex;align-items:center;gap:8px}
.nodo small{display:block;font-size:12px;color:var(--texto-2);margin-top:2px}
.nodo.on{background:var(--acento-suave);border:var(--filete-on) solid var(--acento)}
.nodo.tu{background:var(--control-hecho);border-color:var(--control-hecho);color:var(--fondo)}
.nodo.tu small{color:inherit;opacity:.8}
.nodo.op{border:1.5px dashed var(--texto-3);color:var(--texto-2)}
/* barras (SISTEMA §11, grosor / aire: lámina 24 / 16 · post 56 / 32 · web 20 / 12 · A4 3,5 / 1,5 mm; cero en tinta) */
.f-lienzo{--barra:56px;--barra-aire:32px}.f-web,.f-cel{--barra:20px;--barra-aire:12px}.f-a4{--barra:3.5mm;--barra-aire:1.5mm}
.barras{display:grid;row-gap:var(--barra-aire,16px);align-items:center}
.barras .et{font-size:var(--chico);color:var(--texto-2);text-align:right;padding-right:var(--gap);line-height:1.2}
.barras .riel{display:flex;align-items:center;gap:var(--gap);border-left:var(--filete) solid var(--texto);height:var(--barra,24px)}
.barras .riel i{display:block;height:var(--barra,24px);background:var(--texto-3)}
.barras .riel.hecho i{background:var(--control-hecho)}
.barras .riel.ahora i{background:var(--acento)}
.barras .riel em{font-style:normal;font-weight:700;font-size:var(--cuerpo);color:var(--texto);font-variant-numeric:tabular-nums}
/* línea de tiempo (hasta 7 nodos; nunca junto a la hilera) */
.ltiempo{display:grid;position:relative}
.ltiempo::before{content:"";position:absolute;left:6px;right:calc(100% / var(--n) - 6px);top:5.25px;height:1.5px;background:var(--borde)}
.ltiempo .st{position:relative;padding-right:16px}
.ltiempo .n{width:12px;height:12px;display:flex;align-items:center;justify-content:center;margin-bottom:12px}
.ltiempo .n i{display:block;width:10px;height:10px;border-radius:50%;background:var(--fondo);border:1.5px solid var(--texto-3)}
.ltiempo .st.hecho .n i{background:var(--control-hecho);border-color:var(--control-hecho)}
.ltiempo .st.hito .n i{width:12px;height:12px;background:var(--acento);border:0;display:flex;align-items:center;justify-content:center}
.ltiempo b{display:block;font-size:12px;color:var(--texto);line-height:1.35}
.ltiempo span{display:block;font-size:12px;color:var(--texto-2);line-height:1.35;margin-top:2px}
/* reporte de hoy */
.reporte{background:var(--fondo);border:var(--filete) solid var(--borde);border-radius:var(--radio);padding:var(--relleno)}
.reporte h3{margin-top:.5em}
.reporte .pie{margin-top:.1em}
.reporte table{width:100%;border-collapse:collapse;margin-top:calc(var(--relleno) * 2 / 3)}
.reporte td{font-size:var(--cuerpo);line-height:var(--lh-pieza);padding:.533em 0;border-top:var(--filete) solid var(--borde);
  color:var(--texto-2);font-variant-numeric:tabular-nums}
.reporte td:first-child{color:var(--texto);font-weight:700}
.reporte td+td{text-align:right}
.reporte td .punto{margin-right:.4em;vertical-align:.07em}
.reporte .chip{margin-top:calc(var(--relleno) * 2 / 3)}
/* foto «Pequeños oficios» */
.foto{position:relative;overflow:hidden;background:var(--superficie);flex:none}
.foto img{width:100%;height:100%;object-fit:cover}
.foto .chip{position:absolute;left:16px;bottom:16px}
.pj{display:block;width:auto;flex:none}

/* ───────────────────────── maquetas a escala: el lienzo se arma a tamaño real y se reduce con transform */
.esc{position:relative;flex:none}
.esc>.esc-in{position:absolute;left:0;top:0;transform-origin:0 0}
.esc.marco{outline:1px solid var(--borde)}
.esc-in>.slide{margin:0}
.lz{position:relative;overflow:hidden;background:var(--fondo);color:var(--texto)}
.lz.papel{background:var(--superficie)}
.lz-ab{position:absolute}
.lz-texto h1+.bajada,.lz-texto h2+.bajada{margin-top:var(--gap)}
.lz-texto .eyebrow{margin-bottom:var(--gap)}
.lz-texto .boton{margin-top:calc(var(--gap) * 1.5)}
.lz-fig{position:absolute;display:flex;align-items:flex-end;justify-content:flex-end}
.lz-l1{display:flex;align-items:center;gap:.5em;font-size:var(--pie);line-height:1.25;color:var(--texto)}
.lz-l1 img{border-radius:50%;object-fit:cover}
.lz-l1 span{display:block;color:var(--texto-2)}
.carrusel{display:flex;align-items:flex-start}

/* teléfono (SISTEMA §8): W × 2W, radio 0,16 W, bisel 0,04 W, pantalla de radio 0,12 W, siempre clara.
   Se dibuja a W = 256 y se escala; ningún texto baja de 13 px (a W 600 llega a 30). */
.tel{width:256px;height:512px;border-radius:41px;background:var(--telefono-marco);padding:10px}
.tel-scr{width:100%;height:100%;border-radius:31px;background:var(--telefono-pantalla);overflow:hidden;display:flex;flex-direction:column;color:var(--texto)}
.tel-est{flex:none;height:34px;display:flex;align-items:center;justify-content:space-between;padding:4px 24px 0;background:var(--fondo);font-size:13px;font-weight:700;font-variant-numeric:tabular-nums}
.tel-est i{display:block;width:20px;height:10px;border:1.5px solid var(--texto);border-radius:3px;position:relative}
.tel-est i::after{content:"";position:absolute;left:1.5px;top:1.5px;bottom:1.5px;width:11px;border-radius:1px;background:var(--texto)}
.tel-head{flex:none;display:flex;align-items:center;gap:10px;padding:6px 14px 10px;background:var(--fondo);border-bottom:1px solid var(--borde)}
.tel-av{width:30px;height:30px;border-radius:50%;background:var(--superficie);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;color:var(--texto-2);flex:none}
.tel-av .ico{width:16px;height:16px}
.tel-head b{display:block;font-size:13px;line-height:1.3}
.tel-head i{display:block;font-style:normal;font-size:13px;line-height:1.3;color:var(--texto-2)}
.tel-body{flex:1;padding:12px 10px;display:flex;flex-direction:column;gap:8px;min-height:0}
.bub{max-width:75%;background:var(--fondo);border:1px solid var(--borde);border-radius:10px 10px 10px 4px;
  padding:7px 10px;font-size:13px;line-height:1.35;color:var(--texto)}
.bub.me{border-radius:10px 10px 4px 10px}
.tel-body>.bub{align-self:flex-start}.tel-body>.bub.me{align-self:flex-end}
.bub.seg{background:var(--acento-suave);border:1.5px solid var(--acento)}
.bub small{display:flex;justify-content:flex-end;align-items:center;gap:3px;font-size:13px;color:var(--texto-2);margin-top:2px;font-variant-numeric:tabular-nums}
.bub .who{display:block;font-size:13px;font-weight:700;color:var(--texto);margin-bottom:1px}
.bub-nota{align-self:flex-end;max-width:75%;font-size:13px;line-height:1.3;color:var(--texto-2);margin-top:-4px;text-align:right}
.sep{align-self:center;font-size:13px;color:var(--texto-2);background:var(--fondo);border:1px solid var(--borde);border-radius:999px;padding:2px 10px}
.tel .chip{--chip-h:26px;--chip-pad:10px;--chico:13px;align-self:flex-start}
.row{display:flex;align-items:center;gap:10px;background:var(--fondo);border:1px solid var(--borde);border-radius:10px;padding:8px 10px}
.row b{display:block;font-size:13px;line-height:1.3}
.row i{display:block;font-style:normal;font-size:13px;line-height:1.3;color:var(--texto-2)}
.est{width:18px;height:18px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;border:1.5px solid var(--texto-3)}
.est.hecho{background:var(--control-hecho);border-color:var(--control-hecho)}
.est.ahora{background:var(--acento);border-color:var(--acento)}

/* web (escritorio 1440 y celular 390) */
.web{background:var(--fondo);color:var(--texto);height:100%;overflow:hidden}
.web-bar{height:44px;background:var(--superficie);border-bottom:1px solid var(--borde);display:flex;align-items:center;padding:0 16px;gap:8px}
.web-bar i{width:12px;height:12px;border-radius:50%;background:var(--borde)}
.web-bar span{margin:0 auto;height:28px;min-width:360px;border-radius:8px;background:var(--fondo);border:1px solid var(--borde);
  display:flex;align-items:center;justify-content:center;font-size:13px;color:var(--texto-2)}
.web-cab{height:64px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--borde)}
.web-cab nav{display:flex;gap:32px;font-size:15px;color:var(--texto)}
.web-in{width:1200px;margin:0 auto}
.web-hero{display:grid;grid-template-columns:690px 486px;column-gap:24px;padding-top:96px}
.web-hero .eyebrow{margin-bottom:16px}
.web-hero h1+.bajada{margin-top:24px}
.web-hero .boton{margin-top:40px}
.web-sec{padding-top:128px}
.cel-cab{height:56px;display:flex;align-items:center;padding:0 24px;border-bottom:1px solid var(--borde)}
.cel-hero{padding:48px 24px 0}
.cel-hero .eyebrow{margin-bottom:12px}
.cel-hero h1+.bajada{margin-top:16px}
.cel-hero .boton{margin-top:32px}

/* anuncio de Google (maqueta neutra: el color lo pone Google) */
.gads{width:600px;background:var(--fondo);padding:20px 24px;font-family:Arial,sans-serif}
.gads-sp{font-size:14px;font-weight:700;color:var(--texto)}
.gads-org{display:flex;align-items:center;gap:12px;margin-top:10px}
.gads-org>span{width:28px;height:28px;border-radius:50%;border:1px solid var(--borde);display:flex;align-items:center;justify-content:center}
.gads-org b{display:block;font-size:14px;font-weight:400;color:var(--texto)}
.gads-org i{display:block;font-style:normal;font-size:12px;color:var(--texto-2)}
.gads-t{font-size:20px;line-height:1.3;color:var(--texto);margin-top:8px}
.gads-d{font-size:14px;line-height:1.55;color:var(--texto-2);margin-top:4px;max-width:none}
.gads-cuenta{margin-top:12px;font-size:12px;color:var(--texto-2);font-variant-numeric:tabular-nums;line-height:1.5}

/* LinkedIn, correo y YouTube (maquetas de interfaz ajena, genéricas y sin sus logos) */
.li-post{width:552px;background:var(--fondo);border:1px solid var(--borde);border-radius:12px;overflow:hidden}
.li-cab{display:flex;gap:10px;padding:14px 16px 8px}
.li-cab img{width:48px;height:48px;border-radius:50%;object-fit:cover}
.li-cab b{display:block;font-size:14px;color:var(--texto)}
.li-cab i{display:block;font-style:normal;font-size:12px;color:var(--texto-2);line-height:1.4}
.li-txt{padding:0 16px 12px;font-size:14px;line-height:1.43;color:var(--texto)}
.li-img{display:block}
.li-acc{display:flex;justify-content:space-around;padding:10px 16px;border-top:1px solid var(--borde);font-size:13px;font-weight:700;color:var(--texto-2)}
.mail{width:600px;background:var(--fondo);border:1px solid var(--borde);border-radius:12px;overflow:hidden}
.mail-cab div{padding:10px 20px;border-bottom:1px solid var(--borde);font-size:13px;color:var(--texto-2)}
.mail-cab b{color:var(--texto);font-weight:400}
.mail-cuerpo{padding:20px;font-size:14px;line-height:1.5;color:var(--texto)}
.mail-cuerpo p{font-size:14px;color:var(--texto);margin:0 0 12px;max-width:none}
.firma{font-size:13px;line-height:19px;color:var(--texto-2);margin-top:20px}
.firma b{color:var(--texto);font-size:14px}
.firma span{color:var(--texto)}
.yt-dur{position:absolute;right:24px;bottom:24px;background:rgba(0,0,0,.8);color:#fff;font-size:30px;font-weight:700;
  padding:4px 12px;border-radius:8px;font-variant-numeric:tabular-nums}

/* A4 */
.pd-dat .eyebrow{margin-bottom:1.5mm}
.pd-dat p{color:var(--texto);max-width:none}
.pd-dat p+p{margin-top:0}
.pd-dat p.pd-t2{color:var(--texto-2)}
.pd-filas>div{border-top:.5pt solid var(--borde);padding:2.5mm 0 3mm}
.pd-filas>div:last-child{border-bottom:.5pt solid var(--borde)}
.pd-filas .eyebrow{margin-bottom:1mm}
.pd-filas p{color:var(--texto)}
.pd-cuerpo p{max-width:none;color:var(--texto)}
.pd-cuerpo p+p,.pd-cuerpo .pd-num+p{margin-top:5mm}
.pd-cuerpo h3{margin-top:5mm}
.pd-cuerpo .tabla{margin-top:2mm}
.pd-num td:nth-child(n+2),.pd-num th:nth-child(n+2){text-align:right;padding-right:0}
.pd-lg svg{overflow:visible}
.pd-plg{position:absolute;left:0;width:5mm;border-top:.25pt solid var(--texto-3)}
/* sobre DL: la ventana deja ver la carta de verdad; la solapa, en filete Línea */
.pd-ven{position:absolute;overflow:hidden;border:.5pt solid var(--borde);border-radius:3mm}
.pd-sol{position:absolute;inset:0}
.pd-montos td:nth-child(n+3),.pd-montos th:nth-child(n+3){text-align:right;padding-right:0}
.pd-cot td:nth-child(2){color:var(--texto)}
.pd-cif{display:grid;grid-template-columns:repeat(4,39.5mm);column-gap:4mm}
.pd-cif>div{height:30mm;border:.5pt solid var(--borde);border-radius:3mm;padding:3mm;display:flex;flex-direction:column;justify-content:space-between}
.pd-cif .cifra{line-height:1}
.pd-cif p{font-size:var(--pie);line-height:9pt;max-width:none}
.pd-lista-a4{list-style:none;padding:0}
.pd-lista-a4 li{display:grid;grid-template-columns:6mm 1fr;padding:2mm 0;border-top:.5pt solid var(--borde);max-width:none;color:var(--texto)}
.pd-lista-a4 li+li{margin-top:0}
.pd-lista-a4 li:last-child{border-bottom:.5pt solid var(--borde)}
.pd-lista-a4 svg{margin-top:.6mm}
.pd-firma{border-top:.5pt solid var(--texto);padding-top:2mm}
.pd-cota{position:absolute;font-size:22px;font-weight:700;line-height:1;color:var(--texto);background:var(--fondo);padding:2px 4px;white-space:nowrap}
.pd-dim{position:absolute;border:0 solid var(--texto)}

.pd-g{position:relative;flex:none}
.pd-g>i{position:absolute;left:0;right:0;height:0;border-top:1px dashed var(--texto-3)}
.pd-cat{display:grid;justify-content:space-between;align-content:start;row-gap:10px}
.pd-cat figure{display:flex;flex-direction:column;gap:6px;min-width:0}
.pd-cat figcaption{font-size:12px;line-height:1.35;color:var(--texto-2)}
.pd-cat figcaption b{display:inline;margin-right:6px;color:var(--texto)}
.pd-det{position:relative;overflow:hidden;border-radius:0;outline:1px solid var(--borde);background:var(--fondo);flex:none}
/* vitrinas: la pieza grande con marcas numeradas y la columna de notas */
.pd-vit{display:grid;grid-template-columns:796px 292px;column-gap:32px;height:100%}
.pd-vit-der{display:flex;flex-direction:column;gap:20px}
.pd-vit-der figure{display:flex;flex-direction:column;gap:8px}
.pd-pag{position:relative;flex:none}
.pd-m{display:flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;flex:none;
  background:var(--texto);color:var(--fondo);outline:2px solid var(--fondo);font-size:12px;font-weight:700;line-height:1}
.pd-pag .pd-m{position:absolute;z-index:2}
.pd-marcas{display:flex;flex-direction:column;gap:14px}
.pd-marcas>div{display:flex;gap:12px;align-items:flex-start}
.pd-marcas p{font-size:15px;line-height:1.35;max-width:none}
.pd-marcas p b{display:block;color:var(--texto)}
/* el deck completo: cuatro láminas de 384 en 2 × 2 */
.pd-deck{display:grid;grid-template-columns:384px 384px;gap:16px 28px}
.pd-deck .card{height:216px}
/* láminas de los decks */
.slide.pd-charla{--pie:15px;--eyebrow:19px;--chico:19px;--cuerpo:24px;--bajada:24px;--tarjeta:30px;--titulo:58px;
  --portada:80px;--cifra:160px;--cifra-fila:112px;--trk-bajada:var(--trk-24);--trk-tarjeta:var(--trk-30);
  --trk-titulo:var(--trk-58);--trk-portada:var(--trk-80);--trk-cifra:var(--trk-160);--lh-titulo:var(--lh-titular)}
.pd-notas{display:flex;flex-direction:column}
.pd-nota{display:grid;grid-template-columns:40px 1fr;padding:16px 0;border-top:1px solid var(--borde)}
.pd-nota:last-child{border-bottom:1px solid var(--borde)}
.pd-nota>b{font-size:19px;line-height:1.25;color:var(--texto)}
.pd-nota h3+p{margin-top:4px}
.pd-agenda>div{display:grid;grid-template-columns:96px 352px 1fr;align-items:center;height:72px;border-top:1px solid var(--borde)}
.pd-agenda>div:last-child{border-bottom:1px solid var(--borde)}
.pd-agenda .num{font-size:19px;font-weight:700;color:var(--texto-2)}
.pd-agenda h3{display:flex;align-items:center;gap:12px}
.pd-agenda p{max-width:none}
.pd-gf{display:grid;grid-template-columns:96px 1fr;align-items:baseline;padding:14px 0;border-bottom:1px solid var(--borde)}
.pd-gf:first-child{border-top:1px solid var(--borde)}
.pd-grande .pd-n{font-size:var(--cifra-fila);font-weight:700;line-height:1;letter-spacing:var(--trk-cifra-fila);color:var(--texto)}
.pd-grande .pd-n.ahora{color:var(--acento-texto)}
.pd-grande h3{font-size:var(--tarjeta)}
.pd-cols{display:grid;grid-template-columns:1fr 1fr;column-gap:32px}
.pd-cols>div>header{display:flex;align-items:flex-end;gap:16px;padding-bottom:20px}
.pd-cols ul{list-style:none;padding:0}
.pd-cols li{padding:12px 0;border-top:1px solid var(--borde);max-width:none}
.pd-cols li+li{margin-top:0}
.pd-paso{display:flex;flex-direction:column;gap:16px}
.pd-paso h3+p{margin-top:-8px}
.pd-ent{list-style:none;padding:0;margin-top:12px}
.pd-ent li{display:grid;grid-template-columns:28px 1fr;align-items:center;height:30px;border-top:1px solid var(--borde);max-width:none;
  color:var(--texto-2);white-space:nowrap;overflow:hidden}
.pd-ent li+li{margin-top:0}
.pd-ent li:last-child{border-bottom:1px solid var(--borde)}
.pd-ent b{color:var(--texto)}
.pd-contacto{display:flex;gap:64px}
.pd-contacto>div>div:last-child{font-size:19px;margin-top:8px;color:var(--texto)}
.pd-l2{display:flex;align-items:center;gap:18px}
.pd-l2>b{font-size:24px;line-height:1;color:var(--texto)}
.pd-l2>i{width:1px;height:24px;background:var(--borde)}
.pd-qr{background:var(--papel);border-radius:12px;padding:16px;flex:none}
.pd-anf{height:40px;width:auto;display:block;filter:grayscale(1) invert(1)}
/* tarjeta: zona segura, columna y línea base */
.pd-tv{position:relative}
.pd-tv>i{position:absolute;border:1px dashed var(--texto-3)}
/* lámina «Incorrecto» */
.pd-mal{background:var(--fondo);border:1px solid var(--borde);border-radius:12px;padding:16px 20px;font-size:15px;line-height:1.35;color:var(--texto)}
.pd-mal .rotulo{margin-bottom:6px}
.pd-mal b{font-size:19px}
.pd-mal small{display:block;font-size:12px;color:var(--texto-2);margin-top:6px}
.pd-redondo .esc{border-radius:10px;overflow:hidden;outline:0;border:1px solid var(--borde)}

/* ajustes para mostrarlas dentro del sitio */
html,body{background:var(--fondo)!important;margin:0;font-family:var(--fuente)}
.slide{margin:0!important}
.esc.marco{outline:none}
.pl-fila{display:flex}