/* ═══════════════════════════════════════════════════════════════════════════
   Gestlogix · estilos. El diseño es el de Studio Flow (Juan, 16/10/2026:
   «quiero rescatar el diseño de mi app Studio Flow»): sus tokens (tokens.css),
   su barra de título, sus botones, su tabla de listado (`.lst`), su puerta de
   entrada (`.ac-`) y su fondo de estrías. Lo propio de Gestlogix:
   · el menú va ARRIBA, como Excel, con submenús al hacer clic (Juan);
   · arranca en el tema Day; se cambia en Ajustes (Juan).
   REGLA heredada: ningún color fijo. Todo cuelga de tokens.css. Las dos
   excepciones van marcadas: la vista previa en papel y el QR, que son blancos.
   ═══════════════════════════════════════════════════════════════════════════ */

:focus-visible{ outline:2px solid var(--blue-l); outline-offset:2px; border-radius:3px; }
*{ box-sizing:border-box; }
html,body{ margin:0; min-height:100%; }
body{ background:var(--bg); color:var(--ink); font:16px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; -webkit-text-size-adjust:100%;
  padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left); }
[hidden]{ display:none !important; }
a{ color:var(--link); }
/* Letra y tamaños de la primera versión de Gestlogix (Juan, 16/10/2026). */
h1{ font-size:1.5rem; font-weight:700; margin:.5rem 0; color:var(--gl-titulo); line-height:1.25; }
h2{ font-size:1.15rem; font-weight:700; margin:1.25rem 0 .5rem; color:var(--gl-titulo); line-height:1.25; }
h3{ margin:1rem 0 .4rem; font-size:.8rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--gl-acento); }
code{ font:.85rem var(--mono); background:var(--panel2); padding:1px 5px; border-radius:5px; word-break:break-all; }
.nota{ color:var(--muted); font-size:.88rem; }
.error{ color:var(--bad); }

/* El fondo de estrías: una capa fija detrás de todo. En el móvil no se monta
   (200 KB): queda el color del tema. */
.fondo-fijo{ position:fixed !important; inset:0; z-index:-1; pointer-events:none; }
/* Day va en blanco (Juan): sin estrías. Las tienen Night y Midnight. */
:root[data-sf-theme="day"] .fondo-fijo{ display:none; }

/* ── Campos ───────────────────────────────────────────────────────────── */
input,select,textarea,button{ font:inherit; color:inherit; }
input,select,textarea{ width:100%; padding:.55rem .7rem; font-size:1rem; background:var(--panel); color:var(--ink);
  border:1px solid var(--line2); border-radius:8px; min-height:44px; }
input:focus,select:focus,textarea:focus{ outline:none; border-color:var(--blue-l); }
textarea{ min-height:4.5rem; resize:vertical; }
input[type=checkbox],input[type=radio]{ width:auto; min-height:0; accent-color:var(--blue-l); }
/* Sin flechas en los números, y las cifras a la derecha (reglas de Studio Flow). */
input[type="number"]{ -moz-appearance:textfield; appearance:textfield; }
input[type="number"]::-webkit-outer-spin-button,input[type="number"]::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
th.num,td.num,input.num{ text-align:right; font-variant-numeric:tabular-nums; }
label{ display:block; margin:.45rem 0; font-size:.88rem; color:var(--muted); }
label.check{ display:flex; gap:.5rem; align-items:center; font-size:.95rem; color:var(--ink); }

/* ── Botones: azules, como en la primera versión (Juan, 16/10/2026) ───────
   Un <button> sin clase es la acción principal, relleno de azul. `.sec`, con
   borde azul; `.discreto`, sin color; `.peligro`, con el rojo del tema. */
button,.boton{ display:inline-flex; align-items:center; justify-content:center; gap:.4rem;
  font-size:1rem; font-weight:600; padding:.55rem 1rem; min-height:44px; border-radius:8px; cursor:pointer;
  text-decoration:none; -webkit-user-select:none; user-select:none; transition:background .15s, border-color .15s;
  background:var(--gl-boton); border:1px solid var(--gl-boton); color:var(--gl-boton-tinta); box-shadow:none; }
