/* ══ Tokens y arranque ═════════════════════════════════════════════ */
/* ══════════════════════════════════════════════════════════════
   BREMMAK — la casa que remite
   ══════════════════════════════════════════════════════════════
   Papel de estraza, tinta café y un verde profundo: el sobre que
   se manda. Esquina redondeada a 10 px, al revés que una cuenta de
   esquina viva — dos casas claras no pueden compartir la forma.

   El papel va MUY cálido a propósito: los otros claros del grupo
   tienen sesgo +5, −5, 0 y +6; éste va en +23, que es lo que hace
   que se lea como estraza y no como blanco.
   ══════════════════════════════════════════════════════════════ */
:root{--redondo:99px;   /* la pieza redonda entera: numerales y pastillas */
  /* la escala de espaciado: los escalones que ya mandaban en la hoja */
  --e1:.4rem;
  --e2:.5rem;
  --e3:.6rem;
  --e4:.75rem;
  --e5:.9rem;
  --e6:1rem;
  --e7:1.25rem;
  --e8:1.5rem;
  --e9:2rem;
  --e10:2.5rem;
  --e11:3rem;
  --e12:4rem;
  /* — papel — */
  --papel:#F3EADC;       /* el sobre */
  --papel-2:#FAF5EC;     /* la hoja dentro */
  --papel-3:#FFFFFF;     /* la etiqueta */
  --filete:#E0D3BE;      /* separación */
  --filete-2:#94856E;    /* borde de control: 3.02:1, el más claro que cumple */

  /* — tinta — */
  --tinta:#1A140E;       /* principal — 15.31:1 */
  --tinta-2:#4A3F31;     /* secundario — 8.61:1 */
  --apoyo:#6E6252;       /* apoyo — 4.99:1 */

  /* — sobre verde — */
  --verde:#1D6B4A;       /* 5.41:1 sobre el papel; ninguna hermana lo usa */
  --verde-2:#E3EFE7;
  --verde-ink:#FFFFFF;

  /* — estados — */
  --ok:#1D6B4A;   --ok-2:#E3EFE7;
  --pausa:#8A5A00; --pausa-2:#F7EDD9;
  --alto:#A32A22; --alto-2:#F7E6E4;

  /* — tipografía — */
  --fd:"Funnel Display","Karla",system-ui,sans-serif;
  --fs:"Karla",system-ui,-apple-system,"Segoe UI",sans-serif;

  /* — medidas — */
  --ancho:1100px;
  --gut:clamp(1.25rem,4vw,2.5rem);
  --ctrl:10px;           /* redondeado: el sobre, no la cuenta */
  --t:.18s;
  --paso:.34s;}
*,*::before,*::after{box-sizing:border-box}
html{font-size:100%;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--papel);color:var(--tinta);
  font-family:var(--fs);font-size:1rem;line-height:1.62;font-synthesis-weight:none}
@media (prefers-reduced-motion:reduce){
*{animation:none!important;transition:none!important}
}
/* ── fin del pacto ── */
/* ── el riel ───────────────────────────────────────────────────────
   Arquetipo propio de esta casa: la navegación vive en una columna
   fija a la izquierda y el contenido corre a su derecha. Bajo 1000 px
   vuelve a ser barra superior, que es lo único que cabe. */
:root{--riel:252px}
@media (min-width:1000px){
body{padding-left:var(--riel)}
}
/* ── fin del panel ── */
/* ── el sistema de medidas ─────────────────────────────────────────
   El alto de los controles sale de un token, no del relleno: así el
   botón y el campo que van juntos miden lo mismo. Antes el mismo
   componente caía en alturas distintas según dónde estuviera. */
:root{--h-ctrl:48px;      /* botón y campo */
  --h-ctrl-lg:56px;   /* la variante grande */
  --h-ctrl-sm:36px;   /* la variante compacta */
  --e1:.35rem; --e2:.6rem; --e3:.9rem;
  --e4:1.25rem; --e5:1.75rem; --e6:2.5rem;}

