/* ============================================================
   FUENTES SELF-HOSTED · WOFF2, subconjunto latino
   Inter 400/500/600/700 e IBM Plex Mono 400/500: exactamente los pesos
   que el CSS utiliza. Tras retirar el pie corporativo ya no queda ninguna
   regla con font-weight:800. Origen: @fontsource/inter y @fontsource/ibm-plex-mono
   5.3.0 (OFL). Sin peticiones a terceros.
   ============================================================ */
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;
  src:url('../assets/fonts/inter-400.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;
  src:url('../assets/fonts/inter-500.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;
  src:url('../assets/fonts/inter-600.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:700;font-display:swap;
  src:url('../assets/fonts/inter-700.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;
  src:url('../assets/fonts/ibm-plex-mono-400.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;
  src:url('../assets/fonts/ibm-plex-mono-500.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* ============================================================
   ALEU MEDICAL · PILOT GENE — EVIDENCE INTELLIGENCE
   Sistema de diseño (rediseño visual integral)
   Solo presentación: no altera datos ni estructura científica.
   ============================================================ */
:root{
  /* ---- Paleta Aleu (especificación §40) ---- */
  --aleu-teal:#20979F;      --aleu-teal-dark:#127880;  --aleu-teal-soft:#EAF7F7;
  --aleu-navy:#103D4B;      --aleu-navy-2:#174E5D;
  --aleu-mint:#DFF4F1;      --aleu-bg:#FBFCFC;         --aleu-bg-alt:#F6F9F9;
  --aleu-border:#DCE7E9;    --aleu-border-soft:#E9EFF0;
  --aleu-text:#1F3842;      --aleu-body:#435A63;       --aleu-muted:#71858C;
  --aleu-warning:#C9782C;   --aleu-danger:#B95E61;
  --aleu-white:#FFFFFF;
  --aleu-warning-bg:#FDF6EE; --aleu-warning-bd:#F0DFC9;
  --aleu-danger-bg:#FBF1F1;  --aleu-danger-bd:#EED8D9;

  /* ---- Métrica ---- */
  --container-wide:1280px; --container-main:1180px; --container-reading:760px;
  --pad-desktop:32px; --pad-mobile:18px;
  --r-xs:4px; --r-sm:6px; --r-md:8px; --r-lg:12px; --r-pill:999px;
  --ease:cubic-bezier(.22,1,.36,1);
  --dur-fast:160ms; --dur-ui:240ms;

  /* ---- Tipografía (§41: Inter dominante, sin serif como identidad) ---- */
  --sans:"Inter","Helvetica Neue",Arial,system-ui,sans-serif;
  /* --display: cara de titulares. Cambiar aquí (p. ej. a "Newsreader",Georgia,serif)
     si algún día se quiere una identidad editorial con serif. */
  --display:"Inter","Helvetica Neue",Arial,system-ui,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,monospace;

  /* ---- Sombra (§42: muy suaves) ---- */
  --shadow-card:0 2px 12px rgba(31,70,80,.045);
  --shadow-lift:0 6px 20px rgba(31,70,80,.075);

  /* ---- Remapeo de los tokens heredados sobre la paleta nueva ----
     (los renderizadores de bloques usan estos nombres; se conservan) */
  --ink:var(--aleu-text); --ink2:var(--aleu-navy);
  --paper:var(--aleu-bg-alt); --bg:var(--aleu-white); --line:var(--aleu-border-soft);
  --ddpcr:var(--aleu-teal); --drop:var(--aleu-teal-dark);
  --good:var(--aleu-teal); --warn:var(--aleu-warning); --bad:var(--aleu-danger);
  --slate2:var(--aleu-muted); --muted:var(--aleu-body); --muted2:var(--aleu-muted);
  --serif:var(--display);
  --r:var(--r-md);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{max-width:100%;overflow-x:hidden}
body{margin:0;background:var(--aleu-white);color:var(--aleu-text);font-family:var(--sans);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;font-size:15px;line-height:1.6}
img{max-width:100%;display:block}
canvas,img,svg,video{max-width:100%}
a{color:var(--aleu-teal-dark)}
.italic{font-style:italic}
.mono{font-family:var(--mono)}
.strong{font-weight:600}
.accent{color:var(--aleu-teal-dark)}
.muted{color:var(--aleu-muted)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0,0,0,0);white-space:nowrap;border:0}
:focus-visible{outline:2px solid var(--aleu-teal);outline-offset:2px;border-radius:var(--r-xs)}
/* --- accesibilidad Fase 1: los nuevos botones semánticos no deben cambiar de aspecto --- */
#exploradorScreen .opt{appearance:none;-webkit-appearance:none;margin:0;font:inherit;color:inherit}
#exploradorScreen .opt:focus-visible{outline:2px solid var(--aleu-teal);outline-offset:-2px}
.chips-active .tag .tag-x{appearance:none;background:none;border:0;padding:0 0 0 2px;margin:0;
  font:inherit;color:inherit;cursor:pointer;line-height:1}
.chips-active .tag .tag-x:focus-visible{outline:2px solid var(--aleu-teal);outline-offset:2px;border-radius:3px}
.tabs .tab:focus-visible{outline:2px solid var(--aleu-teal);outline-offset:-3px}
.sec:focus-visible{outline:2px solid var(--aleu-teal);outline-offset:4px}

.wrap{max-width:var(--container-main);margin:0 auto;padding:0 var(--pad-desktop)}                 /* la barra corporativa se integra en el footer */

.top{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.94);
  backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--aleu-border-soft)}
.top-inner{max-width:var(--container-main);margin:0 auto;padding:0 var(--pad-desktop)}

/* --- nivel 1: marca + estado --- */
.brandrow{display:flex;align-items:center;gap:20px;justify-content:space-between;
  padding:16px 0;flex-wrap:wrap;min-width:0}
.brandL{display:flex;align-items:center;gap:16px;min-width:0}
.brandL img{height:30px;width:auto}
.brandL .divider{width:1px;height:30px;background:var(--aleu-border);display:block}
.brand-id{line-height:1.15;min-width:0}
.brand-id .b1{font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--aleu-muted);font-weight:600}
.brand-id .b2{font-size:13.5px;letter-spacing:.13em;text-transform:uppercase;
  color:var(--aleu-navy);font-weight:600}

.controls{display:flex;align-items:center;gap:10px;flex-wrap:wrap;min-width:0;flex:1 1 auto;justify-content:flex-end}
.pill{display:inline-flex;align-items:center;height:32px;padding:0 13px;border-radius:var(--r-sm);
  font-size:11.5px;font-weight:600;letter-spacing:.04em;border:1px solid var(--aleu-border);
  color:var(--aleu-body);background:#fff;white-space:nowrap}
.pill.lic,.pill.n{font-family:var(--mono);font-size:11px;font-weight:500}

/* --- nivel 2: navegación numerada --- */
.navrow{display:flex;align-items:center;gap:8px;justify-content:space-between;
  border-top:1px solid var(--aleu-border-soft);flex-wrap:wrap}
.mainnav{display:flex;align-items:stretch;gap:4px;overflow-x:auto;scrollbar-width:none;flex:1 1 auto}
.mainnav::-webkit-scrollbar{display:none}
.navlink{display:inline-flex;align-items:center;gap:8px;background:none;border:0;cursor:pointer;
  font-family:var(--sans);font-size:13.5px;color:var(--aleu-body);padding:15px 14px;
  border-bottom:2px solid transparent;white-space:nowrap;transition:color var(--dur-fast) var(--ease)}
.navlink:hover{color:var(--aleu-navy)}
.navlink.active{color:var(--aleu-navy);font-weight:600;border-bottom-color:var(--aleu-teal)}
/* entrada de solo icono (lupa -> explorador) */
.navlink.solo-icono{padding:13px 13px}
.navlink.solo-icono svg{width:19px;height:19px;stroke:currentColor;fill:none;stroke-width:1.9;
  stroke-linecap:round;display:block}
.navlink.solo-icono:hover{color:var(--aleu-teal-dark)}
.navlink.solo-icono.active{color:var(--aleu-teal-dark)}
.navcta{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 15px;flex:0 0 auto;
  border:1px solid var(--aleu-border);border-radius:var(--r-sm);background:#fff;cursor:pointer;
  font-family:var(--sans);font-size:12.5px;font-weight:600;color:var(--aleu-navy);
  transition:all var(--dur-fast) var(--ease);margin:8px 0}
.navcta:hover{border-color:var(--aleu-teal);color:var(--aleu-teal-dark);
  box-shadow:0 2px 8px rgba(32,151,159,.12);transform:translateY(-1px)}
.navcta svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.7}

/* barra de validación */
#valbar{display:none;background:var(--aleu-warning-bg);border-bottom:1px solid var(--aleu-warning-bd);
  color:#8A5418;font-size:12.5px;padding:9px var(--pad-desktop);font-family:var(--mono)}

/* ============================================================
   2 · PORTADA
   ============================================================ */
#indexScreen{padding:0 0 20px}

/* --- hero editorial --- */
.pf-hero{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center;
  padding:76px 0 66px}
.pf-hero h1{font-family:var(--display);font-size:46px;line-height:1.13;letter-spacing:-.025em;
  font-weight:600;color:var(--aleu-navy);margin:0 0 22px}
.pf-hero p.lede{font-size:16px;line-height:1.7;color:var(--aleu-body);margin:0;max-width:46ch}
.pf-statbox{background:var(--aleu-bg-alt);border:1px solid var(--aleu-border-soft);
  border-radius:var(--r-lg);padding:34px 30px;display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.pf-stat .si{width:46px;height:46px;border-radius:var(--r-md);border:1px solid var(--aleu-border);
  background:#fff;display:grid;place-items:center;margin-bottom:18px}
.pf-stat .si svg{width:22px;height:22px;stroke:var(--aleu-teal-dark);fill:none;stroke-width:1.6;
  stroke-linecap:round;stroke-linejoin:round}
.pf-stat .sv{font-family:var(--display);font-size:15.5px;font-weight:600;color:var(--aleu-navy);
  line-height:1.3;margin-bottom:4px}
.pf-stat .sl{font-size:12.5px;color:var(--aleu-muted);line-height:1.45}

/* --- últimas publicaciones --- */
.pf-latest{background:var(--aleu-bg-alt);border:1px solid var(--aleu-border-soft);
  border-radius:var(--r-lg);padding:38px 34px 42px;margin:8px 0 64px;position:relative;overflow:hidden}
.pf-latest-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;
  flex-wrap:wrap;margin-bottom:26px}
.pf-k{font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--aleu-teal-dark);
  font-weight:600;margin-bottom:10px}
.pf-latest h2{font-family:var(--display);font-size:28px;font-weight:600;letter-spacing:-.02em;
  color:var(--aleu-navy);margin:0 0 8px}
.pf-latest .sub{font-size:14px;color:var(--aleu-body);margin:0}
/* Todas las novedades comparten ancho: la regla anterior daba 1,25fr a la
   primera tarjeta, lo que la hacía visiblemente distinta del resto. Con
   minmax(206px) caben cuatro en una sola fila dentro del contenedor de
   1.116 px, y la tarjeta se compacta para no crecer en alto. */
.pf-latest-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(206px,1fr));
  gap:14px;align-items:stretch}
.lp{background:#fff;border:1px solid var(--aleu-border-soft);border-radius:var(--r-md);
  padding:16px 16px 14px;display:flex;flex-direction:column;text-align:left;cursor:pointer;
  font-family:var(--sans);transition:box-shadow var(--dur-ui) var(--ease),transform var(--dur-ui) var(--ease),border-color var(--dur-ui) var(--ease)}
.lp:hover{box-shadow:var(--shadow-lift);transform:translateY(-2px);border-color:var(--aleu-border)}
.lp.feat{border-left:3px solid var(--aleu-teal)}
.lp-badge{display:inline-flex;align-items:center;height:19px;padding:0 8px;border-radius:var(--r-pill);
  background:var(--aleu-teal);color:#fff;font-size:9px;font-weight:700;letter-spacing:.1em;
  text-transform:uppercase;align-self:flex-start;margin-bottom:12px}
.lp-row{display:flex;gap:12px;align-items:flex-start}
.lp-year{font-family:var(--display);font-size:26px;font-weight:600;color:var(--aleu-teal-dark);
  line-height:1;letter-spacing:-.03em;flex:0 0 auto}
.lp.feat .lp-year{font-size:26px}
.lp-name{font-family:var(--display);font-size:15px;font-weight:600;color:var(--aleu-navy);
  letter-spacing:-.015em;margin:0 0 5px;line-height:1.28}
.lp-sub{font-size:11px;color:var(--aleu-muted);line-height:1.45;margin:0 0 11px}
.lp-blurb{font-size:12px;line-height:1.55;color:var(--aleu-body);margin:0 0 14px;flex:1 1 auto}
.lp-foot{display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  border-top:1px solid var(--aleu-border-soft);padding-top:11px;margin-top:auto}
.lp-meta{display:inline-flex;align-items:center;gap:5px;font-size:10.5px;color:var(--aleu-muted)}
.lp-meta svg{width:13px;height:13px;stroke:var(--aleu-muted);fill:none;stroke-width:1.6}
.lp-go{margin-left:auto;font-size:11.5px;font-weight:600;color:var(--aleu-teal-dark);white-space:nowrap}
.lp:hover .lp-go{text-decoration:underline;text-underline-offset:3px}
@media(max-width:1024px){
  .pf-latest-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:560px){
  .pf-latest-grid{grid-template-columns:minmax(0,1fr)}
}
.pf-all{font-size:13px;font-weight:600;color:var(--aleu-teal-dark);background:none;border:0;
  cursor:pointer;font-family:var(--sans);padding:4px 0;text-decoration:underline;text-underline-offset:4px}

/* --- índice --- */
.pf-idx-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;
  flex-wrap:wrap;margin-bottom:28px}
