/* Composición: portal editorial en bandas de ancho completo que alternan blanco,
     azul niebla y azul noche; la ficha catalográfica (número de obra, DOI, fecha)
     es el motivo que se repite en novedades y catálogo. */
  :root {
    --azul-brillante: #00ADEB;  /* solo acentos */
    --azul-profundo:  #0094CE;  /* palabras clave y botones */
    --gris-carbon:    #414042;
    --gris-medio:     #58595B;
    --gris-claro:     #808285;
    --blanco:         #FFFFFF;
    --blanco-hueso:   #FAF9F6;
    --marfil:         #F8F5EF;
    --tinte-azul:     #E8EFF3;  /* azul niebla: menú y bandas suaves */
    --azul-tinta:     #00628C;
    --azul-noche:     #0B3B55;
    --azul-hielo:     #B9CDD6;
    --azul-filete:    #B3C3CC;
    --blanco-fijo:    #FFFFFF;
    --hueso-fijo:     #FAF9F6;
    --noche-fijo:     #0B3B55;
    --azul-texto:     var(--azul-tinta);
    --azul-noche-texto: var(--azul-noche);
    --azul-clave:     var(--azul-profundo);
    --barra:          #0094CE;  /* barras de la gráfica (validado contra blanco) */
    --fondo:          var(--blanco);

    --fuente: "Fira Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
    --mono:   "Fira Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
    --light: 300; --regular: 400; --medium: 500; --semibold: 600;

    --t-etiqueta: 0.875rem;
    --t-apoyo:    1rem;
    --t-cuerpo:   1.0625rem;
    --t-sub:      clamp(1.125rem, 1rem + .6vw, 1.375rem);
    --t-h3:       1.25rem;
    --t-h2:       clamp(1.875rem, 1.3rem + 2.2vw, 3rem);
    --t-titulo:   clamp(2.5rem, 1.4rem + 4.6vw, 4.75rem);

    --ancho: 1200px;
    --gutter: clamp(16px, 4vw, 48px);
    --sec-y: clamp(64px, 9vw, 120px);
    --nav-alto: 64px;
    --filete: 1px solid var(--azul-filete);
    --radio: 14px;
  }
  /* Modo nocturno: lo activa el botón de luna (el portal abre siempre en modo claro) */
  html[data-tema="noche"], :root[data-theme="dark"][data-tema="noche"] {
    color-scheme: dark;
    --blanco:       #15232C;
    --blanco-hueso: #0E1920;
    --marfil:       #101C24;
    --tinte-azul:   #1A2D39;
    --gris-carbon:  #E8EEF2;
    --gris-medio:   #BAC7CF;
    --gris-claro:   #93A4AE;
    --azul-filete:  #2E4756;
    --azul-noche:   #08202D;
    --noche-fijo:   #08202D;
    --azul-texto:   #74D0F5;
    --azul-noche-texto: #E8EEF2;
    --azul-clave:   #3FBDEE;
    --barra:        #22A0D4;  /* validado contra la superficie nocturna */
    --fondo:        #0E1920;
  }

  *, *::before, *::after { box-sizing: border-box; }
  [hidden] { display: none !important; }
  html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: calc(var(--nav-alto) + 16px); }
  @media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
  body {
    margin: 0; background: var(--fondo); color: var(--gris-carbon);
    font-family: var(--fuente); font-size: var(--t-cuerpo); line-height: 1.55;
    -webkit-font-smoothing: antialiased;
  }
  body::before { content: ""; position: fixed; inset: 0 0 auto; height: env(safe-area-inset-top, 0px); z-index: 30; background: var(--tinte-azul); }
  img { display: block; max-width: 100%; }
  h1, h2, h3, p, dl, dd, figure, ul, ol { margin: 0; }
  ul, ol { padding: 0; list-style: none; }
  a { color: inherit; }
  :focus-visible { outline: 2px solid var(--azul-clave); outline-offset: 3px; }
  .visualmente-oculto { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
  .contenedor {
    width: 100%; max-width: calc(var(--ancho) + 2 * var(--gutter)); margin-inline: auto;
    padding-left: max(var(--gutter), env(safe-area-inset-left, 0px));
    padding-right: max(var(--gutter), env(safe-area-inset-right, 0px));
  }
  .banda { padding-block: var(--sec-y); }
  .etiqueta {
    font-size: var(--t-etiqueta); font-weight: var(--semibold); text-transform: uppercase;
    letter-spacing: .12em; line-height: 1.4; color: var(--azul-texto);
  }
  .clave { color: var(--azul-clave); }
  .icono { width: 24px; height: 24px; flex: none; fill: none; stroke: var(--azul-brillante); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
  .h2 { font-size: var(--t-h2); font-weight: var(--semibold); line-height: 1.08; letter-spacing: -.02em; text-wrap: balance; }
  .cabeza-seccion { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 16px 32px; margin-bottom: clamp(32px, 5vw, 56px); }
  .cabeza-seccion > div { display: grid; gap: 12px; max-width: 40em; }
  .cabeza-seccion p.intro { color: var(--gris-medio); max-width: 38em; }
  .enlace-flecha {
    display: inline-flex; align-items: center; gap: 8px; min-height: 44px;
    font-weight: var(--semibold); color: var(--azul-texto); text-decoration: none;
  }
  .enlace-flecha .icono { width: 18px; height: 18px; stroke: currentColor; transition: translate .2s ease; }
  .enlace-flecha:hover .icono { translate: 3px 0; }
  .enlace-flecha:hover { text-decoration: underline; text-underline-offset: 4px; }

  /* ---------- Menú ---------- */
  .nav { position: sticky; top: env(safe-area-inset-top, 0px); z-index: 20; background: var(--tinte-azul); border-bottom: var(--filete); }
  .nav .contenedor { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: var(--nav-alto); position: relative; }
  .nav__identidad { display: flex; align-items: center; gap: 14px; flex: none; }
  .nav__logo { display: block; line-height: 0; }
  .nav__logo img { height: 27px; width: auto; }  /* 70 % del tamaño anterior (38 px) */
  html[data-tema="noche"] .nav__logo img { content: url("../img/logo-comunicacion-cientifica-blanco.png"); }
  .nav__separador { width: 1px; height: 28px; background: var(--azul-filete); }
  .nav__marca { font-size: 1.0625rem; font-weight: var(--semibold); color: var(--gris-carbon); text-decoration: none; }
  .nav__enlaces { display: flex; align-items: center; margin-inline: auto; }
  .nav__enlaces-viejo {
    position: relative; font-size: .9375rem; font-weight: var(--medium); letter-spacing: 0;
    color: var(--gris-medio); text-decoration: none; padding: 8px 12px; border-radius: 999px; white-space: nowrap;
    transition: color .2s ease, background-color .2s ease;
  }
  .nav__enlaces-viejo:hover { color: var(--gris-carbon); background: var(--blanco); }
  .nav__enlaces-viejo[aria-current="true"] { color: var(--gris-carbon); }
  .nav__enlaces-viejo[aria-current="true"]::after {
    content: ""; position: absolute; left: 12px; right: 12px; bottom: 2px; height: 2px; border-radius: 2px; background: var(--azul-brillante);
  }
  .nav__enlaces > ul { display: flex; align-items: center; gap: 2px; }
  .nav__item { position: relative; }
  .nav__boton {
    display: inline-flex; align-items: center; gap: 4px; font: inherit; font-size: .9375rem; font-weight: var(--medium);
    color: var(--gris-medio); background: none; border: 0; cursor: pointer; padding: 8px 10px 8px 12px; border-radius: 999px; white-space: nowrap;
    transition: color .2s ease, background-color .2s ease;
  }
  .nav__boton svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; transition: rotate .2s ease; }
  .nav__item > a.nav__boton:hover, .nav__item:hover > .nav__boton, .nav__item.abierto > .nav__boton { color: var(--gris-carbon); background: var(--blanco); }
  .nav__item.abierto > .nav__boton svg { rotate: 180deg; }
  .nav__item.activo > .nav__boton, .nav__item.activo > a { color: var(--gris-carbon); }
  .nav__item.activo > .nav__boton::after, .nav__item.activo > a::after {
    content: ""; position: absolute; left: 12px; right: 12px; bottom: 2px; height: 2px; border-radius: 2px; background: var(--azul-brillante);
  }
  .nav__boton { position: relative; text-decoration: none; }
  /* Secciones seguidas con el mismo fondo (Cuenta → Cursos, y Obra del día → Biblioteca): menos espacio entre ellas */
  #cursos, #biblioteca { padding-top: clamp(40px, 4.5vw, 64px); }
  #cuenta { padding-bottom: clamp(48px, 5vw, 64px); }
  /* Áreas de conocimiento en el inicio (las arma areas/construir_areas.py) */
  /* ---------- Inicio: «Books in English» (lo llena ingles/construir_ingles.py) ---------- */
  .bi-promo { position: relative; overflow: hidden; background: radial-gradient(rgba(0, 148, 206, .14) 1px, transparent 1.2px) 0 0 / 16px 16px, linear-gradient(135deg, var(--tinte-azul), var(--fondo) 70%); }
  .bi-promo__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .95fr); gap: clamp(28px, 5vw, 72px); align-items: center; }
  .bi-promo__texto .h2 { margin-top: 6px; }
  .bi-promo__texto .intro { margin-top: 14px; max-width: 36em; }
  .bi-promo__sello { display: flex; align-items: flex-start; gap: 12px; margin: 18px 0 0; max-width: 38em; padding: 14px 16px; border-radius: 14px;
    background: var(--fondo); border: 1.5px solid var(--azul-brillante); box-shadow: 0 16px 34px -26px rgba(0, 60, 90, .6); color: var(--gris-medio); line-height: 1.45; }
  .bi-promo__sello svg { flex: none; width: 34px; height: 34px; padding: 6px; border-radius: 50%; background: var(--azul-brillante); fill: none; stroke: #062B3D; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
  .bi-promo__sello b { color: var(--azul-noche-texto); font-weight: var(--semibold); }
  .bi-promo__datos { display: flex; flex-wrap: wrap; gap: 8px; margin: 22px 0 0; padding: 0; list-style: none; }
  .bi-promo__datos li { padding: 7px 14px; border-radius: 999px; background: var(--fondo); border: var(--filete); font-size: .9375rem; color: var(--gris-medio); }
  .bi-promo__datos b { color: var(--azul-texto); font-weight: var(--semibold); font-variant-numeric: tabular-nums; }
  .bi-promo__botones { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; }
  .bi-promo__nota { margin: 14px 0 0; font-size: .8125rem; color: var(--gris-medio); }
  .bi-promo__tapas { position: relative; display: block; height: clamp(250px, 30vw, 360px); }
  .bi-promo__tapas img { position: absolute; bottom: 8%; left: 50%; width: 34%; height: auto; aspect-ratio: 180 / 252; object-fit: cover; border-radius: 6px;
    box-shadow: 0 22px 40px -18px rgba(0, 30, 50, .6); transform-origin: bottom center; transition: transform .5s cubic-bezier(.2, .7, .2, 1); }
  .bi-promo__tapas img:nth-child(1) { z-index: 5; transform: translateX(-50%); }
  .bi-promo__tapas img:nth-child(2) { z-index: 4; transform: translateX(-112%) rotate(-8deg) scale(.92); }
  .bi-promo__tapas img:nth-child(3) { z-index: 4; transform: translateX(12%) rotate(8deg) scale(.92); }
  .bi-promo__tapas img:nth-child(4) { z-index: 3; transform: translateX(-150%) rotate(-14deg) scale(.82); }
  .bi-promo__tapas img:nth-child(5) { z-index: 3; transform: translateX(50%) rotate(14deg) scale(.82); }
  .bi-promo__tapas:hover img:nth-child(1), .bi-promo__tapas:focus-visible img:nth-child(1) { transform: translateX(-50%) translateY(-12px); }
  .bi-promo__tapas:hover img:nth-child(2) { transform: translateX(-122%) rotate(-11deg) scale(.92); }
  .bi-promo__tapas:hover img:nth-child(3) { transform: translateX(22%) rotate(11deg) scale(.92); }
  .bi-promo__tapas:hover img:nth-child(4) { transform: translateX(-160%) rotate(-18deg) scale(.82); }
  .bi-promo__tapas:hover img:nth-child(5) { transform: translateX(60%) rotate(18deg) scale(.82); }
  @media (max-width: 900px) {
    .bi-promo__grid { grid-template-columns: minmax(0, 1fr); }
    .bi-promo__tapas { order: -1; height: clamp(200px, 56vw, 300px); max-width: 520px; width: 100%; margin-inline: auto; }
  }
  @media (prefers-reduced-motion: reduce) { .bi-promo__tapas img { transition: none; } }
  .areas-promo { background: var(--blanco-hueso); }
  .ap-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: clamp(24px, 3vw, 36px); }
  .ap__enlace { display: grid; grid-template-rows: auto 1fr; height: 100%; border-radius: calc(var(--radio) + 4px); overflow: hidden; background: var(--fondo); border: var(--filete); color: inherit; text-decoration: none; transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
  .ap__enlace:hover { transform: translateY(-4px); border-color: var(--azul-clave); box-shadow: 0 26px 48px -30px rgba(0, 60, 90, .55); }
  .ap__tapas { position: relative; height: 128px; overflow: hidden; background: radial-gradient(rgba(0, 148, 206, .16) 1px, transparent 1.2px) 0 0 / 14px 14px, linear-gradient(160deg, var(--tinte-azul), var(--fondo)); }
  .ap__tapas img { position: absolute; bottom: -44px; left: 50%; width: 84px; height: auto; aspect-ratio: 180 / 236; object-fit: cover; border-radius: 4px; box-shadow: 0 10px 22px -10px rgba(0, 30, 50, .55); transition: transform .35s ease; }
  .ap__tapas img:nth-child(1) { z-index: 3; bottom: -30px; transform: translateX(-50%); }
  .ap__tapas img:nth-child(2) { z-index: 2; transform: translateX(-118%) rotate(-9deg); }
  .ap__tapas img:nth-child(3) { z-index: 1; transform: translateX(18%) rotate(9deg); }
  .ap__enlace:hover .ap__tapas img:nth-child(1) { transform: translateX(-50%) translateY(-8px); }
  .ap__enlace:hover .ap__tapas img:nth-child(2) { transform: translateX(-128%) rotate(-13deg); }
  .ap__enlace:hover .ap__tapas img:nth-child(3) { transform: translateX(28%) rotate(13deg); }
  .ap__cuerpo { display: grid; align-content: start; gap: 10px; padding: 18px 20px 20px; }
  .ap__cabeza { display: flex; align-items: center; gap: 10px; }
  .ap__ico { flex: none; width: 34px; height: 34px; padding: 7px; border-radius: 10px; background: var(--tinte-azul); fill: none; stroke: var(--azul-texto); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
  .ap__nombre { font-size: 1.125rem; font-weight: var(--semibold); line-height: 1.25; color: var(--azul-noche-texto); }
  .ap__cifras { font-size: .9375rem; color: var(--gris-medio); }
  .ap__cifras b { color: var(--azul-texto); font-weight: var(--semibold); font-variant-numeric: tabular-nums; }
  .ap__temas { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; }
  .ap__temas li { padding: 3px 10px; border-radius: 999px; background: var(--tinte-azul); color: var(--azul-noche-texto); font-size: .8125rem; }
  .ap__mas { display: grid; gap: 2px; margin-top: 2px; padding-top: 10px; border-top: var(--filete); }
  .ap__mas small { font-size: .6875rem; font-weight: var(--semibold); letter-spacing: .1em; text-transform: uppercase; color: var(--azul-texto); }
  .ap__libro { font-size: .9375rem; line-height: 1.35; color: var(--gris-carbon); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
  .ap__acc { font-size: .8125rem; color: var(--gris-medio); font-variant-numeric: tabular-nums; }
  .ap-nota { margin-top: 16px; font-size: .875rem; color: var(--gris-medio); }
  @media (max-width: 1023px) { .ap-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
  @media (max-width: 640px) { .ap-grid { grid-template-columns: minmax(0, 1fr); } }
  @media (prefers-reduced-motion: reduce) { .ap__enlace, .ap__tapas img { transition: none; } .ap__enlace:hover { transform: none; } }
  /* Revistas con protagonismo: banda oscura, portada de cada revista y llamadas claras a publicar */
  .revistas.banda { background: radial-gradient(rgba(127, 224, 255, .1) 1px, transparent 1.2px) 0 0 / 18px 18px, linear-gradient(160deg, #0B3B55 15%, #00628C); color: #fff; }
  .revistas .etiqueta { color: #7FE0FF; }
  .revistas .h2 { color: #fff; } .revistas .h2 .clave { color: #7FE0FF; }
  .revistas .cabeza-seccion p.intro { color: #DCEFF7; }
  .revistas__cabeza { align-items: end; }
  .revistas .revistas__cta { background: #00ADEB; color: #062A3D; }
  .revistas .revistas__cta:hover { background: #7FE0FF; }
  .revistas__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(20px, 3vw, 32px); margin-top: clamp(24px, 3vw, 36px); }
  .revista-p { display: grid; grid-template-rows: auto 1fr; border-radius: calc(var(--radio) + 8px); overflow: hidden; background: #fff; color: #414042; box-shadow: 0 40px 70px -40px rgba(0, 0, 0, .6); transition: transform .3s ease; }
  .revista-p:hover { transform: translateY(-4px); }
  .revista-p__banner { display: block; aspect-ratio: 8 / 3; background: #fff; overflow: hidden; }
  .revista-p__banner img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
  .revista-p:hover .revista-p__banner img { transform: scale(1.04); }
  .revista-p__cuerpo { display: grid; align-content: start; gap: 12px; padding: clamp(20px, 3vw, 30px); border-top: 1px solid #E8EFF3; }
  .revista-p__estado { display: inline-flex; align-items: center; gap: 8px; justify-self: start; margin: 0; padding: 4px 12px; border-radius: 999px; background: #E6F7EE; color: #11663B; font-size: .8125rem; font-weight: var(--semibold); }
  .revista-p__punto { width: 8px; height: 8px; border-radius: 50%; background: #1E9E5A; box-shadow: 0 0 0 0 rgba(30, 158, 90, .5); animation: revista-pulso 2.4s ease-out infinite; }
  @keyframes revista-pulso { 0% { box-shadow: 0 0 0 0 rgba(30, 158, 90, .5); } 70% { box-shadow: 0 0 0 8px rgba(30, 158, 90, 0); } 100% { box-shadow: 0 0 0 0 rgba(30, 158, 90, 0); } }
  .revista-p__nombre { margin: 0; font-size: var(--t-h3); font-weight: var(--semibold); line-height: 1.25; }
  .revista-p__nombre a { color: #0B3B55; text-decoration: none; }
  .revista-p__nombre a:hover { color: #00628C; }
  .revista-p__texto { margin: 0; color: #58595B; line-height: 1.55; }
  .revista-p__datos { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; }
  .revista-p__datos li { padding: 3px 10px; border-radius: 999px; background: #E8EFF3; color: #0B3B55; font-size: .8125rem; }
  .revista-p__acciones { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; margin-top: 4px; }
  .revista-p .enlace-flecha { color: #00628C; }
  html[data-tema="noche"] .revista-p { background: #15232C; color: #E8EEF2; }
  html[data-tema="noche"] .revista-p__cuerpo { border-top-color: #2E4756; }
  html[data-tema="noche"] .revista-p__nombre a { color: #E8EEF2; } html[data-tema="noche"] .revista-p__texto { color: #BAC7CF; }
  html[data-tema="noche"] .revista-p__datos li { background: #1A2D39; color: #E8EEF2; } html[data-tema="noche"] .revista-p .enlace-flecha { color: #74D0F5; }
  @media (max-width: 760px) { .revistas__grid { grid-template-columns: minmax(0, 1fr); } }
  @media (prefers-reduced-motion: reduce) { .revista-p, .revista-p__banner img { transition: none; } .revista-p__punto { animation: none; } }
  /* Línea azul que sigue al cursor entre los botones del menú y descansa en la sección activa; sin óvalo blanco al pasar el cursor */
  .nav__enlaces > ul { position: relative; }
  .nav__item > a.nav__boton:hover, .nav__item:hover > .nav__boton, .nav__item.abierto > .nav__boton { background: none; color: var(--azul-texto); }
  .nav__linea { position: absolute; left: 0; top: 0; width: 0; height: 2px; border-radius: 2px; background: var(--azul-brillante); opacity: 0; pointer-events: none;
    transition: transform .38s cubic-bezier(.22, .8, .24, 1), width .38s cubic-bezier(.22, .8, .24, 1), opacity .2s ease; will-change: transform, width; }
  .nav__linea--quieta { transition: opacity .2s ease; }
  html.js .nav__item.activo > .nav__boton::after, html.js .nav__item.activo > a::after { display: none; }
  @media (prefers-reduced-motion: reduce) { .nav__linea { transition: opacity .2s ease; } }
  .nav__panel {
    position: absolute; left: 50%; top: calc(100% + 10px); translate: -50% 0; z-index: 30;
    min-width: 260px; padding: 8px; border-radius: 16px; background: var(--blanco); border: var(--filete);
    box-shadow: 0 22px 44px -22px rgba(11, 59, 85, .45);
    display: none;
  }
  .nav__panel::before { content: ""; position: absolute; left: 0; right: 0; top: -12px; height: 12px; }
  .nav__item.abierto > .nav__panel { display: grid; animation: panel-entra .18s ease; }
  .nav__item.abierto > .nav__panel--doble { grid-template-columns: repeat(2, minmax(0, 1fr)); width: 560px; }
  @keyframes panel-entra { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
  .nav__panel a, .nav__panel button {
    display: grid; gap: 2px; padding: 10px 12px; border-radius: 10px; text-decoration: none; text-align: left;
    font: inherit; background: none; border: 0; cursor: pointer; color: var(--gris-carbon);
  }
  .nav__panel a:hover, .nav__panel button:hover, .nav__panel a:focus-visible, .nav__panel button:focus-visible { background: var(--tinte-azul); }
  .nav__panel strong { font-size: .9375rem; font-weight: var(--medium); display: flex; align-items: center; gap: 6px; }
  .nav__panel small { font-size: var(--t-etiqueta); color: var(--gris-medio); line-height: 1.35; }
  .nav__panel .ext { width: 12px; height: 12px; fill: none; stroke: var(--gris-claro); stroke-width: 2; }
  @media (prefers-reduced-motion: reduce) { .nav__item.abierto > .nav__panel { animation: none; } }
  /* Menú móvil: grupos plegables */
  .nav__cajon { max-height: calc(100vh - var(--nav-alto) - env(safe-area-inset-top, 0px)); overflow-y: auto; }
  .cajon-grupo { border-top: var(--filete); }
  .cajon-grupo summary {
    list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center;
    font-size: 1rem; font-weight: var(--medium); color: var(--gris-carbon); padding-block: 14px;
  }
  .cajon-grupo summary::-webkit-details-marker { display: none; }
  .cajon-grupo summary svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; transition: rotate .2s ease; }
  .cajon-grupo[open] summary svg { rotate: 180deg; }
  .cajon-grupo div { display: grid; padding: 0 0 10px 12px; }
  .cajon-grupo div a, .cajon-grupo div button {
    font: inherit; font-size: .9375rem; color: var(--gris-medio); text-decoration: none; text-align: left;
    background: none; border: 0; cursor: pointer; padding: 10px 0; border-bottom: 1px dashed var(--azul-filete);
  }
  .cajon-grupo div a:last-child, .cajon-grupo div button:last-child { border-bottom: 0; }
  .cajon-grupo div a:hover, .cajon-grupo div button:hover { color: var(--azul-texto); }
  /* El menú completo cabe desde 1240 px; más angosto pasa al botón ☰ */
  @media (max-width: 1239px) {
    .nav__enlaces { display: none !important; }
    .nav__movil { display: block !important; }
    .nav__buscar { display: none; }
    .nav .buscador--cajon { display: flex !important; }
  }
  .nav__cajon > a {
    font-size: 1rem; font-weight: var(--medium); color: var(--gris-carbon); text-decoration: none; padding-block: 14px;
  }
  .nav__cajon > a:hover { color: var(--azul-texto); }
  /* Búsqueda en un panel que se despliega desde el botón de lupa */
  .nav__buscar { position: static; }
  .nav__buscar summary {
    list-style: none; width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; cursor: pointer;
    border: 1px solid var(--azul-filete); color: var(--gris-carbon); transition: background-color .2s ease, border-color .2s ease;
  }
  .nav__buscar summary::-webkit-details-marker { display: none; }
  .nav__buscar summary:hover, .nav__buscar[open] summary { border-color: var(--azul-texto); background: var(--blanco); }
  .nav__buscar summary .icono { width: 20px; height: 20px; stroke: currentColor; stroke-width: 1.75; }
  .nav__buscar-panel {
    position: absolute; right: max(var(--gutter), env(safe-area-inset-right, 0px)); top: calc(100% + 8px);
    width: min(440px, calc(100vw - 32px)); padding: 12px; border-radius: 16px;
    background: var(--tinte-azul); border: var(--filete); box-shadow: 0 20px 40px -24px rgba(11, 59, 85, .45);
  }
  .nav__buscar-panel .buscador { display: flex !important; max-width: none !important; margin: 0 !important; height: 46px; }
  @media (max-width: 1023px) { .nav__buscar { display: none; } }
  @media (max-width: 1380px) and (min-width: 1240px) { .nav__marca, .nav__separador { display: none; } .nav__boton, .nav__enlaces > ul > li > a { padding-inline: 9px; } }
  .nav__movil { display: none; }
  .nav__movil > summary { list-style: none; cursor: pointer; width: 44px; height: 44px; display: grid; place-items: center; }
  .nav__movil > summary::-webkit-details-marker { display: none; }
  .nav__movil > summary .icono { stroke: var(--gris-carbon); }
  .nav__cajon {
    position: absolute; left: 0; right: 0; top: 100%; background: var(--tinte-azul); border-bottom: var(--filete);
    padding: 8px max(var(--gutter), env(safe-area-inset-right, 0px)) 16px max(var(--gutter), env(safe-area-inset-left, 0px));
    display: grid;
  }
  .nav__cajon > a { border-top: var(--filete); }
  @media (max-width: 400px) { .nav__logo img { height: 20px; } .nav__identidad { gap: 10px; } .nav__marca { display: none; } .nav__separador { display: none; } }

  /* ---------- Portada (hero) ---------- */
  .hero { background: var(--fondo); padding-block: clamp(48px, 7vw, 96px) clamp(56px, 7vw, 104px); overflow: hidden; }
  .hero__grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: clamp(40px, 6vw, 88px); align-items: center; }
  .hero__texto { display: grid; gap: 24px; min-width: 0; }
  .hero__titulo { font-size: var(--t-titulo); font-weight: var(--semibold); line-height: 1.02; letter-spacing: -.03em; text-wrap: balance; }
  .hero__titulo .clave { font-weight: var(--light); font-style: italic; }
  .hero__intro { font-size: var(--t-sub); font-weight: var(--light); color: var(--gris-medio); max-width: 32em; line-height: 1.5; }
  .hero__acciones { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 8px; }
  .boton-solido, .boton-contorno {
    display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 52px;
    padding: 12px 24px; border-radius: 999px; font: inherit; font-size: var(--t-apoyo); font-weight: var(--semibold);
    text-decoration: none; text-align: center; cursor: pointer; transition: background-color .2s ease, color .2s ease, border-color .2s ease;
  }
  .boton-solido { background: var(--azul-tinta); color: var(--blanco-fijo); border: 0; }
  .boton-solido:hover { background: var(--noche-fijo); }
  .boton-solido .icono { stroke: var(--blanco-fijo); width: 20px; height: 20px; }
  .boton-contorno { background: transparent; color: var(--gris-carbon); border: 1.5px solid var(--azul-clave); }
  .boton-contorno:hover { background: var(--tinte-azul); }
  .boton-contorno .icono { width: 20px; height: 20px; }

  .hechos { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 16px; border-top: var(--filete); }
  .hechos div { padding: 18px 16px 0 0; display: grid; gap: 4px; align-content: start; min-width: 0; }
  .hechos div + div { padding-left: 16px; border-left: var(--filete); }
  .hechos dt { font-size: var(--t-etiqueta); color: var(--gris-medio); line-height: 1.35; order: 2; }
  .hechos dd { font-size: clamp(1.5rem, 1.2rem + 1vw, 2rem); font-weight: var(--semibold); color: var(--azul-clave); line-height: 1.1; letter-spacing: -.01em; }
  .hechos dd small { font-size: .55em; font-weight: var(--medium); letter-spacing: 0; color: var(--gris-carbon); }
  @media (max-width: 640px) {
    .hechos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .hechos div:nth-child(3) { padding-left: 0; border-left: 0; }
    .hechos div:nth-child(n+3) { border-top: var(--filete); margin-top: 18px; }
  }

  /* Escena: las dos obras de la biblioteca y su ficha */
  .escena { position: relative; min-height: 460px; display: grid; place-items: center; }
  .escena__portada {
    position: absolute; width: min(58%, 270px); border-radius: 14px; overflow: hidden;
    border: var(--filete); background: var(--blanco); text-decoration: none;
    box-shadow: 0 30px 60px -28px rgba(11, 59, 85, .55);
    transition: translate .5s cubic-bezier(.2,.7,.2,1), rotate .5s cubic-bezier(.2,.7,.2,1);
  }
  .escena__portada img { width: 100%; height: auto; aspect-ratio: 720 / 1003; object-fit: cover; }
  .escena__portada--atras { rotate: -7deg; translate: -26% -2%; }
  .escena__portada--frente { rotate: 4deg; translate: 22% 6%; animation: flota 7s ease-in-out infinite; }
  .escena:hover .escena__portada--atras { rotate: -10deg; translate: -32% -4%; }
  .escena:hover .escena__portada--frente { rotate: 2deg; }
  @keyframes flota { 0%, 100% { margin-top: 0; } 50% { margin-top: -14px; } }
  .ficha-doi {
    position: absolute; left: 0; bottom: 6%; z-index: 2; max-width: 250px;
    background: var(--blanco); border: var(--filete); border-left: 4px solid var(--azul-brillante);
    border-radius: 10px; padding: 14px 16px; display: grid; gap: 4px;
    box-shadow: 0 18px 40px -24px rgba(11, 59, 85, .5);
  }
  .ficha-doi p { font-size: var(--t-etiqueta); color: var(--gris-medio); }
  .ficha-doi strong { font-family: var(--mono); font-weight: var(--medium); font-size: .95rem; color: var(--gris-carbon); }
  .escena__sello {
    position: absolute; right: 2%; top: 4%; z-index: 2; width: 104px; height: 104px; border-radius: 50%;
    display: grid; place-items: center; text-align: center; padding: 12px;
    background: var(--noche-fijo); color: var(--blanco-fijo);
    font-size: .8125rem; font-weight: var(--semibold); line-height: 1.2; letter-spacing: .02em;
    rotate: 8deg;
  }
  .escena__sello span { display: block; color: var(--azul-brillante); font-size: 1.5rem; line-height: 1; margin-bottom: 4px; }
  @media (max-width: 900px) {
    .hero__grid { grid-template-columns: 1fr; }
    .escena { min-height: 400px; max-width: 520px; width: 100%; margin-inline: auto; }
  }
  @media (max-width: 480px) {
    .escena { min-height: 330px; }
    .escena__sello { width: 86px; height: 86px; font-size: .75rem; }
    .ficha-doi { max-width: 200px; padding: 10px 12px; }
  }
  @media (prefers-reduced-motion: reduce) { .escena__portada--frente { animation: none; } .escena__portada { transition: none; } }

  /* ---------- Novedades: fichas en movimiento sobre azul noche ---------- */
  .novedades { background: var(--noche-fijo); color: var(--hueso-fijo); padding-block: clamp(56px, 8vw, 104px); overflow: hidden; }
  .novedades .etiqueta { color: var(--azul-hielo); display: inline-flex; align-items: center; gap: 10px; }
  .novedades .etiqueta i { width: 9px; height: 9px; border-radius: 50%; background: var(--azul-brillante); animation: pulso 1.8s ease-out infinite; }
  @keyframes pulso { 0% { box-shadow: 0 0 0 0 rgba(0, 173, 235, .7); } 100% { box-shadow: 0 0 0 12px rgba(0, 173, 235, 0); } }
  .novedades .h2 { color: var(--blanco-fijo); }
  .novedades .h2 em { font-style: italic; font-weight: var(--light); color: var(--azul-brillante); }
  .novedades .enlace-flecha { color: var(--blanco-fijo); }
  .novedades .enlace-flecha .icono { stroke: var(--azul-brillante); }
  .cinta {
    overflow-x: auto; scrollbar-width: none; padding-block: 8px 12px;
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
            mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
  }
  .cinta::-webkit-scrollbar { display: none; }
  .cinta__pista { display: flex; gap: 20px; width: max-content; padding-inline: max(var(--gutter), env(safe-area-inset-left, 0px)); }
  .js .cinta { overflow: hidden; }
  .js .cinta__pista { animation: desliza 80s linear infinite; }
  .js .cinta__pista { gap: 0; padding-inline: 0; }
  .js .ficha { margin-right: 20px; }
  .cinta:hover .cinta__pista, .cinta:focus-within .cinta__pista { animation-play-state: paused; }
  @keyframes desliza { to { transform: translateX(-50%); } }
  @media (prefers-reduced-motion: reduce) {
    .js .cinta { overflow-x: auto; }
    .js .cinta__pista { animation: none; }
    .novedades .etiqueta i { animation: none; }
  }
  .ficha {
    width: 380px; flex: none; display: grid; grid-template-columns: 104px minmax(0, 1fr); gap: 16px; align-items: start;
    padding: 16px; border-radius: 12px; text-decoration: none; color: inherit;
    background: rgba(255, 255, 255, .06); border: 1px solid rgba(185, 205, 214, .28);
    transition: background-color .25s ease, border-color .25s ease, translate .25s ease;
  }
  .ficha:hover, .ficha:focus-visible { background: rgba(0, 173, 235, .14); border-color: var(--azul-brillante); translate: 0 -4px; }
  .ficha__cuerpo { display: grid; grid-template-rows: auto auto 1fr auto; gap: 8px; min-width: 0; align-self: stretch; }
  .ficha__tapa { position: relative; display: block; aspect-ratio: 720 / 1003; border-radius: 6px; overflow: hidden; background: var(--azul-tinta); box-shadow: 0 12px 24px -14px rgba(0, 0, 0, .7); }
  .ficha__tapa img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
  .ficha__tapa-tipo { position: absolute; inset: 0; display: grid; place-items: center; font-size: 2.25rem; font-weight: var(--light); font-style: italic; color: var(--azul-brillante); border-left: 6px solid var(--azul-brillante); }
  @media (max-width: 480px) { .ficha { width: 300px; grid-template-columns: 84px minmax(0, 1fr); } }
  .ficha__meta { display: flex; justify-content: space-between; gap: 12px; font-family: var(--mono); font-size: .8125rem; color: var(--azul-hielo); padding-bottom: 10px; border-bottom: 1px dashed rgba(185, 205, 214, .4); }
  .ficha__titulo { font-size: 1.0625rem; font-weight: var(--semibold); line-height: 1.3; color: var(--blanco-fijo); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
  .ficha__resumen { font-size: .9375rem; color: var(--azul-hielo); line-height: 1.45; }
  .ficha__ir { display: inline-flex; align-items: center; gap: 6px; font-size: var(--t-etiqueta); font-weight: var(--semibold); color: var(--blanco-fijo); }
  .ficha__ir .icono { width: 16px; height: 16px; }
  .ficha--inmersiva { border-color: rgba(0, 173, 235, .55); }
  .ficha__chip { font-family: var(--fuente); font-size: .75rem; font-weight: var(--semibold); letter-spacing: .06em; text-transform: uppercase; color: var(--noche-fijo); background: var(--azul-brillante); border-radius: 999px; padding: 1px 8px; }


  /* ---------- Carruseles (portada de comunicacion-cientifica.com) ---------- */
  .carrusel { position: relative; display: grid; gap: 16px; }
  .carrusel__pista {
    display: grid; grid-auto-flow: column; grid-auto-columns: 100%; overflow-x: auto; overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory; scrollbar-width: none; border-radius: var(--radio); scroll-behavior: smooth;
  }
  .carrusel__pista::-webkit-scrollbar { display: none; }
  .diapo { scroll-snap-align: start; scroll-snap-stop: always; min-width: 0; }
  .carrusel__controles { display: flex; align-items: center; justify-content: center; gap: 12px; }
  .carrusel__flecha, .carrusel__pausa {
    width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; cursor: pointer;
    background: var(--blanco); border: var(--filete); color: var(--gris-carbon); transition: border-color .2s ease, background-color .2s ease;
  }
  .carrusel__flecha:hover, .carrusel__pausa:hover { border-color: var(--azul-clave); background: var(--tinte-azul); }
  .carrusel__flecha svg, .carrusel__pausa svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
  .carrusel__pausa .i-play, .carrusel__pausa[aria-pressed="true"] .i-pausa { display: none; }
  .carrusel__pausa[aria-pressed="true"] .i-play { display: block; }
  .carrusel__puntos { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px; }
  .carrusel__punto { width: 24px; height: 24px; border: 0; background: none; padding: 0; cursor: pointer; display: grid; place-items: center; }
  .carrusel__punto::before { content: ""; width: 8px; height: 8px; border-radius: 999px; background: var(--azul-filete); transition: width .25s ease, background-color .25s ease; }
  .carrusel__punto[aria-current="true"]::before { width: 22px; background: var(--azul-brillante); }
  @media (max-width: 480px) { .carrusel__puntos { display: none; } }

  .avisos { background: var(--blanco-hueso); padding-block: clamp(40px, 6vw, 72px); }
  .banner { position: relative; display: block; aspect-ratio: 3 / 1; max-width: 100%; background: var(--noche-fijo); color: var(--blanco-fijo); text-decoration: none; overflow: hidden; }
  .banner img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
  .banner:not(.sin-imagen) .banner__texto { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .banner.sin-imagen { min-height: 230px; }
  .banner__texto { position: absolute; inset: 0; display: grid; align-content: center; gap: 10px; padding: clamp(20px, 5vw, 56px); padding-left: calc(clamp(20px, 5vw, 56px) + 10px); }
  .banner__texto::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 10px; background: var(--azul-brillante); }
  .banner__rotulo { font-size: var(--t-etiqueta); font-weight: var(--semibold); letter-spacing: .12em; text-transform: uppercase; color: var(--azul-hielo); }
  .banner__titulo { font-size: clamp(1.375rem, 1rem + 2vw, 2.5rem); font-weight: var(--semibold); line-height: 1.1; letter-spacing: -.02em; max-width: 22em; text-wrap: balance; }
  .banner__desc { color: var(--azul-hielo); max-width: 40em; }
  .banner__ir { display: inline-flex; align-items: center; gap: 8px; font-weight: var(--semibold); color: var(--blanco-fijo); }
  .banner__ir svg { width: 18px; height: 18px; fill: none; stroke: var(--azul-brillante); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
  .banner:hover .banner__ir { text-decoration: underline; text-underline-offset: 4px; }
  @media (max-width: 560px) { .banner.sin-imagen .banner__desc { display: none; } }

  .destacado { display: grid; gap: 20px; }
  .destacado__media { position: relative; display: block; aspect-ratio: 31 / 10; max-width: 100%; border-radius: var(--radio); overflow: hidden; background: var(--noche-fijo); }
  .destacado__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: scale .6s ease; }
  .destacado__media:hover img { scale: 1.02; }
  .destacado__fondo {
    position: absolute; inset: 0; display: flex; align-items: center; padding: clamp(20px, 5vw, 56px) clamp(20px, 5vw, 56px) clamp(20px, 5vw, 56px) calc(clamp(20px, 5vw, 56px) + 10px);
    font-size: clamp(1.25rem, .9rem + 2vw, 2.5rem); font-weight: var(--light); font-style: italic; line-height: 1.12; color: var(--blanco-fijo); text-wrap: balance;
    border-left: 10px solid var(--azul-brillante);
  }
  .destacado.sin-imagen .destacado__media { aspect-ratio: auto; min-height: 200px; }
  .destacado__pie { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 32px; }
  .destacado__pie > div { display: grid; gap: 6px; min-width: 0; flex: 1 1 360px; }
  .destacado__titulo { font-size: clamp(1.125rem, 1rem + .6vw, 1.5rem); font-weight: var(--semibold); line-height: 1.2; text-wrap: balance; }
  .destacado__titulo a { text-decoration: none; }
  .destacado__titulo a:hover { color: var(--azul-texto); text-decoration: underline; text-underline-offset: 4px; }
  .destacado__texto { color: var(--gris-medio); max-width: 46em; }


  /* ---------- Obra del día ---------- */
  .obra-dia { background: var(--tinte-azul); position: relative; overflow: hidden; }
  .obra-dia::before {
    content: ""; position: absolute; width: 560px; height: 560px; right: -180px; top: -200px; border-radius: 50%;
    border: 70px solid var(--azul-brillante); opacity: .08; pointer-events: none;
  }
  .obra-dia .contenedor { position: relative; }
  .odd__reloj { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; }
  .odd__fecha { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 999px; background: var(--noche-fijo); color: var(--blanco-fijo); font-weight: var(--semibold); font-size: .9375rem; }
  .odd__fecha svg { width: 18px; height: 18px; fill: none; stroke: var(--azul-brillante); stroke-width: 2; }
  .odd__cuenta { font-size: .9375rem; color: var(--gris-medio); }
  .odd__cuenta b { font-family: var(--mono); font-weight: var(--medium); color: var(--gris-carbon); font-variant-numeric: tabular-nums; }
  .odd { display: grid; grid-template-columns: minmax(240px, .8fr) minmax(0, 1.2fr); gap: clamp(32px, 6vw, 80px); align-items: center; }
  .odd__escenario { display: grid; justify-items: center; gap: 16px; perspective: 1400px; }
  .libro3d {
    position: relative; width: min(100%, 300px); aspect-ratio: 720 / 1003; padding: 0; border: 0; background: none; cursor: pointer;
    transform-style: preserve-3d; rotate: y -14deg; transition: rotate .7s cubic-bezier(.2,.7,.2,1), translate .7s cubic-bezier(.2,.7,.2,1);
    animation: libro-flota 6s ease-in-out infinite;
  }
  @keyframes libro-flota { 0%, 100% { margin-top: 0; } 50% { margin-top: -12px; } }
  .libro3d:hover { rotate: y -6deg; }
  .libro3d[aria-expanded="true"] { rotate: y 0deg; translate: 22% 0; }
  .libro3d__tapa, .libro3d__interior { position: absolute; inset: 0; border-radius: 4px 14px 14px 4px; overflow: hidden; }
  .libro3d__tapa {
    transform-origin: left center; transition: transform .9s cubic-bezier(.3,.6,.2,1); backface-visibility: hidden; z-index: 2;
    box-shadow: 0 30px 50px -24px rgba(11, 59, 85, .7), inset 6px 0 0 rgba(255, 255, 255, .12); background: var(--noche-fijo);
  }
  .libro3d__tapa img { width: 100%; height: 100%; object-fit: cover; }
  .libro3d--v2 .tapa-tipo { background: #00628C; }
  .libro3d--v3 .tapa-tipo { background: #414042; }
  .libro3d[aria-expanded="true"] .libro3d__tapa { transform: rotateY(-165deg); }
  .libro3d__interior {
    display: grid; align-content: center; gap: 12px; padding: 24px 22px; text-align: left;
    background: var(--marfil); color: #414042; border: 1px solid #E2DACB;
    box-shadow: 0 30px 50px -24px rgba(11, 59, 85, .6), inset 10px 0 18px -12px rgba(0, 0, 0, .25);
    background-image: repeating-linear-gradient(transparent 0 27px, rgba(0, 98, 140, .08) 27px 28px);
  }
  .libro3d__frase-rotulo { font-size: .75rem; font-weight: var(--semibold); letter-spacing: .14em; text-transform: uppercase; color: #00628C; }
  .libro3d__frase { font-size: clamp(1.0625rem, .95rem + .5vw, 1.3125rem); font-weight: var(--light); font-style: italic; line-height: 1.35; }
  .libro3d__dato { font-family: var(--mono); font-size: .8125rem; color: #58595B; padding-top: 10px; border-top: 1px dashed #B3C3CC; }
  .libro3d__frases { display: grid; }
  .libro3d__pag { grid-area: 1 / 1; display: grid; gap: 10px; align-content: center; opacity: 0; transform: translateY(8px); transition: opacity .6s ease, transform .6s ease; }
  .libro3d__pag.activa { opacity: 1; transform: none; }
  .libro3d__pag .libro3d__frase { font-size: clamp(.9375rem, .85rem + .4vw, 1.1875rem); }
  .libro3d__pag:first-child .libro3d__frase { font-size: clamp(1.0625rem, .95rem + .5vw, 1.3125rem); }
  .libro3d__puntos { display: flex; gap: 6px; }
  .libro3d__puntos i { width: 7px; height: 7px; border-radius: 50%; background: #B3C3CC; transition: background-color .3s ease, width .3s ease; }
  .libro3d__puntos i.activo { width: 18px; border-radius: 4px; background: #0094CE; }
  .odd__pista { font-size: .9375rem; color: var(--gris-medio); display: inline-flex; gap: 6px; }
  .odd__pista-abierto, .odd--abierto .odd__pista-cerrado { display: none; }
  .odd--abierto .odd__pista-abierto { display: inline; }
  .odd__contenido { display: grid; gap: 16px; min-width: 0; }
  .odd__titulo { font-size: clamp(1.5rem, 1.1rem + 1.6vw, 2.375rem); font-weight: var(--semibold); line-height: 1.1; letter-spacing: -.02em; text-wrap: balance; }
  .odd__titulo a { text-decoration: none; }
  .odd__titulo a:hover { color: var(--azul-texto); }
  .odd__autores { color: var(--gris-medio); }
  .odd__pano { width: 100%; aspect-ratio: 31 / 10; object-fit: cover; border-radius: 12px; }
  .odd__aporte { padding: 18px 20px; border-radius: var(--radio); background: var(--blanco); border: var(--filete); display: grid; gap: 6px; }
  .odd__aporte-rotulo { display: flex; align-items: center; gap: 8px; font-size: var(--t-etiqueta); font-weight: var(--semibold); color: var(--azul-texto); }
  .odd__aporte-rotulo svg { width: 20px; height: 20px; fill: none; stroke: var(--azul-brillante); stroke-width: 1.8; stroke-linecap: round; }
  .odd__aporte p:last-child { color: var(--gris-carbon); }
  /* Dentro del libro: tres capítulos reales con DOI */
  .odd__dentro { display: grid; gap: 10px; }
  .odd__caps { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; border-radius: var(--radio); border: var(--filete); background: var(--blanco); overflow: hidden; }
  .odd__caps li { position: relative; display: flex; align-items: center; gap: 12px; padding: 12px 14px 12px 18px; }
  .odd__caps li + li { border-top: var(--filete); }
  .odd__caps li::before { content: ""; position: absolute; left: 0; top: 12px; bottom: 12px; width: 3px; border-radius: 0 3px 3px 0; background: var(--azul-brillante); }
  .odd__cap { flex: 1; min-width: 0; display: grid; gap: 2px; color: var(--gris-carbon); text-decoration: none; }
  .odd__cap-num { font-size: .6875rem; font-weight: var(--semibold); letter-spacing: .08em; text-transform: uppercase; color: var(--azul-texto); }
  .odd__cap-t { font-weight: var(--semibold); line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
  .odd__cap:hover .odd__cap-t { color: var(--azul-texto); text-decoration: underline; text-underline-offset: 3px; }
  .odd__cap-a { font-size: .875rem; color: var(--gris-medio); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .odd__cap-doi { flex: none; padding: 4px 10px; border-radius: 999px; border: 1px solid var(--azul-filete); color: var(--azul-texto); font-size: .75rem; font-weight: var(--semibold); letter-spacing: .04em; text-decoration: none; }
  .odd__cap-doi:hover { border-color: var(--azul-clave); background: var(--tinte-azul); }
  .odd__dentro-mas { justify-self: start; }
  /* Debajo del libro y del reto, a todo lo ancho: los tres capítulos lado a lado */
  .odd > .odd__dentro { grid-column: 1 / -1; }
  @media (min-width: 861px) { .odd { row-gap: clamp(28px, 3vw, 44px); } }
  .odd > .odd__dentro .odd__caps { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .odd > .odd__dentro .odd__caps li { align-items: flex-start; padding: 16px 16px 16px 20px; }
  .odd > .odd__dentro .odd__caps li + li { border-top: 0; border-left: var(--filete); }
  .odd > .odd__dentro .odd__caps li::before { top: 16px; bottom: auto; height: 34px; }
  .reto { position: relative; padding: 18px 20px 20px; border-radius: var(--radio); background: var(--noche-fijo); color: var(--blanco-fijo); display: grid; gap: 10px; }
  .reto__rotulo { font-size: .75rem; font-weight: var(--semibold); letter-spacing: .14em; text-transform: uppercase; color: var(--azul-brillante); }
  .reto__pregunta { font-size: 1.0625rem; font-weight: var(--semibold); line-height: 1.35; }
  .reto__ops { display: flex; flex-wrap: wrap; gap: 8px; }
  .reto__op {
    min-height: 44px; padding: 8px 16px; border-radius: 999px; font: inherit; font-size: .9375rem; font-weight: var(--medium); cursor: pointer;
    color: var(--blanco-fijo); background: rgba(255, 255, 255, .08); border: 1px solid rgba(185, 205, 214, .45);
    transition: background-color .2s ease, border-color .2s ease;
  }
  .reto__op:hover:not([disabled]) { background: rgba(0, 173, 235, .2); border-color: var(--azul-brillante); }
  .reto__op[disabled] { cursor: default; opacity: .55; }
  .reto__op.es-correcta { opacity: 1; background: var(--azul-brillante); border-color: var(--azul-brillante); color: var(--noche-fijo); }
  .reto__op.es-error { opacity: 1; border-color: #F4A28C; animation: sacude .4s ease; }
  @keyframes sacude { 25% { translate: -5px 0; } 50% { translate: 5px 0; } 75% { translate: -3px 0; } }
  .reto__resultado { min-height: 1.5em; color: var(--azul-hielo); }
  .reto__resultado strong { color: var(--blanco-fijo); }
  .reto__resultado a { color: var(--azul-brillante); font-weight: var(--semibold); text-decoration: underline; text-underline-offset: 3px; }
  .reto__rotulo { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; }
  .reto__premio { display: inline-flex; align-items: center; gap: 5px; padding: 3px 10px 3px 7px; border-radius: 999px; background: rgba(0, 173, 235, .16); border: 1px solid rgba(0, 173, 235, .5);
    color: var(--blanco-fijo); font-size: .75rem; letter-spacing: .02em; text-transform: none; }
  .reto__premio svg { width: 14px; height: 14px; fill: var(--azul-brillante); }
  .reto__nota { color: var(--azul-hielo); }
  .reto__invita { display: block; margin-top: 10px; padding: 12px 14px; border-radius: 12px; background: rgba(255, 255, 255, .07); border: 1px dashed rgba(127, 224, 255, .4); font-size: .9375rem; line-height: 1.5; }
  .reto__invita b { display: inline-block; margin-right: 6px; padding: 1px 9px; border-radius: 999px; background: var(--azul-brillante); color: var(--noche-fijo); font-variant-numeric: tabular-nums; }
  .reto__invita a { display: inline-block; margin-right: 12px; }
  .reto__op.es-quieto { animation: none; }
  .reto__mas { position: absolute; z-index: 2; transform: translate(-50%, 0); font-size: 1.5rem; font-weight: var(--semibold); color: var(--azul-brillante); text-shadow: 0 2px 12px rgba(0, 173, 235, .55); pointer-events: none; animation: reto-sube 1.3s ease-out forwards; }
  @keyframes reto-sube { 0% { opacity: 0; transform: translate(-50%, 6px) scale(.8); } 20% { opacity: 1; transform: translate(-50%, -8px) scale(1.1); } 100% { opacity: 0; transform: translate(-50%, -62px) scale(1); } }
  .chispa { position: absolute; width: 8px; height: 8px; border-radius: 50%; pointer-events: none; animation: chispa .9s ease-out forwards; }
  @keyframes chispa { to { translate: var(--dx) var(--dy); scale: .2; opacity: 0; } }
  .odd__acciones { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
  .odd__otras { margin-top: clamp(28px, 4vw, 44px); display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; font-size: .9375rem; color: var(--gris-medio); }
  .odd__otras button { font: inherit; font-weight: var(--semibold); color: var(--azul-texto); background: none; border: 0; padding: 8px 0; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; min-height: 44px; }
  .odd__otras button:hover { text-decoration: underline; text-underline-offset: 4px; }
  .odd__otras svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
  @media (max-width: 860px) {
    .odd { grid-template-columns: 1fr; }
    .odd > .odd__dentro .odd__caps { grid-template-columns: minmax(0, 1fr); }
    .odd > .odd__dentro .odd__caps li { align-items: center; padding: 12px 14px 12px 18px; }
    .odd > .odd__dentro .odd__caps li + li { border-left: 0; border-top: var(--filete); }
    .odd > .odd__dentro .odd__caps li::before { top: 12px; bottom: 12px; height: auto; }
    .libro3d { width: min(70%, 260px); }
    .libro3d[aria-expanded="true"] { translate: 0 0; }
    .libro3d[aria-expanded="true"] .libro3d__tapa { transform: rotateY(-100deg); opacity: .15; }
  }
  @media (prefers-reduced-motion: reduce) {
    .libro3d { animation: none; transition: none; }
    .libro3d__tapa { transition: opacity .2s ease; }
    .libro3d[aria-expanded="true"] .libro3d__tapa { transform: none; opacity: 0; }
    .reto__op.es-error { animation: none; }
    .chispa { display: none; }
  }

  /* ---------- Datos curiosos ---------- */
  .curiosos { background: var(--blanco-hueso); }
  .datos-rejilla { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(12px, 2vw, 20px); }
  .dato a {
    display: grid; align-content: start; gap: 4px; height: 100%; padding: 22px 20px 24px; text-decoration: none; color: inherit;
    background: var(--blanco); border: var(--filete); border-top: 3px solid var(--azul-brillante); border-radius: 4px 4px var(--radio) var(--radio);
    transition: background-color .2s ease, translate .2s ease;
  }
  .dato a:hover, .dato a:focus-visible { background: var(--tinte-azul); translate: 0 -3px; }
  .dato__cifra { font-size: clamp(2rem, 1.5rem + 1.6vw, 3rem); font-weight: var(--semibold); line-height: 1; letter-spacing: -.03em; color: var(--azul-clave); font-variant-numeric: tabular-nums; }
  .dato__unidad { font-size: var(--t-etiqueta); font-weight: var(--semibold); letter-spacing: .1em; text-transform: uppercase; color: var(--azul-texto); margin-bottom: 8px; }
  .dato__texto { color: var(--gris-medio); font-size: var(--t-apoyo); line-height: 1.45; }
  @media (max-width: 960px) { .datos-rejilla { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
  @media (max-width: 480px) { .datos-rejilla { grid-template-columns: 1fr; } }


  /* ---------- Cursos ---------- */
  .cursos { background: var(--fondo); }
  .cursos__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(20px, 3vw, 32px); }
  .curso { display: grid; grid-template-columns: minmax(120px, 210px) minmax(0, 1fr); gap: clamp(16px, 2.5vw, 28px); padding: clamp(16px, 2.5vw, 24px); border: var(--filete); border-radius: var(--radio); background: var(--blanco); align-items: start; }
  .curso__img { display: block; border-radius: 12px; overflow: hidden; aspect-ratio: 1; max-width: 100%; }
  .curso__img img { width: 100%; height: 100%; object-fit: cover; transition: scale .4s ease; }
  .curso:hover .curso__img img { scale: 1.04; }
  .curso__cuerpo { display: grid; gap: 10px; min-width: 0; }
  .curso__top { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; }
  .curso__estado { display: inline-flex; align-items: center; gap: 6px; font-size: .8125rem; font-weight: var(--semibold); padding: 3px 10px; border-radius: 999px; background: var(--azul-tinta); color: var(--blanco-fijo); }
  .curso__estado::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--azul-brillante); }
  .curso__estado--pronto { background: var(--tinte-azul); color: var(--gris-carbon); }
  .curso__estado--pronto::before { background: var(--gris-claro); }
  .curso__horas { font-family: var(--mono); font-size: .8125rem; color: var(--gris-medio); }
  .curso__titulo { font-size: clamp(1.125rem, 1rem + .5vw, 1.375rem); font-weight: var(--semibold); line-height: 1.2; text-wrap: balance; }
  .curso__texto { color: var(--gris-medio); font-size: var(--t-apoyo); }
  .curso__datos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 16px; padding-top: 12px; border-top: var(--filete); }
  .curso__datos div { min-width: 0; }
  .curso__datos dt { font-size: .75rem; font-weight: var(--semibold); letter-spacing: .08em; text-transform: uppercase; color: var(--azul-texto); }
  .curso__datos dd { font-size: .9375rem; color: var(--gris-carbon); }
  .curso__acciones { margin-top: 4px; display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; }
  .curso__programa { font-size: var(--t-apoyo); }
  .cursos__aval { margin-top: 24px; font-size: .9375rem; color: var(--gris-medio); }
  .cursos__aval strong { color: var(--gris-carbon); }
  @media (max-width: 1279px) { .cursos__grid { grid-template-columns: 1fr; } }
  @media (max-width: 520px) { .curso { grid-template-columns: 1fr; } .curso__img { max-width: 220px; } .curso__datos { grid-template-columns: 1fr; } }

  /* ---------- Biblioteca digital (experiencia inmersiva) ---------- */
  .biblio { background: var(--tinte-azul); }
  .biblio__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(20px, 3vw, 32px); }
  .obra-destacada {
    display: grid; grid-template-columns: minmax(110px, 160px) minmax(0, 1fr); gap: clamp(18px, 3vw, 28px);
    padding: clamp(18px, 3vw, 28px); background: var(--blanco); border-radius: var(--radio); border: var(--filete);
  }
  .obra-destacada__portada { border-radius: 10px; overflow: hidden; border: var(--filete); align-self: start; }
  .obra-destacada__portada img { width: 100%; height: auto; aspect-ratio: 720 / 1003; object-fit: cover; transition: scale .4s ease; }
  .obra-destacada:hover .obra-destacada__portada img { scale: 1.03; }
  .obra-destacada__cuerpo { display: grid; gap: 10px; align-content: start; min-width: 0; }
  .obra-destacada__titulo { font-size: clamp(1.1875rem, 1rem + .6vw, 1.4375rem); font-weight: var(--semibold); line-height: 1.2; text-wrap: balance; }
  .obra-destacada__titulo em { font-style: italic; }
  .obra-destacada__autor { font-size: .9375rem; color: var(--gris-medio); }
  .obra-destacada__datos { display: flex; flex-wrap: wrap; gap: 4px 14px; font-family: var(--mono); font-size: .8125rem; color: var(--gris-medio); }
  .obra-destacada__acciones { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 6px; }
  .boton-inmersivo {
    display: inline-flex; align-items: center; gap: 10px; min-height: 48px; padding: 10px 20px 10px 14px;
    border-radius: 999px; background: var(--azul-tinta); color: var(--blanco-fijo); text-decoration: none;
    font-size: .9375rem; font-weight: var(--semibold); line-height: 1.2; position: relative; overflow: hidden;
    transition: background-color .2s ease;
  }
  .boton-inmersivo::after {
    content: ""; position: absolute; inset: 0; translate: -110% 0;
    background: linear-gradient(100deg, transparent 20%, rgba(255, 255, 255, .28) 50%, transparent 80%);
    animation: brillo 4.5s ease-in-out infinite;
  }
  @keyframes brillo { 0%, 60% { translate: -110% 0; } 100% { translate: 110% 0; } }
  .boton-inmersivo:hover { background: var(--noche-fijo); }
  .boton-inmersivo .icono { stroke: var(--azul-brillante); width: 22px; height: 22px; }
  .boton-inmersivo span small { display: block; font-size: .75rem; font-weight: var(--regular); color: var(--azul-hielo); letter-spacing: .02em; }
  @media (prefers-reduced-motion: reduce) { .boton-inmersivo::after { animation: none; display: none; } }
  .boton-texto { display: inline-flex; align-items: center; gap: 6px; min-height: 48px; padding: 10px 6px; font-size: .9375rem; font-weight: var(--semibold); color: var(--azul-texto); text-decoration: none; }
  .boton-texto:hover { text-decoration: underline; text-underline-offset: 4px; }
  .boton-texto .icono { width: 16px; height: 16px; stroke: currentColor; }
  .biblio__funciones { display: flex; flex-wrap: wrap; gap: 8px 10px; margin-top: clamp(24px, 4vw, 36px); }
  .biblio__funciones li { font-size: .9375rem; padding: 6px 14px; border-radius: 999px; border: var(--filete); background: var(--blanco); color: var(--gris-carbon); }
  @media (max-width: 1100px) { .biblio__grid { grid-template-columns: 1fr; } }
  @media (max-width: 440px) { .obra-destacada { grid-template-columns: 1fr; } .obra-destacada__portada { max-width: 150px; } }

  /* ---------- Catálogo ---------- */
  .catalogo { background: var(--fondo); }
  .filtros { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin-bottom: 28px; }
  .filtros__buscar {
    flex: 1 1 280px; display: flex; align-items: center; gap: 8px; min-height: 48px; padding: 0 14px;
    border: var(--filete); border-radius: 999px; background: var(--blanco);
  }
  .filtros__buscar:focus-within { border-color: var(--azul-clave); box-shadow: 0 0 0 3px rgba(0, 173, 235, .18); }
  .filtros__buscar .icono { width: 18px; height: 18px; stroke: var(--gris-medio); }
  .filtros__buscar input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; font: inherit; font-size: var(--t-apoyo); color: var(--gris-carbon); }
  .filtros__buscar input::placeholder { color: var(--gris-medio); }
  .chips { display: flex; flex-wrap: wrap; gap: 8px; }
  .chip {
    min-height: 44px; padding: 8px 16px; border-radius: 999px; border: var(--filete); background: var(--blanco);
    font: inherit; font-size: .9375rem; font-weight: var(--medium); color: var(--gris-carbon); cursor: pointer;
  }
  .chip:hover { border-color: var(--azul-clave); }
  .chip[aria-pressed="true"] { background: var(--azul-tinta); border-color: var(--azul-tinta); color: var(--blanco-fijo); }
  .catalogo__conteo { font-size: var(--t-etiqueta); color: var(--gris-medio); font-variant-numeric: tabular-nums; }
  .rejilla { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr)); gap: clamp(20px, 3vw, 32px) clamp(16px, 2.4vw, 28px); }
  .libro { display: grid; grid-template-rows: auto 1fr; gap: 14px; min-width: 0; }
  .libro__tapa {
    display: block; position: relative; aspect-ratio: 720 / 1003; max-width: 100%; border-radius: 10px; overflow: hidden;
    border: var(--filete); text-decoration: none; background: var(--tinte-azul);
    transition: translate .25s ease, box-shadow .25s ease;
  }
  .libro__tapa:hover, .libro__tapa:focus-visible { translate: 0 -4px; box-shadow: 0 22px 40px -26px rgba(11, 59, 85, .6); }
  .libro__tapa img { width: 100%; height: 100%; object-fit: cover; }
  .libro__tapa .tapa-real { position: absolute; inset: 0; z-index: 1; }
  .libro__insignia { z-index: 3 !important; }
  /* Tapa tipográfica para obras sin portada cargada */
  .tapa-tipo { position: absolute; inset: 0; display: grid; grid-template-rows: auto 1fr auto; padding: 18px 16px; color: var(--blanco-fijo); background: var(--noche-fijo); }
  .tapa-tipo::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 10px; background: var(--azul-brillante); opacity: .85; }
  .tapa-tipo__sello { font-size: .75rem; font-weight: var(--semibold); letter-spacing: .14em; text-transform: uppercase; color: var(--azul-hielo); padding-left: 8px; }
  .tapa-tipo__titulo { align-self: center; padding-left: 8px; font-size: clamp(1rem, .9rem + .4vw, 1.1875rem); font-weight: var(--semibold); line-height: 1.22; text-wrap: balance; display: -webkit-box; -webkit-line-clamp: 6; -webkit-box-orient: vertical; overflow: hidden; }
  .tapa-tipo__pie { padding-left: 8px; font-family: var(--mono); font-size: .75rem; color: var(--azul-hielo); }
  .libro__tapa--v1 .tapa-tipo { background: #0B3B55; }
  .libro__tapa--v2 .tapa-tipo { background: #00628C; }
  .libro__tapa--v3 .tapa-tipo { background: #414042; }
  .libro__insignia {
    position: absolute; left: 10px; top: 10px; z-index: 2; display: inline-flex; align-items: center; gap: 6px;
    font-size: .75rem; font-weight: var(--semibold); letter-spacing: .04em; color: var(--noche-fijo);
    background: var(--azul-brillante); border-radius: 999px; padding: 3px 10px 3px 8px;
  }
  .libro__insignia svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; }
  .libro__cuerpo { display: grid; gap: 6px; align-content: start; min-width: 0; }
  .libro__meta { font-family: var(--mono); font-size: .8125rem; color: var(--gris-medio); }
  .libro__titulo { font-size: 1rem; font-weight: var(--semibold); line-height: 1.3; }
  .libro__titulo a { text-decoration: none; }
  .libro__titulo a:hover { color: var(--azul-texto); text-decoration: underline; text-underline-offset: 3px; }
  .libro__autor { font-size: .9375rem; color: var(--gris-medio); line-height: 1.4; }
  .libro__acciones { display: grid; gap: 10px; margin-top: 8px; }
  .libro .boton-inmersivo { font-size: .875rem; min-height: 44px; padding: 8px 16px 8px 12px; justify-self: start; }
  .libro .boton-texto { min-height: 40px; padding-inline: 0; }
  .catalogo__vacio { padding: 32px; text-align: center; border: 1px dashed var(--azul-filete); border-radius: var(--radio); color: var(--gris-medio); }
  .catalogo__pie { margin-top: clamp(32px, 5vw, 48px); padding-top: 28px; border-top: var(--filete); display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 16px; }
  .catalogo__pie p { color: var(--gris-medio); max-width: 40em; }

  /* ---------- Colecciones ---------- */
  .colecciones { background: var(--blanco-hueso); }
  .col-lista { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 2px solid var(--gris-carbon); }
  .col { padding: 28px clamp(16px, 2.5vw, 28px) 8px 0; display: grid; gap: 12px; align-content: start; min-width: 0; }
  .col + .col { padding-left: clamp(16px, 2.5vw, 28px); border-left: var(--filete); }
  .col__nombre { font-size: var(--t-h3); font-weight: var(--semibold); line-height: 1.2; }
  .col__texto { color: var(--gris-medio); font-size: var(--t-apoyo); }
  .col__rasgo { font-size: var(--t-etiqueta); font-weight: var(--medium); color: var(--gris-carbon); padding-top: 12px; border-top: var(--filete); }
  @media (max-width: 820px) {
    .col-lista { grid-template-columns: 1fr; }
    .col + .col { padding-left: 0; border-left: 0; border-top: var(--filete); }
  }

  /* ---------- Revistas ---------- */
  .revistas__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(20px, 3vw, 32px); }
  .revista {
    display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 20px; align-items: start;
    padding: clamp(20px, 3vw, 32px); border-radius: var(--radio); border: var(--filete); background: var(--blanco); text-decoration: none;
    transition: border-color .2s ease, background-color .2s ease;
  }
  .revista:hover { border-color: var(--azul-clave); background: var(--tinte-azul); }
  .revista__monograma {
    width: 72px; height: 92px; border-radius: 8px; display: grid; place-items: center;
    background: var(--noche-fijo); color: var(--azul-brillante); font-size: 1.75rem; font-weight: var(--light); font-style: italic;
  }
  .revista__cuerpo { display: grid; gap: 8px; min-width: 0; }
  .revista__nombre { font-size: var(--t-h3); font-weight: var(--semibold); line-height: 1.2; }
  .revista__texto { color: var(--gris-medio); font-size: var(--t-apoyo); }
  .revista__datos { font-family: var(--mono); font-size: .8125rem; color: var(--gris-medio); }
  @media (max-width: 760px) { .revistas__grid { grid-template-columns: 1fr; } }


  /* ---------- Impacto en OpenAlex ---------- */
  /* ---------- Indexación internacional ---------- */
  .indexacion { background: var(--tinte-azul); }
  .indexacion__pruebas { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; margin: 0 0 clamp(36px, 5vw, 56px); padding: 0; list-style: none;
    background: var(--azul-filete); border: var(--filete); border-radius: var(--radio); overflow: hidden; }
  .indexacion__pruebas li { display: grid; gap: 4px; align-content: start; padding: 18px 20px; background: var(--fondo); }
  .indexacion__pruebas b { font-size: 1.25rem; font-weight: var(--semibold); color: var(--azul-clave); letter-spacing: -.01em; }
  .indexacion__pruebas span { font-size: .9375rem; color: var(--gris-medio); line-height: 1.4; }
  .indices { display: grid; gap: clamp(32px, 4vw, 48px); }
  .indices__grupo { display: grid; grid-template-columns: minmax(0, 17rem) minmax(0, 1fr); gap: 16px clamp(24px, 4vw, 48px); padding-top: clamp(24px, 3vw, 32px); border-top: 1px solid var(--azul-filete); }
  .indices__cabeza { display: flex; gap: 14px; align-items: flex-start; }
  .indices__num { font-family: var(--mono); font-size: .875rem; color: var(--azul-clave); padding-top: 5px; }
  .indices__titulo { font-size: var(--t-h3); font-weight: var(--semibold); line-height: 1.25; color: var(--gris-carbon); }
  .indices__sub { margin-top: 6px; font-size: .9375rem; color: var(--gris-medio); }
  .indices__lista { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin: 0; padding: 0; list-style: none; }
  .indice { display: flex; flex-direction: column; gap: 8px; padding: 18px 20px; background: var(--fondo); border: var(--filete); border-radius: var(--radio); transition: border-color .2s ease, box-shadow .2s ease; }
  .indice:hover { border-color: var(--azul-clave); box-shadow: 0 14px 30px -22px rgba(11, 59, 85, .55); }
  .indice__logo { position: relative; flex: none; display: grid; place-items: center; width: 48px; height: 48px; border-radius: 12px; background: var(--blanco-fijo); border: 1px solid #DCE5EA; overflow: hidden; }
  .indice__sigla { font-size: .8125rem; font-weight: var(--semibold); letter-spacing: .02em; color: #0B3B55; }
  .indice__logo img { position: absolute; inset: 0; margin: auto; width: 28px; height: 28px; }
  .indice__logo.con-logo .indice__sigla { visibility: hidden; }
  .indice__cabeza { display: flex; align-items: center; gap: 14px; margin-bottom: 4px; }
  .indice__id { display: grid; gap: 2px; min-width: 0; }
  .indice h4, .indice p, .indices__grupo h3, .indices__grupo p { margin: 0; }
  .indice__nombre { font-size: 1.0625rem; font-weight: var(--semibold); line-height: 1.25; color: var(--gris-carbon); }
  .indice__org { font-size: .8125rem; color: var(--gris-claro); }
  .indice__que { font-size: .9375rem; line-height: 1.45; color: var(--gris-medio); }
  .indice__dato { margin-top: 2px; font-size: .9375rem; color: var(--gris-medio); }
  .indice__dato b { color: var(--azul-clave); font-variant-numeric: tabular-nums; }
  .indice__ver { display: inline-flex; align-items: center; gap: 6px; min-height: 36px; margin-top: auto; align-self: flex-start; font-size: .9375rem; font-weight: var(--semibold); color: var(--azul-texto); text-decoration: none; justify-self: start; }
  .indice__ver svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
  .indice__ver:hover { text-decoration: underline; text-underline-offset: 3px; }
  .indexacion__cierre { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 32px; margin-top: clamp(36px, 5vw, 56px); padding: clamp(20px, 3vw, 28px) clamp(20px, 3vw, 32px);
    background: var(--fondo); border-radius: var(--radio); border-left: 6px solid var(--azul-brillante); }
  .indexacion__cierre p { max-width: 40em; color: var(--gris-medio); }
  .indexacion__cierre strong { color: var(--gris-carbon); }
  .indexacion__acciones { display: flex; flex-wrap: wrap; gap: 12px; }
  @media (max-width: 960px) { .indexacion__pruebas { grid-template-columns: repeat(2, minmax(0, 1fr)); } .indices__grupo { grid-template-columns: 1fr; } }
  @media (max-width: 600px) { .indices__lista { grid-template-columns: 1fr; } }
  @media (max-width: 480px) { .indexacion__pruebas { grid-template-columns: 1fr; } }

  /* Banner nativo (sin imagen) */
  .banner--nativo { background: radial-gradient(120% 140% at 100% 0%, #0E5578 0%, var(--noche-fijo) 58%); }
  .banner__chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; max-width: 46em; }
  .banner__chips span { padding: 5px 12px; border-radius: 999px; border: 1px solid rgba(185, 205, 214, .45); font-size: .875rem; font-weight: var(--medium); color: var(--blanco-fijo); background: rgba(255, 255, 255, .06); }
  @media (max-width: 760px) { .banner__chips { display: none; } }
  .impacto { background: var(--fondo); }
  .impacto__grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(28px, 5vw, 64px); align-items: end; }
  .impacto__cifras { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 2px solid var(--gris-carbon); }
  .impacto__cifras div { padding: 20px 16px 20px 0; display: grid; gap: 4px; border-bottom: var(--filete); min-width: 0; }
  .impacto__cifras div:nth-child(even) { padding-left: 16px; border-left: var(--filete); }
  .impacto__cifras dt { order: 2; font-size: var(--t-etiqueta); color: var(--gris-medio); line-height: 1.35; }
  .impacto__cifras dd { font-size: clamp(2rem, 1.4rem + 2vw, 3.25rem); font-weight: var(--semibold); line-height: 1; letter-spacing: -.03em; color: var(--azul-clave); font-variant-numeric: tabular-nums; }
  .grafica { margin: 0; display: grid; gap: 12px; }
  .grafica__titulo { font-size: 1rem; font-weight: var(--semibold); color: var(--gris-carbon); }
  .grafica__barras {
    display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 8px; align-items: end; height: 240px;
    padding-bottom: 0; border-bottom: 1px solid var(--azul-filete);
    background-image: linear-gradient(var(--azul-filete) 1px, transparent 1px); background-size: 100% 25%; background-position: 0 0;
    background-repeat: repeat-y; background-clip: content-box;
  }
  .barra { position: relative; height: 100%; display: grid; grid-template-rows: 1fr auto; outline: none; }
  .barra__col { position: relative; display: flex; align-items: flex-end; justify-content: center; }
  .barra__fill { position: relative; width: min(100%, 48px); min-height: 3px; background: var(--barra); border-radius: 4px 4px 0 0; transition: filter .2s ease; }
  .barra__valor { position: absolute; bottom: calc(100% + 4px); left: 50%; translate: -50% 0; font-size: .8125rem; font-weight: var(--semibold); color: var(--gris-carbon); white-space: nowrap; font-variant-numeric: tabular-nums; }
  .barra__anio { position: absolute; top: calc(100% + 6px); left: 0; right: 0; text-align: center; font-family: var(--mono); font-size: .8125rem; color: var(--gris-medio); }
  .barra:hover .barra__fill, .barra:focus-visible .barra__fill { filter: brightness(1.12); }
  .barra:focus-visible .barra__fill { outline: 2px solid var(--azul-clave); outline-offset: 2px; }
  .barra__tip {
    position: absolute; bottom: calc(100% - 20px); left: 50%; translate: -50% -8px; z-index: 3; display: none; width: max-content; max-width: 200px;
    padding: 8px 12px; border-radius: 8px; background: var(--noche-fijo); color: var(--blanco-fijo); font-size: .8125rem; line-height: 1.4; pointer-events: none;
    box-shadow: 0 10px 24px -12px rgba(0, 0, 0, .5);
  }
  .barra__tip b { display: block; color: var(--azul-brillante); }
  .barra:hover .barra__tip, .barra:focus .barra__tip { display: block; }
  .barra:first-child .barra__tip { left: 0; translate: 0 -8px; }
  .barra:last-child .barra__tip { left: auto; right: 0; translate: 0 -8px; }
  .grafica__nota { margin-top: 28px; font-size: var(--t-etiqueta); color: var(--gris-medio); }
  .impacto__fuente { margin-top: 28px; font-size: var(--t-etiqueta); color: var(--gris-medio); }
  .impacto__fuente a { color: var(--azul-texto); }
  @media (max-width: 860px) { .impacto__grid { grid-template-columns: 1fr; } }
  @media (max-width: 420px) { .grafica__barras { gap: 4px; height: 200px; } .barra__anio { font-size: .6875rem; } }

  /* ---------- Transparencia ---------- */
  .transparencia { background: var(--noche-fijo); color: var(--hueso-fijo); }
  .transparencia .etiqueta { color: var(--azul-hielo); }
  .transparencia .h2 { color: var(--blanco-fijo); }
  .transparencia .intro { color: var(--azul-hielo); }
  .transparencia__grid { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(32px, 6vw, 80px); align-items: start; }
  .transparencia__texto { display: grid; gap: 20px; }
  .transparencia .boton-contorno { color: var(--blanco-fijo); border-color: var(--azul-brillante); justify-self: start; }
  .transparencia .boton-contorno:hover { background: rgba(0, 173, 235, .16); }
  .garantias { display: grid; }
  .garantia { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 16px; padding-block: 18px; border-bottom: 1px solid rgba(185, 205, 214, .25); }
  .garantia:first-child { padding-top: 0; }
  .garantia .icono { width: 28px; height: 28px; margin-top: 2px; }
  .garantia h3 { font-size: 1.0625rem; font-weight: var(--semibold); color: var(--blanco-fijo); margin-bottom: 4px; }
  .garantia p { font-size: var(--t-apoyo); color: var(--azul-hielo); }
  @media (max-width: 860px) { .transparencia__grid { grid-template-columns: 1fr; } }

  /* ---------- Cómo publicar ---------- */
  .pasos { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; counter-reset: paso; position: relative; }
  .paso { counter-increment: paso; padding: 0 clamp(12px, 2vw, 24px) 0 0; display: grid; gap: 10px; align-content: start; min-width: 0; }
  .paso__num {
    width: 56px; height: 56px; border-radius: 50%; display: grid; place-items: center; position: relative; z-index: 1;
    background: var(--fondo); border: 1.5px solid var(--azul-clave); color: var(--azul-texto);
    font-size: 1.25rem; font-weight: var(--semibold); margin-bottom: 8px;
  }
  .paso__num::before { content: counter(paso); }
  .paso::after { content: ""; position: absolute; top: 28px; height: 1px; background: var(--azul-filete); }
  .pasos::before { content: ""; position: absolute; left: 56px; right: 12%; top: 28px; height: 1px; background: var(--azul-filete); }
  .paso h3 { font-size: 1.125rem; font-weight: var(--semibold); line-height: 1.25; }
  .paso p { color: var(--gris-medio); font-size: var(--t-apoyo); }
  .paso__plazo { font-family: var(--mono); font-size: .8125rem; color: var(--azul-texto); }
  @media (max-width: 900px) {
    .pasos { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 36px; }
    .pasos::before { display: none; }
  }
  @media (max-width: 520px) { .pasos { grid-template-columns: 1fr; } }
  .invitacion {
    margin-top: clamp(40px, 6vw, 64px); padding: clamp(24px, 4vw, 40px); border-radius: 20px;
    background: var(--tinte-azul); display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px 32px;
  }
  .invitacion h3 { font-size: clamp(1.375rem, 1.1rem + 1vw, 1.875rem); font-weight: var(--semibold); line-height: 1.15; max-width: 22em; text-wrap: balance; }
  .invitacion p { color: var(--gris-medio); margin-top: 8px; max-width: 36em; }

  /* ---------- Pie ---------- */
  .pie { background: var(--noche-fijo); color: var(--hueso-fijo); padding-block: 56px 32px; }
  .pie__grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 40px; padding-bottom: 40px; border-bottom: 1px solid rgba(185, 205, 214, .35); }
  .pie__grid > div { min-width: 0; }
  .pie .etiqueta { margin-bottom: 14px; color: var(--azul-hielo); }
  .pie__marca--logo { display: inline-block; line-height: 0; }
  .pie__marca--logo img { height: 44px; width: auto; max-width: none; }
  .pie__razon { margin-top: 14px; font-size: var(--t-apoyo); font-weight: var(--medium); }
  .pie__direccion { margin-top: 8px; font-style: normal; font-size: var(--t-apoyo); line-height: 1.6; color: var(--azul-hielo); }
  .pie__lista { display: grid; gap: 8px; }
  .pie__lista li { display: flex; align-items: flex-start; gap: 10px; font-size: var(--t-apoyo); min-width: 0; }
  .pie__lista .icono { width: 18px; height: 18px; margin-top: 3px; }
  .pie__lista a { color: var(--hueso-fijo); text-decoration: none; overflow-wrap: anywhere; }
  .pie__lista a:hover { text-decoration: underline; text-decoration-color: var(--azul-brillante); text-underline-offset: 4px; }
  .pie__rotulo { color: var(--azul-hielo); margin-right: 4px; }
  .pie__lista .icono-wa { fill: #25D366; stroke: none; }  /* glifo oficial de WhatsApp (Simple Icons, CC0) */
  .pie__legal { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px 24px; padding-top: 24px; }
  .pie__legal p, .pie__legal a { font-size: var(--t-etiqueta); color: var(--azul-hielo); }
  .pie :focus-visible { outline-color: var(--azul-brillante); }
  @media (max-width: 960px) { .pie__grid { grid-template-columns: 1fr 1fr; } }
  @media (max-width: 560px) { .pie__grid { grid-template-columns: 1fr; } }
  body { padding-bottom: 72px; }

  /* =========== Componentes reutilizados de la Biblioteca digital =========== */
    .boton {
      display: inline-flex; align-items: center; gap: 14px;
      font: inherit; font-weight: var(--semibold); letter-spacing: -0.01em;
      border-radius: 999px; cursor: pointer;
      transition: background-color .2s ease, color .2s ease, transform .2s ease;
    }
    .boton:active { transform: scale(0.98); }
    .boton__circulo {
      width: 40px; height: 40px; border-radius: 50%;
      display: grid; place-items: center; flex: none;
      border: 1.5px solid currentColor;
    }
    .boton__circulo svg {
      width: 18px; height: 18px; fill: none; stroke: currentColor;
      stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round;
    }
    /* Principal: azul profundo, texto 24px para cumplir contraste de texto grande */
    .boton--principal {
      font-size: 1.5rem; color: var(--blanco-fijo); background: var(--azul-profundo);
      border: 0; padding: 12px 32px 12px 12px; min-height: 64px;
    }
    .boton--principal:hover { background: var(--azul-noche); }
    /* Secundario: contorno azul, texto gris carbón */
    .boton--secundario {
      font-size: 1.125rem; color: var(--gris-carbon); background: var(--fondo);
      border: 1.5px solid var(--azul-clave); padding: 10px 28px 10px 10px; min-height: 64px;
    }
    .boton--secundario .boton__circulo { color: var(--azul-brillante); border-color: var(--azul-brillante); }
    .boton--secundario:hover { background: var(--azul-noche); color: var(--blanco-fijo); border-color: var(--azul-noche-texto); }
    .boton--secundario:hover .boton__circulo { color: var(--blanco-fijo); border-color: var(--blanco-fijo); }
    .boton-comentar .icono { stroke: var(--blanco-fijo); width: 20px; height: 20px; }
    .boton-comentar:hover { background: var(--azul-tinta); }

    /* ---------- Publique con nosotros ---------- */
    .boton-publicar {
      position: fixed; left: 16px; z-index: 15;
      bottom: calc(16px + env(safe-area-inset-bottom, 0px));
      display: inline-flex; align-items: center; gap: 10px;
      min-height: 52px; padding: 12px 22px 12px 18px; border: 0; border-radius: 999px;
      font: inherit; font-size: var(--t-apoyo); font-weight: var(--semibold); letter-spacing: 0.01em;
      color: var(--blanco-fijo); background: var(--azul-tinta); cursor: pointer;
      transition: background-color .2s ease, translate .2s ease;
    }
    .boton-publicar .icono { stroke: var(--blanco-fijo); width: 20px; height: 20px; }
    .boton-publicar:hover { background: var(--azul-noche); translate: 0 -2px; }

    .publicar {
      width: min(560px, calc(100% - 32px)); max-height: calc(100% - 32px); padding: 0;
      border: 0; border-radius: 20px; background: var(--blanco-hueso); color: var(--gris-carbon);
      overflow: auto;
    }
    .publicar::backdrop { background: rgba(11, 59, 85, .55); }
    .publicar[open] { animation: publicar-entra .28s cubic-bezier(.2, .7, .2, 1); }
    @keyframes publicar-entra { from { opacity: 0; translate: 0 16px; } to { opacity: 1; translate: 0 0; } }
    .publicar form { padding: clamp(20px, 4vw, 32px); }
    .publicar__cabeza { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; }
    .publicar__cabeza img { height: 44px; width: auto; }
    .publicar__cerrar {
      width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--azul-filete);
      background: transparent; display: grid; place-items: center; cursor: pointer;
    }
    .publicar__cerrar .icono { stroke: var(--gris-carbon); width: 18px; height: 18px; }
    .publicar__vista { display: grid; gap: 16px; }
    .publicar__titulo { font-size: clamp(1.625rem, 1.3rem + 1.2vw, 2rem); }
    .publicar__intro { font-size: var(--t-apoyo); }
    .campo { display: grid; gap: 6px; }
    .campo label, .contacto legend, .preferido legend { font-size: var(--t-apoyo); font-weight: var(--medium); color: var(--gris-carbon); }
    .campo__req, .campo__opc { font-size: var(--t-etiqueta); font-weight: var(--regular); color: var(--gris-medio); margin-left: 6px; }
    .campo__req { color: var(--azul-texto); }
    .campo input {
      font: inherit; font-size: var(--t-apoyo); color: var(--gris-carbon);
      min-height: 48px; padding: 10px 14px; border-radius: 10px;
      border: 1px solid var(--azul-filete); background: var(--blanco); width: 100%;
    }
    .campo input::placeholder { color: var(--gris-claro); }
    .campo input:focus { outline: 2px solid var(--azul-clave); outline-offset: 1px; border-color: var(--azul-clave); }
    .campo input[aria-invalid="true"] { border-color: #B42318; }
    .campo__error { font-size: var(--t-etiqueta); color: #B42318; }
    .contacto, .preferido { border: 0; padding: 0; margin: 0; display: grid; gap: 10px; min-width: 0; }
    .contacto { padding: 16px; border-radius: 14px; background: var(--tinte-azul); }
    .contacto__ayuda { font-size: var(--t-etiqueta); color: var(--gris-medio); margin-top: -4px; }
    .contacto__campos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
    .campo--ancho { grid-column: 1 / -1; }
    .preferido__opciones { display: flex; flex-wrap: wrap; gap: 8px; }
    .opcion { position: relative; }
    .opcion input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
    .opcion span {
      display: inline-flex; align-items: center; min-height: 44px; padding: 8px 18px; border-radius: 999px;
      border: 1px solid var(--azul-filete); background: var(--blanco); font-size: var(--t-apoyo); font-weight: var(--medium);
    }
    .opcion input:checked + span { background: var(--azul-tinta); border-color: var(--azul-texto); color: var(--blanco-fijo); }
    .opcion input:focus-visible + span { outline: 2px solid var(--azul-clave); outline-offset: 2px; }
    .opcion input:disabled + span { opacity: .45; }
    .publicar__trampa { position: absolute; left: -9999px; width: 1px; height: 1px; }
    .publicar__acciones { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; margin-top: 4px; }
    .publicar__boton { font-size: var(--t-apoyo); min-height: 48px; padding: 10px 22px; }
    .publicar__enviar {
      font-size: var(--t-apoyo); min-height: 48px; padding: 10px 28px; border: 0;
      color: var(--blanco-fijo); background: var(--azul-tinta);
    }
    .publicar__enviar:hover { background: var(--azul-noche); }
    .publicar__enviar[disabled] { opacity: .6; cursor: progress; }
    .publicar__privacidad { font-size: var(--t-etiqueta); color: var(--gris-medio); }
    .publicar__gracias { justify-items: center; text-align: center; padding-block: 16px 8px; }
    .publicar__gracias .titular { max-width: 16em; }
    .publicar__gracias .parrafo { max-width: 30em; text-align: center; }
    .check { width: 88px; height: 88px; }
    .check__circulo { fill: none; stroke: var(--azul-brillante); stroke-width: 3; stroke-dasharray: 183; stroke-dashoffset: 183; animation: check-trazo .6s ease forwards; }
    .check__marca { fill: none; stroke: var(--azul-texto); stroke-width: 4; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 44; stroke-dashoffset: 44; animation: check-trazo .4s .45s ease forwards; }
    @keyframes check-trazo { to { stroke-dashoffset: 0; } }
    .publicar__resumen {
      margin: 0; padding: 12px 14px; border-radius: 10px; background: var(--blanco); border: 1px solid var(--azul-filete);
      font: inherit; font-size: var(--t-etiqueta); white-space: pre-wrap; user-select: all;
    }
    @media (max-width: 479px) {
      .contacto__campos { grid-template-columns: 1fr; }
      .boton-publicar { padding: 10px 18px 10px 14px; }
    }
    @media (prefers-reduced-motion: reduce) {
      .check__circulo, .check__marca { animation: none; stroke-dashoffset: 0; }
      .publicar[open] { animation: none; }
    }

    /* Aviso flotante (favoritos, errores de reproducción) */
    .toast {
      position: fixed; left: 50%; bottom: 24px; z-index: 20;
      translate: -50% 16px; opacity: 0; pointer-events: none;
      max-width: calc(100% - 32px);
      background: var(--azul-noche); color: var(--blanco-fijo);
      font-size: var(--t-apoyo); padding: 12px 20px; border-radius: 8px;
      transition: opacity .2s ease, translate .2s ease;
    }
    /* Buscador conectado con comunicacion-cientifica.com */
    .buscador {
      display: flex; align-items: center; gap: 6px; min-width: 0;
      height: 42px; padding: 0 4px 0 12px; border-radius: 999px;
      background: var(--blanco); border: 1px solid var(--azul-filete);
      transition: border-color .2s ease, box-shadow .2s ease;
    }
    .buscador:focus-within { border-color: var(--azul-texto); box-shadow: 0 0 0 3px rgba(0, 173, 235, .18); }
    .buscador .buscador__lupa { width: 18px; height: 18px; flex: none; fill: none; stroke: var(--gris-medio); stroke-width: 1.8; stroke-linecap: round; }
    .buscador input {
      flex: 1; min-width: 0; height: 100%; border: 0; outline: none; background: transparent;
      font: inherit; font-size: var(--t-etiqueta); color: var(--gris-carbon);
    }
    .buscador input::placeholder { color: var(--gris-medio); }
    .buscador input::-webkit-search-cancel-button { cursor: pointer; }
    .buscador__ir {
      width: 34px; height: 34px; flex: none; border: 0; border-radius: 50%; cursor: pointer;
      display: grid; place-items: center; background: var(--azul-tinta); color: var(--blanco-fijo);
    }
    .buscador__ir:hover { background: var(--azul-noche); }
    .buscador__ir .icono { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
    .buscador--barra { flex: 1 1 260px; max-width: 340px; margin-inline: 24px auto; }
    .buscador--cajon { margin: 8px 0 12px; height: 46px; }
    .nav__cajon .buscador--cajon + a { border-top: 0; }
    @media (max-width: 767px) { .buscador--barra { display: none; } }
    @media (min-width: 768px) and (max-width: 1023px) { .buscador--barra { max-width: 220px; margin-inline: 16px; } .nav__enlaces { gap: 20px; } }

    /* Logotipo: conserva siempre su proporción; lo que se ajusta es el buscador */
    .nav__identidad, .nav__logo { flex: none; }
    .nav__logo img { width: auto !important; max-width: none !important; object-fit: contain; flex: none; }
    .publicar__cabeza img { width: auto !important; max-width: none !important; object-fit: contain; }
    .buscador--barra { flex: 1 1 0; min-width: 120px; }
    .nav__movil:not([open]) .nav__cajon { display: none; }
    /* Hasta 1023 px: menú desplegable; el buscador queda en la barra (600–1023 px) o dentro del menú (< 600 px) */
    @media (max-width: 1023px) {
      .nav__enlaces { display: none; }
      .nav__movil { display: block; }
      .buscador--barra { display: flex; max-width: 360px; margin-inline: 20px 12px; }
    }
    @media (max-width: 599px) { .buscador--barra { display: none; } }
    @media (min-width: 600px) { .buscador--cajon { display: none; } }
    @media (max-width: 360px) { .nav__logo img { height: 18px; } .nav__identidad { gap: 10px; } .nav__marca { font-size: 1rem; } }

    /* Vista previa flotante del buscador */
    .buscador { position: relative; }
    .busca-vista {
      position: absolute; top: calc(100% + 8px); left: 0; z-index: 40;
      width: min(440px, calc(100vw - 32px)); max-height: min(70vh, 520px); overflow-y: auto;
      background: var(--blanco); border: 1px solid var(--azul-filete); border-radius: 16px;
      box-shadow: 0 18px 40px rgba(11, 59, 85, .18); padding: 8px;
      animation: busca-vista-entra .18s ease;
    }
    @keyframes busca-vista-entra { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
    .buscador--cajon .busca-vista { width: 100%; }
    .busca-vista__estado { margin: 0; padding: 8px 10px 6px; font-size: var(--t-etiqueta); color: var(--gris-medio); }
    .busca-vista__lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
    .busca-vista__lista[hidden] { display: none; }
    .busca-vista__item a {
      display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: 12px; align-items: center;
      padding: 8px 10px; border-radius: 10px; text-decoration: none; color: var(--gris-carbon);
    }
    .busca-vista__item a:hover, .busca-vista__item[aria-selected="true"] a { background: var(--tinte-azul); }
    .busca-vista__img { width: 48px; height: 64px; border-radius: 6px; overflow: hidden; background: var(--tinte-azul); display: grid; place-items: center; flex: none; }
    .busca-vista__img img { width: 100%; height: 100%; object-fit: cover; }
    .busca-vista__img .icono { width: 22px; height: 22px; stroke: var(--azul-texto); }
    .busca-vista__texto { display: grid; gap: 2px; min-width: 0; text-align: left; }
    .busca-vista__texto strong { font-size: var(--t-etiqueta); font-weight: var(--semibold); line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
    .busca-vista__texto small { font-size: var(--t-etiqueta); color: var(--gris-medio); line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
    .busca-vista__texto .busca-vista__tipo { font-size: .75rem; font-weight: var(--semibold); letter-spacing: .08em; text-transform: uppercase; color: var(--azul-texto); }
    .busca-vista__todos {
      display: flex; align-items: center; justify-content: center; gap: 6px; margin-top: 6px; padding: 12px 10px;
      border-top: 1px solid var(--azul-filete); font-size: var(--t-etiqueta); font-weight: var(--semibold);
      color: var(--azul-texto); text-decoration: none; text-align: center;
    }
    .busca-vista__todos:hover { text-decoration: underline; text-underline-offset: 3px; }
    .busca-vista__todos strong { font-weight: var(--semibold); overflow-wrap: anywhere; }
    .busca-vista__todos .icono { width: 14px; height: 14px; stroke: currentColor; flex: none; }
    /* Vista previa dentro del menú móvil: sin el estilo de enlaces del menú */
    .nav__cajon .busca-vista a { text-transform: none; letter-spacing: normal; font-size: var(--t-etiqueta); font-weight: var(--regular); color: var(--gris-carbon); border-top: 0; padding: 8px 10px; }
    .nav__cajon .busca-vista a.busca-vista__todos { display: block; border-top: 1px solid var(--azul-filete); padding: 12px 10px; font-weight: var(--semibold); color: var(--azul-texto); }
    .busca-vista__todos { display: block; }
    .busca-vista__todos .icono { display: inline-block; vertical-align: -2px; margin-left: 4px; }
    .nav__tema {
      width: 40px; height: 40px; flex: none; border-radius: 50%; display: grid; place-items: center;
      background: transparent; border: 1px solid var(--azul-filete); cursor: pointer; color: var(--gris-carbon);
      transition: background-color .2s ease, border-color .2s ease;
    }
    .nav__tema:hover { border-color: var(--azul-texto); background: var(--blanco); }
    .nav__cuenta { width: 40px; height: 40px; flex: none; border-radius: 50%; display: grid; place-items: center; border: 1px solid var(--azul-filete); color: var(--gris-carbon); text-decoration: none; transition: background-color .2s ease, border-color .2s ease; }
    .nav__cuenta:hover { border-color: var(--azul-texto); background: var(--blanco); }
    .nav__cuenta:focus-visible { outline: 2px solid var(--azul-brillante); outline-offset: 2px; }
    .nav__cuenta .icono { width: 20px; height: 20px; stroke: currentColor; fill: none; stroke-width: 1.75; }
    .nav__cuenta.con-sesion { background: var(--azul-tinta); border-color: var(--azul-tinta); color: #fff; }
    .nav__cuenta.con-sesion .icono { display: none; }
    .nav__cuenta-ini { font-size: .8125rem; font-weight: 600; letter-spacing: .02em; }
    .nav__tema:focus-visible { outline: 2px solid var(--azul-brillante); outline-offset: 2px; }
    .nav__tema .icono { width: 20px; height: 20px; stroke: currentColor; fill: none; stroke-width: 1.75; }
    .nav__tema .icono-sol, html[data-tema="noche"] .nav__tema .icono-luna { display: none; }
    html[data-tema="noche"] .nav__tema .icono-sol { display: block; }
    .nav__derecha { display: flex; align-items: center; gap: 12px; }
    @media (max-width: 420px) { .nav .contenedor { gap: 8px; } .nav__derecha { gap: 2px; } .nav__tema { width: 36px; height: 36px; } .nav__movil > summary { width: 40px; } }
    @media (max-width: 340px) { .nav__separador { display: none; } .nav__identidad { gap: 8px; } }

  /* ---------- Compartir (mismo componente que la Biblioteca) ---------- */
  .compartir { position: relative; display: inline-flex; }
  .compartir__boton .icono { width: 20px; height: 20px; stroke: currentColor; }
  .compartir__menu { position: absolute; z-index: 60; left: 0; bottom: calc(100% + 8px); min-width: 230px; display: grid; gap: 2px; padding: 8px;
    border-radius: 14px; background: var(--fondo); border: var(--filete); box-shadow: 0 24px 50px -24px rgba(11, 59, 85, .55); }
  .compartir__menu[hidden] { display: none; }
  .compartir__opcion { display: flex; align-items: center; gap: 12px; min-height: 44px; padding: 0 12px; border: 0; border-radius: 10px; background: none;
    font: inherit; font-size: .9375rem; font-weight: var(--medium); color: var(--gris-carbon); text-decoration: none; cursor: pointer; text-align: left; }
  .compartir__opcion:hover, .compartir__opcion:focus-visible { background: var(--tinte-azul); }
  .compartir__opcion .icono { width: 20px; height: 20px; stroke: var(--azul-clave); }
  .compartir__opcion[data-red="whatsapp"] .icono { stroke: #25D366; }
  .compartir__opcion.copiado { color: var(--azul-texto); }
  /* =========== Experiencia en todos los dispositivos =========== */
  .nav__logo { display: inline-flex; align-items: center; min-height: 44px; }
  @media (min-width: 401px) { .nav__marca { display: inline-flex; align-items: center; min-height: 44px; } }
  /* Laptop de 1240 a 1679 px: sin «Editorial» para que quepa todo el menú, que incluye «Comité Editorial y Transparencia» (esta regla va después de la de arriba);
     de 1240 a 1380, además, letra y márgenes del menú un poco más compactos */
  @media (min-width: 1240px) and (max-width: 1919px) { .nav__marca, .nav__separador { display: none; } }
  /* «Cursos, tecnología y educación» alarga el menú: hasta 1919 px, letra de 14 px y sin las flechitas de los submenús (se abren igual al pasar o tocar) */
  @media (min-width: 1240px) and (max-width: 1919px) { .nav__enlaces .nav__boton { gap: 0; } .nav__enlaces .nav__boton svg { display: none; } }
  @media (min-width: 1381px) and (max-width: 1919px) { .nav__enlaces > ul { gap: 0; } .nav__boton, .nav__enlaces > ul > li > a { padding-inline: 8px; font-size: .875rem; } }
  @media (min-width: 1920px) { .nav > .contenedor { max-width: 1600px; } .nav__boton, .nav__enlaces > ul > li > a { padding-inline: 10px; } }
  @media (min-width: 1240px) and (max-width: 1380px) { .nav .contenedor { padding-inline: 32px; } .nav__enlaces > ul { gap: 0; } .nav__boton, .nav__enlaces > ul > li > a { padding-inline: 6px; font-size: .875rem; } .nav__boton svg { width: 12px; height: 12px; } }
  /* Más aire entre los botones del menú principal: el menú toma el espacio libre y lo reparte entre los botones;
     la cabecera (barra superior y menú) es un poco más ancha que el contenido para que quepa con holgura */
  @media (min-width: 1240px) { .nav__enlaces { flex: 1 1 auto; margin-inline: 0; } .nav__enlaces > ul { width: 100%; justify-content: space-evenly; } }
  @media (min-width: 1381px) { .nav .contenedor { max-width: calc(1360px + 2 * var(--gutter)); } }
  @media (min-width: 1920px) { .nav .contenedor { max-width: calc(1680px + 2 * var(--gutter)); } }
  .filtros__buscar { flex-basis: min(280px, 100%); min-width: 0; }
  .boton-solido, .boton-contorno { max-width: 100%; }
  @media (max-width: 380px) { .boton-solido, .boton-contorno { padding-inline: 18px; font-size: .9375rem; gap: 8px; } }
  /* Botones que se parten en dos o más líneas (7 nov 2026): el texto queda centrado de verdad y el ícono a un lado, sin encimarse */
  .boton-solido, .boton-contorno { text-wrap: balance; }
  .boton--varias-lineas { position: relative; padding-inline: 48px !important; }
  .boton--varias-lineas > [data-icono] { position: absolute; top: 50%; translate: 0 -50%; }
  .boton--varias-lineas > [data-icono="fin"] { right: 18px; }
  .boton--varias-lineas > [data-icono="inicio"] { left: 18px; }
  @media (max-width: 380px) { .boton--varias-lineas { padding-inline: 40px !important; } .boton--varias-lineas > [data-icono="fin"] { right: 14px; } .boton--varias-lineas > [data-icono="inicio"] { left: 14px; } }
  @media (max-width: 360px) { .nav__entrar svg { display: none; } .nav__entrar, .nav__registro { padding-inline: 9px; } .nav__acceso { gap: 8px; } }
  .libro__titulo a { display: inline-block; padding-block: 6px; }
  @media (min-width: 701px) { .curso .boton-solido, .curso .boton-contorno { white-space: nowrap; padding-inline: 20px; } }
  .ficha-doi strong { overflow-wrap: anywhere; }
  .boton-publicar { transition: background-color .2s ease, translate .25s ease, opacity .25s ease; }
  .boton-publicar.oculto { opacity: 0; translate: 0 24px; pointer-events: none; }
  /* Laptop y tableta horizontal: las cifras del inicio en dos filas para que respiren */
  @media (min-width: 901px) and (max-width: 1180px) {
    .hechos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .hechos div:nth-child(3) { padding-left: 0; border-left: 0; }
    .hechos div:nth-child(n+3) { border-top: var(--filete); margin-top: 18px; }
  }
  /* Tableta y celular: áreas táctiles de al menos 44 px */
  @media (max-width: 1023px), (pointer: coarse) {
    .nav__tema, .nav__cuenta { width: 44px; height: 44px; }
    .indice__ver { min-height: 44px; }
    .carrusel__flecha, .carrusel__pausa { width: 44px; height: 44px; }
  }
  /* Celular: los avisos muestran su texto bajo la imagen (el texto del banner no se lee en pantallas chicas) */
  @media (max-width: 700px) {
    .banner:not(.sin-imagen) { aspect-ratio: auto; display: flex; flex-direction: column; background: var(--noche-fijo); }
    .banner:not(.sin-imagen) img { position: static; order: -1; width: 100%; height: auto; aspect-ratio: 3 / 1; }
    .banner:not(.sin-imagen) .banner__texto { position: relative; inset: auto; width: auto; height: auto; clip: auto; overflow: visible; white-space: normal;
      padding: 16px 18px 20px 28px; gap: 6px; }
    .banner__titulo { font-size: 1.25rem; }
    .banner__desc { font-size: .9375rem; }
    .banner.sin-imagen .banner__desc { display: block; }
    .rejilla { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 14px; }
    .ficha-doi { max-width: min(220px, 64%); }
  }
  /* Novedades en pantallas táctiles: se deslizan con el dedo en lugar de correr solas */
  @media (hover: none) {
    .js .cinta { overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: var(--gutter); -webkit-mask-image: none; mask-image: none; }
    .js .cinta__pista { animation: none; padding-inline: var(--gutter); }
    .js .cinta .ficha { scroll-snap-align: start; }
    .cinta__copia { display: none !important; }
    .escena:hover .escena__portada--atras { rotate: -7deg; translate: -26% -2%; }
  }
  @media (max-width: 480px) { .ficha { width: min(84vw, 340px); grid-template-columns: 84px minmax(0, 1fr); } }
  @media (max-width: 420px) { .barra__anio { font-size: .75rem; } }
  /* Celular: «Publique con nosotros» se vuelve un botón redondo que no tapa el contenido */
  @media (max-width: 640px) {
    .boton-publicar { left: auto; right: calc(16px + env(safe-area-inset-right, 0px)); width: 56px; height: 56px; min-height: 56px; padding: 0;
      justify-content: center; gap: 0; font-size: 0; border-radius: 50%; box-shadow: 0 14px 30px -12px rgba(0, 40, 60, .7); }
    .boton-publicar .icono { width: 24px; height: 24px; }
  }
  /* Celular acostado: menos alto disponible */
  @media (max-height: 500px) and (orientation: landscape) {
    .nav { position: relative; }
    .escena { min-height: 320px; }
  }

  /* ---------- Barra de acceso (Iniciar sesión · Registrarse) arriba del menú ----------
     Se va con el desplazamiento: el encabezado se queda pegado con la barra fuera de la pantalla */
  :root { --barra-alto: 38px; }
  .nav { top: calc(env(safe-area-inset-top, 0px) - var(--barra-alto)); }
  .nav__barra { background: var(--noche-fijo); color: var(--blanco-fijo); font-size: .8125rem; }
  .nav .nav__barra .contenedor { min-height: var(--barra-alto); gap: 12px; }
  .nav__barra-texto { display: flex; align-items: center; gap: 8px; min-width: 0; color: rgba(255, 255, 255, .82); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .nav__barra-texto a { color: #7FDCFB; font-weight: var(--semibold); text-underline-offset: 3px; }
  .nav__barra-punto { width: 7px; height: 7px; flex: none; border-radius: 50%; background: var(--azul-brillante); box-shadow: 0 0 0 4px rgba(0, 173, 235, .22); }
  .nav__acceso { display: flex; align-items: center; gap: 10px; flex: none; margin-left: auto; }
  .nav__entrar, .nav__registro { display: inline-flex; align-items: center; gap: 7px; min-height: 28px; padding: 3px 12px; border-radius: 999px;
    font-weight: var(--semibold); text-decoration: none; white-space: nowrap; transition: background-color .2s ease, color .2s ease; }
  .nav__entrar { color: var(--blanco-fijo); }
  .nav__entrar:hover { background: rgba(255, 255, 255, .12); }
  .nav__entrar svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; }
  .nav__registro { background: var(--azul-brillante); color: #062B3D; }
  .nav__registro:hover { background: #7FDCFB; }
  .nav__barra a:focus-visible { outline-color: #7FDCFB; }
  @media (max-width: 760px) { .nav__barra-texto { display: none; } .nav__acceso { margin-inline: auto 0; } }
  /* Invitación al equipo (amarilla y discreta): lleva al espacio del equipo, donde se responde lo «Por confirmar» */
  .nav__equipo { display: inline-flex; align-items: center; gap: 4px; flex: none; margin-left: auto; min-height: 22px; padding: 1px 9px; border-radius: 999px;
    background: #FFF1C9; color: #5C4300; font-size: .75rem; font-weight: var(--semibold); text-decoration: none; white-space: nowrap; }
  .nav__equipo:hover { background: #FFE49A; }
  .nav__equipo svg { width: 13px; height: 13px; fill: none; stroke: currentColor; stroke-width: 1.8; flex: none; }
  .nav__equipo ~ .nav__acceso { margin-left: 0; }
  .nav__equipo-largo { display: none; }   /* discreto: solo «Equipo»; el texto completo va en el título */
  @media (max-width: 760px) { .nav__equipo { margin-left: 0; } .nav__equipo ~ .nav__acceso { margin-left: auto; } }
  @media (max-height: 500px) and (orientation: landscape) { .nav { top: auto; } }
  .cajon-acceso { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 6px 0 14px; }
  .cajon-acceso a { min-height: 48px; padding: 10px 14px; font-size: .9375rem; }

  /* ---------- Inicio: «Mi cuenta» (por qué registrarse) ---------- */
  .cuenta-promo { padding-block: clamp(48px, 7vw, 96px); background: var(--fondo); }
  .cuenta-promo__panel { position: relative; overflow: hidden; isolation: isolate; border-radius: 28px; color: var(--blanco-fijo); row-gap: clamp(28px, 4vw, 44px) !important;
    background: radial-gradient(120% 90% at 100% 0%, rgba(0, 173, 235, .38), transparent 55%), radial-gradient(80% 70% at 0% 100%, rgba(0, 148, 206, .30), transparent 60%), linear-gradient(140deg, #0B3B55 0%, #00628C 100%);
    padding: clamp(28px, 5vw, 64px); display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: clamp(32px, 5vw, 64px); align-items: center;
    box-shadow: 0 40px 80px -48px rgba(11, 59, 85, .9); }
  .cuenta-promo__panel::before { content: ""; position: absolute; inset: 0; z-index: -1; opacity: .5;
    background-image: radial-gradient(rgba(255, 255, 255, .16) 1px, transparent 1px); background-size: 22px 22px;
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 70%); mask-image: linear-gradient(90deg, transparent, #000 70%); }
  html[data-tema="noche"] .cuenta-promo__panel { background: radial-gradient(120% 90% at 100% 0%, rgba(0, 173, 235, .26), transparent 55%), linear-gradient(140deg, #08202D 0%, #0B3B55 100%); border: 1px solid #1F4255; }
  .cuenta-promo__texto { display: grid; gap: 20px; min-width: 0; align-content: center; }
  .cuenta-promo__eti { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; font-size: var(--t-etiqueta); font-weight: var(--semibold); letter-spacing: .12em; text-transform: uppercase; color: #7FDCFB; }
  .cuenta-promo__nuevo { padding: 3px 10px; border-radius: 999px; background: #FFD25E; color: #3D2E00; letter-spacing: .08em; }
  .cuenta-promo__titulo { font-size: var(--t-h2); font-weight: var(--semibold); line-height: 1.06; letter-spacing: -.02em; text-wrap: balance; }
  .cuenta-promo__titulo em { font-style: italic; font-weight: var(--light); color: #7FDCFB; }
  .cuenta-promo__intro { font-size: var(--t-sub); font-weight: var(--light); line-height: 1.5; color: rgba(255, 255, 255, .86); max-width: 34em; }
  .cuenta-promo__lista { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px 28px; padding-top: clamp(24px, 3vw, 36px); border-top: 1px solid rgba(255, 255, 255, .18); }
  .cuenta-promo__lista li { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 12px; align-items: start; }
  .cuenta-promo__lista strong { display: block; font-weight: var(--semibold); line-height: 1.3; }
  .cuenta-promo__lista small { display: block; margin-top: 3px; font-size: .9375rem; line-height: 1.45; color: rgba(255, 255, 255, .74); }
  .cp-ic { width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; background: rgba(255, 255, 255, .1); border: 1px solid rgba(255, 255, 255, .16); }
  .cp-ic svg { width: 21px; height: 21px; fill: none; stroke: #7FDCFB; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
  .cuenta-promo__acciones { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 6px; }
  .cp-boton { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 54px; padding: 12px 26px; border-radius: 999px;
    font-size: var(--t-apoyo); font-weight: var(--semibold); text-decoration: none; transition: transform .2s ease, background-color .2s ease, box-shadow .2s ease; }
  .cp-boton--principal { background: var(--azul-brillante); color: #062B3D; box-shadow: 0 16px 34px -14px rgba(0, 173, 235, .9); }
  .cp-boton--principal:hover { background: #7FDCFB; transform: translateY(-2px); }
  .cp-boton--principal svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; }
  .cp-boton--claro { color: var(--blanco-fijo); border: 1.5px solid rgba(255, 255, 255, .5); }
  .cp-boton--claro:hover { background: rgba(255, 255, 255, .1); border-color: #fff; }
  .cp-boton:focus-visible { outline: 2px solid #FFD25E; outline-offset: 3px; }
  .cuenta-promo__nota { display: flex; align-items: center; gap: 10px; font-size: .9375rem; color: rgba(255, 255, 255, .78); }
  .cp-orcid { flex: none; width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; background: #A6CE39; color: #fff; font-size: .75rem; font-weight: 700; }
  .cuenta-promo__pasos { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; padding: 18px 20px; border-radius: 18px; background: rgba(255, 255, 255, .08); counter-reset: paso; }
  .cuenta-promo__pasos li { display: flex; align-items: center; gap: 12px; font-weight: var(--medium); color: rgba(255, 255, 255, .92); }
  .cuenta-promo__pasos li::before { counter-increment: paso; content: counter(paso); flex: none; width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center;
    background: var(--blanco-fijo); color: var(--azul-tinta); font-weight: var(--semibold); }
  /* Ilustración: un reporte con folio, una tarjeta para compartir y un aviso (sin datos reales) */
  .cp-visual { position: relative; min-height: 440px; }
  .cp-reporte { position: absolute; inset: 6% 8% auto 0; background: #fff; color: #414042; border-radius: 18px; padding: 20px 20px 16px;
    box-shadow: 0 40px 70px -30px rgba(0, 20, 32, .75); rotate: -2.5deg; display: grid; gap: 14px; }
  .cp-reporte__cab { display: grid; grid-template-columns: 38px minmax(0, 1fr) 46px; gap: 12px; align-items: center; padding-bottom: 12px; border-bottom: 1px solid #E3EAEE; }
  .cp-logo { width: 38px; height: 38px; border-radius: 10px; display: grid; place-items: center; background: #0B3B55; color: #fff; font-size: .6875rem; font-weight: 700; letter-spacing: .04em; }
  .cp-reporte__cab b { display: block; font-size: .9375rem; color: #0B3B55; line-height: 1.25; }
  .cp-reporte__cab small { display: block; font-family: var(--mono); font-size: .6875rem; color: #808285; margin-top: 2px; }
  .cp-qr { width: 46px; height: 46px; border-radius: 6px; background:
    conic-gradient(from 90deg at 3px 3px, #0B3B55 25%, transparent 0) 0 0 / 9px 9px, linear-gradient(#fff, #fff); border: 3px solid #0B3B55; }
  .cp-perfil { display: grid; grid-template-columns: 42px minmax(0, 1fr) auto; gap: 12px; align-items: center; }
  .cp-avatar { width: 42px; height: 42px; border-radius: 50%; display: grid; place-items: center; background: #00628C; color: #fff; font-weight: 600; font-size: .875rem; }
  .cp-lineas { display: grid; gap: 7px; }
  .cp-linea { display: block; height: 8px; border-radius: 99px; background: #E3EAEE; }
  .cp-linea--l { width: 78%; background: #C9D7DF; } .cp-linea--m { width: 52%; }
  .cp-chip { display: inline-flex; align-items: center; gap: 4px; padding: 3px 8px; border-radius: 999px; background: #E8F6FD; color: #00628C; font-size: .6875rem; font-weight: 600; white-space: nowrap; }
  .cp-chip--orcid { background: #EFF6DC; color: #4F6B10; }
  .cp-filas { display: grid; gap: 9px; }
  .cp-filas li { display: grid; grid-template-columns: 74px minmax(0, 1fr) auto auto; gap: 8px; align-items: center; padding: 8px 10px; border-radius: 10px; background: #F6F9FA; }
  .cp-tag { font-size: .6875rem; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: #58595B; }
  .cp-pie { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding-top: 4px; font-size: .75rem; color: #58595B; }
  .cp-sello { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; color: #1E7A4E; }
  .cp-sello::before { content: ""; width: 14px; height: 14px; border-radius: 50%; background: #1E7A4E url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12.5l4 4 8-9' fill='none' stroke='white' stroke-width='3'/%3E%3C/svg%3E") center / 10px no-repeat; }
  .cp-tarjeta { position: absolute; right: 0; bottom: 2%; width: min(250px, 52%); background: #fff; border-radius: 16px; padding: 10px; rotate: 4deg;
    box-shadow: 0 34px 60px -26px rgba(0, 20, 32, .8); display: grid; gap: 8px; animation: cp-flota 8s ease-in-out infinite; }
  .cp-tarjeta__img { position: relative; border-radius: 10px; overflow: hidden; aspect-ratio: 1.6; background: linear-gradient(135deg, #0B3B55, #00628C); }
  .cp-tarjeta__img img { position: absolute; right: 10%; top: 10%; width: 38%; height: auto; border-radius: 3px; box-shadow: 0 10px 18px -8px rgba(0, 0, 0, .6); rotate: 6deg; }
  .cp-tarjeta__img .cp-avatar { position: absolute; left: 10%; bottom: 12%; width: 48px; height: 48px; border: 3px solid #fff; background: #00ADEB; color: #062B3D; }
  .cp-tarjeta__img span.cp-pub { position: absolute; left: 10%; top: 14%; width: 44%; color: #fff; font-size: .6875rem; font-weight: 600; line-height: 1.3; }
  .cp-tarjeta p { display: grid; gap: 1px; padding: 0 4px 2px; font-size: .75rem; line-height: 1.3; color: #414042; }
  .cp-tarjeta p b { font-weight: 600; }
  .cp-tarjeta p i { font-style: normal; color: #00628C; font-size: .6875rem; }
  .cp-burbuja { position: absolute; left: -2%; bottom: 4%; display: inline-flex; align-items: center; gap: 8px; padding: 10px 14px; border-radius: 14px;
    background: #FFD25E; color: #3D2E00; font-size: .8125rem; font-weight: 600; box-shadow: 0 20px 36px -18px rgba(0, 0, 0, .6); rotate: -3deg; animation: cp-flota 7s ease-in-out -2s infinite; }
  .cp-burbuja svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; }
  @keyframes cp-flota { 0%, 100% { translate: 0 0; } 50% { translate: 0 -10px; } }
  @media (prefers-reduced-motion: reduce) { .cp-tarjeta, .cp-burbuja { animation: none; } .cp-boton { transition: none; } }
  @media (max-width: 1100px) { .cuenta-promo__lista { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
  @media (max-width: 900px) {
    .cuenta-promo__panel { grid-template-columns: minmax(0, 1fr); }
    .cp-visual { min-height: 400px; max-width: 520px; width: 100%; margin-inline: auto; }
    .cuenta-promo__lista { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  }
  @media (max-width: 640px) {
    .cuenta-promo__panel { border-radius: 22px; padding: 26px 20px 28px; }
    .cuenta-promo__lista, .cuenta-promo__pasos { grid-template-columns: minmax(0, 1fr); }
    .cp-visual { min-height: 360px; }
    .cp-reporte { inset: 0 4% auto 0; padding: 16px 14px 12px; }
    .cp-filas li { grid-template-columns: 64px minmax(0, 1fr) auto; } .cp-filas li .cp-chip + .cp-chip { display: none; }
    .cp-tarjeta { width: 58%; bottom: 0; }
    .cuenta-promo__acciones .cp-boton { width: 100%; }
  }
  .nav .contenedor > .buscador--barra { display: none !important; }
  .nav__derecha { gap: 8px; }
  @media (min-width: 600px) and (max-width: 1023px) { .nav .buscador--cajon { display: flex; } }
  /* botones-centrados:inicio · 8 nov 2026: el texto (con su ícono) de cada botón va centrado y sus renglones, centrados entre sí */
  .boton-solido, .boton-contorno, .boton-inmersivo, .boton-publicar { justify-content: center; text-align: center; }
  .boton-inmersivo { padding-left: 17px; padding-right: 17px; }
  .libro .boton-inmersivo { padding-left: 14px; padding-right: 14px; }
  .boton-publicar { padding-left: 20px; padding-right: 20px; }
  @media (max-width: 479px) { .boton-publicar { padding-left: 16px; padding-right: 16px; } }
  @media (max-width: 640px) { .boton-publicar { padding: 0; } }   /* en el celular es el botón redondo, solo con el ícono */
  @media (max-width: 480px) { .libro .boton-inmersivo { gap: 0; } .libro .boton-inmersivo .icono { display: none; } }   /* tarjeta angosta: el texto solo, centrado */
  /* botones-centrados:fin */

/* =========================================================
   Catálogo de los libros: listado y página de cada obra
   ========================================================= */
.saltar { position: absolute; left: 12px; top: -60px; z-index: 200; padding: 10px 16px; border-radius: 8px; background: var(--azul-tinta); color: #fff; font-weight: var(--semibold); text-decoration: none; }
.saltar:focus { top: 12px; }
.mini { width: 14px; height: 14px; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.migas { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin-bottom: clamp(20px, 3vw, 32px); font-size: .9375rem; color: var(--gris-medio); }
.migas a { color: var(--azul-texto); text-decoration: none; font-weight: var(--medium); }
.migas a:hover { text-decoration: underline; text-underline-offset: 3px; }
.migas [aria-current] { color: var(--gris-carbon); font-weight: var(--medium); }
.sello-html5 { display: inline-flex; align-items: center; gap: 6px; padding: 2px 10px; border-radius: 999px; background: var(--azul-tinta); color: #fff; font-size: .75rem; font-weight: var(--semibold); letter-spacing: .02em; white-space: nowrap; }
.sello-html5::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: #7FE0FF; box-shadow: 0 0 0 3px rgba(127, 224, 255, .25); }
.sello { display: inline-flex; padding: 2px 10px; border-radius: 999px; background: var(--tinte-azul); color: var(--gris-carbon); font-size: .75rem; font-weight: var(--semibold); white-space: nowrap; }

/* ---------- Botón «Nuevo · Experiencia inmersiva» ---------- */
.boton-html5 {
  position: relative; display: inline-flex; align-items: center; gap: 14px; min-height: 64px; padding: 10px 22px 10px 12px;
  border-radius: 18px; text-decoration: none; color: #fff; isolation: isolate; overflow: hidden;
  background: linear-gradient(120deg, #0B3B55 0%, #00628C 55%, #0094CE 100%);
  box-shadow: 0 16px 34px -18px rgba(0, 98, 140, .9); transition: transform .2s ease, box-shadow .2s ease;
}
.boton-html5::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(100deg, transparent 30%, rgba(255, 255, 255, .22) 50%, transparent 70%); transform: translateX(-100%); animation: brillo 3.6s ease-in-out infinite; }
@keyframes brillo { 0%, 55% { transform: translateX(-100%); } 85%, 100% { transform: translateX(100%); } }
.boton-html5:hover { transform: translateY(-2px); box-shadow: 0 22px 40px -18px rgba(0, 98, 140, 1); }
.boton-html5__sello { flex: none; display: grid; place-items: center; min-width: 58px; height: 44px; padding: 0 10px; border-radius: 12px; background: #fff; color: #00628C; font-size: .8125rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.boton-html5__texto { display: grid; gap: 2px; line-height: 1.2; min-width: 0; overflow-wrap: break-word; hyphens: auto; }   /* un título con palabras largas no se encima con la flecha */
@media (max-width: 380px) { .boton-html5__flecha { display: none; } .boton-html5__sello { min-width: 48px; padding: 0 8px; font-size: .75rem; } }   /* celular angosto: más lugar para el título */
.boton-html5__texto strong { font-size: 1.0625rem; font-weight: var(--semibold); }
.boton-html5__texto small { font-size: .875rem; color: #CFE6F1; }
.boton-html5__flecha { width: 22px; height: 22px; flex: none; fill: none; stroke: #7FE0FF; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; transition: translate .2s ease; }
.boton-html5:hover .boton-html5__flecha { translate: 4px 0; }
@media (prefers-reduced-motion: reduce) { .boton-html5::after { animation: none; } }

/* ---------- Página de la obra ---------- */
.obra__cabeza { background: linear-gradient(180deg, var(--tinte-azul) 0%, var(--fondo) 100%); padding-block: clamp(24px, 4vw, 40px) clamp(32px, 5vw, 56px); }
.obra__grid { display: grid; grid-template-columns: minmax(0, 340px) minmax(0, 1fr); gap: clamp(28px, 5vw, 64px); align-items: start; }
.obra__tapa { position: relative; display: block; border-radius: 12px; overflow: hidden; background: var(--tinte-azul); box-shadow: 0 30px 60px -30px rgba(11, 59, 85, .6), 0 0 0 1px rgba(11, 59, 85, .08); transition: transform .3s ease; }
.obra__tapa:hover { transform: translateY(-4px); }
.obra__tapa img { display: block; width: 100%; height: auto; }
.obra__abierto { position: absolute; left: 12px; bottom: 12px; padding: 5px 12px; border-radius: 999px; background: rgba(11, 59, 85, .88); color: #fff; font-size: .8125rem; font-weight: var(--semibold); backdrop-filter: blur(6px); }
.obra__datos { display: grid; gap: 14px; min-width: 0; }
.obra__titulo { font-size: clamp(1.875rem, 1.2rem + 2.4vw, 3rem); font-weight: var(--semibold); line-height: 1.1; letter-spacing: -.02em; color: var(--gris-carbon); text-wrap: balance; }
.obra__subtitulo { font-size: var(--t-sub); font-weight: var(--light); font-style: italic; color: var(--gris-medio); line-height: 1.4; text-wrap: pretty; }
.obra__autores { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: var(--t-cuerpo); }
.obra__autor { display: inline-flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.obra__autor > a { color: var(--azul-texto); font-weight: var(--semibold); text-decoration: none; }
.obra__autor > a:hover { text-decoration: underline; text-underline-offset: 3px; }
.obra__autor:not(:last-child)::after { content: "·"; margin-left: 8px; color: var(--gris-claro); }
.obra__rol { color: var(--gris-medio); }
.orcid { display: inline-grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; background: #A6CE39; color: #fff; font-size: .625rem; font-weight: 700; text-decoration: none; }
.obra__ficha { display: flex; flex-wrap: wrap; gap: 0; margin: 4px 0 0; border: var(--filete); border-radius: 12px; overflow: hidden; background: var(--fondo); width: fit-content; max-width: 100%; }
.obra__ficha div { padding: 10px 18px; border-right: var(--filete); }
.obra__ficha div:last-child { border-right: 0; }
.obra__ficha dt { font-size: .75rem; font-weight: var(--semibold); letter-spacing: .08em; text-transform: uppercase; color: var(--gris-claro); }
.obra__ficha dd { margin: 2px 0 0; font-weight: var(--semibold); color: var(--gris-carbon); font-variant-numeric: tabular-nums; }
.obra__ids { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; font-size: .9375rem; color: var(--gris-medio); }
.doi { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 4px 8px; border-radius: 999px; border: var(--filete); background: var(--fondo); color: var(--gris-carbon); text-decoration: none; font-family: var(--mono); font-size: .875rem; }
.doi b { padding: 2px 8px; border-radius: 999px; background: #FCB425; color: #222; font-family: var(--fuente); font-size: .75rem; }
.doi:hover { border-color: var(--azul-clave); }
.obra__acciones { display: grid; gap: 14px; margin-top: 6px; justify-items: start; }
.obra__botones { display: flex; flex-wrap: wrap; gap: 10px; }
.obra__botones .boton-solido, .obra__botones .boton-contorno { min-height: 46px; padding: 10px 18px; font-size: .9375rem; }
.obra__cifras { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 0; margin: clamp(32px, 5vw, 48px) 0 0; padding: 0; list-style: none; background: var(--fondo); border: var(--filete); border-radius: var(--radio); overflow: hidden; }
.obra__cifras li { display: grid; gap: 2px; align-content: start; padding: 16px 20px; box-shadow: 0 0 0 .5px var(--azul-filete); }
.obra__cifras b { font-size: 1.5rem; font-weight: var(--semibold); color: var(--azul-clave); font-variant-numeric: tabular-nums; }
.obra__cifras span { font-size: .875rem; color: var(--gris-medio); }

.obra__cuerpo { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 360px); gap: clamp(32px, 5vw, 64px); padding-block: clamp(16px, 3vw, 32px) clamp(40px, 6vw, 72px); align-items: start; }
.obra__principal { display: grid; gap: clamp(40px, 5vw, 56px); min-width: 0; }
.obra__h2 { font-size: clamp(1.375rem, 1.1rem + 1vw, 1.75rem); font-weight: var(--semibold); letter-spacing: -.01em; color: var(--gris-carbon); }
.obra__h3 { font-size: 1rem; font-weight: var(--semibold); color: var(--gris-carbon); margin-bottom: 10px; }
.obra__bloque > .obra__h2 { margin-bottom: 16px; }
.obra__nota { color: var(--gris-medio); font-size: .9375rem; margin: -6px 0 18px; }
.obra__texto { display: grid; gap: 14px; font-size: var(--t-cuerpo); line-height: 1.7; color: var(--gris-carbon); max-width: 68ch; }
.obra__texto p { margin: 0; text-wrap: pretty; }
.claves { margin-top: 28px; }
.claves ul { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.claves a { display: inline-flex; padding: 6px 14px; border-radius: 999px; border: var(--filete); background: var(--fondo); color: var(--gris-carbon); font-size: .9375rem; text-decoration: none; }
.claves a:hover { border-color: var(--azul-clave); color: var(--azul-texto); }

.caps { margin: 0; padding: 0; list-style: none; border-top: var(--filete); }
.cap { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 14px; padding: 18px 0; border-bottom: var(--filete); }
.cap__num { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 10px; background: var(--tinte-azul); color: var(--azul-texto); font-weight: var(--semibold); font-variant-numeric: tabular-nums; }
.cap__titulo { font-size: 1.0625rem; font-weight: var(--semibold); line-height: 1.35; color: var(--gris-carbon); text-wrap: pretty; }
.cap__autores { margin-top: 4px; font-size: .9375rem; color: var(--gris-medio); }
.cap__enlaces { display: flex; flex-wrap: wrap; gap: 4px 18px; margin-top: 6px; font-size: .875rem; }
.cap__enlaces a { display: inline-flex; align-items: center; gap: 6px; min-height: 32px; color: var(--azul-texto); font-weight: var(--semibold); text-decoration: none; }
.cap__enlaces a:last-child { font-family: var(--mono); font-weight: 400; color: var(--gris-medio); }
.cap__enlaces a:hover { text-decoration: underline; text-underline-offset: 3px; }
.cap__enlaces .icono { width: 16px; height: 16px; stroke: currentColor; }

.autores { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); gap: 14px; margin: 0; padding: 0; list-style: none; }
.autor { display: flex; gap: 14px; padding: 16px; border: var(--filete); border-radius: var(--radio); background: var(--fondo); }
.autor__foto { position: relative; flex: none; display: grid; place-items: center; width: 64px; height: 64px; border-radius: 50%; overflow: hidden; background: var(--tinte-azul); color: var(--azul-texto); font-weight: var(--semibold); }
.autor__foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.autor__cuerpo { display: grid; gap: 2px; align-content: start; min-width: 0; }
.autor__nombre { font-size: 1.0625rem; font-weight: var(--semibold); line-height: 1.3; color: var(--gris-carbon); }
.autor__rol, .autor__inst { font-size: .875rem; color: var(--gris-medio); }
.autor__enlaces { display: flex; flex-wrap: wrap; gap: 2px 14px; margin-top: 6px; font-size: .875rem; }
.autor__enlaces a { display: inline-flex; align-items: center; gap: 4px; min-height: 28px; color: var(--azul-texto); font-weight: var(--semibold); text-decoration: none; }
.autor__enlaces a:hover { text-decoration: underline; text-underline-offset: 3px; }

.metadatos { border: var(--filete); border-radius: var(--radio); background: var(--fondo); }
.metadatos summary { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 16px; padding: 18px 20px; cursor: pointer; list-style: none; }
.metadatos summary::-webkit-details-marker { display: none; }
.metadatos summary::after { content: "+"; font-size: 1.5rem; line-height: 1; color: var(--azul-clave); }
.metadatos[open] summary::after { content: "−"; }
.metadatos summary span { flex: 1; font-size: .875rem; color: var(--gris-medio); }
.metadatos table { width: calc(100% - 40px); margin: 0 20px 16px; border-collapse: collapse; font-size: .9375rem; }
.metadatos th, .metadatos td { padding: 10px 0; border-top: var(--filete); text-align: left; vertical-align: top; }
.metadatos th { width: 34%; padding-right: 16px; font-weight: var(--semibold); color: var(--gris-medio); }
.metadatos td { color: var(--gris-carbon); overflow-wrap: anywhere; }
.metadatos .boton-contorno { margin: 0 20px 20px; min-height: 42px; padding: 8px 16px; font-size: .9375rem; }

.obra__lateral { display: grid; gap: 16px; position: sticky; top: calc(var(--nav-alto) + 16px); }
.lateral__caja { padding: 18px; border: var(--filete); border-radius: var(--radio); background: var(--fondo); }
.lateral__h { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; font-size: 1rem; font-weight: var(--semibold); color: var(--gris-carbon); }
.lateral__h .icono { width: 20px; height: 20px; }
.cita__pestanas { display: flex; gap: 4px; padding: 4px; border-radius: 999px; background: var(--tinte-azul); width: fit-content; }
.cita__pestanas button { min-height: 34px; padding: 4px 14px; border: 0; border-radius: 999px; background: transparent; font: inherit; font-size: .875rem; font-weight: var(--semibold); color: var(--gris-medio); cursor: pointer; }
.cita__pestanas button[aria-selected="true"] { background: var(--fondo); color: var(--azul-texto); box-shadow: 0 1px 3px rgba(11, 59, 85, .15); }
.cita__texto { margin-top: 12px; padding: 12px 14px; border-radius: 10px; background: var(--blanco-hueso); font-size: .9375rem; line-height: 1.55; color: var(--gris-carbon); overflow-wrap: anywhere; }
.cita__copiar { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; margin-top: 10px; padding: 0; border: 0; background: none; font: inherit; font-size: .9375rem; font-weight: var(--semibold); color: var(--azul-texto); cursor: pointer; }
.cita__copiar .icono { width: 18px; height: 18px; stroke: currentColor; }
.lista-docs { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.lista-docs a { display: flex; align-items: center; gap: 12px; min-height: 48px; padding: 8px 12px; border-radius: 10px; border: var(--filete); color: var(--gris-carbon); text-decoration: none; font-weight: var(--semibold); font-size: .9375rem; }
.lista-docs a:hover { border-color: var(--azul-clave); background: var(--tinte-azul); }
.lista-docs a > span:not(.logo-mini) { display: grid; flex: 1; min-width: 0; }
.lista-docs small { font-weight: 400; font-size: .8125rem; color: var(--gris-medio); }
.lista-docs .icono { width: 20px; height: 20px; }
.lista-docs .mini { color: var(--gris-claro); }
.logo-mini { position: relative; flex: none; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 8px; background: #fff; border: 1px solid #DCE5EA; overflow: hidden; font-size: .6875rem; font-weight: 700; color: #0B3B55; }
.logo-mini img { position: absolute; inset: 0; margin: auto; }
.logo-mini.con-logo > span { visibility: hidden; }
.dimensions { margin-top: 12px; min-height: 0; }

.obra__rel { background: var(--blanco-hueso); padding-block: clamp(40px, 6vw, 72px); }
.obra__rel-cabeza { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 8px 24px; margin-bottom: 24px; }
.tarjetas { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr)); gap: 18px; }
.tarjeta { display: flex; gap: 14px; padding: 14px; border: var(--filete); border-radius: var(--radio); background: var(--fondo); text-decoration: none; color: inherit; transition: border-color .2s ease, transform .2s ease; }
.tarjeta:hover { border-color: var(--azul-clave); transform: translateY(-2px); }
.tarjeta__tapa { flex: none; width: 72px; aspect-ratio: 13 / 17; border-radius: 6px; overflow: hidden; background: var(--tinte-azul); }
.tarjeta__tapa img { width: 100%; height: 100%; object-fit: cover; }
.tarjeta__cuerpo { display: grid; gap: 4px; align-content: start; min-width: 0; }
.tarjeta__meta { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; font-size: .8125rem; color: var(--gris-medio); }
.tarjeta__titulo { font-weight: var(--semibold); line-height: 1.3; color: var(--gris-carbon); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.tarjeta__autor { font-size: .875rem; color: var(--gris-medio); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.pasos { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; padding-block: 28px 56px; }
.paso { display: grid; gap: 4px; padding: 16px 20px; border: var(--filete); border-radius: var(--radio); text-decoration: none; color: var(--gris-carbon); }
.paso:hover { border-color: var(--azul-clave); }
.paso small { color: var(--azul-texto); font-weight: var(--semibold); font-size: .8125rem; }
.paso span { font-weight: var(--semibold); line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.paso--sig { text-align: right; }
.aviso-copiado { position: fixed; left: 50%; bottom: 24px; z-index: 120; translate: -50% 0; padding: 10px 18px; border-radius: 999px; background: var(--noche-fijo); color: #fff; font-weight: var(--semibold); box-shadow: 0 12px 30px -12px rgba(0, 0, 0, .5); }

@media (max-width: 960px) {
  .obra__cuerpo { grid-template-columns: 1fr; }
  .obra__lateral { position: static; }
}
@media (max-width: 720px) {
  .obra__grid { grid-template-columns: 1fr; }
  .obra__tapa-col { max-width: 240px; }
  .obra__ficha { width: 100%; }
  .obra__ficha div { flex: 1 1 auto; }
  .boton-html5 { width: 100%; }
  .pasos { grid-template-columns: 1fr; }
  .paso--sig { text-align: left; }
}

/* ---------- Listado ---------- */
.cat-cabeza { background: linear-gradient(180deg, var(--tinte-azul) 0%, var(--fondo) 100%); padding-block: clamp(24px, 4vw, 40px) clamp(24px, 4vw, 40px); }
.cat-cabeza .contenedor { display: grid; gap: 14px; }
.cat-titulo { font-size: var(--t-titulo); line-height: 1.02; }
.cat-titulo .clave { font-weight: var(--light); font-style: italic; }
.cat-cabeza .intro { max-width: 46em; color: var(--gris-medio); font-size: var(--t-sub); line-height: 1.5; }
.cat-cifras { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; margin: 12px 0 0; padding: 0; list-style: none; background: var(--azul-filete); border: var(--filete); border-radius: var(--radio); overflow: hidden; }
.cat-cifras li { display: grid; gap: 2px; padding: 16px 20px; background: var(--fondo); }
.cat-cifras b { font-size: clamp(1.5rem, 1.2rem + 1vw, 2rem); font-weight: var(--semibold); color: var(--azul-clave); font-variant-numeric: tabular-nums; }
.cat-cifras span { font-size: .875rem; color: var(--gris-medio); }
.cat-html5 { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 32px; margin-top: 12px; padding: 20px 24px; border-radius: var(--radio); background: var(--noche-fijo); color: #fff; }
.cat-html5 .etiqueta { color: #7FE0FF; }
.cat-html5__texto { margin-top: 4px; color: var(--azul-hielo); max-width: 30em; }
.cat-html5__obras { display: flex; flex-wrap: wrap; gap: 12px; }
.cat-html5 .boton-html5 { box-shadow: none; outline: 1px solid rgba(127, 224, 255, .3); max-width: 360px; }
.cat-html5 .boton-html5__texto strong { font-size: .9375rem; line-height: 1.25; }
.cat-lista { padding-block: clamp(16px, 3vw, 32px) clamp(56px, 8vw, 96px); }
.cat-lista .filtros { position: sticky; top: var(--nav-alto); z-index: 20; padding: 12px 0; margin-bottom: 8px; background: var(--fondo); border-bottom: var(--filete); }
.filtros label:not(.filtros__buscar) { display: grid; gap: 2px; font-size: .75rem; font-weight: var(--semibold); letter-spacing: .06em; text-transform: uppercase; color: var(--gris-claro); }
.filtros select { min-height: 44px; padding: 0 34px 0 14px; border: var(--filete); border-radius: 12px; background: var(--blanco) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2358595B' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 10px center / 16px; appearance: none; font: inherit; font-size: .9375rem; letter-spacing: 0; text-transform: none; font-weight: var(--regular); color: var(--gris-carbon); max-width: 220px; }
.filtros__chips { display: flex; flex-wrap: wrap; gap: 8px; align-self: end; }
.cat-conteo { margin: 12px 0 20px; font-size: var(--t-etiqueta); color: var(--gris-medio); font-variant-numeric: tabular-nums; }
.cat-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 190px), 1fr)); gap: clamp(24px, 3vw, 36px) clamp(16px, 2.4vw, 28px); margin: 0; padding: 0; list-style: none; }
.cl[hidden] { display: none; }
.cl__enlace { display: grid; gap: 12px; text-decoration: none; color: inherit; }
.cl__tapa { display: block; aspect-ratio: 13 / 17; border-radius: 8px; overflow: hidden; background: var(--tinte-azul); box-shadow: 0 14px 28px -20px rgba(11, 59, 85, .7), 0 0 0 1px rgba(11, 59, 85, .08); transition: transform .25s ease, box-shadow .25s ease; }
.cl__tapa img { width: 100%; height: 100%; object-fit: cover; }
.cl__enlace:hover .cl__tapa { transform: translateY(-4px); box-shadow: 0 22px 36px -20px rgba(11, 59, 85, .8), 0 0 0 1px var(--azul-clave); }
.cl__cuerpo { display: grid; gap: 4px; }
.cl__meta { font-size: .8125rem; color: var(--gris-medio); }
.cl__titulo { font-weight: var(--semibold); line-height: 1.3; color: var(--gris-carbon); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.cl__enlace:hover .cl__titulo { color: var(--azul-texto); }
.cl__sub { font-size: .875rem; font-style: italic; color: var(--gris-medio); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.cl__autor { font-size: .875rem; color: var(--gris-medio); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.cl__sellos { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
.cat-vacio { padding: 40px 0; text-align: center; color: var(--gris-medio); }
.enlace-boton { border: 0; background: none; padding: 0; font: inherit; font-weight: var(--semibold); color: var(--azul-texto); text-decoration: underline; cursor: pointer; }
.cat-mas { display: flex; justify-content: center; margin-top: 40px; }
@media (max-width: 820px) {
  .cat-cifras { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cat-lista .filtros { position: static; }
  .filtros label:not(.filtros__buscar) { flex: 1 1 140px; }
  .filtros select { max-width: none; width: 100%; }
}
@media (max-width: 480px) {
  .cat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* =========== Experiencia en todos los dispositivos =========== */
.filtros__panel { display: contents; }
.pagina-obra .boton-publicar, .pagina-catalogo .boton-publicar { display: none; }
.filtros__abrir { display: none; }
.barra-obra { display: none; }
.cat-html5__obras { min-width: 0; }
.cat-cabeza .contenedor > * { min-width: 0; }
.cat-html5 > div { min-width: 0; }
.boton-html5__texto { min-width: 0; }
@media (max-width: 1023px), (pointer: coarse) {
  .cita__pestanas button { min-height: 44px; padding-inline: 16px; }
  .claves a { min-height: 44px; align-items: center; }
  .cita__copiar { min-height: 44px; }
  .cap__enlaces a { min-height: 40px; }
}
@media (hover: none) {
  .obra__tapa:hover, .tarjeta:hover, .cl__enlace:hover .cl__tapa, .boton-html5:hover { transform: none; }
}
@media (max-width: 720px) {
  /* Listado: buscador y botón «Filtros»; el panel se despliega al tocarlo */
  .cat-lista .filtros { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; }
  .filtros__abrir { display: inline-flex; align-items: center; gap: 8px; min-height: 48px; padding: 0 16px; border: var(--filete); border-radius: 999px;
    background: var(--blanco); font: inherit; font-weight: var(--semibold); color: var(--gris-carbon); cursor: pointer; }
  .filtros__abrir .icono { width: 18px; height: 18px; stroke: currentColor; }
  .filtros__abrir[aria-expanded="true"] { border-color: var(--azul-clave); color: var(--azul-texto); }
  .filtros__n { display: inline-grid; place-items: center; min-width: 22px; height: 22px; padding: 0 6px; border-radius: 999px; background: var(--azul-tinta); color: #fff; font-size: .75rem; }
  .filtros__n[hidden] { display: none; }
  .filtros__panel { display: none; grid-column: 1 / -1; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding: 4px 0 6px; }
  .filtros__panel.abierto { display: grid; }
  .filtros__panel label { min-width: 0; }
  .filtros__panel .filtros__chips { grid-column: 1 / -1; }
  .cat-html5 { padding: 18px; }
  .cat-html5__obras, .cat-html5 .boton-html5 { width: 100%; max-width: none; }
  /* Ficha: barra fija con las acciones principales */
  .barra-obra { position: fixed; left: 12px; right: 12px; bottom: calc(12px + env(safe-area-inset-bottom, 0px)); z-index: 30;
    display: flex; gap: 6px; padding: 6px; border-radius: 18px; background: var(--noche-fijo); box-shadow: 0 18px 40px -16px rgba(0, 20, 30, .7);
    translate: 0 140%; transition: translate .3s cubic-bezier(.2, .7, .2, 1); }
  .barra-obra.visible { translate: 0 0; }
  .barra-obra:not(.visible) { visibility: hidden; transition: translate .3s ease, visibility 0s .3s; }
  .barra-obra[hidden] { display: none; }
  .barra-obra a, .barra-obra button { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 48px; padding: 0 10px;
    border: 0; border-radius: 13px; background: transparent; color: #fff; font: inherit; font-size: .9375rem; font-weight: var(--semibold); text-decoration: none; cursor: pointer; }
  .barra-obra button { flex: 0 0 48px; }
  .barra-obra .icono { width: 20px; height: 20px; stroke: #7FE0FF; }
  .barra-obra__pdf { background: var(--azul-tinta) !important; }
  .barra-obra__html5 { background: linear-gradient(120deg, #00628C, #0094CE) !important; }
  .barra-obra__html5 span { padding: 2px 6px; border-radius: 6px; background: #fff; color: #00628C; font-size: .75rem; letter-spacing: .04em; text-transform: uppercase; }
  .obra__lateral .lateral__caja { scroll-margin-top: calc(var(--nav-alto) + 12px); }
  .pagina-obra .pie { padding-bottom: calc(32px + 76px); }
}
@media (max-width: 380px) {
  .obra__botones .boton-solido, .obra__botones .boton-contorno { flex: 1 1 auto; }
  .cat-cifras li { padding: 14px; }
  .barra-obra a { font-size: .875rem; padding: 0 6px; }
}
@media (max-height: 500px) and (orientation: landscape) {
  .cat-lista .filtros, .obra__lateral { position: static; }
}

/* Métricas reales y dictámenes por capítulo */
.obra__nota-metricas { margin-top: 10px; font-size: .8125rem; color: var(--gris-medio); }
.dict-caps { margin-top: 8px; border: var(--filete); border-radius: 10px; }
.dict-caps summary { display: flex; align-items: center; gap: 12px; min-height: 48px; padding: 8px 12px; cursor: pointer; list-style: none; font-weight: var(--semibold); font-size: .9375rem; }
.dict-caps summary::-webkit-details-marker { display: none; }
.dict-caps summary::after { content: "+"; margin-left: auto; font-size: 1.25rem; color: var(--azul-clave); }
.dict-caps[open] summary::after { content: "−"; }
.dict-caps summary > span { display: grid; }
.dict-caps summary small { font-weight: 400; font-size: .8125rem; color: var(--gris-medio); }
.dict-caps summary .icono { width: 20px; height: 20px; }
.dict-caps ul { margin: 0; padding: 4px 12px 12px; list-style: none; display: grid; gap: 2px; max-height: 320px; overflow: auto; }
.dict-caps li { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 14px; padding: 6px 0; border-top: var(--filete); font-size: .875rem; }
.dict-caps li span { min-width: 6.5em; color: var(--gris-carbon); font-weight: var(--medium); }
.dict-caps li a { display: inline-flex; align-items: center; min-height: 36px; color: var(--azul-texto); font-weight: var(--semibold); text-decoration: none; }
.dict-caps li a:hover { text-decoration: underline; text-underline-offset: 3px; }

/* ---------- Capítulos con página propia (Google Scholar) ---------- */
.cap__titulo a { color: inherit; text-decoration: none; }
.cap__titulo a:hover { color: var(--azul-texto); text-decoration: underline; text-underline-offset: 3px; }
.cap__inst { margin-top: 2px; font-size: .8125rem; color: var(--gris-claro); }
.cap__datos { margin-top: 4px; font-size: .8125rem; color: var(--gris-medio); font-variant-numeric: tabular-nums; }
.cap__enlaces a:first-child .icono { width: 15px; height: 15px; }
.cap-grid { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: clamp(20px, 4vw, 40px); align-items: start; }
.cap-grid__tapa { display: block; border-radius: 8px; overflow: hidden; box-shadow: 0 18px 36px -22px rgba(11, 59, 85, .7), 0 0 0 1px rgba(11, 59, 85, .08); transition: transform .25s ease; }
.cap-grid__tapa:hover { transform: translateY(-3px); }
.cap-grid__tapa img { display: block; width: 100%; height: auto; }
.obra__titulo--cap { font-size: clamp(1.625rem, 1.1rem + 2vw, 2.5rem); }
.cap-autores { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; }
.cap-autores li { display: grid; gap: 0; }
.cap-autor__nombre { display: inline-flex; align-items: center; gap: 8px; font-weight: var(--semibold); color: var(--gris-carbon); }
.cap-autores small { font-size: .875rem; color: var(--gris-medio); }
.cap-en { font-size: .9375rem; color: var(--gris-medio); line-height: 1.5; }
.cap-en a { color: var(--azul-texto); text-decoration: none; }
.cap-en a:hover { text-decoration: underline; text-underline-offset: 3px; }
.obra__botones .boton-solido small { font-weight: 400; opacity: .8; }
.claves li > span { display: inline-flex; padding: 6px 14px; border-radius: 999px; border: var(--filete); background: var(--fondo); color: var(--gris-carbon); font-size: .9375rem; }
.cap-otros { margin: 0; padding: 0; list-style: none; border-top: var(--filete); }
.cap-otros li { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 10px; padding: 10px 0; border-bottom: var(--filete); font-size: .9375rem; line-height: 1.4; }
.cap-otros li > span { color: var(--gris-claro); font-weight: var(--semibold); font-variant-numeric: tabular-nums; }
.cap-otros a { color: var(--gris-carbon); text-decoration: none; }
.cap-otros a:hover { color: var(--azul-texto); text-decoration: underline; text-underline-offset: 3px; }
.cap-otros [aria-current] strong { color: var(--azul-texto); }
.cita__texto--codigo pre { margin: 0; white-space: pre-wrap; font-family: var(--mono); font-size: .8125rem; line-height: 1.5; }
.citado__lista { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; border-top: var(--filete); counter-reset: cit; }
.citado__lista li { display: grid; gap: 2px; padding: 12px 0 12px 36px; border-bottom: var(--filete); position: relative; counter-increment: cit; }
.citado__lista li::before { content: counter(cit); position: absolute; left: 0; top: 12px; width: 26px; height: 26px; display: grid; place-items: center; border-radius: 8px; background: var(--tinte-azul); color: var(--azul-texto); font-size: .8125rem; font-weight: var(--semibold); }
.citado__lista a { color: var(--gris-carbon); font-weight: var(--semibold); text-decoration: none; line-height: 1.35; }
.citado__lista a:hover { color: var(--azul-texto); text-decoration: underline; text-underline-offset: 3px; }
.citado__lista span { font-size: .875rem; color: var(--gris-medio); }
.citado__mas { margin-top: 14px; }
/* Índice de capítulos por año */
.anios { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 200px), 1fr)); gap: 14px; margin: 0; padding: 0; list-style: none; }
.anios a { display: grid; gap: 4px; padding: 18px 20px; border: var(--filete); border-radius: var(--radio); background: var(--fondo); text-decoration: none; color: var(--gris-carbon); }
.anios a:hover { border-color: var(--azul-clave); }
.anios b { font-size: 1.75rem; font-weight: var(--semibold); color: var(--azul-clave); font-variant-numeric: tabular-nums; }
.anios span { font-size: .875rem; color: var(--gris-medio); }
.anios-linea { display: flex; flex-wrap: wrap; gap: 6px 4px; color: var(--gris-claro); }
.anios-linea a { color: var(--azul-texto); font-weight: var(--semibold); text-decoration: none; padding: 4px 6px; }
.anios-linea strong { padding: 4px 6px; color: var(--gris-carbon); }
.indice-cuerpo { display: grid; gap: clamp(28px, 4vw, 40px); }
.indice-obra h2 { font-size: 1.25rem; font-weight: var(--semibold); line-height: 1.3; }
.indice-obra h2 a { color: var(--gris-carbon); text-decoration: none; }
.indice-obra h2 a:hover { color: var(--azul-texto); }
.indice-obra > p { margin-top: 4px; font-size: .875rem; color: var(--gris-medio); }
.indice-obra ol { margin: 12px 0 0; padding-left: 1.4em; display: grid; gap: 8px; }
.indice-obra li a { color: var(--azul-texto); text-decoration: none; font-weight: var(--medium); }
.indice-obra li a:hover { text-decoration: underline; text-underline-offset: 3px; }
.indice-obra li span { display: block; font-size: .8125rem; color: var(--gris-medio); }
@media (max-width: 720px) {
  .cap-grid { grid-template-columns: 1fr; }
  .cap-grid__tapa { width: 96px; }
  .pagina-cap .obra__botones > * { flex: 1 1 auto; }
}
@media (hover: none) { .cap-grid__tapa:hover { transform: none; } }
/* Índice de capítulos: secciones que se leen en la Biblioteca (versión inmersiva) */
.cap-bib { display: inline-block; margin-left: 6px; padding: 0 8px; border-radius: 999px; font-size: .75rem; font-weight: 600; background: var(--tinte-azul, #E8EFF3); color: var(--azul-texto, #00628C); vertical-align: middle; }
/* Celulares de 320 px: las fichas no se salen de su columna (7 nov 2026) */
.cl { min-width: 0; }
.sello-html5 { max-width: 100%; white-space: normal; text-align: center; }