/* Radar ABA by NoteCoach
   Paleta de NoteCoach (notecoach.app y sus motion): verde #16A34A, verde vivo #4ADE80,
   tinta #0A0F0D, fondo #FAFAF8, ámbar #F59E0B para avisos y rojo solo en detalles.
   Movimiento con los principios de Emil Kowalski: ease-out propio, animaciones cortas e
   interrumpibles (transiciones, no keyframes, en lo interactivo), nada sale de escala 0,
   botones que ceden al pulsar, hover solo con ratón y respeto a «reducir movimiento». */

:root {
  --papel: #fafaf8;
  --papel-2: #f3f6f4;
  --tarjeta: #ffffff;
  --tinta: #0a0f0d;
  --tinta-2: #4f5d56;
  --tinta-3: #7d8a83;
  --linea: #e6ece9;
  --verde: #16a34a;
  --verde-vivo: #4ade80;
  --verde-tinte: #dcfce7;
  --verde-claro: #f0fdf4;
  --menta: #86efac;
  --noche: #0a0f0d;
  --noche-2: #0d1a13;
  --ambar: #f59e0b;
  --rojo: #ef4444;

  --c-medicaid: #16a34a;
  --c-aseguradoras: #475569;
  --c-cpt: #4d7c0f;
  --c-oig: #d97706;
  --c-bacb: #0e7490;
  --c-federal: #0f766e;

  --sans: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --serif: "Instrument Serif", Georgia, serif;
  --mono: "JetBrains Mono", ui-monospace, monospace;

  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
  --ease-cajon: cubic-bezier(0.32, 0.72, 0, 1);

  --radio: 16px;
  --sombra: 0 1px 2px #0a0f0d0a, 0 8px 24px -12px #0a0f0d1f;
  --sombra-alta: 0 2px 4px #0a0f0d0d, 0 24px 48px -20px #16a34a55;
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --papel: #0a0f0d; --papel-2: #0f1713; --tarjeta: #111a15; --tinta: #f0fff5; --tinta-2: #a9b8b0; --tinta-3: #73827a;
    --linea: #1f2b25; --verde-tinte: #12301f; --verde-claro: #0f1f16;
    --c-medicaid: #4ade80; --c-aseguradoras: #94a3b8; --c-cpt: #a3e635; --c-oig: #fbbf24; --c-bacb: #22d3ee; --c-federal: #2dd4bf;
    --sombra: 0 1px 2px #0006, 0 8px 24px -12px #0009; --sombra-alta: 0 2px 4px #0006, 0 24px 48px -20px #4ade8040;
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --papel: #0a0f0d; --papel-2: #0f1713; --tarjeta: #111a15; --tinta: #f0fff5; --tinta-2: #a9b8b0; --tinta-3: #73827a;
  --linea: #1f2b25; --verde-tinte: #12301f; --verde-claro: #0f1f16;
  --c-medicaid: #4ade80; --c-aseguradoras: #94a3b8; --c-cpt: #a3e635; --c-oig: #fbbf24; --c-bacb: #22d3ee; --c-federal: #2dd4bf;
  --sombra: 0 1px 2px #0006, 0 8px 24px -12px #0009; --sombra-alta: 0 2px 4px #0006, 0 24px 48px -20px #4ade8040;
  color-scheme: dark;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 84px; -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--papel); color: var(--tinta);
  font-family: var(--sans); font-size: 17px; line-height: 1.6;
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
  transition: background-color .3s var(--ease-out), color .3s var(--ease-out);
}
body.cajon-abierto { overflow: hidden; }
a { color: inherit; }
h1, h2, h3 { margin: 0; line-height: 1.08; letter-spacing: -0.025em; }
h2 { font-size: clamp(30px, 4vw, 46px); font-weight: 800; }
button { font: inherit; color: inherit; }
kbd { font-family: var(--mono); font-size: 11px; padding: 1px 6px; border-radius: 6px; border: 1px solid currentColor; opacity: .55; }
:focus-visible { outline: 2px solid var(--verde-vivo); outline-offset: 3px; border-radius: 8px; }
.oculto { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.saltar { position: fixed; left: 16px; top: -60px; z-index: 50; padding: 10px 14px; border-radius: 10px; background: var(--verde); color: #fff; font-weight: 700; transition: top .2s var(--ease-out); }
.saltar:focus { top: 12px; }

/* ---------- Botones (ceden al pulsar) ---------- */
.boton, .boton-icono, .chip, .boton-texto, .destacada, .tarjeta-boton {
  -webkit-tap-highlight-color: transparent; cursor: pointer;
  transition: transform .16s var(--ease-out), background-color .2s var(--ease-out), border-color .2s var(--ease-out), color .2s var(--ease-out), box-shadow .25s var(--ease-out);
}
.boton:active, .boton-icono:active, .chip:active, .boton-texto:active { transform: scale(0.97); }
.boton {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 0 20px;
  border: 0; border-radius: 12px; background: var(--verde); color: #fff; font-weight: 700; font-size: 15px; text-decoration: none;
  box-shadow: inset 0 1px 0 #ffffff33, 0 6px 16px -8px #16a34a99;
}
.boton-sec { background: var(--papel-2); color: var(--tinta); box-shadow: inset 0 0 0 1px var(--linea); }
.boton-icono {
  display: inline-flex; align-items: center; gap: 6px; height: 36px; min-width: 36px; padding: 0 9px; justify-content: center;
  border: 1px solid var(--linea); border-radius: 10px; background: var(--tarjeta); color: inherit;
}
.boton-icono svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.boton-texto { border: 0; background: none; padding: 6px 2px; font-weight: 700; color: var(--verde); text-decoration: underline; text-underline-offset: 3px; }

@media (hover: hover) and (pointer: fine) {
  .boton:hover { background: #15803d; }
  .boton-sec:hover { background: var(--verde-tinte); }
  .boton-icono:hover { background: var(--verde-claro); border-color: #16a34a55; }
}

/* ---------- Barra ---------- */
.barra {
  position: sticky; top: 0; z-index: 30;
  display: flex; align-items: center; gap: 24px; height: 68px;
  padding: 0 clamp(16px, 4vw, 48px);
  background: color-mix(in srgb, var(--papel) 78%, transparent);
  backdrop-filter: saturate(1.4) blur(14px); -webkit-backdrop-filter: saturate(1.4) blur(14px);
  color: var(--tinta); border-bottom: 1px solid transparent;
  transition: height .3s var(--ease-out), background-color .3s var(--ease-out);
}
.barra.compacta { height: 56px; background: color-mix(in srgb, var(--papel) 92%, transparent); border-bottom-color: var(--linea); box-shadow: 0 6px 20px -16px #0a0f0d40; }
.marca { display: flex; align-items: center; gap: 11px; text-decoration: none; white-space: nowrap; }
.marca-dial { width: 34px; height: 34px; flex: none; }
.marca-dial circle { fill: none; stroke: #16a34a55; stroke-width: 1.4; }
.marca-haz { fill: #16a34a40; transform-origin: 20px 20px; animation: girar 4s linear infinite; }
.marca-blip { fill: var(--verde-vivo) !important; stroke: none !important; animation: latido 2s var(--ease-in-out) infinite; }
.marca-centro { fill: var(--verde-vivo) !important; stroke: none !important; }
.marca-texto { display: grid; line-height: 1; font-size: 20px; font-weight: 800; letter-spacing: -0.02em; }
.marca-texto b { color: var(--verde); }
.marca-texto small { margin-top: 4px; font-family: var(--mono); font-size: 10px; font-weight: 400; letter-spacing: .08em; text-transform: uppercase; color: var(--tinta-3); }
.menu { position: relative; display: flex; gap: 2px; margin-left: auto; padding: 4px; border-radius: 12px; background: var(--papel-2); font-size: 14px; font-weight: 600; isolation: isolate; }
.menu-pildora { position: absolute; z-index: -1; top: 4px; bottom: 4px; left: 0; width: 0; border-radius: 9px; background: var(--tarjeta); box-shadow: 0 1px 2px #0a0f0d14, 0 2px 8px -2px #0a0f0d1f; transition: transform .35s var(--ease-out), width .35s var(--ease-out); }
.menu a[aria-current="page"] { color: var(--tinta); }
.menu a { padding: 8px 12px; border-radius: 9px; text-decoration: none; color: var(--tinta-2); transition: color .2s var(--ease-out), background-color .2s var(--ease-out); }
@media (hover: hover) and (pointer: fine) { .menu a:hover { color: var(--tinta); } }
.barra-acciones { display: flex; align-items: center; gap: 8px; }
#tema { position: relative; width: 36px; }
#tema svg { position: absolute; transition: transform .35s var(--ease-out), opacity .2s var(--ease-out), filter .35s var(--ease-out); }
#tema .luna { opacity: 0; transform: scale(.5) rotate(-45deg); filter: blur(4px); }
:root[data-theme="dark"] #tema .sol { opacity: 0; transform: scale(.5) rotate(45deg); filter: blur(4px); }
:root[data-theme="dark"] #tema .luna { opacity: 1; transform: none; filter: none; }
.vivo { display: flex; align-items: center; gap: 8px; padding: 0 10px; height: 36px; border-radius: 10px; background: var(--verde-claro); border: 1px solid #16a34a33; font-family: var(--mono); font-size: 12px; white-space: nowrap; color: var(--verde); }
.vivo i { width: 7px; height: 7px; border-radius: 50%; background: var(--verde-vivo); animation: pulso 2s infinite; }

/* ---------- Portada ---------- */
.portada {
  position: relative; overflow: hidden; isolation: isolate;
  display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr); gap: clamp(28px, 5vw, 72px); align-items: center;
  padding: clamp(44px, 7vw, 104px) clamp(16px, 4vw, 48px) clamp(52px, 7vw, 108px);
  background: var(--papel); color: var(--tinta);
}
.portada-fondo {
  position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background:
    radial-gradient(50% 70% at 78% 45%, #4ade802e 0%, transparent 62%),
    radial-gradient(35% 45% at 8% 100%, #16a34a12 0%, transparent 70%),
    linear-gradient(#0a0f0d08 1px, transparent 1px) 0 0 / 100% 48px,
    linear-gradient(90deg, #0a0f0d08 1px, transparent 1px) 0 0 / 48px 100%;
  mask-image: radial-gradient(90% 90% at 60% 40%, #000 40%, transparent 100%);
}
.antetitulo { display: flex; align-items: center; gap: 10px; margin: 0 0 22px; font-family: var(--mono); font-size: 12.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--verde); }
.antetitulo .punto { width: 6px; height: 6px; border-radius: 50%; background: currentColor; box-shadow: 0 0 10px currentColor; }
.portada h1 { font-size: clamp(40px, 6.2vw, 80px); font-weight: 800; letter-spacing: -0.045em; line-height: 1.02; }
.portada h1 em { font-family: var(--serif); font-weight: 400; font-style: italic; letter-spacing: -0.01em; color: var(--verde); padding-right: .06em; }
.titulo-palabras .pal { display: inline-block; opacity: 0; transform: translateY(18px); filter: blur(10px); transition: opacity .7s var(--ease-out), transform .9s var(--ease-out), filter .7s var(--ease-out); }
.titulo-palabras.listo .pal { opacity: 1; transform: none; filter: none; }
.entradilla { font-size: clamp(17px, 1.5vw, 20px); color: var(--tinta-2); max-width: 33em; margin: 24px 0 32px; }
.portada-texto .entradilla, .portada-texto .antetitulo, .destacada { opacity: 0; transform: translateY(14px); transition: opacity .8s var(--ease-out), transform .8s var(--ease-out); }
.portada.lista .antetitulo { opacity: 1; transform: none; }
.portada.lista .entradilla { opacity: 1; transform: none; transition-delay: .35s; }
.portada.lista .destacada { opacity: 1; transform: none; transition-delay: .5s; }

.destacada {
  position: relative; display: grid; gap: 6px; width: 100%; max-width: 560px; padding: 18px 54px 18px 20px; text-align: left;
  border: 1px solid var(--linea); border-radius: var(--radio); background: var(--tarjeta); box-shadow: var(--sombra); overflow: hidden;
}
.destacada::after {
  content: ""; position: absolute; inset: 0; transform: translateX(-110%);
  background: linear-gradient(100deg, transparent 30%, #4ade8026 50%, transparent 70%);
  transition: transform .8s var(--ease-out);
}
.destacada-etq { font-family: var(--mono); font-size: 11px; text-transform: uppercase; letter-spacing: .08em; color: #b45309; }
.destacada-tit { font-size: 19px; font-weight: 700; line-height: 1.3; letter-spacing: -0.01em; }
.destacada-meta { font-family: var(--mono); font-size: 12px; color: var(--tinta-3); }
.destacada-flecha { position: absolute; right: 20px; top: 50%; translate: 0 -50%; font-size: 20px; color: var(--verde); transition: transform .25s var(--ease-out); }
.destacada:active { transform: scale(0.985); }
@media (hover: hover) and (pointer: fine) {
  .destacada:hover { border-color: #16a34a66; box-shadow: var(--sombra-alta); }
  .destacada:hover::after { transform: translateX(110%); }
  .destacada:hover .destacada-flecha { transform: translateX(4px); }
}

/* Radar (canvas) */
.portada-lado { display: grid; gap: 16px; align-content: center; width: 100%; max-width: 560px; justify-self: end; opacity: 0; transform: translateY(16px); filter: blur(6px); transition: opacity .9s var(--ease-out), transform 1s var(--ease-out), filter .9s var(--ease-out); }
.portada.lista .portada-lado { opacity: 1; transform: none; filter: none; transition-delay: .2s; }
.radar-tarjeta { display: grid; grid-template-columns: 200px 1fr; gap: 20px; align-items: center; padding: 16px 20px 16px 16px; border: 1px solid var(--linea); border-radius: 20px; background: var(--tarjeta); box-shadow: var(--sombra); }
.radar-caja { position: relative; width: 100%; }
.radar-datos .sobre { margin-bottom: 10px; }
.radar-cifras { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.radar-cifras li { display: flex; align-items: baseline; gap: 8px; font-size: 14.5px; color: var(--tinta-2); line-height: 1.3; }
.radar-cifras b { min-width: 2.6ch; font-size: 22px; font-weight: 800; letter-spacing: -0.03em; color: var(--tinta); font-variant-numeric: tabular-nums; }
.radar-cifras li.aviso-fecha b { color: #b45309; }
.radar-datos .escaneo { text-align: left; margin-top: 12px; font-size: 11px; }

/* Guía rápida */
.guia { padding: 18px 18px 14px; border: 1px solid var(--linea); border-radius: 20px; background: var(--tarjeta); box-shadow: var(--sombra); }
.guia-cabeza { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 12px; margin-bottom: 12px; }
.guia-tit { font-size: 20px; font-weight: 800; letter-spacing: -0.02em; }
.guia-sub { font-size: 12.5px; color: var(--tinta-3); }
.pestanas { position: relative; display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; padding: 4px; border-radius: 12px; background: var(--papel-2); isolation: isolate; }
.pestana { position: relative; z-index: 1; height: 34px; border: 0; border-radius: 9px; background: none; font-size: 13.5px; font-weight: 700; color: var(--tinta-3); cursor: pointer; transition: color .2s var(--ease-out), transform .16s var(--ease-out); -webkit-tap-highlight-color: transparent; }
.pestana:active { transform: scale(0.97); }
.pestana[aria-selected="true"] { color: var(--tinta); }
@media (hover: hover) and (pointer: fine) { .pestana:not([aria-selected="true"]):hover { color: var(--tinta-2); } }
.pestana-indicador { position: absolute; z-index: 0; top: 4px; bottom: 4px; left: 0; width: 0; border-radius: 9px; background: var(--tarjeta); box-shadow: 0 1px 2px #0a0f0d14, 0 2px 8px -2px #0a0f0d1f; transition: transform .35s var(--ease-out), width .35s var(--ease-out); }
.guia-panel { min-height: 240px; margin-top: 12px; outline: none; }
.guia-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.guia-item { display: grid; grid-template-columns: auto 1fr; gap: 2px 12px; padding: 10px 6px; border-bottom: 1px dashed var(--linea); opacity: 0; transform: translateY(6px); filter: blur(3px); transition: opacity .35s var(--ease-out), transform .45s var(--ease-out), filter .35s var(--ease-out); }
.guia-item:last-child { border-bottom: 0; }
.guia-panel.listo .guia-item { opacity: 1; transform: none; filter: none; }
.guia-icono { grid-row: span 2; width: 30px; height: 30px; display: grid; place-items: center; border-radius: 9px; background: var(--verde-claro); color: var(--verde); font-family: var(--mono); font-size: 11px; font-weight: 600; }
.guia-item b { font-size: 14.5px; line-height: 1.3; }
.guia-item p { margin: 0; font-size: 14px; line-height: 1.45; color: var(--tinta-2); }
.guia-item a { font-family: var(--mono); font-size: 11px; color: var(--verde); text-decoration: none; white-space: nowrap; }
.guia-item a:hover { text-decoration: underline; }
.guia-item .ojo { color: #b45309; font-weight: 600; }
.guia-pie { margin: 8px 0 0; font-family: var(--mono); font-size: 10.5px; color: var(--tinta-3); }
.radar { display: block; width: 100%; aspect-ratio: 1; }
.radar.sobre-blip { cursor: pointer; }
.radar-tip {
  position: absolute; z-index: 3; max-width: 260px; padding: 9px 12px; border-radius: 12px; pointer-events: none;
  background: var(--tinta); color: var(--papel); font-size: 13px; font-weight: 600; line-height: 1.3; box-shadow: 0 12px 30px -10px #0006;
  transform-origin: bottom center; translate: -50% calc(-100% - 16px);
  opacity: 0; transform: scale(.96); transition: opacity .15s var(--ease-out), transform .15s var(--ease-out);
}
.radar-tip.visible { opacity: 1; transform: none; }
.radar-tip small { display: block; margin-top: 3px; font-family: var(--mono); font-size: 10.5px; font-weight: 400; color: inherit; opacity: .65; text-transform: uppercase; letter-spacing: .05em; }
.escaneo { margin: 10px 0 0; text-align: center; font-family: var(--mono); font-size: 12px; color: var(--tinta-3); min-height: 1.6em; }

/* ---------- Cinta CPT ---------- */
.cinta { overflow: hidden; background: var(--verde); color: #fff; border-block: 0; mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); }
.cinta-pista { display: flex; width: max-content; animation: cinta 50s linear infinite; }
.cinta-pista span { font-family: var(--mono); font-size: 13.5px; padding: 12px 26px; white-space: nowrap; }
.cinta-pista b { font-weight: 600; margin-right: 8px; color: #dcfce7; }
.cinta-pista span::after { content: "◆"; margin-left: 52px; font-size: 8px; vertical-align: 2px; opacity: .5; }
@media (hover: hover) { .cinta:hover .cinta-pista { animation-play-state: paused; } }

/* ---------- Cifras ---------- */
.cifras { padding: clamp(36px, 5vw, 64px) clamp(16px, 4vw, 48px) 0; max-width: 1280px; margin: 0 auto; }
.cifras-rejilla { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 16px; }
.cifra {
  position: relative; display: grid; gap: 4px; padding: 22px 22px 18px; text-align: left; overflow: hidden;
  border: 1px solid var(--linea); border-radius: var(--radio); background: var(--tarjeta); box-shadow: var(--sombra); cursor: pointer;
  transition: transform .16s var(--ease-out), border-color .2s var(--ease-out), box-shadow .25s var(--ease-out);
}
.cifra:active { transform: scale(0.98); }
.cifra-num { font-size: clamp(44px, 5vw, 60px); font-weight: 800; letter-spacing: -0.05em; line-height: 1; color: var(--verde); font-variant-numeric: tabular-nums; }
.cifra-txt { font-size: 15px; color: var(--tinta-2); line-height: 1.4; }
.cifra-src { margin-top: 8px; font-family: var(--mono); font-size: 11px; color: var(--tinta-3); text-transform: uppercase; letter-spacing: .05em; }
.cifra-barra { position: absolute; left: 0; bottom: 0; height: 3px; width: 100%; background: linear-gradient(90deg, var(--verde), var(--verde-vivo)); transform: scaleX(0); transform-origin: left; transition: transform 1.4s var(--ease-out); }
.cifra.visible .cifra-barra { transform: scaleX(1); }
@media (hover: hover) and (pointer: fine) { .cifra:hover { border-color: #16a34a66; box-shadow: var(--sombra-alta); } }

/* ---------- Secciones ---------- */
.seccion { padding: clamp(52px, 7vw, 92px) clamp(16px, 4vw, 48px); max-width: 1280px; margin: 0 auto; }
.seccion-cabeza { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 18px; margin-bottom: 26px; }
.sobre { margin: 0 0 8px; font-family: var(--mono); font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--verde); }

/* Buscador y filtros */
.buscador {
  display: flex; align-items: center; gap: 10px; width: min(100%, 380px); height: 46px; padding: 0 14px;
  border: 1px solid var(--linea); border-radius: 12px; background: var(--tarjeta); box-shadow: var(--sombra);
  transition: border-color .2s var(--ease-out), box-shadow .2s var(--ease-out);
}
.buscador:focus-within { border-color: var(--verde); box-shadow: 0 0 0 4px #16a34a22; }
.buscador svg { width: 18px; height: 18px; flex: none; fill: none; stroke: var(--tinta-3); stroke-width: 2; stroke-linecap: round; }
.buscador input { flex: 1; min-width: 0; border: 0; outline: 0; background: none; color: var(--tinta); font: 500 15px var(--sans); }
.buscador input::placeholder { color: var(--tinta-3); }
.buscador kbd { color: var(--tinta-3); }
.controles { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 24px; }
.filtros { display: flex; flex-wrap: wrap; gap: 8px; }
.chip {
  display: inline-flex; align-items: center; gap: 8px; height: 36px; padding: 0 14px; border-radius: 999px;
  border: 1px solid var(--linea); background: var(--tarjeta); color: var(--tinta-2); font-size: 14px; font-weight: 600;
}
.chip i { width: 8px; height: 8px; border-radius: 50%; background: var(--color); transition: transform .2s var(--ease-out); }
.chip span { font-family: var(--mono); font-size: 11px; color: var(--tinta-3); }
.chip.sin:not([aria-pressed="true"]) { opacity: .5; }
.chip[aria-pressed="true"] { background: var(--tinta); color: var(--papel); border-color: var(--tinta); }
.chip[aria-pressed="true"] span { color: inherit; opacity: .6; }
.chip[aria-pressed="true"] i { transform: scale(1.25); }
@media (hover: hover) and (pointer: fine) { .chip:not([aria-pressed="true"]):hover { border-color: var(--tinta-3); color: var(--tinta); } }

.interruptor { display: inline-flex; align-items: center; gap: 10px; margin-left: auto; font-size: 14px; font-weight: 600; cursor: pointer; user-select: none; }
.interruptor input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.riel { position: relative; width: 40px; height: 24px; border-radius: 999px; background: var(--linea); transition: background-color .2s var(--ease-out); }
.bola { position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px #0003; transition: transform .25s var(--ease-out), width .2s var(--ease-out); }
.interruptor:active .bola { width: 22px; }
.interruptor input:checked + .riel { background: var(--verde); }
.interruptor input:checked + .riel .bola { transform: translateX(16px); }
.interruptor:active input:checked + .riel .bola { transform: translateX(12px); }
.interruptor input:focus-visible + .riel { outline: 2px solid var(--verde-vivo); outline-offset: 3px; }
.conteo { margin: 18px 0 16px; font-family: var(--mono); font-size: 12px; color: var(--tinta-3); }

/* Tarjetas */
.rejilla { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 360px), 1fr)); gap: 18px; }
.tarjeta {
  --color: var(--c-federal);
  opacity: 0; transform: translateY(16px); filter: blur(4px);
  transition: opacity .6s var(--ease-out), transform .6s var(--ease-out), filter .6s var(--ease-out);
}
.tarjeta.visible { opacity: 1; transform: none; filter: none; }
.tarjeta-boton {
  position: relative; display: flex; flex-direction: column; gap: 12px; width: 100%; height: 100%; padding: 22px 22px 18px; text-align: left;
  border: 1px solid var(--linea); border-radius: var(--radio); background: var(--tarjeta); box-shadow: var(--sombra); overflow: hidden;
}
.tarjeta-boton::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--color); transform: scaleY(0); transform-origin: top; transition: transform .7s .15s var(--ease-out); }
.tarjeta.visible .tarjeta-boton::before { transform: scaleY(1); }
.tarjeta-boton:active { transform: scale(0.985); }
@media (hover: hover) and (pointer: fine) {
  .tarjeta-boton:hover { border-color: color-mix(in srgb, var(--color) 45%, var(--linea)); box-shadow: var(--sombra-alta); transform: translateY(-2px); }
  .tarjeta-boton:hover .tarjeta-mas span { transform: translateX(3px); }
}
.tarjeta.resaltada .tarjeta-boton { border-color: var(--color); box-shadow: 0 0 0 4px color-mix(in srgb, var(--color) 22%, transparent), var(--sombra-alta); }
.tarjeta-cabeza { display: flex; align-items: center; gap: 8px; font-family: var(--mono); font-size: 11.5px; }
.etq { color: var(--color); font-weight: 600; text-transform: uppercase; letter-spacing: .06em; }
.fl { padding: 2px 7px; border-radius: 6px; background: var(--verde-tinte); color: var(--c-medicaid); font-family: var(--mono); font-size: 11px; }
.fecha { margin-left: auto; color: var(--tinta-3); }
.tarjeta-tit { font-size: 21px; font-weight: 750; line-height: 1.22; letter-spacing: -0.02em; }
.tarjeta-res { color: var(--tinta-2); font-size: 15.5px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.parati { display: block; padding: 12px 14px; border-radius: 12px; background: var(--verde-claro); border: 1px solid color-mix(in srgb, var(--verde) 16%, transparent); }
.parati b { display: block; margin-bottom: 2px; font-size: 11.5px; text-transform: uppercase; letter-spacing: .06em; color: var(--verde); }
.parati-txt, .parati p { margin: 0; font-size: 15px; line-height: 1.5; }
.tarjeta-pie { margin-top: auto; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding-top: 10px; border-top: 1px dashed var(--linea); font-family: var(--mono); font-size: 11.5px; color: var(--tinta-3); }
.tarjeta-mas { font-family: var(--sans); font-size: 13.5px; font-weight: 700; color: var(--verde); }
.tarjeta-mas span { display: inline-block; transition: transform .2s var(--ease-out); }
.certeza::before { content: ""; display: inline-block; width: 7px; height: 7px; margin-right: 7px; border-radius: 50%; background: var(--verde-vivo); box-shadow: 0 0 8px var(--verde-vivo); vertical-align: 1px; }
.certeza[data-c="MEDIA"]::before { background: var(--ambar); box-shadow: none; }
.vacio { padding: 36px; border: 1px dashed var(--linea); border-radius: var(--radio); text-align: center; color: var(--tinta-2); }
.vacio p { margin: 0 0 6px; }

/* Fechas que vienen */
.linea-tiempo { position: relative; list-style: none; margin: 0; padding: 0 0 0 32px; display: grid; gap: 16px; }
.linea-tiempo::before { content: ""; position: absolute; left: 9px; top: 8px; bottom: 8px; width: 2px; border-radius: 2px; background: var(--linea); }
.linea-tiempo::after { content: ""; position: absolute; left: 9px; top: 8px; bottom: 8px; width: 2px; border-radius: 2px; background: linear-gradient(var(--verde-vivo), var(--verde)); transform: scaleY(var(--avance, 0)); transform-origin: top; transition: transform .2s linear; }
.hito { position: relative; display: grid; grid-template-columns: 112px 1fr auto; align-items: center; gap: 18px; padding: 18px 20px; border: 1px solid var(--linea); border-radius: var(--radio); background: var(--tarjeta); box-shadow: var(--sombra); }
.hito::before { content: ""; position: absolute; left: -29px; top: 50%; width: 14px; height: 14px; margin-top: -7px; border-radius: 50%; background: var(--papel); border: 2px solid var(--linea); transition: border-color .4s var(--ease-out), background-color .4s var(--ease-out), box-shadow .4s var(--ease-out); }
.hito.visible::before { border-color: var(--verde); background: var(--verde-vivo); box-shadow: 0 0 0 5px #4ade8026; }
.hito-fecha { font-weight: 800; font-size: 22px; letter-spacing: -0.03em; line-height: 1.05; }
.hito-fecha small { display: block; font-family: var(--mono); font-size: 11px; font-weight: 400; letter-spacing: .04em; color: var(--tinta-3); }
.hito-tit { margin: 0; font-weight: 600; font-size: 16px; line-height: 1.35; }
.hito-tit button { all: unset; cursor: pointer; }
.hito-tit button:focus-visible { outline: 2px solid var(--verde-vivo); outline-offset: 3px; border-radius: 6px; }
.hito-src { display: block; margin-top: 2px; font-family: var(--mono); font-size: 11px; color: var(--tinta-3); text-transform: uppercase; letter-spacing: .05em; }
.faltan { display: grid; justify-items: end; padding: 8px 12px; border-radius: 12px; background: #f59e0b1a; color: #b45309; line-height: 1; }
.faltan b { font-size: 26px; font-weight: 800; letter-spacing: -0.04em; font-variant-numeric: tabular-nums; }
.faltan small { margin-top: 4px; font-family: var(--mono); font-size: 10.5px; text-transform: uppercase; letter-spacing: .06em; }
:root[data-theme="dark"] .faltan { color: #fbbf24; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .faltan { color: #fbbf24; } }

/* Método */
.pasos { list-style: none; padding: 0; margin: 0 0 26px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 16px; }
.pasos li { position: relative; overflow: hidden; padding: 24px; border-radius: var(--radio); background: var(--tarjeta); color: var(--tinta); border: 1px solid var(--linea); box-shadow: var(--sombra); }
.pasos li::after { content: ""; position: absolute; right: -46px; bottom: -46px; width: 150px; height: 150px; border-radius: 50%; border: 1px solid #16a34a33; box-shadow: 0 0 0 24px #16a34a0c, 0 0 0 48px #16a34a07; }
.paso-num { font-family: var(--mono); font-size: 12.5px; color: var(--verde); }
.pasos h3 { margin: 10px 0 8px; font-size: 21px; font-weight: 750; }
.pasos p { margin: 0; color: var(--tinta-2); font-size: 15.5px; }
.pasos b { color: var(--verde); }
.aviso { max-width: 52em; margin: 0; padding: 14px 16px; border-radius: 12px; border: 1px solid #f59e0b40; background: #f59e0b0f; font-size: 14.5px; color: var(--tinta-2); }

/* Boletín */
.boletin {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 440px); gap: 24px; align-items: center;
  margin-bottom: clamp(24px, 4vw, 48px); padding: clamp(28px, 4vw, 44px) !important; border-radius: 24px;
  background: radial-gradient(70% 120% at 100% 0%, #4ade8033, transparent 60%), var(--verde-claro); color: var(--tinta); border: 1px solid #16a34a26; max-width: min(1184px, calc(100% - 32px));
}
.boletin h2 { font-size: clamp(26px, 3.2vw, 38px); }
.boletin p { margin: 8px 0 0; color: var(--tinta-2); }
.boletin-form { display: flex; gap: 8px; padding: 6px; border-radius: 14px; background: var(--tarjeta); border: 1px solid var(--linea); box-shadow: var(--sombra); }
.boletin-form input { flex: 1; min-width: 0; height: 44px; padding: 0 12px; border: 0; outline: 0; background: none; color: var(--tinta); font: 500 15px var(--sans); }
.boletin-form input::placeholder { color: var(--tinta-3); }
.boletin-form.error { animation: sacudir .4s var(--ease-out); border-color: #ef444499; }

/* Fuentes */
.fuentes { padding-top: 0; }
.fuentes-lista { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr)); gap: 10px; }
.fuentes-lista a { display: flex; justify-content: space-between; align-items: center; gap: 10px; min-height: 48px; padding: 10px 14px; border: 1px solid var(--linea); border-radius: 12px; background: var(--tarjeta); text-decoration: none; font-weight: 600; font-size: 14.5px; transition: border-color .2s var(--ease-out), transform .16s var(--ease-out); }
.fuentes-lista a:active { transform: scale(0.98); }
@media (hover: hover) and (pointer: fine) { .fuentes-lista a:hover { border-color: var(--verde); } }
.fuentes-lista small { font-family: var(--mono); font-weight: 400; font-size: 10.5px; padding: 2px 7px; border-radius: 6px; background: var(--papel-2); color: var(--tinta-3); text-transform: uppercase; letter-spacing: .05em; }

.pie { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 24px; padding: 26px clamp(16px, 4vw, 48px); background: var(--papel-2); border-top: 1px solid var(--linea); color: var(--tinta-3); font-family: var(--mono); font-size: 12px; }
.pie p { margin: 0; }
.pie-marca { display: flex; align-items: baseline; gap: 10px; font-family: var(--sans); font-size: 17px; font-weight: 800; color: var(--tinta); }
.pie-marca b { color: var(--verde); }
.pie-marca a { font-family: var(--mono); font-size: 11px; font-weight: 400; text-transform: uppercase; letter-spacing: .08em; color: var(--tinta-3); }

/* Aparición al hacer scroll */
.revelar { opacity: 0; transform: translateY(16px); transition: opacity .7s var(--ease-out), transform .7s var(--ease-out); }
.revelar.visible { opacity: 1; transform: none; }

/* ---------- Cajón (estilo Vaul) ---------- */
.cajon { position: fixed; inset: 0; z-index: 60; }
.cajon-velo { position: absolute; inset: 0; background: #0a0f0d80; backdrop-filter: blur(2px); opacity: 0; transition: opacity .4s var(--ease-cajon); }
.cajon-hoja {
  position: absolute; top: 12px; right: 12px; bottom: 12px; width: min(560px, calc(100% - 24px)); overflow-y: auto; overscroll-behavior: contain;
  padding: 26px 28px 30px; border-radius: 22px; background: var(--tarjeta); color: var(--tinta); box-shadow: 0 30px 80px -20px #000a; outline: none;
  transform: translateX(calc(100% + 24px)); transition: transform .5s var(--ease-cajon);
}
.cajon.abierto .cajon-velo { opacity: 1; }
.cajon.abierto .cajon-hoja { transform: none; }
.cajon-asa { display: none; }
.cajon-cabeza { display: flex; align-items: center; gap: 8px; font-family: var(--mono); font-size: 12px; margin-bottom: 16px; }
.cajon-cabeza time { color: var(--tinta-3); }
.cerrar { margin-left: auto; border-color: var(--linea); background: var(--papel-2); color: var(--tinta); }
.cajon-hoja h2 { font-size: clamp(24px, 3vw, 30px); line-height: 1.15; }
.cajon-res { color: var(--tinta-2); margin: 14px 0 18px; }
.cita { margin: 22px 0 6px; padding: 18px 20px; border-radius: 14px; background: var(--papel-2); position: relative; }
.cita::before { content: "“"; position: absolute; left: 12px; top: -8px; font-family: var(--serif); font-size: 64px; line-height: 1; color: var(--verde); opacity: .5; }
.cita blockquote { margin: 0; font-family: var(--serif); font-style: italic; font-size: 21px; line-height: 1.35; }
.cita figcaption { margin-top: 10px; font-family: var(--mono); font-size: 11.5px; color: var(--tinta-3); }
.cita figcaption::after { content: " · original en inglés"; }
.cajon-sub { margin: 22px 0 8px; font-size: 13px; font-family: var(--mono); font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: var(--tinta-3); }
.cajon-fuentes { margin: 0; padding: 0; list-style: none; display: grid; gap: 6px; }
.cajon-fuentes a { display: flex; justify-content: space-between; gap: 12px; padding: 10px 12px; border-radius: 10px; border: 1px solid var(--linea); text-decoration: none; font-weight: 600; font-size: 14.5px; }
.cajon-fuentes a small { font-family: var(--mono); font-weight: 400; color: var(--tinta-3); white-space: nowrap; }
@media (hover: hover) and (pointer: fine) { .cajon-fuentes a:hover { border-color: var(--verde); } }
.cajon-hoja > .certeza { margin: 18px 0 0; font-family: var(--mono); font-size: 12px; color: var(--tinta-2); }
.cajon-acciones { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
.cajon-hoja > * { opacity: 0; transform: translateY(8px); transition: opacity .35s var(--ease-out), transform .45s var(--ease-out); }
.cajon.abierto .cajon-hoja > * { opacity: 1; transform: none; }
.cajon.abierto .cajon-hoja > :nth-child(3) { transition-delay: .06s; }
.cajon.abierto .cajon-hoja > :nth-child(4) { transition-delay: .1s; }
.cajon.abierto .cajon-hoja > :nth-child(5) { transition-delay: .14s; }
.cajon.abierto .cajon-hoja > :nth-child(n+6) { transition-delay: .18s; }

/* ---------- Avisos (estilo Sonner) ---------- */
.avisos { position: fixed; left: 50%; bottom: max(20px, env(safe-area-inset-bottom)); z-index: 80; display: grid; gap: 8px; translate: -50% 0; pointer-events: none; }
.aviso-toast {
  display: flex; align-items: center; gap: 10px; min-width: 260px; max-width: calc(100vw - 32px); padding: 12px 16px; border-radius: 14px;
  background: var(--noche); color: #f0fff5; font-size: 14px; font-weight: 600; box-shadow: 0 16px 40px -12px #000a; border: 1px solid #ffffff14;
  transform: translateY(16px) scale(.96); opacity: 0; transition: transform .4s var(--ease-out), opacity .3s var(--ease-out);
}
.aviso-toast.visible { transform: none; opacity: 1; }
.aviso-toast.sale { transform: translateY(8px) scale(.96); opacity: 0; transition-duration: .2s; }
.aviso-toast i { width: 20px; height: 20px; flex: none; display: grid; place-items: center; border-radius: 50%; background: var(--verde); color: #fff; font-style: normal; font-size: 12px; }
.aviso-toast.ambar i { background: var(--ambar); color: var(--noche); }

/* ---------- Animaciones de ambiente ---------- */
@keyframes girar { to { transform: rotate(360deg); } }
@keyframes latido { 50% { opacity: .3; } }
@keyframes pulso { 0% { box-shadow: 0 0 0 0 #4ade80aa; } 70% { box-shadow: 0 0 0 9px #4ade8000; } 100% { box-shadow: 0 0 0 0 #4ade8000; } }
@keyframes cinta { to { transform: translateX(-50%); } }
@keyframes sacudir { 20%, 60% { transform: translateX(-5px); } 40%, 80% { transform: translateX(5px); } }

/* ---------- Móvil ---------- */
@media (max-width: 880px) {
  .portada { grid-template-columns: 1fr; padding-top: 28px; }
  .portada-lado { justify-self: stretch; max-width: none; }
  .radar-tarjeta { grid-template-columns: 150px 1fr; }
  .menu { display: none; }
  .barra { gap: 12px; }
  .barra-acciones { margin-left: auto; }
  .vivo { display: none; }
  .boletin { grid-template-columns: 1fr; }
  .interruptor { margin-left: 0; }
  .hito { grid-template-columns: 1fr auto; gap: 10px 14px; }
  .hito-fecha { grid-column: 1 / -1; }
  .hito-fecha small { display: inline; margin-left: 8px; }
  /* Cajón como hoja inferior */
  .cajon-hoja { top: auto; left: 0; right: 0; bottom: 0; width: 100%; max-height: 88vh; border-radius: 22px 22px 0 0; padding: 12px 20px calc(26px + env(safe-area-inset-bottom)); transform: translateY(100%); }
  .cajon-asa { display: block; width: 40px; height: 5px; margin: 0 auto 14px; border-radius: 99px; background: var(--linea); }
  .cajon-acciones .boton { flex: 1; }
}
@media (max-width: 420px) {
  .barra-acciones kbd { display: none; }
  .marca-texto { font-size: 18px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition-duration: .01ms !important; transition-delay: 0s !important; scroll-behavior: auto !important; }
  .tarjeta, .revelar, .titulo-palabras .pal, .portada-lado, .guia-item, .sec-texto .antetitulo, .sec-texto .entradilla, .sec-claves, .ficha, .portada-texto .entradilla, .portada-texto .antetitulo, .destacada { opacity: 1 !important; transform: none !important; filter: none !important; }
}

.hito-tit + .hito-tit { margin-top: 12px; padding-top: 12px; border-top: 1px dashed var(--linea); }

.guia-codigos { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.guia-codigos .guia-item { display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; gap: 0 10px; padding: 8px 10px; border: 1px solid var(--linea); border-radius: 10px; }
.guia-codigos .codigo { grid-row: span 2; align-self: center; font-family: var(--mono); font-size: 13px; font-weight: 600; color: var(--verde); }
.guia-codigos .cod-nombre { font-size: 12.5px; font-weight: 600; line-height: 1.25; }
.guia-codigos .cod-quien { font-family: var(--mono); font-size: 10.5px; color: var(--tinta-3); text-transform: uppercase; letter-spacing: .04em; }
.guia-nota { margin: 10px 0 0; font-size: 12.5px; color: var(--tinta-2); line-height: 1.45; }
.guia-nota a { font-family: var(--mono); font-size: 11px; color: var(--verde); text-decoration: none; }
@media (max-width: 420px) { .guia-codigos { grid-template-columns: 1fr; } }

/* ---------- Páginas de sección (RBT, BCBA, Padres) ---------- */
.sec-portada { position: relative; overflow: hidden; isolation: isolate; display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, .7fr); gap: 32px; align-items: center; padding: clamp(40px, 6vw, 88px) clamp(16px, 4vw, 48px) clamp(36px, 5vw, 64px); }
.sec-texto h1 { font-size: clamp(36px, 5.4vw, 68px); font-weight: 800; letter-spacing: -0.045em; line-height: 1.03; }
.sec-texto h1 em { font-family: var(--serif); font-weight: 400; font-style: italic; color: var(--verde); letter-spacing: -0.01em; }
.sec-texto .antetitulo, .sec-texto .entradilla, .sec-claves { opacity: 0; transform: translateY(14px); transition: opacity .8s var(--ease-out), transform .8s var(--ease-out); }
.sec-portada.lista .antetitulo { opacity: 1; transform: none; }
.sec-portada.lista .entradilla { opacity: 1; transform: none; transition-delay: .3s; }
.sec-portada.lista .sec-claves { opacity: 1; transform: none; transition-delay: .45s; }
.sec-claves { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; max-width: 640px; }
.sec-claves li { display: grid; gap: 2px; min-width: 140px; padding: 12px 16px; border: 1px solid var(--linea); border-radius: 14px; background: var(--tarjeta); box-shadow: var(--sombra); }
.sec-claves b { font-size: 26px; font-weight: 800; letter-spacing: -0.04em; color: var(--verde); line-height: 1; }
.sec-claves span { font-size: 13px; color: var(--tinta-2); line-height: 1.35; }
.sec-ondas { position: relative; justify-self: center; width: min(100%, 300px); aspect-ratio: 1; display: grid; place-items: center; }
.sec-ondas span { position: absolute; inset: 0; border-radius: 50%; border: 1.5px solid #16a34a; opacity: 0; animation: onda 4.8s var(--ease-out) infinite; }
.sec-ondas span:nth-child(2) { animation-delay: 1.2s; }
.sec-ondas span:nth-child(3) { animation-delay: 2.4s; }
.sec-ondas span:nth-child(4) { animation-delay: 3.6s; }
.sec-ondas b { position: relative; display: grid; place-items: center; width: 46%; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #ffffff, var(--verde-claro)); border: 1px solid #16a34a40; box-shadow: var(--sombra-alta); font-size: clamp(26px, 3.4vw, 40px); font-weight: 800; letter-spacing: -0.04em; color: var(--verde); }
@keyframes onda { 0% { transform: scale(.42); opacity: .55; } 100% { transform: scale(1); opacity: 0; } }

.sec-cuerpo { display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: 40px; align-items: start; padding-top: 8px !important; }
.sec-indice { position: sticky; top: 88px; display: grid; gap: 2px; }
.sec-indice a { padding: 8px 12px; border-left: 2px solid var(--linea); color: var(--tinta-3); font-size: 14px; font-weight: 600; text-decoration: none; transition: color .2s var(--ease-out), border-color .2s var(--ease-out); }
.sec-indice a.activo { color: var(--tinta); border-color: var(--verde); }
@media (hover: hover) and (pointer: fine) { .sec-indice a:hover { color: var(--tinta); } }
.grupo { scroll-margin-top: 90px; margin-bottom: 44px; }
.grupo h2 { font-size: clamp(24px, 2.6vw, 32px); margin-bottom: 6px; }
.grupo-intro { margin: 0 0 18px; color: var(--tinta-2); max-width: 46em; }
.fichas { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr)); gap: 14px; margin-top: 16px; }
.ficha { position: relative; display: flex; flex-direction: column; gap: 8px; padding: 20px; border: 1px solid var(--linea); border-radius: var(--radio); background: var(--tarjeta); box-shadow: var(--sombra); transition: opacity .6s var(--ease-out), transform .6s var(--ease-out), border-color .25s var(--ease-out), box-shadow .25s var(--ease-out); }
@media (hover: hover) and (pointer: fine) { .ficha:hover { border-color: #16a34a55; box-shadow: var(--sombra-alta); } }
.ficha-icono { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 11px; background: var(--verde-claro); color: var(--verde); font-family: var(--mono); font-size: 12px; font-weight: 600; }
.ficha h3 { font-size: 18px; font-weight: 750; letter-spacing: -0.015em; line-height: 1.25; }
.ficha p { margin: 0; font-size: 15px; line-height: 1.55; color: var(--tinta-2); }
.ficha-hacer { padding: 10px 12px; border-radius: 10px; background: var(--verde-claro); color: var(--tinta) !important; }
.ficha-hacer b { display: block; font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: var(--verde); margin-bottom: 2px; }
.ficha-ojo { color: #b45309 !important; font-weight: 600; font-size: 14px !important; }
.ficha-pie { margin-top: auto !important; padding-top: 10px; display: flex; justify-content: space-between; gap: 10px; border-top: 1px dashed var(--linea); font-family: var(--mono); font-size: 11.5px !important; }
.ficha-pie a { color: var(--verde); text-decoration: none; }
.ficha-pie a:hover { text-decoration: underline; }
a.tarjeta-boton { text-decoration: none; color: inherit; }
.revisado { font-family: var(--mono); font-size: 11.5px; color: var(--tinta-3); }
.pie-nav { display: flex; gap: 16px; }
.pie-nav a { color: var(--tinta-2); text-decoration: none; font-family: var(--sans); font-weight: 600; font-size: 13px; }

@media (max-width: 880px) {
  .sec-portada { grid-template-columns: 1fr; }
  .sec-ondas { display: none; }
  .sec-cuerpo { grid-template-columns: 1fr; gap: 12px; }
  .sec-indice { position: static; display: flex; overflow-x: auto; gap: 6px; padding-bottom: 4px; }
  .sec-indice .sobre { display: none; }
  .sec-indice a { white-space: nowrap; border: 1px solid var(--linea); border-radius: 999px; padding: 6px 12px; }
  .sec-indice a.activo { border-color: var(--verde); }
  .menu { display: flex; order: 3; width: 100%; margin: 0; justify-content: space-between; }
  .menu a { flex: 1; text-align: center; padding: 7px 4px; }
  .barra { flex-wrap: wrap; height: auto; padding-block: 10px; row-gap: 10px; }
  .barra.compacta { height: auto; }
}

.ficha-pie .certeza { white-space: nowrap; }
.ficha-pie a { text-align: right; }

.boletin-legal { margin: 8px 4px 0; font-size: 12.5px; color: var(--tinta-3); }
.boletin-legal a { color: var(--verde); }
.boletin-form button:disabled { opacity: .7; cursor: progress; }

/* Página legal */
.legal { max-width: 760px !important; }
.legal h1 { font-size: clamp(34px, 5vw, 52px); font-weight: 800; letter-spacing: -0.04em; margin-bottom: 18px; }
.legal h2 { font-size: 22px; margin: 32px 0 10px; }
.legal p, .legal li { color: var(--tinta-2); line-height: 1.65; }
.legal ul { padding-left: 20px; }

/* Móvil: que ningún bloque empuje la página más allá de la pantalla */
.portada > *, .sec-portada > *, .sec-cuerpo > *, .seccion-cabeza > *, .boletin > *, .controles > * { min-width: 0; }
.sec-claves { grid-template-columns: repeat(auto-fit, minmax(min(100%, 130px), 1fr)); }
html, body { overflow-x: clip; }
@media (max-width: 480px) {
  .sec-claves li { min-width: 0; padding: 10px 12px; }
  .sec-claves b { font-size: 22px; }
  .sec-texto h1 { font-size: clamp(32px, 9vw, 44px); }
}