.pf-idx-head h2{font-family:var(--display);font-size:28px;font-weight:600;letter-spacing:-.02em;
  color:var(--aleu-navy);margin:0 0 7px}
.pf-idx-head p{font-size:14px;color:var(--aleu-body);margin:0}

.idx-group{margin-bottom:40px}
.idx-gtitle{font-size:10.5px;letter-spacing:.15em;text-transform:uppercase;font-weight:600;
  color:var(--aleu-muted);padding-bottom:12px;margin-bottom:22px;
  border-bottom:1px solid var(--aleu-border-soft);display:flex;align-items:center;gap:12px}
.idx-gtitle .gcount{font-family:var(--mono);color:var(--aleu-teal-dark);letter-spacing:0}
.idx-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.idx-card{background:#fff;border:1px solid var(--aleu-border-soft);border-radius:var(--r-md);
  padding:24px 22px 18px;text-align:left;cursor:pointer;font-family:var(--sans);
  display:flex;flex-direction:column;
  transition:box-shadow var(--dur-ui) var(--ease),transform var(--dur-ui) var(--ease),border-color var(--dur-ui) var(--ease)}
.idx-card:hover{box-shadow:var(--shadow-lift);transform:translateY(-2px);border-color:var(--aleu-border)}
.idx-cardtop{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:20px}
.idx-ico{width:44px;height:44px;border-radius:var(--r-pill);background:var(--aleu-teal-soft);
  display:grid;place-items:center;flex:0 0 auto}
.idx-ico svg{width:21px;height:21px;stroke:var(--aleu-teal-dark);fill:none;stroke-width:1.55;
  stroke-linecap:round;stroke-linejoin:round}
.idx-sub2{font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--aleu-muted);
  margin-bottom:7px;line-height:1.45}
.idx-name{font-family:var(--display);font-size:18px;font-weight:600;letter-spacing:-.015em;
  color:var(--aleu-navy);margin-bottom:9px;line-height:1.25}
.idx-blurb{font-size:13px;line-height:1.62;color:var(--aleu-body);margin:0 0 18px;flex:1 1 auto}
.idx-meta{display:flex;align-items:center;gap:14px;border-top:1px solid var(--aleu-border-soft);
  padding-top:14px;margin-top:auto}
.idx-chip{font-family:var(--mono);font-size:11.5px;color:var(--aleu-muted)}
.idx-go{margin-left:auto;font-size:12.5px;font-weight:600;color:var(--aleu-teal-dark);white-space:nowrap}
.idx-card:hover .idx-go{text-decoration:underline;text-underline-offset:3px}

/* ============================================================
   3 · SHELL DE FICHA DE ARTÍCULO
   ============================================================ */
.art-shell{display:none;padding:0 0 20px}
.art-shell.on{display:block}
.art-head{padding:44px 0 26px;border-bottom:1px solid var(--aleu-border-soft)}
.art-crumb{display:flex;align-items:center;gap:9px;font-size:12px;color:var(--aleu-muted);
  margin-bottom:20px;flex-wrap:wrap}
.art-crumb button{background:none;border:0;padding:0;cursor:pointer;font-family:var(--sans);
  font-size:12px;color:var(--aleu-teal-dark);font-weight:600}
.art-crumb button:hover{text-decoration:underline;text-underline-offset:3px}
.art-crumb .sep{color:var(--aleu-border)}
.art-headgrid{display:grid;grid-template-columns:1fr auto;gap:32px;align-items:end}
.art-h1{font-family:var(--display);font-size:38px;font-weight:600;letter-spacing:-.025em;
  color:var(--aleu-navy);margin:0 0 10px;line-height:1.14}
.art-sub{font-size:11px;letter-spacing:.11em;text-transform:uppercase;color:var(--aleu-muted);
  margin:0 0 18px}
.art-chips{display:flex;gap:8px;flex-wrap:wrap}
.mchip{display:inline-flex;align-items:center;gap:7px;height:28px;padding:0 11px;
  border:1px solid var(--aleu-border-soft);border-radius:var(--r-sm);background:var(--aleu-bg-alt);
  font-size:11.5px;color:var(--aleu-body)}
.mchip b{font-weight:600;color:var(--aleu-navy)}
.mchip.nlong{background:#fff;border-color:var(--aleu-border);height:auto;min-height:28px;
  padding:5px 12px;line-height:1.4;white-space:normal}
.mchip.nlong b{font-family:var(--mono);font-size:11px;color:var(--aleu-muted);font-weight:500}
.art-aux{text-align:right}
.art-aux .aux-n{font-family:var(--display);font-size:34px;font-weight:600;color:var(--aleu-teal-dark);
  line-height:1;letter-spacing:-.02em}
.art-aux .aux-l{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--aleu-muted);
  margin-top:7px}

/* pestañas originales (generadas desde article.sections) */
/* --- barra de secciones: contenedor con desplazamiento visible ----------
   Las pestañas desbordan cuando el artículo tiene muchas secciones. Antes el
   desplazamiento existía pero estaba oculto (scrollbar-width:none), sin
   ninguna pista visual. Ahora: barra fina siempre visible + botones para
   saltar a cada extremo, que solo aparecen si realmente hay desbordamiento.
   El `sticky` pasa del <nav> al contenedor para que los botones lo acompañen. */
.tabsbar{position:sticky;top:0;z-index:30;background:#fff;display:flex;align-items:stretch;
  border-bottom:1px solid var(--aleu-border-soft)}
.tabs{display:flex;gap:2px;overflow-x:auto;-webkit-overflow-scrolling:touch;
  flex:1 1 auto;min-width:0;background:#fff;
  scrollbar-width:thin;scrollbar-color:var(--aleu-border) transparent;
  scroll-behavior:smooth}
.tabs::-webkit-scrollbar{height:6px}
.tabs::-webkit-scrollbar-track{background:transparent}
.tabs::-webkit-scrollbar-thumb{background:var(--aleu-border);border-radius:var(--r-pill)}
.tabs::-webkit-scrollbar-thumb:hover{background:var(--aleu-teal)}
.tabsnav{flex:0 0 auto;width:34px;border:0;background:#fff;cursor:pointer;padding:0;
  display:flex;align-items:center;justify-content:center;color:var(--aleu-muted);
  transition:color var(--dur-fast) var(--ease)}
.tabsnav[hidden]{display:none}
.tabsnav:hover{color:var(--aleu-teal-dark)}
.tabsnav:focus-visible{outline:2px solid var(--aleu-teal);outline-offset:-3px}
.tabsnav svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:2;
  stroke-linecap:round;stroke-linejoin:round}
/* velo para que las pestañas no se corten en seco bajo los botones */
.tabsnav.prev{box-shadow:8px 0 10px -6px rgba(16,61,75,.14)}
.tabsnav.next{box-shadow:-8px 0 10px -6px rgba(16,61,75,.14)}
@media(prefers-reduced-motion:reduce){.tabs{scroll-behavior:auto}}
.tab{background:none;border:0;cursor:pointer;font-family:var(--sans);font-size:13.5px;
  color:var(--aleu-body);padding:15px 15px;display:inline-flex;align-items:center;gap:9px;
  border-bottom:2px solid transparent;white-space:nowrap;transition:color var(--dur-fast) var(--ease)}
.tab .tnum{font-family:var(--mono);font-size:10.5px;color:var(--aleu-muted);font-weight:500}
.tab:hover{color:var(--aleu-navy)}
.tab:hover .tnum{color:var(--aleu-teal)}
.tab.active{color:var(--aleu-navy);font-weight:600;border-bottom-color:var(--aleu-teal)}
.tab.active .tnum{color:var(--aleu-teal)}

/* rejilla 70/30 */
.art-grid{padding-top:34px}
/* secciones distintas de Resumen: sin ficha rápida */
.art-shell.sinsb .article-sidebar{display:none}
.art-body{min-width:0}
.sec-title{font-family:var(--display);font-size:23px;font-weight:600;letter-spacing:-.02em;
  color:var(--aleu-navy);margin:0 0 4px;line-height:1.25}
.sec-kicker{font-family:var(--mono);font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;
  color:var(--aleu-teal-dark);margin-bottom:9px}
.sec-head{padding-bottom:22px;margin-bottom:6px;border-bottom:1px solid var(--aleu-border-soft)}

/* ficha rápida — panel blanco con barra de acento Aleu (§33-34: auxiliar).
   Solo se muestra en la sección de Resumen; el cuerpo va siempre a ancho completo. */
.article-sidebar{margin:0 0 28px}
.sb-card{background:#fff;border:1px solid var(--aleu-border-soft);
  border-top:3px solid var(--aleu-teal);border-radius:var(--r-md);
  padding:24px 26px;box-shadow:var(--shadow-card)}
.sb-card h4{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;
  color:var(--aleu-teal-dark);margin:0 0 0;padding-bottom:13px;
  border-bottom:1px solid var(--aleu-border-soft)}

/* ---- Ficha rápida vertical (una sola columna) --------------------------
   La columna del hero mide ~418 px (.75fr de 1.25fr/.75fr sobre 1.180 px),
   es decir ~358 px útiles tras el padding. La rejilla anterior pedía
   auto-fit minmax(124px,1fr), lo que forzaba dos columnas de ~168 px y
   partía palabras largas. En vertical cada valor dispone del ancho completo.
   Solo presentación: los campos y sus valores son los mismos. ---------- */
.sb-lead{padding:16px 0 14px;border-bottom:1px solid var(--aleu-border-soft)}
.sb-n{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap}
.sb-n .num{font-family:var(--display);font-size:34px;font-weight:600;line-height:1;
  letter-spacing:-.03em;color:var(--aleu-navy);font-variant-numeric:tabular-nums}