button:hover,.boton:hover{ background:var(--gl-boton-hover); border-color:var(--gl-boton-hover); }
button:disabled{ opacity:.45; cursor:not-allowed; }
button.sec,.boton.sec{ background:transparent; color:var(--gl-sec-tinta); border-color:var(--gl-sec-tinta); }
button.sec:hover,.boton.sec:hover{ background:var(--panel2); }
button.discreto{ background:transparent; color:var(--muted); border-color:var(--line2); font-weight:400; }
button.discreto:hover{ background:var(--panel2); color:var(--ink); }
button.peligro{ background:transparent; color:var(--bad); border-color:var(--bad); }
button.peligro:hover{ background:var(--panel2); }
button.peq,.boton.peq{ min-height:34px; padding:.3rem .7rem; font-size:.88rem; }
.botones{ display:flex; gap:.5rem; flex-wrap:wrap; align-items:center; margin:.75rem 0; }

/* ── La puerta de entrada (`.ac-` de Studio Flow) ──────────────────────── */
.ac-velo{ position:fixed; inset:0; z-index:900; background:var(--bg2); display:flex; align-items:center;
  justify-content:center; padding:20px; }
.ac-caja{ width:100%; max-width:380px; background:var(--panel); border:1px solid var(--line); border-radius:14px;
  padding:26px 24px 22px; box-shadow:var(--sf-lift); }
.ac-marca{ display:flex; align-items:center; gap:10px; margin-bottom:18px; }
.ac-marca .gl-logo{ width:52px; height:52px; }
.ac-marca .t{ font-size:17px; font-weight:300; color:var(--muted); letter-spacing:.2px; }
.ac-marca .t strong{ font-weight:800; color:var(--ink); }
.ac-empresa{ display:flex; align-items:center; gap:10px; }
.ac-empresa img{ height:34px; width:auto; }
.ac-caja h4{ margin:0 0 4px; font-size:15px; font-weight:600; }
.ac-caja .q{ margin:0 0 16px; font-size:12px; color:var(--muted); }
.ac-campo{ display:flex; flex-direction:column; gap:4px; margin:0 0 12px; }
.ac-campo span{ font-size:.88rem; color:var(--muted); }
/* 16 px: por debajo, Safari en iOS amplía al tocar el campo. */
.ac-campo input{ padding:9px 11px; font-size:16px; }
.ac-recordar{ display:flex; gap:7px; align-items:center; font-size:12px; color:var(--muted); margin:2px 0 16px; cursor:pointer; }
.ac-caja button{ width:100%; }
.ac-msg{ margin:14px 0 0; font-size:12px; min-height:1px; }
.ac-msg.mal{ color:var(--bad); }

/* ── El logo de Gestlogix (logo/gestlogix.png, de Juan, 16/10/2026) ────────
   PNG con el blanco quitado. En los temas oscuros va sobre una placa blanca:
   la «G» azul marino no se ve sobre gris oscuro. */
