/* ============================================================
   FLUX DOCS — Sistema de diseño compartido
   Un solo origen. Todos los documentos FLUX salen de aquí.
   Familias: documento continuo (.fdoc) · deck (.s) · doc interno (.fint) ·
             doc vertical paginado (.fver) · form · quiz

   REGLAS DURAS
   1. Nunca escribir CSS por documento. Se edita aquí y cambia en todos.
   2. clamp() PROHIBIDO en tipografía de documento. Causa comprobada del
      outlier de 59px en hoja_venta_cierre.html. Solo tamaños fijos.
   3. Documento interno  → fondo claro --cr + Stack Mark HORIZONTAL.
      Documento externo  → fondo verde --vp + Stack Mark VERTICAL.
   4. Todo render a PDF requiere printBackground:true. Ver README.
   5. EL FORMATO DE PÁGINA LO DETERMINA CÓMO SE CONSUME EL DOCUMENTO,
      no quién lo lee. Tres formatos, y solo tres:
        .fdoc  vertical continuo  → se scrollea en celular (WhatsApp)
        .fver  vertical paginado  → se imprime, se firma o se anota
        .fint  horizontal paginado→ trabajo interno con tablas anchas
      Ver README para la tabla de asignación y los comandos de render.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&display=swap');

:root{
  /* Marca */
  --vp:#0D2818; --vm:#065F46; --ac:#34D399; --ac2:#6EE7B7; --cr:#F5F5F0; --tk:#0A0A0A;
  /* Neutros documento */
  --ink:#1C2A23; --ink-70:#3B4A42; --muted:#5E6B64; --faint:#9AA39E;
  --line:#E2E0D7; --line-soft:rgba(221,220,212,.6); --surface:#FFFFFF; --surface-2:#EFEEE6;
  --copy:#33413A;          /* color de párrafo largo */
  --btn-ink:#06251A;       /* texto sobre botón mint */
  /* Semánticos */
  --warn:#B87503;   --warn-bg:rgba(184,117,3,.08);   --warn-ink:#5C3B02;
  --danger:#A32620; --danger-bg:rgba(163,38,32,.07); --danger-ink:#6E1A15;
  --ok:#065F46;     --ok-bg:rgba(6,95,70,.07);
  /* Radii / sombra */
  --r-sm:8px; --r-md:14px; --r-lg:20px; --r-pill:999px;
  --shadow:0 1px 3px rgba(0,0,0,.06), 0 8px 40px rgba(0,0,0,.06);
  /* Medidas doc interno (Carta horizontal) */
  --fint-w:1056px; --fint-h:816px;
  --m-text:640px;   /* ~66 caracteres · rango óptimo de lectura */
  --m-full:936px;   /* columna útil · tablas y exhibits */
  /* Medidas doc vertical paginado (Carta vertical) */
  --fver-w:816px; --fver-h:1056px;
  --m-full-v:696px; /* columna útil vertical · 816 − 60 − 60 de padding
                       26% más angosta que --m-full. Máx 5 columnas de tabla. */
}

/* print-color-adjust global: sin esto los fondos se eliminan al imprimir
   y los headers con texto claro quedan invisibles. NO QUITAR. */
*{margin:0;padding:0;box-sizing:border-box;-webkit-print-color-adjust:exact;print-color-adjust:exact}

body{font-family:'Space Grotesk',system-ui,sans-serif;color:var(--ink);line-height:1.6;-webkit-font-smoothing:antialiased;font-variant-numeric:tabular-nums;counter-reset:sec}
h1,h2,h3,h4{line-height:1.1;font-weight:600;letter-spacing:-.02em}
a{color:var(--vm);text-decoration:none}

/* ---------- Stack Mark ----------
   REGLA DURA, sin excepcion. La audiencia manda la orientacion:
     EXTERNO (cliente/prospecto) -> isotipo VERTICAL  viewBox="0 0 192 180"
     INTERNO (solo equipo FLUX)  -> logotipo HORIZONTAL viewBox="0 0 600 180"
   Nunca el horizontal en documento externo.
   Composicion externa: <svg class="iso" viewBox="0 0 192 180"> dentro de .logo,
   y la palabra FLUX aparte como <span class="wm">FLUX</span> (texto HTML,
   nunca <text> dentro del SVG).
   Los SVG salen de 00_BRAND/SVG/ — nunca se reconstruyen de memoria.
   Al inline-arlos, quitar el <rect> de fondo. */
.logo{display:inline-flex;align-items:center;gap:.72rem}
.logo .iso{width:36px;height:34px}
.logo .wm{font-weight:700;font-size:1.55rem;letter-spacing:-.05em;line-height:1}
.logo.on-dark .wm{color:#fff}
.logo.on-light .wm{color:var(--vp)}
.logo.lg .iso{width:60px;height:56px}
.logo.lg .wm{font-size:2.5rem}
.logo.sm .iso{width:26px;height:24px}
.logo.sm .wm{font-size:1.05rem}

/* ============================================================
   FAMILIA 1 · DOCUMENTO  (invoice · one-pager · onboarding · carta)
   Contenedor: .fdoc  (tarjeta blanca sobre fondo crema)
   ============================================================ */
.fdoc-bg{background:var(--cr);min-height:100vh;display:flex;justify-content:center;padding:3rem 1.5rem}
.fdoc{background:var(--surface);width:100%;max-width:820px;border-radius:4px;overflow:hidden;box-shadow:var(--shadow)}

/* Header verde — por defecto EXTERNO (cliente/prospecto) */
.fdoc-hd{background:var(--vp);padding:2.6rem 3rem 2.2rem;display:flex;align-items:flex-end;justify-content:space-between;gap:2rem}
.fdoc-hd .brand{display:flex;flex-direction:column;gap:.6rem}
.fdoc-hd .brand svg{display:block}
.fdoc-badge{display:inline-flex;align-items:center;gap:.45rem;padding:.28rem .8rem;border-radius:var(--r-pill);border:1px solid rgba(52,211,153,.32);width:fit-content}
.fdoc-badge .dot{width:6px;height:6px;border-radius:50%;background:var(--ac)}
.fdoc-badge span{font-size:.6rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--ac)}
.fdoc-hd .title-block{text-align:right}
.fdoc-title{font-size:2.25rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ac);line-height:1}
.fdoc-subtitle{font-size:.62rem;font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:rgba(255,255,255,.4);margin-top:.55rem}

/* Header claro — modificador para DOCUMENTO INTERNO.
   Regla de marca: interno = fondo --cr + mark horizontal + verde solo acento. */
.fdoc-hd--light{background:var(--cr);border-bottom:1px solid var(--line)}
.fdoc-hd--light .fdoc-title{color:var(--vp)}
.fdoc-hd--light .fdoc-subtitle{color:var(--muted)}
.fdoc-hd--light .fdoc-badge{border-color:rgba(6,95,70,.28)}
.fdoc-hd--light .fdoc-badge span{color:var(--vm)}
.fdoc-hd--light .fdoc-badge .dot{background:var(--vm)}
.fdoc-hd--light .logo .wm{color:var(--vp)}
.fdoc-hd--light .brand svg [fill="#FFFFFF"],
.fdoc-hd--light .brand svg [fill="#fff"]{fill:var(--vp)}

/* Meta bar mint */
.fdoc-meta{background:var(--vm);padding:.9rem 3rem;display:flex;gap:3rem;flex-wrap:wrap;align-items:center}
.fdoc-meta .item{display:flex;flex-direction:column;gap:.2rem}
.fdoc-meta .k{font-size:.52rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:rgba(255,255,255,.42)}
.fdoc-meta .v{font-size:.78rem;font-weight:500;color:#fff}
.fdoc-meta .status{margin-left:auto;padding:.3rem .9rem;border-radius:var(--r-pill);border:1px solid rgba(52,211,153,.4);font-size:.6rem;font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:var(--ac)}
/* Meta bar en variante clara */
.fdoc-meta--light{background:var(--surface-2);border-bottom:1px solid var(--line)}
.fdoc-meta--light .k{color:var(--faint)}
.fdoc-meta--light .v{color:var(--vp)}
.fdoc-meta--light .status{border-color:rgba(6,95,70,.3);color:var(--vm)}

/* Body */
.fdoc-body{padding:3rem}
.parties{display:grid;grid-template-columns:1fr 1fr;gap:2rem;margin-bottom:2.5rem;padding-bottom:2.5rem;border-bottom:1px solid var(--line)}
.party-label{font-size:.52rem;font-weight:700;letter-spacing:.25em;text-transform:uppercase;color:var(--ac);margin-bottom:.6rem}
.fdoc-hd--light ~ .fdoc-body .party-label,.fint .party-label{color:var(--vm)}
.party-name{font-size:.95rem;font-weight:700;color:var(--tk);margin-bottom:.2rem}
.party-detail{font-size:.78rem;color:var(--muted);line-height:1.65}

.section-label{font-size:.52rem;font-weight:700;letter-spacing:.25em;text-transform:uppercase;color:var(--muted);margin-bottom:1rem}
.lede{font-size:1.1rem;font-weight:500;color:var(--vp);line-height:1.55;margin-bottom:1.4rem}
p.copy{font-size:1rem;color:var(--copy);line-height:1.75;margin-bottom:1.15rem}
p.copy strong{color:var(--vp);font-weight:600}

/* Callout — neutro + variantes semánticas */
.callout{background:var(--cr);border-radius:var(--r-sm);padding:1.5rem 1.75rem;margin:1.6rem 0 2.5rem;position:relative;overflow:hidden;break-inside:avoid}
.callout::before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:linear-gradient(to bottom,var(--vm),var(--ac))}
.callout p{font-size:1rem;color:var(--vp);line-height:1.7}
.callout p strong{font-weight:600}
.callout .lab{display:block;font-size:.55rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;margin-bottom:.5rem}

.callout--warn{background:var(--warn-bg)}
.callout--warn::before{background:var(--warn)}
.callout--warn p{color:var(--warn-ink)}
.callout--warn .lab{color:var(--warn)}

.callout--danger{background:var(--danger-bg)}
.callout--danger::before{background:var(--danger)}
.callout--danger p{color:var(--danger-ink)}
.callout--danger .lab{color:var(--danger)}

.callout--ok{background:var(--ok-bg)}
.callout--ok::before{background:var(--ok)}
.callout--ok p{color:var(--vp)}
.callout--ok .lab{color:var(--ok)}

/* Tabla de conceptos + pill de monto */
.fdoc table{width:100%;border-collapse:collapse;margin-bottom:2rem}
.fdoc thead th{font-size:.55rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);padding:.6rem 0;text-align:left;border-bottom:1.5px solid var(--line)}
.fdoc thead th:last-child{text-align:right}
.fdoc tbody td{padding:1.1rem 0;font-size:1rem;color:var(--tk);border-bottom:1px solid var(--cr);vertical-align:top;line-height:1.5}
.fdoc tbody td:first-child strong{font-weight:600}
.fdoc tbody td:last-child{text-align:right;white-space:nowrap;padding-left:1rem;vertical-align:middle}
.td-note{font-size:.74rem;color:var(--muted);margin-top:.3rem}
.amt{display:inline-block;font-weight:700;font-size:1rem;color:var(--vm);background:rgba(52,211,153,.12);border:1px solid rgba(52,211,153,.3);padding:.4rem .85rem;border-radius:var(--r-pill);letter-spacing:.01em}
.rates-note{font-size:.82rem;color:var(--muted);margin:-.75rem 0 2.5rem}