.sb-n .unit{font-size:12.5px;color:var(--aleu-body)}
.sb-meta{font-size:12px;color:var(--aleu-muted);margin-top:7px}
.sb-row{padding:13px 0;border-bottom:1px solid var(--aleu-border-soft)}
.sb-row:last-child{border-bottom:0;padding-bottom:0}
.sb-row .k{display:block;font-size:10px;letter-spacing:.11em;text-transform:uppercase;
  font-weight:600;color:var(--aleu-teal-dark);margin-bottom:6px;line-height:1.4}
.sb-row .v{display:block;font-size:13.5px;font-weight:500;color:var(--aleu-text);
  line-height:1.5;overflow-wrap:break-word}
.sb-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:2px}
.sb-chips .chip{height:26px;padding:0 11px}

/* ficha rápida alojada en el hero, en el sitio del campo de gotas.
   La barra azul Aleu es el borde superior del propio hero. */
.hero-side.con-ficha{min-height:0;display:flex}
.hero-side.con-ficha .article-sidebar{margin:0;flex:1 1 auto;display:flex}
.hero-side.con-ficha .sb-card{flex:1 1 auto;border:0;border-radius:0;box-shadow:none;
  background:#fff;padding:30px 30px}
.hero-side.con-ficha .sb-card h4{margin-bottom:0}
@media(max-width:1024px){
  .hero-side.con-ficha{border-left:0;border-top:1px solid var(--aleu-border-soft)}
}
@media(max-width:600px){
  .hero-side.con-ficha .sb-card{padding:24px 22px}
  .sb-n .num{font-size:30px}
}

/* ============================================================
   4 · SECCIONES Y BLOQUES CIENTÍFICOS  (reestilizado, no sustituido)
   ============================================================ */
.sec{display:none}
.sec.active{display:block;animation:fade .34s var(--ease) both}
@keyframes fade{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.sec > * + *{margin-top:20px}

.grid{display:grid;gap:18px}
/* --- §12A · alturas automáticas en filas de dos columnas ----------------
   `display:grid` alinea por defecto con `stretch`, así que en una fila de
   dos columnas el bloque con poco texto se estiraba hasta la altura del
   vecino y dejaba una gran zona vacía al pie (Rapszky 03, Liu 2024
   búsqueda, Shao 02 y 03, Lin K 2023 antibiótico, Liu W 2023 panel viral,
   Zheng 2021 rendimiento). Cada bloque pasa a medir lo que ocupa.
   Se limita a las variantes de dos columnas: en las filas de tres o cuatro
   fichas la altura igualada sí es deseable, y no se toca. */
.grid.cols-2 > *, .grid.col-32 > *, .grid.col-bias > *{align-self:start}
.cols-1{grid-template-columns:1fr}
.cols-2{grid-template-columns:1fr 1fr}
.cols-3{grid-template-columns:1fr 1fr 1fr}
.cols-4{grid-template-columns:repeat(4,1fr)}
.col-32{grid-template-columns:1.5fr 1fr}

/* --- tarjeta base (§42) --- */
.card{background:#fff;border:1px solid var(--aleu-border-soft);border-radius:var(--r-md);
  padding:24px 22px;box-shadow:var(--shadow-card)}
.p-title{font-family:var(--display);font-size:16.5px;font-weight:600;letter-spacing:-.012em;
  color:var(--aleu-navy);margin:0}
.p-sub{font-size:12.5px;color:var(--aleu-muted);margin:6px 0 0;line-height:1.55}
.cardbody{font-size:14px;line-height:1.72;color:var(--aleu-body);margin:14px 0 0}
.note{font-size:12px;line-height:1.6;color:var(--aleu-muted);margin:14px 0 0;
  padding-top:12px;border-top:1px dashed var(--aleu-border)}
.kicker{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--aleu-teal-dark);font-weight:600}

/* --- hero de sección (§26: superficie clara + línea de acento) --- */
.hero{border-radius:var(--r-md);overflow:hidden;background:var(--aleu-bg-alt);
  border:1px solid var(--aleu-border-soft);border-top:3px solid var(--aleu-teal);
  color:var(--aleu-text);box-shadow:var(--shadow-card)}
.hero-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:0;align-items:stretch}
.hero-main{padding:34px 32px}
.hero-badge{display:inline-flex;align-items:center;gap:9px;font-size:10.5px;letter-spacing:.13em;
  text-transform:uppercase;font-weight:600;color:var(--aleu-teal-dark);margin-bottom:16px}
.hero-badge .dot{width:7px;height:7px;border-radius:50%;background:var(--aleu-teal);
  box-shadow:0 0 0 4px rgba(32,151,159,.14);animation:pulse 2.6s var(--ease) infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.45}}
.hero-title{font-family:var(--display);font-size:27px;font-weight:600;letter-spacing:-.022em;
  color:var(--aleu-navy);margin:0 0 14px;line-height:1.22}