/* ══ Base tipográfica ══════════════════════════════════════════════ */
img,svg,video{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3{font-family:var(--fd);font-weight:700;line-height:1.1;
  letter-spacing:-.015em;margin:0;text-wrap:balance}
p{margin:0;text-wrap:pretty}
h1{font-size:clamp(2rem,1.15rem + 3vw,3.5rem)}
h2{font-size:clamp(1.5rem,1.1rem + 1.6vw,2.25rem)}
h3{font-size:clamp(1.0625rem,1rem + .4vw,1.25rem)}
ul,ol{margin:0;padding:0;list-style:none}
:focus-visible{outline:2px solid var(--verde);outline-offset:2px}
::selection{background:var(--verde);color:var(--verde-ink)}
.bk-barra__in{display:flex;align-items:center;gap:var(--e8);min-height:70px}
.bk-logo{display:inline-flex;align-items:center;gap:.279em;
  font-family:var(--fd);font-weight:800;letter-spacing:-.02em;
  font-size:1.1875rem;color:var(--tinta);text-decoration:none}
.bk-nav{display:flex;gap:var(--e7);margin-left:auto;font-size:.9375rem}
.bk-barra__acc{display:flex;align-items:center;gap:var(--e5);margin-left:auto}
.bk-idioma{display:flex;gap:var(--e1);font-size:.8125rem;color:var(--apoyo)}
.bk-enlace{font-size:.9375rem;text-decoration:underline;text-underline-offset:3px}
.bk-b{display:inline-flex;align-items:center;justify-content:center;gap:var(--e2);
  font-family:var(--fd);font-weight:600;font-size:.9375rem;line-height:1;
  padding:var(--e4) var(--e7);border-radius:var(--ctrl);text-decoration:none;
  border:1px solid transparent;cursor:pointer;
  transition:background var(--t),border-color var(--t),color var(--t)}
.bk-b--verde{background:var(--verde);color:var(--verde-ink);border-color:var(--verde)}
.bk-b--linea{background:transparent;color:var(--tinta);border-color:var(--filete-2)}
.bk-b--grande{padding:var(--e6) var(--e8);font-size:1rem}
.bk-b--chico{padding:var(--e1) var(--e4);font-size:.8125rem}
.bk-b--ancho{width:100%;margin-top:var(--e7)}
.bk-eyebrow{font-family:var(--fd);font-weight:600;font-size:.75rem;
  letter-spacing:.16em;text-transform:uppercase;color:var(--verde)}
.bk-hero__d{margin-top:var(--e7);font-size:clamp(1.0625rem,1rem + .35vw,1.1875rem);
  color:var(--tinta-2);max-width:48ch}
.bk-hero__acc{margin-top:var(--e9);display:flex;flex-wrap:wrap;gap:var(--e4)}
/* La ruta: de tu dólar a su destino, en una sola línea. Es la pieza
   gráfica del hero y no se repite en ninguna otra zona. */
.bk-ruta{margin-top:clamp(2.25rem,5vw,3.25rem);display:flex;align-items:center;
  gap:var(--e5);flex-wrap:wrap}
.bk-ruta__p{display:flex;align-items:center;gap:var(--e3);background:var(--papel-3);
  border:1px solid var(--filete);border-radius:var(--ctrl);padding:var(--e4) var(--e6)}
.bk-etapas{margin-top:var(--e9);border-top:1px solid var(--filete-2)}
.bk-etapa__n{flex:none;width:2rem;height:2rem;border-radius:var(--redondo);
  background:var(--verde-2);color:var(--verde);display:grid;place-items:center;
  font-size:.8125rem;font-weight:700;font-variant-numeric:tabular-nums}
.bk-etapa__mas{margin-left:auto;flex:none;color:var(--apoyo);
  transition:transform var(--t)}
.bk-etapa__c{padding:0 0 var(--e7) var(--e11);color:var(--tinta-2);max-width:62ch}
.bk-tabla-caja{margin-top:var(--e9);background:var(--papel-3);
  border:1px solid var(--filete-2);border-radius:var(--ctrl);overflow:hidden}
.bk-tabla{width:100%;border-collapse:collapse;font-size:.9375rem}
.bk-tabla__nota{padding:var(--e5) var(--e7);background:var(--papel-2);
  border-top:1px solid var(--filete);font-size:.8125rem;color:var(--apoyo)}
.bk-campo{display:block;margin-bottom:var(--e7)}
.bk-campo input,.bk-campo select,.bk-campo textarea, .bk-acceso input[type=email],.bk-acceso input[type=password], .bk-acceso input[type=text],.bk-acceso input[type=tel]{width:100%;font:inherit;color:var(--tinta);background:var(--papel-3);
  border:1px solid var(--filete-2);border-radius:var(--ctrl);
  padding:var(--e4) var(--e5);transition:border-color var(--t),box-shadow var(--t)}
.bk-campo input:focus,.bk-campo select:focus,.bk-campo textarea:focus, .bk-acceso input:focus{outline:0;border-color:var(--verde);
  box-shadow:0 0 0 3px var(--verde-2)}
.bk-forma{margin-top:var(--e9);display:grid;gap:0 var(--e7);
  grid-template-columns:minmax(0,1fr)}
.bk-nota{display:flex;align-items:flex-start;gap:var(--e3);padding:var(--e5) var(--e6);
  border:1px solid var(--filete-2);border-radius:var(--ctrl);margin-bottom:var(--e7);
  font-size:.9375rem}
.bk-chip{display:inline-flex;align-items:center;padding:.22rem var(--e3);
  font-size:.75rem;font-weight:700;border:1px solid currentColor;border-radius:var(--redondo)}
.bk-pie{margin-top:clamp(2.5rem,6vw,4.5rem);border-top:1px solid var(--filete-2);
  padding-top:clamp(2rem,4vw,3rem);font-size:.9375rem}
.bk-pie__in{display:grid;gap:var(--e9);grid-template-columns:minmax(0,1fr)}
.bk-pie__d{color:var(--apoyo);max-width:34ch}
.bk-pagos{display:flex;flex-wrap:wrap;gap:var(--e1);margin-top:var(--e6)}
.bk-pie__cierre{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--e2);
  margin-top:var(--e9);padding:var(--e6) 0 var(--e8);border-top:1px solid var(--filete);
  font-size:.8125rem;color:var(--apoyo)}
.bk-acceso__d{margin:var(--e3) 0 var(--e8);color:var(--apoyo);font-size:.9375rem}
.bk-acceso__pie{margin-top:var(--e7);padding-top:var(--e7);border-top:1px solid var(--filete);
  font-size:.875rem;color:var(--apoyo)}
.bk-casilla{display:flex;gap:var(--e3);align-items:flex-start;margin-top:var(--e6);font-size:.875rem}
.bk-casilla--legal{color:var(--tinta-2)}
@media (max-width:900px){
.bk-nav{display:none}
}
@media (max-width:520px){
.bk-idioma{display:none}
}
/* ══════════════════════════════════════════════════════════════
   PANTALLAS INTERNAS — mostrador, comprobante y autorizaciones
   ══════════════════════════════════════════════════════════════
   Mismo fondo que las hermanas y otra forma: aquí todo va en
   tarjetas redondeadas sobre papel de estraza, con el verde sólo
   en lo que se puede pulsar. Nada de filetes a hueso.
   ══════════════════════════════════════════════════════════════ */
.bk-word{display:inline-block}
.bk-apagado{color:var(--apoyo)}
.bk-marca-agua{font-family:var(--fd);font-weight:600;font-size:.75rem;
  letter-spacing:.16em;text-transform:uppercase;color:var(--verde)}
