/* ============================================================
   OCTAVA — hoja de estilo
   Lenguaje visual: "el portal como documento de agrimensura".
   Paleta: los tres colores de la bandera de Canarias.
   Contrastes y paleta de gráficos verificados programáticamente.
   ============================================================ */

/* ---------- 1. TOKENS: paleta clara completa en :root ----------
   Los tres colores oficiales de Canarias: blanco, azul y amarillo.
   Reparto de trabajo, obligado por el contraste:
     · AZUL     — interfaz y texto. Soporta el peso funcional.
     · AMARILLO — color gráfico y CTA. NUNCA como texto sobre blanco
                  (1,49:1). Cuando lleva texto encima, va tinta azul
                  profunda: 8,88:1.
     · BLANCO   — superficie.
   ------------------------------------------------------------- */
:root{
  --azul:#0A4B8C;         /* primario · texto y UI · 8,76:1 sobre blanco */
  --azul-2:#0C5CA9;       /* hover */
  --azul-9:#06305C;       /* profundo · tinta sobre amarillo · 8,88:1 */
  --azul-cl:#2870AC;      /* azul medio · acento, también como texto · 5,25:1 */
  --azul-cl2:#5BA0D8;
  --amarillo:#FFCE00;     /* amarillo bandera · gráfico y CTA */
  --amarillo-2:#FFDE5C;   /* claro · fondos de acento */
  --amarillo-9:#E9BC00;   /* hover del CTA */
  --oro:#7A5A0B;          /* oro profundo · el único cálido legible como texto */
  --oro-2:#9C7614;

  /* Neutros con sesgo hacia el azul de marca (elegidos, no heredados) */
  --fondo:#EFF4F9;        /* luz atlántica · fondo de página */
  --fondo-2:#E4EDF5;
  --lienzo:#FFFFFF;       /* el blanco de la bandera · superficie */
  --lienzo-2:#F7FAFD;
  --tinta:#12212E;        /* tinta principal · 16,37:1 */
  --tinta-2:#43586B;      /* secundaria · 7,38:1 */
  --tinta-3:#5F7589;      /* micro-rótulo · 4,78:1 sobre lienzo, 4,56:1 sobre lienzo-2 */
  --tinta-4:#93A7B8;
  --linea:#DCE5EE;
  --linea-2:#C3D2E0;

  /* Semánticos de estado — icono + texto siempre, nunca solo color.
     El ámbar de aviso se oscurece a bronce para no confundirse con
     el amarillo de marca. */
  --ok:#12694A;   --ok-bg:#E3F3EC;   --ok-bd:#B2DCC7;
  --warn:#8A5200; --warn-bg:#FBEEDA; --warn-bd:#E6C999;
  --crit:#A31D1A; --crit-bg:#FBE9E7; --crit-bd:#E8BDB9;

  /* Escenarios de rentabilidad — categórica validada (claro)
     orden fijo: vacacional · media estancia · residencial */
  --s-vv:#C68400;
  --s-me:#2E7CBF;
  --s-re:#3AA152;
  --reja:#DEE8F1;         /* rejilla de gráfico, recesiva */

  /* Certificado energético: fondo claro + tinta oscura + punto de color */
  --enA-bg:#DFF0E6; --enA:#155F3C;
  --enB-bg:#E4F0DA; --enB:#3E6E2A;
  --enC-bg:#EEF0D2; --enC:#5F6613;
  --enD-bg:#F7ECCE; --enD:#7E5A13;
  --enE-bg:#F7E3CC; --enE:#8C5014;
  --enF-bg:#F6D9CC; --enF:#8C3714;
  --enG-bg:#F5D2D0; --enG:#8E1D17;

  --sombra-1:0 1px 2px rgba(10,58,110,.07), 0 1px 1px rgba(10,58,110,.04);
  --sombra-2:0 2px 4px rgba(10,58,110,.06), 0 8px 20px rgba(10,58,110,.08);
  --sombra-3:0 24px 60px rgba(6,30,60,.28);
  --r-1:6px; --r-2:10px; --r-3:14px; --r-4:20px;

  --f-txt:-apple-system,BlinkMacSystemFont,"Segoe UI Variable Text","Segoe UI",
          Roboto,"Helvetica Neue",Arial,sans-serif;
  --f-num:ui-monospace,"SF Mono","SFMono-Regular","Cascadia Mono","Roboto Mono",
          Menlo,Consolas,monospace;

  /* Tinta sobre un relleno de AZUL: el azul se aclara en tema oscuro,
     así que esta tinta se invierte con el tema. */
  --sobre-azul:#FFFFFF;
  /* Tinta sobre el AMARILLO: el amarillo NO cambia con el tema, así
     que su tinta tampoco. Fija en ambos temas. */
  --sobre-amarillo:#06305C;
  --sobre-crit:#FFFFFF;   /* texto sobre --crit: en claro, blanco */
  /* Tinta fija para distintivos con fondo blanco fijo sobre la foto */
  --tinta-fija:#12212E;
  --tinta-fija-2:#3C4E5D;
  --ok-fijo:#12694A;
  --oro-fijo:#6B4E08;     /* tinta cálida sobre amarillo, fija */
  /* Fondo de distintivo azul. Antes estos chips usaban --ok-bg
     (verde) porque en la paleta anterior acento y éxito compartían
     tono; con el azul de marca daba 4,47:1 y además confundía un
     acento con un estado de éxito. El verde queda para estados. */
  --azul-bg:#E7F0F9; --azul-bd:#BCD5EC;

  --foco:var(--azul-cl);
  color-scheme:light;
}

/* Los dos temas oscuros comparten valores; se declaran dos veces
   porque el ajuste por sistema y la elección explícita son estados
   distintos y ninguno debe pisar al otro. */

/* ---------- 2. TOKENS: tema oscuro por preferencia de sistema ---------- */
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --azul:#7BB6E8;
    --azul-2:#9ECBF2;
    --azul-9:#041C33;
    --azul-cl:#4390CE;
    --azul-cl2:#6BAADF;
    --amarillo:#FFD429;
    --amarillo-2:#FFE479;
    --amarillo-9:#F0C420;
    --oro:#D7B15A;
    --oro-2:#E6C97F;

    --fondo:#08192B;        /* el Atlántico de noche */
    --fondo-2:#0B2035;
    --lienzo:#0E2438;
    --lienzo-2:#143049;
    --tinta:#E8EEF4;
    --tinta-2:#AFC3D4;
    --tinta-3:#859BB0;
    --tinta-4:#63788A;
    --linea:#1E3A54;
    --linea-2:#2A4A68;

    --ok:#5CC48F;   --ok-bg:#0D2A1F;   --ok-bd:#28553F;
    --warn:#DFA455; --warn-bg:#2A2012; --warn-bd:#574327;
    --crit:#F08A80; --crit-bg:#2C1817; --crit-bd:#5C302C;

    --s-vv:#C08A18;
    --s-me:#4390CE;
    --s-re:#389E55;
    --reja:#1C3450;

    --enA-bg:#0F2E1E; --enA:#7FD3A4;
    --enB-bg:#182C14; --enB:#A6CE86;
    --enC-bg:#26290F; --enC:#C6CB6B;
    --enD-bg:#2C2310; --enD:#E0BE78;
    --enE-bg:#2C1D10; --enE:#E5AE79;
    --enF-bg:#2C1610; --enF:#E9A183;
    --enG-bg:#2C1313; --enG:#EE968F;

    --sombra-1:0 1px 2px rgba(0,0,0,.55);
    --sombra-2:0 2px 6px rgba(0,0,0,.45), 0 10px 26px rgba(0,0,0,.4);
    --sombra-3:0 26px 70px rgba(0,0,0,.7);

    --sobre-azul:#04182B;
    --sobre-amarillo:#06305C;
  --sobre-crit:#2C1817;  /* el rojo oscuro es claro: el texto va oscuro */
    --tinta-fija:#12212E;
    --tinta-fija-2:#3C4E5D;
    --ok-fijo:#12694A;
    --oro-fijo:#6B4E08;
    --azul-bg:#0A1E30; --azul-bd:#27455F;

    --foco:#6BAADF;
    color-scheme:dark;
  }
}

/* ---------- 3. TOKENS: tema oscuro por elección explícita ---------- */
:root[data-theme="dark"]{
  --azul:#7BB6E8;
  --azul-2:#9ECBF2;
  --azul-9:#041C33;
  --azul-cl:#4390CE;
  --azul-cl2:#6BAADF;
  --amarillo:#FFD429;
  --amarillo-2:#FFE479;
  --amarillo-9:#F0C420;
  --oro:#D7B15A;
  --oro-2:#E6C97F;

  --fondo:#08192B;
  --fondo-2:#0B2035;
  --lienzo:#0E2438;
  --lienzo-2:#143049;
  --tinta:#E8EEF4;
  --tinta-2:#AFC3D4;
  --tinta-3:#859BB0;
  --tinta-4:#63788A;
  --linea:#1E3A54;
  --linea-2:#2A4A68;

  --ok:#5CC48F;   --ok-bg:#0D2A1F;   --ok-bd:#28553F;
  --warn:#DFA455; --warn-bg:#2A2012; --warn-bd:#574327;
  --crit:#F08A80; --crit-bg:#2C1817; --crit-bd:#5C302C;

  --s-vv:#C08A18;
  --s-me:#4390CE;
  --s-re:#389E55;
  --reja:#1C3450;

  --enA-bg:#0F2E1E; --enA:#7FD3A4;
  --enB-bg:#182C14; --enB:#A6CE86;
  --enC-bg:#26290F; --enC:#C6CB6B;
  --enD-bg:#2C2310; --enD:#E0BE78;
  --enE-bg:#2C1D10; --enE:#E5AE79;
  --enF-bg:#2C1610; --enF:#E9A183;
  --enG-bg:#2C1313; --enG:#EE968F;

  --sombra-1:0 1px 2px rgba(0,0,0,.55);
  --sombra-2:0 2px 6px rgba(0,0,0,.45), 0 10px 26px rgba(0,0,0,.4);
  --sombra-3:0 26px 70px rgba(0,0,0,.7);

  --sobre-azul:#04182B;
  --sobre-amarillo:#06305C;
  --sobre-crit:#2C1817;  /* el rojo oscuro es claro: el texto va oscuro */
  --tinta-fija:#12212E;
  --tinta-fija-2:#3C4E5D;
  --ok-fijo:#12694A;
  --oro-fijo:#6B4E08;
  --azul-bg:#0A1E30; --azul-bd:#27455F;

  --foco:#6BAADF;
  color-scheme:dark;
}

/* ---------- 4. Base ---------- */
*,*::before,*::after{box-sizing:border-box}
*{margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important}
}
body{
  font-family:var(--f-txt);
  color:var(--tinta);
  background:var(--fondo);      /* explícito: el visor pinta su propio fondo detrás */
  line-height:1.55;
  font-size:15px;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
h1,h2,h3,h4{line-height:1.16;text-wrap:balance;letter-spacing:-.022em;font-weight:800}
a{color:var(--azul-cl)}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;background:none;border:0}
svg{display:block}
img{max-width:100%;display:block}
/* Un <svg> sin width/height cae a su tamaño intrínseco (300×150) y
   se come el diseño: el icono de "comprobado" salía como una banda
   diagonal gigante sobre la foto. Esta regla da un tamaño por
   defecto a todo icono en línea. Sin :not() y sin div, para que su
   especificidad sea 0,0,1: cualquier regla de clase la gana, y los
   SVG grandes (escenas, plano, plancha, gráfico) viven en <div> y
   quedan fuera del selector. */
:where(button,span,p,li,b,strong,em,summary,h4,label,td,th) > svg{
  width:1em;height:1em;flex:none;
}

:where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{
  outline:2.5px solid var(--foco);outline-offset:2px;border-radius:4px;
}

/* Cifras: siempre monoespaciadas y tabulares — el argumento del producto */
.num,.price,.stat-v,.mbox-v,.kpi-v,.chart text,.ref{
  font-family:var(--f-num);font-variant-numeric:tabular-nums;letter-spacing:-.01em;
}
/* Micro-rótulos de plano topográfico */
.lbl{
  font-family:var(--f-num);font-size:10px;font-weight:600;text-transform:uppercase;
  letter-spacing:.11em;color:var(--tinta-3);
}

.wrap{max-width:1240px;margin:0 auto;padding:0 22px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-9999px;top:0;z-index:200;background:var(--azul);
  color:var(--lienzo);padding:11px 18px;border-radius:0 0 var(--r-2) 0;font-weight:700}
.skip:focus{left:0}