.hero-body{font-size:14.5px;line-height:1.72;color:var(--aleu-body);margin:0 0 22px;max-width:56ch}
.hero-cta{display:flex;gap:10px;flex-wrap:wrap}
.hero-side{position:relative;min-height:210px;background:#fff;border-left:1px solid var(--aleu-border-soft)}
.btn{display:inline-flex;align-items:center;gap:8px;height:38px;padding:0 17px;border-radius:var(--r-sm);
  font-family:var(--sans);font-size:13px;font-weight:600;cursor:pointer;border:1px solid transparent;
  transition:all var(--dur-fast) var(--ease)}
.btn-primary{background:var(--aleu-teal);color:#fff}
.btn-primary:hover{background:var(--aleu-teal-dark);transform:translateY(-1px)}
.btn-ghost{background:#fff;color:var(--aleu-navy);border-color:var(--aleu-border)}
.btn-ghost:hover{border-color:var(--aleu-teal);color:var(--aleu-teal-dark);transform:translateY(-1px)}

/* --- KPIs (§25) --- */
.kpi{background:#fff;border:1px solid var(--aleu-border-soft);border-radius:var(--r-md);
  padding:20px 18px;box-shadow:var(--shadow-card);transition:border-color var(--dur-ui) var(--ease)}
.kpi:hover{border-color:var(--aleu-border)}
.kpi-top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.kpi-label{font-size:11.5px;font-weight:600;color:var(--aleu-muted);line-height:1.45;
  border-bottom:1px dashed var(--aleu-border)}
.kpi-icon{width:17px;height:17px;stroke:var(--aleu-teal);fill:none;stroke-width:1.7;flex:0 0 auto;opacity:.85}
.kpi-val{font-family:var(--display);font-size:29px;font-weight:600;letter-spacing:-.028em;
  color:var(--aleu-teal-dark);font-variant-numeric:tabular-nums;margin:12px 0 4px;line-height:1.05}
.kpi-sub{font-size:11.5px;color:var(--aleu-muted);line-height:1.5}
.tip{position:relative;cursor:help}
.tipbox{position:absolute;left:0;top:calc(100% + 9px);width:230px;background:var(--aleu-navy);color:#fff;
  font-size:11.5px;font-weight:400;line-height:1.5;padding:11px 13px;border-radius:var(--r-sm);
  opacity:0;pointer-events:none;transition:opacity var(--dur-fast);z-index:40;
  box-shadow:0 14px 32px -16px rgba(16,61,75,.5)}
.tip:hover .tipbox{opacity:1}

/* --- panel de impacto (§27: darkpanel -> superficie clara) --- */
.darkpanel{background:var(--aleu-teal-soft);border:1px solid #CDE8E9;border-left:3px solid var(--aleu-teal);
  border-radius:var(--r-md);padding:26px 24px;color:var(--aleu-text)}
.darkpanel .k{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;
  color:var(--aleu-teal-dark);margin-bottom:12px}
.darkpanel .lead{font-family:var(--display);font-size:20px;font-weight:600;letter-spacing:-.018em;
  color:var(--aleu-navy);line-height:1.35;margin-bottom:12px}
.darkpanel .body{font-size:13.5px;line-height:1.7;color:var(--aleu-body)}

/* --- gráficas (§23: altura garantizada) --- */
.chart-box{position:relative;height:240px;margin-top:18px;width:100%}
.chart-box.tall{height:280px}
/* --- §13 · gráficos circulares ------------------------------------------
   Un donut es cuadrado: en una tarjeta a ancho completo el círculo lo
   limita la altura y sobran ~400 px a cada lado. Se acota el contenedor a
   una medida legible y se centra, y la leyenda pasa al lateral (ver
   `legend.position` en la fábrica de gráficas), de modo que el conjunto
   ocupa el ancho como una banda baja en vez de un círculo perdido.
   No cambia ningún dato, color semántico ni etiqueta. */
.chart-box.is-doughnut{height:212px;max-width:600px;margin-left:auto;margin-right:auto}
@media(max-width:600px){.chart-box.is-doughnut{height:248px}}
@media(max-width:600px){.chart-box{height:220px}.chart-box.tall{height:250px}}
@media(max-width:600px){.chart-box{height:220px}.chart-box.tall{height:250px}}

/* --- gauges --- */
.gaugewrap{display:flex;gap:26px;align-items:center;justify-content:center;flex-wrap:wrap;margin-top:18px}
.gauge{position:relative;width:150px;height:150px;flex:0 0 auto}
.gauge-c{position:absolute;inset:0;display:grid;place-items:center;text-align:center}
.gauge-num{font-family:var(--display);font-weight:600;font-size:23px;color:var(--aleu-navy);
  font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.gauge-lbl{font-family:var(--mono);font-size:9.5px;letter-spacing:.09em;text-transform:uppercase;
  color:var(--aleu-muted);margin-top:2px}
.pairs{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:20px}
.pair{background:var(--aleu-bg-alt);border:1px solid var(--aleu-border-soft);border-radius:var(--r-sm);
  padding:14px 15px;text-align:center}
.pair-v{font-family:var(--display);font-size:19px;font-weight:600;color:var(--aleu-teal-dark);
  letter-spacing:-.02em}
.pair-l{font-size:11px;color:var(--aleu-muted);margin-top:5px;line-height:1.45}

/* --- statcards --- */
.statcard{border-radius:var(--r-md);padding:24px 22px;border:1px solid var(--aleu-border-soft);
  background:#fff;box-shadow:var(--shadow-card)}
.statcard.dark{background:var(--aleu-navy);border-color:var(--aleu-navy);color:#fff}
.statcard.blue{background:var(--aleu-teal-soft);border-color:#CDE8E9}
.sc-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}
.sc-name{font-size:13px;font-weight:600;letter-spacing:.01em}
.statcard.dark .sc-name{color:#fff}
.statcard:not(.dark) .sc-name{color:var(--aleu-navy)}
.sc-tag{font-family:var(--mono);font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;
  padding:3px 8px;border-radius:var(--r-xs);background:rgba(255,255,255,.14);color:#fff}
.statcard:not(.dark) .sc-tag{background:#fff;color:var(--aleu-teal-dark);border:1px solid var(--aleu-border-soft)}
.sc-big{font-family:var(--display);font-size:33px;font-weight:600;letter-spacing:-.03em;line-height:1.05;
  display:flex;align-items:baseline;gap:7px;flex-wrap:wrap}
.statcard.dark .sc-big{color:#fff}
.statcard:not(.dark) .sc-big{color:var(--aleu-teal-dark)}
.sc-big .u{font-size:12.5px;font-weight:500;letter-spacing:0;opacity:.8}
.sc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:20px;
  padding-top:18px;border-top:1px solid rgba(255,255,255,.14)}
.statcard:not(.dark) .sc-grid{border-top-color:var(--aleu-border-soft)}
.sc-cell .v{font-size:15px;font-weight:600;font-variant-numeric:tabular-nums}
.statcard.dark .sc-cell .v{color:#fff}
.statcard:not(.dark) .sc-cell .v{color:var(--aleu-navy)}
.sc-cell .l{font-size:10.5px;margin-top:4px;line-height:1.4;opacity:.72}

/* --- headline --- */
/* --- titular editorial (§PATRÓN 2) ----------------------------------
   Número y frase se leen como una sola unidad; los chips, que contienen
   el desglose del dato (p. ej. «ddPCR ~2,5 h» / «Hemocultivo ~47,5 h»),
   ocupan el ancho completo bajo un filete.
   `grid-column:1/-1` en .chips y .note es lo que impide que inflen la
   columna del número: al ser hijos de la rejilla, sin esa regla caían en
   la columna 1 y la ensanchaban hasta el ancho de los tres chips. */
.headline{background:#fff;border:0;border-top:1px solid var(--aleu-border-soft);
  border-bottom:1px solid var(--aleu-border-soft);border-left:0;border-radius:0;padding:18px 0;
  align-self:start;display:grid;grid-template-columns:auto minmax(0,1fr);
  gap:0 22px;align-items:center}
.hl-k{grid-column:1/-1;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;
  font-weight:600;color:var(--aleu-teal-dark);margin:0 0 12px}
.hl-big{font-family:var(--display);font-size:38px;font-weight:600;letter-spacing:-.03em;
  color:var(--aleu-navy);line-height:1;margin:0;white-space:nowrap}
.hl-text{font-size:14px;line-height:1.6;color:var(--aleu-body);margin:0;min-width:0}
.headline .chips{grid-column:1/-1;margin-top:15px;padding-top:14px;
  border-top:1px dashed var(--aleu-border-soft)}
.headline .note{grid-column:1/-1;margin-top:12px}
@media(max-width:900px){
  .headline{grid-template-columns:minmax(0,1fr);gap:10px 0}
  .hl-big{font-size:30px;white-space:normal}
  .headline .chips{margin-top:5px}
}

/* --- banda de cifras --- */
.band{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--aleu-border-soft);
  border:1px solid var(--aleu-border-soft);border-radius:var(--r-md);overflow:hidden}
.band-item{background:#fff;padding:24px 20px;text-align:center}
.band-big{font-family:var(--display);font-size:29px;font-weight:600;letter-spacing:-.03em;
  color:var(--aleu-teal-dark);line-height:1.1}
.band-text{font-size:12px;line-height:1.55;color:var(--aleu-muted);margin-top:9px}
/* banda de cuatro cifras en una sola fila (desktop) */
.band.b4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:1024px){.band.b4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.band.b4{grid-template-columns:minmax(0,1fr)}}
/* §NORMALIZACIÓN VISUAL · PATRÓN 4 · resto de cardinalidades */
.band.b2{grid-template-columns:repeat(2,minmax(0,1fr))}
.band.b5{grid-template-columns:repeat(5,minmax(0,1fr))}
.band.b6{grid-template-columns:repeat(3,minmax(0,1fr))}
.band-item{padding:18px 16px}
@media(max-width:1024px){
  .band.b5,.band.b6{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:768px){
  .band.b5,.band.b6{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:560px){
  .band.b2,.band.b5,.band.b6{grid-template-columns:minmax(0,1fr)}
}

/* --- chips --- */
.chips{display:flex;gap:8px;flex-wrap:wrap}
.chip{display:inline-flex;align-items:center;height:29px;padding:0 13px;border-radius:var(--r-pill);
  font-size:11.5px;font-weight:500;background:var(--aleu-teal-soft);color:var(--aleu-teal-dark);
  border:1px solid #CDE8E9}
.chip.alt{background:var(--aleu-bg-alt);color:var(--aleu-body);border-color:var(--aleu-border-soft)}
.cmp{width:100%;border-collapse:collapse;font-size:13px;min-width:440px}
.cmp th{text-align:left;font-size:10.5px;letter-spacing:.11em;text-transform:uppercase;font-weight:600;
  color:var(--aleu-muted);padding:0 14px 11px;border-bottom:1px solid var(--aleu-border)}
.cmp td{padding:12px 14px;border-bottom:1px solid var(--aleu-border-soft);color:var(--aleu-body);
  vertical-align:top;line-height:1.55}
.cmp tbody tr:last-child td{border-bottom:0}
.cmp tbody tr:hover td{background:var(--aleu-bg-alt)}
.cmp td.dim,.cmp th.dim{color:var(--aleu-navy);font-weight:600;white-space:nowrap;
  text-align:left;padding:12px 14px;border-bottom:1px solid var(--aleu-border-soft);
  vertical-align:top;line-height:1.55;font-size:13px;letter-spacing:normal;text-transform:none}
.cmp tbody tr:last-child th.dim{border-bottom:0}
.cmp td.good{color:var(--aleu-teal-dark);font-weight:600}
.cmp td.bad{color:var(--aleu-danger);font-weight:600}
.cmp td.warn{color:var(--aleu-warning);font-weight:600}
.cmp td.neutral{color:var(--aleu-body)}

/* --- callout --- */
.callout{display:flex;gap:14px;align-items:flex-start;background:var(--aleu-teal-soft);
  border:1px solid #CDE8E9;border-radius:var(--r-md);padding:18px 20px}
.callout svg{width:19px;height:19px;flex:0 0 auto;margin-top:2px;stroke:var(--aleu-teal-dark);
  fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.callout p{margin:0;font-size:13.5px;line-height:1.68;color:var(--aleu-body)}

/* --- takeaways (§28) --- */
.tk-head{margin-bottom:22px}
.tk-head .k{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;
  color:var(--aleu-teal-dark);margin-bottom:10px}
.tk-head h2{font-family:var(--display);font-size:26px;font-weight:600;letter-spacing:-.024em;
  color:var(--aleu-navy);margin:0;line-height:1.2}
.tk-list{display:flex;flex-direction:column;gap:2px;border:1px solid var(--aleu-border-soft);
  border-radius:var(--r-md);overflow:hidden;background:var(--aleu-border-soft)}
.tk-item{display:grid;grid-template-columns:56px 1fr;gap:18px;background:#fff;padding:22px 22px}
.tk-num{font-family:var(--mono);font-size:22px;font-weight:500;color:var(--aleu-teal);
  line-height:1;letter-spacing:-.02em}
.tk-t{font-size:14.5px;font-weight:600;color:var(--aleu-navy);margin-bottom:7px;line-height:1.4}
.tk-b{font-size:13.5px;line-height:1.7;color:var(--aleu-body)}
.tk-foot{margin-top:20px}

/* --- figuras (§31) --- */
/* .figure-img retirado: producción no renderiza figuras originales. */
.figure-cap{font-size:11.5px;color:var(--aleu-muted);line-height:1.6;margin:12px 0 0}

/* --- mini tiles --- */
/* --- mini fichas métricas (renderer `panel` → b.tiles) ------------------
   92 apariciones en 19 artículos. Pasan de bloque de fondo gris a ficha
   técnica blanca compacta: el dato manda, el descriptor se lee, y el
   contenedor deja de competir con el contenido. Solo presentación. */
/* --- §Composición gráfico + explicación en una sola tarjeta ------------- */
.chart-explain .ce-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);
  gap:26px;align-items:start}
.chart-explain .ce-chart .chart-box{margin-top:14px}
.chart-explain .ce-chart .chart-box.is-doughnut{max-width:none;height:236px}
.chart-explain .ce-text{display:flex;flex-direction:column}
.chart-explain .ce-item{padding:12px 0;border-bottom:1px solid var(--aleu-border-soft)}
.chart-explain .ce-item:first-child{padding-top:2px}
.chart-explain .ce-item:last-child{border-bottom:0;padding-bottom:0}
.chart-explain .ce-t{font-size:13px;font-weight:600;color:var(--aleu-navy);
  margin:0 0 5px;line-height:1.35}
.chart-explain .ce-b{font-size:12.5px;line-height:1.6;color:var(--aleu-body);margin:0}
@media(max-width:900px){
  .chart-explain .ce-grid{grid-template-columns:minmax(0,1fr);gap:16px}
  .chart-explain .ce-chart .chart-box.is-doughnut{height:248px}
}

.mini{display:grid;grid-template-columns:repeat(auto-fit,minmax(146px,1fr));gap:10px}
.mini-tile{background:#fff;border:1px solid var(--aleu-border-soft);
  border-radius:var(--r-sm);padding:12px 13px}
.mini-chip{font-family:var(--mono);font-size:9.5px;letter-spacing:.09em;text-transform:uppercase;
  color:var(--aleu-teal-dark);margin-bottom:7px}
.mini-chip.good{color:var(--aleu-teal-dark)}
.mini-big{font-family:var(--display);font-size:21px;font-weight:600;letter-spacing:-.024em;
  color:var(--aleu-navy);line-height:1.05}
.mini-sub{font-size:11px;color:var(--aleu-muted);margin-top:5px;line-height:1.45}

/* --- subtabs (§30) --- */
.subtabs{background:#fff;border:1px solid var(--aleu-border-soft);border-radius:var(--r-md);
  padding:8px 20px 22px;box-shadow:var(--shadow-card)}
.subtabs > .tabs{position:static;border-bottom:1px solid var(--aleu-border-soft)!important;
  margin:2px 0 22px!important}
.subpanel > * + *{margin-top:18px}

/* ============================================================
   5 · PIE DE FICHA (evidencia + trazabilidad, §32)
   ============================================================ */
.footer-block{display:grid;grid-template-columns:1fr auto;gap:34px;align-items:start;
  margin-top:52px;padding-top:28px;border-top:1px solid var(--aleu-border-soft)}
.footer-block .evidence .k{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;
  font-weight:600;color:var(--aleu-muted);margin-bottom:12px}
.footer-block .evidence p{font-size:13.5px;line-height:1.7;color:var(--aleu-body);margin:0 0 14px;max-width:74ch}
.echip{display:inline-flex;align-items:center;gap:9px;font-family:var(--mono);font-size:10.5px;
  color:var(--aleu-muted);border:1px solid var(--aleu-border-soft);background:var(--aleu-bg-alt);
  border-radius:var(--r-sm);padding:7px 11px;line-height:1.4}
.echip .d{width:6px;height:6px;border-radius:50%;background:var(--aleu-teal);flex:0 0 auto}
.brandmark{text-align:right}
.brandmark .pb{display:block;font-size:10px;letter-spacing:.11em;text-transform:uppercase;
  color:var(--aleu-muted);margin-bottom:10px}
.brandmark img{height:34px;width:auto;margin-left:auto;opacity:.9}
.refnote{font-size:11.5px;line-height:1.65;color:var(--aleu-muted);margin:26px 0 0;
  padding-top:18px;border-top:1px solid var(--aleu-border-soft)}

/* ============================================================
   7 · PANORAMA DE LA EVIDENCIA
   ============================================================ */
#carteraScreen{padding:56px 0 24px}
.cart-intro{margin:0 0 4px;max-width:72ch;font-size:15px;line-height:1.72;color:var(--aleu-body)}
#carteraScreen .kicker,#carteraScreen > .idx-kicker{font-size:10.5px;letter-spacing:.15em;
  text-transform:uppercase;font-weight:600;color:var(--aleu-teal-dark);margin:18px 0 10px}
#carteraScreen h2{font-family:var(--display);font-size:34px;font-weight:600;letter-spacing:-.026em;
  color:var(--aleu-navy);margin:0 0 16px;line-height:1.16}

.cart-block{background:#fff;border:1px solid var(--aleu-border-soft);border-radius:var(--r-md);
  padding:26px 24px;box-shadow:var(--shadow-card);margin-bottom:20px}
.cart-block h3{font-family:var(--display);font-size:17px;font-weight:600;letter-spacing:-.014em;
  color:var(--aleu-navy);margin:0 0 5px}
.cart-block .cap{font-size:12.5px;color:var(--aleu-muted);margin:0 0 20px;line-height:1.55}
.cart-row{display:grid;grid-template-columns:210px 1fr 54px;gap:14px;align-items:center;
  padding:7px 0;font-size:12.5px}
.cart-lab{color:var(--aleu-body);text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cart-track{background:var(--aleu-bg-alt);border-radius:var(--r-xs);height:16px;overflow:hidden;
  border:1px solid var(--aleu-border-soft)}
.cart-fill{height:100%;background:var(--aleu-teal);border-radius:var(--r-xs) 0 0 var(--r-xs);
  transition:width .7s var(--ease)}
.cart-fill.lvl1{background:var(--aleu-navy)}
.cart-fill.gap{background:var(--aleu-warning)}
.cart-row.isgap .cart-lab{color:var(--aleu-warning)}
.cart-n{font-family:var(--mono);font-size:11.5px;color:var(--aleu-muted);text-align:right}
.cart-tot{display:flex;flex-wrap:wrap;gap:12px 34px;margin:22px 0 32px;padding-top:20px;
  border-top:1px solid var(--aleu-border-soft);font-size:13.5px;color:var(--aleu-body)}
.cart-tot span{display:inline-flex;align-items:baseline;gap:8px}
.cart-tot b{font-family:var(--display);color:var(--aleu-teal-dark);font-weight:600;font-size:20px;
  letter-spacing:-.02em}
.cart-foot{font-size:12px;line-height:1.65;color:var(--aleu-muted);margin:16px 0 0;
  padding-top:14px;border-top:1px dashed var(--aleu-border)}
.cart-back{display:inline-flex;align-items:center;gap:8px;background:none;border:0;padding:0;
  cursor:pointer;font-family:var(--sans);font-size:12.5px;font-weight:600;
  color:var(--aleu-teal-dark);margin:0 0 22px;
  transition:opacity var(--dur-fast) var(--ease)}
.cart-back:hover{text-decoration:underline;text-underline-offset:3px}

/* ============================================================
   8 · EXPLORADOR POR FACETAS  (§45: solo diseño)
   ============================================================ */
#exploradorScreen{padding-bottom:20px}
.exp-intro{padding:52px 0 30px;border-bottom:1px solid var(--aleu-border-soft)}
.exp-intro .wrap{padding:0}
.exp-kicker{font-size:10.5px;letter-spacing:.15em;text-transform:uppercase;font-weight:600;
  color:var(--aleu-teal-dark);margin:0 0 12px}
.exp-intro h2{font-family:var(--display);font-size:34px;font-weight:600;letter-spacing:-.026em;
  color:var(--aleu-navy);margin:0 0 14px;line-height:1.16}
.exp-intro .lede{font-size:15px;line-height:1.72;color:var(--aleu-body);margin:0 0 26px;max-width:72ch}
.portfolio{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-bottom:26px}
.searchbar{margin-bottom:4px}
.searchbox{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--aleu-border);
  border-radius:var(--r-md);padding:0 16px;height:50px;box-shadow:var(--shadow-card);
  transition:border-color var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease)}
.searchbox:focus-within{border-color:var(--aleu-teal);box-shadow:0 0 0 3px rgba(32,151,159,.1)}
.searchbox svg{stroke:var(--aleu-muted);flex:0 0 auto}
.searchbox input{flex:1;border:0;outline:0;background:none;font-family:var(--sans);font-size:14.5px;
  color:var(--aleu-text)}
.searchbox input::placeholder{color:var(--aleu-muted)}
.explorer-main{padding:34px 0 60px}
#exploradorScreen .wrap.grid{display:grid;grid-template-columns:250px minmax(0,1fr);gap:38px;
  align-items:start;max-width:var(--container-main);margin:0 auto;padding:0 var(--pad-desktop)}
#exploradorScreen .rail{position:sticky;top:64px}
.results-head{display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding-bottom:16px;margin-bottom:16px;border-bottom:1px solid var(--aleu-border-soft);flex-wrap:wrap}
.results-head .n{font-size:13px;font-weight:600;color:var(--aleu-navy)}
.sort{font-size:12.5px;color:var(--aleu-muted);display:inline-flex;align-items:center;gap:9px}
.sort select{height:32px;border:1px solid var(--aleu-border);border-radius:var(--r-sm);background:#fff;
  font-family:var(--sans);font-size:12.5px;color:var(--aleu-text);padding:0 10px;cursor:pointer}
.chips-active{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px}

/* ============================================================
   10 · RESPONSIVE  (§43-44)
   ============================================================ */
@media(max-width:1180px){
  .pf-hero{gap:38px}
}
@media(max-width:1024px){
  .pf-hero{grid-template-columns:1fr;gap:38px;padding:56px 0 48px}
  .pf-hero h1{font-size:40px}
  .pf-latest-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .idx-grid{grid-template-columns:1fr 1fr}
  .hero-grid{grid-template-columns:1fr}
  .hero-side{min-height:170px;border-left:0;border-top:1px solid var(--aleu-border-soft)}
}
@media(max-width:900px){
  .cols-2,.cols-3,.col-32,.col-bias{grid-template-columns:1fr}
  .cols-4{grid-template-columns:1fr 1fr}
  .band:not(.b4):not(.b2):not(.b5):not(.b6){grid-template-columns:1fr}
  .footer-block{grid-template-columns:1fr}
  .brandmark{text-align:left}
  .brandmark img{margin-left:0}
  #exploradorScreen .wrap.grid{grid-template-columns:1fr;gap:24px}
  #exploradorScreen .rail{position:static}
  .art-headgrid{grid-template-columns:1fr;gap:20px}
  .art-aux{text-align:left}
}
@media(max-width:768px){
  :root{--pad-desktop:var(--pad-mobile)}
  .pf-hero{padding:42px 0 38px}
  .pf-hero h1{font-size:33px}
  .pf-statbox{grid-template-columns:1fr;gap:20px;padding:26px 22px}
  .pf-stat{display:grid;grid-template-columns:46px 1fr;gap:16px;align-items:center}
  .pf-stat .si{margin-bottom:0}
  .pf-latest{padding:28px 20px 32px;margin-bottom:48px}
  .pf-latest-grid{grid-template-columns:minmax(0,1fr)}
  .lp{grid-column:auto}
  .idx-grid{grid-template-columns:1fr}
  .cols-4{grid-template-columns:1fr 1fr}
  .art-h1{font-size:30px}
  .art-head{padding:30px 0 20px}
  .hero-main{padding:26px 22px}
  .hero-title{font-size:23px}
  .card{padding:20px 18px}
  .tk-item{grid-template-columns:40px 1fr;gap:14px;padding:18px 18px}
  .cart-intro h2,.exp-intro h2{font-size:27px}
  .cart-row{grid-template-columns:120px 1fr 44px;gap:10px}
  .pairs{grid-template-columns:1fr}
}
@media(max-width:600px){
  .pf-hero h1{font-size:29px}
  .cols-4,.sc-grid{grid-template-columns:1fr}
  .mini{grid-template-columns:1fr}
  .gaugewrap{gap:16px}
  .gauge{width:128px;height:128px}
  .art-h1{font-size:25px}
  .hl-big{font-size:25px}
  .sc-big{font-size:27px}
  .brandrow{padding:12px 0;gap:12px}
  .brandL img{height:24px}
  .controls{justify-content:flex-start;width:100%}
  .pill{height:auto;min-height:28px;padding:5px 10px;white-space:normal;line-height:1.35;
    max-width:100%;overflow-wrap:anywhere}
  .navcta{width:100%;justify-content:center}
}
@media(max-width:380px){
  .kpi-val{font-size:25px}
  .band-big,.pf-hero h1{font-size:24px}
  .lp-year{font-size:30px!important}
}
/* evitar desbordes en pantallas muy estrechas */
@media(max-width:600px){
  body,#exploradorScreen,#indexScreen,#carteraScreen,#content,.doc{overflow-wrap:anywhere}
  table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
}

/* ============================================================
   11 · MOVIMIENTO REDUCIDO (§47-48)
   ============================================================ */
@media(prefers-reduced-motion:reduce){
  *{animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important}
  html{scroll-behavior:auto}
  .sec.active{animation:none}
  .hero-badge .dot{animation:none}
}

@media print{
  .top,.article-sidebar,.tabs,.tabsbar{display:none!important}
  .sec{display:block!important}
}

/* ============================================================
   12 · EXPLORADOR · COMPONENTES INTERNOS
   Reestilizados al sistema Aleu. Estructura y funcionalidad
   originales intactas: solo cambian colores, tipografía y ritmo.
   ============================================================ */
#exploradorScreen{animation:fade .34s var(--ease) both}
#exploradorScreen .wrap{max-width:var(--container-main);margin:0 auto;padding:0 var(--pad-desktop)}
#exploradorScreen .exp-intro .wrap{padding-left:0;padding-right:0}

/* --- cartera de resumen sobre el buscador --- */
#exploradorScreen .portfolio .cnt,
#exploradorScreen .portfolio > div{font-size:13px;color:var(--aleu-body);line-height:1.6}
#exploradorScreen .portfolio b,
#exploradorScreen .portfolio strong{color:var(--aleu-navy);font-weight:600}

/* --- rail de facetas --- */
#exploradorScreen .facet{padding:0 0 20px;margin-bottom:20px;
  border-bottom:1px solid var(--aleu-border-soft)}
#exploradorScreen .facet:last-child{border-bottom:0;margin-bottom:0}
#exploradorScreen .facet > h3,
#exploradorScreen .facet > .tag{display:block;font-family:var(--sans);font-size:10.5px;
  letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--aleu-muted);
  margin:0 0 12px;line-height:1.4}
#exploradorScreen .opt{display:flex;align-items:center;gap:10px;
  width:100%;background:none;border:0;cursor:pointer;font-family:var(--sans);font-size:13px;
  color:var(--aleu-body);padding:6px 8px;border-radius:var(--r-sm);text-align:left;
  transition:background var(--dur-fast) var(--ease),color var(--dur-fast) var(--ease)}
#exploradorScreen .opt .box{width:15px;height:15px;flex:0 0 auto;border-radius:var(--r-xs);
  border:1.5px solid var(--aleu-border);background:#fff;position:relative;
  transition:all var(--dur-fast) var(--ease)}
#exploradorScreen .opt:hover .box{border-color:var(--aleu-teal)}
#exploradorScreen .opt.on .box{background:var(--aleu-teal);border-color:var(--aleu-teal)}
#exploradorScreen .opt.on .box::after{content:"";position:absolute;left:4px;top:1px;
  width:4px;height:8px;border:solid #fff;border-width:0 1.8px 1.8px 0;transform:rotate(43deg)}
#exploradorScreen .opt > span:nth-child(2){flex:1 1 auto;min-width:0;text-align:left;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#exploradorScreen .opt .cnt{margin-left:auto}
#exploradorScreen .opt:hover{background:var(--aleu-bg-alt);color:var(--aleu-navy)}
#exploradorScreen .opt.on,#exploradorScreen .opt[aria-pressed="true"]{
  background:var(--aleu-teal-soft);color:var(--aleu-teal-dark);font-weight:600}
#exploradorScreen .opt .cnt{font-family:var(--mono);font-size:11px;color:var(--aleu-muted);flex:0 0 auto}
#exploradorScreen .opt.on .cnt{color:var(--aleu-teal-dark)}
#exploradorScreen .clearall:disabled{opacity:.45;cursor:default}
#exploradorScreen .clearall:disabled:hover{border-color:var(--aleu-border);color:var(--aleu-navy)}
#exploradorScreen .clearall{margin-top:6px;width:100%;background:#fff;border:1px solid var(--aleu-border);
  border-radius:var(--r-sm);cursor:pointer;font-family:var(--sans);font-size:12.5px;font-weight:600;
  color:var(--aleu-navy);padding:9px 12px;transition:all var(--dur-fast) var(--ease)}
#exploradorScreen .clearall:hover{border-color:var(--aleu-teal);color:var(--aleu-teal-dark)}

/* --- chips de filtros activos --- */
#exploradorScreen .chips-active .chip,#clinicalThemeScreen .chips-active .chip{cursor:pointer;font-size:11.5px;letter-spacing:.01em;
  text-transform:none;height:28px}
#exploradorScreen .chips-active .chip:hover,#clinicalThemeScreen .chips-active .chip:hover{background:var(--aleu-mint)}

/* --- tarjeta de resultado --- */
#exploradorScreen .card,#clinicalThemeScreen .card{background:#fff;border:1px solid var(--aleu-border-soft);
  border-radius:var(--r-md);padding:24px 22px;box-shadow:var(--shadow-card);margin-bottom:16px;
  transition:box-shadow var(--dur-ui) var(--ease),border-color var(--dur-ui) var(--ease)}