.gl-logo{ width:26px; height:26px; flex:none; object-fit:contain; }
:root:not([data-sf-theme="day"]) .gl-logo{ background:#fff; border-radius:7px; padding:2px; }

/* ── Barra de título (la `.titlebar` de Studio Flow) ──────────────────── */
.titlebar{ position:sticky; top:0; z-index:40; height:42px; display:flex; align-items:center; gap:10px;
  padding:0 14px; background:var(--sf-tb); border-bottom:1px solid var(--sf-tb-line); -webkit-user-select:none; user-select:none; }
.tb2-brand{ display:flex; align-items:center; gap:7px; padding:3px 7px; border:1px solid transparent; border-radius:8px;
  text-decoration:none; transition:.12s; }
.tb2-brand:hover{ background:var(--panel2); border-color:var(--line2); }
.tb2-brand span{ font-size:13.5px; font-weight:300; color:var(--muted); }
.tb2-brand strong{ font-weight:800; color:var(--ink); }
.tb2-sep{ width:1px; height:18px; background:var(--line2); }
.tb2-empresa{ display:flex; align-items:center; gap:7px; font-size:.95rem; font-weight:700; color:var(--gl-titulo); min-width:0; }
.tb2-empresa img{ height:24px; width:auto; }
.tb2-empresa span{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.spacer{ flex:1; }
.tb2-yo{ font-size:.88rem; color:var(--muted); white-space:nowrap; }
.tb-salir,.tb-menu{ background:none; border:1px solid transparent; box-shadow:none; color:var(--muted);
  font-weight:500; font-size:.88rem; min-height:32px; padding:3px 10px; }
.tb-salir:hover,.tb-menu:hover{ background:var(--panel2); border-color:var(--line2); color:var(--ink); }
.tb-menu{ display:none; width:32px; padding:0; }
.tb-menu svg{ width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; }

/* ── El menú: arriba, como Excel, con submenús al hacer clic (Juan) ────── */
.menubar{ position:sticky; top:42px; z-index:35; display:flex; gap:2px; padding:0 10px; min-height:40px;
  background:var(--panel); border-bottom:1px solid var(--line); }
.menubar .grupo{ position:relative; }
.menubar .grupo > button{ height:40px; min-height:0; padding:0 14px; border:0; border-radius:0; background:none;
  box-shadow:none; color:var(--ink); font-size:.95rem; font-weight:500; }
.menubar .grupo > button:hover{ background:var(--panel2); border:0; }
.menubar .grupo > button[aria-expanded="true"]{ background:var(--elev); }
.menubar .grupo.activo > button{ box-shadow:inset 0 -2px 0 var(--blue-l); font-weight:700; }
.menubar .grupo > button::after{ content:"▾"; margin-left:5px; font-size:10px; color:var(--muted); }
.submenu{ position:absolute; top:100%; left:0; min-width:250px; padding:6px; z-index:60;
  background:var(--elev); border:1px solid var(--line2); border-radius:0 0 10px 10px; box-shadow:var(--sf-lift); }
.submenu a{ display:flex; justify-content:space-between; align-items:center; gap:10px; padding:.5rem .7rem;
  border-radius:7px; color:var(--ink); text-decoration:none; font-size:.95rem; }
.submenu a:hover,.submenu a:focus-visible{ background:var(--panel2); }
.submenu a.sub{ padding-left:1.6rem; font-size:.9rem; color:var(--muted); }
.submenu a.sub:hover{ color:var(--ink); }
.submenu a.activa{ box-shadow:inset 2px 0 0 var(--blue-l); background:var(--panel2); font-weight:600; }
.submenu a.proximamente,.submenu a.no_contratado{ color:var(--muted2); }
.pronto{ font-size:9px; text-transform:uppercase; letter-spacing:.06em; color:var(--muted2);
  border:1px solid var(--line2); padding:1px 6px; border-radius:20px; white-space:nowrap; }

.contenido{ max-width:1040px; margin:0 auto; padding:16px 20px 80px; }

/* ── Cajas ────────────────────────────────────────────────────────────── */
.tarjeta,.bloque-panel{ background:var(--panel); border:1px solid var(--line); border-radius:12px;
  padding:14px 16px; margin:0 0 14px; box-shadow:var(--sf-lift); }
.bloque-panel h2{ margin-top:0; }
.cifras{ display:grid; gap:10px; grid-template-columns:repeat(auto-fit,minmax(min(170px,100%),1fr)); margin:10px 0; }
.cifra{ background:var(--panel2); border:1px solid var(--line); border-radius:10px; padding:11px 14px; }
.cifra b{ display:block; font-size:1.9rem; line-height:1.1; font-weight:700; color:var(--ink); font-variant-numeric:tabular-nums; }
.cifra span{ color:var(--muted); font-size:.88rem; }
.cifra.mal b{ color:var(--bad); }
.banda{ border:1px solid var(--line); border-left:3px solid var(--blue-l); background:var(--panel2);
  border-radius:8px; padding:.6rem .9rem; margin:.75rem 0; font-size:.95rem; }
.banda.mal{ border-left-color:var(--bad); }
.banda.aviso{ border-left-color:var(--gold); }
.banda.ok{ border-left-color:var(--ok); }
.banda ul{ margin:4px 0 0; padding-left:18px; }
.chip{ display:inline-block; padding:.05rem .55rem; border-radius:20px; font-size:.78rem; font-weight:600; white-space:nowrap;
  border:1px solid var(--line2); color:var(--muted); }
.chip.publicado{ color:var(--ok); border-color:var(--ok); }
.chip.borrador{ color:var(--gold); border-color:var(--gold); }
.chip.anulado{ color:var(--muted2); }

/* ── Listados: la tabla `.lst` de Studio Flow, sin banda gris ──────────── */
.tabla{ overflow-x:auto; background:var(--panel); border:1px solid var(--line); border-radius:12px; }
table{ width:100%; border-collapse:collapse; font-size:.93rem; }
th{ text-align:left; padding:.55rem .7rem; font-size:.74rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  color:var(--muted); border-bottom:1px solid var(--line); white-space:nowrap; }
td{ padding:.55rem .7rem; border-bottom:1px solid var(--line); vertical-align:middle; }
tbody tr:last-child td{ border-bottom:0; }
tbody tr:hover{ background:var(--sf-fila-hover); }
tr.baja td{ opacity:.5; text-decoration:line-through; }
tr.fila-clic{ cursor:pointer; }
.derecha{ text-align:right; white-space:nowrap; }
.nw{ white-space:nowrap; }
.busqueda{ display:flex; gap:10px; flex-wrap:wrap; align-items:center; margin:8px 0 12px; }
.busqueda input:not([type=checkbox]){ flex:1 1 240px; width:auto; }
/* La casilla y su texto, en una línea (Juan, 16/10/2026: «Ver las de baja en una línea»).
   Antes la regla de arriba estiraba también la casilla y el texto se partía palabra a palabra. */
.busqueda label.check{ margin:0; white-space:nowrap; }
.busqueda select{ width:auto; }

/* ── El formulario del DeCA ───────────────────────────────────────────── */
.pasos{ display:flex; gap:8px; margin:6px 0 16px; list-style:none; padding:0; counter-reset:paso; flex-wrap:wrap; }
.pasos li{ flex:1 1 0; min-width:84px; cursor:pointer; counter-increment:paso; font-size:.82rem; color:var(--muted); border-top:3px solid var(--line2); padding-top:5px; }
.pasos li::before{ content:counter(paso) " · "; font-weight:700; }
.pasos li.hecho{ border-top-color:var(--ok); }
.pasos li.actual{ border-top-color:var(--gl-boton); color:var(--gl-titulo); font-weight:700; }
.rejilla{ display:grid; gap:0 14px; grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr)); }
.rejilla .ancho{ grid-column:1 / -1; }
.rejilla h3.ancho{ margin:14px 0 4px; font-size:13px; text-transform:uppercase; letter-spacing:.06em; color:var(--gl-sec-tinta); }
.rejilla h3.ancho:first-child{ margin-top:0; }
/* Caducidades: vencida en rojo, ≤ 30 días en ámbar, ≤ 60 días subrayada. */
.vence{ font-weight:600; padding:1px 6px; border-radius:4px; }
.vence.mal{ color:var(--bad); background:color-mix(in srgb, var(--bad) 12%, transparent); }
.vence.aviso{ color:var(--gold); background:color-mix(in srgb, var(--gold) 14%, transparent); }
.vence.pronto{ text-decoration:underline dotted; font-weight:500; }
.dos{ display:grid; gap:16px; grid-template-columns:repeat(auto-fit,minmax(min(320px,100%),1fr)); align-items:start; }
.dos > *{ min-width:0; }
.papel{ display:flex; gap:10px; flex-wrap:wrap; }
.papel label{ flex:1 1 230px; display:flex; gap:10px; align-items:flex-start; margin:0; padding:10px 12px; cursor:pointer;
  background:var(--panel2); border:1px solid var(--line2); border-radius:10px; color:var(--ink); font-size:.95rem; }
