/* UTN.LABS — oscuro, violeta, el gradiente violeta→naranja de las placas y la araña 🕷 de las ediciones. */

:root {
  /* Marca (placas): noche #100c20, rosa #ffe0e3, violeta #a865e0, naranja #ff4500. */
  --fondo: #100c20;
  --fondo-2: #1a1330;
  --superficie: rgba(255, 255, 255, 0.045);
  --superficie-2: rgba(255, 255, 255, 0.08);
  --borde: rgba(255, 224, 227, 0.1);
  --borde-fuerte: rgba(255, 224, 227, 0.22);
  --texto: #fff4f5;
  --texto-2: #c9bfdf;
  --texto-3: #958ab5;
  --rosa: #ffe0e3;
  --acento: #a865e0;
  --violeta: #a865e0;
  --magenta: #d65aa0;
  --naranja: #ff4500;
  --grad: linear-gradient(115deg, var(--violeta) 0%, var(--magenta) 52%, var(--naranja) 100%);
  /* El de los botones es un punto más profundo: texto blanco con contraste AA. */
  --grad-boton: linear-gradient(115deg, #9b4fd6 0%, #c23a86 52%, #d63a00 100%);
  --oro: #e7c27d;
  --oro-claro: #f6e3b8;
  --oro-hondo: #b8873b;
  --radio: 18px;
  --radio-chico: 12px;
  --sombra: 0 20px 50px -24px rgba(0, 0, 0, 0.7);
  --f-titulos: "Montserrat", ui-sans-serif, system-ui, sans-serif;
  --f-texto: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --suave: cubic-bezier(.2, .7, .2, 1);
  --ancho: 1180px;
  --gutter: 16px;
  color-scheme: dark;
}

@media (min-width: 720px) { :root { --gutter: 28px; } }

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body {
  margin: 0;
  background: var(--fondo);
  color: var(--texto);
  font: 400 16px/1.6 var(--f-texto);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

img { max-width: 100%; display: block; }
a { color: inherit; }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible {
  outline: 2px solid var(--naranja); outline-offset: 3px;
}
h1, h2, h3 { font-family: var(--f-titulos); font-weight: 800; letter-spacing: -0.025em; line-height: 1.08; margin: 0; }
p { margin: 0 0 1em; }

.contenedor { width: 100%; max-width: var(--ancho); margin: 0 auto; padding: 0 var(--gutter); }
.visualmente-oculto, .trampa { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.trampa { left: -9999px; }
.saltar { position: absolute; left: -9999px; top: 8px; background: var(--texto); color: var(--fondo); padding: 8px 14px; border-radius: 8px; z-index: 100; }
.saltar:focus { left: 8px; }

/* ── Cabecera ─────────────────────────────────────────────────────────── */
.cabecera {
  position: sticky; top: 0; z-index: 50;
  background: rgba(16, 12, 32, 0.72);
  backdrop-filter: saturate(1.4) blur(14px); -webkit-backdrop-filter: saturate(1.4) blur(14px);
  border-bottom: 1px solid var(--borde);
}
.cabecera__fila { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 64px; flex-wrap: wrap; padding-top: 10px; padding-bottom: 10px; }
.marca { font: 900 22px/1 var(--f-titulos); letter-spacing: -0.03em; text-decoration: none; color: var(--texto); white-space: nowrap; }
.marca__punto { background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.marca--pie { font-size: 30px; margin-bottom: 16px; }
.nav { display: flex; align-items: center; gap: 2px; flex-wrap: wrap; }
.nav a {
  position: relative; text-decoration: none; color: var(--texto-2); font-weight: 500; font-size: 15px;
  padding: 7px 11px; border-radius: 999px; transition: color .15s, background .15s;
}
.nav a:hover { color: var(--texto); background: var(--superficie-2); }
.nav a[aria-current="page"] { color: var(--texto); background: var(--superficie-2); }
.nav .nav__cta { color: #fff; background: var(--grad-boton); margin-left: 6px; font-weight: 600; }
.nav .nav__cta:hover, .nav .nav__cta[aria-current="page"] { background: var(--grad-boton); filter: brightness(1.12); }
@media (max-width: 640px) {
  .cabecera__fila { gap: 6px; padding-top: 12px; padding-bottom: 8px; }
  /* Cinco secciones en una fila pareja (Sumate ya está arriba, como botón): entran siempre,
     y si un nombre es largo baja a dos líneas en vez de empujar la página. */
  .nav { width: 100%; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 2px; }
  .nav a { display: flex; align-items: center; justify-content: center; text-align: center; padding: 6px 2px; font-size: 12.5px; line-height: 1.15; min-height: 40px; border-radius: 12px; overflow-wrap: anywhere; hyphens: auto; }
  .nav a:not(.nav__cta)::after { left: 8px; right: 8px; }
  .nav .nav__cta { display: none; }
  .cabecera .solo-movil { min-height: 36px; padding: 0 16px; }
}
@media (min-width: 641px) { .solo-movil { display: none !important; } }

/* ── Botones, chips, sellos ───────────────────────────────────────────── */
.boton {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 46px; padding: 0 22px; border-radius: 999px; border: 0;
  background: var(--grad-boton); background-size: 170% 100%; color: #fff; font: 600 15px/1 var(--f-texto);
  text-decoration: none; cursor: pointer;
  transition: transform .25s var(--suave), box-shadow .25s, filter .2s, background-position .6s var(--suave);
  box-shadow: 0 10px 30px -12px rgba(214, 90, 160, 0.65);
  position: relative; overflow: hidden; isolation: isolate;
}
.boton:hover { transform: translateY(-2px); background-position: 100% 0; box-shadow: 0 16px 36px -12px rgba(214, 90, 160, .85); }
.boton:active { transform: translateY(0) scale(.97); transition-duration: .08s; }
.boton--fantasma { background: var(--superficie-2); box-shadow: inset 0 0 0 1px var(--borde-fuerte); }
.boton--fantasma:hover { background: rgba(255, 255, 255, 0.12); }
.boton--chico { min-height: 42px; padding: 0 16px; font-size: 14px; }

.chip {
  display: inline-flex; align-items: center; gap: 6px; padding: 7px 14px; border-radius: 999px;
  background: var(--superficie); border: 1px solid var(--borde); color: var(--texto-2);
  text-decoration: none; font-size: 14px; font-weight: 500; white-space: nowrap; transition: .15s;
}
.chip:hover { color: var(--texto); border-color: var(--borde-fuerte); }
.chip[aria-current="true"] { color: #fff; background: var(--grad-boton); border-color: transparent; }
.chip__n { font-size: 12px; opacity: .7; font-variant-numeric: tabular-nums; }
.sello {
  display: inline-flex; align-items: center; padding: 3px 10px; border-radius: 999px; font-size: 12px; font-weight: 600;
  background: rgba(168, 101, 224, 0.16); color: #dcc4ff; border: 1px solid rgba(168, 101, 224, 0.4);
}
.sello--naranja { background: rgba(255, 69, 0, 0.14); color: #ffc79d; border-color: rgba(255, 69, 0, 0.45); }
.eyebrow {
  font: 600 12px/1 var(--f-texto); letter-spacing: .14em; text-transform: uppercase; color: var(--texto-3); margin: 0 0 12px;
}
.link-flecha { color: var(--texto); font-weight: 600; text-decoration: none; white-space: nowrap; font-size: 15px; }
.link-flecha span { display: inline-block; transition: transform .15s; }
.link-flecha:hover span { transform: translateX(3px); }
.link-flecha:hover { color: #e6d6ff; }

/* ── Hero ─────────────────────────────────────────────────────────────── */
.hero { position: relative; overflow: hidden; padding: 72px 0 56px; isolation: isolate; }
@media (min-width: 900px) { .hero { padding: 112px 0 88px; } }
.hero__fondo {
  position: absolute; inset: 0; z-index: -1;
  background:
    radial-gradient(600px 380px at 85% 10%, rgba(255, 69, 0, 0.22), transparent 70%),
    radial-gradient(700px 480px at 10% 0%, rgba(168, 101, 224, 0.38), transparent 70%),
    radial-gradient(500px 400px at 50% 110%, rgba(168, 101, 224, 0.2), transparent 70%);
}
.hero__fondo::after {
  content: ""; position: absolute; inset: 0;
  background-image: linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
  background-size: 56px 56px;
  mask-image: radial-gradient(ellipse at 50% 30%, #000 30%, transparent 75%);
  -webkit-mask-image: radial-gradient(ellipse at 50% 30%, #000 30%, transparent 75%);
}
.hero__contenido { position: relative; }
@media (min-width: 1040px) {
  .hero__contenido { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); column-gap: 40px; }
  .hero__contenido > * { grid-column: 1; }
  .hero__contenido > .collage { grid-column: 2; grid-row: 1 / span 6; }
}
.collage { display: none; }
@media (min-width: 1040px) {
  .collage { display: block; position: relative; min-height: 460px; }
  .collage__img { position: absolute; border-radius: 20px; object-fit: cover; box-shadow: 0 30px 60px -20px rgba(0,0,0,.75); border: 1px solid rgba(255,255,255,.14); }
  .collage__img--1 { width: 92%; aspect-ratio: 16 / 9; right: 0; top: 40px; transform: rotate(2.5deg); z-index: 2; }
  .collage__img--2 { width: 52%; aspect-ratio: 4 / 3; left: 0; top: 270px; transform: rotate(-4deg); z-index: 3; }
  .collage__img--3 { width: 46%; aspect-ratio: 4 / 3; right: 2%; top: 300px; transform: rotate(3deg); z-index: 1; }
}
.chip-kicker {
  display: inline-flex; align-items: center; gap: 10px; padding: 7px 14px 7px 12px; border-radius: 999px;
  background: var(--superficie); border: 1px solid var(--borde); color: var(--texto-2); font-size: 14px; font-weight: 500; margin-bottom: 24px;
}
.punto { width: 8px; height: 8px; border-radius: 50%; background: var(--naranja); box-shadow: 0 0 0 4px rgba(255, 69, 0, 0.2); }
.hero__titulo {
  font-size: clamp(42px, 9vw, 92px); font-weight: 900; letter-spacing: -0.045em; line-height: 0.98; max-width: 13ch;
  /* El gradiente de las placas (violeta → magenta → naranja), espejado para que corra sin salto. */
  background: linear-gradient(100deg, var(--rosa) 0%, var(--violeta) 22%, var(--magenta) 40%, var(--naranja) 52%, var(--magenta) 64%, var(--violeta) 80%, var(--rosa) 100%);
  background-size: 300% 100%; background-position: 0% 50%;
  -webkit-background-clip: text; background-clip: text; color: transparent;
  padding-bottom: .06em; /* que no se corten los descendentes con el clip */
}
.hero__titulo::after {
  content: ""; display: block; width: 96px; height: 6px; border-radius: 6px; background: var(--grad); margin-top: 28px;
  transform-origin: left center;
}
.hero__bajada { font-size: clamp(18px, 2.4vw, 22px); color: var(--texto-2); margin: 24px 0 32px; max-width: 34ch; }
.hero__acciones { display: flex; flex-wrap: wrap; gap: 12px; }

/* La araña de las ediciones (la silueta oficial), colgando de su hilo.
   .arana se corre con el scroll (--bajada, lo pone vivo.js); el colgante baja al cargar y se hamaca;
   el bicho se asusta y trepa si le acercás el mouse. El hilo sobra por arriba para no despegarse nunca. */
.arana { position: absolute; top: -420px; right: clamp(20px, 9vw, 140px); pointer-events: none; z-index: 5; translate: 0 var(--bajada, 0px); }
.arana__colgante { display: flex; flex-direction: column; align-items: center; transform-origin: 50% 0; transition: transform .9s var(--suave); }
.arana__hilo { width: 1px; height: calc(420px + clamp(90px, 18vw, 190px)); background: linear-gradient(rgba(255,224,227,0) calc(100% - 220px), rgba(255,224,227,.6)); }
.arana__bicho {
  width: clamp(34px, 4.2vw, 50px); aspect-ratio: 200 / 232; margin-top: -3px; rotate: 180deg;
  background: var(--grad);
  -webkit-mask: url("arana.png") center / contain no-repeat; mask: url("arana.png") center / contain no-repeat;
  filter: drop-shadow(0 6px 16px rgba(168, 101, 224, .7));
}
.arana--susto .arana__colgante { transform: translateY(-70px); transition-duration: .28s; transition-timing-function: cubic-bezier(.3, 0, .2, 1); }
@media (prefers-reduced-motion: no-preference) {
  .arana__colgante { animation: descolgar 1.9s cubic-bezier(.3, 1.35, .45, 1) .35s both, hamaca 7s ease-in-out 2.3s infinite; }
  .arana__bicho { animation: respirar 3.2s ease-in-out infinite; }
}
@keyframes descolgar { from { translate: 0 -260px; } to { translate: 0 0; } }
@keyframes hamaca { 0%, 100% { rotate: -1.4deg; } 50% { rotate: 1.4deg; } }
@keyframes respirar { 0%, 100% { scale: 1 1; } 50% { scale: 1.04 .97; } }
@media (max-width: 640px) {
  .arana { right: 14px; } .arana__hilo { height: calc(420px + 40px); } .arana__bicho { width: 28px; }
  .hero { padding-top: 64px; }
  .chip-kicker { font-size: 13px; border-radius: 14px; padding-right: 12px; }
  .chip-kicker__extra { display: none; }
  .hero__acciones .boton { flex: 1 1 100%; }
}

/* ── Secciones ────────────────────────────────────────────────────────── */
.seccion { padding-block: 56px; }
@media (min-width: 900px) { .seccion { padding-block: 80px; } }
.seccion--pegada { padding-top: 8px; }
.seccion--chica { padding-block: 28px 8px; }
.seccion__cabeza { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 28px; flex-wrap: wrap; }
.seccion__titulo { font-size: clamp(26px, 4vw, 40px); font-weight: 600; max-width: 24ch; }
.subtitulo { font-size: 22px; font-weight: 600; margin: 32px 0 18px; display: flex; align-items: center; gap: 10px; }
.contador { font: 600 13px/1 var(--f-texto); color: var(--texto-3); background: var(--superficie-2); padding: 5px 9px; border-radius: 999px; }
.nota-al-pie { color: var(--texto-2); margin-top: 24px; }
.nota-al-pie a, .pagina-bajada a, .caja a, .vacio a { color: #e3d0ff; text-decoration-color: rgba(227, 208, 255, .4); text-underline-offset: 3px; }
.vacio { color: var(--texto-2); padding-block: 40px; }

.pagina-cabeza { padding-top: 56px; padding-bottom: 28px; }
@media (min-width: 900px) { .pagina-cabeza { padding-top: 80px; } }
.pagina-titulo { font-size: clamp(34px, 6vw, 60px); font-weight: 700; letter-spacing: -0.03em; max-width: 20ch; }
.pagina-bajada { color: var(--texto-2); font-size: 18px; margin-top: 16px; max-width: 60ch; }

.grilla { display: grid; gap: 18px; }
.grilla--videos { grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); gap: 24px 18px; }
.grilla--videos-2 { grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr)); }
.grilla--startups { grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); }
.grilla--notas { grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr)); gap: 22px; }
.grilla--proposito { grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); }
.grilla--prensa { grid-template-columns: 1fr; }
.grilla--formularios { grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); }

/* ── Videos ───────────────────────────────────────────────────────────── */
.video { display: flex; flex-direction: column; gap: 8px; text-decoration: none; color: var(--texto); min-width: 0; }
.video__img {
  position: relative; aspect-ratio: 16 / 9; border-radius: var(--radio-chico); overflow: hidden;
  background: var(--fondo-2); border: 1px solid var(--borde); display: block;
}
.video__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.video:hover .video__img img { transform: scale(1.04); }
.video__img::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 50%, rgba(16, 12, 32, .55)); }
.video__play {
  position: absolute; left: 12px; bottom: 12px; z-index: 1; width: 42px; height: 42px; border-radius: 50%;
  background: rgba(16, 12, 32, .65); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
  border: 1px solid rgba(255, 255, 255, .35); transition: background .2s, transform .2s;
}
.video__play::after { content: ""; position: absolute; left: 16px; top: 12px; border-style: solid; border-width: 9px 0 9px 14px; border-color: transparent transparent transparent #fff; }
.video:hover .video__play { background: var(--naranja); transform: scale(1.06); border-color: transparent; }
.video__arte {
  position: absolute; inset: 0; display: grid; place-items: center;
  background: radial-gradient(circle at 30% 20%, rgba(168, 101, 224,.55), transparent 60%), radial-gradient(circle at 80% 90%, rgba(255, 69, 0,.45), transparent 60%), var(--fondo-2);
}
.video__arte span { font-size: 40px; }
.video__meta { font-size: 12px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--texto-3); }
.video__titulo { font-weight: 500; font-size: 15px; line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.video:hover .video__titulo { color: #e6d6ff; }
.video--nota { margin: 24px 0; }
.video--nota .video__titulo { color: var(--texto-2); font-size: 14px; }

@media (max-width: 640px) {
  .carrusel-movil {
    display: grid; grid-auto-flow: column; grid-auto-columns: 80%; grid-template-columns: none;
    overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none;
    margin: 0 calc(var(--gutter) * -1); padding: 0 var(--gutter) 6px; scroll-padding: 0 var(--gutter);
  }
  .carrusel-movil::-webkit-scrollbar { display: none; }
  .carrusel-movil > * { scroll-snap-align: start; }
}

/* ── Startups ─────────────────────────────────────────────────────────── */
.tarjeta-startup {
  display: flex; gap: 14px; align-items: flex-start; padding: 18px; border-radius: var(--radio);
  background: var(--superficie); border: 1px solid var(--borde); text-decoration: none; color: var(--texto);
  transition: border-color .2s, transform .2s, background .2s; min-width: 0;
  flex-wrap: wrap; align-content: space-between; /* el video y la nota: abajo y a lo ancho */
}
.tarjeta-startup:hover { border-color: var(--borde-fuerte); background: var(--superficie-2); transform: translateY(-2px); }
.tarjeta-startup--labs { position: relative; background: linear-gradient(var(--fondo-2), var(--fondo-2)) padding-box, var(--grad) border-box; border: 1px solid transparent; }
.tarjeta-startup__logo { flex: none; width: 52px; height: 52px; border-radius: 14px; overflow: hidden; }
/* Los logos llegan normalizados: un cuadrado de 512 px con su placa y las esquinas ya redondeadas. */
.tarjeta-startup__logo img { display: block; width: 100%; height: 100%; object-fit: cover; border-radius: inherit; box-shadow: 0 0 0 1px var(--borde); }
.monograma {
  width: 100%; height: 100%; display: grid; place-items: center; font: 700 18px/1 var(--f-titulos); color: #fff;
  background: linear-gradient(135deg, rgba(168, 101, 224,.55), rgba(255, 69, 0,.45)); letter-spacing: 0;
}
.monograma--grande { font-size: 34px; }
.tarjeta-startup__cuerpo { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; min-width: 0; }
.tarjeta-startup__nombre { font: 600 18px/1.2 var(--f-titulos); letter-spacing: -0.01em; }
.tarjeta-startup__bajada { color: var(--texto-2); font-size: 14px; line-height: 1.45; }
/* La tarjeta entera es el link a la ficha (el nombre se estira); el video y la nota quedan encima. */
.tarjeta-startup__nombre { color: inherit; text-decoration: none; }
.tarjeta-startup__nombre::before { content: ""; position: absolute; inset: 0; border-radius: inherit; z-index: 1; }
.tarjeta-startup__nombre:focus-visible { outline: none; }
.tarjeta-startup:has(.tarjeta-startup__nombre:focus-visible) { outline: 2px solid var(--violeta); outline-offset: 3px; }
.tarjeta-startup__cuerpo { flex: 1 1 0; }
.tarjeta-startup__acciones { flex: 1 0 100%; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin-top: auto; }
.tarjeta-startup__video, .tarjeta-startup__nota { position: relative; z-index: 3; font-size: 13px; font-weight: 600; text-decoration: none; }
.tarjeta-startup__video {
  display: inline-flex; align-items: center; gap: 8px; min-height: 32px; padding: 4px 13px 4px 5px; border-radius: 17px; line-height: 1.25; max-width: 100%;
  color: var(--texto); background: rgba(168, 101, 224, .16); border: 1px solid rgba(168, 101, 224, .38);
  transition: background .2s, border-color .2s;
}
.tarjeta-startup__video:hover { background: rgba(168, 101, 224, .3); border-color: rgba(214, 90, 160, .6); }
.tarjeta-startup__play { flex: none; width: 22px; height: 22px; border-radius: 50%; background: var(--grad); position: relative; }
.tarjeta-startup__play::after {
  content: ""; position: absolute; left: 8px; top: 6px; border-style: solid; border-width: 5px 0 5px 8px;
  border-color: transparent transparent transparent #fff;
}
.tarjeta-startup__nota { color: var(--texto-2); min-height: 32px; display: inline-flex; align-items: center; }
.tarjeta-startup__nota:hover { color: var(--texto); }
.tarjeta-startup__video:focus-visible, .tarjeta-startup__nota:focus-visible { outline: 2px solid var(--violeta); outline-offset: 2px; }
@media (max-width: 520px) {
  .grilla--startups { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .tarjeta-startup { flex-direction: column; flex-wrap: nowrap; gap: 12px; padding: 16px; }
  .tarjeta-startup > .tarjeta-startup__cuerpo, .tarjeta-startup > .tarjeta-startup__acciones { flex: none; }
  .tarjeta-startup--labs > .tarjeta-startup__acciones { flex: 1 0 100%; }
  .tarjeta-startup__logo { width: 44px; height: 44px; border-radius: 12px; }
  .tarjeta-startup--labs { grid-column: 1 / -1; flex-direction: row; flex-wrap: wrap; }
  .tarjeta-startup--labs > .tarjeta-startup__cuerpo { flex: 1 1 0; }
  .tarjeta-startup__nombre { font-size: 16px; overflow-wrap: anywhere; }
  .tarjeta-startup__video { font-size: 12px; gap: 7px; padding-right: 11px; }
}

/* ── Notas ────────────────────────────────────────────────────────────── */
.tarjeta-nota {
  display: flex; flex-direction: column; border-radius: var(--radio); overflow: hidden; text-decoration: none; color: var(--texto);
  background: var(--superficie); border: 1px solid var(--borde); transition: border-color .2s, transform .2s;
}
.tarjeta-nota:hover { border-color: var(--borde-fuerte); transform: translateY(-2px); }
.tarjeta-nota__portada { aspect-ratio: 16 / 8; display: grid; place-items: center; background: var(--grad); position: relative; overflow: hidden; }
.tarjeta-nota__portada img { position: relative; z-index: 1; width: 100%; height: 100%; object-fit: cover; }
.tarjeta-nota__portada::before {
  content: ""; position: absolute; inset: 0;
  background-image: linear-gradient(rgba(255,255,255,.12) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.12) 1px, transparent 1px);
  background-size: 28px 28px; opacity: .6;
}
.tarjeta-nota__inicial { position: relative; font: 700 72px/1 var(--f-titulos); color: rgba(255,255,255,.92); }
.tarjeta-nota__cuerpo { display: flex; flex-direction: column; gap: 8px; padding: 20px; }
.tarjeta-nota__fecha { font-size: 13px; color: var(--texto-3); }
.tarjeta-nota__titulo { font: 600 21px/1.2 var(--f-titulos); letter-spacing: -0.015em; }
.tarjeta-nota__bajada { color: var(--texto-2); font-size: 15px; line-height: 1.5; }

/* ── Próximo evento ───────────────────────────────────────────────────── */
.proximo {
  display: grid; grid-template-columns: auto 1fr; gap: 20px; align-items: center; padding: 22px;
  border-radius: 24px; border: 1px solid transparent;
  background: linear-gradient(135deg, rgba(40, 24, 72, .98), rgba(26, 18, 48, .98)) padding-box, var(--grad) border-box;
  box-shadow: var(--sombra);
}
.proximo .boton { grid-column: 1 / -1; }
@media (min-width: 760px) { .proximo { grid-template-columns: auto 1fr auto; padding: 28px 32px; gap: 28px; } .proximo .boton { grid-column: auto; } }
.proximo__fecha { width: 76px; height: 82px; border-radius: 16px; background: var(--grad-boton); display: flex; flex-direction: column; align-items: center; justify-content: center; color: #fff; }
.proximo__dia { font: 700 34px/1 var(--f-titulos); }
.proximo__mes { font-weight: 600; font-size: 13px; text-transform: uppercase; letter-spacing: .1em; }
.proximo__cuerpo .eyebrow { color: #ffc79d; margin-bottom: 8px; }
.proximo__titulo { font-size: clamp(22px, 3vw, 30px); }
.proximo__titulo a { text-decoration: none; }
.proximo__datos { color: var(--texto-2); margin: 8px 0 0; }

/* ── Propósito ────────────────────────────────────────────────────────── */
.proposito { background: linear-gradient(180deg, transparent, rgba(168, 101, 224, .08) 30%, rgba(168, 101, 224, .08) 70%, transparent); }
.proposito__intro { color: var(--texto-2); font-size: clamp(18px, 2.2vw, 21px); max-width: 52ch; margin: -8px 0 28px; }
.bloque { padding: 26px; border-radius: var(--radio); background: var(--superficie); border: 1px solid var(--borde); }
.bloque__icono { font-size: 30px; display: block; margin-bottom: 14px; }
.bloque__titulo { font-size: 21px; font-weight: 600; margin-bottom: 12px; }
.bloque p, .bloque__lista { color: var(--texto-2); margin: 0; }
.bloque__lista { padding-left: 18px; display: grid; gap: 8px; }
.bloque__lista li::marker { color: var(--naranja); }

/* ── Mosaico de fotos ─────────────────────────────────────────────────── */
.mosaico { display: grid; gap: 10px; grid-template-columns: repeat(2, 1fr); }
@media (min-width: 760px) { .mosaico { grid-template-columns: repeat(3, 1fr); grid-auto-rows: 210px; } .mosaico .foto-item:first-child { grid-column: span 2; grid-row: span 2; } }
.mosaico .foto-item { display: block; border-radius: var(--radio-chico); overflow: hidden; aspect-ratio: 4 / 3; background: var(--fondo-2); }
@media (min-width: 760px) { .mosaico .foto-item { aspect-ratio: auto; } }
.mosaico .foto-item img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease, filter .3s; filter: saturate(.9); }
.mosaico .foto-item:hover img { transform: scale(1.04); filter: saturate(1.1); }

/* ── Fotos, galerías y visor ──────────────────────────────────────────── */
.foto-item { display: block; overflow: hidden; background: var(--fondo-2); }
.foto-item img { width: 100%; height: 100%; object-fit: cover; }
.grilla-fotos { display: grid; gap: 6px; grid-template-columns: repeat(auto-fill, minmax(min(31%, 180px), 1fr)); }
@media (min-width: 760px) { .grilla-fotos { gap: 10px; } }
.grilla-fotos .foto-item { aspect-ratio: 1; border-radius: 10px; }
.grilla-fotos .foto-item img { transition: transform .4s ease; }
.grilla-fotos .foto-item:hover img { transform: scale(1.05); }
.grilla-fotos--grafica .foto-item { aspect-ratio: 4 / 5; }
.galerias-links { display: flex; flex-direction: column; gap: 10px; margin-top: 18px; }
.galerias-links__item { display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: baseline; }
.galerias-links__nombre { color: var(--texto-2); font-size: 15px; }
.grilla--galerias { grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); gap: 18px; }
.tarjeta-galeria { display: flex; flex-direction: column; border-radius: var(--radio); overflow: hidden; text-decoration: none; color: var(--texto); background: var(--superficie); border: 1px solid var(--borde); transition: border-color .2s, transform .2s; }
.tarjeta-galeria:hover { border-color: var(--borde-fuerte); transform: translateY(-2px); }
.tarjeta-galeria__img { aspect-ratio: 3 / 2; background: var(--grad); display: block; }
.tarjeta-galeria__img img { width: 100%; height: 100%; object-fit: cover; }
.tarjeta-galeria__cuerpo { padding: 16px 18px; display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.tarjeta-galeria__nombre { font: 600 19px/1.2 var(--f-titulos); }
.tarjeta-galeria__n { color: var(--texto-3); font-size: 14px; white-space: nowrap; }
.paginas { display: flex; align-items: center; justify-content: center; gap: 16px; margin-top: 32px; flex-wrap: wrap; }
.paginas__actual { color: var(--texto-2); font-size: 14px; }

.visor { width: 100vw; height: 100vh; max-width: none; max-height: none; margin: 0; padding: 0; border: 0; background: rgba(8, 4, 20, .94); color: var(--texto); }
.visor[open] { display: grid; grid-template-columns: auto 1fr auto; grid-template-rows: 1fr auto; align-items: center; }
.visor::backdrop { background: transparent; }
.visor__img { grid-column: 2; grid-row: 1; max-width: 100%; max-height: calc(100vh - 90px); margin: 0 auto; object-fit: contain; border-radius: 8px; }
.visor__nav { grid-row: 1; width: 52px; height: 52px; margin: 0 10px; border-radius: 50%; border: 1px solid var(--borde-fuerte); background: rgba(255,255,255,.08); color: #fff; font-size: 30px; line-height: 1; cursor: pointer; }
.visor__nav:hover { background: rgba(255,255,255,.18); }
.visor__ant { grid-column: 1; } .visor__sig { grid-column: 3; }
.visor__pie { grid-column: 1 / -1; grid-row: 2; text-align: center; color: var(--texto-2); font-size: 14px; margin: 0; padding: 14px 16px 22px; }
.visor__cerrar { position: absolute; top: 14px; right: 14px; z-index: 2; width: 42px; height: 42px; border-radius: 50%; border: 1px solid var(--borde-fuerte); background: rgba(255,255,255,.08); color: #fff; font-size: 16px; cursor: pointer; }
@media (max-width: 640px) {
  .visor[open] { grid-template-columns: 1fr 1fr; grid-template-rows: 1fr auto auto; }
  .visor__img { grid-column: 1 / -1; max-height: calc(100vh - 150px); }
  .visor__nav { grid-row: 2; justify-self: center; } .visor__ant { grid-column: 1; } .visor__sig { grid-column: 2; }
  .visor__pie { grid-row: 3; }
}

/* ── El Merecido y MÉRITO ─────────────────────────────────────────────── */
.medalla {
  flex: none; width: 48px; height: 48px; border-radius: 50%; display: grid; place-items: center;
  background: radial-gradient(circle at 35% 30%, #fff3 0, transparent 45%), var(--grad);
  box-shadow: 0 0 0 4px rgba(255, 69, 0, .15), 0 10px 24px -10px rgba(214, 90, 160, .8);
}
.medalla span { font-size: 22px; transform: rotate(180deg); }
.medalla--grande { width: 72px; height: 72px; margin-bottom: 22px; }
.medalla--grande span { font-size: 32px; }
.medalla--chica { width: 26px; height: 26px; box-shadow: none; }
.medalla--chica span { font-size: 13px; }
.grilla--merecidos { grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); gap: 20px; align-items: start; }
.merecido {
  display: flex; flex-direction: column; gap: 14px; padding: 24px; border-radius: var(--radio);
  background: linear-gradient(var(--fondo-2), var(--fondo-2)) padding-box, linear-gradient(135deg, rgba(168, 101, 224,.6), rgba(255, 69, 0,.5)) border-box;
  border: 1px solid transparent;
}
.merecido__cabeza { display: flex; align-items: center; gap: 16px; }
.merecido__nombre { font-size: 24px; font-weight: 600; }
.merecido__org { margin: 4px 0 0; color: var(--texto-2); }
.merecido__meta { margin: 0; color: var(--texto-3); font-size: 14px; }
.merecido__meta a { color: var(--texto-2); }
.merecido__motivo { margin: 0; padding-left: 16px; border-left: 3px solid var(--naranja); color: #e4def7; font-size: 16px; line-height: 1.6; }
.merecido__extra { margin: 0; }
.merecidos-evento { list-style: none; padding: 0; margin: 0 0 14px; display: grid; gap: 10px; }
.merecidos-evento li { display: flex; align-items: center; gap: 10px; }
.merecidos-evento a { color: var(--texto); font-weight: 600; text-decoration: none; }
.merecidos-evento__org { color: var(--texto-2); }
.destacados { display: grid; gap: 18px; }
@media (min-width: 900px) { .destacados { grid-template-columns: 1fr 1fr; } }
.destacado { padding: 28px; border-radius: 24px; background: var(--superficie); border: 1px solid var(--borde); display: flex; flex-direction: column; gap: 12px; align-items: flex-start; }
.destacado .eyebrow { margin: 0; }
.destacado__titulo { font-size: clamp(26px, 3.4vw, 34px); font-weight: 600; }
.destacado__texto { color: var(--texto-2); margin: 0; max-width: 46ch; }
.destacado__nombres { list-style: none; padding: 0; margin: 4px 0 6px; display: grid; gap: 6px; }
.destacado__nombres a { color: var(--texto); font: 600 19px/1.3 var(--f-titulos); text-decoration: none; }
.destacado__nombres a:hover { color: #e6d6ff; }
.destacado__nombres span { color: var(--texto-3); }
.destacado--merecido { background: radial-gradient(400px 260px at 100% 0%, rgba(255, 69, 0,.16), transparent 70%), var(--superficie); }
.destacado--merito { flex-direction: row; align-items: center; gap: 22px; background: linear-gradient(135deg, rgba(166,107,22,.16), transparent 60%), var(--superficie); }
.destacado--merito > div { display: flex; flex-direction: column; gap: 12px; align-items: flex-start; }
.destacado__tapa { flex: none; width: 120px; border-radius: 6px; overflow: hidden; box-shadow: 0 18px 40px -16px rgba(0,0,0,.8); transform: rotate(-3deg); transition: transform .3s; }
.destacado__tapa:hover { transform: rotate(0); }
@media (max-width: 520px) { .destacado--merito { flex-direction: column; align-items: flex-start; } .destacado__tapa { width: 140px; } }
.merito { display: grid; gap: 36px; padding-top: 48px; padding-bottom: 32px; }
@media (min-width: 900px) { .merito { grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr); gap: 64px; align-items: start; padding-top: 72px; } }
.merito__tapa img { width: 100%; height: auto; max-width: 440px; margin: 0 auto; border-radius: 8px; box-shadow: 0 40px 80px -30px rgba(0,0,0,.85), 0 0 0 1px rgba(255,255,255,.06); }
@media (min-width: 900px) { .merito__tapa { position: sticky; top: 100px; } }
.merito__titulo { font-family: Georgia, "Times New Roman", serif; letter-spacing: .02em; color: #e7c27d; }
.merito__datos { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; color: var(--texto-2); margin: 16px 0 24px; }
.boton--descarga { min-height: 52px; padding: 0 26px; font-size: 16px; }
.aviso.aviso--suave { background: var(--superficie); border-color: var(--borde); color: var(--texto-2); }
.presentan { margin-top: 32px; padding: 22px; border-radius: var(--radio); background: var(--superficie); border: 1px solid var(--borde); }
.presentan__lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.presentan__lista li { display: flex; flex-direction: column; gap: 2px; }
.presentan__nombre { font-weight: 600; }
.presentan__texto { color: var(--texto-2); font-size: 15px; }

/* ── Partners ─────────────────────────────────────────────────────────── */
.partners { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(min(46%, 200px), 1fr)); }
.partners__item, .partners__item a {
  display: grid; place-items: center; height: 92px; border-radius: var(--radio-chico);
  background: rgba(255, 255, 255, 0.06); border: 1px solid var(--borde); padding: 16px 20px;
}
.partners__item a { border: 0; background: none; padding: 0; height: 100%; width: 100%; text-decoration: none; }
.partners__item img { max-height: 46px; max-width: 100%; width: auto; object-fit: contain; opacity: .85; transition: opacity .2s; }
.partners__item:hover img { opacity: 1; }
.partners__contenido { display: flex; align-items: center; justify-content: center; gap: 12px; }
.partners__nombre { color: var(--texto); font: 600 19px/1.2 var(--f-titulos); letter-spacing: -0.01em; text-align: center; }
.partners__nombre--chico { font-size: 17px; }
@media (max-width: 520px) {
  .partners { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .partners__item, .partners__item a { height: 76px; padding: 10px; }
  .partners__item a { padding: 0; }
  .partners__item img { max-height: 34px; }
}

/* ── Prensa ───────────────────────────────────────────────────────────── */
.prensa {
  display: flex; flex-direction: column; border-radius: var(--radio); overflow: hidden; text-decoration: none; color: var(--texto);
  background: var(--superficie); border: 1px solid var(--borde); transition: border-color .2s;
}
.prensa:hover { border-color: var(--borde-fuerte); }
.prensa__img { background: #fff; display: block; }
.prensa__img img { width: 100%; aspect-ratio: 4 / 1; object-fit: cover; object-position: top left; }
@media (min-width: 860px) {
  .prensa { flex-direction: row; align-items: stretch; }
  .prensa__img { flex: 0 0 58%; display: flex; align-items: center; }
  .prensa__img img { aspect-ratio: auto; height: auto; }
  .prensa__cuerpo { justify-content: center; padding: 28px 32px; }
  .prensa__titulo { font-size: 24px; }
}
.prensa__cuerpo { padding: 18px 20px 20px; display: flex; flex-direction: column; gap: 6px; }
.prensa__medio { font-size: 13px; color: var(--texto-3); font-weight: 600; text-transform: uppercase; letter-spacing: .06em; }
.prensa__titulo { font: 600 19px/1.3 var(--f-titulos); }
.prensa__autor { font-size: 14px; color: var(--texto-2); }

/* ── CTA final + newsletter ───────────────────────────────────────────── */
.cta-final {
  display: grid; gap: 28px; padding: 32px 24px; border-radius: 28px; position: relative; overflow: hidden;
  background: radial-gradient(500px 300px at 100% 0%, rgba(255, 69, 0,.35), transparent 70%), radial-gradient(600px 400px at 0% 100%, rgba(168, 101, 224,.45), transparent 70%), var(--fondo-2);
  border: 1px solid var(--borde);
}
@media (min-width: 860px) { .cta-final { grid-template-columns: 1.2fr 1fr; align-items: center; padding: 56px; } }
.cta-final h2 { font-size: clamp(28px, 4vw, 42px); margin-bottom: 14px; }
.cta-final p { color: var(--texto-2); }
.cta-final__acciones { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; }
.cta-final__nl { margin: 12px 0 0; font-size: 14px; }
.newsletter { display: flex; gap: 8px; width: 100%; max-width: 420px; flex-wrap: wrap; }
.newsletter input {
  flex: 1 1 180px; min-width: 0; min-height: 42px; padding: 0 16px; border-radius: 999px; border: 1px solid var(--borde-fuerte);
  background: rgba(0, 0, 0, .25); color: var(--texto); font: 15px var(--f-texto);
}
.newsletter input::placeholder { color: var(--texto-3); }

/* ── Artículo / ficha ─────────────────────────────────────────────────── */
.volver { display: inline-block; color: var(--texto-3); text-decoration: none; font-size: 14px; font-weight: 500; margin-bottom: 18px; }
.volver:hover { color: var(--texto); }
.articulo, .ficha { padding-top: 40px; padding-bottom: 24px; }
.articulo { max-width: 820px; }
.articulo__cabeza { margin-bottom: 32px; }
.articulo__bajada { font-size: clamp(18px, 2.2vw, 21px); color: var(--texto-2); margin: 18px 0 0; max-width: 60ch; }
.articulo__meta { color: var(--texto-3); font-size: 14px; margin: 16px 0 0; }
.articulo__portada { border-radius: var(--radio); margin-bottom: 32px; width: 100%; }
.etiquetas { list-style: none; padding: 0; margin: 14px 0 0; display: flex; flex-wrap: wrap; gap: 8px; }
.etiquetas li { font-size: 13px; color: var(--texto-2); padding: 4px 10px; border-radius: 999px; background: var(--superficie-2); }

.prosa { font-size: 17px; line-height: 1.75; color: #e4def7; max-width: 70ch; overflow-wrap: anywhere; }
.prosa--angosta { margin-top: 8px; }
.prosa h2 { font-size: 26px; margin: 40px 0 14px; color: var(--texto); }
.prosa h3 { font-size: 21px; margin: 32px 0 12px; }
.prosa a { color: #e3d0ff; text-underline-offset: 3px; text-decoration-color: rgba(227, 208, 255, .45); }
.prosa a:hover { text-decoration-color: currentColor; }
.prosa ul, .prosa ol { padding-left: 22px; }
.prosa li { margin: 6px 0; }
.prosa li::marker { color: var(--naranja); }
.prosa strong { color: var(--texto); }
.prosa blockquote { margin: 24px 0; padding: 4px 0 4px 20px; border-left: 3px solid var(--violeta); color: var(--texto-2); }
.prosa code { background: var(--superficie-2); padding: 2px 6px; border-radius: 6px; font-size: .9em; }
.prosa img { border-radius: var(--radio-chico); }

.ficha__cabeza { display: flex; gap: 22px; align-items: center; margin-bottom: 36px; flex-wrap: wrap; }
.ficha__logo { flex: none; width: 96px; height: 96px; border-radius: 24px; overflow: hidden; display: block; }
.ficha__logo img { display: block; width: 100%; height: 100%; object-fit: cover; border-radius: inherit; box-shadow: 0 0 0 1px var(--borde); }
.ficha__cabeza > div { flex: 1 1 280px; min-width: 0; }
.ficha__sellos { display: flex; flex-wrap: wrap; gap: 8px; margin: 16px 0 0; }
.ficha__grilla { display: grid; gap: 32px; }
@media (min-width: 900px) { .ficha__grilla { grid-template-columns: minmax(0, 1fr) 320px; gap: 48px; } }
.ficha__principal .subtitulo:first-child { margin-top: 0; }
.ficha__lateral { display: flex; flex-direction: column; gap: 14px; }
.caja { padding: 20px; border-radius: var(--radio); background: var(--superficie); border: 1px solid var(--borde); }
.caja--suave { background: transparent; border-style: dashed; color: var(--texto-2); font-size: 15px; }
.caja--suave p { margin: 0; }
.caja__titulo { font: 600 13px/1 var(--f-texto); letter-spacing: .12em; text-transform: uppercase; color: var(--texto-3); margin-bottom: 14px; }
.equipo, .links { list-style: none; padding: 0; margin: 0; display: grid; gap: 12px; }
.equipo li { display: flex; flex-direction: column; }
.equipo__nombre { font-weight: 600; }
.equipo__rol { color: var(--texto-2); font-size: 14px; }
.links a { color: #e3d0ff; font-weight: 600; text-decoration: none; }
.links a::after { content: " ↗"; color: var(--texto-3); }

/* ── Eventos ──────────────────────────────────────────────────────────── */
.linea-tiempo { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.hito__tarjeta {
  display: flex; align-items: center; gap: 18px; padding: 16px 18px; border-radius: var(--radio);
  background: var(--superficie); border: 1px solid var(--borde); text-decoration: none; color: var(--texto); transition: .2s;
}
.hito__tarjeta:hover { border-color: var(--borde-fuerte); background: var(--superficie-2); }
.hito--futuro .hito__tarjeta { background: linear-gradient(var(--fondo-2), var(--fondo-2)) padding-box, var(--grad) border-box; border-color: transparent; }
.hito__marca {
  flex: none; width: 58px; height: 58px; border-radius: 16px; display: grid; place-items: center;
  font: 700 20px/1 var(--f-titulos); background: var(--superficie-2); border: 1px solid var(--borde);
}
.hito__tarjeta:hover .hito__marca, .hito--futuro .hito__marca { background: var(--grad-boton); border-color: transparent; color: #fff; }
.hito__cuerpo { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; min-width: 0; flex: 1; }
.hito__nombre { font: 600 19px/1.25 var(--f-titulos); }
.hito__datos { color: var(--texto-2); font-size: 14px; }
.hito__datos:empty { display: none; }
.hito__conteo { color: var(--texto-3); font-size: 13px; }
.hito__flecha { color: var(--texto-3); font-size: 20px; transition: transform .2s; }
.hito__tarjeta:hover .hito__flecha { transform: translateX(4px); color: var(--texto); }

.evento-cabeza { display: grid; gap: 28px; margin-bottom: 32px; align-items: center; }
@media (min-width: 900px) { .evento-cabeza--portada { grid-template-columns: 1fr 1fr; } }
.evento-cabeza__img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 24px; border: 1px solid var(--borde); }
@media (min-width: 900px) { .evento-cabeza__img { order: 2; } }
.evento-cabeza .boton { margin-top: 20px; }

/* ── Filtros ──────────────────────────────────────────────────────────── */
.filtros { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 28px; }
.filtros--series { margin-top: 10px; }
.chip--serie:not([aria-current]) { background: transparent; }
@media (max-width: 640px) {
  .filtros { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin-left: calc(var(--gutter) * -1); margin-right: calc(var(--gutter) * -1); padding: 0 var(--gutter); }
  .filtros::-webkit-scrollbar { display: none; }
}

/* ── Formularios ──────────────────────────────────────────────────────── */
.formulario-pagina { max-width: 720px; padding-top: 40px; padding-bottom: 64px; }
.formulario { margin-top: 32px; display: grid; gap: 20px; padding: 24px; border-radius: 24px; background: var(--superficie); border: 1px solid var(--borde); }
@media (min-width: 720px) { .formulario { padding: 36px; } }
.campo { display: grid; gap: 8px; }
.campo label { font-weight: 600; font-size: 15px; }
.campo__req { color: var(--naranja); }
.campo__opc { color: var(--texto-3); font-weight: 400; font-size: 14px; }
.campo input, .campo textarea, .campo select {
  width: 100%; min-height: 48px; padding: 12px 14px; border-radius: var(--radio-chico);
  background: rgba(0, 0, 0, .28); border: 1px solid var(--borde-fuerte); color: var(--texto);
  font: 16px/1.4 var(--f-texto); transition: border-color .15s, box-shadow .15s;
}
.campo textarea { resize: vertical; min-height: 110px; }
.campo input:focus, .campo textarea:focus, .campo select:focus { outline: none; border-color: var(--violeta); box-shadow: 0 0 0 4px rgba(168, 101, 224, .22); }
.campo__ayuda { color: var(--texto-3); font-size: 13px; margin: 0; }
.campo--error input, .campo--error textarea, .campo--error select { border-color: #fb7185; }
.campo__error { color: #fda4af; font-size: 14px; margin: 0; font-weight: 500; }
.aviso { margin-top: 20px; padding: 14px 16px; border-radius: var(--radio-chico); background: rgba(251, 113, 133, .12); border: 1px solid rgba(251, 113, 133, .4); color: #fecdd3; }
.formulario .boton { justify-self: start; min-width: 160px; }

.tarjeta-form {
  display: flex; flex-direction: column; gap: 10px; padding: 24px; border-radius: var(--radio); min-height: 190px;
  background: var(--superficie); border: 1px solid var(--borde); text-decoration: none; color: var(--texto); transition: .2s;
}
.tarjeta-form:hover { border-color: transparent; background: linear-gradient(var(--fondo-2), var(--fondo-2)) padding-box, var(--grad) border-box; transform: translateY(-2px); }
.tarjeta-form__titulo { font: 600 22px/1.2 var(--f-titulos); }
.tarjeta-form__texto { color: var(--texto-2); font-size: 15px; flex: 1; }
.comunidad { margin-top: 40px; }
.comunidad__links { display: flex; flex-wrap: wrap; gap: 12px; }

.centrado { text-align: center; padding-top: 96px; padding-bottom: 96px; display: flex; flex-direction: column; align-items: center; }
.centrado .pagina-titulo, .centrado .pagina-bajada { margin-left: auto; margin-right: auto; }
.centrado__acciones { display: flex; gap: 20px; align-items: center; justify-content: center; flex-wrap: wrap; margin-top: 24px; }
.gracias__icono { font-size: 56px; margin-bottom: 8px; }
.error-codigo { font: 700 clamp(84px, 18vw, 160px)/1 var(--f-titulos); letter-spacing: -0.05em; margin-bottom: 12px; background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.error-codigo span { -webkit-text-fill-color: initial; color: initial; font-size: .6em; vertical-align: middle; }

/* ── Pie ──────────────────────────────────────────────────────────────── */
.pie { margin-top: 48px; border-top: 1px solid var(--borde); background: linear-gradient(180deg, rgba(26, 19, 48, .6), var(--fondo)); }
.pie__grilla { display: grid; gap: 36px; padding-top: 48px; padding-bottom: 40px; }
@media (min-width: 860px) { .pie__grilla { grid-template-columns: 1.3fr 1fr 1.3fr; } }
.pie__marca p { color: var(--texto-2); max-width: 36ch; }
.pie__marca a { color: var(--texto-2); }
.pie__titulo { font: 600 13px/1 var(--f-texto); letter-spacing: .12em; text-transform: uppercase; color: var(--texto-3); margin-bottom: 16px; }
.pie__links { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.pie__links a { color: var(--texto-2); text-decoration: none; }
.pie__links a:hover { color: var(--texto); }
.pie__texto { color: var(--texto-2); font-size: 15px; }
.pie__legal { display: flex; justify-content: space-between; gap: 12px; padding-top: 18px; padding-bottom: 28px; border-top: 1px solid var(--borde); color: var(--texto-3); font-size: 13px; }
.pie__legal a { color: var(--texto-3); }
.arana-mini { display: inline-block; transform: rotate(180deg); }

/* ── Reproductor ──────────────────────────────────────────────────────── */
.reproductor { width: min(960px, calc(100vw - 24px)); padding: 0; border: 0; border-radius: 18px; background: #000; color: var(--texto); overflow: visible; }
.reproductor::backdrop { background: rgba(8, 4, 20, .82); backdrop-filter: blur(6px); }
.reproductor__marco { aspect-ratio: 16 / 9; border-radius: 18px; overflow: hidden; }
.reproductor--podcast { background: transparent; }
.reproductor--podcast .reproductor__marco { aspect-ratio: auto; height: 232px; }
.reproductor iframe { width: 100%; height: 100%; border: 0; display: block; }
.reproductor__titulo { position: absolute; top: calc(100% + 12px); left: 0; right: 0; margin: 0; color: #fff; font-weight: 500; text-align: center; padding: 0 8px; }
.reproductor__cerrar {
  position: absolute; top: -48px; right: 0; width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--borde-fuerte);
  background: rgba(255,255,255,.08); color: #fff; font-size: 16px; cursor: pointer;
}
.reproductor__cerrar:hover { background: rgba(255,255,255,.18); }

@media (max-width: 899px) {
  .merito { padding-top: 32px; }
  .merito__tapa img { max-width: 210px; margin: 0; transform: rotate(-2deg); }
}

/* Entrevista a founders (/entrevista/{token}) */
.entrevista .campo label { display: flex; gap: 12px; align-items: baseline; line-height: 1.35; }
.entrevista__num {
  flex: none; display: inline-grid; place-items: center; width: 28px; height: 28px; border-radius: 50%;
  background: var(--grad); color: #fff; font-family: var(--f-titulos); font-size: 14px; font-weight: 700;
}
.entrevista .campo__ayuda { padding-left: 40px; }
.entrevista input[type="file"] { padding: 12px; cursor: pointer; }
.entrevista .centrado__acciones { justify-content: flex-start; margin-top: 24px; }

/* ════════════════════════════════════════════════════════════════════════
   LO VIVO — animaciones y microinteracciones. Todo es mejora progresiva:
   sin JS el sitio se ve completo, y con prefers-reduced-motion se apaga.
   ════════════════════════════════════════════════════════════════════════ */

/* ── Detalles de marca ────────────────────────────────────────────────── */
.eyebrow::before {
  content: ""; display: inline-block; width: 18px; height: 2px; border-radius: 2px; margin-right: 10px;
  vertical-align: middle; background: var(--grad); translate: 0 -2px;
}
.marca__punto { display: inline-block; }
.marca:hover .marca__punto { animation: picar .6s var(--suave); }
@keyframes picar { 40% { translate: 0 -5px; } 70% { translate: 0 1px; } }
.nav a:not(.nav__cta)::after {
  content: ""; position: absolute; left: 12px; right: 12px; bottom: 3px; height: 2px; border-radius: 2px;
  background: var(--grad); scale: 0 1; transform-origin: left; transition: scale .35s var(--suave);
}
.nav a:not(.nav__cta):hover::after, .nav a[aria-current="page"]:not(.nav__cta)::after { scale: 1 1; }
.cabecera { transition: background .3s, box-shadow .3s; }
.cabecera--abajo { background: rgba(16, 12, 32, .88); box-shadow: 0 10px 30px -18px rgba(0, 0, 0, .8); }
/* La barra de progreso de lectura: sólo CSS, donde el navegador la entiende. */
@supports (animation-timeline: scroll()) {
  .cabecera::after {
    content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: var(--grad);
    transform-origin: 0 50%; animation: progreso linear both; animation-timeline: scroll(root);
  }
}
@keyframes progreso { from { transform: scaleX(0); } to { transform: scaleX(1); } }

/* ── Botones (el brillo que los cruza está en vivo.css) ────────────────── */
.boton--fantasma:hover { box-shadow: inset 0 0 0 1px rgba(255, 224, 227, .4), 0 12px 30px -16px rgba(168, 101, 224, .7); }
.nav .nav__cta { transition: filter .2s, box-shadow .25s, translate .25s var(--suave); }
.nav .nav__cta:hover { translate: 0 -1px; box-shadow: 0 10px 24px -10px rgba(214, 90, 160, .9); }

/* ── Hero ─────────────────────────────────────────────────────────────── */
.collage { transition: transform .9s var(--suave); transform: translate3d(calc(var(--px, 0) * -14px), calc(var(--py, 0) * -10px), 0); }
@media (prefers-reduced-motion: no-preference) {
  .hero__titulo { animation: asomar .9s var(--suave) .05s both, correr-gradiente 9s ease-in-out 1s infinite alternate; }
  .hero__titulo::after { animation: trazar .9s var(--suave) .55s both; }
  .hero .chip-kicker { animation: asomar .8s var(--suave) both; }
  .hero__bajada { animation: asomar .8s var(--suave) .2s both; }
  .hero__acciones { animation: asomar .8s var(--suave) .32s both; }
  .collage__img { animation: entrar-foto 1.1s var(--suave) both, flotar 7s ease-in-out 1.2s infinite alternate; }
  .collage__img--1 { animation-delay: .25s, 1.3s; }
  .collage__img--2 { animation-delay: .45s, 2.1s; animation-duration: 1.1s, 8s; }
  .collage__img--3 { animation-delay: .6s, 1.7s; animation-duration: 1.1s, 6.5s; }
  .punto { animation: latir 2.4s ease-out infinite; }
}
@keyframes asomar { from { opacity: 0; translate: 0 22px; filter: blur(6px); } to { opacity: 1; translate: 0 0; filter: blur(0); } }
@keyframes correr-gradiente { to { background-position: 100% 50%; } }
@keyframes trazar { from { scale: 0 1; } to { scale: 1 1; } }
@keyframes entrar-foto { from { opacity: 0; translate: 60px 30px; scale: .92; } to { opacity: 1; translate: 0 0; scale: 1; } }
@keyframes flotar { to { translate: 0 -10px; } }
@keyframes latir { 0% { box-shadow: 0 0 0 0 rgba(255, 69, 0, .55); } 70%, 100% { box-shadow: 0 0 0 10px rgba(255, 69, 0, 0); } }

/* ── Tarjetas (el brillo que sigue al mouse y la inclinación están en vivo.css) ── */
.tarjeta-startup__logo img, .monograma { transition: scale .45s var(--suave); }
.tarjeta-startup:hover .tarjeta-startup__logo img, .tarjeta-startup:hover .monograma { scale: 1.08; }
.tarjeta-nota__portada img { transition: scale .8s var(--suave); }
.tarjeta-nota:hover .tarjeta-nota__portada img { scale: 1.06; }
.bloque { transition: border-color .3s, translate .35s var(--suave), background .3s; }
.bloque:hover { border-color: rgba(168, 101, 224, .45); translate: 0 -3px; background: var(--superficie-2); }
.bloque__icono { transition: scale .4s var(--suave), rotate .4s var(--suave); transform-origin: 50% 80%; display: inline-block; }
.bloque:hover .bloque__icono { scale: 1.18; rotate: -8deg; }
.destacado { transition: border-color .3s, translate .35s var(--suave); }
.destacado:hover { border-color: var(--borde-fuerte); translate: 0 -3px; }

/* Borde que gira: el próximo evento, las startups nacidas en UTN.LABS y los Merecidos. */
.proximo {
  background: linear-gradient(135deg, rgba(40, 24, 72, .98), rgba(26, 18, 48, .98)) padding-box,
              conic-gradient(from var(--giro), var(--violeta), var(--magenta), var(--naranja), var(--rosa), var(--violeta)) border-box;
}
.tarjeta-startup--labs {
  background: linear-gradient(var(--fondo-2), var(--fondo-2)) padding-box,
              conic-gradient(from var(--giro), var(--violeta), var(--magenta), var(--naranja), var(--violeta)) border-box;
}
@media (prefers-reduced-motion: no-preference) {
  .proximo { animation: girar 7s linear infinite; }
  .tarjeta-startup--labs, .merecido { animation: girar 6s linear infinite paused; }
  .tarjeta-startup--labs:hover, .merecido:hover { animation-play-state: running; }
}

/* ── Videos y fotos, más de cine ──────────────────────────────────────── */
.video__img { isolation: isolate; box-shadow: 0 18px 40px -28px rgba(0, 0, 0, .9); transition: border-color .3s, box-shadow .45s var(--suave), translate .45s var(--suave); }
.video__img img { transition: transform .9s var(--suave), filter .5s; }
.video:hover .video__img { border-color: rgba(255, 224, 227, .28); box-shadow: 0 26px 50px -24px rgba(168, 101, 224, .55); translate: 0 -3px; }
.video:hover .video__img img { transform: scale(1.08); filter: saturate(1.15) brightness(1.06); }
.video__img::before {
  content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(135deg, rgba(168, 101, 224, .35), transparent 45%, rgba(255, 69, 0, .3));
  opacity: 0; transition: opacity .45s;
}
.video:hover .video__img::before { opacity: 1; }
.video__play { z-index: 2; }
.video__play::before { content: ""; position: absolute; inset: -1px; border-radius: 50%; border: 2px solid rgba(255, 69, 0, .8); opacity: 0; }
@media (prefers-reduced-motion: no-preference) {
  .video:hover .video__play::before { animation: onda 1.3s ease-out infinite; }
}
@keyframes onda { from { opacity: .9; scale: 1; } to { opacity: 0; scale: 1.8; } }
.video:hover .video__play { transform: scale(1.14); }

.foto-item { position: relative; isolation: isolate; }
.foto-item img { transition: transform .9s var(--suave), filter .5s; }
.foto-item::after {
  content: attr(data-alt); content: attr(data-alt) / "";
  position: absolute; left: 0; right: 0; bottom: 0; z-index: 1; padding: 34px 12px 10px;
  font-size: 13px; font-weight: 500; line-height: 1.35; color: #fff; pointer-events: none;
  background: linear-gradient(transparent, rgba(16, 12, 32, .9));
  opacity: 0; translate: 0 8px; transition: opacity .35s, translate .45s var(--suave);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.foto-item:hover::after, .foto-item:focus-visible::after { opacity: 1; translate: 0 0; }
.foto-item:hover img, .grilla-fotos .foto-item:hover img, .mosaico .foto-item:hover img { transform: scale(1.08); filter: saturate(1.12); }
.foto-item:focus-visible { outline-offset: -3px; }
.tarjeta-galeria__img { overflow: hidden; }
.tarjeta-galeria__img img { transition: transform .9s var(--suave); }
.tarjeta-galeria:hover .tarjeta-galeria__img img { transform: scale(1.07); }
.img-entra { opacity: 0; transition: opacity .6s ease; }
.img-entra.img-lista { opacity: 1; }

.visor[open], .reproductor[open] { animation: abrir .35s var(--suave); }
.visor[open] .visor__img { animation: abrir-foto .5s var(--suave); }
@keyframes abrir { from { opacity: 0; } }
@keyframes abrir-foto { from { opacity: 0; scale: .96; } }
.reproductor[open] .reproductor__marco { animation: abrir-foto .45s var(--suave); box-shadow: 0 40px 100px -30px rgba(168, 101, 224, .55); }

/* ── Eventos: un hilo une las ediciones ───────────────────────────────── */
.linea-tiempo { position: relative; }
.linea-tiempo::before {
  content: ""; position: absolute; left: 47px; top: -28px; bottom: 0; width: 2px; border-radius: 2px;
  background: linear-gradient(var(--violeta), var(--magenta) 40%, var(--naranja) 75%, transparent);
  opacity: .55; transform-origin: top;
}
.hito__tarjeta { background: #17122a; transition: border-color .25s, background .25s, translate .35s var(--suave); }
.hito__tarjeta:hover { background: #1e1736; translate: 4px 0; }
.hito--futuro .hito__tarjeta { background: linear-gradient(#17122a, #17122a) padding-box, var(--grad) border-box; }
.hito__marca { transition: background .3s, scale .35s var(--suave), rotate .35s var(--suave); }
.hito__tarjeta:hover .hito__marca { scale: 1.06; rotate: -4deg; }
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .linea-tiempo::before { animation: trazar-hilo linear both; animation-timeline: view(); animation-range: entry 0% cover 55%; }
  }
}
@keyframes trazar-hilo { from { transform: scaleY(0); } to { transform: scaleY(1); } }

/* ── El Merecido: medalla con brillo ──────────────────────────────────── */
.medalla {
  position: relative; overflow: hidden;
  background: radial-gradient(circle at 35% 28%, rgba(255, 255, 255, .45) 0, transparent 42%), conic-gradient(from 210deg, var(--violeta), var(--magenta), var(--naranja), #ffb08a, var(--violeta));
}
.medalla::after {
  content: ""; position: absolute; inset: 0; border-radius: 50%;
  background: linear-gradient(120deg, transparent 40%, rgba(255, 255, 255, .55) 50%, transparent 60%) no-repeat;
  background-size: 300% 100%; background-position: 100% 0;
}
@media (prefers-reduced-motion: no-preference) {
  .medalla::after { animation: destello 4.5s ease-in-out infinite; }
}
@keyframes destello { 0%, 55% { background-position: 100% 0; } 85%, 100% { background-position: 0% 0; } }
.medalla--grande { width: 88px; height: 88px; overflow: visible; margin: 22px 0 36px 22px; }
.medalla--grande span { font-size: 38px; }
.medalla--grande::before {
  content: ""; position: absolute; inset: -26px; border-radius: 50%; z-index: -1;
  background: repeating-conic-gradient(rgba(255, 224, 227, .18) 0 4deg, transparent 4deg 18deg);
  -webkit-mask: radial-gradient(circle, transparent 46px, #000 48px, transparent 70px); mask: radial-gradient(circle, transparent 46px, #000 48px, transparent 70px);
}
@media (prefers-reduced-motion: no-preference) { .medalla--grande::before { animation: rotar 40s linear infinite; } }
@keyframes rotar { to { rotate: 360deg; } }
.merecidos-cabeza .pagina-titulo {
  background: linear-gradient(100deg, var(--rosa), var(--violeta) 45%, var(--naranja)); -webkit-background-clip: text; background-clip: text; color: transparent;
  padding-bottom: .06em;
}
.merecido {
  background: linear-gradient(var(--fondo-2), var(--fondo-2)) padding-box,
              conic-gradient(from var(--giro), rgba(168, 101, 224, .75), rgba(255, 69, 0, .6), rgba(255, 224, 227, .55), rgba(168, 101, 224, .75)) border-box;
  transition: translate .4s var(--suave), box-shadow .4s var(--suave);
}
.merecido:hover { translate: 0 -4px; box-shadow: 0 30px 60px -34px rgba(255, 69, 0, .45); }
.merecido__nombre { font-weight: 800; }
.merecido__motivo { font-size: 17px; border-left: 3px solid; border-image: linear-gradient(var(--violeta), var(--naranja)) 1; }
/* La foto del premiado: arriba, recortada con foco en las caras (suelen estar en el tercio de arriba). */
.merecido__foto {
  position: relative; margin: -10px -10px 2px; aspect-ratio: 4 / 3; border-radius: calc(var(--radio) - 6px); overflow: hidden;
  background: var(--fondo); box-shadow: 0 0 0 1px rgba(255, 224, 227, .14), 0 18px 40px -26px rgba(0, 0, 0, .8);
}
.merecido__foto img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 28%; transition: scale .8s var(--suave); }
.merecido__foto::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(180deg, transparent 55%, rgba(26, 19, 48, .55)), linear-gradient(115deg, rgba(168, 101, 224, .12), transparent 40%, rgba(255, 69, 0, .1));
}
.merecido:hover .merecido__foto img { scale: 1.04; }
/* Con foto, la medalla va sobre la foto (abajo a la izquierda) y el nombre queda solo en la cabeza. */
.merecido__foto .medalla { position: absolute; left: 14px; bottom: 14px; z-index: 1; box-shadow: 0 0 0 3px rgba(16, 12, 32, .55), 0 10px 24px -8px rgba(0, 0, 0, .8); }
.merecido .medalla { transition: rotate .5s var(--suave); }
.merecido:hover .medalla { rotate: -12deg; }

/* ── MÉRITO: dorado y crema, como la tapa ─────────────────────────────── */
.merito { position: relative; isolation: isolate; }
.merito::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: radial-gradient(ellipse 30% 32% at 30% 24%, rgba(231, 194, 125, .15), transparent),
              radial-gradient(ellipse 24% 30% at 74% 58%, rgba(246, 227, 184, .05), transparent);
}
.merito .eyebrow, .destacado--merito .eyebrow { color: var(--oro); }
.merito .eyebrow::before, .destacado--merito .eyebrow::before { background: linear-gradient(90deg, var(--oro-claro), var(--oro-hondo)); }
.merito__titulo {
  font-weight: 700;
  background: linear-gradient(100deg, var(--oro-hondo) 0%, var(--oro-claro) 30%, var(--oro) 50%, #fff6df 62%, var(--oro-hondo) 100%);
  background-size: 250% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; padding-bottom: .08em;
}
@media (prefers-reduced-motion: no-preference) { .merito__titulo { animation: correr-gradiente 7s ease-in-out infinite alternate; } }
.merito .sello { background: rgba(231, 194, 125, .14); color: var(--oro-claro); border-color: rgba(231, 194, 125, .45); }
.merito .links a, .merito .prosa a { color: var(--oro-claro); }
.merito .prosa li::marker { color: var(--oro); }
.presentan { border-color: rgba(231, 194, 125, .22); background: linear-gradient(135deg, rgba(231, 194, 125, .07), transparent 60%), var(--superficie); }
.boton--descarga {
  background: linear-gradient(115deg, var(--oro-claro) 0%, var(--oro) 45%, var(--oro-hondo) 100%); background-size: 170% 100%;
  color: #1c1305; box-shadow: 0 14px 34px -14px rgba(231, 194, 125, .7);
}
.boton--descarga:hover { box-shadow: 0 18px 40px -14px rgba(231, 194, 125, .9); }
.merito__tapa { perspective: 1400px; }
.merito__tapa img { transition: transform .6s var(--suave), box-shadow .6s var(--suave); }
.merito__tapa:hover img {
  transform: rotateY(var(--ry, 0deg)) rotateX(var(--rx, 0deg)) scale(1.02);
  box-shadow: 0 50px 90px -30px rgba(0, 0, 0, .9), 0 0 0 1px rgba(231, 194, 125, .35), 0 0 60px -20px rgba(231, 194, 125, .45);
}
@media (prefers-reduced-motion: no-preference) { .merito__tapa { animation: flotar 6s ease-in-out infinite alternate; } }
.destacado--merito {
  background: radial-gradient(420px 260px at 0% 100%, rgba(231, 194, 125, .16), transparent 70%), linear-gradient(135deg, rgba(246, 227, 184, .06), transparent 60%), var(--superficie);
  border-color: rgba(231, 194, 125, .22);
}
.destacado--merito .destacado__titulo { color: var(--oro-claro); }
.destacado--merito:hover { border-color: rgba(231, 194, 125, .45); }
.destacado__tapa { transition: transform .5s var(--suave), box-shadow .5s; }
.destacado--merito:hover .destacado__tapa { transform: rotate(0) scale(1.04); box-shadow: 0 24px 50px -16px rgba(0, 0, 0, .85), 0 0 40px -14px rgba(231, 194, 125, .55); }

/* ── Pie: la araña de fondo, como en las placas ───────────────────────── */
.pie { position: relative; overflow: hidden; isolation: isolate; }
.pie::before {
  content: ""; position: absolute; z-index: -1; pointer-events: none; width: 380px; aspect-ratio: 200 / 232;
  right: -90px; bottom: -70px; rotate: -18deg; opacity: .07; background: var(--rosa);
  -webkit-mask: url("arana.png") center / contain no-repeat; mask: url("arana.png") center / contain no-repeat;
}
.marca--pie { font-size: 34px; }
.pie__links a { transition: color .2s, translate .25s var(--suave); display: inline-block; }
.pie__links a:hover { translate: 4px 0; }

/* ── Transiciones entre páginas (View Transitions, mejora progresiva) ─── */
@media (prefers-reduced-motion: no-preference) {
  @view-transition { navigation: auto; }
}
.cabecera { view-transition-name: cabecera; }
::view-transition-old(root) { animation: .28s var(--suave) both vt-salir; }
::view-transition-new(root) { animation: .42s var(--suave) both vt-entrar; }
::view-transition-group(*) { animation-duration: .5s; animation-timing-function: var(--suave); }
/* Un nombre de transición no puede partirse en dos líneas: estos van como bloque en línea. */
.pagina-titulo > span, .proximo__titulo a { display: inline-block; }
@keyframes vt-salir { to { opacity: 0; translate: 0 -10px; } }
@keyframes vt-entrar { from { opacity: 0; translate: 0 18px; } }

/* ════════════════════════════════════════════════════════════════════════
   SIMPLE — el inicio gira alrededor del próximo evento; el Micrófono Abierto
   tiene su lugar; la ficha de startup arranca por su video.
   ════════════════════════════════════════════════════════════════════════ */

@media (max-width: 640px) {
  .nav a:not(.nav__cta)::after { left: 32%; right: 32%; bottom: 3px; }
}

.boton--grande { min-height: 56px; padding: 0 32px; font-size: 17px; }
.hero__contenido > .chip-kicker { justify-self: start; }
@media (min-width: 900px) { .grilla--tres { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
/* En el celular la nacida en UTN.LABS ocupa la fila entera: la última no queda sola. */
@media (max-width: 520px) {
  .grilla--tres:has(.tarjeta-startup--labs) > :last-child:nth-child(even) { grid-column: 1 / -1; flex-direction: row; flex-wrap: wrap; }
  .grilla--tres:has(.tarjeta-startup--labs) > :last-child:nth-child(even) > .tarjeta-startup__cuerpo { flex: 1 1 0; }
  .grilla--tres:has(.tarjeta-startup--labs) > :last-child:nth-child(even) > .tarjeta-startup__acciones { flex: 1 0 100%; }
}

/* ── Hero del próximo evento ──────────────────────────────────────────── */
.evento-fecha {
  margin: 4px 0 6px; font: 900 clamp(104px, 27vw, 230px)/.84 var(--f-titulos); letter-spacing: -0.065em;
  background: linear-gradient(100deg, var(--violeta) 0%, var(--magenta) 30%, var(--naranja) 50%, var(--magenta) 70%, var(--violeta) 100%);
  background-size: 220% 100%; -webkit-background-clip: text; background-clip: text; color: transparent;
  padding: 0 .04em .04em 0; width: fit-content;
}
.hero__titulo--evento {
  font-size: clamp(30px, 5.4vw, 58px); font-weight: 800; letter-spacing: -0.03em; line-height: 1.04; max-width: 20ch;
  background: none; -webkit-background-clip: border-box; background-clip: border-box; color: var(--texto);
}
.hero__titulo--evento::after { margin-top: 22px; }
.hero--evento .hero__bajada { margin: 20px 0 30px; max-width: 42ch; color: var(--texto-2); }
.hero--evento .chip-kicker__extra { color: var(--rosa); font-weight: 600; }
.collage--placa { display: none; }
@media (min-width: 1040px) {
  .collage--placa { display: flex; align-items: center; min-height: 0; }
  .collage--placa .collage__img--1 { position: relative; top: auto; right: auto; width: 100%; aspect-ratio: auto; height: auto; }
}
@media (max-width: 640px) {
  .hero--evento .chip-kicker__extra { display: inline; }
  .hero--evento .chip-kicker { flex-wrap: wrap; }
}
@media (prefers-reduced-motion: no-preference) {
  .evento-fecha { animation: asomar .9s var(--suave) .1s both, correr-gradiente 8s ease-in-out 1s infinite alternate; }
}

/* ── Micrófono Abierto ────────────────────────────────────────────────── */
.seccion__bajada { color: var(--texto-2); margin: -12px 0 26px; max-width: 60ch; }
.grilla--micro { grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: 30px 20px; }
.micro { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.micro__video { gap: 12px; }
.micro__persona { font: 700 18px/1.25 var(--f-titulos); letter-spacing: -0.01em; }
.micro__video:hover .micro__persona { color: #e6d6ff; }
.micro__edicion {
  position: absolute; top: 10px; left: 10px; z-index: 2; padding: 5px 8px; border-radius: 8px;
  font: 800 12px/1 var(--f-titulos); color: #fff; background: rgba(16, 12, 32, .72); border: 1px solid var(--borde-fuerte);
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
}
.micro__startup { margin: 0; color: var(--texto-2); font-size: 14px; line-height: 1.45; }
.micro__startup a { color: #e3d0ff; font-weight: 600; text-decoration: none; }
.micro__startup a:hover { text-decoration: underline; text-underline-offset: 3px; }
.micro__startup a span { display: inline-block; transition: translate .25s var(--suave); }
.micro__startup a:hover span { translate: 3px 0; }

/* La página: más densa (cuatro por fila; dos en el celular). */
.edicion .grilla--micro { grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr)); gap: 26px 16px; }
@media (max-width: 640px) {
  .edicion .grilla--micro { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 12px; }
  .edicion .micro__persona { font-size: 15px; }
  .edicion .micro__startup { font-size: 13px; }
  .edicion .video__play { width: 34px; height: 34px; left: 8px; bottom: 8px; }
  .edicion .video__play::after { left: 13px; top: 9px; border-width: 8px 0 8px 12px; }
}
.microfono-cabeza__acciones { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 24px; margin-top: 26px; }
.edicion__titulo { gap: 14px; flex-wrap: wrap; }
.edicion__titulo a { color: var(--texto); text-decoration: none; }
.edicion__titulo a:hover { color: #e6d6ff; }
.edicion__marca {
  display: inline-grid; place-items: center; min-width: 52px; height: 40px; padding: 0 10px; border-radius: 12px;
  font: 900 18px/1 var(--f-titulos); color: #fff; background: var(--grad-boton);
}

/* ── Franja: El Merecido y MÉRITO ─────────────────────────────────────── */
.seccion--franja { padding-block: 24px; }
.franja { display: grid; gap: 14px; }
@media (min-width: 760px) { .franja { grid-template-columns: 1fr 1fr; } }
.franja__item {
  position: relative; display: flex; align-items: center; gap: 20px; padding: 22px 24px; border-radius: 22px;
  background: var(--superficie); border: 1px solid var(--borde); transition: border-color .3s, translate .35s var(--suave);
}
.franja__item:hover { translate: 0 -2px; border-color: var(--borde-fuerte); }
.franja__item .eyebrow { margin-bottom: 8px; }
.franja__titulo { font-size: clamp(22px, 2.6vw, 28px); margin-bottom: 8px; }
.franja__nombres { margin: 0 0 10px; color: var(--texto-3); }
.franja__nombres a { color: var(--texto); font-weight: 600; text-decoration: none; }
.franja__nombres a:hover { color: #e6d6ff; }
.franja__item--merecido { background: radial-gradient(360px 220px at 100% 0%, rgba(255, 69, 0, .14), transparent 70%), var(--superficie); }
.franja__item--merito {
  background: radial-gradient(360px 220px at 0% 100%, rgba(231, 194, 125, .15), transparent 70%), var(--superficie);
  border-color: rgba(231, 194, 125, .22);
}
.franja__item--merito:hover { border-color: rgba(231, 194, 125, .45); }
.franja__item--merito .eyebrow { color: var(--oro); }
.franja__item--merito .eyebrow::before { background: linear-gradient(90deg, var(--oro-claro), var(--oro-hondo)); }
.franja__item--merito .franja__titulo { color: var(--oro-claro); }
.franja__item--merito .link-flecha { color: var(--oro-claro); }
.franja__tapa { flex: none; width: 74px; border-radius: 4px; overflow: hidden; rotate: -4deg; box-shadow: 0 16px 30px -14px rgba(0, 0, 0, .9); transition: rotate .4s var(--suave), scale .4s var(--suave); }
.franja__item--merito:hover .franja__tapa { rotate: 0deg; scale: 1.05; }
.franja__item .medalla { width: 54px; height: 54px; }

/* ── Sumate: tres caminos y la newsletter ─────────────────────────────── */
.caminos { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); }
.camino {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 24px; border-radius: 18px;
  background: var(--superficie); border: 1px solid var(--borde); color: var(--texto); text-decoration: none;
  font: 700 clamp(18px, 2vw, 21px)/1.2 var(--f-titulos);
  transition: translate .3s var(--suave), border-color .25s, background .25s;
}
.camino:hover { translate: 0 -2px; border-color: transparent; background: linear-gradient(var(--fondo-2), var(--fondo-2)) padding-box, var(--grad) border-box; }
.camino__flecha { color: var(--texto-3); font-size: 22px; transition: translate .3s var(--suave), color .25s; }
.camino:hover .camino__flecha { translate: 4px 0; color: var(--naranja); }
.caminos__newsletter {
  display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; margin-top: 14px; padding: 18px 24px;
  border-radius: 18px; border: 1px dashed var(--borde-fuerte);
}
.caminos__nl-texto { margin: 0; color: var(--texto-2); flex: 1 1 260px; }

/* ── Nos acompañan, chiquito ──────────────────────────────────────────── */
.seccion--acompanan { padding-block: 8px 48px; display: flex; flex-wrap: wrap; align-items: center; gap: 14px 32px; }
.acompanan__titulo { font: 600 12px/1 var(--f-texto); letter-spacing: .14em; text-transform: uppercase; color: var(--texto-3); }
.seccion--acompanan .partners { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 30px; }
.seccion--acompanan .partners__item, .seccion--acompanan .partners__item a { height: auto; padding: 0; border: 0; background: none; }
.seccion--acompanan .partners__item:hover { background: none; translate: none; }
.seccion--acompanan .partners__item img { max-height: 28px; opacity: .7; }
.seccion--acompanan .partners__nombre { font-size: 15px; color: var(--texto-2); }
.seccion--acompanan .partners__item:hover img { opacity: 1; }
.seccion--acompanan .partners__item:hover .partners__nombre { color: var(--texto); }

/* ── Ficha de startup: su video arriba, grande; su nota abajo ─────────── */
.ficha__video { margin: 0 0 40px; }
.ficha__marco { display: block; }
.ficha__marco .video__img { border-radius: 22px; box-shadow: 0 40px 90px -40px rgba(168, 101, 224, .55); }
.ficha__marco .video__play { left: 50%; top: 50%; bottom: auto; width: 78px; height: 78px; translate: -50% -50%; background: var(--grad-boton); border: 0; }
.ficha__marco .video__play::after { left: 30px; top: 23px; border-width: 16px 0 16px 24px; }
.ficha__marco:hover .video__play { transform: scale(1.1); }
@media (max-width: 640px) {
  .ficha__marco .video__img { border-radius: 16px; }
  .ficha__marco .video__play { width: 60px; height: 60px; }
  .ficha__marco .video__play::after { left: 23px; top: 17px; border-width: 13px 0 13px 19px; }
}
.ficha__video-pie { margin: 12px 0 0; color: var(--texto-3); font-size: 14px; }
.ficha__nota {
  position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 8px; margin-bottom: 28px; padding: 24px;
  border-radius: var(--radio); text-decoration: none; color: var(--texto);
  background: linear-gradient(var(--fondo-2), var(--fondo-2)) padding-box, var(--grad) border-box; border: 1px solid transparent;
  transition: translate .3s var(--suave);
}
.ficha__nota:hover { translate: 0 -2px; }
.ficha__nota .eyebrow { margin: 0; }
.ficha__nota-titulo { font: 700 clamp(20px, 2.4vw, 24px)/1.2 var(--f-titulos); }
.ficha__nota-bajada { color: var(--texto-2); }

/* ── Pie: el archivo ──────────────────────────────────────────────────── */
.pie__legal { flex-wrap: wrap; }
.pie__archivo a { color: var(--texto-2); text-decoration: none; }
.pie__archivo a:hover { color: var(--texto); text-decoration: underline; text-underline-offset: 3px; }

/* ── El blog (/notas) ─────────────────────────────────────────────────── */
.temas { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 24px; }
@media (max-width: 640px) {
  /* En el celular, los temas se deslizan en una sola fila (sin empujar la página). */
  .temas { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin-inline: calc(var(--gutter) * -1); padding-inline: var(--gutter); scroll-padding-inline: var(--gutter); scroll-snap-type: x proximity; }
  .temas::-webkit-scrollbar { display: none; }
  .temas .chip { scroll-snap-align: start; }
}
.nota-destacada {
  display: grid; gap: 0; margin: 8px 0 28px; border-radius: calc(var(--radio) + 4px); overflow: hidden; text-decoration: none; color: var(--texto);
  background: var(--fondo-2); border: 1px solid var(--borde); position: relative;
  transition: border-color .3s, translate .4s var(--suave), box-shadow .4s var(--suave);
}
.nota-destacada:hover { border-color: var(--borde-fuerte); translate: 0 -3px; box-shadow: 0 30px 60px -32px rgba(168, 101, 224, .6); }
@media (min-width: 900px) { .nota-destacada { grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); } }
.nota-destacada__portada { position: relative; aspect-ratio: 16 / 9; overflow: hidden; background: var(--grad); display: grid; place-items: center; }
.nota-destacada__portada img { width: 100%; height: 100%; object-fit: cover; transition: scale .9s var(--suave); }
.nota-destacada:hover .nota-destacada__portada img { scale: 1.04; }
.nota-destacada__portada--logo, .tarjeta-nota__portada--logo { background: radial-gradient(circle at 30% 20%, rgba(168, 101, 224, .45), transparent 60%), radial-gradient(circle at 80% 90%, rgba(255, 69, 0, .35), transparent 60%), var(--fondo-2); }
.nota-destacada__portada--logo img, .tarjeta-nota__portada--logo img { object-fit: contain; width: 46%; height: 60%; filter: drop-shadow(0 10px 24px rgba(0, 0, 0, .5)); }
.nota-destacada__cuerpo { display: flex; flex-direction: column; gap: 12px; padding: clamp(22px, 3vw, 40px); justify-content: center; }
.nota-destacada__cuerpo .eyebrow { margin: 0; }
.nota-destacada__titulo { font: 800 clamp(24px, 3.2vw, 36px)/1.12 var(--f-titulos); letter-spacing: -.025em; }
.nota-destacada__bajada { color: var(--texto-2); font-size: 17px; }
.paginado { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-top: 40px; }
.articulo__meta time { color: var(--texto-2); }
.etiquetas a { color: inherit; text-decoration: none; }
.etiquetas li:hover { color: var(--texto); }
.articulo__video { display: block; margin-bottom: 32px; }
.articulo__video .video__img { border-radius: var(--radio); }
.articulo__video .video__play { width: 64px; height: 64px; left: 20px; bottom: 20px; }
.articulo__video .video__play::after { left: 25px; top: 20px; border-width: 12px 0 12px 18px; }
.articulo__video .video__titulo { display: none; }
.nota-startup {
  display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 16px; align-items: center; margin: 0 0 32px; padding: 18px 20px;
  border-radius: var(--radio); text-decoration: none; color: var(--texto);
  background: linear-gradient(var(--fondo-2), var(--fondo-2)) padding-box, var(--grad) border-box; border: 1px solid transparent;
}
.nota-startup__logo { width: 56px; height: 56px; border-radius: 14px; object-fit: contain; background: #fff; padding: 6px; }
.nota-startup__logo--inicial { display: grid; place-items: center; background: var(--grad); color: #fff; font: 800 18px/1 var(--f-titulos); padding: 0; }
.nota-startup__texto { display: grid; gap: 2px; min-width: 0; }
.nota-startup__texto .eyebrow { margin: 0 0 4px; }
.nota-startup__nombre { font: 700 19px/1.2 var(--f-titulos); }
.nota-startup__bajada { color: var(--texto-2); font-size: 14px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.nota-startup__ir { grid-column: 2; font-weight: 600; font-size: 14px; }
@media (min-width: 640px) { .nota-startup { grid-template-columns: auto minmax(0, 1fr) auto; } .nota-startup__ir { grid-column: auto; } }

/* ── Movimiento reducido: todo quieto ─────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
  .cabecera::after { display: none; }
}

/* ── Entrevistas: formatos, tarjetas y filtros (/entrevistas, /startups, el inicio) ── */
[hidden] { display: none !important; }

/* Cada formato tiene su color (badge, tooltip y chip del filtro). */
.formato--microfono-abierto, .chip--microfono-abierto { --fc-fondo: rgba(255, 69, 0, .16); --fc-texto: #ffc29e; --fc-borde: rgba(255, 69, 0, .5); }
.formato--videopodcast, .chip--videopodcast { --fc-fondo: rgba(168, 101, 224, .2); --fc-texto: #e2ccff; --fc-borde: rgba(168, 101, 224, .6); }
.formato--las-merecidas, .chip--las-merecidas { --fc-fondo: rgba(214, 90, 160, .18); --fc-texto: #ffc4e4; --fc-borde: rgba(214, 90, 160, .55); }
.formato--lab-talks, .chip--lab-talks { --fc-fondo: rgba(255, 224, 227, .09); --fc-texto: #ffe0e3; --fc-borde: rgba(255, 224, 227, .42); }
.formato--merecido, .chip--merecido { --fc-fondo: rgba(231, 194, 125, .16); --fc-texto: #f6e3b8; --fc-borde: rgba(231, 194, 125, .55); }
.formato--consultorio, .chip--consultorio { --fc-fondo: rgba(94, 200, 220, .14); --fc-texto: #b5ecf5; --fc-borde: rgba(94, 200, 220, .5); }

.formato { position: relative; display: inline-flex; }
.formato__badge {
  display: inline-flex; align-items: center; gap: 6px; min-height: 28px; padding: 4px 11px; border-radius: 999px; cursor: help;
  font: 700 12px/1 var(--f-texto); letter-spacing: .02em; white-space: nowrap;
  color: var(--fc-texto, var(--texto-2)); background: var(--fc-fondo, var(--superficie-2)); border: 1px solid var(--fc-borde, var(--borde));
  transition: background .2s, border-color .2s;
}
.formato__badge::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; opacity: .85; }
.formato__badge:hover { border-color: var(--fc-texto, var(--borde-fuerte)); }
.formato__tip {
  position: absolute; left: var(--dx, 0px); bottom: calc(100% + 10px); z-index: 30; width: max-content; max-width: min(290px, calc(100vw - 32px));
  padding: 11px 13px; border-radius: 12px; font: 400 13.5px/1.45 var(--f-texto); color: var(--texto); white-space: normal;
  background: #241a40; border: 1px solid var(--fc-borde, var(--borde-fuerte)); box-shadow: 0 18px 40px -14px rgba(0, 0, 0, .85);
  /* Cerrado no ocupa nada (con visibility: hidden igual estiraba el ancho de la página en el celular). */
  display: none; pointer-events: none;
}
.formato__tip::after {
  content: ""; position: absolute; left: calc(18px - var(--dx, 0px)); top: 100%; width: 10px; height: 10px; margin-top: -5px; rotate: 45deg;
  background: #241a40; border: solid var(--fc-borde, var(--borde-fuerte)); border-width: 0 1px 1px 0;
}
.formato:hover .formato__tip, .formato__badge:focus-visible + .formato__tip, .formato--abierto .formato__tip {
  display: block; animation: tip-asoma .2s var(--suave);
}
@keyframes tip-asoma { from { opacity: 0; translate: 0 6px; } }
@media (prefers-reduced-motion: reduce) { .formato__tip { animation: none !important; } }

/* La tarjeta de una charla. */
.grilla--charlas { grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr)); gap: 30px 18px; }
.grilla--charlas-inicio { grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); }
.charla { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.charla__video { margin-bottom: 6px; }
.charla__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.charla__edicion {
  padding: 4px 8px; border-radius: 8px; font: 800 11.5px/1 var(--f-titulos); letter-spacing: .02em;
  color: var(--texto-3); background: var(--superficie); border: 1px solid var(--borde);
}
.charla__persona { font: 700 17px/1.25 var(--f-titulos); letter-spacing: -0.01em; margin-top: 2px; }
.charla__tema { margin: 0; color: var(--texto-2); font-size: 14px; line-height: 1.45;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.charla__links { margin: 2px 0 0; display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 14px; color: var(--texto-2); }
.charla__startup { color: #e3d0ff; font-weight: 600; text-decoration: none; }
.charla__startup span { display: inline-block; transition: translate .25s var(--suave); }
.charla__startup:hover span { translate: 3px 0; }
.charla__startup:hover, .charla__nota:hover { text-decoration: underline; text-underline-offset: 3px; }
.charla__nota { color: var(--texto-2); text-decoration: none; }
.charla__nota:hover { color: var(--texto); }
@media (max-width: 640px) {
  .grilla--charlas:not(.carrusel-movil) { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 12px; }
  .grilla--charlas:not(.carrusel-movil) .charla__persona { font-size: 15px; }
  .grilla--charlas:not(.carrusel-movil) .charla__tema, .grilla--charlas:not(.carrusel-movil) .charla__links { font-size: 13px; }
  .grilla--charlas:not(.carrusel-movil) .video__play { width: 34px; height: 34px; left: 8px; bottom: 8px; }
  .grilla--charlas:not(.carrusel-movil) .video__play::after { left: 13px; top: 9px; border-width: 8px 0 8px 12px; }
  .grilla--charlas:not(.carrusel-movil) .formato__badge { font-size: 11px; padding: 4px 9px; }
}

/* Filtros: buscador + selects + chips. Sin JS se ve «Filtrar»; con JS filtra al tipear y el botón sobra. */
.filtrado { padding-bottom: 20px; }
.buscador { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px; }
.buscador__campo { display: grid; gap: 6px; flex: 1 1 160px; min-width: 0; }
.buscador__campo--texto { flex: 3 1 260px; }
.buscador__campo label { font: 600 12px/1 var(--f-texto); letter-spacing: .1em; text-transform: uppercase; color: var(--texto-3); }
.buscador input, .buscador select {
  width: 100%; min-height: 46px; padding: 0 14px; border-radius: 14px; font: 400 16px/1 var(--f-texto); color: var(--texto);
  background: var(--superficie); border: 1px solid var(--borde-fuerte); transition: border-color .2s, box-shadow .2s;
}
.buscador input[type="search"] {
  padding-left: 42px;
  background: var(--superficie) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='none' stroke='%23958ab5' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='8' cy='8' r='6'/%3E%3Cpath d='m13 13 4 4'/%3E%3C/svg%3E") no-repeat 15px 50%;
}
.buscador select { appearance: none; padding-right: 36px; cursor: pointer;
  background: var(--superficie) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%23c9bfdf' stroke-width='2'%3E%3Cpath d='m1 1 5 5 5-5'/%3E%3C/svg%3E") no-repeat right 14px center; }
.buscador select option { background: var(--fondo-2); color: var(--texto); }
.buscador input:focus, .buscador select:focus { outline: none; border-color: var(--violeta); box-shadow: 0 0 0 4px rgba(168, 101, 224, .22); }
.filtrado--vivo .buscador__enviar { display: none; }
.filtrado .filtros { margin-top: 18px; }
.chip--formato { color: var(--fc-texto); border-color: var(--fc-borde); background: var(--fc-fondo); }
.chip--formato:hover { color: var(--fc-texto); border-color: var(--fc-texto); }
.chip--formato[aria-current="true"] { color: var(--fondo); background: var(--fc-texto); border-color: transparent; }
.chip--con { gap: 8px; }
.chip--con__play { width: 16px; height: 16px; border-radius: 50%; background: var(--grad); position: relative; }
.chip--con__play::after { content: ""; position: absolute; left: 6px; top: 4px; border-style: solid; border-width: 4px 0 4px 6px; border-color: transparent transparent transparent #fff; }
.filtrado__total { margin: 16px 0 0; color: var(--texto-3); font-size: 14px; font-variant-numeric: tabular-nums; }

/* Categorías en la tarjeta de startup: links propios por encima del link que estira la tarjeta. */
.tarjeta-startup__categorias { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 2px; }
.cat {
  position: relative; z-index: 3; max-width: 100%; padding: 3px 9px; border-radius: 10px; font-size: 12px; line-height: 1.35; font-weight: 500; text-decoration: none;
  color: var(--texto-2); background: var(--superficie); border: 1px solid var(--borde); transition: color .15s, border-color .15s;
}
.cat:hover { color: var(--texto); border-color: var(--borde-fuerte); }
.cat:focus-visible { outline: 2px solid var(--violeta); outline-offset: 2px; }