#exploradorScreen .card:hover,#clinicalThemeScreen .card:hover{box-shadow:var(--shadow-lift);border-color:var(--aleu-border)}
#exploradorScreen .card .top,#clinicalThemeScreen .card .top{display:flex;align-items:flex-start;justify-content:space-between;
  gap:16px;margin-bottom:8px}
#exploradorScreen .card h2,#clinicalThemeScreen .card h2{font-family:var(--display);font-size:18px;font-weight:600;
  letter-spacing:-.016em;color:var(--aleu-navy);margin:0;line-height:1.3}
#exploradorScreen .evlvl{flex:0 0 auto;font-size:9.5px;letter-spacing:.09em;text-transform:uppercase;
  font-weight:600;padding:5px 10px;border-radius:var(--r-xs);background:var(--aleu-bg-alt);
  border:1px solid var(--aleu-border-soft);color:var(--aleu-muted);white-space:nowrap}
#exploradorScreen .evlvl.lvl1,#exploradorScreen .evlvl.hi{background:var(--aleu-navy);
  border-color:var(--aleu-navy);color:#fff}
#exploradorScreen .evlvl.lvl2,#exploradorScreen .evlvl.mid{background:var(--aleu-teal-soft);
  border-color:#CDE8E9;color:var(--aleu-teal-dark)}