/* ---------- 5. Aviso de prototipo ---------- */
.aviso{
  background:var(--azul-9);color:#CFE0EE;font-size:11.5px;text-align:center;
  padding:7px 16px;font-family:var(--f-num);letter-spacing:.02em;
}
.aviso b{color:#fff}

/* ---------- 6. Cabecera ---------- */
header{
  background:var(--lienzo);border-bottom:1px solid var(--linea);
  position:sticky;top:0;z-index:60;
}
.hrow{display:flex;align-items:center;gap:18px;height:64px}
.marca{display:flex;flex-direction:column;justify-content:center;flex:none;text-decoration:none}
.marca-w{font-weight:800;font-size:19px;color:var(--azul);letter-spacing:-.02em;white-space:nowrap}
.marca-w em{font-style:normal;color:var(--azul-cl)}
.marca-s{font-family:var(--f-num);font-size:8.5px;font-weight:600;color:var(--tinta-3);
  letter-spacing:.19em;text-transform:uppercase}
nav.top{display:flex;gap:2px;flex:1;min-width:0}
nav.top a{
  padding:8px 11px;border-radius:var(--r-2);color:var(--tinta-2);text-decoration:none;
  font-size:13.5px;font-weight:600;white-space:nowrap;
}
nav.top a:hover{background:var(--fondo-2);color:var(--azul)}
nav.top a[aria-current="true"]{background:var(--fondo-2);color:var(--azul)}
nav.top a.coll{color:var(--oro)}
.hacts{display:flex;align-items:center;gap:7px;flex:none}
.icbtn{
  width:36px;height:36px;border:1px solid var(--linea);border-radius:var(--r-2);
  background:var(--lienzo);color:var(--tinta-2);display:grid;place-items:center;position:relative;
}
.icbtn:hover{border-color:var(--azul-cl);color:var(--azul-cl)}
.icbtn svg{width:17px;height:17px}
.icbtn .cnt{
  position:absolute;top:-6px;right:-6px;min-width:17px;height:17px;border-radius:99px;
  background:var(--amarillo);color:var(--sobre-amarillo);font-family:var(--f-num);font-size:10px;font-weight:700;
  display:grid;place-items:center;padding:0 4px;
}
/* display:grid en .cnt gana al [hidden] del navegador: hay que
   desactivarlo explícitamente o el contador aparece con un 0. */
.icbtn[hidden],.icbtn .cnt[hidden]{display:none}
.icbtn[aria-pressed="true"]{border-color:var(--oro);color:var(--oro)}
.selidi{
  border:1px solid var(--linea);border-radius:var(--r-2);background:var(--lienzo);
  padding:8px 8px;font-size:12.5px;font-weight:700;color:var(--tinta-2);
  font-family:var(--f-num);letter-spacing:.04em;
}
.burger{display:none}

/* ---------- 7. Hero — el instrumento de búsqueda es la tesis ---------- */
.hero{
  position:relative;overflow:hidden;color:#EAF3FA;
  background:
    radial-gradient(110% 85% at 6% -18%, #135A9E 0%, rgba(19,90,158,0) 58%),
    radial-gradient(80% 130% at 102% 116%, rgba(255,206,0,.30) 0%, rgba(255,206,0,0) 60%),
    linear-gradient(168deg,#0A4B8C 0%,#073A6E 58%,#052A52 100%);
  padding:40px 0 0;
}
/* Curvas de nivel — cita al plano topográfico, dibujadas, no decorativas */
.hero-curvas{position:absolute;inset:0;opacity:.2;pointer-events:none}
.hero-in{position:relative;z-index:2}
.hero-eyebrow{
  font-family:var(--f-num);font-size:10.5px;font-weight:600;letter-spacing:.17em;
  text-transform:uppercase;color:var(--amarillo);display:flex;align-items:center;gap:9px;
}
.hero-eyebrow::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,var(--amarillo),transparent);max-width:190px}
.hero h1{
  font-size:clamp(27px,4.3vw,42px);margin-top:12px;max-width:19em;color:#fff;
  letter-spacing:-.032em;
}
.hero h1 em{font-style:normal;color:var(--amarillo)}
.hero-sub{margin-top:10px;font-size:15.5px;color:#C3DBEF;max-width:44em}

/* Pestañas de operación */
.ops{display:flex;gap:4px;margin-top:24px;flex-wrap:wrap}
.ops button{
  padding:9px 17px;border-radius:var(--r-2) var(--r-2) 0 0;font-size:13.5px;font-weight:700;
  background:rgba(255,255,255,.13);color:#DCEAF6;
}
.ops button:hover{background:rgba(255,255,255,.22)}
.ops button[aria-selected="true"]{background:var(--lienzo);color:var(--azul)}

/* Caja de búsqueda */
.buscador{
  background:var(--lienzo);border-radius:0 var(--r-3) var(--r-3) var(--r-3);
  padding:15px;box-shadow:var(--sombra-2);position:relative;z-index:3;
}
.b-tags{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-bottom:10px}
.tag-ia,.tag-gpt{
  display:inline-flex;align-items:center;gap:6px;font-family:var(--f-num);font-size:10.5px;
  font-weight:600;border-radius:99px;padding:4px 10px;letter-spacing:.03em;
}
.tag-ia{color:var(--azul-cl);background:var(--azul-bg);border:1px solid var(--azul-bd)}
.tag-gpt{color:var(--tinta-2);background:var(--fondo-2);border:1px solid var(--linea)}
.b-row{display:flex;gap:8px}
.b-row .campo{position:relative;flex:1;min-width:0}
.b-row input{
  width:100%;border:2px solid var(--linea-2);border-radius:var(--r-2);
  padding:13px 15px;font-size:15px;background:var(--lienzo);color:var(--tinta);
}
.b-row input::placeholder{color:var(--tinta-4)}
.b-row input:focus{outline:none;border-color:var(--azul-cl)}
.b-mic{
  width:50px;flex:none;border:2px solid var(--linea-2);border-radius:var(--r-2);
  background:var(--lienzo);color:var(--tinta-2);display:grid;place-items:center;
}
.b-mic:hover{border-color:var(--azul-cl);color:var(--azul-cl)}
/* Grabando: borde amarillo, pero la tinta en oro, porque el amarillo
   puro sobre blanco no es legible. */
.b-mic[data-rec="1"]{border-color:var(--amarillo);color:var(--sobre-amarillo);animation:pulso 1.3s infinite}
@keyframes pulso{50%{background:var(--amarillo-2)}}
.b-go{
  flex:none;background:var(--amarillo);color:var(--sobre-amarillo);font-weight:800;font-size:14.5px;
  padding:0 27px;border-radius:var(--r-2);
}
.b-go:hover{background:var(--amarillo-9)}
.sug{display:flex;gap:7px;flex-wrap:wrap;margin-top:11px}
.sug button{
  border:1px dashed var(--linea-2);background:var(--lienzo-2);color:var(--tinta-2);
  border-radius:99px;padding:6px 13px;font-size:12.5px;
}
.sug button:hover{border-color:var(--azul-cl);border-style:solid;color:var(--azul-cl)}

/* Fichas de criterio que la IA rellena */
.leidos{margin-top:12px;padding-top:12px;border-top:1px dashed var(--linea)}
.leidos[hidden]{display:none}
.leidos-h{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.leidos-l{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}
.crit{
  display:inline-flex;align-items:center;gap:7px;background:var(--azul);
  color:var(--sobre-azul);font-size:12px;font-weight:700;border-radius:99px;padding:5px 7px 5px 11px;
}
.crit .x{
  width:16px;height:16px;border-radius:99px;background:rgba(255,255,255,.22);
  display:grid;place-items:center;font-size:10px;line-height:1;
}
.crit:hover{background:var(--crit)}
.crit:hover .x{background:rgba(255,255,255,.3)}
.no-leido{
  display:inline-flex;align-items:center;gap:6px;background:var(--warn-bg);color:var(--warn);
  border:1px solid var(--warn-bd);font-size:12px;font-weight:600;border-radius:99px;padding:4px 11px;
}
.limpiar{font-size:12px;font-weight:700;color:var(--tinta-3);text-decoration:underline}
.limpiar:hover{color:var(--crit)}

/* ---------- 8. Banda de indicadores con la brecha como tesis ---------- */
.tesis{
  margin-top:-1px;background:var(--fondo);position:relative;z-index:2;
  border-top:1px solid transparent;
}
.tesis-in{
  display:grid;grid-template-columns:minmax(300px,1.15fr) 2fr;gap:18px;
  padding:26px 0 6px;align-items:stretch;
}
.brecha{
  background:var(--lienzo);border:1px solid var(--linea);border-radius:var(--r-3);
  padding:17px 19px;box-shadow:var(--sombra-1);
}
/* h2 por jerarquía (va antes que los h2 de sección), tamaño de
   subtítulo por diseño: el nivel lo marca la estructura, no el
   tamaño de la letra. */
.brecha h2{font-size:14.5px;color:var(--azul);letter-spacing:-.01em}
.brecha p{font-size:12.5px;color:var(--tinta-2);margin-top:3px}
.brecha figure{margin-top:13px}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(178px,1fr));gap:14px}
.kpi{
  background:var(--lienzo);border:1px solid var(--linea);border-radius:var(--r-3);
  padding:15px 17px;display:flex;flex-direction:column;box-shadow:var(--sombra-1);
}
.kpi-v{font-size:23px;font-weight:800;color:var(--azul);line-height:1.05;white-space:nowrap}
.kpi-k{font-size:12.5px;color:var(--tinta-2);margin-top:4px;flex:1}
.kpi-d{font-size:11.5px;color:var(--azul-cl);font-weight:700;margin-top:6px}
.kpi-src{
  font-family:var(--f-num);font-size:9.5px;color:var(--tinta-3);margin-top:8px;
  border-top:1px dashed var(--linea);padding-top:6px;letter-spacing:.02em;
}

/* ---------- 9. Secciones ---------- */
section{padding:38px 0;scroll-margin-top:74px}
.sec-h{margin-bottom:20px}
.sec-h h2{font-size:23px;color:var(--azul)}
.sec-h p{color:var(--tinta-2);font-size:14px;margin-top:5px;max-width:62em}

/* ---------- 10. Resultados: plancha del archipiélago + rejilla ---------- */
.res-lay{display:grid;grid-template-columns:274px 1fr;gap:22px;align-items:start}
.rail{position:sticky;top:78px;display:flex;flex-direction:column;gap:14px}
.panel{
  background:var(--lienzo);border:1px solid var(--linea);border-radius:var(--r-3);
  padding:15px;box-shadow:var(--sombra-1);
}
.panel > .lbl{display:block;margin-bottom:10px}
.plancha{width:100%;height:auto}
.isla-h{fill:var(--azul-cl);opacity:0;transition:opacity .16s}
/* Con ratón el objetivo es la isla dibujada; el círculo solo hace falta
   con el dedo, y ahí conviene que sea generoso. */
.isla-toque{fill:transparent;r:22;cursor:pointer}
.isla-g:hover .isla-h,.isla-g:focus-visible .isla-h{opacity:.28}
.isla-g[aria-pressed="true"] .isla-h{opacity:.55}
.isla-g{cursor:pointer}
.isla-g text{font-family:var(--f-num);font-size:7.4px;font-weight:600;fill:var(--tinta-2)}
.isla-g .cta{font-size:8.6px;font-weight:700;fill:var(--azul)}
.isla-g[aria-pressed="true"] text,.isla-g[aria-pressed="true"] .cta{fill:var(--azul-cl2)}

.campo-g{display:flex;flex-direction:column;gap:5px;margin-bottom:12px}
.campo-g:last-child{margin-bottom:0}
.campo-g > label{font-family:var(--f-num);font-size:10px;font-weight:600;
  text-transform:uppercase;letter-spacing:.1em;color:var(--tinta-3)}
select.ctl,input.ctl{
  border:1px solid var(--linea-2);background:var(--lienzo);border-radius:var(--r-2);
  padding:9px 10px;font-size:13.5px;font-weight:600;color:var(--tinta);width:100%;
}
select.ctl:focus,input.ctl:focus{outline:none;border-color:var(--azul-cl)}
.toggles{display:flex;flex-direction:column;gap:7px}
.tog{
  display:flex;align-items:center;gap:9px;border:1px solid var(--linea-2);border-radius:var(--r-2);
  padding:9px 11px;font-size:13px;font-weight:600;color:var(--tinta-2);cursor:pointer;
}
.tog input{accent-color:var(--azul-cl);width:15px;height:15px;flex:none}
.tog:hover{border-color:var(--linea-2);background:var(--lienzo-2)}
.tog:has(input:checked){border-color:var(--azul-cl);color:var(--azul-cl);background:var(--azul-bg)}
.tog:has(input:focus-visible){outline:2.5px solid var(--foco);outline-offset:2px}

.res-top{
  display:flex;justify-content:space-between;align-items:flex-end;gap:14px;
  flex-wrap:wrap;margin-bottom:15px;
}
.res-n{font-size:14px;color:var(--tinta-2)}
.res-n b{font-family:var(--f-num);font-size:19px;color:var(--azul);font-weight:800}
.res-acts{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.btn-s{
  border:1px solid var(--linea-2);background:var(--lienzo);border-radius:var(--r-2);
  padding:8px 13px;font-size:12.5px;font-weight:700;color:var(--tinta-2);
  display:inline-flex;align-items:center;gap:7px;
}
.btn-s:hover{border-color:var(--azul-cl);color:var(--azul-cl)}
.btn-s svg{width:14px;height:14px}
.btn-filtros{display:none}

.rejilla{display:grid;grid-template-columns:repeat(auto-fill,minmax(288px,1fr));gap:18px}

/* ---------- 11. Tarjeta de anuncio ---------- */
.tar{
  background:var(--lienzo);border:1px solid var(--linea);border-radius:var(--r-3);
  overflow:hidden;box-shadow:var(--sombra-1);position:relative;display:flex;flex-direction:column;
  transition:transform .18s,box-shadow .18s,border-color .18s;
}
.tar:hover{transform:translateY(-3px);box-shadow:var(--sombra-2);border-color:var(--linea-2)}
.tar:focus-within{border-color:var(--azul-cl)}
.tar.vendido{opacity:.72}
.tar-abrir{
  position:absolute;inset:0;z-index:1;display:block;width:100%;height:100%;
  border-radius:var(--r-3);text-decoration:none;
}
.tar-abrir:focus-visible{outline:2.5px solid var(--foco);outline-offset:-3px}
.tar-img{position:relative;aspect-ratio:16/10;background:var(--fondo-2);overflow:hidden}
/* Hijo directo, no descendiente: como descendiente esta regla
   estiraba también los iconos de los distintivos superpuestos
   (el "comprobado" pasaba a 279 px y tapaba la imagen). */
.tar-img > svg{width:100%;height:100%}
.tar-cap{
  position:absolute;inset:auto 0 0 0;padding:9px;display:flex;justify-content:space-between;
  align-items:flex-end;gap:8px;
  background:linear-gradient(to top,rgba(8,25,40,.62),rgba(8,25,40,0));
}
.sellos{display:flex;flex-wrap:wrap;gap:5px}
.sello{
  font-family:var(--f-num);font-size:9.5px;font-weight:700;border-radius:5px;padding:3px 7px;
  letter-spacing:.055em;display:inline-flex;align-items:center;gap:4px;text-transform:uppercase;
  border:1px solid transparent;white-space:nowrap;
}
.sello svg{width:10px;height:10px}
/* Fondo blanco fijo sobre la foto: la tinta también debe ser fija,
   o en tema oscuro queda verde claro sobre blanco (2,2:1). */
.sello.ver{background:#fff;color:var(--ok-fijo);border-color:#B6DCC6}
.sello.vvc{background:var(--ok);color:var(--sobre-azul)}
.sello.vva{background:var(--warn-bg);color:var(--warn);border-color:var(--warn-bd)}
.sello.col{background:var(--oro);color:var(--sobre-azul)}
.sello.est{background:var(--tinta);color:var(--fondo)}
.tar-fotos{
  position:absolute;top:9px;right:9px;background:rgba(9,26,41,.72);color:#fff;
  font-family:var(--f-num);font-size:10px;font-weight:600;border-radius:5px;padding:3px 7px;
  display:inline-flex;align-items:center;gap:5px;
}
.tar-fotos svg{width:11px;height:11px}
.tar-fresco{
  position:absolute;top:9px;left:9px;background:rgba(255,255,255,.94);color:var(--tinta-fija-2);
  font-family:var(--f-num);font-size:9.5px;font-weight:600;border-radius:5px;padding:3px 7px;
}
.fav{
  position:absolute;top:38px;right:9px;z-index:2;width:31px;height:31px;border-radius:99px;
  background:rgba(255,255,255,.93);display:grid;place-items:center;color:var(--tinta-fija-2);
  border:1px solid rgba(0,0,0,.06);
}
.fav svg{width:16px;height:16px}
.fav[aria-pressed="true"]{color:var(--oro)}
.fav[aria-pressed="true"] svg{fill:currentColor}
.fav:hover{color:var(--oro)}

.tar-body{padding:13px 15px 14px;display:flex;flex-direction:column;flex:1;position:relative;
  pointer-events:none}
.tar-body a,.tar-body button{pointer-events:auto}
.price{font-size:20.5px;font-weight:800;color:var(--azul);line-height:1.1}
.price sup{font-size:12px;font-weight:600;color:var(--tinta-3);margin-left:6px;
  vertical-align:baseline;font-variant-numeric:tabular-nums}
.tar-t{font-size:14.5px;font-weight:700;margin-top:4px;letter-spacing:-.012em}
.tar-loc{font-size:12.5px;color:var(--tinta-2);margin-top:2px;display:flex;align-items:center;gap:5px}
.tar-loc svg{width:12px;height:12px;flex:none;color:var(--tinta-3)}
.tar-meta{
  display:flex;gap:11px;font-family:var(--f-num);font-size:12px;color:var(--tinta-2);
  margin-top:9px;flex-wrap:wrap;
}
.tar-q{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.q{
  font-size:11px;font-weight:600;border-radius:5px;padding:3px 7px;
  background:var(--fondo-2);color:var(--tinta-2);display:inline-flex;align-items:center;gap:4px;
  border:1px solid var(--linea);
}
.q svg{width:11px;height:11px}
.q.plan{color:var(--azul-cl);background:var(--azul-bg);border-color:var(--azul-bd)}
.q.resp{color:var(--ok);background:var(--ok-bg);border-color:var(--ok-bd)}
.tar-pie{
  display:flex;justify-content:space-between;align-items:center;gap:9px;
  margin-top:auto;padding-top:11px;border-top:1px solid var(--linea);flex-wrap:wrap;
}
.ener{
  font-family:var(--f-num);font-size:10.5px;font-weight:700;border-radius:5px;padding:3px 8px;
  display:inline-flex;align-items:center;gap:5px;letter-spacing:.03em;
}
.ener i{width:8px;height:8px;border-radius:2px;display:inline-block;flex:none}
.cierre{font-family:var(--f-num);font-size:10.5px;color:var(--tinta-3)}
.cierre b{color:var(--azul-cl)}
.cmp{
  border:1px solid var(--linea-2);border-radius:var(--r-1);padding:3px 8px;font-size:11px;
  font-weight:700;color:var(--tinta-2);position:relative;z-index:2;
}
.cmp[aria-pressed="true"]{background:var(--azul);color:var(--sobre-azul);border-color:var(--azul)}

.vacio{
  padding:48px 24px;text-align:center;border:1px dashed var(--linea-2);border-radius:var(--r-3);
  background:var(--lienzo-2);
}
.vacio b{display:block;font-size:16px;color:var(--azul);margin-bottom:6px}
.vacio p{font-size:13.5px;color:var(--tinta-2);max-width:34em;margin:0 auto}
.vacio button{margin-top:14px}
.vacio[hidden]{display:none}

/* ---------- 12. Semáforo VV ---------- */
.vv-lay{display:grid;grid-template-columns:1fr 340px;gap:22px;align-items:start}
.vv-rej{display:grid;grid-template-columns:repeat(auto-fit,minmax(252px,1fr));gap:13px}
.vvc{
  background:var(--lienzo);border:1px solid var(--linea);border-radius:var(--r-3);
  padding:14px 16px;box-shadow:var(--sombra-1);text-align:left;width:100%;
}
.vvc:hover{border-color:var(--azul-cl)}
.vvc-t{display:flex;justify-content:space-between;align-items:baseline;gap:9px}
.vvc-t b{font-size:14px;letter-spacing:-.01em}
.estado{
  font-family:var(--f-num);font-size:9.5px;font-weight:700;border-radius:99px;padding:3px 9px;
  letter-spacing:.055em;display:inline-flex;align-items:center;gap:4px;flex:none;
  border:1px solid transparent;text-transform:uppercase;
}
.estado svg{width:10px;height:10px}
.e-ok{background:var(--ok-bg);color:var(--ok);border-color:var(--ok-bd)}
.e-w{background:var(--warn-bg);color:var(--warn);border-color:var(--warn-bd)}
.e-c{background:var(--crit-bg);color:var(--crit);border-color:var(--crit-bd)}
.barra{height:8px;background:var(--reja);border-radius:99px;margin:11px 0 7px;overflow:hidden}
.barra i{display:block;height:100%;border-radius:99px}
.vvc-n{font-size:11.5px;color:var(--tinta-2)}
.vvc-n b{font-family:var(--f-num);color:var(--tinta)}

/* Comprobador de requisitos Ley 6/2025 */
.chk{
  background:var(--lienzo);border:1px solid var(--linea);border-radius:var(--r-3);
  padding:17px 18px;box-shadow:var(--sombra-1);position:sticky;top:78px;
}
.chk h3{font-size:15px;color:var(--azul)}
.chk > p{font-size:12.5px;color:var(--tinta-2);margin-top:4px}
.chk-f{display:grid;gap:11px;margin-top:14px}
.chk-r{display:grid;gap:9px;margin-top:15px;padding-top:14px;border-top:1px dashed var(--linea)}
.chk-i{display:flex;gap:9px;align-items:flex-start;font-size:12.5px;line-height:1.45}
.chk-i svg{width:15px;height:15px;flex:none;margin-top:2px}
.chk-i.si{color:var(--ok)} .chk-i.no{color:var(--crit)} .chk-i.qz{color:var(--warn)}
.chk-v{
  margin-top:13px;padding:11px 13px;border-radius:var(--r-2);font-size:13px;font-weight:600;
  border:1px solid transparent;
}
.chk-v.si{background:var(--ok-bg);color:var(--ok);border-color:var(--ok-bd)}
.chk-v.no{background:var(--crit-bg);color:var(--crit);border-color:var(--crit-bd)}
.chk-v.qz{background:var(--warn-bg);color:var(--warn);border-color:var(--warn-bd)}
.chk-src{font-family:var(--f-num);font-size:9.5px;color:var(--tinta-3);margin-top:11px;
  letter-spacing:.02em}

/* ---------- 13. Modo inversor ---------- */
.inv-lay{display:grid;grid-template-columns:1fr 1fr;gap:22px;align-items:start}
.tabla-wrap{overflow-x:auto;border:1px solid var(--linea);border-radius:var(--r-3);
  background:var(--lienzo);box-shadow:var(--sombra-1)}
table.datos{width:100%;border-collapse:collapse;font-size:13px;min-width:440px}
table.datos th,table.datos td{padding:10px 13px;text-align:left;border-bottom:1px solid var(--linea)}
table.datos thead th{
  font-family:var(--f-num);font-size:9.5px;font-weight:700;text-transform:uppercase;
  letter-spacing:.09em;color:var(--tinta-3);background:var(--lienzo-2);white-space:nowrap;
}
table.datos tbody tr:last-child td{border-bottom:0}
table.datos td.n{font-family:var(--f-num);font-variant-numeric:tabular-nums;text-align:right}
table.datos tbody tr:hover{background:var(--lienzo-2)}
.leyenda{display:flex;gap:15px;flex-wrap:wrap;margin-top:12px}
.leyenda span{display:inline-flex;align-items:center;gap:7px;font-size:12px;color:var(--tinta-2)}
.leyenda i{width:11px;height:11px;border-radius:3px;flex:none}

/* ---------- 14. Collection — banda oscura comprometida ---------- */
.coll{
  border-radius:var(--r-4);padding:34px;color:#E9F1F8;position:relative;overflow:hidden;
  background:linear-gradient(152deg,#04182B 0%,#072A4C 58%,#031423 100%);
  border:1px solid rgba(255,206,0,.28);
}
.coll::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(70% 100% at 88% 0%,rgba(255,206,0,.16),transparent 62%);
}
.coll-in{position:relative}
.coll .lbl{color:var(--amarillo)}
.coll h2{color:var(--amarillo);font-size:23px;letter-spacing:.08em;margin-top:7px}
.coll > .coll-in > p{color:#B9CFE2;font-size:13.5px;margin:8px 0 21px;max-width:52em}
.coll-rej{display:grid;grid-template-columns:repeat(auto-fill,minmax(278px,1fr));gap:16px}
.coll .tar{
  background:rgba(255,255,255,.05);border-color:rgba(255,206,0,.3);box-shadow:none;
}
.coll .tar:hover{border-color:var(--amarillo)}
.coll .price{color:var(--amarillo)}
.coll .tar-t{color:#E9F1F8}
.coll .tar-loc,.coll .tar-meta,.coll .cierre{color:#A8C1D8}
.coll .tar-loc svg{color:#87A5C0}
.coll .q{background:rgba(255,255,255,.07);color:#B9CFE2;border-color:rgba(255,255,255,.12)}
.coll .tar-pie{border-top-color:rgba(255,255,255,.12)}
.coll .tar-img{background:#031423}
.coll .fav{background:rgba(4,24,43,.82);color:var(--amarillo);border-color:rgba(255,206,0,.3)}
.coll .cmp{color:#B9CFE2;border-color:rgba(255,206,0,.3)}

/* ---------- 15. Evidencia ---------- */
.ev-rej{display:grid;grid-template-columns:repeat(auto-fit,minmax(266px,1fr));gap:15px}
.ev{
  background:var(--lienzo);border:1px solid var(--linea);border-radius:var(--r-3);
  padding:18px;box-shadow:var(--sombra-1);display:flex;flex-direction:column;
}
.ev-ic{width:34px;height:34px;border-radius:var(--r-2);background:var(--azul-bg);
  color:var(--azul-cl);display:grid;place-items:center;border:1px solid var(--azul-bd)}
.ev-ic svg{width:18px;height:18px}
.ev b{display:block;margin:11px 0 5px;color:var(--azul);font-size:14.5px}
.ev p{font-size:12.5px;color:var(--tinta-2);flex:1}
.ev-f{
  font-family:var(--f-num);font-size:9.5px;color:var(--tinta-3);margin-top:11px;
  padding-top:8px;border-top:1px dashed var(--linea);letter-spacing:.02em;
}

/* ---------- 16. Hoja de propiedad (modal) ---------- */
.velo{
  position:fixed;inset:0;background:rgba(8,20,32,.62);z-index:100;display:none;
  align-items:flex-start;justify-content:center;padding:26px 16px;overflow-y:auto;
  backdrop-filter:blur(3px);
}
.velo.on{display:flex}
.hoja{
  background:var(--lienzo);border-radius:var(--r-4);max-width:840px;width:100%;
  box-shadow:var(--sombra-3);overflow:hidden;position:relative;
}
.h-gal{position:relative;background:var(--fondo-2);aspect-ratio:16/9}
/* Mismo motivo que en .tar-img: solo la escena, no los iconos */
.h-gal > div > svg{width:100%;height:100%}
.h-gal-nav{
  position:absolute;top:50%;transform:translateY(-50%);width:38px;height:38px;border-radius:99px;
  background:rgba(255,255,255,.93);color:var(--tinta-fija);display:grid;place-items:center;
  box-shadow:var(--sombra-1);
}
.h-gal-nav svg{width:17px;height:17px}
.h-gal-nav.prev{left:11px} .h-gal-nav.next{right:11px}
.h-gal-pts{
  position:absolute;bottom:11px;left:50%;transform:translateX(-50%);display:flex;gap:5px;
  background:rgba(9,26,41,.55);padding:5px 9px;border-radius:99px;
}
.h-gal-pts i{width:6px;height:6px;border-radius:99px;background:rgba(255,255,255,.42)}
.h-gal-pts i.on{background:#fff;width:16px}
.h-top{position:absolute;inset:11px 11px auto 11px;display:flex;justify-content:space-between;gap:10px}
.h-cerrar{
  width:36px;height:36px;border-radius:99px;background:rgba(255,255,255,.94);
  color:var(--tinta-fija);display:grid;place-items:center;box-shadow:var(--sombra-1);flex:none;
}
.h-cerrar svg{width:16px;height:16px}
.h-body{padding:22px 26px 26px}
.h-price{font-size:28px;font-weight:800;color:var(--azul);line-height:1.05}
.h-price sup{font-size:14px}
.h-t{font-size:18px;font-weight:800;margin-top:5px;letter-spacing:-.02em}
.h-loc{font-size:13.5px;color:var(--tinta-2);margin-top:4px}
.h-ref{font-family:var(--f-num);font-size:10.5px;color:var(--tinta-3);margin-top:7px;letter-spacing:.03em}
.h-resp{
  display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--tinta-2);margin-top:12px;
  background:var(--lienzo-2);border:1px solid var(--linea);border-radius:var(--r-2);padding:9px 12px;
}
.h-resp .pt{width:8px;height:8px;border-radius:99px;background:var(--ok);flex:none}
.h-sec{margin-top:20px}
.h-sec > h4{
  font-family:var(--f-num);font-size:10px;letter-spacing:.12em;color:var(--tinta-3);
  text-transform:uppercase;margin-bottom:10px;display:flex;align-items:center;gap:9px;
}
.h-sec > h4::after{content:"";flex:1;height:1px;background:var(--linea)}
.mrej{display:grid;grid-template-columns:repeat(auto-fit,minmax(142px,1fr));gap:10px}
.mbox{background:var(--lienzo-2);border:1px solid var(--linea);border-radius:var(--r-2);padding:11px 13px}
.mbox-v{font-weight:800;color:var(--azul);font-size:15px;display:flex;align-items:center;gap:6px}
.mbox-v svg{width:14px;height:14px;color:var(--azul-cl)}
.mbox-k{font-size:11.5px;color:var(--tinta-2);margin-top:2px}

/* Sello de verificación — estampado documental */
.verif{
  background:var(--ok-bg);border:1px solid var(--ok-bd);border-radius:var(--r-3);padding:14px 16px;
}
.verif-t{font-weight:800;color:var(--ok);font-size:13.5px;display:flex;align-items:center;gap:8px}
.verif-t svg{width:17px;height:17px;flex:none}
.verif ul{list-style:none;margin-top:10px;display:grid;
  grid-template-columns:repeat(auto-fit,minmax(196px,1fr));gap:6px}
.verif li{font-size:12.5px;color:var(--ok);display:flex;gap:7px;align-items:flex-start}
.verif li svg{width:13px;height:13px;flex:none;margin-top:3px}
.verif-u{
  font-size:11.5px;color:var(--ok);margin-top:11px;border-top:1px solid var(--ok-bd);
  padding-top:9px;display:flex;justify-content:space-between;align-items:center;gap:9px;flex-wrap:wrap;
}
.verif-u button{
  border:1px solid var(--ok);background:var(--lienzo);color:var(--ok);border-radius:var(--r-1);
  padding:4px 11px;font-size:11px;font-weight:700;
}
.avm{
  font-size:12.5px;background:var(--lienzo-2);border:1px solid var(--linea);border-left:3px solid var(--azul-cl);
  border-radius:var(--r-2);padding:12px 14px;margin-top:14px;color:var(--tinta-2);
}
.avm b{color:var(--tinta)}
.avm .num{color:var(--azul);font-weight:700}

/* Plano acotado */
.plano-wrap{border:1px solid var(--linea);border-radius:var(--r-2);background:var(--lienzo-2);
  padding:11px;overflow-x:auto}
.plano{width:100%;min-width:340px;height:auto}
.plano .muro{fill:none;stroke:var(--tinta);stroke-width:2.4}
.plano .div{fill:none;stroke:var(--tinta-3);stroke-width:1.2}
.plano .sala{fill:var(--lienzo)}
.plano .sala-2{fill:var(--fondo-2)}
.plano .rot{font-family:var(--f-num);font-size:6.6px;font-weight:700;fill:var(--tinta);
  text-transform:uppercase;letter-spacing:.06em}
.plano .med{font-family:var(--f-num);font-size:6px;fill:var(--tinta-3)}
.plano .cota{stroke:var(--azul-cl);stroke-width:.8}
.plano .cota-t{font-family:var(--f-num);font-size:6.2px;fill:var(--azul-cl);font-weight:600}

/* Gráfico de escenarios */
.esc{display:grid;gap:10px}
.esc-r{display:grid;grid-template-columns:132px 1fr 62px;gap:11px;align-items:center;font-size:12.5px}
.esc-r .bar{height:11px;background:var(--reja);border-radius:99px;position:relative;overflow:hidden}
.esc-r .bar i{
  display:block;height:100%;border-radius:99px 4px 4px 99px;
  box-shadow:0 0 0 2px var(--lienzo);
}
.esc-r b{font-family:var(--f-num);text-align:right;color:var(--tinta);font-variant-numeric:tabular-nums}
.esc-r .na{font-family:var(--f-num);text-align:right;color:var(--tinta-4);font-size:11px}
.esc-r .nom{display:flex;align-items:center;gap:7px}
.esc-r .nom i{width:10px;height:10px;border-radius:3px;flex:none}

/* Plegables */
details{
  border:1px solid var(--linea);border-radius:var(--r-2);margin-top:9px;background:var(--lienzo-2);
}
details summary{
  padding:11px 14px;font-size:13px;font-weight:700;color:var(--tinta-2);cursor:pointer;
  list-style:none;display:flex;justify-content:space-between;align-items:center;gap:11px;
}
details summary::-webkit-details-marker{display:none}
details summary::after{content:"+";font-family:var(--f-num);color:var(--azul-cl);font-weight:800;font-size:16px}
details[open] summary::after{content:"–"}
details summary:hover{color:var(--azul)}
details .dbody{padding:0 14px 13px;font-size:13px;color:var(--tinta-2)}
details .dbody b{color:var(--tinta)}

/* Acciones */
.h-cta{display:flex;gap:9px;margin-top:22px;flex-wrap:wrap}
.btn{
  border-radius:var(--r-2);padding:12px 19px;font-weight:800;font-size:13.5px;
  display:inline-flex;align-items:center;gap:8px;border:1px solid transparent;
}
.btn svg{width:15px;height:15px}
.btn-1{background:var(--amarillo);color:var(--sobre-amarillo)}
.btn-1:hover{background:var(--amarillo-9)}
.btn-2{background:var(--azul);color:var(--lienzo)}
.btn-2:hover{background:var(--azul-2)}
.btn-3{background:var(--lienzo-2);color:var(--tinta-2);border-color:var(--linea-2)}
.btn-3:hover{border-color:var(--azul-cl);color:var(--azul-cl)}

/* ---------- 17. Formulario multipaso ---------- */
.pasos{margin-top:14px}
.pasos-b{display:flex;gap:6px;margin-bottom:15px}
.pasos-b i{height:4px;flex:1;border-radius:99px;background:var(--reja)}
.pasos-b i.on{background:var(--azul-cl)}
.pasos-n{font-family:var(--f-num);font-size:10px;letter-spacing:.1em;color:var(--tinta-3);
  text-transform:uppercase;margin-bottom:10px}
.paso[hidden]{display:none}
.paso h5{font-size:15px;color:var(--azul);margin-bottom:4px}
.paso > p{font-size:12.5px;color:var(--tinta-2);margin-bottom:13px}
.opts{display:grid;grid-template-columns:repeat(auto-fit,minmax(132px,1fr));gap:8px}
.opt{
  border:1px solid var(--linea-2);border-radius:var(--r-2);padding:11px 12px;text-align:left;
  font-size:13px;font-weight:600;color:var(--tinta-2);background:var(--lienzo);
}
.opt:hover{border-color:var(--azul-cl);color:var(--azul-cl)}
.opt[aria-pressed="true"]{border-color:var(--azul-cl);background:var(--ok-bg);color:var(--azul-cl)}
.opt small{display:block;font-weight:400;font-size:11px;color:var(--tinta-3);margin-top:2px}
.paso-nav{display:flex;justify-content:space-between;gap:9px;margin-top:16px}
.hecho{text-align:center;padding:22px 12px}
.hecho .ic{width:52px;height:52px;border-radius:99px;background:var(--ok-bg);color:var(--ok);
  display:grid;place-items:center;margin:0 auto 13px;border:1px solid var(--ok-bd)}
.hecho .ic svg{width:26px;height:26px}
.hecho b{display:block;font-size:16px;color:var(--azul);margin-bottom:5px}
.hecho p{font-size:13px;color:var(--tinta-2);max-width:32em;margin:0 auto}

/* Calculadora */
.calc-f{display:grid;grid-template-columns:repeat(auto-fit,minmax(148px,1fr));gap:11px}
.calc-out{margin-top:15px;display:grid;gap:9px}
.calc-l{display:flex;justify-content:space-between;align-items:baseline;gap:11px;font-size:13px;
  padding-bottom:7px;border-bottom:1px dashed var(--linea)}
.calc-l span{color:var(--tinta-2)}
.calc-l b{font-family:var(--f-num);font-variant-numeric:tabular-nums;color:var(--tinta)}
.calc-l.tot{border-bottom:0;padding-top:4px;font-size:15px}
.calc-l.tot span{color:var(--azul);font-weight:700}
.calc-l.tot b{color:var(--azul);font-size:19px;font-weight:800}
.calc-bar{display:flex;height:11px;border-radius:99px;overflow:hidden;gap:2px;margin:6px 0 3px}
.calc-bar i{display:block;height:100%}

/* ---------- 18. Comparador ---------- */
.cmp-lay{overflow-x:auto}
table.cmp-t{width:100%;border-collapse:collapse;font-size:13px;min-width:520px}
table.cmp-t th,table.cmp-t td{padding:10px 12px;border-bottom:1px solid var(--linea);text-align:left;
  vertical-align:top}
table.cmp-t thead th{background:var(--lienzo-2);font-size:13.5px;color:var(--azul)}
table.cmp-t tbody th{
  font-family:var(--f-num);font-size:9.5px;text-transform:uppercase;letter-spacing:.09em;
  color:var(--tinta-3);font-weight:700;white-space:nowrap;width:1%;
}
table.cmp-t td{font-family:var(--f-num);font-variant-numeric:tabular-nums}
table.cmp-t td.mejor{color:var(--ok);font-weight:700}
table.cmp-t td.txt{font-family:var(--f-txt)}

/* ---------- 19. Asistente ---------- */
.fab{
  position:fixed;right:18px;bottom:18px;z-index:70;background:var(--azul);color:var(--lienzo);
  border-radius:99px;padding:12px 19px;font-weight:800;font-size:13.5px;box-shadow:var(--sombra-2);
  display:inline-flex;align-items:center;gap:8px;
}
.fab svg{width:16px;height:16px}
.fab:hover{background:var(--azul-2)}
.asis{
  position:fixed;right:18px;bottom:70px;z-index:71;width:352px;max-width:calc(100vw - 36px);
  background:var(--lienzo);border:1px solid var(--linea);border-radius:var(--r-3);
  box-shadow:var(--sombra-3);overflow:hidden;
}
.asis[hidden]{display:none}
.asis-h{
  background:var(--azul);color:var(--lienzo);padding:12px 15px;font-weight:800;font-size:13px;
  display:flex;justify-content:space-between;align-items:center;gap:10px;
}
.asis-h button{color:var(--lienzo);width:24px;height:24px;display:grid;place-items:center}
.asis-h svg{width:14px;height:14px}
.asis-b{padding:13px 14px;max-height:min(58vh,410px);overflow-y:auto}
.asis-q{
  border:1px solid var(--linea);background:var(--lienzo-2);border-radius:var(--r-2);
  padding:9px 12px;font-size:12.5px;font-weight:600;color:var(--azul-cl);width:100%;
  text-align:left;margin-bottom:7px;display:flex;justify-content:space-between;gap:10px;align-items:center;
}
.asis-q:hover{border-color:var(--azul-cl)}
.asis-q::after{content:"+";font-family:var(--f-num);font-weight:800;color:var(--tinta-3)}
.asis-q[aria-expanded="true"]::after{content:"–"}
.asis-a{
  background:var(--fondo-2);border-radius:var(--r-2);padding:11px 13px;font-size:12.5px;
  color:var(--tinta-2);margin:-2px 0 9px;
}
.asis-a[hidden]{display:none}
.asis-n{font-family:var(--f-num);font-size:9.5px;color:var(--tinta-3);padding-top:4px;letter-spacing:.02em}

/* ---------- 20. Aviso flotante (toast) ---------- */
.toast{
  position:fixed;left:50%;bottom:22px;transform:translate(-50%,140%);z-index:120;
  background:var(--tinta);color:var(--fondo);border-radius:var(--r-2);padding:12px 18px;
  font-size:13px;font-weight:600;box-shadow:var(--sombra-3);max-width:min(92vw,440px);
  transition:transform .26s cubic-bezier(.2,.8,.3,1);
}
.toast.on{transform:translate(-50%,0)}

/* ---------- 21. Pie ---------- */
footer{
  background:var(--azul-9);color:#A6C0D6;padding:30px 0;margin-top:34px;font-size:12.5px;
}
footer b{color:#fff}
footer .f-rej{display:grid;grid-template-columns:repeat(auto-fit,minmax(238px,1fr));gap:22px}
footer .lbl{color:var(--amarillo);margin-bottom:8px;display:block}
footer ul{list-style:none;display:grid;gap:5px}
footer li{font-size:12px;line-height:1.5}
footer .f-nota{
  margin-top:22px;padding-top:16px;border-top:1px solid rgba(255,255,255,.11);
  font-family:var(--f-num);font-size:10.5px;line-height:1.65;color:#8FAAC2;letter-spacing:.015em;
}

/* ---------- 22. Cajón de filtros en móvil ---------- */
.cajon-velo{position:fixed;inset:0;background:rgba(8,20,32,.55);z-index:80;display:none}
.cajon-velo.on{display:block}

/* ---------- 23. Adaptativo ---------- */
@media (max-width:1080px){
  .tesis-in{grid-template-columns:1fr}
  .vv-lay{grid-template-columns:1fr}
  .chk{position:static}
  .inv-lay{grid-template-columns:1fr}
}
/* Umbral alto a propósito: con seis enlaces sin partir, por debajo
   de ~1120px el último ("◆ Collection") se recortaba. */
@media (max-width:1120px){
  nav.top{
    display:none;position:absolute;top:64px;left:0;right:0;
    background:var(--lienzo);border-bottom:1px solid var(--linea);
    padding:10px 16px 14px;flex-direction:column;gap:2px;z-index:59;
    box-shadow:var(--sombra-2);
  }
  nav.top.on{display:flex}
  nav.top a{padding:11px 12px}
  .burger{display:grid}
}
@media (max-width:920px){
  .res-lay{grid-template-columns:1fr}
  .btn-filtros{display:inline-flex}
  .rail{
    position:fixed;inset:0 auto 0 0;width:min(310px,88vw);z-index:81;background:var(--fondo);
    padding:16px;overflow-y:auto;transform:translateX(-102%);transition:transform .24s;
    border-right:1px solid var(--linea);gap:14px;
  }
  .rail.on{transform:none}
  .rail-cerrar{display:flex!important;justify-content:space-between;align-items:center}
}
@media (min-width:921px){ .rail-cerrar{display:none!important} }
/* Cabecera compacta: con el selector de idioma a ancho completo la
   fila medía 464 px y desbordaba una pantalla de 375. */
@media (max-width:760px){
  .selidi{width:58px;padding:8px 4px;text-align:center}
}
/* Contenedor de las acciones dentro del menú móvil */
.nav-acciones{display:none}
@media (max-width:1120px){
  .nav-acciones{display:flex;gap:8px;padding-top:10px;margin-top:6px;
    border-top:1px solid var(--linea)}
}

@media (max-width:620px){
  body{font-size:14.5px}
  /* WCAG 2.5.5: 44x44 px mínimo. En la cabecera solo quedan idioma y
     menú, así que caben sin desbordar. */
  .icbtn,.burger{width:44px;height:44px}
  .nav-acciones .icbtn{width:44px;height:44px}
  .selidi{height:44px}
  nav.top a{padding:13px 12px}
  .ops button{padding:11px 14px}
  .sug button{padding:10px 14px}
  .btn-s{padding:11px 14px}
  .tog{padding:12px 11px}
  .cmp{padding:10px 13px;min-height:44px}
  /* Campos y botones secundarios al mínimo táctil */
  select.ctl,input.ctl{min-height:44px}
  .btn-s{min-height:44px}
  .opt{min-height:52px}
  .h-gal-nav{width:44px;height:44px}
  .h-cerrar{width:44px;height:44px}
  .fav{width:44px;height:44px}
  .verif-u button{min-height:44px;padding:6px 14px}
  .selidi{width:56px;font-size:12px;height:44px}
  .icbtn svg{width:18px;height:18px}
  /* Al envolverse la fila de búsqueda, el micrófono y el botón se
     quedaban en 22 px de alto: sin altura propia colapsaban. */
  .b-row{gap:8px;row-gap:8px}
  .b-mic{height:48px}
  .b-go{height:48px;line-height:48px;padding:0 22px}
  .ops button{padding:12px 15px;font-size:13px}
  .sug button{min-height:44px}
  .asis-q{min-height:44px}
  .limpiar{display:inline-flex;align-items:center;min-height:44px}
  .wrap{padding:0 16px}
  .hrow{gap:8px}
  .hacts{gap:4px}
  .marca-w{font-size:17px}
  /* El lema es decorativo y su longitud varía mucho por idioma
     ("HET PORTAAL VAN DE ACHT EILANDEN" desbordaba la fila). El
     logotipo identifica la marca por sí solo. */
  .marca-s{display:none}
  .hero{padding-top:30px}
  .hero h1{font-size:25px}
  .b-row{flex-wrap:wrap}
  .b-row .campo{flex-basis:100%;order:1}
  .b-mic{order:2}
  .b-go{order:3;flex:1}
  .ops{gap:3px}
  .h-body{padding:18px 17px 22px}
  .h-price{font-size:24px}
  .esc-r{grid-template-columns:104px 1fr 52px;gap:8px;font-size:12px}
  .coll{padding:22px 18px;border-radius:var(--r-3)}
  .velo{padding:0}
  .hoja{border-radius:0;min-height:100%}
  .h-cta{position:sticky;bottom:0;background:var(--lienzo);padding:12px 0 4px;
    border-top:1px solid var(--linea);margin-left:-17px;margin-right:-17px;
    padding-left:17px;padding-right:17px}
  .h-cta .btn{flex:1;justify-content:center}
  .fab{right:12px;bottom:12px;padding:11px 15px;font-size:12.5px}
  section{padding:28px 0}
}

/* ---------- 24. Impresión — la hoja como documento ---------- */
@media print{
  header,.hero,.fab,.asis,.aviso,footer,.rail,.res-acts,.fav,.cmp{display:none!important}
  body{background:#fff}
  .velo{position:static;display:block;padding:0;background:none}
  .hoja{box-shadow:none;max-width:100%}
}

/* ---------- 25. MARCA ---------- */
/* flex-direction explícito: la regla antigua de la marca era en
   columna y, al no redeclararla, el logo quedaba encima del nombre. */
.marca{display:flex;flex-direction:row;align-items:center;gap:10px;
  text-decoration:none;flex:none}
.marca-logo{display:block;color:var(--azul);flex:none}
.marca-logo .logo-svg{width:46px;height:auto}
.marca-txt{display:flex;flex-direction:column;justify-content:center;min-width:0}
/* El wordmark lleva el tracking abierto de una marca, no de un titular */
.marca-w{
  font-weight:800;font-size:19px;color:var(--azul);letter-spacing:.13em;
  white-space:nowrap;line-height:1.05;
}
.marca:hover .marca-w{color:var(--azul-2)}
.marca:hover .marca-logo{color:var(--amarillo-9)}

/* ---------- 26. GUÍAS DE LAS OCTAVA ---------- */
.guias{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px}
.guia{
  background:var(--lienzo);border:1px solid var(--linea);border-radius:var(--r-3);
  box-shadow:var(--sombra-1);overflow:hidden;display:flex;flex-direction:column;
}
.guia-h{
  display:flex;align-items:center;gap:12px;padding:14px 16px;
  border-bottom:1px solid var(--linea);background:var(--lienzo-2);
}
/* Silueta de la isla dentro de su propia ficha: el dato como adorno */
.guia-sil{width:44px;height:30px;flex:none;color:var(--azul-cl)}
.guia-t{min-width:0;flex:1}
.guia-t b{display:block;font-size:15.5px;color:var(--azul);letter-spacing:-.015em}
.guia-t span{font-family:var(--f-num);font-size:10px;color:var(--tinta-3);
  letter-spacing:.08em;text-transform:uppercase}
.guia-b{padding:14px 16px;display:flex;flex-direction:column;gap:11px;flex:1}
.guia-p{font-size:13px;color:var(--tinta-2);line-height:1.55}
.guia-perfil{
  font-size:12.5px;color:var(--sobre-amarillo);background:var(--amarillo-2);
  border-left:3px solid var(--amarillo);border-radius:0 var(--r-1) var(--r-1) 0;
  padding:9px 12px;
}
.guia-perfil b{font-family:var(--f-num);font-size:9.5px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--oro-fijo);display:block;margin-bottom:3px}
.guia-d{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--linea);
  border:1px solid var(--linea);border-radius:var(--r-2);overflow:hidden}
.guia-d div{background:var(--lienzo);padding:8px 10px}
.guia-d dt{font-family:var(--f-num);font-size:9px;letter-spacing:.09em;
  text-transform:uppercase;color:var(--tinta-3);margin-bottom:2px}
.guia-d dd{font-size:12.5px;font-weight:600;color:var(--tinta)}
.guia-d dd.num{font-family:var(--f-num);font-variant-numeric:tabular-nums}
.guia-sellos{display:flex;flex-wrap:wrap;gap:5px}
.gs{
  font-family:var(--f-num);font-size:9.5px;font-weight:700;letter-spacing:.05em;
  text-transform:uppercase;border-radius:5px;padding:3px 8px;border:1px solid transparent;
}
.gs.pn{background:var(--ok-bg);color:var(--ok);border-color:var(--ok-bd)}
.gs.un{background:var(--amarillo-2);color:var(--oro-fijo);border-color:var(--amarillo)}
.gs.st{background:var(--fondo-2);color:var(--azul);border-color:var(--linea-2)}
.guia-pie{padding:0 16px 14px}
.guia-pie .btn-s{width:100%;justify-content:center}

/* ---------- 27. ENTORNO DEL INMUEBLE ---------- */
.ent{display:grid;gap:1px;background:var(--linea);border:1px solid var(--linea);
  border-radius:var(--r-2);overflow:hidden}
.ent-r{background:var(--lienzo-2);padding:10px 13px;display:flex;gap:11px;align-items:flex-start}
.ent-r svg{width:15px;height:15px;flex:none;color:var(--azul-cl);margin-top:2px}
.ent-r div{min-width:0}
.ent-r dt{font-family:var(--f-num);font-size:9.5px;letter-spacing:.09em;
  text-transform:uppercase;color:var(--tinta-3)}
.ent-r dd{font-size:13px;color:var(--tinta);margin-top:1px}

@media (max-width:620px){
  .marca-logo .logo-svg{width:38px}
  .marca-w{letter-spacing:.1em}
  .guia-d{grid-template-columns:1fr}
}


/* ---------- 28. AGENCIA ---------- */
.ag{border:1px solid var(--linea);border-radius:var(--r-3);background:var(--lienzo-2);padding:15px}
.ag-top{display:flex;gap:13px;align-items:center}
.ag-logo{display:grid;place-items:center;border-radius:var(--r-2);font-weight:800;
  font-family:var(--f-num);letter-spacing:.02em;flex:none}
.ag-id{min-width:0}
.ag-id b{display:block;font-size:15px;color:var(--azul)}
.ag-meta{display:block;font-size:12px;color:var(--tinta-2);margin-top:1px}
.ag-ver{display:inline-flex;align-items:center;gap:5px;font-family:var(--f-num);
  font-size:9.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--ok);margin-top:4px}
.ag-datos{display:grid;grid-template-columns:repeat(auto-fit,minmax(132px,1fr));gap:1px;
  background:var(--linea);border:1px solid var(--linea);border-radius:var(--r-2);
  overflow:hidden;margin-top:13px}
.ag-datos div{background:var(--lienzo);padding:9px 11px}
.ag-datos dt{font-family:var(--f-num);font-size:9px;letter-spacing:.09em;
  text-transform:uppercase;color:var(--tinta-3)}
.ag-datos dd{font-size:12.5px;font-weight:600;color:var(--tinta);margin-top:2px}
.ag-cta{display:flex;gap:9px;margin-top:13px;flex-wrap:wrap}
.ag-cta .btn{text-decoration:none}
.tar-ag{display:flex;align-items:center;gap:7px;margin-top:9px;font-size:11.5px;
  color:var(--tinta-2);position:relative;z-index:2}
.tar-ag .ag-logo{width:20px;height:20px;font-size:8px;border-radius:5px}

/* ---------- 29. VÍDEO ---------- */
.vid{position:relative;border-radius:var(--r-2);overflow:hidden;background:var(--fondo-2)}
.vid-esc{aspect-ratio:16/9}
.vid-esc svg{width:100%;height:100%}
.vid-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:62px;height:62px;border-radius:99px;background:rgba(255,255,255,.94);
  color:var(--tinta-fija);display:grid;place-items:center;box-shadow:var(--sombra-2)}
.vid-play svg{width:26px;height:26px}
.vid-barra{position:absolute;left:0;right:0;bottom:0;height:4px;background:rgba(9,26,41,.35)}
.vid-barra i{display:block;height:100%;width:0;background:var(--amarillo);transition:width .3s linear}
.vid-dur{position:absolute;right:9px;bottom:11px;background:rgba(9,26,41,.72);color:#fff;
  font-size:10.5px;border-radius:5px;padding:2px 7px}

/* ---------- 30. TOUR 3D ---------- */
.tour{border:1px solid var(--linea);border-radius:var(--r-2);overflow:hidden}
.tour-vista{aspect-ratio:16/9;background:var(--fondo-2)}
.tour-vista svg{width:100%;height:100%}
.tour-nav{display:flex;gap:5px;padding:9px;overflow-x:auto;background:var(--lienzo-2);
  border-top:1px solid var(--linea);border-bottom:1px solid var(--linea)}
.tour-b{flex:none;border:1px solid var(--linea-2);border-radius:99px;padding:7px 13px;
  font-size:12px;font-weight:600;color:var(--tinta-2);background:var(--lienzo);white-space:nowrap}
.tour-b[aria-selected="true"]{background:var(--azul);color:var(--sobre-azul);border-color:var(--azul)}
.tour-plano{padding:10px;background:var(--lienzo-2)}
.tour-plano .sala,.tour-plano .sala-2{transition:opacity .18s}

/* ---------- 31. MAPA DEL ENTORNO ---------- */
.mapa-wrap{border:1px solid var(--linea);border-radius:var(--r-2);overflow:hidden}
.mapa{width:100%;height:auto;display:block}
.mapa-ley{list-style:none;display:grid;gap:6px;margin-top:10px}
.mapa-ley li{display:flex;align-items:center;gap:9px;font-size:12.5px;color:var(--tinta-2)}
.mp{width:12px;height:12px;border-radius:99px;flex:none;border:1.6px solid var(--azul-cl);
  background:var(--lienzo)}
.mp.casa{background:var(--amarillo);border-color:var(--azul-9);width:14px;height:14px}

/* ---------- 32. SELLOS DE SEGMENTO ---------- */
.sello.dest{background:var(--azul);color:var(--sobre-azul)}
.sello.lujo{background:var(--amarillo);color:var(--sobre-amarillo)}
.sello.vvc2{background:var(--crit-bg);color:var(--crit);border-color:var(--crit-bd)}
.q.media{color:var(--azul-cl);background:var(--azul-bg);border-color:var(--azul-bd)}


/* ---------- 33. AGENTE Y VÍDEO VERTICAL ---------- */
.agt{border:1px solid var(--linea);border-radius:var(--r-3);background:var(--lienzo-2);padding:15px}
.agt-top{display:flex;gap:13px;align-items:center}
.ret{display:grid;place-items:center;border-radius:99px;font-weight:800;
  font-family:var(--f-num);flex:none;letter-spacing:.01em}
.agt-id{min-width:0}
.agt-id b{display:block;font-size:15.5px;color:var(--azul)}
.agt-rol{display:block;font-size:12.5px;color:var(--tinta-2);margin-top:1px}
.agt-anos{display:block;font-family:var(--f-num);font-size:10px;color:var(--tinta-3);
  letter-spacing:.05em;margin-top:3px}
.agt-idi{margin-top:13px}
.idi-l{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.idi-b{display:inline-flex;flex-direction:column;border:1px solid var(--linea-2);
  border-radius:var(--r-1);padding:4px 9px;background:var(--lienzo);line-height:1.25}
.idi-b b{font-size:12px;font-weight:700;color:var(--tinta)}
.idi-b i{font-style:normal;font-family:var(--f-num);font-size:8.5px;letter-spacing:.06em;
  text-transform:uppercase;color:var(--tinta-3)}
.idi-b.n3{border-color:var(--ok-bd);background:var(--ok-bg)}
.idi-b.n3 b{color:var(--ok)} .idi-b.n3 i{color:var(--ok)}
.idi-b.n2{border-color:var(--azul-bd);background:var(--azul-bg)}
.idi-b.n2 b{color:var(--azul-cl)} .idi-b.n2 i{color:var(--azul-cl)}
.idi-l.chico .idi-b{padding:2px 7px}
.idi-l.chico .idi-b b{font-size:10.5px}
.idi-l.chico .idi-b i{font-size:7.5px}
.agt-vid{margin-top:14px}
.agt-cta{display:flex;gap:9px;margin-top:13px;flex-wrap:wrap}
.agt-cta .btn{text-decoration:none}

/* Reproductor vertical 9:16, formato de redes */
.vs{position:relative;aspect-ratio:9/16;max-width:250px;margin-top:7px;
  border-radius:var(--r-3);overflow:hidden;background:var(--fondo-2);
  border:1px solid var(--linea)}
.vs-esc{position:absolute;inset:0}
.vs-esc svg{width:100%;height:100%;object-fit:cover}
.vs-grad{position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(to top,rgba(6,26,48,.62),rgba(6,26,48,0) 42%)}
.vs-tag{position:absolute;top:9px;left:9px;background:rgba(6,26,48,.72);color:#fff;
  font-family:var(--f-num);font-size:9px;letter-spacing:.07em;text-transform:uppercase;
  border-radius:5px;padding:3px 7px}
.vs-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:52px;height:52px;border-radius:99px;background:rgba(255,255,255,.94);
  color:var(--tinta-fija);display:grid;place-items:center;box-shadow:var(--sombra-2)}
.vs-play svg{width:22px;height:22px}
.vs-dur{position:absolute;left:9px;bottom:13px;color:#fff;font-size:10.5px}
.vs-barra{position:absolute;left:0;right:0;bottom:0;height:3px;background:rgba(255,255,255,.25)}
.vs-barra i{display:block;height:100%;width:0;background:var(--amarillo);transition:width .3s linear}

/* Vídeo social junto a su explicación */
.soc{display:grid;grid-template-columns:250px 1fr;gap:16px;align-items:start}
.soc-p{font-size:13px;color:var(--tinta-2);line-height:1.55}
.soc-ag{display:flex;align-items:center;gap:10px;margin-top:12px}
.soc-ag b{display:block;font-size:13.5px;color:var(--azul)}
.soc-ag i{font-style:normal;font-family:var(--f-num);font-size:9.5px;
  letter-spacing:.05em;color:var(--tinta-3)}
.soc-info .idi-l{margin-top:11px}

/* Equipo dentro de la ficha de agencia */
.ag-eq{margin-top:14px;padding-top:13px;border-top:1px dashed var(--linea)}
.equipo{display:grid;gap:8px;margin-top:8px}
.eq-p{display:flex;align-items:center;gap:11px;background:var(--lienzo);
  border:1px solid var(--linea);border-radius:var(--r-2);padding:9px 11px}
.eq-id{min-width:0;flex:1}
.eq-id b{display:block;font-size:13px;color:var(--tinta)}
.eq-id > span{font-size:11.5px;color:var(--tinta-3)}
.eq-vid{width:26px;height:26px;border-radius:99px;background:var(--azul-bg);
  color:var(--azul-cl);display:grid;place-items:center;flex:none}
.eq-vid svg{width:12px;height:12px}

/* Agente en la tarjeta de resultados */
.tar-ag span{display:flex;flex-direction:column;line-height:1.25;min-width:0}
.tar-ag span i{font-style:normal;font-family:var(--f-num);font-size:9px;
  letter-spacing:.06em;color:var(--tinta-3)}
.tar-ag .ret{width:22px;height:22px;font-size:8.5px}
.tar-soc{margin-left:auto;display:inline-flex;align-items:center;gap:4px;font-style:normal;
  font-family:var(--f-num);font-size:9px;letter-spacing:.05em;text-transform:uppercase;
  color:var(--azul-cl);background:var(--azul-bg);border:1px solid var(--azul-bd);
  border-radius:5px;padding:2px 6px}
.tar-soc svg{width:9px;height:9px}
.q.soc{color:var(--oro);background:var(--amarillo-2);border-color:var(--amarillo)}

@media (max-width:620px){
  .soc{grid-template-columns:1fr}
  .vs{max-width:100%;margin-inline:auto}
}


/* ---------- 34. ÁREA PROFESIONAL ---------- */
.roles-nav{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:10px}
.rol-b{border:1px solid var(--linea-2);border-radius:var(--r-3);background:var(--lienzo);
  padding:14px 16px;text-align:left}
.rol-b b{display:block;font-size:15px;color:var(--azul)}
.rol-b span{display:block;font-size:12.5px;color:var(--tinta-2);margin-top:3px}
.rol-b[aria-selected="true"]{border-color:var(--azul);background:var(--azul-bg);
  box-shadow:inset 0 0 0 1px var(--azul)}
.permisos{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:16px}
.perm-col{border:1px solid var(--linea);border-radius:var(--r-3);padding:14px 16px;
  background:var(--lienzo)}
.perm-col.si{border-left:3px solid var(--ok)}
.perm-col.no{border-left:3px solid var(--crit)}
.perm-col ul{list-style:none;display:grid;gap:7px;margin-top:9px}
.perm-col li{display:flex;gap:9px;align-items:flex-start;font-size:13px;line-height:1.45}
.perm-col li svg{width:14px;height:14px;flex:none;margin-top:3px}
.perm-col.si li svg{color:var(--ok)}
.perm-col.no li{color:var(--tinta-2)}
.perm-col.no li svg{color:var(--crit)}
.flujo{margin-top:18px;border:1px solid var(--linea);border-radius:var(--r-3);
  background:var(--lienzo);padding:16px 18px}
.flujo h4{font-size:14.5px;color:var(--azul);margin-bottom:12px}
.fpasos{list-style:none;display:grid;gap:13px}
.fp{display:flex;gap:13px;align-items:flex-start}
.fp-n{width:26px;height:26px;border-radius:99px;background:var(--azul);color:var(--sobre-azul);
  display:grid;place-items:center;font-size:12px;font-weight:700;flex:none}
.fp b{display:block;font-size:13.5px;color:var(--tinta)}
.fp p{font-size:12.5px;color:var(--tinta-2);margin-top:3px}
.consent{margin-top:9px;border:1px solid var(--amarillo);border-radius:var(--r-2);
  background:var(--amarillo-2);padding:13px 15px}
.consent-t{font-weight:700;font-size:13px;color:var(--sobre-amarillo);margin-bottom:9px}
.consent-d{display:grid;gap:1px;background:rgba(6,48,92,.16);border-radius:var(--r-1);
  overflow:hidden;margin-bottom:11px}
.consent-d div{background:var(--lienzo);padding:8px 11px;display:grid;
  grid-template-columns:120px 1fr;gap:11px}
.consent-d dt{font-family:var(--f-num);font-size:9px;letter-spacing:.08em;
  text-transform:uppercase;color:var(--tinta-3)}
.consent-d dd{font-size:12.5px;color:var(--tinta)}
.consent-c{background:var(--lienzo);margin-bottom:7px}
.cn-sello{display:flex;gap:8px;align-items:flex-start;margin-top:9px;
  font-family:var(--f-num);font-size:9.5px;line-height:1.5;letter-spacing:.02em}
.cn-sello svg{width:13px;height:13px;flex:none;margin-top:1px}
.cn-sello.si{color:var(--ok)} .cn-sello.no{color:var(--crit)}
.baja{margin-top:18px;border:1px solid var(--linea);border-left:3px solid var(--azul);
  border-radius:var(--r-2);background:var(--lienzo-2);padding:14px 16px}
.baja b{display:block;color:var(--azul);font-size:14px;margin-bottom:4px}
.baja p{font-size:13px;color:var(--tinta-2)}
@media (max-width:760px){
  .permisos{grid-template-columns:1fr}
  .consent-d div{grid-template-columns:1fr;gap:2px}
}

/* ---------- 24. Valorador ---------- */
#valorador{background:var(--fondo)}
.val-lay{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:18px;align-items:start}
.val-card{min-width:0;background:var(--lienzo);border:1px solid var(--linea);border-radius:var(--r-3);padding:20px}
.val-res{border-top:3px solid var(--amarillo)}
.v-lbl{font-family:var(--f-num);font-size:10px;font-weight:600;letter-spacing:.09em;
  text-transform:uppercase;color:var(--tinta-3);margin:16px 0 9px}
.v-extras{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px}
.v-cifra{border:1px solid var(--linea);border-radius:var(--r-2);padding:13px 15px;margin-bottom:10px;
  background:var(--lienzo-2)}
.v-cifra .lbl{display:block;font-family:var(--f-num);font-size:9.5px;font-weight:600;
  letter-spacing:.09em;text-transform:uppercase;color:var(--tinta-3);margin-bottom:5px}
.v-cifra b{display:block;font-family:var(--f-num);font-variant-numeric:tabular-nums;
  font-size:22px;font-weight:800;color:var(--azul);line-height:1.15}
.v-cifra.v-cierre b{color:var(--oro)}
.v-m2{display:block;font-family:var(--f-num);font-size:11px;color:var(--tinta-3);margin-top:4px}
.v-conf{display:flex;align-items:center;gap:7px;flex-wrap:wrap;font-size:12.5px;
  color:var(--tinta-2);margin:10px 0 2px}
.v-conf b{color:var(--tinta)}
.v-p{width:9px;height:9px;border-radius:99px;flex:none}
.v-p.v-alta{background:var(--ok)} .v-p.v-media{background:var(--warn)} .v-p.v-baja{background:var(--crit)}
.v-h{font-family:var(--f-num);font-size:10px;font-weight:600;letter-spacing:.09em;
  text-transform:uppercase;color:var(--tinta-3);margin:18px 0 9px}
.v-d.mas{color:var(--ok)} .v-d.menos{color:var(--crit)}
.v-mun{display:block;font-family:var(--f-num);font-size:10.5px;color:var(--tinta-3)}
#val-out table.datos{min-width:340px}
#val-out table.datos td.n{white-space:nowrap}
#val-out table.datos a{color:var(--azul);font-weight:600}
#val-out table.datos a:hover{text-decoration:underline}
.v-legal{font-family:var(--f-num);font-size:9.5px;line-height:1.6;color:var(--tinta-3);
  margin-top:11px;border-top:1px solid var(--linea);padding-top:10px}
.val-prof{display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap;
  margin-top:18px;background:var(--azul-9);border-radius:var(--r-3);padding:20px 24px}
.val-prof .lbl{display:block;font-family:var(--f-num);font-size:9.5px;font-weight:600;
  letter-spacing:.11em;text-transform:uppercase;color:var(--amarillo);margin-bottom:6px}
.val-prof p{color:#DCE7F2;font-size:14px;max-width:46em}
.val-prof-b{display:flex;gap:9px;flex-wrap:wrap}
@media (min-width:901px){
  /* El formulario acompaña al resultado: en escritorio la columna
     izquierda es mucho más corta que la derecha y quedaba un hueco. */
  .val-form-col{position:sticky;top:80px}
}
@media (max-width:900px){
  .val-lay{grid-template-columns:minmax(0,1fr)}
}

/* ---------- 25. Notificación de contenido ilícito (DSA art. 16) ---------- */
.dsa textarea.ctl{resize:vertical;min-height:88px;font-family:inherit;line-height:1.55;padding:10px 12px}
.dsa-cnt{font-family:var(--f-num);font-size:10px;color:var(--tinta-3);align-self:flex-end;margin-top:3px}
.dsa-cnt.ok{color:var(--ok)}
.dsa-obj{border:1px solid var(--linea);border-left:3px solid var(--azul);border-radius:var(--r-2);
  background:var(--lienzo-2);padding:11px 14px;margin-bottom:15px}
.dsa-obj .lbl{display:block;font-family:var(--f-num);font-size:9.5px;font-weight:600;
  letter-spacing:.09em;text-transform:uppercase;color:var(--tinta-3);margin-bottom:4px}
.dsa-obj b{display:block;font-size:14px;color:var(--tinta);margin-bottom:4px}
.dsa-obj code{display:block;font-family:var(--f-num);font-size:10.5px;color:var(--tinta-3);
  word-break:break-all;line-height:1.5}
.dsa-exc{font-family:var(--f-num);font-size:9.5px;line-height:1.6;color:var(--tinta-3);margin:2px 0 10px}
.dsa-acts{display:flex;gap:9px;flex-wrap:wrap;margin-top:15px}
.dsa-mal{border:1px solid var(--crit);border-radius:var(--r-2);background:var(--lienzo-2);
  padding:13px 15px;margin-top:14px}
.dsa-mal b{display:block;color:var(--crit);font-size:13.5px;margin-bottom:7px}
.dsa-mal ul{margin:0;padding-left:19px}
.dsa-mal li{font-size:13px;color:var(--tinta-2);margin-bottom:4px}
.dsa-ok{border:1px solid var(--ok);border-radius:var(--r-2);background:var(--lienzo-2);
  padding:15px 17px;margin-top:14px}
.dsa-ok b{display:block;color:var(--ok);font-size:14px;margin-bottom:8px}
.dsa-ok p{font-size:13px;color:var(--tinta-2);margin:0 0 8px}
.dsa-loc{font-family:var(--f-num) !important;font-size:19px !important;font-weight:700;
  letter-spacing:.06em;color:var(--azul) !important;user-select:all}
.dsa-det{margin-top:16px;border-top:1px solid var(--linea);padding-top:12px}
.dsa-det summary{font-family:var(--f-num);font-size:10.5px;letter-spacing:.06em;
  color:var(--azul);cursor:pointer;font-weight:600}
.dsa-det summary:focus-visible{outline:2.5px solid var(--foco);outline-offset:3px;border-radius:3px}
.dsa-ol{margin:12px 0 0;padding-left:20px}
.dsa-ol li{font-size:13px;color:var(--tinta-2);margin-bottom:7px;line-height:1.55}

ul.f-legal li{margin-bottom:5px}
/* El pie es azul profundo en los DOS temas, así que su tinta no puede
   salir de las variables del tema: --tinta-2 en claro es un gris
   azulado oscuro y sobre este fondo daba 1,80:1, ilegible. Lo tapaba
   el hecho de que el navegador de pruebas arranca en oscuro, donde
   esa misma variable es clara. Tinta fija, como el resto del pie. */
ul.f-legal a,.f-enlace{color:#AFC3D4;font-size:13px;text-decoration:none;
  border-bottom:1px solid transparent}
ul.f-legal a:hover,.f-enlace:hover{color:#fff;border-bottom-color:currentColor}
.f-enlace{background:none;border:0;padding:0;font:inherit;font-size:13px;cursor:pointer;
  text-align:left;font-family:inherit}
.f-enlace:focus-visible,ul.f-legal a:focus-visible{outline:2.5px solid var(--amarillo);
  outline-offset:3px;border-radius:3px}

/* ---------- 26. Acceso y doble verificación ---------- */
#acceso{background:var(--fondo)}
table.ac-t{min-width:640px}
table.ac-t td{vertical-align:top}
td.ac-des{color:var(--tinta-2);font-size:13px;line-height:1.55;max-width:38em}
td.ac-obl{font-family:var(--f-num);font-size:11.5px;color:var(--tinta-2);white-space:nowrap}
.ac-demo{display:block;font-family:var(--f-num);font-size:9.5px;letter-spacing:.06em;
  color:var(--ok);margin-top:4px}
.ac-niv{display:inline-block;font-family:var(--f-num);font-size:10px;font-weight:600;
  letter-spacing:.05em;padding:3px 8px;border-radius:99px;white-space:nowrap;border:1px solid}
.ac-alto{color:var(--ok);border-color:var(--ok);background:var(--ok-bg,transparent)}
.ac-medio{color:var(--oro);border-color:var(--oro)}
.ac-bajo{color:var(--crit);border-color:var(--crit)}

.ac-lab{margin-top:26px;border:1px solid var(--linea);border-radius:var(--r-3);
  background:var(--lienzo);overflow:hidden}
.ac-cab{background:var(--azul-9);color:#EAF2FA;padding:20px 24px}
.ac-cab h3{font-size:19px;margin:0 0 6px;color:#fff}
.ac-cab p{color:#BDD3E8;font-size:14px;margin:0;max-width:64em}
.ac-cols{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:1px;
  background:var(--linea)}
.ac-col{background:var(--lienzo);padding:22px 24px;min-width:0}
.ac-col h4{font-family:var(--f-num);font-size:10px;letter-spacing:.11em;text-transform:uppercase;
  color:var(--tinta-3);margin:0 0 10px;font-weight:600}
.ac-col > div + div h4{margin-top:26px;padding-top:22px;border-top:1px solid var(--linea)}
.ac-p{font-size:13.5px;color:var(--tinta-2);margin:0 0 12px;line-height:1.6}
.ac-apps{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}
.ac-apps span{font-family:var(--f-num);font-size:10.5px;color:var(--tinta-2);
  border:1px solid var(--linea-2);border-radius:99px;padding:4px 10px}
.ac-ol{margin:0 0 14px;padding-left:19px}
.ac-ol li{font-size:13px;color:var(--tinta-2);margin-bottom:5px;line-height:1.5}
.ac-qr{display:flex;justify-content:center;padding:14px;background:#FFFFFF;
  border:1px solid var(--linea);border-radius:var(--r-2)}
.ac-qr svg{width:190px;height:190px;display:block}
.ac-clave{margin:13px 0 4px}
.ac-clave .lbl{display:block;font-family:var(--f-num);font-size:9.5px;font-weight:600;
  letter-spacing:.09em;text-transform:uppercase;color:var(--tinta-3);margin-bottom:5px}
.ac-clave code{display:block;font-family:var(--f-num);font-size:13.5px;letter-spacing:.08em;
  color:var(--tinta);background:var(--lienzo-2);border:1px solid var(--linea);
  border-radius:var(--r-2);padding:9px 11px;margin-bottom:8px;word-break:break-all;user-select:all}
.ac-ver{display:flex;gap:11px;align-items:flex-end;flex-wrap:wrap;margin-top:15px}
.ac-ver .campo-g{margin-bottom:0;flex:1;min-width:130px}
input.ac-cod{font-family:var(--f-num);font-size:21px;letter-spacing:.28em;text-align:center}
.ac-tic{position:relative;width:44px;height:44px;flex:none}
.ac-tic svg{width:44px;height:44px;transform:rotate(-90deg)}
.ac-tic-b{fill:none;stroke:var(--linea);stroke-width:3}
.ac-tic-f{fill:none;stroke:var(--azul-cl);stroke-width:3;stroke-linecap:round;
  transition:stroke-dashoffset .5s linear}
.ac-tic b{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-family:var(--f-num);font-size:12px;color:var(--tinta-2)}
.ac-no{font-size:13px;color:var(--tinta-3);border:1px dashed var(--linea-2);
  border-radius:var(--r-2);padding:11px 13px;margin:0}
.ac-cods{list-style:none;margin:13px 0 0;padding:0;display:grid;
  grid-template-columns:repeat(auto-fit,minmax(122px,1fr));gap:7px}
.ac-cods li{font-family:var(--f-num);font-size:12.5px;letter-spacing:.06em;color:var(--tinta);
  background:var(--lienzo-2);border:1px solid var(--linea);border-radius:var(--r-2);
  padding:7px 9px;text-align:center;user-select:all}
.ac-pasos{margin-top:24px;border:1px solid var(--linea);border-left:4px solid var(--amarillo);
  border-radius:var(--r-3);background:var(--lienzo);padding:19px 22px}
.ac-pasos h4{font-family:var(--f-num);font-size:10px;letter-spacing:.11em;text-transform:uppercase;
  color:var(--tinta-3);margin:0 0 11px;font-weight:600}
.ac-pasos ul{margin:0;padding:0;list-style:none;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(255px,1fr));gap:8px 24px}
.ac-pasos li{position:relative;padding-left:20px;font-size:13.5px;color:var(--tinta-2)}
.ac-pasos li::before{content:"";position:absolute;left:3px;top:9px;width:6px;height:6px;
  border-radius:2px;background:var(--amarillo)}
@media (max-width:860px){
  .ac-cols{grid-template-columns:minmax(0,1fr)}
}
.prof-acc{margin-top:20px}
.prof-acc a{font-family:var(--f-num);font-size:12px;letter-spacing:.04em;color:var(--azul);
  border-bottom:1px solid transparent;text-decoration:none}
.prof-acc a:hover{border-bottom-color:currentColor}
.prof-acc a:focus-visible{outline:2.5px solid var(--foco);outline-offset:3px;border-radius:3px}

/* ---------- 27. Bloque prerrenderizado ----------
   Es lo que ve el rastreador y lo que ve el usuario durante el
   instante en que carga el JavaScript. Con la aplicación en pie se
   retira del DOM, así que solo tiene que estar presentable, no ser
   bonito. */
.pre{max-width:760px;margin:0 auto;padding:28px 24px 40px}
.pre-migas{font-family:var(--f-num);font-size:11px;letter-spacing:.05em;color:var(--tinta-3);
  margin-bottom:16px}
.pre-migas a{color:var(--azul);text-decoration:none}
.pre-h1{font-size:clamp(24px,4vw,34px);line-height:1.15;margin:0 0 8px;letter-spacing:-.02em}
.pre-precio{font-family:var(--f-num);font-size:20px;font-weight:700;color:var(--azul);margin:0 0 20px}
.pre-dl{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1px;
  background:var(--linea);border:1px solid var(--linea);border-radius:var(--r-3);
  overflow:hidden;margin:0 0 20px}
.pre-dl > div{background:var(--lienzo);padding:11px 14px}
.pre-dl dt{font-family:var(--f-num);font-size:9.5px;letter-spacing:.09em;text-transform:uppercase;
  color:var(--tinta-3);margin-bottom:3px}
.pre-dl dd{margin:0;font-size:14px;color:var(--tinta)}
.pre-ent{margin:0 0 20px;padding-left:20px}
.pre-ent li{font-size:13.5px;color:var(--tinta-2);margin-bottom:4px}
.pre-cta{margin:0 0 26px}
.pre-cta a{display:inline-block;background:var(--azul);color:var(--lienzo);text-decoration:none;
  border-radius:var(--r-2);padding:11px 19px;font-weight:700;font-size:13.5px}
.pre-otras h2{font-size:15px;margin:0 0 9px}
.pre-otras ul{margin:0;padding-left:20px}
.pre-otras li{font-size:13.5px;color:var(--tinta-2);margin-bottom:5px}
.pre-otras a{color:var(--azul)}
.pre-otras b{font-family:var(--f-num);color:var(--tinta)}

/* ---------- 28. Instalación ---------- */
.pwa{position:fixed;left:14px;right:14px;bottom:14px;z-index:80;
  transform:translateY(120%);opacity:0;transition:transform .28s ease,opacity .28s ease}
.pwa.on{transform:none;opacity:1}
@media (prefers-reduced-motion:reduce){.pwa{transition:none}}
.pwa-in{max-width:560px;margin:0 auto;display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  background:var(--lienzo);border:1px solid var(--linea);border-radius:var(--r-3);
  box-shadow:0 12px 34px rgba(6,48,92,.19);padding:14px 16px}
.pwa-ic{flex:none;width:38px;height:38px;display:block}
.pwa-ic svg{width:38px;height:38px;display:block}
.pwa-tx{flex:1;min-width:150px}
.pwa-tx b{display:block;font-size:14.5px;color:var(--tinta);margin-bottom:2px}
.pwa-tx span{display:block;font-size:12.5px;color:var(--tinta-2);line-height:1.45}
.pwa-bt{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
@media (max-width:520px){
  .pwa-bt{width:100%}
  .pwa-bt .btn{flex:1;justify-content:center}
}

/* ---------- 29. Sello de frescura del semáforo ---------- */
.vv-sello{display:flex;align-items:center;gap:11px;flex-wrap:wrap;margin:0 0 18px;
  border:1px solid var(--linea);border-left:3px solid var(--ok);border-radius:var(--r-2);
  background:var(--lienzo);padding:10px 14px}
.vvs-p{width:9px;height:9px;border-radius:99px;flex:none;background:var(--ok)}
.vvs-p.vieja{background:var(--warn)}
.vv-sello:has(.vvs-p.vieja){border-left-color:var(--warn)}
.vvs-t{font-size:13px;color:var(--tinta-2)}
.vvs-t b{color:var(--tinta);margin-right:7px}
.vvs-f{font-family:var(--f-num);font-size:10px;color:var(--tinta-3);margin-left:auto}
@media (max-width:640px){.vvs-f{margin-left:0;flex-basis:100%}}

/* ---------- 30. Reserva para Inversiones en Canarias ---------- */
.sello.ric{border-color:var(--ok);color:var(--ok);background:var(--lienzo)}
.sello.ric svg{width:11px;height:11px;margin-right:4px}
.sello.ric.ric-cond{border-color:var(--warn);color:var(--warn)}
.tog-ric{position:relative;padding-right:38px}
.tog-i{position:absolute;right:9px;top:50%;transform:translateY(-50%);
  width:21px;height:21px;border-radius:99px;border:1.5px solid var(--linea-2);
  background:var(--lienzo);color:var(--tinta-3);font-family:var(--f-num);
  font-size:11px;font-weight:700;line-height:1;cursor:pointer;padding:0;
  display:flex;align-items:center;justify-content:center}
.tog-i:hover{border-color:var(--azul-cl);color:var(--azul-cl)}
.tog-i:focus-visible{outline:2.5px solid var(--foco);outline-offset:2px}
.ric-cab{display:flex;justify-content:space-between;align-items:center;gap:12px;
  flex-wrap:wrap;margin-bottom:11px}
.ric-cab h4{margin:0}
.ric-s{display:inline-flex;align-items:center;gap:6px;font-family:var(--f-num);
  font-size:10.5px;font-weight:600;letter-spacing:.04em;padding:4px 10px;
  border-radius:99px;border:1px solid;white-space:nowrap}
.ric-s svg{width:12px;height:12px;flex:none}
.ric-apta{color:var(--ok);border-color:var(--ok)}
.ric-cond{color:var(--warn);border-color:var(--warn)}
.ric-no{color:var(--crit);border-color:var(--crit)}
ul.ric-l{list-style:none;margin:0 0 14px;padding:0;display:grid;gap:7px}
ul.ric-l li{display:flex;gap:9px;align-items:flex-start;font-size:13px;line-height:1.5}
ul.ric-l li svg{width:15px;height:15px;flex:none;margin-top:2px}
ul.ric-l li.si{color:var(--tinta-2)} ul.ric-l li.si svg{color:var(--ok)}
ul.ric-l li.no{color:var(--tinta)} ul.ric-l li.no svg{color:var(--warn)}
.ric-p .ric-lead{font-size:15px;color:var(--tinta-2);line-height:1.62;margin:0 0 20px}
.ric-p h4{font-family:var(--f-num);font-size:10px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--tinta-3);margin:24px 0 9px;font-weight:600}
ul.ric-ul{margin:0;padding-left:20px}
ul.ric-ul li{font-size:13.5px;color:var(--tinta-2);margin-bottom:6px;line-height:1.55}
ul.ric-ul.mal li::marker{color:var(--crit)}
ol.ric-ol{margin:0;padding-left:21px}
ol.ric-ol li{font-size:13.5px;color:var(--tinta-2);margin-bottom:8px;line-height:1.55}
.ric-cifras{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:1px;
  background:var(--linea);border:1px solid var(--linea);border-radius:var(--r-3);
  overflow:hidden;margin:18px 0 4px}
.ric-cifras > div{background:var(--lienzo-2);padding:13px 14px}
.ric-cifras b{display:block;font-family:var(--f-num);font-size:24px;font-weight:800;
  color:var(--azul);line-height:1.1;letter-spacing:-.02em}
.ric-cifras span{display:block;font-size:11.5px;color:var(--tinta-2);margin-top:5px;line-height:1.4}
.ric-nosabe{font-size:13.5px;color:var(--tinta-2);line-height:1.6;margin:0;
  border-left:3px solid var(--warn);padding-left:14px}

/* ---------- 31. Cuenta ---------- */
.cta-b{display:inline-flex;align-items:center;gap:8px;height:38px;padding:0 13px;
  border:1px solid var(--linea-2);border-radius:99px;background:var(--lienzo);
  color:var(--tinta-2);font-size:13px;font-weight:700;cursor:pointer;white-space:nowrap}
.cta-b:hover{border-color:var(--azul-cl);color:var(--azul-cl)}
.cta-b:focus-visible{outline:2.5px solid var(--foco);outline-offset:2px}
.cta-b svg{width:17px;height:17px;flex:none}
.cta-b.dentro{border-color:var(--azul-cl);background:var(--azul-bg);color:var(--azul)}
.cta-tx{display:flex;flex-direction:column;align-items:flex-start;line-height:1.15}
.cta-tx b{font-size:12.5px}
.cta-tx span{font-family:var(--f-num);font-size:9px;letter-spacing:.06em;color:var(--tinta-3)}
.cta-b.dentro .cta-tx span{color:var(--azul-cl)}
.cta-av{width:26px;height:26px;border-radius:99px;background:var(--azul);color:var(--lienzo);
  display:flex;align-items:center;justify-content:center;flex:none;
  font-family:var(--f-num);font-size:10.5px;font-weight:700;letter-spacing:.02em}
.cta-av.grande{width:46px;height:46px;font-size:16px}
@media (max-width:900px){ .cta-b .cta-tx{display:none} .cta-b{padding:0 10px} }

.cta-tabs{display:flex;gap:6px;border-bottom:1px solid var(--linea);margin-bottom:18px}
.cta-tabs button{background:none;border:0;padding:9px 14px;font-size:14px;font-weight:700;
  color:var(--tinta-3);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px}
.cta-tabs button[aria-selected="true"]{color:var(--azul);border-bottom-color:var(--azul)}
.cta-tabs button:focus-visible{outline:2.5px solid var(--foco);outline-offset:-2px}
.cta-p{font-size:14px;color:var(--tinta-2);line-height:1.6;margin:0 0 16px}
.cta-roles{border:0;padding:0;margin:0 0 18px;display:grid;gap:8px}
.cta-roles legend{font-family:var(--f-num);font-size:9.5px;letter-spacing:.11em;
  text-transform:uppercase;color:var(--tinta-3);padding:0;margin-bottom:8px}
.cta-rol{display:block;cursor:pointer}
.cta-rol input{position:absolute;opacity:0;width:0;height:0}
.cta-rol-in{display:block;border:1px solid var(--linea);border-radius:var(--r-2);
  padding:12px 14px;background:var(--lienzo)}
.cta-rol-in b{display:block;font-size:14.5px;color:var(--tinta);margin-bottom:3px}
.cta-rol-in span{display:block;font-size:12.5px;color:var(--tinta-2);line-height:1.5}
.cta-rol input:checked + .cta-rol-in{border-color:var(--azul-cl);background:var(--azul-bg)}
.cta-rol input:focus-visible + .cta-rol-in{outline:2.5px solid var(--foco);outline-offset:2px}
.cta-sin{font-family:var(--f-num);font-size:10px;line-height:1.65;color:var(--tinta-3);
  border-left:3px solid var(--linea-2);padding-left:12px;margin:14px 0 0}
.cta-cab{display:flex;align-items:center;gap:14px;margin-bottom:22px;padding-bottom:18px;
  border-bottom:1px solid var(--linea)}
.cta-cab b{display:block;font-size:16px;color:var(--tinta)}
.cta-cab span{display:block;font-size:12.5px;color:var(--tinta-2)}
.cta-rol-p{font-family:var(--f-num);font-size:10px !important;letter-spacing:.05em;
  color:var(--ok) !important;margin-top:3px}
.cta-cli{list-style:none;margin:0 0 14px;padding:0;display:flex;gap:26px}
.cta-cli b{display:block;font-family:var(--f-num);font-size:24px;font-weight:800;color:var(--azul)}
.cta-cli span{font-size:12px;color:var(--tinta-2)}
.cta-crm{margin-top:24px;border:1px solid var(--linea);border-left:4px solid var(--amarillo);
  border-radius:var(--r-3);background:var(--lienzo-2);padding:17px 19px}
.cta-crm h4{font-family:var(--f-num);font-size:10px;letter-spacing:.11em;text-transform:uppercase;
  color:var(--tinta-3);margin:0 0 7px;font-weight:600}
.cta-crm p{font-size:13.5px;color:var(--tinta-2);margin:0 0 13px}

/* pasos de publicación */
.pa-barra{height:6px;border-radius:99px;background:var(--linea);overflow:hidden;margin:4px 0 7px}
.pa-barra i{display:block;height:100%;background:var(--azul-cl);transition:width .3s ease}
@media (prefers-reduced-motion:reduce){.pa-barra i{transition:none}}
.pa-prog{font-family:var(--f-num);font-size:11px;color:var(--tinta-3);margin:0 0 16px}
.pa-prog.listo{color:var(--ok)}
ol.pa-l{list-style:none;margin:0;padding:0;display:grid;gap:9px}
ol.pa-l > li{display:flex;gap:12px;align-items:flex-start;border:1px solid var(--linea);
  border-radius:var(--r-2);padding:13px 15px;background:var(--lienzo)}
ol.pa-l > li.hecho{background:var(--lienzo-2);border-color:var(--ok)}
ol.pa-l > li.hecho .pa-n{background:var(--ok);color:var(--lienzo);border-color:var(--ok)}
ol.pa-l > li.hecho .pa-c b{text-decoration:line-through;color:var(--tinta-3)}
.pa-n{width:24px;height:24px;border-radius:99px;border:1.5px solid var(--linea-2);flex:none;
  display:flex;align-items:center;justify-content:center;font-size:11.5px;color:var(--tinta-2)}
.pa-c{flex:1;min-width:0}
.pa-c b{display:block;font-size:14px;color:var(--tinta);margin-bottom:3px}
.pa-c p{font-size:12.5px;color:var(--tinta-2);margin:0;line-height:1.5}
.pa-bloq{display:inline-block;font-family:var(--f-num);font-size:9px;letter-spacing:.07em;
  text-transform:uppercase;color:var(--crit);border:1px solid var(--crit);border-radius:99px;
  padding:2px 7px;margin-top:6px}

/* ---------- 32. Pasarela CRM ---------- */
.crm-modos{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;
  margin:0 0 24px}
.crm-m{border:1px solid var(--linea);border-radius:var(--r-2);padding:14px 15px;
  background:var(--lienzo);position:relative}
.crm-m.rec{border-color:var(--azul-cl);background:var(--azul-bg)}
.crm-m b{display:block;font-size:14.5px;color:var(--tinta);margin-bottom:6px}
.crm-rec{position:absolute;top:12px;right:13px;font-family:var(--f-num);font-size:8.5px;
  letter-spacing:.08em;text-transform:uppercase;color:var(--azul);border:1px solid var(--azul-cl);
  border-radius:99px;padding:2px 7px}
.crm-m p{font-size:12.5px;color:var(--tinta-2);margin:0 0 9px;line-height:1.5}
.crm-t{font-family:var(--f-num);font-size:10px;color:var(--tinta-3)}
table.crm-t2{min-width:520px} table.crm-t3{min-width:560px}
.crm-al{font-family:var(--f-num);font-size:11px;color:var(--tinta-2)}
.crm-t2 code{font-family:var(--f-num);font-size:12px;color:var(--azul);background:var(--lienzo-2);
  padding:2px 6px;border-radius:4px}
.crm-req{font-family:var(--f-num);font-size:10px;color:var(--crit)}
.crm-opt{font-family:var(--f-num);font-size:10px;color:var(--tinta-3)}
textarea.crm-tx{font-family:var(--f-num);font-size:12px;line-height:1.5;resize:vertical;
  min-height:130px;padding:11px 13px}
.crm-tot{display:flex;gap:20px;flex-wrap:wrap;margin:16px 0 12px}
.crm-tot span{display:flex;align-items:baseline;gap:7px;font-size:12.5px;color:var(--tinta-2)}
.crm-tot b{font-family:var(--f-num);font-size:22px;font-weight:800}
.crm-tot .c-ok b{color:var(--ok)} .crm-tot .c-av b{color:var(--warn)}
.crm-tot .c-ko b{color:var(--crit)}
.crm-tot span{background:none;padding:0;border:0;color:var(--tinta-2)}
.crm-f.crm-ok td:first-child{box-shadow:inset 3px 0 0 var(--ok)}
.crm-f.crm-aviso td:first-child{box-shadow:inset 3px 0 0 var(--warn)}
.crm-f.crm-mal td:first-child{box-shadow:inset 3px 0 0 var(--crit)}
.crm-sub{display:block;font-family:var(--f-num);font-size:10px;color:var(--tinta-3);margin-top:2px}
.crm-e{display:inline-block;font-family:var(--f-num);font-size:9.5px;letter-spacing:.06em;
  text-transform:uppercase;border:1px solid;border-radius:99px;padding:2px 8px}
.crm-e.crm-ok{color:var(--ok);border-color:var(--ok)}
.crm-e.crm-aviso{color:var(--warn);border-color:var(--warn)}
.crm-e.crm-mal{color:var(--crit);border-color:var(--crit)}
ul.crm-msg{margin:7px 0 0;padding-left:17px}
ul.crm-msg li{font-size:11.5px;line-height:1.45;margin-bottom:3px}
ul.crm-msg li.e{color:var(--crit)} ul.crm-msg li.a{color:var(--tinta-2)}

/* ---------- 33. Visitar la isla ---------- */
.guia-pie{display:flex;gap:8px;flex-wrap:wrap}
.vis-b{cursor:pointer;font-family:inherit}
.vis-cab{display:flex;align-items:center;gap:14px;margin-bottom:20px;padding-bottom:16px;
  border-bottom:1px solid var(--linea)}
.vis-cab svg{width:54px;height:54px;flex:none}
.vis-cab b{display:block;font-size:19px;color:var(--tinta)}
.vis-cab span{display:block;font-family:var(--f-num);font-size:11.5px;color:var(--tinta-2);
  margin-top:2px;line-height:1.5}
.vis h4{font-family:var(--f-num);font-size:10px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--tinta-3);margin:24px 0 10px;font-weight:600;
  border-top:1px solid var(--linea);padding-top:16px}
.vis h4:first-of-type{border-top:0;padding-top:0;margin-top:0}
.vis-hist{font-size:14.5px;line-height:1.7;color:var(--tinta-2);margin:0}
ul.vis-l{list-style:none;margin:0;padding:0;display:grid;gap:8px}
ul.vis-l.ver{grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
ul.vis-l.gastro{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
ul.vis-l li{border-left:2px solid var(--linea-2);padding:2px 0 2px 12px}
ul.vis-l.ver li{border-left-color:var(--ok)}
ul.vis-l.gastro li{border-left-color:var(--oro)}
ul.vis-l li b{display:block;font-size:13.5px;color:var(--tinta);font-weight:650;line-height:1.4}
.vis-k{display:block;font-family:var(--f-num);font-size:10px;color:var(--tinta-3);margin-top:2px}
.vis-ir{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px}
.vis-ir .lbl{display:block;font-family:var(--f-num);font-size:9.5px;letter-spacing:.09em;
  text-transform:uppercase;color:var(--tinta-3);margin-bottom:5px}
.vis-ir ul{margin:0;padding-left:16px}
.vis-ir li{font-size:13px;color:var(--tinta-2);margin-bottom:3px;line-height:1.45}
.vis-of{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px}
.vis-en{display:block;border:1px solid var(--linea);border-radius:var(--r-2);padding:12px 14px;
  background:var(--lienzo);text-decoration:none}
.vis-en:hover{border-color:var(--azul-cl);background:var(--azul-bg)}
.vis-en:focus-visible{outline:2.5px solid var(--foco);outline-offset:2px}
.vis-en .lbl{display:block;font-family:var(--f-num);font-size:9.5px;letter-spacing:.09em;
  text-transform:uppercase;color:var(--tinta-3);margin-bottom:4px}
.vis-en b{display:block;font-size:14px;color:var(--azul);margin-bottom:5px;line-height:1.35}
.vis-ext{display:inline-flex;align-items:center;gap:5px;font-family:var(--f-num);font-size:9.5px;
  color:var(--tinta-3)}
.vis-ext svg{width:11px;height:11px}
.pre-vis{margin:0 0 22px}
.pre-vis h2{font-size:15px;margin:0 0 9px;color:var(--azul)}
.pre-vis p{font-size:14px;color:var(--tinta-2);line-height:1.7;margin:0}
.pre-vis ul{margin:0;padding-left:20px}
.pre-vis li{font-size:13.5px;color:var(--tinta-2);margin-bottom:5px;line-height:1.5}
.pre-vis li b{color:var(--tinta)}
.pre-vis li span{font-family:var(--f-num);font-size:11px;color:var(--tinta-3)}

/* ---------- 34. Capacidades: la rejilla de herramientas ----------
   Tres estados y tres tratamientos. Lo activo se ve como una tarjeta
   normal y se puede pulsar. Lo apagado por plan mantiene el volumen
   —para que se vea que existe— y pierde el color. Lo que es de otro
   perfil se apaga del todo: no se le vende a quien no le sirve. */
.cap-cab{margin:4px 0 20px}
.cap-cab h4{font-size:17px;color:var(--tinta);margin:0 0 5px}
.cap-g{margin-bottom:20px}
.cap-g > .lbl{display:block;font-family:var(--f-num);font-size:9.5px;letter-spacing:.11em;
  text-transform:uppercase;color:var(--tinta-3);margin-bottom:9px}
.cap-rej{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,215px),1fr));gap:9px}
.cap{position:relative;border:1px solid var(--linea);border-radius:var(--r-2);
  padding:13px 15px 12px;background:var(--lienzo);min-width:0}
.cap[data-cap]{cursor:pointer}
.cap[data-cap]:hover{border-color:var(--azul-cl);background:var(--azul-bg)}
.cap[data-cap]:focus-visible{outline:2.5px solid var(--foco);outline-offset:2px}
.cap b{display:block;font-size:14px;color:var(--tinta);margin:0 0 4px;padding-right:22px}
.cap p{font-size:12px;line-height:1.5;color:var(--tinta-2);margin:0 0 9px}
.cap-ic{position:absolute;top:12px;right:13px;width:16px;height:16px;color:var(--ok)}
.cap-ic svg{width:100%;height:100%}
.cap-tag{display:inline-block;font-family:var(--f-num);font-size:9px;letter-spacing:.07em;
  text-transform:uppercase;border-radius:99px;padding:3px 8px}
.cap-tag.si{color:var(--ok);background:var(--ok-bg);border:1px solid var(--ok-bd)}
.cap-tag.plan{color:var(--sobre-amarillo);background:var(--amarillo-2);
  border:1px solid var(--amarillo-9);cursor:pointer}
.cap-tag.no{color:var(--tinta-2);background:var(--fondo-2);border:1px solid var(--linea)}
.cap.plan{background:var(--lienzo-2);border-style:dashed}
.cap.plan b{color:var(--tinta-2)}
.cap.plan .cap-ic{color:var(--oro-2)}
.cap.no{background:transparent;border-color:var(--linea);opacity:.62}
.cap.no .cap-ic{color:var(--tinta-4)}
.cap-otros{margin-top:6px}
.cap-otros summary{font-family:var(--f-num);font-size:11px;color:var(--tinta-3);cursor:pointer;
  padding:9px 0;list-style:none}
.cap-otros summary::-webkit-details-marker{display:none}
.cap-otros summary::before{content:"+ ";font-weight:700}
.cap-otros[open] summary::before{content:"– "}
.cap-otros summary:focus-visible{outline:2.5px solid var(--foco);outline-offset:2px}

/* selector de plan dentro de la cuenta */
.cap-sel{border:1px solid var(--linea);border-radius:var(--r-2);padding:13px 15px;
  background:var(--lienzo-2);margin-top:14px}
.cap-sel > .lbl{display:block;font-family:var(--f-num);font-size:9.5px;letter-spacing:.11em;
  text-transform:uppercase;color:var(--tinta-3);margin-bottom:8px}
.cap-sel-b{display:flex;gap:7px;flex-wrap:wrap}
.cap-sel-b button{flex:1 1 120px;border:1px solid var(--linea-2);border-radius:var(--r-2);
  background:var(--lienzo);padding:9px 11px;cursor:pointer;text-align:left;min-width:0}
.cap-sel-b button b{display:block;font-size:13px;color:var(--tinta)}
.cap-sel-b button span{font-family:var(--f-num);font-size:10.5px;color:var(--tinta-2)}
.cap-sel-b button[aria-checked="true"]{border-color:var(--azul);background:var(--azul-bg)}
.cap-sel-b button[aria-checked="true"] b{color:var(--azul)}
.cap-sel-b button:focus-visible{outline:2.5px solid var(--foco);outline-offset:2px}
.cap-sel .chk-src{margin-top:9px}

/* atajos: lo que este perfil viene a hacer */
.cta-ata{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,140px),1fr));
  gap:9px;margin-bottom:24px}
.ata{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:7px;
  border:1px solid var(--azul-cl);border-radius:var(--r-2);background:var(--azul-bg);
  padding:14px 15px;cursor:pointer;text-align:left;min-width:0}
.ata b{font-size:14px;color:var(--azul);line-height:1.3}
.ata-ic{width:18px;height:18px;color:var(--azul-cl)}
.ata-ic svg{width:100%;height:100%}
.ata:hover{border-color:var(--azul);background:var(--lienzo)}
.ata:focus-visible{outline:2.5px solid var(--foco);outline-offset:2px}
.ata.plan,.ata.no{border-color:var(--linea-2);background:var(--lienzo-2);border-style:dashed}
.ata.plan b,.ata.no b{color:var(--tinta-2)}
.ata.plan .ata-ic{color:var(--oro-2)}
.ata.no .ata-ic{color:var(--tinta-4)}
.ata-av{position:absolute;top:-7px;right:-7px;min-width:21px;height:21px;padding:0 6px;
  border-radius:99px;background:var(--crit);color:var(--sobre-crit);font-family:var(--f-num);
  font-size:11px;font-weight:700;font-style:normal;display:flex;align-items:center;
  justify-content:center;border:2px solid var(--lienzo)}

/* hoja de subida de plan */
.cap-up{text-align:left}
.cap-cand{display:block;width:26px;height:26px;color:var(--oro-2);margin-bottom:10px}
.cap-cand svg{width:100%;height:100%}
.cap-up h4{font-size:18px;color:var(--tinta);margin:0 0 6px}
.cap-up-q{font-size:14px;font-weight:700;color:var(--oro);margin:0 0 16px}
.cap-planes{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr));gap:10px}
.cap-plan{border:1px solid var(--linea);border-radius:var(--r-2);padding:14px 15px;
  background:var(--lienzo);min-width:0}
.cap-plan.clave{border-color:var(--amarillo-9);background:var(--amarillo-2)}
.cap-plan.hoy{border-color:var(--azul-cl);background:var(--azul-bg)}
.cap-plan b{display:block;font-size:14.5px;color:var(--tinta);margin-bottom:5px}
.cap-eur{display:block;font-family:var(--f-num);font-size:20px;font-weight:800;color:var(--tinta)}
.cap-eur i{font-size:11px;font-weight:400;font-style:normal;color:var(--tinta-3)}
.cap-anun{display:block;font-family:var(--f-num);font-size:10.5px;color:var(--tinta-2);margin:3px 0 10px}
.cap-plan.clave .cap-eur,.cap-plan.clave b{color:var(--sobre-amarillo)}
.cap-plan.clave .cap-anun{color:var(--sobre-amarillo);opacity:.82}
.cap-hoy{display:inline-block;font-family:var(--f-num);font-size:9px;letter-spacing:.07em;
  text-transform:uppercase;color:var(--azul);border:1px solid var(--azul-cl);
  border-radius:99px;padding:3px 8px}

/* atenuación de un control de la interfaz de siempre */
.cap-off{opacity:.5;pointer-events:none}

/* ---------- 35. Sección pública para profesionales ---------- */
.pro-t th[scope="col"]{vertical-align:bottom}
.pro-th b{display:block;font-size:14px;color:var(--tinta)}
.pro-th span{display:block;font-family:var(--f-num);font-size:15px;font-weight:800;color:var(--azul)}
.pro-th i{display:block;font-family:var(--f-num);font-size:9.5px;font-style:normal;color:var(--tinta-3)}
.pro-t tbody th[scope="row"]{text-align:left;font-weight:400;max-width:340px}
.pro-t tbody th[scope="row"] b{display:block;font-size:13.5px;color:var(--tinta)}
.pro-d{display:block;font-size:11.5px;line-height:1.45;color:var(--tinta-3);margin-top:2px}
.pro-g th{background:var(--fondo-2);font-family:var(--f-num);font-size:9.5px;letter-spacing:.11em;
  text-transform:uppercase;color:var(--tinta-2);text-align:left;padding:7px 12px}
.pro-c{text-align:center;width:16%}
.pro-c.si svg{width:16px;height:16px;color:var(--ok)}
.pro-no{color:var(--tinta-3);font-size:15px}
.pro-puertas{display:flex;gap:9px;flex-wrap:wrap;margin:20px 0 24px}

/* ---------- 36. Bandeja de contactos y cartera ---------- */
.ld-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,110px),1fr));
  gap:9px;margin:0 0 8px}
.ld-k{border:1px solid var(--linea);border-radius:var(--r-2);padding:11px 13px;
  background:var(--lienzo-2);min-width:0}
.ld-k b{display:block;font-family:var(--f-num);font-size:22px;font-weight:800;color:var(--tinta);
  line-height:1.1;font-variant-numeric:tabular-nums}
.ld-k span{display:block;font-size:11px;color:var(--tinta-2);margin-top:2px;line-height:1.3}
.ld-k.vivo{border-color:var(--azul-cl);background:var(--azul-bg)}
.ld-k.vivo b{color:var(--azul)}
.ld-k.mal{border-color:var(--crit-bd);background:var(--crit-bg)}
.ld-k.mal b{color:var(--crit)}

.ld-filtros{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:16px 0 14px}
.ld-chips{display:flex;flex-wrap:wrap;gap:6px;flex:1 1 260px}
.ld-chip{display:inline-flex;align-items:center;gap:5px;border:1px solid var(--linea-2);
  border-radius:99px;background:var(--lienzo);padding:5px 11px;font-size:12px;
  color:var(--tinta-2);cursor:pointer}
.ld-chip i{font-family:var(--f-num);font-size:10px;font-style:normal;color:var(--tinta-3)}
.ld-chip:hover{border-color:var(--azul-cl)}
.ld-chip.on{border-color:var(--azul);background:var(--azul-bg);color:var(--azul)}
.ld-chip.on i{color:var(--azul-cl)}
.ld-chip:focus-visible{outline:2.5px solid var(--foco);outline-offset:2px}
.ld-q{flex:1 1 190px;min-width:0}

ul.ld-l,ul.cr-l,ul.al-l,ul.vd-l,ul.eq-l{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.ld-i{border:1px solid var(--linea);border-radius:var(--r-2);padding:14px 16px;
  background:var(--lienzo);border-left:4px solid var(--linea-2)}
.ld-i.e-nuevo{border-left-color:var(--azul-cl)}
.ld-i.e-contactado{border-left-color:var(--s-me)}
.ld-i.e-visita{border-left-color:var(--amarillo-9)}
.ld-i.e-oferta{border-left-color:var(--oro-2)}
.ld-i.e-cerrado{border-left-color:var(--ok)}
.ld-i.e-perdido{border-left-color:var(--tinta-4);opacity:.72}
.ld-i.urge{border-left-color:var(--crit);background:var(--crit-bg)}
.ld-i-cab{display:flex;align-items:center;gap:11px;margin-bottom:10px}
.ld-av{width:32px;height:32px;border-radius:99px;background:var(--azul);color:var(--lienzo);
  display:flex;align-items:center;justify-content:center;flex:none;
  font-family:var(--f-num);font-size:11.5px;font-weight:700}
.ld-who{flex:1;min-width:0}
.ld-who b{display:block;font-size:14.5px;color:var(--tinta);line-height:1.25}
.ld-who span{font-family:var(--f-num);font-size:10.5px;color:var(--tinta-2)}
.ld-est{font-family:var(--f-num);font-size:9px;letter-spacing:.07em;text-transform:uppercase;
  border-radius:99px;padding:3px 9px;flex:none;border:1px solid var(--linea-2);color:var(--tinta-2)}
.ld-est.e-nuevo{color:var(--azul);border-color:var(--azul-cl);background:var(--azul-bg)}
.ld-est.e-cerrado{color:var(--ok);border-color:var(--ok-bd);background:var(--ok-bg)}
.ld-est.e-perdido{color:var(--tinta-3)}
.ld-inm{border-left:2px solid var(--linea);padding-left:11px;margin-bottom:10px}
.ld-inm b{display:block;font-size:13px;color:var(--tinta);line-height:1.35}
.ld-inm span{font-family:var(--f-num);font-size:10.5px;color:var(--tinta-2)}
.ld-meta{display:flex;flex-wrap:wrap;gap:8px 13px;align-items:center;margin-bottom:10px;
  font-family:var(--f-num);font-size:10.5px;color:var(--tinta-2)}
.ld-via{border:1px solid var(--linea-2);border-radius:99px;padding:2px 9px;color:var(--tinta-2)}
.ld-sla,.ld-ok{display:inline-flex;align-items:center;gap:5px;font-weight:700}
.ld-sla svg,.ld-ok svg{width:12px;height:12px}
.ld-sla.ok{color:var(--ok)} .ld-sla.w{color:var(--warn)} .ld-sla.c{color:var(--crit)}
.ld-ok{color:var(--ok)}
.ld-notas{list-style:none;margin:0 0 10px;padding:9px 11px;display:grid;gap:5px;
  background:var(--lienzo-2);border-radius:var(--r-1);font-size:12px;color:var(--tinta-2)}
.ld-notas span{font-family:var(--f-num);font-size:9.5px;color:var(--tinta-3);margin-right:7px}
.ld-acts{display:flex;flex-wrap:wrap;gap:7px}
.btn-s.pri{border-color:var(--azul);color:var(--azul);background:var(--azul-bg);font-weight:700}
.btn-s.pri:hover{background:var(--azul);color:var(--lienzo)}
.ld-vacio{font-size:13.5px;color:var(--tinta-3);text-align:center;padding:26px 0;
  border:1px dashed var(--linea-2);border-radius:var(--r-2)}

/* cartera */
.cr-i{border:1px solid var(--linea);border-radius:var(--r-2);padding:14px 16px;
  background:var(--lienzo);display:grid;gap:9px}
.cr-i.e-caduca{border-color:var(--warn-bd);background:var(--warn-bg)}
.cr-i.e-fallo{border-color:var(--crit-bd);background:var(--crit-bg)}
.cr-i.e-borrador{opacity:.72}
.cr-who b{display:block;font-size:14px;color:var(--tinta);line-height:1.3}
.cr-who span{font-family:var(--f-num);font-size:10.5px;color:var(--tinta-2)}
.cr-est{justify-self:start;font-family:var(--f-num);font-size:9px;letter-spacing:.07em;
  text-transform:uppercase;border-radius:99px;padding:3px 9px;border:1px solid var(--linea-2);
  color:var(--tinta-2)}
.cr-est.e-activo{color:var(--ok);border-color:var(--ok-bd);background:var(--ok-bg)}
.cr-est.e-caduca{color:var(--warn);border-color:var(--warn-bd)}
.cr-est.e-fallo{color:var(--crit);border-color:var(--crit-bd)}
.cr-est.e-crm{color:var(--azul);border-color:var(--azul-cl)}
.cr-num{display:flex;gap:20px;flex-wrap:wrap}
.cr-num span{font-family:var(--f-num);font-size:10.5px;color:var(--tinta-2)}
.cr-num b{display:block;font-size:17px;font-weight:800;color:var(--tinta);
  font-variant-numeric:tabular-nums}
.cr-num .mal b{color:var(--crit)}
.cr-motivo{display:flex;align-items:flex-start;gap:7px;font-size:12.5px;color:var(--crit);margin:0}
.cr-motivo svg{width:15px;height:15px;flex:none;margin-top:1px}

/* ---------- 37. Alertas, vendedor, equipo y factura ---------- */
.al-nueva{border:1px solid var(--azul-cl);background:var(--azul-bg);border-radius:var(--r-2);
  padding:15px 17px;margin-bottom:18px}
.al-nueva > .lbl{display:block;font-family:var(--f-num);font-size:9.5px;letter-spacing:.11em;
  text-transform:uppercase;color:var(--tinta-3);margin-bottom:5px}
.al-nueva > b{display:block;font-size:14.5px;color:var(--tinta);line-height:1.4;margin-bottom:4px}
.al-n{display:block;font-family:var(--f-num);font-size:11px;color:var(--azul);margin-bottom:12px}
.al-frec{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:13px}
.al-frec button{border:1px solid var(--linea-2);border-radius:99px;background:var(--lienzo);
  padding:6px 12px;font-size:12px;color:var(--tinta-2);cursor:pointer}
.al-frec button[aria-checked="true"]{border-color:var(--azul);background:var(--azul);color:var(--lienzo)}
.al-frec button:focus-visible{outline:2.5px solid var(--foco);outline-offset:2px}
ul.al-l > li{border:1px solid var(--linea);border-radius:var(--r-2);padding:13px 15px;
  background:var(--lienzo);display:grid;gap:9px}
.al-who b{display:block;font-size:13.5px;color:var(--tinta);line-height:1.4}
.al-who span{font-family:var(--f-num);font-size:10.5px;color:var(--tinta-2)}

.vd-form .tog{margin-top:9px}
.vd-ok{display:flex;gap:12px;align-items:flex-start;border:1px solid var(--ok-bd);
  background:var(--ok-bg);border-radius:var(--r-2);padding:14px 16px;margin-bottom:18px}
.vd-ok svg{width:20px;height:20px;color:var(--ok);flex:none}
.vd-ok b{display:block;font-size:14.5px;color:var(--ok)}
.vd-ok span{font-size:12.5px;color:var(--tinta-2)}
ul.vd-l > li{border:1px solid var(--linea);border-radius:var(--r-2);padding:14px 16px;
  background:var(--lienzo);display:grid;gap:10px}
.vd-cab{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.vd-cab b{font-size:15px;color:var(--tinta)}
.vd-ver{display:inline-flex;align-items:center;gap:5px;font-family:var(--f-num);font-size:9.5px;
  letter-spacing:.05em;color:var(--ok);border:1px solid var(--ok-bd);background:var(--ok-bg);
  border-radius:99px;padding:2px 9px}
.vd-ver svg{width:12px;height:12px}
.vd-num{display:flex;gap:20px;flex-wrap:wrap}
.vd-num span{font-family:var(--f-num);font-size:10.5px;color:var(--tinta-2)}
.vd-num b{display:block;font-size:18px;font-weight:800;color:var(--tinta);
  font-variant-numeric:tabular-nums}
.vd-idi{font-family:var(--f-num);font-size:11px;color:var(--tinta-2);margin:0}

ul.eq-l > li{display:flex;flex-wrap:wrap;align-items:center;gap:11px;border:1px solid var(--linea);
  border-radius:var(--r-2);padding:13px 15px;background:var(--lienzo)}
.eq-who{flex:1 1 150px;min-width:0}
.eq-who b{display:block;font-size:14px;color:var(--tinta)}
.eq-who span{font-family:var(--f-num);font-size:10.5px;color:var(--tinta-2)}
.eq-est{font-family:var(--f-num);font-size:9px;letter-spacing:.07em;text-transform:uppercase;
  border-radius:99px;padding:3px 9px;border:1px solid var(--linea-2);color:var(--tinta-2)}
.eq-est.si{color:var(--ok);border-color:var(--ok-bd);background:var(--ok-bg)}
.eq-c{display:inline-flex;align-items:center;gap:6px;font-family:var(--f-num);font-size:10px;
  color:var(--ok)}
.eq-c.falta{color:var(--warn)}
.eq-c svg{width:13px;height:13px}
.eq-regla{margin-top:18px;border:1px solid var(--linea);border-left:4px solid var(--azul-cl);
  border-radius:var(--r-3);background:var(--lienzo-2);padding:15px 17px}
.eq-regla b{display:block;font-size:14px;color:var(--tinta);margin-bottom:6px}
.eq-regla p{font-size:13px;line-height:1.6;color:var(--tinta-2);margin:0}

.fa-plan{display:flex;justify-content:space-between;align-items:center;gap:14px;
  border:1px solid var(--azul-cl);background:var(--azul-bg);border-radius:var(--r-2);
  padding:14px 17px;margin-bottom:16px;flex-wrap:wrap}
.fa-plan .lbl{display:block;font-family:var(--f-num);font-size:9.5px;letter-spacing:.11em;
  text-transform:uppercase;color:var(--tinta-3)}
.fa-plan b{font-size:17px;color:var(--azul)}
.fa-eur{font-family:var(--f-num);font-size:24px;font-weight:800;color:var(--azul)}
.fa-eur i{font-size:11px;font-weight:400;font-style:normal;color:var(--tinta-3)}
.fa-cuota{margin-bottom:18px}
.fa-cuota .lbl{display:block;font-family:var(--f-num);font-size:9.5px;letter-spacing:.11em;
  text-transform:uppercase;color:var(--tinta-3);margin-bottom:6px}
.fa-cuota > span{font-family:var(--f-num);font-size:11px;color:var(--tinta-2)}
.fa-barra{height:7px;border-radius:99px;background:var(--linea);overflow:hidden;margin-bottom:5px}
.fa-barra i{display:block;height:100%;background:var(--azul-cl)}
.fa-t th[scope="row"]{text-align:left;font-weight:400;color:var(--tinta-2)}
.fa-t td{text-align:right;font-variant-numeric:tabular-nums}
.fa-tot th,.fa-tot td{font-weight:800;color:var(--tinta);border-top:2px solid var(--linea-2)}

/* franja de promesas del pie */
.pie-ev{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));
  gap:11px 22px;padding-bottom:26px;margin-bottom:26px;
  border-bottom:1px solid rgba(255,255,255,.11)}
.pev{display:block;min-width:0}
.pev b{display:block;font-size:13px;color:#fff;line-height:1.35}
.pev i{display:block;font-style:normal;font-size:11.5px;line-height:1.5;color:#A6C0D6;
  margin-top:2px}

/* la solicitud de visita ahora deja un localizador */
.vis-loc{font-family:var(--f-num);font-size:11.5px;color:var(--azul);margin:8px 0 12px}

@media (max-width:520px){
  .cap-rej{grid-template-columns:1fr}
  .ld-acts .btn-s{flex:1 1 auto;justify-content:center}
  .cr-num,.vd-num{gap:14px}
}

/* ---------- 38. Consola interna ----------
   Deliberadamente más sobria que el resto del portal: aquí no hay
   nada que vender. Lo único que sube el tono es el reloj de los
   plazos, porque es lo que hay que ver desde la puerta. */
.bo-cab{border-bottom:1px solid var(--linea);padding-bottom:16px;margin-bottom:18px}
.bo-cab > div{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:7px}
.bo-cab b{font-size:16px;color:var(--tinta)}
.bo-cab .cta-p{margin:0}
.bo-rol{font-family:var(--f-num);font-size:9px;letter-spacing:.09em;text-transform:uppercase;
  border-radius:99px;padding:3px 9px;flex:none;border:1px solid var(--linea-2);color:var(--tinta-2)}
.bo-rol.admin{color:var(--sobre-amarillo);background:var(--amarillo-2);border-color:var(--amarillo-9)}
.bo-rol.gestor{color:var(--azul);background:var(--azul-bg);border-color:var(--azul-cl)}

.bo-nav{display:flex;gap:4px;flex-wrap:wrap;border-bottom:1px solid var(--linea);margin-bottom:16px}
.bo-nav button{display:inline-flex;align-items:center;gap:6px;background:none;border:0;
  padding:9px 12px;font-size:13.5px;font-weight:700;color:var(--tinta-3);cursor:pointer;
  border-bottom:2px solid transparent;margin-bottom:-1px}
.bo-nav button i{font-family:var(--f-num);font-size:10px;font-style:normal;font-weight:700;
  min-width:17px;height:17px;padding:0 4px;border-radius:99px;background:var(--crit);
  color:var(--sobre-crit);
  display:inline-flex;align-items:center;justify-content:center}
.bo-nav button[aria-selected="true"]{color:var(--azul);border-bottom-color:var(--azul)}
.bo-nav button:focus-visible{outline:2.5px solid var(--foco);outline-offset:-2px}

.bo-intro{font-size:12.5px;line-height:1.6;color:var(--tinta-2);
  border-left:3px solid var(--linea-2);padding-left:12px;margin:0 0 16px}
ul.bo-l{list-style:none;margin:0;padding:0;display:grid;gap:11px}
ul.bo-l.hechos{margin-top:11px;opacity:.72}
.bo-i{border:1px solid var(--linea);border-radius:var(--r-2);padding:15px 17px;
  background:var(--lienzo);display:grid;gap:11px}
.bo-i.ojo{border-left:4px solid var(--warn)}
.bo-i.aviso{border-left:4px solid var(--crit)}
.bo-i.apela{border-left:4px solid var(--azul-cl)}
.bo-i-cab{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap}
.bo-i-cab b{display:block;font-size:14.5px;color:var(--tinta);line-height:1.3}
.bo-i-cab span{font-family:var(--f-num);font-size:10.5px;color:var(--tinta-2)}
.bo-plazo{display:inline-flex;align-items:center;gap:5px;font-family:var(--f-num);font-size:10.5px;
  font-weight:700;flex:none;border-radius:99px;padding:3px 9px;border:1px solid}
.bo-plazo svg{width:12px;height:12px}
.bo-plazo.ok{color:var(--ok);border-color:var(--ok-bd);background:var(--ok-bg)}
.bo-plazo.w{color:var(--warn);border-color:var(--warn-bd);background:var(--warn-bg)}
.bo-plazo.c{color:var(--crit);border-color:var(--crit-bd);background:var(--crit-bg)}

.bo-datos{display:flex;gap:20px;flex-wrap:wrap}
.bo-datos span{font-family:var(--f-num);font-size:10.5px;color:var(--tinta-2)}
.bo-datos b{display:block;font-size:13px;font-weight:700;color:var(--tinta)}
.bo-ref{font-family:var(--f-num);font-size:10.5px;color:var(--tinta-2);margin:0}
.bo-ref code{font-size:11px;color:var(--tinta);background:var(--fondo-2);
  border-radius:4px;padding:1px 5px;word-break:break-all}
.bo-det{font-size:13px;line-height:1.6;color:var(--tinta-2);margin:0}
.bo-firmo{font-family:var(--f-num);font-size:10.5px;color:var(--tinta-2);margin:0}

.bo-docs{list-style:none;margin:0;padding:0;display:flex;gap:7px;flex-wrap:wrap}
.bo-docs li{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;
  border:1px solid var(--linea-2);border-radius:99px;padding:3px 10px;color:var(--tinta-2)}
.bo-docs li svg{width:12px;height:12px;flex:none}
.bo-docs li.si{color:var(--ok);border-color:var(--ok-bd);background:var(--ok-bg)}
.bo-docs li.no{color:var(--crit);border-color:var(--crit-bd);background:var(--crit-bg)}

.bo-cita{margin:0;border-left:3px solid var(--linea-2);padding:2px 0 2px 13px;
  font-size:13px;line-height:1.6;color:var(--tinta-2);font-style:italic}
.bo-dec{display:grid;gap:10px;border-top:1px solid var(--linea);padding-top:12px}
.bo-mot{display:grid;gap:5px}
.bo-mot > span{font-family:var(--f-num);font-size:9.5px;letter-spacing:.11em;
  text-transform:uppercase;color:var(--tinta-3)}
.btn-s.no{border-color:var(--crit-bd);color:var(--crit)}
.btn-s.no:hover{border-color:var(--crit);background:var(--crit);color:var(--sobre-crit)}
.bo-res{display:flex;align-items:flex-start;gap:8px;font-size:12.5px;color:var(--tinta-2);
  border-top:1px solid var(--linea);padding-top:11px}
.bo-res svg{width:15px;height:15px;flex:none;margin-top:1px}
.bo-res.aprobado svg{color:var(--ok)}
.bo-res.rechazado svg{color:var(--crit)}
.bo-res b{color:var(--tinta)}

/* El veto de la separación de funciones: se explica, no se esconde */
.bo-veto{display:flex;gap:11px;align-items:flex-start;border:1px solid var(--warn-bd);
  background:var(--warn-bg);border-radius:var(--r-2);padding:13px 15px}
.bo-veto svg{width:18px;height:18px;color:var(--warn);flex:none;margin-top:1px}
.bo-veto b{display:block;font-size:13.5px;color:var(--warn);margin-bottom:4px}
.bo-veto p{font-size:12.5px;line-height:1.55;color:var(--tinta-2);margin:0}

/* registro */
ol.bo-reg{list-style:none;margin:0 0 12px;padding:0;display:grid;gap:1px;
  border:1px solid var(--linea);border-radius:var(--r-2);overflow:hidden}
ol.bo-reg > li{display:flex;flex-wrap:wrap;align-items:center;gap:8px;
  padding:9px 13px;background:var(--lienzo);font-size:12.5px;color:var(--tinta-2)}
ol.bo-reg > li:nth-child(even){background:var(--lienzo-2)}
.bo-reg-t{font-family:var(--f-num);font-size:10px;color:var(--tinta-3);
  font-variant-numeric:tabular-nums;flex:none}
ol.bo-reg b{font-size:12.5px;color:var(--tinta)}
.bo-reg-a{flex:1 1 160px;min-width:0}
.bo-reg-m,.bo-reg-e{font-family:var(--f-num);font-size:9.5px;border:1px solid var(--linea-2);
  border-radius:99px;padding:2px 8px;color:var(--tinta-2)}

/* personal */
.bo-unico{display:inline-flex;align-items:center;gap:6px;font-family:var(--f-num);font-size:10px;
  letter-spacing:.05em;color:var(--sobre-amarillo);border:1px solid var(--amarillo-9);
  background:var(--amarillo-2);border-radius:99px;padding:4px 10px}
.bo-unico svg{width:13px;height:13px}
.bo-entrada{border-left-color:var(--azul-cl)}

/* la puerta del pie: presente, sin competir */
.f-interno{font-family:var(--f-num);font-size:11px;letter-spacing:.03em}

/* ---------- 39. Seguridad, datos y frontera de confianza ---------- */
ul.sg-l{list-style:none;margin:0 0 18px;padding:0;display:grid;gap:1px;
  border:1px solid var(--linea);border-radius:var(--r-2);overflow:hidden}
ul.sg-l > li{display:flex;justify-content:space-between;align-items:baseline;gap:14px;
  padding:10px 14px;background:var(--lienzo)}
ul.sg-l > li:nth-child(even){background:var(--lienzo-2)}
ul.sg-l b{font-size:13.5px;color:var(--tinta);font-weight:400}
ul.sg-l span{font-family:var(--f-num);font-size:10.5px;color:var(--tinta-2);
  font-variant-numeric:tabular-nums;flex:none}
.sg-nunca{border:1px solid var(--ok-bd);background:var(--ok-bg);border-radius:var(--r-2);
  padding:14px 16px;margin-bottom:16px}
.sg-nunca b{display:block;font-size:13.5px;color:var(--ok);margin-bottom:8px}
.sg-nunca ul{list-style:none;margin:0;padding:0;display:grid;gap:5px}
.sg-nunca li{display:flex;align-items:center;gap:7px;font-size:12.5px;color:var(--tinta-2)}
.sg-nunca svg{width:13px;height:13px;color:var(--ok);flex:none}
.btn.sg-borrar{border-color:var(--crit-bd);color:var(--crit)}
.btn.sg-borrar:hover{background:var(--crit);border-color:var(--crit);color:var(--sobre-crit)}

.sg-fr{border:1px solid var(--ok-bd);background:var(--ok-bg);border-radius:var(--r-2);
  padding:15px 17px;margin-bottom:13px}
.sg-fr > b{display:block;font-size:14px;color:var(--ok);margin-bottom:9px}
.sg-fr ul{list-style:none;margin:0;padding:0;display:grid;gap:7px}
.sg-fr li{display:flex;align-items:flex-start;gap:8px;font-size:12.5px;line-height:1.55;
  color:var(--tinta-2)}
.sg-fr svg{width:14px;height:14px;flex:none;margin-top:2px;color:var(--ok)}
.sg-fr.mal{border-color:var(--crit-bd);background:var(--crit-bg)}
.sg-fr.mal > b{color:var(--crit)}
.sg-fr.mal svg{color:var(--crit)}

/* El señuelo: fuera de la vista sin usar display:none ni hidden, que
   los rellenadores automáticos buenos sí saben ignorar. */
.sg-tp{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}

/* Teléfono oculto hasta que se pide */
.tel-ver{align-items:center}
.tel-ver span{display:flex;flex-direction:column;align-items:flex-start;line-height:1.2}
.tel-ver i{font-family:var(--f-num);font-size:9.5px;font-style:normal;letter-spacing:.05em;
  opacity:.85}
.sin-enlace{color:var(--tinta-3)}

/* ---------- 40. Verificación de la dirección ---------- */
.dv-coords{border:1px solid var(--warn-bd);background:var(--warn-bg);border-radius:var(--r-2);
  padding:15px 17px;margin:16px 0}
.dv-coords > b{display:block;font-size:14px;color:var(--warn);margin-bottom:5px}
.dv-coords > p{font-size:13px;line-height:1.55;color:var(--tinta-2);margin:0 0 12px}
/* El rótulo de campo es --tinta-3, calculado para el lienzo. Sobre el
   ámbar de este bloque cae a 4,18:1 y no pasa AA. */
.dv-coords .campo-g label{color:var(--tinta-2)}
.dv-res{border:1px solid var(--linea);border-radius:var(--r-2);padding:15px 17px;margin-top:16px;
  border-left-width:4px}
.dv-res > b{display:block;font-size:15px;margin-bottom:5px}
.dv-res > p{font-size:13px;line-height:1.6;color:var(--tinta-2);margin:0 0 13px}
.dv-res.e-ok{border-color:var(--ok-bd);border-left-color:var(--ok);background:var(--ok-bg)}
.dv-res.e-ok > b{color:var(--ok)}
.dv-res.e-w{border-color:var(--warn-bd);border-left-color:var(--warn);background:var(--warn-bg)}
.dv-res.e-w > b{color:var(--warn)}
.dv-res.e-c{border-color:var(--crit-bd);border-left-color:var(--crit);background:var(--crit-bg)}
.dv-res.e-c > b{color:var(--crit)}
ul.dv-pasos{list-style:none;margin:0;padding:0;display:grid;gap:6px}
ul.dv-pasos > li{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--tinta-2)}
ul.dv-pasos svg{width:14px;height:14px;flex:none}
ul.dv-pasos li.si svg{color:var(--ok)}
ul.dv-pasos li.no svg{color:var(--crit)}
ul.dv-pasos li.no span{color:var(--tinta)}
ul.dv-pasos i{font-family:var(--f-num);font-size:10.5px;font-style:normal;color:var(--tinta-2);
  border:1px solid var(--linea-2);border-radius:99px;padding:1px 8px;background:var(--lienzo)}
#dv-ref{font-family:var(--f-num);letter-spacing:.06em;text-transform:uppercase}
ol.pa-l > li.verificado .pa-n{background:var(--ok);color:var(--lienzo);border-color:var(--ok)}

/* ---------- 41. Páginas y barra de perfil ----------
   El menú deja de anclar a secciones y navega. La pestaña activa se
   marca con aria-current, no con una clase: así lo anuncia el lector
   de pantalla y no hay dos fuentes de verdad. */
nav.top a[aria-current="page"]{color:var(--azul);border-bottom-color:var(--amarillo)}
nav.top a.cap-off{opacity:.45;pointer-events:none}

.perfil-bar{background:var(--azul-9);border-bottom:1px solid rgba(255,255,255,.1)}
.pb-in{display:flex;align-items:center;gap:6px;flex-wrap:wrap;padding:8px 24px;
  max-width:1240px;margin:0 auto}
.pb-lbl{font-family:var(--f-num);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--amarillo);margin-right:8px;flex:none}
.perfil-bar a{position:relative;display:inline-flex;align-items:center;gap:6px;
  font-size:13px;font-weight:600;color:#BDD3E6;text-decoration:none;padding:6px 12px;
  border-radius:99px;border:1px solid transparent}
.perfil-bar a:hover{color:#fff;background:rgba(255,255,255,.08)}
.perfil-bar a[aria-current="page"]{color:var(--sobre-amarillo);background:var(--amarillo);
  border-color:var(--amarillo)}
.perfil-bar a:focus-visible{outline:2.5px solid var(--amarillo);outline-offset:2px}
.perfil-bar a.cap-off{opacity:.55}
.pb-av{min-width:19px;height:19px;padding:0 5px;border-radius:99px;background:var(--crit);
  color:var(--sobre-crit);font-family:var(--f-num);font-size:10.5px;font-weight:700;
  font-style:normal;display:inline-flex;align-items:center;justify-content:center}
.perfil-bar a[aria-current="page"] .pb-av{background:var(--azul-9);color:#fff}
@media (max-width:620px){
  .pb-in{padding:7px 16px;gap:5px}
  .pb-lbl{display:none}
  .perfil-bar a{font-size:12px;padding:5px 10px}
}

/* Encabezado de las páginas de perfil: el panel que antes era una hoja
   lateral necesita un h1 cuando se convierte en página. */
.pg-cab{padding:26px 0 6px}
.pg-cab h1{font-size:clamp(24px,4vw,32px);line-height:1.15;letter-spacing:-.015em;
  color:var(--tinta);margin:0}
#pg-perfil{padding:0 0 44px}
#pg-perfil .h-sec{margin-top:14px}
#pg-perfil .h-sec > h4{margin-top:0}

/* Un bloque oculto por el enrutador no debe dejar hueco ni foco. */
[hidden]{display:none !important}

/* ---------- 42. Histórico de precio y paginación ----------
   content-visibility es la mitad de la respuesta a la escala: el
   navegador no maqueta una ficha que está fuera de la ventana. La otra
   mitad es la paginación, que evita crear el nodo. Sin contain-intrinsic-size
   la barra de desplazamiento salta al desplazarse, así que se le da la
   altura aproximada de una tarjeta. */
.rejilla > .tar{content-visibility:auto;contain-intrinsic-size:auto 420px}
.res-mas{display:flex;justify-content:center;padding:26px 0 4px}
.res-mas .btn{min-width:min(100%,300px);justify-content:center}

.sp-baja{display:inline-flex;align-items:center;gap:3px;font-family:var(--f-num);
  font-size:10px;font-weight:700;letter-spacing:.02em;color:var(--ok);
  border:1px solid var(--ok-bd);background:var(--ok-bg);border-radius:99px;padding:2px 7px}
.sp-baja svg{width:11px;height:11px}

.pr-cif{display:flex;flex-wrap:wrap;gap:10px 26px;margin-bottom:14px}
.pr-cif span{font-family:var(--f-num);font-size:10.5px;color:var(--tinta-2)}
.pr-cif b{display:block;font-size:19px;font-weight:800;color:var(--tinta);
  font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.pr-cif .baja b{color:var(--ok)}
.pr-g{width:100%;height:auto;display:block;border:1px solid var(--linea);
  border-radius:var(--r-2);background:var(--lienzo-2);padding:4px 0}
.pr-area{fill:var(--azul-bg);stroke:none}
.pr-linea{fill:none;stroke:var(--azul-cl);stroke-width:2.2;stroke-linejoin:round}
.pr-pt{fill:var(--lienzo);stroke:var(--azul-cl);stroke-width:2}
.pr-pt.baja{fill:var(--ok);stroke:var(--ok)}
.pr-pt.fin{fill:var(--azul);stroke:var(--azul)}
.pr-t{font-family:var(--f-num);font-size:9.5px;fill:var(--tinta-2)}
.pr-t.fin{text-anchor:end}

/* ---------- 43. Anuncios importados sin verificar ----------
   El estado tiene que verse sin abrir la ficha, y no puede parecerse
   al sello de verificado: si los dos distintivos se confunden, el
   sello deja de valer para los que sí lo tienen. */
.sello.pend{background:var(--warn-bg);color:var(--warn);border-color:var(--warn-bd)}
.sin-ver{display:inline-flex;align-items:center;gap:4px;font-family:var(--f-num);
  font-size:9.5px;font-weight:700;letter-spacing:.04em;color:var(--warn);
  border:1px solid var(--warn-bd);background:var(--warn-bg);border-radius:99px;padding:2px 8px}
.sin-ver svg{width:11px;height:11px}
.ener.sin{background:var(--fondo-2);color:var(--tinta-2);border:1px dashed var(--linea-2)}
.ener.sin i{display:none}

.h-sec.imp{border-left:4px solid var(--warn);background:var(--warn-bg);
  border-radius:0 var(--r-2) var(--r-2) 0;padding:18px 20px}
.h-sec.imp > h4{margin-top:0;color:var(--warn)}
.h-sec.imp > h4::after{background:var(--warn-bd)}
.imp-p{font-size:13.5px;line-height:1.6;color:var(--tinta-2);margin:0 0 12px}
.imp-falta{list-style:none;margin:0 0 14px;padding:0;display:grid;gap:6px}
.imp-falta li{display:flex;align-items:center;gap:7px;font-size:13px;color:var(--tinta-2)}
.imp-falta svg{width:13px;height:13px;color:var(--warn);flex:none}
.imp-datos{display:flex;flex-wrap:wrap;gap:8px 22px;margin-bottom:12px}
.imp-datos span{font-family:var(--f-num);font-size:10.5px;color:var(--tinta-2)}
.imp-datos b{display:block;font-size:15px;font-weight:700;color:var(--tinta);
  font-variant-numeric:tabular-nums}
/* --tinta-3 está calculado para el lienzo; sobre el ámbar de este
   bloque cae a 4,18:1 y no pasa AA a 9,5 px. */
.h-sec.imp .chk-src{color:var(--tinta-2)}

/* ============================================================
   44. TELÉFONO · lo que solo se ve cuando se prueba en uno

   Los bloques anteriores ya adaptaban el ancho. Esto es lo otro: el
   teclado, el pulgar, la muesca y la barra del navegador. Cada regla
   responde a algo medido, no a una precaución.
   ============================================================ */

/* --- 1. El zoom de iOS al enfocar un campo -------------------------
   Safari en iPhone amplía la página entera cuando el campo enfocado
   tiene menos de 16 px, y al salir no la devuelve. Es el fallo más
   visible que tenía la app en móvil: se toca el buscador y el portal
   se descuadra. No hay truco: el campo tiene que medir 16 px.        */
@media (max-width:620px){
  select.ctl, input.ctl, textarea.ctl, .selidi, .ac-cod, .ld-q,
  #q, input[type="search"], input[type="text"], input[type="email"],
  input[type="tel"], input[type="number"], input[type="number"],
  textarea, select{
    font-size:16px;
  }
  /* El selector de idioma cabía a 12 px porque enseña dos letras. A
     16 px necesita algo más de caja. */
  .selidi{width:62px;font-size:16px}
}

/* --- 2. Objetivos táctiles que faltaban --------------------------- */
@media (max-width:620px){
  .cta-b{min-height:44px;min-width:44px;padding:0 13px}
  .marca{min-height:44px;display:inline-flex;align-items:center}
  .tog{min-height:48px}
  .tog-i{width:34px;height:34px;right:5px;font-size:13px}
  .ld-chip{min-height:40px;padding:8px 13px}
  .perfil-bar a{min-height:40px}
  .al-frec button,.cap-sel-b button,.bo-nav button{min-height:44px}
  .cap-otros summary,.cap-otros[open] summary{min-height:48px;
    display:flex;align-items:center}
  .h-gal-nav{width:46px;height:46px}
  .h-gal-nav svg{width:20px;height:20px}
  /* Los enlaces del pie medían 17 px de alto: imposibles de acertar, y
     son los obligatorios (aviso legal, privacidad, canal del DSA). */
  ul.f-legal a, .f-enlace{display:inline-flex;align-items:center;min-height:40px}
  ul.f-legal li{margin-bottom:0}
  footer ul{gap:0}
  /* Las islas de la plancha: La Graciosa medía 63x11 px. Un trazo
     transparente ancho agranda el área sensible sin tocar el dibujo. */
  /* El polígono visible lleva su stroke como atributo en línea y la
     hoja de estilos no lo puede pisar. La capa .isla-h existe justo
     para recibir el puntero: se le da un trazo transparente y ancho,
     que no dibuja y sí amplía el área sensible. La Graciosa pasa de
     63x11 a un objetivo cómodo. */
  #plancha .isla-toque{r:26}
}

/* --- 3. La hoja lateral, en pantalla de teléfono -------------------
   Medida real: 6.056 px de alto dentro de una ventana de 1.400. En un
   teléfono eso es una hoja de seis metros con el botón de cerrar
   perdido arriba. El encabezado se queda pegado.                     */
@media (max-width:760px){
  .velo{padding:0}
  /* overflow:hidden en .hoja recorta el redondeo de la galería, pero
     también convierte a .hoja en el contenedor de posicionamiento
     pegajoso — y como no desplaza, el botón de cerrar se iba con el
     resto. En móvil no hay redondeo que recortar. */
  .hoja{border-radius:0;min-height:100%;overflow:visible}
  .h-body > div:first-child, .hoja > .h-body > div:first-child{
    position:sticky; top:0; z-index:3;
    background:var(--lienzo);
    padding:14px 0 12px;
    margin:0 0 4px;
    border-bottom:1px solid var(--linea);
    box-shadow:0 6px 14px -12px rgba(8,20,32,.5);
  }
  /* «Pegajoso» solo se pega dentro de su propio contenedor, y el de
     este botón mide lo que mide la cabecera: unos sesenta píxeles. En
     una hoja de seis mil, el botón desaparecía a los dos dedos de
     desplazamiento. Fijo a la ventana no puede desaparecer. */
  .h-cerrar{
    position:fixed; top:calc(10px + env(safe-area-inset-top));
    right:calc(10px + env(safe-area-inset-right));
    z-index:6; width:44px; height:44px;
    background:var(--lienzo); border:1px solid var(--linea-2);
    box-shadow:0 3px 14px -4px rgba(8,20,32,.35);
  }
  /* El desplazamiento dentro de la hoja no arrastra la página de
     detrás: en móvil eso se nota como un tirón al llegar al final.

     Y el desenfoque se quita, que no es cosmética: un backdrop-filter
     distinto de «none» convierte al elemento en contenedor de
     posicionamiento de sus hijos fijos. Con él, el botón de cerrar
     quedaba anclado al contenido del velo —que sí se desplaza— y se
     iba de la pantalla igual que antes. En móvil la hoja ocupa todo,
     así que no hay fondo que desenfocar. */
  .velo{
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
  }
}

/* --- 4. La barra del navegador y la muesca ------------------------
   100vh en un móvil incluye la barra de direcciones que va y viene, así
   que el último trozo queda debajo de ella. dvh mide lo que de verdad
   se ve. Y con viewport-fit=cover hay que devolver a mano el hueco de
   la muesca y del indicador de inicio.                               */
@supports (height: 100dvh){
  .velo{min-height:100dvh}
}
@media (max-width:760px){
  .velo{
    padding-top:env(safe-area-inset-top);
    padding-bottom:env(safe-area-inset-bottom);
  }
  footer{padding-bottom:calc(30px + env(safe-area-inset-bottom))}
  .fab{bottom:calc(12px + env(safe-area-inset-bottom))}
  .pb-in{
    padding-left:max(16px, env(safe-area-inset-left));
    padding-right:max(16px, env(safe-area-inset-right));
  }
  header .wrap, main .wrap, footer .wrap{
    padding-left:max(16px, env(safe-area-inset-left));
    padding-right:max(16px, env(safe-area-inset-right));
  }
}

/* --- 5. Teléfono en horizontal ------------------------------------
   Poca altura y mucho ancho: el hero a pantalla completa deja los
   resultados fuera de la vista, y el usuario cree que no hay nada.   */
@media (max-height:520px) and (orientation:landscape){
  .hero{padding:22px 0 18px}
  .hero h1, #hero-h1{font-size:26px}
  .tesis{display:none}
  .velo{padding:0}
}

/* --- 6. Detalles de tacto ----------------------------------------- */
@media (hover:none){
  /* Sin ratón no hay hover: lo que se ilumina al pasar por encima se
     queda iluminado tras el toque. Se sustituye por el estado activo. */
  .tar:hover{transform:none}
  .cap[data-cap]:active{background:var(--azul-bg)}
  .btn:active,.btn-s:active{transform:translateY(1px)}
  a,button{-webkit-tap-highlight-color:rgba(10,75,140,.14)}
}

/* ---------- 45. Sello de vigencia de un dato oficial ---------- */
.vig-sello{display:flex;flex-wrap:wrap;align-items:flex-start;gap:11px;
  border:1px solid var(--linea);border-radius:var(--r-2);background:var(--lienzo-2);
  padding:13px 16px;margin-bottom:18px}
.vig-p{width:9px;height:9px;border-radius:99px;flex:none;margin-top:6px;background:var(--ok)}
.vig-p.cerca{background:var(--warn)}
.vig-p.vieja{background:var(--crit)}
.vig-tx{display:flex;flex-direction:column;gap:1px;min-width:0;flex:1}
.vig-tx b{font-size:13.5px;color:var(--tinta)}
.vig-tx span{font-family:var(--f-num);font-size:10.5px;color:var(--tinta-2)}
.vig-prox{color:var(--tinta-3) !important}
.vig-nota{flex:1 1 100%;margin:0;font-size:12px;line-height:1.5;color:var(--tinta-2);
  border-top:1px solid var(--linea);padding-top:9px}

/* ---------- 46. Régimen fiscal e impagos ---------- */
.fa-fis{border:1px solid var(--linea);border-radius:var(--r-2);background:var(--lienzo-2);
  padding:15px 17px;margin-top:16px}
.fa-fis > .lbl{display:block;font-family:var(--f-num);font-size:9.5px;letter-spacing:.11em;
  text-transform:uppercase;color:var(--tinta-3);margin-bottom:9px}
.fa-zonas{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:11px}
.fa-zonas button{border:1px solid var(--linea-2);border-radius:99px;background:var(--lienzo);
  padding:8px 13px;font-size:12.5px;color:var(--tinta-2);cursor:pointer}
.fa-zonas button[aria-checked="true"]{border-color:var(--azul);background:var(--azul);
  color:var(--sobre-azul)}
.fa-zonas button:focus-visible{outline:2.5px solid var(--foco);outline-offset:2px}
.fa-fis .campo-g{margin-top:10px}

.fa-imp{margin-top:16px;border:1px solid var(--linea);border-radius:var(--r-2);
  background:var(--lienzo)}
.fa-imp summary{list-style:none;cursor:pointer;padding:14px 17px;font-size:14.5px;
  font-weight:700;color:var(--tinta);display:flex;align-items:center;gap:10px;min-height:48px}
.fa-imp summary::-webkit-details-marker{display:none}
.fa-imp summary::before{content:"+";font-family:var(--f-num);color:var(--azul);font-weight:700}
.fa-imp[open] summary::before{content:"–"}
.fa-imp summary:focus-visible{outline:2.5px solid var(--foco);outline-offset:-3px}
ol.fa-imp-l{list-style:none;margin:0;padding:0 17px 8px}
ol.fa-imp-l > li{display:grid;grid-template-columns:auto 1fr auto;gap:4px 10px;
  align-items:baseline;padding:11px 0;border-top:1px solid var(--linea)}
.fa-imp-d{font-family:var(--f-num);font-size:10.5px;color:var(--tinta-3);
  font-variant-numeric:tabular-nums}
ol.fa-imp-l b{font-size:14px;color:var(--tinta)}
.fa-imp-a{font-family:var(--f-num);font-size:9px;letter-spacing:.06em;text-transform:uppercase;
  border-radius:99px;padding:3px 8px;border:1px solid var(--ok-bd);background:var(--ok-bg);
  color:var(--ok);white-space:nowrap}
.fa-imp-a.e-sin_subir{border-color:var(--warn-bd);background:var(--warn-bg);color:var(--warn)}
.fa-imp-a.e-ocultos{border-color:var(--crit-bd);background:var(--crit-bg);color:var(--crit)}
ol.fa-imp-l p{grid-column:1/-1;margin:0;font-size:12.5px;line-height:1.5;color:var(--tinta-2)}
.fa-imp .chk-src{padding:0 17px 15px;margin:0}
@media (max-width:520px){
  ol.fa-imp-l > li{grid-template-columns:1fr}
  .fa-imp-a{justify-self:start}
}
.fa-t .fa-base th,.fa-t .fa-base td{border-top:1px solid var(--linea);
  color:var(--tinta);font-weight:600}

/* ---------- 47. Zona fiscal deducida, no declarada ---------- */
.fa-docs{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:12px 0 4px}
.fa-docs .ctl{font-family:var(--f-num);letter-spacing:.04em;text-transform:uppercase}
.fa-docs .ctl.mal{border-color:var(--crit-bd);background:var(--crit-bg)}
.campo-n{margin:5px 0 0;font-size:11.5px;line-height:1.45;color:var(--tinta-3)}
.campo-n.mal{color:var(--crit);font-weight:600}
.fa-ded{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap;margin:10px 0 0;
  padding:11px 13px;border-radius:9px;border:1px solid var(--ok-bd);background:var(--ok-bg)}
.fa-ded b{font-size:14.5px;color:var(--tinta)}
.fa-ded span{font-size:12px;color:var(--tinta-2)}
.fa-ded.f-declarada{border-color:var(--warn-bd);background:var(--warn-bg)}
.fa-conf{margin:10px 0 0;padding:13px;border-radius:9px;
  border:1px solid var(--warn-bd);background:var(--warn-bg)}
.fa-conf p{margin:0 0 11px;font-size:13px;line-height:1.55;color:var(--tinta)}
.fa-conf b{color:var(--warn)}
.fa-decl{margin:12px 0 0;border-top:1px solid var(--linea);padding-top:4px}
.fa-decl summary{list-style:none;cursor:pointer;font-size:12.5px;color:var(--tinta-2);
  padding:10px 0;min-height:44px;display:flex;align-items:center;gap:8px}
.fa-decl summary::-webkit-details-marker{display:none}
.fa-decl summary::before{content:"+";font-family:var(--f-num);color:var(--azul);font-weight:700}
.fa-decl[open] summary::before{content:"–"}
.fa-decl summary:focus-visible{outline:2.5px solid var(--foco);outline-offset:2px}
.fa-decl .chk-src{margin:9px 0 4px}
.bo-fis{margin:10px 0 0;padding:12px 13px;border-radius:9px;
  border:1px solid var(--warn-bd);background:var(--warn-bg)}
.bo-fis > b{display:block;font-size:11px;letter-spacing:.06em;text-transform:uppercase;
  color:var(--warn);margin-bottom:8px}
.bo-fis ul{list-style:none;margin:0 0 9px;padding:0;display:grid;gap:5px}
.bo-fis li{display:flex;justify-content:space-between;gap:12px;align-items:baseline;
  font-size:12.5px;color:var(--tinta-2)}
.bo-fis li b{color:var(--tinta);white-space:nowrap}
.bo-fis p{margin:0;font-size:12px;line-height:1.5;color:var(--tinta-2)}
@media (max-width:620px){
  .fa-docs{grid-template-columns:1fr}
  .bo-fis li{flex-direction:column;gap:1px}
}