/* Tabla ancha — financiera, hasta 7 columnas. Convención: 1ª col texto, resto cifras.
   Usa .txt en una celda para forzar alineación izquierda. */
.table-wide{width:100%;max-width:var(--m-full);border-collapse:collapse;font-size:13px;line-height:1.5;font-variant-numeric:tabular-nums;margin:1.5rem 0 2rem;break-inside:avoid}
.table-wide thead{display:table-header-group}
.table-wide thead th{font-size:10px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:var(--muted);background:var(--surface-2);padding:.7rem .8rem;text-align:left;border-bottom:1.5px solid var(--vp);white-space:nowrap;vertical-align:bottom}
.table-wide th:not(:first-child),.table-wide td:not(:first-child){text-align:right}
/* td.txt/th.txt igualan la especificidad de la regla :not(:first-child) de arriba
   y ganan por orden. Con solo `.table-wide .txt` perdía y la celda salía a la derecha. */
.table-wide .txt,.table-wide td.txt,.table-wide th.txt{text-align:left}
.table-wide tbody td{padding:.62rem .8rem;color:var(--ink);border-bottom:1px solid var(--line);vertical-align:top}
.table-wide tbody tr:nth-child(even){background:var(--surface-2)}
.table-wide tbody tr.total{background:rgba(6,95,70,.07);font-weight:600}
.table-wide tbody tr.total td{color:var(--vp);border-top:1.5px solid var(--vp);border-bottom:none}
.table-wide td strong{font-weight:600;color:var(--vp)}
.table-wide caption{caption-side:bottom;text-align:left;font-size:11px;color:var(--muted);padding-top:.7rem;line-height:1.5}

/* Totales (invoice) */
.totals{display:flex;justify-content:flex-end;margin-bottom:2.5rem}
.totals .block{min-width:300px}
.totals .row{display:flex;justify-content:space-between;padding:.5rem 0;font-size:.85rem;color:var(--muted);border-bottom:1px solid var(--cr)}
.totals .row.total{padding:1rem 0 .25rem;font-size:1.05rem;font-weight:700;color:var(--tk);border-bottom:none;border-top:2px solid var(--vp);margin-top:.25rem}
.totals .row.total span:last-child{color:var(--vm)}
.totals .paid{color:var(--vm);font-weight:600}

/* Incluye (grid de features) */
.inc-wrap{background:var(--cr);border-radius:var(--r-sm);padding:1.6rem 1.9rem;margin-bottom:2.5rem}
.inc-grid{display:grid;grid-template-columns:1fr 1fr;gap:.6rem 1.8rem}
.inc-grid div{display:flex;gap:.55rem;align-items:flex-start;font-size:.85rem;color:var(--copy)}
.inc-grid div::before{content:'✦';color:var(--ac);flex-shrink:0;font-size:.72rem;margin-top:.1rem}

/* Checklist — tareas / requisitos / SOPs */
.checklist{list-style:none;margin:1.2rem 0 1.8rem}
.checklist li{position:relative;padding:.55rem 0 .55rem 1.9rem;font-size:15px;line-height:1.6;color:var(--copy);border-bottom:1px solid var(--line)}
.checklist li:last-child{border-bottom:none}
.checklist li::before{content:'';position:absolute;left:0;top:.78rem;width:14px;height:14px;border:1.5px solid var(--faint);border-radius:3px;background:var(--surface)}
.checklist li.done{color:var(--muted)}
.checklist li.done::before{content:'✓';background:var(--ac);border-color:var(--ac);color:var(--vp);font-size:10px;font-weight:700;display:grid;place-items:center;line-height:1}
.checklist li strong{color:var(--vp);font-weight:600}

/* Stat / KPI — diagnósticos y reportes */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(148px,1fr));gap:1.4rem 1.8rem;margin:1.5rem 0 2rem;break-inside:avoid}
.stat{display:flex;flex-direction:column;gap:.3rem}
.stat .n{font-size:2.1rem;font-weight:700;color:var(--vp);line-height:1;letter-spacing:-.03em}
.stat .n.is-alert{color:var(--danger)}
.stat .n.is-ok{color:var(--vm)}
.stat .n small{font-size:.95rem;font-weight:500;color:var(--muted);letter-spacing:0}
.stat .l{font-size:10px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);line-height:1.4}
.stat .src{font-size:10px;color:var(--faint);line-height:1.4}

/* Barra de metadatos — versión / fecha / confidencialidad */
.doc-meta-bar{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem 2.2rem;padding:.85rem 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin:1.4rem 0 2rem}
.doc-meta-bar .item{display:flex;flex-direction:column;gap:.15rem}
.doc-meta-bar .k{font-size:9px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--faint)}
.doc-meta-bar .v{font-size:12px;font-weight:500;color:var(--vp)}
.doc-meta-bar .conf{margin-left:auto;font-size:9px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--vm);border:1px solid rgba(6,95,70,.3);border-radius:var(--r-pill);padding:.25rem .8rem}

/* Índice / tabla de contenidos — sirve a doc interno y a deck (.idx-grid) */
.toc,.idx-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;margin:auto 0}
.toc .idx-label,.idx-grid .idx-label{font-size:1.05rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--vm);margin-bottom:1.6rem;padding-bottom:1rem;border-bottom:1px solid var(--line)}
.idx-list{list-style:none}
.idx-list li{padding:.9rem 0;font-size:1.4rem;border-bottom:1px solid var(--line-soft)}
.idx-list li:last-child{border-bottom:none}