#exploradorScreen .meta-line,#clinicalThemeScreen .meta-line{font-family:var(--mono);font-size:11.5px;color:var(--aleu-muted);
  margin-bottom:14px}
#exploradorScreen .chipset,#clinicalThemeScreen .chipset{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:14px}
#exploradorScreen .chipset .chip,#clinicalThemeScreen .chipset .chip{height:26px;padding:0 11px;font-size:11px;text-transform:none;
  letter-spacing:.01em;background:var(--aleu-bg-alt);color:var(--aleu-body);
  border:1px solid var(--aleu-border-soft)}
#exploradorScreen .chipset .chip.sc,#clinicalThemeScreen .chipset .chip.sc{background:var(--aleu-teal-soft);color:var(--aleu-teal-dark);
  border-color:#CDE8E9}
#exploradorScreen .chipset .chip.se,#clinicalThemeScreen .chipset .chip.se{background:var(--aleu-mint);color:var(--aleu-navy);
  border-color:#CBE9E3}
#exploradorScreen .chipset .chip.po,#clinicalThemeScreen .chipset .chip.po{background:var(--aleu-bg-alt);color:var(--aleu-body);
  border-color:var(--aleu-border-soft)}
#exploradorScreen .blurb,#clinicalThemeScreen .blurb{font-size:13.5px;line-height:1.7;color:var(--aleu-body);margin:0 0 18px}

/* --- rejilla de cifras --- */
#exploradorScreen .outs,#clinicalThemeScreen .outs{display:grid;grid-template-columns:repeat(auto-fit,minmax(165px,1fr));
  gap:1px;background:var(--aleu-border-soft);border:1px solid var(--aleu-border-soft);
  border-radius:var(--r-sm);overflow:hidden;margin-bottom:18px}
#exploradorScreen .out,#clinicalThemeScreen .out{background:#fff;padding:14px 15px;min-width:0}
#exploradorScreen .out .v,#clinicalThemeScreen .out .v{font-family:var(--display);font-size:19px;font-weight:600;
  letter-spacing:-.024em;color:var(--aleu-teal-dark);line-height:1.15;font-variant-numeric:tabular-nums}
#exploradorScreen .out .k,#clinicalThemeScreen .out .k{font-size:11.5px;color:var(--aleu-navy);font-weight:600;
  margin-top:5px;line-height:1.4}
#exploradorScreen .out .c,#clinicalThemeScreen .out .c,#exploradorScreen .out .s,#clinicalThemeScreen .out .s,#exploradorScreen .out small,#clinicalThemeScreen .out small{
  display:block;font-size:10.5px;color:var(--aleu-muted);line-height:1.45;margin-top:4px}

/* --- pie de tarjeta --- */
#exploradorScreen .foot,#clinicalThemeScreen .foot{display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  border-top:1px solid var(--aleu-border-soft);padding-top:14px}
#exploradorScreen .flags,#clinicalThemeScreen .flags{display:flex;gap:6px;flex-wrap:wrap;flex:1 1 auto;min-width:0}
#exploradorScreen a.open{flex:0 0 auto;font-size:12.5px;font-weight:600;color:var(--aleu-teal-dark);
  text-decoration:none;white-space:nowrap}
#exploradorScreen a.open:hover{text-decoration:underline;text-underline-offset:3px}

/* --- estado vacío --- */
#exploradorScreen .empty,#clinicalThemeScreen .empty{background:var(--aleu-bg-alt);border:1px dashed var(--aleu-border);
  border-radius:var(--r-md);padding:38px 26px;text-align:center;font-size:14px;
  color:var(--aleu-muted);line-height:1.7}

@media(max-width:900px){
  #exploradorScreen .rail{display:grid;grid-template-columns:1fr 1fr;gap:0 26px}
  #exploradorScreen .facet:nth-last-child(-n+2){border-bottom:1px solid var(--aleu-border-soft)}
}
@media(max-width:600px){
  #exploradorScreen .rail{grid-template-columns:1fr}
  #exploradorScreen .outs,#clinicalThemeScreen .outs{grid-template-columns:1fr}
  #exploradorScreen .card,#clinicalThemeScreen .card{padding:20px 18px}
  #exploradorScreen .card .top,#clinicalThemeScreen .card .top{flex-direction:column;gap:10px}
  #exploradorScreen .foot,#clinicalThemeScreen .foot{gap:10px}
}

/* ============================================================
   13 · VARIANTES DE PRESENTACIÓN (mantenimiento tanda 2)
   Solo apariencia: no alteran datos ni estructura de bloques.
   ============================================================ */

/* fichas técnicas compactas en lugar de los grandes recuadros navy */
.statcard.compact{background:#fff;border:1px solid var(--aleu-border-soft);border-radius:var(--r-sm);
  padding:16px 18px;box-shadow:none}
.statcard.compact .sc-top{margin-bottom:10px}
.statcard.compact .sc-name{font-size:12.5px;color:var(--aleu-navy)}
.statcard.compact .sc-tag{background:var(--aleu-bg-alt);color:var(--aleu-muted);
  border:1px solid var(--aleu-border-soft);font-size:9px}
.statcard.compact .sc-big{font-size:24px;color:var(--aleu-teal-dark)}
.statcard.compact .sc-big .u{font-size:11.5px}
.statcard.compact .sc-grid{margin-top:12px;padding-top:11px;gap:10px;
  border-top:1px solid var(--aleu-border-soft)}
.statcard.compact .sc-cell .v{font-size:13.5px;color:var(--aleu-navy)}
.statcard.compact .sc-cell .l{font-size:10px;opacity:.85;color:var(--aleu-muted)}

/* === NORMALIZACIÓN VISUAL · PATRÓN 1 ================================
   Las fichas de datos numéricos dejan de usar grandes superficies navy
   o azules: se representan siempre como ficha técnica blanca compacta.
   Solución de presentación: no se toca ningún dato científico. ==== */
.statcard{padding:15px 16px;border-radius:var(--r-sm);box-shadow:0 1px 5px rgba(11,58,74,.03)}
.statcard.dark,.statcard.blue{background:#fff;border-color:var(--aleu-border-soft);color:var(--aleu-body)}
.statcard.dark .sc-name,.statcard.blue .sc-name{color:var(--aleu-navy)}
.statcard.dark .sc-tag,.statcard.blue .sc-tag{background:var(--aleu-bg-alt);
  color:var(--aleu-muted);border:1px solid var(--aleu-border-soft)}
.statcard.dark .sc-big,.statcard.blue .sc-big{color:var(--aleu-teal-dark)}
.statcard.dark .sc-grid,.statcard.blue .sc-grid{border-top-color:var(--aleu-border-soft)}
.statcard.dark .sc-cell .v,.statcard.blue .sc-cell .v{color:var(--aleu-navy)}
.statcard.dark .sc-cell .l,.statcard.blue .sc-cell .l{color:var(--aleu-muted);opacity:.9}
.sc-top{margin-bottom:10px}
.sc-name{font-size:12.5px}
.sc-big{font-size:25px}
.sc-big .u{font-size:11.5px}
.sc-grid{margin-top:12px;padding-top:11px;gap:10px}
.sc-cell .v{font-size:13.5px}
.sc-cell .l{font-size:10px}

/* «Titular» sin gran panel: composición editorial horizontal */
/* `cls:"light"` se conserva como alias: 6 bloques lo traen en los datos y no
   se tocan. Antes definía una segunda retícula propia (con los chips como
   ítem de la columna 1, origen del descuadre); ahora comparte la del titular
   unificado y solo ajusta el remate superior. */
.headline.light{border-top:0;padding-top:6px}
}

/* bloque ancho y de poca altura (concordancia por patógeno) */
.card.wide .cardbody{columns:2;column-gap:38px}
@media(max-width:900px){.card.wide .cardbody{columns:1}}
.card.fit-h{align-self:start}

/* fila de dos columnas cuyo panel no debe estirarse a la altura de la gráfica */
.grid.top{align-items:start}

/* ============================================================
   14 · ESTADOS DE CARGA Y ERROR (Fase 2)
   ============================================================ */
.ei-estado{max-width:var(--container-main);margin:0 auto;padding:96px var(--pad-desktop);
  text-align:center;color:var(--aleu-body)}
.ei-estado p{font-size:14.5px;margin:0}
.ei-spinner{width:34px;height:34px;margin:0 auto 22px;border-radius:50%;
  border:3px solid var(--aleu-border);border-top-color:var(--aleu-teal);
  animation:ei-giro .9s linear infinite}
@keyframes ei-giro{to{transform:rotate(360deg)}}
.ei-error{max-width:var(--container-reading)}
.ei-error h2{font-family:var(--display);font-size:24px;font-weight:600;letter-spacing:-.02em;
  color:var(--aleu-navy);margin:0 0 14px}
.ei-error p{margin:0 0 12px}
.ei-error .ei-detalle{font-family:var(--mono);font-size:12px;color:var(--aleu-muted);
  background:var(--aleu-bg-alt);border:1px solid var(--aleu-border-soft);border-radius:var(--r-sm);
  padding:10px 14px;margin:0 0 22px;word-break:break-word}
@media(prefers-reduced-motion:reduce){.ei-spinner{animation:none;border-top-color:var(--aleu-border)}}

/* ============================================================
   15 · DOI Y AVISOS DE ÁMBITO DE USO
   ============================================================ */

/* --- enlace bibliográfico al artículo original --- */
.doi-link{display:inline-flex;align-items:center;gap:8px;margin-top:10px;
  padding:7px 12px;border:1px solid var(--aleu-border-soft);border-radius:var(--r-sm);
  background:#fff;color:var(--aleu-teal-dark);text-decoration:none;
  font-size:12px;line-height:1.4;max-width:100%;
  transition:border-color var(--dur-fast) var(--ease),background var(--dur-fast) var(--ease)}