.bk-marca-agua--alto{color:var(--alto)}
.bk-app__cab{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;
  gap:var(--e6);margin-bottom:var(--e9)}
.bk-app__estado{display:flex;align-items:center;gap:var(--e2);font-size:.9375rem;color:var(--tinta-2)}
/* El asiento: los tres totales, en pastillas y no en celdas con filete. */
.bk-cambio,.bk-asiento{display:grid;gap:var(--e5);grid-template-columns:minmax(0,1fr);margin-bottom:var(--e9)}
/* El mostrador: la remesa nueva a la izquierda, lo enviado a la derecha. */
.bk-escritorio{display:grid;gap:var(--e8);grid-template-columns:minmax(0,1fr);align-items:start}
.bk-cuenta__cab{display:flex;align-items:baseline;justify-content:space-between;gap:var(--e6);
  padding:var(--e5) var(--e7);background:var(--verde);color:var(--verde-ink)}
.bk-cuenta__r{display:flex;align-items:baseline;justify-content:space-between;gap:var(--e6);
  padding:var(--e5) var(--e7);border-bottom:1px solid var(--filete)}
.bk-cuenta__pie{padding:var(--e4) var(--e7);border-top:1px solid var(--filete);
  background:var(--papel-2);font-size:.75rem;color:var(--apoyo)}
.bk-asiento-chico{margin:var(--e7) 0 0;border:1px solid var(--filete);
  border-radius:var(--ctrl);overflow:hidden;background:var(--papel-2)}
/* El monto: la moneda en pastilla, no pegada al campo. */
.bk-monto{display:flex;align-items:stretch;border:1px solid var(--filete-2);
  border-radius:var(--ctrl);background:var(--papel-3);overflow:hidden}
.bk-monto__m{display:flex;align-items:center;padding:0 var(--e5);background:var(--papel-2);
  border-right:1px solid var(--filete);font-family:var(--fd);font-weight:700;
  font-size:.8125rem;color:var(--apoyo)}
.bk-monto input{flex:1;min-width:0;border:0;background:transparent;font:inherit;
  font-family:var(--fd);font-weight:700;font-size:1.375rem;padding:var(--e3) var(--e5);
  font-variant-numeric:tabular-nums}
.bk-monto input:focus{outline:0}
[data-monto-msg]{display:block;margin-top:var(--e1);font-size:.8125rem;color:var(--apoyo)}
[data-billetera] input{width:100%;font:inherit;font-family:var(--fd);background:var(--papel-3);
  border:1px solid var(--filete-2);border-radius:var(--ctrl);padding:var(--e4) var(--e5);
  overflow-wrap:anywhere}
[data-billetera] input:focus{outline:0;border-color:var(--verde);box-shadow:0 0 0 3px var(--verde-2)}
@keyframes bk-gira{
to{transform:rotate(360deg)}
}
main input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=hidden]), footer input:not([type=checkbox]):not([type=hidden]){min-height:var(--h-ctrl);box-sizing:border-box;padding-block:0}
/* el desplegable trae relleno propio del navegador y su alto natural se salta
   el mínimo: aquí va fijo, o queda de 2 a 7px más alto que el campo de al lado */
main select{height:var(--h-ctrl);min-height:var(--h-ctrl);box-sizing:border-box;padding-block:0}
main textarea{min-height:calc(var(--h-ctrl) * 2.8);box-sizing:border-box}

/* ══ Contenedor y zonas ════════════════════════════════════════════ */
.bk-ancho{width:min(var(--ancho),100% - var(--gut)*2);margin-inline:auto}
.bk-sec{padding:clamp(2.75rem,6vw,4.5rem) 0;border-top:1px solid var(--filete)}
.bk-sec__cab{max-width:54ch}
.bk-sec__cab p{margin-top:var(--e4);color:var(--tinta-2)}

/* ══ Cabecera ══════════════════════════════════════════════════════ */
.bk-barra{background:var(--papel);border-bottom:1px solid var(--filete);
  position:sticky;top:0;z-index:40}
.bk-nav a{color:var(--tinta-2);text-decoration:none;padding-block:var(--e1);
  border-radius:var(--redondo);padding-inline:var(--e3);transition:background var(--t),color var(--t)}
.bk-nav a:hover,.bk-nav a.is-aqui{color:var(--verde);background:var(--verde-2)}
.bk-nav + .bk-barra__acc{margin-left:0}
.bk-idioma a{text-decoration:none}
.bk-idioma a[aria-current]{color:var(--verde);font-weight:700}
@media (max-width:900px){
.bk-barra__acc{margin-left:auto}
}
@media (max-width:520px){
.bk-barra__in{gap:var(--e4)}
}
/* ── La marca en la barra ───────────────────────────────────────
   0.796 em = 1,18 mayúsculas de esta tipografía, que mide 0.675 em.
   El min-width:0 NO sobra: los hijos de un contenedor flexible nacen
   con min-width:auto y eso le pone un suelo de 1em a la insignia,
   ignorando el ancho en silencio. */
/* La marca es VERTICAL (0,695:1): manda el alto y el ancho va en auto. Fijar
   los dos, como estaba, la encajonaba en un cuadrado.
   1.09em sale del arte: la marca vale 1,528 veces el alto de la palabra y
   «Bremmak» en Funnel Display 800 mide .715em. 1,528 x .715 = 1.09em.
   El min-height:0 no sobra, y aquí se notaba: Bricks trae
   `svg:not([height]){min-height:1em}` y le ponía suelo de 20 px al alto, así
   que el 0.796em declarado NUNCA se aplicó —la marca salía encajada en una
   caja de 20 px con aire arriba y abajo, sin dar ningún error—. */