/* Bloque bancario / info */
.info-box{border:1px solid var(--line);border-radius:var(--r-sm);padding:1.5rem 2rem;margin-bottom:2.5rem;position:relative;overflow:hidden;break-inside:avoid}
.info-box::before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:linear-gradient(to bottom,var(--vm),var(--ac))}
.info-title{font-size:.55rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);margin-bottom:1.1rem}
.info-grid{display:grid;grid-template-columns:1fr 1fr;gap:.65rem 2rem}
.info-item .l{font-size:.52rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.info-item .v{font-size:.85rem;font-weight:600;color:var(--tk)}
.info-item .v.mono{letter-spacing:.12em}

/* CTA */
.cta{background:var(--vp);border-radius:var(--r-md);padding:1.9rem;text-align:center;margin:1rem 0 1.5rem;break-inside:avoid}
.cta h3{color:#fff;font-size:1.4rem;font-weight:600;margin-bottom:.5rem}
.cta h3 em{font-style:normal;color:var(--ac)}
.cta p{font-size:.92rem;color:rgba(245,245,240,.72);margin-bottom:1.2rem}
.btn-ac{display:inline-block;background:var(--ac);color:var(--btn-ink);font-weight:700;font-size:1rem;text-decoration:none;padding:.9rem 1.9rem;border-radius:var(--r-pill)}
.cta .alt{display:block;margin-top:.9rem;font-size:.8rem;color:var(--ac2)}

/* Bloque de QR — cualquier documento que mande a una URL.
   Vive en el kit, no en el documento: el brochure fue el primero
   en necesitarlo pero no será el único. */
.qr-block{
  background:var(--vp);border-radius:var(--r-md);padding:2rem 2.2rem;
  display:flex;gap:2rem;align-items:center;flex-wrap:wrap;
  margin:1.6rem 0 2rem;break-inside:avoid;
}
.qr-block .qr{
  flex:none;width:132px;height:132px;background:#fff;
  border-radius:12px;padding:10px;display:grid;place-items:center;
}
.qr-block .qr svg{width:100%;height:100%;display:block}
.qr-block .txt{flex:1;min-width:220px}
.qr-block .lab{
  font-size:.55rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;
  color:var(--ac);margin-bottom:.5rem;
}
.qr-block h3{font-size:1.3rem;font-weight:600;color:#fff;line-height:1.25;margin-bottom:.5rem}
.qr-block h3 em{font-style:normal;color:var(--ac)}
.qr-block p{font-size:.9rem;color:rgba(245,245,240,.72);line-height:1.6;margin-bottom:.8rem}
.qr-block .url{
  display:inline-block;font-size:.9rem;font-weight:700;color:var(--vp);
  background:var(--ac);border-radius:var(--r-pill);padding:.55rem 1.3rem;text-decoration:none;
}

/* Rejilla de piezas — herramientas, entregables, módulos */
.piezas{display:grid;grid-template-columns:1fr 1fr;gap:.9rem;margin:1.4rem 0 2rem;break-inside:avoid}
.pieza{
  border:1px solid var(--line);border-radius:var(--r-sm);
  padding:1.15rem 1.3rem;background:var(--surface);
}
.pieza .n{
  font-size:.55rem;font-weight:700;letter-spacing:.2em;
  color:var(--vm);margin-bottom:.4rem;display:block;
}
.pieza h4{font-size:1rem;font-weight:600;color:var(--vp);margin-bottom:.3rem;line-height:1.25}
.pieza p{font-size:.85rem;color:var(--copy);line-height:1.55}

/* Dos caminos enfrentados — Studio vs System, opción A vs B */
.caminos{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:1.4rem 0 2rem;break-inside:avoid}
.camino{border:1px solid var(--line);border-radius:var(--r-md);padding:1.5rem 1.6rem;background:var(--surface)}
.camino.is-ac{background:var(--vp);border-color:var(--vp)}
.camino .marca{font-size:1.15rem;font-weight:700;color:var(--vp);margin-bottom:.15rem}
.camino .marca span{font-weight:300;color:var(--muted)}
.camino.is-ac .marca{color:#fff}
.camino.is-ac .marca span{color:var(--ac)}
.camino .que{
  font-size:.55rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;
  color:var(--muted);margin-bottom:.9rem;
}
.camino.is-ac .que{color:rgba(52,211,153,.8)}
.camino p{font-size:.88rem;color:var(--copy);line-height:1.6;margin-bottom:.8rem}
.camino.is-ac p{color:rgba(245,245,240,.78)}
.camino ul{list-style:none}
.camino li{
  position:relative;padding-left:1.1rem;font-size:.84rem;line-height:1.55;
  color:var(--copy);margin-bottom:.35rem;
}
.camino li::before{
  content:'';position:absolute;left:0;top:.55em;width:7px;height:2px;
  border-radius:2px;background:var(--ac);
}
.camino.is-ac li{color:rgba(245,245,240,.82)}

/* Cierre + firma */
.close{padding-top:2rem;border-top:1px solid var(--line)}
.close p{font-size:1rem;color:var(--copy);line-height:1.75;margin-bottom:1.4rem}
.close p strong{color:var(--vp);font-weight:600}
.sign-name{font-size:.95rem;font-weight:700;color:var(--tk)}
.sign-role{font-size:.78rem;color:var(--muted);margin-top:.15rem}
.sign-mail{font-size:.78rem;color:var(--vm);margin-top:.15rem}

/* Bloque de firma formal — contratos y cartas de entrega */
.signature{display:flex;justify-content:space-between;gap:3rem;flex-wrap:wrap;margin-top:2.4rem;padding-top:1.6rem;border-top:1px solid var(--line);break-inside:avoid}
.signature .who{flex:1;min-width:240px}
.signature .rule{border-bottom:1px solid var(--ink);height:2.8rem;margin-bottom:.6rem}
.signature .cap{font-size:10px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}

/* Footer doc */
.fdoc-ft{border-top:1px solid var(--line);margin-top:2.5rem;padding-top:1.5rem;display:flex;align-items:center;justify-content:space-between;gap:2rem}
/* .note existe también en la familia DECK con borde y fondo. Ahí es
   correcto; en el pie de un documento no. Se neutraliza aquí porque
   si no, todo documento con nota al pie hereda una barra verde. */
.fdoc-ft .note{
  font-size:.65rem;color:var(--muted);line-height:1.6;
  margin:0;padding:0;border:0;background:none;border-radius:0;
}

/* Proof strip (opcional en one-pager) */
.proof{background:var(--vp);border-radius:var(--r-md);padding:1.4rem 1.6rem;display:flex;gap:1.4rem;flex-wrap:wrap;margin-bottom:2.5rem;break-inside:avoid}
.proof .p{flex:1;min-width:130px}
.proof .n{font-size:1.6rem;font-weight:700;color:var(--ac);line-height:1}
.proof .l{font-size:.78rem;color:rgba(245,245,240,.72);margin-top:.35rem;line-height:1.35}

/* ============================================================
   FAMILIA 2 · DECK  (slides 1440×810) — propuestas de venta / brandbooks
   ============================================================ */
.deck-bg{background:#c9c8c0}
.s{width:1440px;height:810px;position:relative;overflow:hidden;background:var(--cr);margin:26px auto;display:flex;flex-direction:column;box-shadow:0 18px 60px rgba(0,0,0,.22)}
.s-pad{flex:1;padding:96px 120px 88px;display:flex;flex-direction:column;position:relative;z-index:2}
.eyebrow{font-size:.82rem;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:var(--vm);display:inline-flex;align-items:center;gap:.7rem}
.eyebrow::before{content:"";width:30px;height:2px;background:var(--ac);display:inline-block}
.folio{position:absolute;left:120px;right:120px;bottom:38px;z-index:3;display:flex;align-items:center;justify-content:space-between;font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);border-top:1px solid var(--line);padding-top:16px}
.folio .c{color:var(--vm);font-weight:600}
.glow{position:absolute;border-radius:50%;filter:blur(10px);z-index:0;pointer-events:none}
.cover{background:var(--vp)}
.cover .s-pad{justify-content:space-between;padding:84px 120px 80px}
.cover-top{display:flex;align-items:center;justify-content:space-between;padding-bottom:46px;border-bottom:1px solid rgba(255,255,255,.12)}
.tag-pill{font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:rgba(245,245,240,.55);border:1px solid rgba(255,255,255,.2);border-radius:var(--r-pill);padding:.5rem 1.1rem}
.cover .eyebrow{color:var(--ac2)}.cover .eyebrow::before{background:var(--ac)}
.cover-main{max-width:1060px}
.cover-main h1{font-size:5.4rem;font-weight:600;letter-spacing:-.035em;line-height:1.05;margin:1.6rem 0 1.9rem;color:#fff}
.cover-main h1 em{font-style:normal;color:var(--ac)}
.cover-lead{font-size:1.38rem;color:rgba(245,245,240,.76);max-width:820px;line-height:1.55}
.cover-meta{display:flex;gap:4.5rem;padding-top:38px;border-top:1px solid rgba(255,255,255,.12)}
.cover-meta .k{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(245,245,240,.5);margin-bottom:.5rem}
.cover-meta .v{font-size:1.25rem;font-weight:500;color:#fff}
.divider{background:var(--vp)}.divider .s-pad{justify-content:center}
.divider .part-ghost{position:absolute;right:96px;top:60px;font-size:20rem;font-weight:700;color:rgba(255,255,255,.05);line-height:1;letter-spacing:-.04em}
.divider .eyebrow{color:var(--ac2)}.divider .eyebrow::before{background:var(--ac)}
.divider h2{font-size:5rem;color:#fff;margin:1.4rem 0;position:relative;z-index:2}
.divider p{font-size:1.5rem;color:rgba(245,245,240,.72);max-width:760px}
.divider .folio{color:rgba(245,245,240,.4);border-top-color:rgba(255,255,255,.14)}.divider .folio .c{color:var(--ac2)}
.s-head{margin-bottom:auto}
.s-head h2{font-size:3.4rem;margin:1.1rem 0 1rem;max-width:1050px}
.s-head p{font-size:1.35rem;color:var(--ink-70);max-width:940px}
.s-title-md{font-size:3rem;margin:1.1rem 0 0}
.philo-quote{font-size:4.2rem;font-weight:600;letter-spacing:-.03em;line-height:1.05;max-width:1080px;margin:auto 0}
.philo-quote em{font-style:normal;color:var(--vm)}
.philo-sub{font-size:1.4rem;color:var(--ink-70);max-width:1000px;margin-top:2.2rem;line-height:1.5}
.philo-sig{margin-top:2.4rem;font-size:.95rem;letter-spacing:.16em;text-transform:uppercase;color:var(--vm);font-weight:600}
.steps{display:grid;grid-template-columns:1fr 1fr;gap:20px 40px;margin:auto 0}
.step{display:grid;grid-template-columns:auto 1fr;gap:1.4rem;align-items:start}
.step .n{font-size:1.15rem;font-weight:700;color:var(--vp);width:52px;height:52px;border-radius:13px;background:var(--surface);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.step h3{font-size:1.5rem;margin-bottom:.45rem}.step p{font-size:1.1rem;color:var(--ink-70)}
.step .tag{display:inline-block;font-size:.72rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--vm);background:rgba(6,95,70,.09);padding:.3rem .65rem;border-radius:6px;margin-left:.5rem;vertical-align:middle}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:32px;margin:auto 0}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin:auto 0}
.deck-card{background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:44px 40px;display:flex;flex-direction:column}
.deck-card h3{font-size:1.9rem;margin-bottom:.7rem}
.price-tag{font-size:.92rem;font-weight:600;color:var(--vm);background:rgba(6,95,70,.08);border-radius:8px;padding:.4rem .85rem;display:inline-block;align-self:flex-start;margin-bottom:1.3rem}
.deck-card ul{list-style:none}
.deck-card li{font-size:1.08rem;color:var(--ink-70);padding:.7rem 0 .7rem 1.9rem;position:relative;border-top:1px solid var(--line)}
.deck-card li:first-child{border-top:none}
.deck-card li::before{content:"";position:absolute;left:0;top:1.15rem;width:10px;height:10px;border-radius:50%;background:var(--ac);box-shadow:0 0 0 3px rgba(52,211,153,.16)}
.feats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:auto 0}
.feat{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:26px 30px}
.feat h4{font-size:1.32rem;margin-bottom:.5rem;color:var(--vp);font-weight:600}.feat p{font-size:1.02rem;color:var(--ink-70);line-height:1.45}
.model{display:grid;grid-template-columns:1fr 1fr;gap:32px;margin:auto 0}
.model .box{background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:48px 44px}
.model .box.accent{background:var(--vp);color:var(--cr)}
.model .box .lab{font-size:.85rem;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);margin-bottom:1.2rem}
.model .box.accent .lab{color:var(--ac2)}
.model .box .big{font-size:3.4rem;font-weight:700;color:var(--vp);letter-spacing:-.03em;line-height:1}
.model .box.accent .big{color:#fff}.model .box .big span{font-size:1.4rem;font-weight:500;color:var(--muted)}
.model .box.accent .big span{color:rgba(245,245,240,.7)}
.model .box p{margin-top:1.4rem;font-size:1.15rem;color:var(--ink-70);line-height:1.5}.model .box.accent p{color:rgba(245,245,240,.82)}
.note{margin-top:34px;font-size:1.1rem;color:var(--muted);padding:1.3rem 1.6rem;border-left:3px solid var(--ac);background:var(--surface-2);border-radius:0 14px 14px 0}
.next{display:grid;grid-template-columns:1.25fr 1fr;gap:56px;margin:auto 0;align-items:center}
.next h2{font-size:3.6rem;margin-bottom:1.4rem}.next h2 em{font-style:normal;color:var(--vm)}
.next p{font-size:1.35rem;color:var(--ink-70);line-height:1.5}
.next .steps-mini{margin-top:2rem;list-style:none}
.next .steps-mini li{font-size:1.2rem;color:var(--ink);padding:.7rem 0 .7rem 2.2rem;position:relative}
.next .steps-mini li::before{content:"";position:absolute;left:0;top:.85rem;width:12px;height:12px;border-radius:50%;background:var(--ac);box-shadow:0 0 0 4px rgba(52,211,153,.18)}
.contact-card{background:var(--vp);color:var(--cr);border-radius:22px;padding:48px 44px}
.contact-card .row{padding:1.1rem 0;border-top:1px solid rgba(245,245,240,.14)}.contact-card .row:first-child{border-top:none}
.contact-card .k{font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ac2);margin-bottom:.3rem}
.contact-card .val{font-size:1.35rem;font-weight:500;color:#fff}
.closing{background:var(--vp)}.closing .s-pad{justify-content:center;align-items:flex-start}
.closing h2{font-size:4.4rem;color:#fff;max-width:1080px;letter-spacing:-.03em}.closing h2 em{font-style:normal;color:var(--ac)}
.closing .cmeta{margin-top:3rem;font-size:1.05rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(245,245,240,.6)}.closing .cmeta .c{color:var(--ac2)}

/* ============================================================
   FAMILIA 3 · DOCUMENTO INTERNO  (.fint · Carta horizontal 11×8.5in)
   Estrategia · finanzas · guías de venta · SOPs. Ver SPEC-doc-interno.md
   Doble medida: texto 640px (~66ch) · tablas y exhibits 936px.
   Tipografía FIJA. clamp() prohibido.
   ============================================================ */
.fint-bg{background:#c9c8c0;padding:26px 0}
.fint{width:var(--fint-w);min-height:var(--fint-h);height:var(--fint-h);position:relative;overflow:hidden;background:var(--surface);margin:0 auto 26px;padding:48px 60px 56px;display:flex;flex-direction:column;box-shadow:0 12px 40px rgba(0,0,0,.16)}

/* Medidas */
.m-text{max-width:var(--m-text)}
.m-full{max-width:var(--m-full)}
.fint p,.fint .lede,.fint h1,.fint h2,.fint h3,.fint ul,.fint ol{max-width:var(--m-text)}
.fint .table-wide,.fint .stats,.fint .callout,.fint .proof,.fint figure,.fint .m-full{max-width:var(--m-full)}

/* Tipografía fija — NO clamp() */
.fint{font-size:16px;line-height:1.7;font-weight:300;color:var(--ink)}
.fint p{font-size:16px;line-height:1.7;font-weight:300;margin-bottom:1rem;color:var(--copy)}
.fint p strong{font-weight:600;color:var(--vp)}
.fint h1{font-size:34px;line-height:1.1;font-weight:600;color:var(--vp);margin-bottom:1rem}
.fint h2{font-size:22px;line-height:1.2;font-weight:600;color:var(--vp);margin:0 0 .8rem}
.fint h3{font-size:16px;line-height:1.3;font-weight:600;color:var(--vp);margin:1.3rem 0 .5rem}
.fint .lede{font-size:18px;line-height:1.6;font-weight:400;color:var(--ink-70);margin-bottom:1.4rem}
.fint .eyebrow{font-size:10px;letter-spacing:.22em;font-weight:500;text-transform:uppercase;color:var(--vm)}
.fint ul,.fint ol{margin:0 0 1.2rem 1.1rem}
.fint li{font-size:16px;line-height:1.7;font-weight:300;color:var(--copy);margin-bottom:.35rem}

/* Portada (página 1) — sin header corrido */
.fint-cover{justify-content:space-between}
.fint-cover h1{font-size:34px;max-width:var(--m-text)}

/* Header corrido (página 2+) */
.fint-hd{display:flex;align-items:center;justify-content:space-between;gap:2rem;padding-bottom:12px;margin-bottom:28px;border-bottom:1px solid var(--line);flex-shrink:0}
.fint-hd .doc{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);font-weight:500}

/* Footer corrido / folio */
.fint-ft{position:absolute;left:60px;right:60px;bottom:22px;display:flex;align-items:center;justify-content:space-between;font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--faint);border-top:1px solid var(--line);padding-top:12px}
.fint-ft .c{color:var(--vm);font-weight:600}

/* Cuerpo scrollable dentro de la página */
.fint-body{flex:1;min-height:0}

/* Secciones numeradas §1 §2 §3 */
.doc-section{counter-increment:sec;margin-bottom:1.8rem}
.doc-section>h2::before{content:"§" counter(sec) " · ";color:var(--vm);font-weight:600}
.doc-section.no-num{counter-increment:none}
.doc-section.no-num>h2::before{content:none}

/* ============================================================
   FAMILIA 6 · DOCUMENTO VERTICAL PAGINADO  (.fver · Carta vertical 8.5×11in)
   Se imprime, se firma o se anota: contratos · hojas de diagnóstico ·
   reportes al cliente · reporte de auditoría de fuga.

   POR QUÉ EXISTE: .fdoc es scroll continuo. Un contrato en .fdoc renderiza
   como UNA página de 3.18 metros — no se puede imprimir, ni firmar hoja por
   hoja, ni rubricar al calce, ni citar "cláusula de la pág. 4" en disputa.

   Arquitectura idéntica a .fint pero invertida (816×1056 en vez de 1056×816).
   Misma lógica de portada / header corrido / folio / salto de página.

   MEDIDAS ÚTILES (padding 48px 60px 56px):
     ancho útil   = 816 − 60 − 60      = 696px  ← tope de tabla
     alto útil    = 1056 − 48 − 56     = 952px
     menos header corrido (~58px)      = 894px  ← área de contenido pág. 2+
   Tipografía FIJA. clamp() prohibido.
   ============================================================ */
.fver-bg{background:#c9c8c0;padding:26px 0}
.fver{width:var(--fver-w);min-height:var(--fver-h);height:var(--fver-h);position:relative;overflow:hidden;background:var(--surface);margin:0 auto 26px;padding:48px 60px 56px;display:flex;flex-direction:column;box-shadow:0 12px 40px rgba(0,0,0,.16)}

/* Medidas — el texto respeta 640px (~66ch); tablas y exhibits llegan a 696px */
.fver p,.fver .lede,.fver h1,.fver h2,.fver h3,.fver ul,.fver ol{max-width:var(--m-text)}
.fver .table-wide,.fver .stats,.fver .callout,.fver .proof,.fver figure,.fver .m-full,.fver table{max-width:var(--m-full-v)}
.fver .m-text{max-width:var(--m-text)}

/* Tipografía fija — NO clamp() */
.fver{font-size:16px;line-height:1.7;font-weight:300;color:var(--ink)}
.fver p{font-size:16px;line-height:1.7;font-weight:300;margin-bottom:1rem;color:var(--copy)}
.fver p strong{font-weight:600;color:var(--vp)}
.fver h1{font-size:34px;line-height:1.1;font-weight:600;color:var(--vp);margin-bottom:1rem}
.fver h2{font-size:22px;line-height:1.2;font-weight:600;color:var(--vp);margin:0 0 .8rem}
.fver h3{font-size:16px;line-height:1.3;font-weight:600;color:var(--vp);margin:1.3rem 0 .5rem}
.fver .lede{font-size:18px;line-height:1.6;font-weight:400;color:var(--ink-70);margin-bottom:1.4rem}
.fver .eyebrow{font-size:10px;letter-spacing:.22em;font-weight:500;text-transform:uppercase;color:var(--vm)}
.fver ul,.fver ol{margin:0 0 1.2rem 1.1rem}
.fver li{font-size:16px;line-height:1.7;font-weight:300;color:var(--copy);margin-bottom:.35rem}

/* Portada (página 1) — banda de marca a sangre, sin header corrido.
   EXTERNO por defecto: banda verde --vp + Stack Mark VERTICAL. */
.fver-cover{justify-content:space-between;padding:0 0 56px}
.fver-cover .fver-brand{background:var(--vp);padding:44px 60px 38px;display:flex;align-items:flex-end;justify-content:space-between;gap:2rem;flex-shrink:0}
.fver-cover .fver-brand .doc{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.45);font-weight:500}
.fver-cover .cover-body{padding:44px 60px 0;flex:1;display:flex;flex-direction:column;justify-content:center}
.fver-cover .cover-foot{padding:0 60px}
.fver-cover h1{font-size:34px;max-width:var(--m-text)}

/* Portada variante INTERNA: banda clara + Stack Mark HORIZONTAL */
.fver-cover.fver-cover--light .fver-brand{background:var(--cr);border-bottom:1px solid var(--line)}
.fver-cover--light .fver-brand .doc{color:var(--muted)}
.fver-cover--light .fver-brand .logo .wm{color:var(--vp)}
.fver-cover--light .fver-brand svg [fill="#FFFFFF"],
.fver-cover--light .fver-brand svg [fill="#fff"]{fill:var(--vp)}

/* Header corrido (página 2+) */
.fver-hd{display:flex;align-items:center;justify-content:space-between;gap:2rem;padding-bottom:12px;margin-bottom:28px;border-bottom:1px solid var(--line);flex-shrink:0}
.fver-hd .doc{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);font-weight:500}

/* Footer corrido / folio */
.fver-ft{position:absolute;left:60px;right:60px;bottom:22px;display:flex;align-items:center;justify-content:space-between;font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--faint);border-top:1px solid var(--line);padding-top:12px}
.fver-ft .c{color:var(--vm);font-weight:600}

/* Cuerpo dentro de la página */
.fver-body{flex:1;min-height:0}

/* ============================================================
   FAMILIA 4 · FORM  (onboarding forms, contacto)
   ============================================================ */
.fform{max-width:680px}
.fform .field{margin-bottom:1.5rem}
.fform label{display:block;font-size:.8rem;font-weight:600;color:var(--vp);margin-bottom:.5rem;letter-spacing:.01em}
.fform label .req{color:var(--vm)}
.fform .hint{font-size:.74rem;color:var(--muted);margin-top:.35rem}
.fform input,.fform textarea,.fform select{width:100%;font-family:inherit;font-size:1rem;color:var(--ink);background:var(--surface);border:1.5px solid var(--line);border-radius:var(--r-sm);padding:.85rem 1rem;transition:border-color .2s}
.fform input:focus,.fform textarea:focus,.fform select:focus{outline:none;border-color:var(--ac);box-shadow:0 0 0 3px rgba(52,211,153,.15)}
.fform textarea{min-height:120px;resize:vertical}
.fform .row2{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem}
.fform .submit{background:var(--vp);color:#fff;font-family:inherit;font-weight:700;font-size:1rem;border:none;border-radius:var(--r-pill);padding:1rem 2.2rem;cursor:pointer;transition:transform .16s,background .2s}
.fform .submit:hover{background:var(--vm)}.fform .submit:active{transform:scale(.98)}
.fprogress{height:5px;background:var(--surface-2);border-radius:var(--r-pill);overflow:hidden;margin-bottom:2rem}
.fprogress>i{display:block;height:100%;background:linear-gradient(90deg,var(--vm),var(--ac));border-radius:var(--r-pill);transition:width .4s cubic-bezier(.16,1,.3,1)}

/* ============================================================
   FAMILIA 5 · QUIZ  (brand voice, identidad visual)
   Nota: .sel la aplica el JS del quiz (06-quiz.html). No eliminar.
   ============================================================ */
.fquiz{max-width:680px}
.fquiz .q-num{font-size:.7rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--vm);margin-bottom:.7rem}
.fquiz .q-title{font-size:1.6rem;font-weight:600;color:var(--vp);margin-bottom:1.6rem;line-height:1.2}
.fquiz .opts{display:flex;flex-direction:column;gap:.8rem}
.fquiz .opt{display:flex;align-items:center;gap:1rem;padding:1.1rem 1.3rem;background:var(--surface);border:1.5px solid var(--line);border-radius:var(--r-md);cursor:pointer;transition:border-color .2s,background .2s,transform .16s}
.fquiz .opt:hover{border-color:var(--ac);background:rgba(52,211,153,.04)}
.fquiz .opt.sel{border-color:var(--ac);background:rgba(52,211,153,.08)}
.fquiz .opt .dot{width:22px;height:22px;border-radius:50%;border:2px solid var(--line);flex-shrink:0;display:grid;place-items:center;transition:.2s}
.fquiz .opt.sel .dot{border-color:var(--ac);background:var(--ac)}
.fquiz .opt.sel .dot::after{content:"";width:8px;height:8px;border-radius:50%;background:var(--vp)}
.fquiz .opt .txt{font-size:1rem;color:var(--ink)}
.fquiz .nav{display:flex;justify-content:space-between;margin-top:2rem}
.fquiz .result{text-align:center;padding:2rem 0}
.fquiz .result .arch{font-size:2.4rem;font-weight:700;color:var(--vp);margin:.5rem 0}
.fquiz .result .arch span{color:var(--vm)}

/* ============================================================
   FAMILIA 6 · WEB  (instrumentos interactivos: quiz, diagnóstico)

   Capa de MOVIMIENTO sobre los mismos tokens. No introduce color
   ni tipografía nueva — solo transform y opacity, que son las dos
   únicas propiedades que el compositor puede animar sin repintar.

   REGLA: el movimiento aclara el flujo. Si una animación no ayuda a
   entender dónde estás o qué acaba de pasar, sobra y se quita.

   No aplica a .fdoc / .fver / .fint: esas son familias de documento
   impreso y no se animan.
   ============================================================ */

/* 1 · Transición entre pasos — salida arriba, entrada desde abajo */
.fweb-step{opacity:1;transform:translateY(0);transition:opacity .2s ease,transform .2s ease}
.fweb-step.is-out{opacity:0;transform:translateY(-12px)}
.fweb-step.is-in{opacity:0;transform:translateY(12px)}

/* 3 · Revelación escalonada — el JS agrega .is-shown con delay creciente */
.fweb-reveal{opacity:0;transform:translateY(14px);transition:opacity .45s cubic-bezier(.16,1,.3,1),transform .45s cubic-bezier(.16,1,.3,1)}
.fweb-reveal.is-shown{opacity:1;transform:translateY(0)}

/* 5 · Momento de cálculo — pausa deliberada, no spinner genérico */
.fweb-calc{display:flex;flex-direction:column;align-items:center;gap:1rem;padding:4rem 0}
.fweb-calc .dots{display:flex;gap:.5rem}
.fweb-calc .dots i{width:9px;height:9px;border-radius:50%;background:var(--ac);animation:fwebPulse 1.1s ease-in-out infinite}
.fweb-calc .dots i:nth-child(2){animation-delay:.15s}
.fweb-calc .dots i:nth-child(3){animation-delay:.3s}
.fweb-calc .lab{font-size:.88rem;color:var(--muted);letter-spacing:.02em}
@keyframes fwebPulse{0%,100%{opacity:.25;transform:scale(.8)}50%{opacity:1;transform:scale(1)}}

/* prefers-reduced-motion: el contenido se ve completo, sin movimiento.
   No es opcional — hay usuarios para quienes el movimiento es un síntoma. */
@media (prefers-reduced-motion:reduce){
  .fweb-step,.fweb-reveal{transition:none}
  .fweb-step.is-out,.fweb-step.is-in{opacity:1;transform:none}
  .fweb-reveal{opacity:1;transform:none}
  .fweb-calc .dots i{animation:none;opacity:.65}
}

/* ============================================================
   PRINT + RESPONSIVE
   El print-color-adjust:exact del selector * es lo que conserva los fondos.
   Aquí solo se re-afirma lo crítico y se controla la paginación.
   ============================================================ */
@media print{
  @page{margin:0}
  body{background:#fff}
  .fdoc-bg{padding:0;background:#fff}
  .fdoc{box-shadow:none;max-width:100%}
  /* El header conserva su fondo: es identidad de marca, no decoración */
  .fdoc-hd{background:var(--vp)}
  .fdoc-hd--light{background:var(--cr)}
  .fdoc-meta{background:var(--vm)}
  .fdoc-meta--light{background:var(--surface-2)}
  .cta,.proof,.contact-card,.cover,.divider,.closing{background:var(--vp)}
  .deck-bg{background:none}
  .s{margin:0;box-shadow:none;break-after:page;page-break-after:always}
  .s:last-child{break-after:auto}
  /* Doc interno: 1 .fint = 1 página Carta horizontal */
  .fint-bg{background:none;padding:0}
  .fint{margin:0;box-shadow:none;break-after:page;page-break-after:always}
  .fint:last-child{break-after:auto}
  /* Doc vertical paginado: 1 .fver = 1 página Carta vertical */
  .fver-bg{background:none;padding:0}
  .fver{margin:0;box-shadow:none;break-after:page;page-break-after:always}
  .fver:last-child{break-after:auto}
  .fver-cover .fver-brand{background:var(--vp)}
  .fver-cover--light .fver-brand{background:var(--cr)}
  table,.table-wide,.stats,.stat,.callout,.info-box,.signature,.deck-card{break-inside:avoid}
  h1,h2,h3{break-after:avoid}
  .pagebreak{break-before:page}
  /* Capa web: sin .is-shown el bloque quedaría en opacity:0 y saldría en
     blanco al imprimir. Al imprimir todo se ve, sin movimiento. */
  .fweb-reveal,.fweb-step{opacity:1!important;transform:none!important}
  .fweb-calc{display:none}
}
@media (max-width:640px){
  .fdoc-bg{padding:1.2rem .8rem}
  .fdoc-hd,.fdoc-body{padding:1.6rem 1.4rem}
  .fdoc-hd{flex-direction:column;align-items:flex-start;gap:1.2rem}
  .fdoc-hd .title-block{text-align:left}.fdoc-title{font-size:1.8rem}
  .fdoc-meta{padding:.9rem 1.4rem;gap:1.2rem}
  .parties,.inc-grid,.info-grid,.fform .row2,.toc,.idx-grid{grid-template-columns:1fr}
}

/* ============================================================
   FAMILIA 6 · BROCHURE  (.fbro · paneles Carta vertical 816×1056)

   Un brochure NO es un documento. Es una secuencia de PANELES en
   orden fijo — gancho, explicar, probar, actuar — donde la portada
   se gana la apertura y el último panel pide la acción.
   (Shostack no aplica aquí; esto es composición gráfica.)

   Por eso .fbro rompe con .fdoc y .fver a propósito:
     · sin encabezado ni pie corridos — cada panel se compone solo
     · a sangre completa: el color llega al borde del papel
     · jerarquía por escala, no por peso de fuente
     · un mensaje por panel, y se lee de un vistazo

   Mismo lienzo que .fver (816×1056) para que imprima igual y se
   lea en celular a pantalla llena.
   ============================================================ */
.fbro-bg{background:#c9c8c0;padding:26px 0;display:flex;flex-direction:column;align-items:center;gap:26px}

.fbro{
  width:var(--fver-w); height:var(--fver-h);
  position:relative; overflow:hidden;
  background:var(--vp); color:var(--cr);
  display:flex; flex-direction:column;
  box-shadow:0 12px 40px rgba(0,0,0,.20);
  -webkit-print-color-adjust:exact; print-color-adjust:exact;
  break-inside:avoid; break-after:page;
}
.fbro:last-child{break-after:auto}
.fbro-pad{padding:76px 68px; display:flex; flex-direction:column; flex:1; position:relative; z-index:2}

/* Fondos de panel */
.fbro--cream{background:var(--cr); color:var(--vp)}
.fbro--mint{background:var(--ac); color:var(--vp)}
.fbro--ink{background:#081F13; color:var(--cr)}

/* Tipografía de panel — fija, sin clamp() */
.fbro .kicker{
  font-size:11px; font-weight:700; letter-spacing:.28em; text-transform:uppercase;
  opacity:.62; margin-bottom:22px; display:flex; align-items:center; gap:12px;
}
.fbro .kicker::before{content:"";width:26px;height:2px;background:var(--ac);flex:none}
.fbro--mint .kicker::before,.fbro--cream .kicker::before{background:var(--vm)}

.fbro h1{font-size:86px; font-weight:700; line-height:.94; letter-spacing:-.035em}
.fbro h2{font-size:52px; font-weight:600; line-height:1.04; letter-spacing:-.028em; margin-bottom:26px}
.fbro h3{font-size:26px; font-weight:600; line-height:1.2; letter-spacing:-.015em; margin-bottom:10px}
.fbro .ac{color:var(--ac)}
.fbro--cream .ac,.fbro--mint .ac{color:var(--vm)}
.fbro .mut{opacity:.42}

.fbro p{font-size:17px; line-height:1.62; font-weight:300; margin-bottom:16px; max-width:56ch; opacity:.86}
.fbro p strong{font-weight:600; opacity:1}
.fbro .grande{font-size:23px; line-height:1.45; font-weight:400; opacity:.94}

/* La marca como recurso gráfico, no como sello */
.fbro-mark{position:absolute; display:flex; flex-direction:column; gap:calc(var(--mh) * .47); pointer-events:none}
.fbro-mark i{display:block; height:var(--mh); width:var(--mw); border-radius:999px; background:currentColor}
.fbro-mark i:nth-child(2){width:calc(var(--mw) * .736)}
.fbro-mark i:nth-child(3){width:calc(var(--mw) * .444); opacity:.35}
.fbro-mark--xl{--mh:64px; --mw:300px; right:-70px; bottom:96px; opacity:.14}
.fbro-mark--sm{--mh:14px; --mw:66px; left:68px; top:60px; opacity:1}
.fbro-mark--sm i:nth-child(2){background:var(--ac)}
.fbro--mint .fbro-mark--sm i:nth-child(2),.fbro--cream .fbro-mark--sm i:nth-child(2){background:var(--vm)}

/* Numeración de panel */
.fbro-num{position:absolute; right:68px; top:60px; font-size:12px; font-weight:700; letter-spacing:.2em; opacity:.35}

/* Pasos numerados a gran escala */
.fbro-pasos{display:flex; flex-direction:column; gap:0; margin-top:auto}
.fbro-paso{display:flex; gap:28px; align-items:flex-start; padding:26px 0; border-top:1px solid currentColor}
.fbro-paso:last-child{border-bottom:1px solid currentColor}
.fbro-paso .n{font-size:44px; font-weight:700; line-height:.9; letter-spacing:-.04em; opacity:.28; flex:none; width:76px}
.fbro-paso p{margin:0; font-size:16px; max-width:44ch}

/* Rejilla de piezas dentro de un panel */
.fbro-grid{display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-top:auto}
.fbro-card{border:1px solid currentColor; border-radius:16px; padding:26px 28px}
.fbro-card .n{font-size:11px; font-weight:700; letter-spacing:.2em; opacity:.5; display:block; margin-bottom:10px}
.fbro-card h3{font-size:21px; margin-bottom:7px}
.fbro-card p{font-size:15px; line-height:1.5; margin:0; max-width:none; opacity:.78}

/* Variante compacta de la rejilla: cuando el copy del panel es más
   largo y se pasa por unos pocos píxeles. */
.fbro-grid--compacto{gap:16px}
.fbro-grid--compacto .fbro-card{padding:22px 24px}
.fbro-grid--compacto .fbro-card h3{font-size:20px;margin-bottom:5px}
.fbro-grid--compacto .fbro-card p{font-size:14.5px;line-height:1.45}

/* Cifras como acontecimiento visual */
.fbro-cifras{display:flex; flex-direction:column; gap:0; margin-top:auto}
.fbro-cifra{display:flex; align-items:flex-start; gap:26px; padding:20px 0; border-top:1px solid currentColor}
.fbro-cifra:last-child{border-bottom:1px solid currentColor}
.fbro-cifra .n{font-size:58px; font-weight:700; line-height:.82; letter-spacing:-.045em; flex:none; min-width:196px}
.fbro-cifra .l{font-size:15.5px; line-height:1.45; opacity:.72; padding-top:4px}
.fbro-cifra .l b{display:block; font-weight:600; opacity:1; margin-bottom:2px}

/* Variante compacta: cuando el panel lleva cuatro filas o más */
.fbro-cifras--compacto .fbro-cifra{padding:15px 0}
.fbro-cifras--compacto .fbro-cifra .n{font-size:46px; min-width:150px}
.fbro-cifras--compacto .fbro-cifra .l{font-size:15px}

/* Panel partido — dos caminos */
.fbro-split{display:grid; grid-template-columns:1fr 1fr; flex:1; margin:0 -68px -76px}
.fbro-split > div{padding:56px 48px; display:flex; flex-direction:column}
.fbro-split .lado-a{background:rgba(255,255,255,.05)}
.fbro-split .lado-b{background:var(--ac); color:var(--vp)}
.fbro-split h3{font-size:30px; margin-bottom:4px}
.fbro-split .que{font-size:11px; font-weight:700; letter-spacing:.2em; text-transform:uppercase; opacity:.6; margin-bottom:22px}
.fbro-split p{font-size:15.5px; max-width:none}
.fbro-split ul{list-style:none; margin-top:auto}
.fbro-split li{font-size:15px; line-height:1.5; padding:9px 0 9px 20px; position:relative; border-top:1px solid currentColor; opacity:.85}
.fbro-split li:first-child{border-top:none}
.fbro-split li::before{content:"";position:absolute;left:0;top:1.15em;width:9px;height:2px;border-radius:2px;background:currentColor}

/* Panel de cierre con QR */
.fbro-cierre{display:flex; gap:44px; align-items:center; margin-top:auto}
.fbro-cierre .qr{flex:none; width:186px; height:186px; background:#fff; border-radius:18px; padding:14px; display:grid; place-items:center}
.fbro-cierre .qr svg{width:100%; height:100%; display:block}

.fbro-pie{
  margin-top:auto; padding-top:22px; border-top:1px solid currentColor;
  display:flex; justify-content:space-between; align-items:flex-end; gap:24px;
  font-size:13px; opacity:.6;
}
.fbro-pie b{font-weight:600; opacity:1}

@media print{
  .fbro-bg{background:#fff;padding:0;gap:0}
  .fbro{box-shadow:none;margin:0}
}

/* ============================================================
   FAMILIA 7 · CAUCE  (.cau-*)  — instrumento de perfil FLUX
   ------------------------------------------------------------
   Componentes del reporte individual de perfil conductual.
   Viven DENTRO de una página .fver (Carta vertical paginada).
   Ver 02_SISTEMA/Cauce/MANUAL-TECNICO.html
   ============================================================ */

/* --- Mapa de cuadrantes --- */
.cau-map{position:relative;width:420px;height:420px;margin:1.4rem auto 2.6rem}
.cau-map .grid{position:absolute;inset:0;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr}
.cau-map .q{position:relative}
/* Etiqueta de cada cuadrante en SU esquina exterior, no en el centro:
   pegadas al eje se amontonan las cuatro sobre la línea media. */
.cau-map .q span{position:absolute;font-size:9px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.75);white-space:nowrap}
.cau-map .q:nth-child(1) span{top:10px;left:12px}
.cau-map .q:nth-child(2) span{top:10px;right:12px}
.cau-map .q:nth-child(3) span{bottom:10px;left:12px}
.cau-map .q:nth-child(4) span{bottom:10px;right:12px}
.cau-map .sym{position:absolute;transform:translate(-50%,50%);z-index:3;filter:drop-shadow(0 1px 2px rgba(0,0,0,.45))}
/* white-space:nowrap es obligatorio en los ejes verticales: sin él la caja
   rotada mide 0 de ancho y el texto sale una letra por renglón. */
.cau-map .ax{position:absolute;font-size:9px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);white-space:nowrap}
.cau-map .ax-t{top:-20px;left:50%;transform:translateX(-50%)}
.cau-map .ax-b{bottom:-20px;left:50%;transform:translateX(-50%)}
.cau-map .ax-l{left:-46px;top:50%;transform:translateY(-50%) rotate(-90deg)}
.cau-map .ax-r{right:-46px;top:50%;transform:translateY(-50%) rotate(90deg)}

.cau-legend{display:flex;flex-wrap:wrap;gap:.5rem 1.6rem;justify-content:center;margin-top:2.4rem;max-width:var(--m-full-v)}
.cau-legend .it{display:flex;align-items:center;gap:.5rem;font-size:11px;color:var(--copy)}
.cau-legend .it b{font-weight:600;color:var(--vp)}

/* --- Panel de componentes --- */
.cau-panel{display:grid;grid-template-columns:repeat(3,1fr);gap:.9rem;max-width:var(--m-full-v)}
.cau-card{border:1px solid var(--line);border-radius:var(--r-md);padding:.9rem .9rem 1rem;text-align:center;background:var(--surface)}
.cau-card .ic{width:34px;height:34px;border-radius:50%;margin:0 auto .5rem;display:grid;place-items:center;color:#fff;font-size:14px;font-weight:700}
.cau-card .nm{font-size:12px;font-weight:600;color:var(--vp);line-height:1.25;min-height:2.4em;display:grid;place-items:center}
.cau-card .vals{display:flex;justify-content:space-around;border-top:1px solid var(--line);margin-top:.5rem;padding-top:.5rem}
.cau-card .vals div{display:flex;flex-direction:column;gap:.1rem}
.cau-card .vals .k{font-size:8px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--faint)}
.cau-card .vals .v{font-size:18px;font-weight:700;color:var(--vp);line-height:1}

/* --- Barra bipolar --- */
.cau-bar{margin:.35rem 0 .9rem;max-width:320px}
.cau-bar .lb{font-size:9px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:.5rem}
/* El carril se mete 14px por lado: el marcador va centrado en su posición
   y sobresale 13px, así que en 1 o en 99 se saldría de la caja. */
.cau-bar .track{position:relative;height:10px;margin:0 14px;border-radius:var(--r-pill);background:linear-gradient(90deg,var(--surface-2),var(--line),var(--surface-2));border:1px solid var(--line)}
.cau-bar .mk{position:absolute;top:50%;width:26px;height:18px;transform:translate(-50%,-50%);border-radius:var(--r-pill);background:var(--vp);color:#fff;font-size:9px;font-weight:700;display:grid;place-items:center;z-index:2}
.cau-bar .poles{display:flex;justify-content:space-between;gap:1rem;margin:.4rem 14px 0}
.cau-bar .poles span{font-size:9px;line-height:1.3;color:var(--faint);max-width:46%}
.cau-bar .poles span:last-child{text-align:right}

/* --- Ficha de componente --- */
.cau-comp{display:grid;grid-template-columns:1fr 330px;gap:1.6rem;max-width:var(--m-full-v);padding-bottom:1.1rem;margin-bottom:1.1rem;border-bottom:1px solid var(--line)}
.cau-comp:last-child{border-bottom:none;margin-bottom:0}
.cau-comp h3{margin:0 0 .15rem;font-size:15px}
.cau-comp .sub{font-size:10px;color:var(--faint);margin-bottom:.6rem;line-height:1.4}
.cau-comp p{font-size:12.5px;line-height:1.55;margin-bottom:.5rem;max-width:none}
.cau-comp .k{font-size:9px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--vm);margin:.5rem 0 .2rem}
.cau-comp .tags{display:flex;flex-wrap:wrap;gap:.3rem;margin-top:.35rem}
.cau-comp .tags span{font-size:10px;padding:.15rem .55rem;border-radius:var(--r-pill);background:var(--cr);color:var(--ink-70);border:1px solid var(--line)}

/* --- Anillos de interés --- */
.cau-rings{display:grid;grid-template-columns:1fr 1fr;gap:.7rem 1.4rem;max-width:var(--m-full-v)}
.cau-ring{display:flex;align-items:center;gap:.85rem;border:1px solid var(--line);border-radius:var(--r-md);padding:.6rem .85rem}
.cau-ring svg{flex-shrink:0}
.cau-ring .nm{font-size:12px;font-weight:600;color:var(--vp);line-height:1.2}
.cau-ring .d{font-size:10px;color:var(--muted);line-height:1.35;margin-top:.15rem}

/* --- Campos del plan de acción --- */
.cau-field{border:1px solid var(--line);border-radius:var(--r-sm);margin-bottom:.9rem;overflow:hidden;max-width:var(--m-full-v);break-inside:avoid}
.cau-field .hd{background:var(--vp);color:#fff;font-size:11px;font-weight:500;line-height:1.45;padding:.55rem .9rem}
.cau-field .bd{height:64px;background:var(--surface)}
.cau-field.sm .bd{height:46px}

/* El margen inferior del último bloque empuja el cuerpo fuera de la caja
   paginada y .fver/.fint recortan en silencio. Se anula siempre. */
.fver-body > *:last-child,
.fint-body > *:last-child{margin-bottom:0}

/* ---------- Bloque de comando · SOPs técnicos ----------
   Agregado 10 sep 2026 para SOP-nodo-sich. Reutilizable por cualquier
   SOP técnico. Monoespaciada sobre verde profundo: el comando se lee
   como objeto, no como prosa, y no se confunde con el cuerpo.
   Familias: .fint y .fver. Nunca copiar estos estilos a un documento. */
.cmd{max-width:var(--m-full);background:var(--vp);color:#DCEFE4;
  font-family:'SF Mono',SFMono-Regular,Menlo,Consolas,'Liberation Mono',monospace;
  font-size:12px;line-height:1.65;font-weight:400;letter-spacing:0;
  padding:12px 16px;border-radius:var(--r-sm);border-left:3px solid var(--ac);
  margin:.5rem 0 1.1rem;white-space:pre-wrap;overflow-wrap:anywhere}
.cmd .c{color:#7FAF97}                       /* comentario o salida */
.cmd .hl{color:var(--ac);font-weight:500}    /* la parte que importa */
.cmd-lab{display:block;font-size:10px;letter-spacing:.2em;text-transform:uppercase;
  font-weight:500;color:var(--vm);margin:1.1rem 0 .3rem}
.cmd-lab .w{color:var(--danger)}             /* etiqueta de paso peligroso */

/* Pasos numerados de procedimiento */
.pasos{counter-reset:paso;list-style:none;max-width:var(--m-full);margin:0 0 1.2rem}
.pasos li{position:relative;padding-left:34px;margin-bottom:.7rem;font-size:15px;
  line-height:1.6;font-weight:300;color:var(--copy)}
.pasos li::before{counter-increment:paso;content:counter(paso);position:absolute;
  left:0;top:1px;width:22px;height:22px;border-radius:50%;background:var(--vm);
  color:#fff;font-size:11px;font-weight:600;display:flex;align-items:center;
  justify-content:center;letter-spacing:0}
.pasos li strong{font-weight:600;color:var(--vp)}

/* ============================================================
   DECK · COMPONENTES DE SOLICITUD Y MODO PRESENTACIÓN (.dk-*)
   Agregado 20 sep 2026 para la solicitud de financiamiento IQEI.
   Reutilizable por cualquier deck .s que presente cifras,
   comparativos, equipo, FODA, etapas o preguntas frecuentes.
   Solo clases nuevas: no altera ningún componente existente.
   ============================================================ */

/* --- Cifra protagonista --- */
.dk-kpi{font-size:5.6rem;font-weight:700;letter-spacing:-.04em;line-height:1;color:var(--vp)}
.dk-kpi.mint{color:var(--vm)}
.dk-kpi small{font-size:1.5rem;font-weight:500;color:var(--muted);letter-spacing:0;margin-left:.4rem}
.dk-lab{font-size:.8rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--faint)}

/* --- Tarjeta de resultado (antes / después) --- */
.dk-res{background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:36px 34px 32px;display:flex;flex-direction:column}
.dk-res.hero{background:var(--vp);border-color:var(--vp);color:var(--cr)}
.dk-res .who{font-size:1.45rem;font-weight:600;color:var(--vp);letter-spacing:-.01em}
.dk-res.hero .who{color:#fff}
.dk-res .sec{font-size:.95rem;color:var(--muted);margin:.25rem 0 1.5rem}
.dk-res.hero .sec{color:rgba(245,245,240,.62)}
.dk-res .big{font-size:3.3rem;font-weight:700;letter-spacing:-.035em;line-height:1;color:var(--vm)}
.dk-res.hero .big{color:var(--ac)}
.dk-res .big small{font-size:1.1rem;font-weight:500;letter-spacing:0;color:var(--muted);margin-left:.35rem}
.dk-res.hero .big small{color:rgba(245,245,240,.62)}
.dk-res .cap{font-size:1.02rem;color:var(--ink-70);margin-top:.55rem;line-height:1.4}
.dk-res.hero .cap{color:rgba(245,245,240,.8)}
.dk-res .row{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;padding:.8rem 0;border-top:1px solid var(--line);font-size:1.02rem;color:var(--ink-70)}
.dk-res.hero .row{border-top-color:rgba(245,245,240,.14);color:rgba(245,245,240,.78)}
.dk-res .row b{font-weight:600;color:var(--vp);font-size:1.15rem}
.dk-res.hero .row b{color:#fff}
.dk-res .src{margin-top:auto;padding-top:1.1rem;font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:var(--faint)}
.dk-res.hero .src{color:rgba(245,245,240,.45)}
.dk-arrow{color:var(--faint);font-weight:400;margin:0 .35rem}

/* --- Lista de puntos grande (problema / solución) --- */
.dk-points{list-style:none;display:grid;gap:0;margin:auto 0}
.dk-points li{display:grid;grid-template-columns:72px 1fr;gap:1.4rem;align-items:baseline;padding:1.35rem 0;border-top:1px solid var(--line)}
.dk-points li:last-child{border-bottom:1px solid var(--line)}
.dk-points .n{font-size:1rem;font-weight:600;letter-spacing:.12em;color:var(--vm)}
.dk-points h3{font-size:1.7rem;font-weight:600;color:var(--vp);margin-bottom:.3rem}
.dk-points p{font-size:1.15rem;color:var(--ink-70);line-height:1.45}

/* --- Split: titular a la izquierda, contenido a la derecha --- */
.dk-split{display:grid;grid-template-columns:1fr 1.15fr;gap:72px;align-items:center;margin:auto 0}
.dk-split h2{font-size:3.5rem;margin:1.1rem 0 1.2rem}
.dk-split h2 em{font-style:normal;color:var(--vm)}
.dk-split > div > p{font-size:1.3rem;color:var(--ink-70);line-height:1.5}

/* --- Tarjetas de capa (solución) --- */
.dk-layers{display:grid;gap:14px}
.dk-layer{display:grid;grid-template-columns:180px 1fr;gap:1.4rem;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:22px 28px}
.dk-layer .k{font-size:.8rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--vm)}
.dk-layer h4{font-size:1.3rem;font-weight:600;color:var(--vp);margin-bottom:.2rem}
.dk-layer p{font-size:1rem;color:var(--ink-70);line-height:1.4}
.dk-layer.accent{background:var(--vp);border-color:var(--vp)}
.dk-layer.accent .k{color:var(--ac)}.dk-layer.accent h4{color:#fff}.dk-layer.accent p{color:rgba(245,245,240,.78)}

/* --- Fila de métricas --- */
.dk-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin:auto 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.dk-stat{padding:44px 40px 40px;border-left:1px solid var(--line)}
.dk-stat:first-child{border-left:none;padding-left:0}
.dk-stat .dk-kpi{margin:.9rem 0 .9rem}
.dk-stat p{font-size:1.12rem;color:var(--ink-70);line-height:1.45;max-width:320px}

/* --- Equipo --- */
.dk-team{display:grid;grid-template-columns:1.35fr 1fr;gap:28px;margin:auto 0}
.dk-person{background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:36px 38px}
.dk-person.lead{background:var(--vp);border-color:var(--vp)}
.dk-person .role{font-size:.8rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--vm)}
.dk-person.lead .role{color:var(--ac)}
.dk-person h3{font-size:2rem;color:var(--vp);margin:.55rem 0 .2rem}
.dk-person.lead h3{color:#fff}
.dk-person .full{font-size:.98rem;color:var(--muted);margin-bottom:1.2rem}
.dk-person.lead .full{color:rgba(245,245,240,.6)}
.dk-person ul{list-style:none}
.dk-person li{font-size:1.02rem;line-height:1.4;color:var(--ink-70);padding:.55rem 0 .55rem 1.5rem;position:relative;border-top:1px solid var(--line)}
.dk-person.lead li{color:rgba(245,245,240,.84);border-top-color:rgba(245,245,240,.12)}
.dk-person li:first-child{border-top:none}
.dk-person li::before{content:"";position:absolute;left:0;top:1.02rem;width:7px;height:7px;border-radius:50%;background:var(--ac)}
.dk-person li b{font-weight:600;color:var(--vp)}
.dk-person.lead li b{color:#fff}

/* --- FODA --- */
.dk-foda{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:auto 0}
.dk-foda > div{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:24px 28px}
.dk-foda > div.in{border-top:3px solid var(--vm)}
.dk-foda > div.out{border-top:3px solid var(--ac)}
.dk-foda h4{font-size:.82rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--vm);margin-bottom:.7rem}
.dk-foda ul{list-style:none}
.dk-foda li{font-size:1.02rem;line-height:1.38;color:var(--ink-70);padding:.32rem 0 .32rem 1.3rem;position:relative}
.dk-foda li::before{content:"";position:absolute;left:0;top:.82rem;width:6px;height:6px;border-radius:50%;background:var(--ac)}

/* --- Brecha financiera --- */
.dk-gap{display:grid;grid-template-columns:1fr 1fr 1fr;gap:28px;margin:auto 0;align-items:stretch}
.dk-gap > div{border-radius:20px;padding:40px 36px;background:var(--surface);border:1px solid var(--line)}
.dk-gap > div.dark{background:var(--vp);border-color:var(--vp)}
.dk-gap .dk-kpi{font-size:4.2rem;margin:1rem 0 .8rem}
.dk-gap > div.dark .dk-lab{color:var(--ac2)}
.dk-gap > div.dark .dk-kpi{color:var(--ac)}
.dk-gap > div.dark .dk-kpi small{color:rgba(245,245,240,.62)}
.dk-gap p{font-size:1.08rem;color:var(--ink-70);line-height:1.45}
.dk-gap > div.dark p{color:rgba(245,245,240,.8)}
.dk-bar{height:10px;border-radius:999px;background:var(--surface-2);margin-top:1.4rem;overflow:hidden}
.dk-bar i{display:block;height:100%;background:var(--vm);border-radius:999px}

/* --- Tabla de uso de fondos --- */
.dk-funds{display:grid;grid-template-columns:1.12fr 1fr .95fr;gap:36px;margin-top:26px;align-items:start}
.idx-grid.three{grid-template-columns:repeat(3,1fr);gap:48px}
.dk-tbl{width:100%;border-collapse:collapse;font-size:.98rem}
.dk-tbl caption{text-align:left;font-size:.78rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--vm);padding-bottom:.5rem}
.dk-tbl td{padding:.36rem 0;border-bottom:1px solid var(--line-soft);color:var(--ink-70);line-height:1.3}
.dk-tbl td.m{text-align:right;font-weight:500;color:var(--vp);white-space:nowrap;padding-left:1rem}
.dk-tbl tr.sub td{border-bottom:none;border-top:1.5px solid var(--vp);font-weight:600;color:var(--vp);padding-top:.5rem}
.dk-tbl + .dk-tbl{margin-top:1.3rem}
.dk-totals{background:var(--vp);border-radius:20px;padding:30px 32px;color:var(--cr);display:flex;flex-direction:column}
.dk-totals .t{display:flex;justify-content:space-between;align-items:baseline;padding:.85rem 0;border-top:1px solid rgba(245,245,240,.14);font-size:1.05rem;color:rgba(245,245,240,.78)}
.dk-totals .t:first-of-type{border-top:none}
.dk-totals .t b{font-size:1.5rem;font-weight:600;color:#fff;letter-spacing:-.01em}
.dk-totals .t.hl{margin:.4rem -14px;padding:1rem 14px;background:rgba(52,211,153,.12);border-radius:12px;border-top:none}
.dk-totals .t.hl b{color:var(--ac);font-size:2rem}
.dk-totals .t.hl + .t{border-top:none}
.dk-totals .fn{margin-top:auto;padding-top:1rem;font-size:.84rem;line-height:1.45;color:rgba(245,245,240,.6)}

/* --- Etapas de desembolso --- */
.dk-stages{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:34px;position:relative}
.dk-stage{padding:0 32px 0 0;position:relative}
.dk-stage::before{content:"";display:block;height:3px;background:var(--line);margin-bottom:26px}
.dk-stage.on::before{background:var(--ac)}
.dk-stage .dot{position:absolute;top:-7px;left:0;width:17px;height:17px;border-radius:50%;background:var(--cr);border:3px solid var(--vm)}
.dk-stage .k{font-size:.8rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--vm)}
.dk-stage .dk-amt{font-size:2.4rem;font-weight:700;letter-spacing:-.03em;color:var(--vp);margin:.4rem 0 .6rem;line-height:1}
.dk-stage p{font-size:1.02rem;color:var(--ink-70);line-height:1.42}
.dk-stage p b{color:var(--vp);font-weight:600}

/* --- Solicitud principal --- */
.dk-ask{display:grid;grid-template-columns:1.1fr 1fr;gap:48px;align-items:end}
.dk-ask .dk-kpi{font-size:6.2rem;color:var(--vm)}
.dk-alt{border-left:3px solid var(--ac);padding:.4rem 0 .4rem 1.6rem}
.dk-alt .v{font-size:2.1rem;font-weight:700;color:var(--vp);letter-spacing:-.02em;margin:.35rem 0 .3rem}
.dk-alt p{font-size:1.02rem;color:var(--ink-70);line-height:1.42}

/* --- Preguntas frecuentes (anexo, denso) --- */
.dk-faq{display:grid;grid-template-columns:1fr 1fr;gap:18px 40px;margin-top:30px}
.dk-faq > div{padding:18px 0 0;border-top:1px solid var(--line)}
.dk-faq h4{font-size:1.14rem;font-weight:600;color:var(--vp);margin-bottom:.45rem;line-height:1.3}
.dk-faq p{font-size:.98rem;color:var(--ink-70);line-height:1.46}
.dk-faq p b{color:var(--vp);font-weight:600}

/* --- Modo presentación (pantalla) ---
   El JS agrega .is-present al body: se ve una slide a la vez, escalada
   al viewport, con navegación por teclado. Al imprimir se ignora y
   salen todas las slides apiladas (1 slide = 1 página). */
.dk-nav{display:none}
@media screen{
  body.is-present{background:#07170E;overflow:hidden;height:100vh}
  body.is-present .s{position:absolute;left:50%;top:50%;margin:0;box-shadow:0 30px 90px rgba(0,0,0,.45);transform-origin:center center;display:none}
  body.is-present .s.is-cur{display:flex}
  body.is-present .dk-nav{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:50;align-items:center;justify-content:center;gap:18px;padding:14px 20px calc(14px + env(safe-area-inset-bottom,0px));font-family:'Space Grotesk',system-ui,sans-serif}
  .dk-nav button{appearance:none;border:1px solid rgba(245,245,240,.22);background:rgba(245,245,240,.06);color:#F5F5F0;width:44px;height:44px;border-radius:12px;font:inherit;font-size:1.1rem;cursor:pointer;transition:background .15s ease,border-color .15s ease,transform .15s ease}
  .dk-nav button:hover{background:rgba(52,211,153,.16);border-color:var(--ac)}
  .dk-nav button:active{transform:scale(.96)}
  .dk-nav button:focus-visible{outline:2px solid var(--ac);outline-offset:2px}
  .dk-nav button:disabled{opacity:.3;cursor:default}
  .dk-nav .ct{min-width:84px;text-align:center;font-size:.9rem;letter-spacing:.12em;color:rgba(245,245,240,.7);font-variant-numeric:tabular-nums}
  .dk-nav .mode{width:auto;padding:0 16px;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase}
  .dk-prog{position:fixed;left:0;top:0;height:3px;background:var(--ac);z-index:60;transition:transform .25s ease;transform-origin:left;width:100%}
  body:not(.is-present) .dk-prog{display:none}
  body:not(.is-present) .dk-nav{display:flex;position:fixed;right:20px;bottom:20px;left:auto;z-index:50}
  body:not(.is-present) .dk-nav [data-nav]:not(.mode),body:not(.is-present) .dk-nav .ct{display:none}
  body:not(.is-present) .dk-nav .mode{background:var(--vp);border-color:var(--vp)}
}
@media print{.dk-nav,.dk-prog{display:none!important}}

/* --- Portada mínima: marca + una línea. Para decks que se presentan
   en vivo: la portada no se lee, se muestra. --- */
.cover-min{background:var(--vp)}
.cover-min .s-pad{justify-content:space-between;padding:96px 120px 84px}
.logo.xl{gap:1.6rem}
.logo.xl .iso{width:120px;height:112px}
.logo.xl .wm{font-size:5.4rem;letter-spacing:-.055em}
.logo.xl .wm small{font-size:inherit;font-weight:300;color:var(--ac);margin-left:.18em;letter-spacing:-.04em}
.cover-min .logo{margin:auto 0}
.cover-min .line{font-size:1rem;font-weight:500;letter-spacing:.24em;text-transform:uppercase;color:rgba(245,245,240,.55);padding-top:30px;border-top:1px solid rgba(255,255,255,.12)}
.cover-min .line b{color:var(--ac2);font-weight:600}

/* --- Slides de una sola idea (versión para presentar en vivo) --- */
.dk-one .s-pad{justify-content:center}
.dk-one .eyebrow{margin-bottom:2rem}
.dk-say{font-size:5.2rem;font-weight:600;letter-spacing:-.04em;line-height:1.04;color:var(--vp);max-width:1120px}
.dk-say em{font-style:normal;color:var(--vm)}
.dk-one.dark{background:var(--vp)}
.dk-one.dark .eyebrow{color:var(--ac2)}
.dk-one.dark .dk-say{color:#fff}.dk-one.dark .dk-say em{color:var(--ac)}
.dk-one.dark .folio{color:rgba(245,245,240,.4);border-top-color:rgba(255,255,255,.14)}
.dk-one.dark .folio .c{color:var(--ac2)}
.dk-huge{font-size:13rem;font-weight:700;letter-spacing:-.06em;line-height:.9;color:var(--vm)}
.dk-huge small{font-size:2.4rem;font-weight:500;letter-spacing:-.01em;color:var(--muted);margin-left:.6rem}
.dk-one.dark .dk-huge{color:var(--ac)}.dk-one.dark .dk-huge small{color:rgba(245,245,240,.6)}
.dk-cap{font-size:1.9rem;font-weight:500;letter-spacing:-.015em;color:var(--ink-70);margin-top:2rem;max-width:1000px;line-height:1.3}
.dk-one.dark .dk-cap{color:rgba(245,245,240,.8)}
.dk-src{position:absolute;right:120px;bottom:88px;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:var(--faint);z-index:3}
.dk-one.dark .dk-src{color:rgba(245,245,240,.4)}
.dk-trio{display:grid;grid-template-columns:repeat(3,1fr);gap:48px;margin-top:3rem}
.dk-trio .v{font-size:5.4rem;font-weight:700;letter-spacing:-.045em;line-height:1;color:var(--vp)}
.dk-trio .v.m{color:var(--vm)}
.dk-one.dark .dk-trio .v{color:#fff}.dk-one.dark .dk-trio .v.m{color:var(--ac)}
.dk-trio .l{font-size:1.35rem;color:var(--ink-70);margin-top:1rem;line-height:1.3}
.dk-one.dark .dk-trio .l{color:rgba(245,245,240,.72)}
.dk-words{display:flex;flex-wrap:wrap;gap:14px;margin-top:3rem}
.dk-words span{font-size:1.5rem;font-weight:500;color:var(--vp);border:1.5px solid var(--line);background:var(--surface);border-radius:999px;padding:.7rem 1.6rem}
.dk-words span.on{background:var(--vp);border-color:var(--vp);color:var(--ac)}
.dk-vs{display:grid;grid-template-columns:1fr auto 1fr;gap:56px;align-items:end;margin-top:1rem}
.dk-vs .v{font-size:7.4rem;font-weight:700;letter-spacing:-.05em;line-height:1;color:var(--vp)}
.dk-vs .v.m{color:var(--vm)}
.dk-vs .l{font-size:1.35rem;color:var(--ink-70);margin-top:1rem}
.dk-vs .x{font-size:2rem;color:var(--faint);padding-bottom:3.4rem}

/* --- QR a experiencia en vivo. El QR siempre sobre blanco puro con
   margen propio (zona de silencio) para que escanee desde proyector. --- */
.dk-qr{display:grid;grid-template-columns:1fr auto;gap:96px;align-items:center;margin:auto 0}
.dk-qr-card{background:#fff;border-radius:28px;padding:16px 16px 30px;box-shadow:0 24px 70px rgba(13,40,24,.18);display:flex;flex-direction:column;align-items:center}
.dk-qr-code{position:relative;width:400px;height:400px}
.dk-qr-code svg{width:100%;height:100%;display:block}
.dk-qr-code .mk{position:absolute;left:50%;top:50%;width:76px;height:76px;transform:translate(-50%,-50%);background:var(--vp);border-radius:18px;border:6px solid #fff;display:flex;align-items:center;justify-content:center}
.dk-qr-code .mk svg{width:44px;height:42px}
.dk-qr-card .u{margin-top:4px;font-size:1rem;font-weight:500;letter-spacing:.04em;color:var(--vm)}
.dk-qr .dk-say{font-size:4.6rem}
.dk-qr .dk-cap{font-size:1.5rem;margin-top:1.6rem;max-width:640px}
.dk-one.dark .dk-qr-card{box-shadow:0 24px 70px rgba(0,0,0,.35)}

/* --- Citas y referencias (APA 7). Cada dato lleva una marca [n] que
   apunta a la lista de fuentes del anexo. Así cualquier cifra se puede
   rastrear en la reunión. --- */
.ref{font-size:.42em;font-weight:600;letter-spacing:.02em;vertical-align:super;line-height:0;color:var(--vm);margin-left:.18em;font-variant-numeric:tabular-nums}
.dark .ref,.cover .ref,.dk-one.dark .ref,.dk-res.hero .ref,.dk-person.lead .ref,.dk-totals .ref,.model .box.accent .ref,.dk-gap .dark .ref{color:var(--ac2)}
.dk-refs{columns:2;column-gap:56px;margin-top:18px;list-style:none;counter-reset:none}
.dk-refs li{break-inside:avoid;display:grid;grid-template-columns:34px 1fr;gap:.2rem;font-size:.8rem;line-height:1.38;color:var(--ink-70);padding:.4rem 0;border-top:1px solid var(--line-soft)}
.dk-refs li .n{font-weight:600;color:var(--vm);font-variant-numeric:tabular-nums}
.dk-refs li i{font-style:italic}
.dk-refs li .u{color:var(--vm);word-break:break-all}
.dk-refs li .t{display:inline-block;font-size:.66rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;padding:.1rem .45rem;border-radius:5px;margin-left:.35rem;vertical-align:1px}
.dk-refs li .t.of{background:rgba(6,95,70,.1);color:var(--vm)}
.dk-refs li .t.me{background:var(--surface-2);color:var(--muted)}
.dk-refs li .t.in{background:rgba(184,117,3,.1);color:var(--warn-ink)}
.dk-refs-key{display:flex;gap:1.6rem;margin-top:14px;font-size:.78rem;color:var(--muted)}
/* En cifras protagonistas la marca de cita no crece con la cifra */
.dk-huge .ref,.dk-kpi .ref,.dk-res .big .ref,.dk-trio .v .ref,.dk-vs .v .ref{font-size:1.05rem;letter-spacing:.02em;margin-left:.3em;vertical-align:top;position:relative;top:.5em;line-height:1}

/* ============================================================
   CONTRATO MEXICANO (.fver) · proemio, declaraciones, cláusulas
   ordinales y rúbricas al margen. Estructura de contrato civil en
   Querétaro: proemio → antecedentes → declaraciones → cláusulas →
   cierre por duplicado. Ver memoria reference-contrato-mx-queretaro.
   ============================================================ */
.fver .proemio{font-size:12.5px;line-height:1.75;text-transform:uppercase;letter-spacing:.03em;font-weight:500;color:var(--vp);text-align:justify;max-width:var(--m-text);margin-bottom:1.2rem}
.fver .seccion-t{font-size:12px;letter-spacing:.26em;text-transform:uppercase;font-weight:700;color:var(--vm);text-align:center;max-width:var(--m-text);margin:1.2rem 0 .9rem}
.fver .decl-t{font-size:13px;font-weight:700;color:var(--vp);text-transform:uppercase;letter-spacing:.06em;margin:1rem 0 .5rem}
.fver p.cl{text-align:justify}
.fver p.cl>b.n,.fver p.dc>b.n{font-weight:700;color:var(--vp)}
.fver p.dc{text-align:justify;padding-left:2.4rem;text-indent:-2.4rem}
.fver p.cierre{font-size:12.5px;line-height:1.75;text-transform:uppercase;letter-spacing:.03em;font-weight:500;color:var(--vp);text-align:justify}
.fver .montos td.txt small{display:block;font-size:11px;color:var(--muted);font-weight:400;margin-top:2px}
.fver .anexo-t{font-size:11px;letter-spacing:.24em;text-transform:uppercase;font-weight:700;color:var(--vm);margin-bottom:.4rem}
.fver-ft .rub{display:flex;gap:14px;align-items:center}
.fver-ft .rub i{display:inline-block;width:70px;border-bottom:1px solid var(--faint);height:12px;font-style:normal}
.fver .testigos{margin-top:1.6rem}