.doi-link:hover{border-color:var(--aleu-teal);background:var(--aleu-teal-soft)}
.doi-link:focus-visible{outline:2px solid var(--aleu-teal);outline-offset:2px}
.doi-link .doi-ico{width:13px;height:13px;flex:0 0 auto;stroke:currentColor;fill:none;
  stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.doi-link .doi-num{font-family:var(--mono);font-size:11px;color:var(--aleu-muted);
  overflow-wrap:anywhere}
.doi-link > span{min-width:0;overflow-wrap:anywhere}
.doi-link[hidden]{display:none}

/* --- nota informativa al pie de cada ficha --- */
/* --- bloque de ensayo aleatorizado en portada -----------------------------
   Diferenciación por jerarquía, no por color: fondo blanco, filete teal
   superior fino y tipografía algo mayor. Sin degradados, sin insignias. */
.pf-rct{background:#fff;border:1px solid var(--aleu-border-soft);
  border-top:3px solid var(--aleu-teal);border-radius:var(--r-md);
  padding:26px 28px;margin:0 0 34px}
.pf-rct-k{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;
  color:var(--aleu-teal-dark);margin:0 0 12px}
.pf-rct-t{font-family:var(--display);font-size:24px;font-weight:600;letter-spacing:-.022em;
  color:var(--aleu-navy);margin:0 0 4px}
.pf-rct-src{font-size:12.5px;color:var(--aleu-muted);margin:0 0 14px}
.pf-rct-b{font-size:14px;line-height:1.65;color:var(--aleu-body);margin:0 0 14px;max-width:78ch}
.pf-rct-meta{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 12px}
.pf-rct-meta span{font-size:11.5px;font-weight:500;color:var(--aleu-body);
  background:var(--aleu-bg-alt);border:1px solid var(--aleu-border-soft);
  border-radius:var(--r-pill);padding:3px 11px}
.pf-rct-f{font-size:12px;color:var(--aleu-muted);margin:0 0 16px;line-height:1.6}
.pf-rct-go{background:none;border:0;padding:0;cursor:pointer;font-family:var(--sans);
  font-size:13px;font-weight:600;color:var(--aleu-teal-dark)}
.pf-rct-go:hover{color:var(--aleu-navy)}
.pf-rct-go:focus-visible{outline:2px solid var(--aleu-teal);outline-offset:3px;border-radius:3px}
@media(max-width:600px){
  .pf-rct{padding:20px 18px}
  .pf-rct-t{font-size:21px}
  .pf-rct-b{font-size:13.5px}
}

/* --- limitaciones metodológicas · discreto, no compite con resultados --- */
.limmet{margin:34px 0 0;padding:20px 22px;background:var(--aleu-bg-alt);
  border:1px solid var(--aleu-border-soft);border-radius:var(--r-md)}
.limmet-t{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;
  color:var(--aleu-muted);margin:0 0 6px}
.limmet-c{font-size:11.5px;line-height:1.55;color:var(--aleu-muted);margin:0 0 12px;max-width:82ch}
.limmet-l{margin:0;padding-left:17px;font-size:12.5px;line-height:1.65;color:var(--aleu-body)}
.limmet-l li{margin:0 0 4px}
.limmet-l li:last-child{margin-bottom:0}
.limmet-mas{margin-top:4px}
.limmet-b{margin-top:12px;background:none;border:0;padding:2px 0;cursor:pointer;
  font-family:var(--sans);font-size:12px;font-weight:600;color:var(--aleu-teal-dark)}
.limmet-b:hover{color:var(--aleu-navy);text-decoration:underline;text-underline-offset:3px}
.limmet-b:focus-visible{outline:2px solid var(--aleu-teal);outline-offset:3px;border-radius:3px}
@media(max-width:600px){.limmet{padding:16px 16px}}
@media print{.limmet-mas{display:block!important}.limmet-b{display:none}}

/* --- ámbito de uso · pie de página, presente en todas las pantallas --- */
.ei-pie{margin-top:72px;padding:34px 0 44px;
  background:var(--aleu-bg-alt);border-top:1px solid var(--aleu-border-soft)}
.ei-pie-in{max-width:var(--container-main);margin:0 auto;padding:0 var(--pad-desktop)}
.ei-pie h2{font-family:var(--display);font-size:16px;font-weight:600;letter-spacing:-.012em;
  color:var(--aleu-navy);margin:0 0 14px}
.ei-pie p{font-size:13px;line-height:1.72;color:var(--aleu-body);margin:0 0 12px}
.ei-pie p:last-child{margin-bottom:0}

@media(max-width:768px){
  .ei-pie{margin-top:48px;padding:26px 0 34px}
  .doi-link{font-size:11.5px}
}


/* ============================================================
   PORTADA (Inicio) · CSS de la portada aprobada, acotado a #homeScreen
   para no alterar ninguna regla existente del maestro.
   ============================================================ */
#homeScreen{display:none}
#homeScreen.on{display:block}

/* ============================================================
   PORTADA · Aleu Medical — Pilot Gene Sepsis
   Archivo autónomo. No depende del HTML maestro ni lo modifica.
   Tokens alineados con el maestro para mantener coherencia.
   ============================================================ */
#homeScreen{
  /* ---- Paleta base (idéntica al maestro) ---- */
  --teal:#20979F;      --teal-dark:#127880;   --teal-soft:#EAF7F7;
  --navy:#103D4B;      --navy-2:#174E5D;      --mint:#DFF4F1;
  --bg:#FFFFFF;        --bg-alt:#F7F9FA;      --white:#FFFFFF;
  --border:#E3EAEC;    --border-soft:#EDF2F3;
  --text:#1F3842;      --body:#5A6E76;        --muted:#8A9BA1;

  /* ---- Acentos de temática: círculo pastel + icono saturado ---- */
  --c1-bg:#DCEFF0; --c1:#1E8F97;
  --c2-bg:#DEEBF7; --c2:#3A7CA8;
  --c3-bg:#FBE2E5; --c3:#C2666E;
  --c4-bg:#DFF0E5; --c4:#3E8C63;
  --c5-bg:#E9E4F4; --c5:#6E5FA8;

  /* ---- Métrica ---- */
  --container:1180px;  --pad:28px;
  --r-sm:6px; --r-md:10px; --r-lg:14px; --r-pill:999px;

  /* ---- Tipografía ---- */
  --sans:"Inter","Helvetica Neue",Arial,system-ui,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,monospace;

  /* ---- Sombra y movimiento ---- */
  --shadow:0 1px 3px rgba(31,70,80,.04);
  --shadow-lift:0 6px 20px rgba(31,70,80,.08);
  --ease:cubic-bezier(.22,1,.36,1);
  --fast:150ms; --ui:240ms;
}

#homeScreen *,#homeScreen *::before,#homeScreen *::after{box-sizing:border-box}
#homeScreen{background:var(--bg);color:var(--text);font-family:var(--sans);font-size:15px;line-height:1.6}
#homeScreen a{color:inherit;text-decoration:none}
#homeScreen h1,#homeScreen h2,#homeScreen h3,#homeScreen p{margin:0}
 #homeScreen .ei-wrap{max-width:var(--container);margin:0 auto;padding:0 var(--pad)}

/* ============================================================
   1 · HEADER
   ============================================================ */

/* ============================================================
   2 · HERO
   ============================================================ */
 #homeScreen .ei-hero{padding:0 0 4px}
 #homeScreen .ei-hero-box{
  position:relative;overflow:hidden;border-radius:var(--r-lg);
  display:grid;grid-template-columns:1fr 1.02fr;gap:36px;align-items:center;
  padding:64px 56px;min-height:390px;
  /* Capas, de arriba abajo: velo de legibilidad · tinte de marca · fotografía */
  background-image:
    linear-gradient(100deg,rgba(255,255,255,.82) 0%,rgba(255,255,255,.68) 38%,rgba(255,255,255,.22) 62%,rgba(255,255,255,.06) 100%),
    linear-gradient(126deg,rgba(220,232,238,.28) 0%,rgba(244,248,249,.12) 100%),
    url("../assets/images/evidence-intelligence-hero.webp");
  background-size:cover,cover,cover;
  background-position:center,center,center 38%;
  background-repeat:no-repeat;
  background-color:#EDF3F5;
}
/* Trama científica muy tenue, no fotografía */
/* Sin trama: la fotografía ya aporta la textura de fondo. */
 #homeScreen .ei-hero-text{position:relative;z-index:1;max-width:520px}
 #homeScreen .eyebrow{
  font-size:12px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--muted);font-weight:500;margin-bottom:20px;
}
 #homeScreen .ei-hero h1{
  font-size:clamp(30px,3.6vw,42px);line-height:1.18;letter-spacing:-.028em;
  font-weight:600;color:var(--navy);margin-bottom:22px;text-wrap:balance;
}
 #homeScreen .ei-hero-desc{font-size:15px;line-height:1.7;color:var(--body);max-width:52ch;margin-bottom:30px}
 #homeScreen .ei-btn{
  display:inline-flex;align-items:center;gap:9px;padding:14px 26px;border-radius:var(--r-pill);
  font-family:var(--sans);font-size:14.5px;font-weight:500;border:1px solid transparent;
  cursor:pointer;background:var(--teal-dark);color:#fff;
  transition:background var(--ui) var(--ease);
}
 #homeScreen .ei-btn{
  display:inline-flex;align-items:center;gap:9px;padding:14px 26px;border-radius:var(--r-pill);
  font-family:var(--sans);font-size:14.5px;font-weight:500;border:1px solid transparent;
  cursor:pointer;background:var(--teal-dark);color:#fff;
  transition:background var(--ui) var(--ease);
}
#homeScreen .ei-btn:hover{background:#0E646B}
 #homeScreen .ei-btn .ar, #homeScreen .lnk .ar{display:inline-block;transition:transform var(--fast) var(--ease)}
 #homeScreen .ei-btn:hover .ar, #homeScreen .lnk:hover .ar{transform:translateX(3px)}

/* ---- Columna del render ---- */
 #homeScreen .ei-hero-media{position:relative;z-index:1;display:flex;flex-direction:column;gap:18px}
/* PLACEHOLDER DEL RENDER OFICIAL — ver README */
/* Renders oficiales Pilot Gene. Para sustituirlos, cambiar el src de cada <img>. */
 #homeScreen .device{
  position:relative;display:flex;align-items:flex-end;justify-content:center;
  gap:18px;min-height:216px;
}
/* Escala física real entre los dos equipos.
   Alturas declaradas por el fabricante: AP10 460 mm · AD3207 590 mm.
   460/590 = 0,78, de modo que el AP10 se dibuja al 78% de la altura del
   AD3207. --devH controla el tamaño conjunto sin alterar esa relación. */
 #homeScreen .device{--devH:clamp(140px,18vw,205px)}
 #homeScreen .device img{
  display:block;width:auto;max-width:100%;
  filter:drop-shadow(0 12px 22px rgba(16,61,75,.14));
}
 #homeScreen .device .ad3207{height:var(--devH)}
 #homeScreen .device .ap10{height:calc(var(--devH) * .78)}
 #homeScreen .device-caps{display:grid;grid-template-columns:1fr 1fr;gap:20px}
 #homeScreen .device-caps div strong{display:block;font-size:13.5px;font-weight:600;color:var(--navy)}
 #homeScreen .device-caps div span{font-size:11.5px;color:var(--muted)}

/* ============================================================
   3 · SECCIONES
   ============================================================ */
 #homeScreen .section{padding:56px 0}
 #homeScreen .ei-sec-head{display:flex;align-items:baseline;justify-content:space-between;gap:20px;margin-bottom:26px}
 #homeScreen .ei-sec-head h2{font-size:clamp(20px,2.2vw,25px);font-weight:600;letter-spacing:-.024em;color:var(--navy)}
 #homeScreen .lnk{font-size:13px;font-weight:500;color:var(--teal-dark);white-space:nowrap}