.papel b{ color:var(--gl-titulo); }
.papel label.elegido{ border-color:var(--blue-l); box-shadow:inset 0 0 0 1px var(--blue-l); }
.papel b{ display:block; }
.envio{ background:var(--panel); border:1px dashed var(--line2); border-radius:12px; padding:6px 14px 12px; margin:10px 0; }
.envio .cab{ display:flex; justify-content:space-between; align-items:center; font-size:.9rem; font-weight:700;
  color:var(--gl-titulo); }
.propia{ background:var(--panel2); border:1px solid var(--line); border-radius:8px; padding:.5rem .75rem; font-size:.93rem; }
details.carta{ border-top:1px dashed var(--line2); margin-top:8px; padding-top:4px; }
details.carta > summary{ list-style:none; }
details.carta > summary::-webkit-details-marker{ display:none; }
details summary.nota{ cursor:pointer; margin:6px 0; }
.lista-cartas{ padding-left:1.1rem; margin:.3rem 0 .8rem; font-size:.92rem; }

/* La vista previa imita al papel: ⚠️ blanca a propósito, en los tres temas. */
.hoja{ background:#fff; color:#12242B; border:1px solid #9aa6aa; border-radius:4px; padding:18px 20px;
  box-shadow:var(--sf-lift); font-size:13px; }