.bk-marca{height:1.09em;width:auto;min-width:0;min-height:0;flex:none;display:block}
@media (min-width:1000px){
.bk-barra{position:fixed;inset:0 auto 0 0;width:var(--riel);
    border-right:1px solid var(--filete);border-bottom:0;
    display:flex;padding:1.7rem var(--e7);overflow:auto}
.bk-barra__in{flex-direction:column;align-items:flex-start;
    gap:var(--e9);min-height:0;flex:1;width:100%;margin-inline:0}
.bk-barra .bk-logo{font-size:1.25rem}
.bk-nav{flex-direction:column;gap:.1rem;margin-left:0;width:100%;font-size:.9375rem}
.bk-nav a{width:100%;padding:var(--e2) var(--e4);border-radius:var(--ctrl)}
.bk-barra__acc{flex-direction:column;align-items:stretch;gap:var(--e4);
    margin-left:0;margin-top:auto;width:100%}
.bk-barra__acc .bk-b,.bk-barra__acc .bk-enlace{text-align:center}
.bk-idioma{justify-content:center}
}

/* ══ Botones ═══════════════════════════════════════════════════════ */
.bk-b--verde:hover{background:#155238;border-color:#155238}
.bk-b--linea:hover{border-color:var(--tinta);background:var(--papel-2)}
.bk-b--alto{background:var(--alto);color:#fff;border-color:var(--alto)}
/* El botón que el guion del panel emite con el nombre de la casa. */
.bk-b--sobre{background:var(--verde);color:var(--verde-ink);border-color:var(--verde)}
.bk-b--sobre:hover{background:#155238;border-color:#155238}
.bk-b{min-height:var(--h-ctrl);padding-block:0;box-sizing:border-box}
.bk-b--grande{min-height:var(--h-ctrl-lg);padding-block:0}
.bk-b--chico{min-height:var(--h-ctrl-sm);padding-block:0}

/* ══ Campos y controles ════════════════════════════════════════════ */
.bk-campo > span{display:block;font-size:.8125rem;font-weight:600;
  color:var(--tinta-2);margin-bottom:var(--e1)}
.bk-campo textarea{min-height:8rem;resize:vertical}
.bk-trampa{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.bk-casilla input{margin-top:.2rem;flex:none;accent-color:var(--verde)}
.bk-casilla--legal a{color:var(--verde);text-underline-offset:3px}
.bk-grupo{border:0;margin:0 0 var(--e9);padding:var(--e7) 0 0;border-top:1px solid var(--filete)}
.bk-grupo:first-of-type{border-top:0;padding-top:0}
.bk-grupo legend{display:flex;align-items:center;gap:var(--e3);padding:0;
  font-family:var(--fd);font-weight:700;font-size:1rem}
.bk-grupo__n{flex:none;width:1.65rem;height:1.65rem;border-radius:var(--redondo);
  background:var(--verde-2);color:var(--verde);display:grid;place-items:center;
  font-size:.6875rem;font-weight:700;font-variant-numeric:tabular-nums}
.bk-grupo__d{margin:var(--e4) 0 var(--e7);font-size:.875rem;color:var(--apoyo);max-width:54ch}
.bk-par{display:grid;gap:0 var(--e7);grid-template-columns:minmax(0,1fr)}
@media (min-width:600px){
.bk-par{grid-template-columns:repeat(2,minmax(0,1fr))}
}
.bk-campo--sep{margin-top:var(--e7)}
.bk-condiciones{margin:0 0 var(--e7);background:var(--papel-2);border:1px solid var(--filete);
  border-radius:var(--ctrl);padding:var(--e5) var(--e6)}
.bk-condiciones li{position:relative;padding:var(--e1) 0 var(--e1) var(--e7);
  font-size:.8125rem;color:var(--tinta-2)}
.bk-condiciones li::before{content:"";position:absolute;left:0;top:.95rem;
  width:6px;height:6px;border-radius:var(--redondo);background:var(--verde)}
.bk-ranura{background:var(--papel-2);border:1px dashed var(--filete-2);
  border-radius:var(--ctrl);padding:var(--e5)}
.bk-ranura.is-puesta{border-style:solid;border-color:var(--verde);background:var(--verde-2)}
.bk-ranura.is-mal{border-style:solid;border-color:var(--alto);background:var(--alto-2)}
.bk-ranura__k{display:block;font-family:var(--fd);font-weight:700;font-size:.875rem;
  margin-bottom:var(--e3)}
.bk-ranura__k em{display:block;font-style:normal;font-weight:400;font-size:.75rem;color:var(--apoyo)}
.bk-ranura__v input[type=file]{width:100%;font:inherit;font-size:.8125rem}
.bk-ranura__img{width:100%;max-width:220px;margin-bottom:var(--e3);border-radius:var(--ctrl);
  border:1px solid var(--filete-2)}
.bk-ranura__pie{margin-top:var(--e2);font-size:.8125rem;color:var(--apoyo);overflow-wrap:anywhere}
.bk-ranura__aviso{margin-top:var(--e5);padding:var(--e4) var(--e5);font-size:.875rem;color:var(--alto);
  background:var(--alto-2);border:1px solid var(--alto);border-radius:var(--ctrl)}

/* ══ Contenedores de información ═══════════════════════════════════ */
.bk-rueda{overflow-x:auto}
.bk-tabla th{text-align:left;font-family:var(--fd);font-weight:600;font-size:.6875rem;
  letter-spacing:.1em;text-transform:uppercase;color:var(--apoyo);
  padding:var(--e5) var(--e7);border-bottom:1px solid var(--filete-2);white-space:nowrap}
.bk-tabla td{padding:var(--e4) var(--e7);border-bottom:1px solid var(--filete)}
.bk-tabla tr:last-child td{border-bottom:0}
.bk-tabla .n{font-family:var(--fd);font-weight:700;font-variant-numeric:tabular-nums;
  white-space:nowrap}
.bk-carta{background:var(--papel-2);border:1px solid var(--filete);
  border-radius:var(--ctrl);padding:var(--e7) var(--e8)}
.bk-carta .bk-i{color:var(--verde);margin-bottom:var(--e4)}
.bk-carta p{margin-top:var(--e1);color:var(--tinta-2)}
.bk-nota .bk-i{flex:none;margin-top:.15rem}
.bk-nota--ok{background:var(--ok-2);border-color:var(--ok)}
.bk-nota--wait{background:var(--pausa-2);border-color:var(--pausa)}
.bk-nota--bad{background:var(--alto-2);border-color:var(--alto)}
.bk-chip--ok{color:var(--ok);background:var(--ok-2)}
.bk-chip--wait{color:var(--pausa);background:var(--pausa-2)}
.bk-chip--bad{color:var(--alto);background:var(--alto-2)}
.bk-aviso-caja{background:var(--papel-3);border:1px solid var(--filete);
  border-radius:var(--ctrl);padding:clamp(1.5rem,4vw,2.4rem);max-width:44rem}
.bk-aviso-caja h2{margin:var(--e4) 0;font-size:clamp(1.25rem,1.05rem + .8vw,1.625rem)}
.bk-aviso-caja p{color:var(--tinta-2);max-width:56ch}
.bk-aviso-caja .bk-b{margin-top:var(--e8)}
/* La tarjeta: cabecera en el color de la casa y cuerpo claro. */
.bk-cuenta{background:var(--papel-3);border:1px solid var(--filete);
  border-radius:var(--ctrl);overflow:hidden}
.bk-cuenta__cab b{font-family:var(--fd);font-weight:700;font-size:.9375rem}
.bk-cuenta__cab span{font-size:.6875rem;letter-spacing:.12em;text-transform:uppercase;opacity:.88}
.bk-cuenta dl{margin:0}
.bk-cuenta__r:last-of-type{border-bottom:0}
.bk-cuenta__r--fuerte{background:var(--verde-2)}
.bk-cuenta__r--fuerte dd{color:var(--verde)}
.bk-cuenta dt{font-size:.6875rem;letter-spacing:.1em;text-transform:uppercase;color:var(--apoyo)}
.bk-cuenta dd{margin:0;font-family:var(--fd);font-weight:700;font-variant-numeric:tabular-nums}
.bk-cuenta__cuerpo{padding:var(--e7)}
.bk-cuenta--viva .bk-cuenta__cab span{opacity:1}
.bk-vacio{padding:var(--e10) var(--e8);text-align:center;color:var(--tinta-2)}
.bk-vacio .bk-i{margin:0 auto var(--e4);color:var(--filete-2)}
.bk-vacio__d{margin-top:var(--e1);font-size:.875rem;color:var(--apoyo)}

/* ══ Portada ═══════════════════════════════════════════════════════ */
.bk-hero{position:relative;isolation:isolate;padding:clamp(3rem,7vw,5.5rem) 0 clamp(2.5rem,5vw,4rem)}
.bk-hero h1{margin-top:var(--e5);max-width:18ch}
.bk-ruta__p b{font-family:var(--fd);font-weight:700;font-size:.9375rem}
.bk-ruta__p span{font-size:.75rem;color:var(--apoyo);display:block}
.bk-ruta__f{flex:1;min-width:2rem;height:2px;background:
  repeating-linear-gradient(to right,var(--filete-2) 0 6px,transparent 6px 12px)}
.bk-ruta .bk-i{color:var(--verde);flex:none}
.bk-etapa{border-bottom:1px solid var(--filete)}
.bk-etapa summary{display:flex;align-items:center;gap:var(--e6);padding:var(--e7) 0;
  cursor:pointer;list-style:none;font-family:var(--fd);font-weight:600;
  font-size:1.0625rem}
.bk-etapa summary::-webkit-details-marker{display:none}
.bk-etapa[open] .bk-etapa__mas{transform:rotate(45deg)}
@media (min-width:720px){
.bk-forma{grid-template-columns:repeat(2,minmax(0,1fr))}
.bk-forma__ancho{grid-column:1/-1}
.bk-cambio,.bk-asiento{grid-template-columns:repeat(3,minmax(0,1fr))}
}
.bk-cambio__c{background:var(--papel-3);border:1px solid var(--filete);
  border-radius:var(--ctrl);padding:var(--e5) var(--e7)}
.bk-cambio dt{font-size:.6875rem;letter-spacing:.1em;text-transform:uppercase;color:var(--apoyo)}
.bk-cambio dd{margin:var(--e1) 0 0;font-family:var(--fd);font-weight:700;
  font-size:clamp(1.375rem,1.1rem + 1vw,1.75rem);font-variant-numeric:tabular-nums}
.bk-cambio dd small{font-size:.6875rem;font-weight:600;color:var(--apoyo);margin-left:var(--e1)}
.bk-pestanas{display:flex;flex-wrap:wrap;gap:var(--e1);margin-bottom:var(--e6)}
.bk-pestanas button{display:inline-flex;align-items:center;gap:var(--e1);font:inherit;
  font-family:var(--fd);font-weight:600;font-size:.875rem;cursor:pointer;
  background:var(--papel-3);color:var(--tinta-2);border:1px solid var(--filete);
  border-radius:var(--redondo);padding:var(--e1) var(--e5);transition:background var(--t),color var(--t),border-color var(--t)}
.bk-pestanas button b{font-size:.75rem;font-variant-numeric:tabular-nums;color:var(--apoyo)}
.bk-pestanas button.is-on{background:var(--verde);border-color:var(--verde);color:var(--verde-ink)}
.bk-pestanas button.is-on b{color:var(--verde-ink);opacity:.85}
/* ── el fondo de la casa ───────────────────────────────────────────
   Vive a la derecha de la columna de texto, en el hueco que dejan el
   titular y la entradilla —medido, no supuesto—. Debajo de 900 px no
   hay hueco y se retira.

   El corte NO es un número a ojo: es el techo de la columna de texto
   —el mayor de los topes del titular y de la entradilla, 580px— más 40 de
   respiro. Si se ensancha alguno de esos dos topes, este número sube con él. */
.bk-hero::before{content:"";position:absolute;inset:0;z-index:-1;
  pointer-events:none;background:
    repeating-linear-gradient(64deg,transparent 0 17px,var(--filete) 17px 18px),
    repeating-linear-gradient(64deg,transparent 0 88px,var(--filete-2) 88px 90px);
  -webkit-mask-image:linear-gradient(to right,transparent 0 calc(max(var(--gut),(100% - var(--ancho))/2) + 620px),#000 calc(max(var(--gut),(100% - var(--ancho))/2) + 740px));mask-image:linear-gradient(to right,transparent 0 calc(max(var(--gut),(100% - var(--ancho))/2) + 620px),#000 calc(max(var(--gut),(100% - var(--ancho))/2) + 740px))}
@media (max-width:899px){
.bk-hero::before{display:none}
}
/* ── fin del fondo ── */
/* ── el pacto ──────────────────────────────────────────────────────
   Término y significado a dos columnas, sin caja y sin icono. Cuatro
   casas venían usando la misma rejilla de tarjetas; ésta es la forma
   que no repite ninguna hermana. */
.bk-pacto{margin-top:clamp(1.75rem,4vw,2.5rem);border-top:1px solid var(--filete)}
.bk-pacto__f{display:grid;gap:var(--e1);padding:var(--e8) 0;
  border-bottom:1px solid var(--filete);grid-template-columns:minmax(0,1fr)}
@media (min-width:760px){
.bk-pacto__f{grid-template-columns:minmax(0,17rem) minmax(0,1fr);gap:0 var(--e11);align-items:baseline}
}
.bk-pacto dt{font-family:var(--fd);font-weight:700;font-size:1.0625rem;line-height:1.35}
.bk-pacto dd{margin:0;color:var(--tinta-2);max-width:58ch}
.bk-cambio{border-radius:var(--ctrl)}
/* .gv-pregunta era rejilla sin columnas declaradas: la pista se
   dimensionaba por contenido y se salía 14px del panel. Las demás
   piezas SÍ declaran las suyas y no se tocan. */
.bk-pregunta{grid-template-columns:minmax(0,1fr)}

/* ══ Acceso y alta ═════════════════════════════════════════════════ */
.bk-acceso{padding:clamp(2.5rem,6vw,4.5rem) var(--gut)}
.bk-acceso__caja{max-width:460px;margin-inline:auto;background:var(--papel-3);
  border:1px solid var(--filete);border-radius:var(--ctrl);
  padding:clamp(1.6rem,4vw,2.4rem);box-shadow:0 1px 0 var(--filete-2)}
.bk-acceso__caja--ancha{max-width:720px}
.bk-acceso h1{font-size:clamp(1.5rem,1.2rem + 1vw,2rem)}
.bk-acceso__pie a{color:var(--verde);text-underline-offset:3px}
/* El layout va bajo [open]: un display suelto ABRE un <dialog> cerrado. */
.bk-dlg{border:1px solid var(--filete);border-radius:var(--ctrl);background:var(--papel-3);
  color:var(--tinta);padding:clamp(1.3rem,3vw,1.8rem);max-width:30rem;width:calc(100% - 2rem)}
.bk-dlg[open]{display:block}
.bk-dlg::backdrop{background:rgba(26,20,14,.5)}
.bk-dlg h2{font-size:1.25rem}
.bk-dlg__d{margin:var(--e4) 0 var(--e7);color:var(--tinta-2);font-size:.9375rem}
.bk-dlg__d-l{margin:0 0 var(--e8);border:1px solid var(--filete);border-radius:var(--ctrl);
  overflow:hidden}
.bk-dlg__d-l > div{display:flex;justify-content:space-between;gap:var(--e6);
  padding:var(--e4) var(--e5);border-bottom:1px solid var(--filete)}
.bk-dlg__d-l > div:last-child{border-bottom:0}
.bk-dlg__d-l dt{font-size:.6875rem;letter-spacing:.09em;text-transform:uppercase;color:var(--apoyo)}
.bk-dlg__d-l dd{margin:0;font-family:var(--fd);font-weight:700;
  font-variant-numeric:tabular-nums;text-align:right;overflow-wrap:anywhere}
.bk-dlg__f{display:flex;gap:var(--e3);justify-content:flex-end;flex-wrap:wrap}
.bk-cerrar{flex:none;background:transparent;border:0;color:var(--tinta-2);cursor:pointer;padding:.2rem}
.bk-cerrar:hover{color:var(--tinta)}
/* ── fin del riel ── */
/* ── el acceso: en el flujo, bajo el riel ──────────────────────────
   Columna angosta, sin caja y alineada al margen del contenido. */
.bk-acceso{display:block;width:min(var(--ancho),100% - var(--gut)*2);margin-inline:auto;
  padding-block:clamp(3rem,8vw,5.5rem)}
.bk-acceso__caja:not(.bk-acceso__caja--ancha){max-width:24rem;margin:0;background:transparent;border:0;padding:0;border-radius:0}
.bk-acceso__caja:not(.bk-acceso__caja--ancha) h1{font-size:clamp(1.75rem,1.3rem + 1.5vw,2.375rem)}
.bk-acceso__caja:not(.bk-acceso__caja--ancha) .bk-acceso__pie{margin-top:var(--e8);padding-top:var(--e6);border-top:1px solid var(--filete)}
/* ── fin del acceso ── */
/* ── el alta: el riel de pasos ─────────────────────────────────────
   Los grupos son paradas de un viaje: círculo numerado y una línea
   vertical que los une. Ninguna hermana usa este recurso. */
.bk-acceso__caja--ancha .bk-grupo{position:relative;border-top:0;
  padding:0 0 0 3.4rem;margin-bottom:var(--e10)}
.bk-acceso__caja--ancha .bk-grupo::before{content:"";position:absolute;
  left:1.05rem;top:2.3rem;bottom:-2.4rem;width:2px;background:var(--filete)}
.bk-acceso__caja--ancha .bk-grupo:last-of-type::before{display:none}
.bk-acceso__caja--ancha .bk-grupo legend{padding-left:0}
.bk-acceso__caja--ancha .bk-grupo__n{position:absolute;left:0;top:0;
  width:2.2rem;height:2.2rem;border:2px solid var(--verde);
  background:var(--papel-3);color:var(--verde);font-size:.75rem}

/* ══ Panel con sesion ══════════════════════════════════════════════ */
.bk-app__cab--centro{justify-content:center;text-align:center}
.bk-app__cab h1{margin-top:var(--e3)}
.bk-app__d{margin-top:var(--e4);color:var(--tinta-2);max-width:58ch}
.bk-app__pie{margin-top:var(--e5);text-align:center;font-size:.8125rem;color:var(--apoyo)}
.bk-app__acc{display:grid;gap:var(--e4);grid-template-columns:repeat(2,minmax(0,1fr));
  margin-top:var(--e8);padding-top:var(--e8);border-top:1px solid var(--filete)}
@media (min-width:1000px){
.bk-escritorio{grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr)}
}
.bk-monto:focus-within{border-color:var(--verde);box-shadow:0 0 0 3px var(--verde-2)}
.bk-rapidos{display:flex;flex-wrap:wrap;gap:var(--e1);margin-top:var(--e3)}
.bk-pista{display:flex;align-items:baseline;justify-content:space-between;gap:var(--e6);
  margin-top:var(--e1);font-size:.8125rem;color:var(--apoyo)}
.bk-pista b{font-variant-numeric:tabular-nums;font-weight:700;flex:none}
[data-billetera].is-ok input{border-color:var(--ok)}
[data-billetera].is-ok .bk-pista{color:var(--ok)}
[data-billetera].is-warn input{border-color:var(--pausa)}
[data-billetera].is-warn .bk-pista{color:var(--pausa)}
[data-billetera].is-mal input{border-color:var(--alto)}
[data-billetera].is-mal .bk-pista{color:var(--alto)}
.bk-cargando{padding:var(--e9);text-align:center;color:var(--apoyo);font-size:.875rem}
.bk-codigo{display:flex;gap:var(--e2);justify-content:center;margin-bottom:var(--e7)}
.bk-codigo input{width:2.9rem;height:3.4rem;text-align:center;font-family:var(--fd);
  font-weight:700;font-size:1.5rem;background:var(--papel-2);color:var(--tinta);
  border:1px solid var(--filete-2);border-radius:var(--ctrl);font-variant-numeric:tabular-nums}
.bk-codigo input:focus{outline:0;border-color:var(--verde);box-shadow:0 0 0 3px var(--verde-2)}
.bk-codigo input.is-puesta{background:var(--verde-2);border-color:var(--verde)}

/* ══ Paginas legales y prosa ═══════════════════════════════════════ */
.bk-doc{display:block;padding:var(--e3) var(--e4);background:var(--papel-3);border:1px solid var(--filete);
  border-radius:var(--ctrl);font-size:.8125rem;color:var(--verde);text-decoration:none}
.bk-doc:hover{border-color:var(--verde)}
.bk-legal__in{max-width:68ch}
.bk-legal__fecha{margin:var(--e3) 0 var(--e9);font-size:.875rem;color:var(--apoyo)}
.bk-prosa h2{margin:2.2rem 0 var(--e3);font-size:1.375rem}
.bk-prosa h3{margin:var(--e8) 0 var(--e2);font-size:1.0625rem}
.bk-prosa p,.bk-prosa li{color:var(--tinta-2);margin-bottom:var(--e5)}
.bk-prosa ul,.bk-prosa ol{margin:0 0 var(--e7) var(--e7);list-style:disc}
.bk-prosa ol{list-style:decimal}
.bk-prosa a{color:var(--verde);text-underline-offset:3px}
.bk-prosa table{width:100%;border-collapse:collapse;margin-bottom:var(--e7)}
.bk-prosa th,.bk-prosa td{border:1px solid var(--filete);padding:var(--e3) var(--e4);text-align:left}

/* ══ Tienda ════════════════════════════════════════════════════════ */
.bk-woo a{color:var(--verde)}
.bk-woo .button{display:inline-flex;align-items:center;justify-content:center;
  font-family:var(--fd);font-weight:600;background:var(--verde);color:var(--verde-ink);
  border:1px solid var(--verde);border-radius:var(--ctrl);padding:var(--e4) var(--e7);text-decoration:none}
.bk-woo input,.bk-woo select,.bk-woo textarea{font:inherit;background:var(--papel-3);
  border:1px solid var(--filete-2);border-radius:var(--ctrl);padding:var(--e4) var(--e5)}

/* ══ Pie ═══════════════════════════════════════════════════════════ */
@media (min-width:820px){
.bk-pie__in{grid-template-columns:1.6fr 1fr 1fr}
}
.bk-pie__marca .bk-logo{font-size:1.25rem;margin-bottom:var(--e3)}
.bk-pagos li{font-size:.75rem;color:var(--apoyo);border:1px solid var(--filete);
  border-radius:var(--redondo);padding:var(--e1) var(--e3)}
.bk-pie__col h2{font-family:var(--fd);font-size:.8125rem;letter-spacing:.11em;
  text-transform:uppercase;color:var(--verde);margin-bottom:var(--e4)}
.bk-pie__col li{margin-bottom:var(--e1)}
.bk-pie__col a{color:var(--tinta-2);text-decoration:none}
.bk-pie__col a:hover{color:var(--tinta);text-decoration:underline;text-underline-offset:3px}
.bk-pie__cierre p{margin:0}
@media (min-width:1000px){
/* el pie ya no necesita columnas: con el riel al lado, va en una fila */
.bk-pie__in{grid-template-columns:minmax(0,1fr);gap:var(--e8)}
.bk-pie__col{display:flex;flex-wrap:wrap;gap:var(--e1) var(--e7);align-items:baseline}
.bk-pie__col h3{width:100%;margin-bottom:.15rem}
.bk-pie__col p{margin:0}
}

/* ══ Resto ═════════════════════════════════════════════════════════ */
.bk-cartas{margin-top:var(--e9);display:grid;gap:var(--e6);
  grid-template-columns:minmax(0,1fr)}
@media (min-width:760px){
.bk-cartas{grid-template-columns:repeat(2,minmax(0,1fr))}
}
.bk-angosto{max-width:38rem}
[data-monto-msg].is-mal{color:var(--alto)}
.bk-sobre-rotulo{text-align:center;font-family:var(--fd);font-weight:600;
  font-size:.8125rem;margin-bottom:var(--e4)}
.bk-sobre-chip{margin-left:auto;font-family:var(--fd);font-weight:700;font-size:.6875rem;
  letter-spacing:.1em;text-transform:uppercase;color:var(--verde);
  background:var(--verde-2);border-radius:var(--redondo);padding:var(--e1) var(--e4)}
/* Las dos caras, en DOS COLUMNAS: la casa anterior las pone en renglones. */
.bk-ranuras .bk-ranura{margin-bottom:var(--e5)}
@media (min-width:720px){
.bk-ranuras{display:grid;gap:var(--e5);grid-template-columns:repeat(2,minmax(0,1fr))}
.bk-ranuras > legend, .bk-ranuras > .bk-grupo__d, .bk-ranuras > .bk-ranura__aviso{grid-column:1/-1}
.bk-ranuras .bk-ranura{margin-bottom:0}
}
.bk-herramientas{display:flex;flex-wrap:wrap;gap:var(--e3);margin-bottom:var(--e6)}
.bk-buscar{display:flex;align-items:center;gap:var(--e2);flex:1;min-width:14rem;
  background:var(--papel-3);border:1px solid var(--filete-2);border-radius:var(--ctrl);padding:0 var(--e5)}
.bk-buscar .bk-i{flex:none;color:var(--apoyo)}
.bk-buscar input{flex:1;min-width:0;border:0;background:transparent;font:inherit;padding:var(--e3) 0}
.bk-buscar input:focus{outline:0}
.bk-buscar:focus-within{border-color:var(--verde)}
.bk-paginador{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
  gap:var(--e3);padding:var(--e5) var(--e7);border-top:1px solid var(--filete);
  font-size:.8125rem;color:var(--apoyo)}
.bk-paginador > div{display:flex;gap:var(--e2)}
.bk-velo{position:fixed;inset:0;background:rgba(26,20,14,.45);opacity:0;visibility:hidden;
  transition:opacity var(--paso),visibility var(--paso);z-index:60}
.bk-velo.is-on{opacity:1;visibility:visible}
.bk-cajon{position:fixed;top:0;right:0;bottom:0;width:min(34rem,100%);z-index:61;
  background:var(--papel);border-left:1px solid var(--filete-2);display:flex;
  flex-direction:column;transform:translateX(100%);transition:transform var(--paso) ease;overflow:hidden}
.bk-cajon.is-on{transform:none}
.bk-cajon__cab{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--e6);
  padding:var(--e7) var(--e7);border-bottom:1px solid var(--filete);background:var(--papel-3)}
.bk-cajon__cab h2{font-size:1.125rem}
.bk-cajon__cab p{margin-top:.2rem;font-size:.875rem;color:var(--apoyo)}
.bk-cajon__cuerpo{flex:1;overflow-y:auto;padding:var(--e7)}
.bk-cajon__pie{padding:var(--e6) var(--e7);border-top:1px solid var(--filete);background:var(--papel-3);
  display:flex;flex-wrap:wrap;gap:var(--e2)}
.bk-block{margin-bottom:var(--e8)}
.bk-block h3{font-family:var(--fd);font-size:.75rem;letter-spacing:.11em;
  text-transform:uppercase;color:var(--verde);margin-bottom:var(--e3)}
.bk-docs{display:grid;gap:var(--e2);grid-template-columns:repeat(auto-fill,minmax(9rem,1fr))}
.bk-qa > div{display:flex;justify-content:space-between;gap:var(--e6);padding:var(--e3) 0;
  border-bottom:1px solid var(--filete);font-size:.875rem}
.bk-qa dt{color:var(--apoyo)}
.bk-qa dd{margin:0;text-align:right}
.bk-log{font-size:.8125rem;color:var(--tinta-2)}
.bk-log li{padding:var(--e1) 0;border-bottom:1px solid var(--filete)}
.bk-decision{padding:var(--e3) var(--e5);font-size:.875rem;border:1px solid var(--filete);
  border-radius:var(--ctrl);background:var(--papel-3)}
.bk-decision--wait{border-color:var(--pausa);background:var(--pausa-2)}
.bk-spin{display:inline-block;width:1rem;height:1rem;border:2px solid var(--filete);
  border-top-color:var(--verde);border-radius:50%;animation:bk-gira .7s linear infinite}