/* Círculo pastel con icono — patrón compartido */
 #homeScreen .ico{
  display:flex;align-items:center;justify-content:center;border-radius:50%;
  background:var(--ico-bg,var(--teal-soft));color:var(--ico,var(--teal));flex:0 0 auto;
}
 #homeScreen .ico svg{fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}

/* ---- Temáticas ---- */
 #homeScreen .themes{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px}
 #homeScreen .theme{
  display:flex;flex-direction:column;text-align:left;font-family:var(--sans);cursor:pointer;
  background:var(--white);border:1px solid var(--border-soft);border-radius:var(--r-md);
  padding:26px 22px 20px;
  transition:transform var(--ui) var(--ease),box-shadow var(--ui) var(--ease),
             border-color var(--ui) var(--ease);
}
 #homeScreen .theme:hover{transform:translateY(-2px);box-shadow:var(--shadow-lift);border-color:var(--border)}
 #homeScreen .theme .ico{width:52px;height:52px;margin-bottom:22px}
 #homeScreen .theme .ico svg{width:23px;height:23px}
 #homeScreen .theme h3{font-size:16.5px;font-weight:600;color:var(--navy);line-height:1.28;
  letter-spacing:-.016em;margin-bottom:11px}
 #homeScreen .theme p{font-size:12.5px;line-height:1.6;color:var(--body);flex:1 1 auto;margin-bottom:22px}
 #homeScreen .theme-foot{display:flex;align-items:center;justify-content:space-between;gap:10px}
 #homeScreen .theme-n{font-size:12.5px;color:var(--body)}
 #homeScreen .theme-n b{font-family:var(--mono);font-weight:500;color:var(--navy);margin-right:4px}
 #homeScreen .theme-arrow{color:var(--teal);font-size:15px;transition:transform var(--fast) var(--ease)}
 #homeScreen .theme:hover .theme-arrow{transform:translateX(3px)}

/* ---- Estudios recientes ---- */
 #homeScreen .studies{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
 #homeScreen .study{
  display:flex;flex-direction:column;background:var(--white);
  border:1px solid var(--border-soft);border-radius:var(--r-md);padding:24px 22px 20px;
  transition:transform var(--ui) var(--ease),box-shadow var(--ui) var(--ease);
}
 #homeScreen .study:hover{transform:translateY(-2px);box-shadow:var(--shadow-lift)}
/* Emblema de la ficha. Para usar una imagen, sustituir este bloque
   por <img class="study-ai-image" …> y añadir la regla del README. */
 #homeScreen .study-ai-image-placeholder{width:42px;height:42px;margin-bottom:22px}
 #homeScreen .study-ai-image-placeholder .ico{width:42px;height:42px}
 #homeScreen .study-ai-image-placeholder svg{width:19px;height:19px}
 #homeScreen .study-kicker{
  font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);
  font-weight:500;margin-bottom:10px;
}
 #homeScreen .study h3{font-size:19px;font-weight:600;color:var(--navy);letter-spacing:-.02em;margin-bottom:12px}
 #homeScreen .study-sum{font-size:13px;line-height:1.65;color:var(--body);flex:1 1 auto;margin-bottom:22px}
 #homeScreen .study-foot{display:flex;align-items:center;justify-content:space-between;gap:12px}
 #homeScreen .study-n{font-family:var(--mono);font-size:11.5px;color:var(--muted)}
 #homeScreen .study-go{font-size:12.5px;font-weight:500;color:var(--teal-dark)}
 #homeScreen .study-go .ar{display:inline-block;transition:transform var(--fast) var(--ease)}
 #homeScreen .study:hover .study-go .ar{transform:translateX(3px)}

/* ---- Banda inferior ---- */
 #homeScreen .ei-band{padding:0 0 56px}
 #homeScreen .ei-band-in{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  background:var(--bg-alt);border:1px solid var(--border-soft);border-radius:var(--r-md);
  padding:30px 8px;
}
 #homeScreen .ei-band-item{display:flex;align-items:flex-start;gap:16px;padding:6px 26px;
  transition:opacity var(--fast) var(--ease)}
 #homeScreen .ei-band-item+.band-item{border-left:1px solid var(--border)}
 #homeScreen .ei-band-item:hover{opacity:.72}
 #homeScreen .ei-band-item svg{width:26px;height:26px;flex:0 0 auto;margin-top:2px;
  fill:none;stroke:var(--teal-dark);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
 #homeScreen .ei-band-item strong{display:block;font-size:15px;font-weight:600;color:var(--navy);
  letter-spacing:-.014em;margin-bottom:4px}
 #homeScreen .ei-band-item span{font-size:12.5px;line-height:1.55;color:var(--body)}

/* ============================================================
   4 · PIE · ámbito de uso
   ============================================================ */
 #homeScreen .foot{padding:40px 0 52px;border-top:1px solid var(--border-soft);background:var(--bg-alt)}
 #homeScreen .foot-in{max-width:none;width:100%}
 #homeScreen .foot h2{font-size:14.5px;font-weight:600;color:var(--navy);letter-spacing:-.012em;display:inline}
 #homeScreen .foot p{font-size:12.5px;line-height:1.72;color:var(--body);margin:0 0 12px}
 #homeScreen .foot p:last-of-type{margin-bottom:0}
 #homeScreen .foot details>summary{cursor:pointer;list-style:none;padding:4px 0}
 #homeScreen .foot details>summary::-webkit-details-marker{display:none}
 #homeScreen .foot details>summary::after{content:" ▾";color:var(--teal-dark);font-size:11px}
 #homeScreen .foot details[open]>summary::after{content:" ▴"}
 #homeScreen .foot details[open]>summary{margin-bottom:14px}
 #homeScreen .foot-meta{margin-top:26px;padding-top:18px;border-top:1px solid var(--border);
  font-size:11.5px;color:var(--muted)}

/* ============================================================
   5 · RESPONSIVE
   ============================================================ */
@media(max-width:1080px){
 #homeScreen .themes{grid-template-columns:repeat(3,minmax(0,1fr))}
 #homeScreen .ei-hero-box{grid-template-columns:1fr;gap:34px;padding:46px 34px;min-height:0}
 #homeScreen .ei-hero-text{max-width:none}
  .nav{gap:20px}
}
@media(max-width:900px){
  .nav,.search{display:none}
  .burger{display:flex}
  .nav.open{
    display:flex;position:absolute;top:72px;left:0;right:0;flex-direction:column;gap:0;
    align-items:stretch;background:var(--white);border-bottom:1px solid var(--border-soft);
    padding:6px var(--pad) 12px;
  }
  .nav.open a{padding:12px 4px}
  .nav.open a[aria-current="page"]::after{display:none}
 #homeScreen .themes{grid-template-columns:repeat(2,minmax(0,1fr))}
 #homeScreen .studies{grid-template-columns:repeat(2,minmax(0,1fr))}
 #homeScreen .ei-band-in{grid-template-columns:1fr;padding:8px}
 #homeScreen .ei-band-item{padding:18px 20px}
 #homeScreen .ei-band-item+.band-item{border-left:0;border-top:1px solid var(--border)}
 #homeScreen .section{padding:44px 0}
}
@media(max-width:620px){
  :root{--pad:18px}
  .hdr-in{height:64px}
  .nav.open{top:64px}
 #homeScreen .ei-hero-box{padding:32px 20px;border-radius:var(--r-md);gap:28px;
    background-image:
      linear-gradient(180deg,rgba(255,255,255,.88) 0%,rgba(255,255,255,.78) 58%,rgba(255,255,255,.46) 100%),
      url("../assets/images/evidence-intelligence-hero.webp");
    background-size:cover,cover;background-position:center,center 42%}
 #homeScreen .ei-hero h1{font-size:clamp(26px,7.2vw,32px)}
 #homeScreen .eyebrow{font-size:11px;letter-spacing:.18em}
 #homeScreen .themes, #homeScreen .studies{grid-template-columns:minmax(0,1fr)}
  /* En móvil solo se reduce --devH: la relación 78% se mantiene. */
 #homeScreen .device{min-height:0;gap:12px;--devH:clamp(104px,29vw,150px)}
 #homeScreen .section{padding:36px 0}
 #homeScreen .ei-sec-head{flex-direction:column;align-items:flex-start;gap:8px}
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
}


/* ---- Colección temática: cabecera propia; las cards son las del Explorador ---- */
#homeScreen .study[data-article]{cursor:pointer}
#clinicalThemeScreen{max-width:1180px;margin:0 auto;padding:26px 28px 64px}
#clinicalThemeScreen .ct-back{background:none;border:0;padding:4px 0;cursor:pointer;
  font-family:var(--sans);font-size:13px;color:var(--aleu-teal-dark);font-weight:500}
#clinicalThemeScreen .ct-back:hover{text-decoration:underline;text-underline-offset:3px}
#clinicalThemeScreen .ct-head{display:flex;align-items:flex-end;justify-content:space-between;
  gap:24px;margin:14px 0 26px;padding-bottom:20px;border-bottom:1px solid var(--aleu-border-soft)}
#clinicalThemeScreen h2{font-size:26px;font-weight:600;letter-spacing:-.024em;
  color:var(--aleu-navy);margin:0 0 8px}
#clinicalThemeScreen .ct-desc{font-size:14px;color:var(--aleu-body);margin:0 0 10px;max-width:62ch}
#clinicalThemeScreen .ct-n{font-family:var(--mono);font-size:12.5px;color:var(--aleu-muted)}
#clinicalThemeScreen .ct-cta{flex:0 0 auto;background:none;border:1px solid var(--aleu-border);
  border-radius:999px;padding:10px 18px;cursor:pointer;font-family:var(--sans);font-size:13px;
  font-weight:500;color:var(--aleu-navy);white-space:nowrap}
#clinicalThemeScreen .ct-cta:hover{border-color:var(--aleu-teal);background:var(--aleu-teal-soft)}
@media(max-width:760px){
  #clinicalThemeScreen{padding:20px 18px 48px}
  #clinicalThemeScreen .ct-head{flex-direction:column;align-items:flex-start;gap:14px}
  #clinicalThemeScreen h2{font-size:21px}
}

/* ---- Temática clínica principal: filtro destacado del Explorador ---- */
#exploradorScreen .primary-facet{margin:0 0 18px;padding:0 0 18px;
  border-bottom:1px solid var(--aleu-border)}
#exploradorScreen .primary-facet h3{font-size:12px;letter-spacing:.06em;text-transform:uppercase;
  font-weight:600;color:var(--aleu-navy);margin:0 0 12px}
#exploradorScreen .pt-list{display:flex;flex-direction:column;gap:7px}
#exploradorScreen .pt{display:flex;align-items:center;justify-content:space-between;gap:10px;
  width:100%;text-align:left;padding:11px 13px;cursor:pointer;font-family:var(--sans);
  font-size:13px;font-weight:500;color:var(--aleu-navy);background:var(--aleu-white);
  border:1px solid var(--aleu-border-soft);border-radius:var(--r-md);
  transition:border-color .15s ease,background .15s ease}
#exploradorScreen .pt:hover{border-color:var(--aleu-teal);background:var(--aleu-teal-soft)}
#exploradorScreen .pt.on{border-color:var(--aleu-teal);background:var(--aleu-teal-soft);
  box-shadow:inset 0 0 0 1px var(--aleu-teal)}
#exploradorScreen .pt .pt-n{font-family:var(--mono);font-size:11.5px;color:var(--aleu-muted)}
#exploradorScreen .pt.on .pt-n{color:var(--aleu-teal-dark)}
#exploradorScreen .afinar{font-size:12px;letter-spacing:.06em;text-transform:uppercase;
  font-weight:600;color:var(--aleu-muted);margin:0 0 12px}

/* La colección temática apila las cards igual que #results del Explorador. */
#clinicalThemeScreen #ctResults{display:block}