.hoja h4{ margin:0 0 6px; color:#00354D; font-size:14px; text-transform:uppercase; }
.hoja dl{ display:grid; grid-template-columns:minmax(120px,38%) 1fr; gap:4px 12px; margin:8px 0; }
.hoja dt{ color:#536268; font-size:10.5px; text-transform:uppercase; letter-spacing:.05em; padding-top:2px; }
.hoja dd{ margin:0; font-weight:600; }
.hoja .falta{ color:#A33434; font-style:italic; }
.hoja hr{ border:0; border-top:1px solid #C6CBCD; margin:8px 0; }
.hoja .nota{ color:#536268; }
.marca-borrador{ display:inline-block; border:1.5px solid #A33434; color:#A33434; font-weight:700; font-size:10px;
  letter-spacing:.08em; padding:0 6px; border-radius:3px; }

/* ── La ficha de un DeCA ──────────────────────────────────────────────── */
.cabecera-deca{ display:flex; gap:18px; align-items:flex-start; flex-wrap:wrap; }
.cabecera-deca .datos{ flex:1 1 320px; }
/* El QR: ⚠️ fondo blanco siempre; un lector no lo lee sobre gris. */
.qr{ width:168px; height:168px; background:#fff; border:1px solid var(--line2); border-radius:10px; padding:8px; }
.versiones{ list-style:none; padding:0; margin:4px 0; }
.versiones li{ padding:.45rem 0; border-bottom:1px solid var(--line); font-size:.92rem; }
.versiones .cambio{ color:var(--muted); font-size:.85rem; }
.versiones s{ color:var(--muted2); }

/* ── Ajustes: el tema ─────────────────────────────────────────────────── */
.temas{ display:flex; gap:10px; flex-wrap:wrap; }
.temas label{ display:flex; align-items:center; gap:8px; margin:0; padding:8px 12px; cursor:pointer; font-size:.95rem;
  color:var(--ink); background:var(--panel2); border:1px solid var(--line2); border-radius:10px; }
.temas label.elegido{ border-color:var(--blue-l); box-shadow:inset 0 0 0 1px var(--blue-l); }
.temas .muestra{ width:22px; height:22px; border-radius:6px; border:1px solid var(--line2); }
.muestra.night{ background:#232323; } .muestra.midnight{ background:#1E2229; } .muestra.day{ background:#FFFFFF; }

/* ── Aviso flotante ───────────────────────────────────────────────────── */
.aviso{ font-size:.95rem; position:fixed; left:50%; bottom:20px; transform:translateX(-50%); z-index:950; max-width:92vw;
  background:var(--elev); color:var(--ink); border:1px solid var(--line2); border-left:3px solid var(--ok);
  padding:10px 14px; border-radius:10px; box-shadow:var(--sf-lift); font-size:13px; }
.aviso.mal{ border-left-color:var(--bad); }

/* ── Móvil: el menú se abre con el botón, en columna ──────────────────── */
@media (max-width:900px){
  .tb-menu{ display:inline-flex; }
  .tb2-yo,.tb2-sep{ display:none; }
  .tb2-brand span{ display:none; }
  .menubar{ display:none; position:sticky; flex-direction:column; padding:6px; max-height:calc(100vh - 42px); overflow-y:auto; }
  body.menu-abierto .menubar{ display:flex; }
  .menubar .grupo > button{ width:100%; justify-content:space-between; }
  .submenu{ position:static; box-shadow:none; border:0; border-radius:8px; background:var(--panel2); min-width:0; }
  .contenido{ padding:14px 16px 80px; }
  input,select,textarea{ font-size:16px; }
  .hoja dl{ grid-template-columns:1fr; }
  .qr{ width:140px; height:140px; }
}

/* El nombre de una fila de la lista abre su ficha (Juan, 19/10/2026). */
button.enlace{ all:unset; cursor:pointer; color:var(--gl-titulo); font-weight:600; }
button.enlace:hover, button.enlace:focus-visible{ text-decoration:underline; color:var(--gl-boton); }
#editor{ scroll-margin-top:90px; }

/* ── Ayuda ── */
a.tb-ayuda{ text-decoration:none; padding:5px 10px; border-radius:6px; font-size:.9rem; }
.ayuda{ display:grid; grid-template-columns:240px 1fr; gap:16px; align-items:start; }
.ayuda-indice{ position:sticky; top:96px; max-height:calc(100vh - 110px); overflow:auto; }
.ayuda-indice ol{ margin:0; padding-left:20px; font-size:.9rem; line-height:1.7; }
.ayuda-cuerpo section{ scroll-margin-top:96px; }
.ayuda-cuerpo h2{ margin-top:0; }
.ayuda-campos td:first-child{ width:26%; } .ayuda-campos td:last-child{ width:90px; text-align:center; }
.ayuda-campos td{ vertical-align:top; white-space:normal; }
.chip-ayuda{ display:inline-block; font-size:.75rem; font-weight:700; padding:1px 7px; border-radius:10px; }
.chip-ayuda.si{ color:var(--gl-titulo); background:color-mix(in srgb, var(--gl-titulo) 12%, transparent); }
.chip-ayuda.no{ color:var(--muted); background:var(--panel2); }
.chip-ayuda.carta{ color:var(--gl-boton); background:color-mix(in srgb, var(--gl-boton) 12%, transparent); }
.faq dt{ font-weight:700; margin-top:10px; } .faq dd{ margin:2px 0 0 0; }
@media (max-width: 899px){ .ayuda{ grid-template-columns:1fr; } .ayuda-indice{ position:static; max-height:none; } }

/* ── Ventana propia (como las de Studio Flow), en vez de prompt() y confirm() ── */
.velo{ position:fixed; inset:0; z-index:200; background:rgba(8,8,10,.55); backdrop-filter:blur(4px);
  display:flex; align-items:center; justify-content:center; padding:16px; }
.velo .modal{ width:520px; max-width:100%; background:var(--panel); border:1px solid var(--line2); border-radius:14px;
  box-shadow:0 24px 70px rgba(0,0,0,.45); overflow:hidden; animation:pop .18s ease; }
@keyframes pop{ from{ transform:scale(.96); opacity:0 } to{ transform:scale(1); opacity:1 } }
.velo .mhead{ padding:16px 20px; border-bottom:1px solid var(--line); display:flex; align-items:flex-start; gap:12px; }
.velo .mhead .kick{ font-size:10px; letter-spacing:3px; text-transform:uppercase; color:var(--gl-boton); }
.velo .mhead h2{ font-size:18px; margin:3px 0 0; font-weight:400; }
.velo .mhead h2 strong{ font-weight:700; }
.velo .mhead .x{ all:unset; margin-left:auto; cursor:pointer; color:var(--muted); font-size:20px; line-height:1; }
.velo .mhead .x:hover{ color:var(--ink); }
.velo .mbody{ padding:16px 20px 18px; }
.velo .mbody .botones{ justify-content:flex-end; margin-top:14px; }
:root[data-sf-theme="day"] .velo{ background:rgba(20,24,32,.35); }

/* ── Domicilio en campos normalizados ── */
fieldset.direccion{ border:1px solid var(--line); border-radius:8px; padding:6px 12px 8px; margin:6px 0 10px; min-width:0; }
fieldset.direccion legend{ font-size:.85rem; font-weight:600; padding:0 6px; color:var(--gl-titulo); }
.dir-rejilla{ display:grid; gap:0 12px; grid-template-columns:2.4fr 0.8fr 1.4fr 1.2fr 1fr; }
.dir-rejilla label{ margin:4px 0; }
@media (max-width: 899px){ .dir-rejilla{ grid-template-columns:1fr 1fr; } .dir-rejilla .dir-via{ grid-column:1 / -1; } }

/* ── Protección de datos ── */
.texto-legal h2{ margin-top:0; } .texto-legal h3{ font-size:1rem; margin:14px 0 4px; color:var(--gl-titulo); }
.texto-legal p{ margin:4px 0; line-height:1.5; }