/* Versión 1.2 del diario: portada con más peso visual (titular sobre la imagen, miniaturas, columna de guías),
   color por sección, cinta de cotizaciones, compartir, índice de guías y barra de lectura.
   Se carga después de style.css y se impone a sus reglas del mismo peso. */

/* ---------- Color de cada sección ---------- */
.vxn-sec-releases { --sec: #ff6b5e; }
.vxn-sec-mobile { --sec: #3ddc84; }
.vxn-sec-pc-console { --sec: #5aa9ff; }
.vxn-sec-industry { --sec: #ffb84d; }
.vxn-sec-indie { --sec: #c58bff; }
.vxn-sec-guides { --sec: #3fd6c8; }
.vxn-sec-news { --sec: #f5f5f5; }
.vxn .vxn-kicker { display: inline-flex; align-items: center; gap: 8px; padding-bottom: 0; border-bottom: 0; color: var(--sec, var(--ink)); font-weight: 600; }
.vxn-kicker::before { content: ""; width: 8px; height: 8px; background: var(--sec, var(--ink)); flex: 0 0 auto; }
.vxn .vxn-kicker:hover { color: var(--ink); }

/* ---------- Cinta de cotizaciones ---------- */
.vxn-ticker { border-bottom: 1px solid var(--line); background: var(--surface); }
.vxn-ticker-in { display: flex; align-items: center; gap: 16px; }
.vxn-ticker-label { flex: 0 0 auto; display: flex; align-items: center; gap: 8px; font-family: var(--font-mono); font-size: 11px; line-height: 16px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--ink); }
.vxn-ticker-label::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: #3ddc84; }
/* La pista lleva el widget dos veces y se desplaza sin parar; al llegar a la mitad vuelve al principio sin salto */
.vxn-ticker-tape { flex: 1 1 auto; min-width: 0; height: 34px; overflow: hidden; -webkit-mask-image: linear-gradient(90deg, #0000, #000 32px, #000 calc(100% - 32px), #0000); mask-image: linear-gradient(90deg, #0000, #000 32px, #000 calc(100% - 32px), #0000); }
.vxn-ticker-track { display: flex; width: 6400px; animation: vxn-tape 110s linear infinite; }
.vxn-ticker-tape:hover .vxn-ticker-track { animation-play-state: paused; }
/* El widget fija su propio tamaño en línea (de ahí el !important). Mide 58 px de alto y su texto no está centrado:
   queda a 23 px del borde superior. Se sube 6 px para que el texto caiga en el centro de los 34 px de la cinta. */
.vxn-ticker-copy { flex: 0 0 3200px; width: 3200px !important; height: 58px !important; margin-top: -6px; }
@keyframes vxn-tape { to { transform: translateX(-3200px); } }
/* El sitio declara esquema oscuro; sin esto el navegador pinta un fondo blanco opaco detrás del widget transparente */
.vxn-ticker iframe { color-scheme: light; }

/* ---------- Noticias principales: titular sobre la imagen ---------- */
.vxn-front { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 16px; padding-block: 24px 56px; }
.vxn-front-lead { display: flex; min-width: 0; }
.vxn-front-side { display: grid; grid-template-rows: repeat(2, minmax(0, 1fr)); gap: 16px; border-top: 0; margin-top: 0; }
.vxn-hero { position: relative; flex: 1 1 auto; display: flex; flex-direction: column; justify-content: flex-end; align-items: stretch; gap: 0; overflow: hidden; background: var(--surface-raised); border: 1px solid var(--line); isolation: isolate; }
.vxn-hero-lg { min-height: 540px; }
.vxn-hero-sm { min-height: 262px; }
.vxn-hero-media { position: absolute; inset: 0; z-index: -2; }
.vxn-hero-media .vxn-cover { width: 100%; height: 100%; aspect-ratio: auto; border: 0; }
.vxn-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: linear-gradient(180deg, #0a0a0a00 25%, #0a0a0ab3 62%, #0a0a0af2 100%); }
.vxn-hero::after { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 3px; background: var(--sec, var(--ink)); }
.vxn-hero-body { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; padding: 32px; }
.vxn-hero-sm .vxn-hero-body { padding: 20px; gap: 10px; }
.vxn-hero-lg .vxn-hl-xl { font-size: clamp(32px, 3.6vw, 52px); line-height: 1.04; }
.vxn-hero-sm .vxn-hl-md { font-size: 24px; line-height: 27px; }
.vxn-hero .vxn-standfirst { max-width: 640px; font-size: 17px; line-height: 26px; color: var(--ink-soft); }
.vxn-hero .vxn-meta { color: var(--ink-muted); }
.vxn-hero .vxn-hl, .vxn-hero .vxn-standfirst { text-shadow: 0 1px 12px #0a0a0a99; }
@media (prefers-reduced-motion: no-preference) {
  .vxn-cover-photo img { transition: transform 700ms cubic-bezier(.2, .7, .2, 1); }
  .vxn-hero:hover .vxn-hero-media img, .vxn-story:hover .vxn-cover-photo img { transform: scale(1.035); }
}

/* ---------- Última hora con miniaturas y columna de guías ---------- */
.vxn-split { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 56px; }
.vxn-latest { display: flex; flex-direction: column; }
.vxn-story-row { display: grid; grid-template-columns: 200px minmax(0, 1fr); column-gap: 24px; row-gap: 0; align-items: start; padding-block: 20px; border-bottom: 1px solid var(--line); }
.vxn-story-row:first-child { padding-top: 0; }
.vxn-thumb { display: block; }
.vxn-thumb .vxn-cover { aspect-ratio: 16 / 9; padding: 10px; }
.vxn-thumb .vxn-cover-photo { padding: 0; }
.vxn-thumb .vxn-cover-mark, .vxn-thumb .vxn-cover-label { display: none; }
.vxn-row-body { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; min-width: 0; }
.vxn-story-row .vxn-hl-sm { font-family: var(--font-head); font-weight: 800; font-size: 24px; line-height: 27px; letter-spacing: 0; }
.vxn-story-row .vxn-excerpt { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
.vxn-rail { position: sticky; top: 148px; align-self: start; }
.vxn-rail-list { margin: 0; padding: 0; list-style: none; counter-reset: rail; }
.vxn-rail-list li { counter-increment: rail; display: grid; grid-template-columns: 40px minmax(0, 1fr); align-items: start; padding-block: 16px; border-bottom: 1px solid var(--line); }
.vxn-rail-list li:first-child { padding-top: 0; }
.vxn-rail-list li::before { content: counter(rail, decimal-leading-zero); font-family: var(--font-head); font-weight: 800; font-size: 28px; line-height: 28px; color: var(--sec, var(--ink-subtle)); }
.vxn-rail-list a { font: 600 17px/24px var(--font-sans); color: var(--ink); background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat; transition: background-size 250ms cubic-bezier(.2, .7, .2, 1); }
.vxn-rail-list a:hover { background-size: 100% 1px; }
.vxn-rail-about { margin-top: 32px; padding: 20px; background: var(--surface-raised); border: 1px solid var(--line); font-size: 14px; line-height: 22px; color: var(--ink-muted); }
.vxn-rail-about .vxn-label { display: block; margin-bottom: 8px; color: var(--ink); }
.vxn .vxn-rail-about a { color: var(--ink); text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--line-strong); }

/* ---------- Bloques y tarjetas ---------- */
.vxn-block-head { border-top: 2px solid var(--sec, var(--line-strong)); }
.vxn-block-head .vxn-label { display: inline-flex; align-items: center; gap: 10px; font-size: 14px; font-weight: 600; }
.vxn-block-head[class*="vxn-sec-"] .vxn-label::before { content: ""; width: 10px; height: 10px; background: var(--sec); }
.vxn-story-card .vxn-hl-md { font-size: 26px; line-height: 29px; }
.vxn-archive-head { padding-top: 20px; border-top: 2px solid var(--sec, var(--line-strong)); }

/* ---------- Noticia: compartir, índice y barra de lectura ---------- */
.vxn-progress { position: absolute; left: 0; bottom: -1px; width: 100%; height: 2px; pointer-events: none; }
.vxn-progress span { display: block; width: 0; height: 100%; background: var(--ink); }
.vxn-share { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.vxn-share .vxn-label { margin-right: 4px; }
.vxn-share a, .vxn-share button { display: inline-flex; align-items: center; gap: 8px; height: 36px; padding: 0 12px; background: transparent; border: 1px solid var(--line); color: var(--ink-muted); font: 600 13px/18px var(--font-sans); cursor: pointer; transition: border-color 150ms ease-out, color 150ms ease-out, background 150ms ease-out; }
.vxn .vxn-share a:hover, .vxn-share button:hover { border-color: var(--ink); color: var(--ink); background: var(--surface-raised); }
.vxn-share svg { width: 15px; height: 15px; flex: 0 0 auto; }
.vxn-share-end { margin-top: 40px; padding-top: 24px; border-top: 1px solid var(--line); }
.vxn-toc { margin-bottom: 40px; padding: 20px 24px; border: 1px solid var(--line); }
.vxn .vxn-toc ol { margin: 12px 0 0; padding-left: 22px; display: flex; flex-direction: column; gap: 8px; font-size: 16px; line-height: 24px; color: var(--ink-subtle); }
.vxn .vxn-toc a { color: var(--ink-soft); text-decoration: underline; text-underline-offset: 4px; text-decoration-color: var(--line); }
.vxn .vxn-toc a:hover { color: var(--ink); text-decoration-color: var(--ink); }
.vxn-prose h2 { scroll-margin-top: 140px; }
.vxn-article-head { border-top: 3px solid var(--sec, transparent); }

/* ---------- Adaptación ---------- */
@media (max-width: 1000px) {
  .vxn-front { grid-template-columns: 1fr; gap: 16px; }
  .vxn-front-side { grid-template-rows: none; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 0; }
  .vxn-hero-lg { min-height: 440px; }
  .vxn-split { grid-template-columns: 1fr; gap: 48px; }
  .vxn-rail { position: static; }
}
@media (max-width: 760px) {
  .vxn-ticker-label { display: none; }
  .vxn-front { padding-block: 16px 40px; }
  .vxn-front-side { grid-template-columns: 1fr; }
  .vxn-hero-lg { min-height: 400px; }
  .vxn-hero-sm { min-height: 240px; }
  .vxn-hero-body { padding: 20px; }
  .vxn-hero .vxn-standfirst { display: none; }
  .vxn-story-row { grid-template-columns: 112px minmax(0, 1fr); column-gap: 14px; padding-block: 16px; }
  .vxn-story-row .vxn-hl-sm { font-size: 20px; line-height: 23px; }
  .vxn-story-row .vxn-excerpt { display: none; }
  .vxn-share a span, .vxn-share button span { display: none; }
  .vxn-share a, .vxn-share button { width: 44px; height: 44px; padding: 0; justify-content: center; }
  .vxn-share svg { width: 18px; height: 18px; }
}

/* =====================================================================================================
   Movimiento. El dueño del sitio pidió expresamente más animación, así que las entradas suaves
   (opacidad y un desplazamiento corto) funcionan siempre; con "reducir movimiento" solo se apaga
   el movimiento continuo de la imagen principal.
   ===================================================================================================== */

/* Entrada de la página y de las noticias principales */
@keyframes vxn-rise { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
@keyframes vxn-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes vxn-settle { from { transform: scale(1.09); } to { transform: scale(1); } }
@keyframes vxn-drift { from { transform: scale(1) translate3d(0, 0, 0); } to { transform: scale(1.07) translate3d(-1.2%, -1%, 0); } }
@keyframes vxn-pulse { 0% { box-shadow: 0 0 0 0 var(--pulse, #3ddc8499); } 70%, 100% { box-shadow: 0 0 0 9px #0000; } }
@keyframes vxn-draw { from { transform: scaleX(0); } to { transform: scaleX(1); } }

.vxn-ticker { animation: vxn-fade 700ms ease-out both; }
.vxn-hero { animation: vxn-fade 600ms ease-out both; }
.vxn-front-side .vxn-hero:nth-child(1) { animation-delay: 120ms; }
.vxn-front-side .vxn-hero:nth-child(2) { animation-delay: 220ms; }
.vxn-hero-media img { animation: vxn-settle 1800ms cubic-bezier(.2, .7, .2, 1) both; }
.vxn-hero-lg .vxn-hero-media img { animation: vxn-settle 1800ms cubic-bezier(.2, .7, .2, 1) both, vxn-drift 26s ease-in-out 1800ms infinite alternate; }
.vxn-hero-body > * { animation: vxn-rise 700ms cubic-bezier(.2, .7, .2, 1) both; }
.vxn-hero-body > :nth-child(1) { animation-delay: 250ms; }
.vxn-hero-body > :nth-child(2) { animation-delay: 330ms; }
.vxn-hero-body > :nth-child(3) { animation-delay: 410ms; }
.vxn-hero-body > :nth-child(4) { animation-delay: 490ms; }
.vxn-hero::after { transform-origin: left; animation: vxn-draw 900ms cubic-bezier(.2, .7, .2, 1) 200ms both; }
.vxn-article-head > * { animation: vxn-rise 700ms cubic-bezier(.2, .7, .2, 1) both; }
.vxn-article-head > :nth-child(2) { animation-delay: 80ms; }
.vxn-article-head > :nth-child(3) { animation-delay: 160ms; }
.vxn-article-head > :nth-child(n+4) { animation-delay: 240ms; }
.vxn-article-cover .vxn-cover-photo img { animation: vxn-settle 1600ms cubic-bezier(.2, .7, .2, 1) both; }
.vxn-archive-head > * { animation: vxn-rise 700ms cubic-bezier(.2, .7, .2, 1) both; }

/* Puntos "en directo" */
.vxn-ticker-label::before { animation: vxn-pulse 2s ease-out infinite; }
.vxn-live::before { content: ""; width: 9px; height: 9px; border-radius: 50%; background: #ff5a4f; --pulse: #ff5a4f99; animation: vxn-pulse 1.6s ease-out infinite; }

/* Entrada al hacer scroll (la clase la pone news.js; sin JavaScript todo se ve desde el principio) */
.vxn-js .vxn-reveal { opacity: 0; transform: translateY(20px); transition: opacity 600ms ease-out, transform 800ms cubic-bezier(.2, .7, .2, 1); transition-delay: var(--d, 0ms); }
.vxn-js .vxn-reveal.is-in { opacity: 1; transform: none; }
/* El filete de cada bloque se dibuja de izquierda a derecha */
.vxn-block-head { position: relative; border-top-color: transparent; }
.vxn-block-head::before { content: ""; position: absolute; left: 0; top: -2px; width: 100%; height: 2px; background: var(--sec, var(--line-strong)); transform-origin: left; transition: transform 900ms cubic-bezier(.2, .7, .2, 1) 150ms; }
.vxn-js .vxn-block-head.vxn-reveal:not(.is-in)::before { transform: scaleX(0); }

/* Al pasar el cursor */
.vxn-cover-photo img { transition: transform 700ms cubic-bezier(.2, .7, .2, 1); }
.vxn-story:hover .vxn-cover-photo img { transform: scale(1.05); }
.vxn-hero { transition: border-color 250ms ease-out; }
.vxn-hero:hover { border-color: var(--sec, var(--line-strong)); }
.vxn-kicker::before { transition: transform 300ms cubic-bezier(.2, .7, .2, 1); }
.vxn-story:hover .vxn-kicker::before, .vxn-kicker:hover::before { transform: rotate(45deg) scale(1.15); }
.vxn-story-row { transition: background 200ms ease-out; }
.vxn-rail-list li::before { transition: transform 300ms cubic-bezier(.2, .7, .2, 1); }
.vxn-rail-list li:hover::before { transform: translateX(4px); }
.vxn-more { display: inline-flex; gap: 4px; }
.vxn-nav a { position: relative; border-bottom-color: transparent; }
.vxn-nav a::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: var(--ink); transform: scaleX(0); transform-origin: left; transition: transform 300ms cubic-bezier(.2, .7, .2, 1); }
.vxn-nav a:hover::after, .vxn-nav a[aria-current="page"]::after { transform: scaleX(1); }
.vxn .vxn-nav a:hover, .vxn .vxn-nav a[aria-current="page"] { border-color: transparent; }
.vxn-progress span { transition: width 120ms linear; }

@media (prefers-reduced-motion: reduce) {
  /* Se mantiene la entrada, se quita el movimiento continuo */
  .vxn-hero-lg .vxn-hero-media img { animation: vxn-settle 1800ms cubic-bezier(.2, .7, .2, 1) both; }
}
@media (max-width: 760px) {
  /* En móvil el menú es una lista: vuelven los filetes entre secciones y se quita el subrayado animado */
  .vxn-nav a::after { display: none; }
  .vxn .vxn-nav a, .vxn .vxn-nav a:hover, .vxn .vxn-nav a[aria-current="page"] { border-bottom-color: var(--line); }
}

/* ---------- Cinta fija arriba del todo, con la cabecera pegada justo debajo ---------- */
:root { --ticker-h: 35px; }
html { scroll-padding-top: 174px; }
.vxn-ticker { position: sticky; top: 0; z-index: 60; }
.vxn-header { top: var(--ticker-h); }
.vxn-rail { top: 186px; }
.vxn-prose h2 { scroll-margin-top: 178px; }
/* Con la barra de administración de WordPress (solo la ve quien ha iniciado sesión) */
.admin-bar .vxn-ticker { top: 32px; }
.admin-bar .vxn-header { top: calc(32px + var(--ticker-h)); }
@media (max-width: 782px) {
  .admin-bar .vxn-ticker { top: 46px; }
  .admin-bar .vxn-header { top: calc(46px + var(--ticker-h)); }
}
@media (max-width: 600px) {
  .admin-bar .vxn-ticker { top: 0; }
  .admin-bar .vxn-header { top: var(--ticker-h); }
}
@media (max-width: 1000px) {
  .vxn-rail { top: auto; }
}

/* =====================================================================================================
   Cabecera delgada: la fecha va en la cinta; al bajar por la página la marca se desliza bajo la cinta
   y solo queda fija la fila de secciones, con la marca y las herramientas en pequeño.
   ===================================================================================================== */
:root { --mast-h: 72px; }
.vxn-topbar { display: none; }
.vxn-ticker-date { flex: 0 0 auto; display: flex; align-items: center; gap: 14px; font-family: var(--font-mono); font-size: 11px; line-height: 16px; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-subtle); }
.vxn .vxn-ticker-date a { color: var(--ink-muted); transition: color 150ms ease-out; }
.vxn .vxn-ticker-date a:hover { color: var(--ink); }

@media (min-width: 761px) {
  /* Pegada con tope negativo: la franja de la marca (72 px) sigue subiendo y se esconde tras la cinta */
  .vxn-header { top: calc(var(--ticker-h) - var(--mast-h)); }
  .admin-bar .vxn-header { top: calc(32px + var(--ticker-h) - var(--mast-h)); }
  html { scroll-padding-top: 104px; }
  .vxn-rail { top: 112px; }
  .vxn-prose h2 { scroll-margin-top: 108px; }
}
@media (min-width: 761px) and (max-width: 782px) {
  .admin-bar .vxn-header { top: calc(46px + var(--ticker-h) - var(--mast-h)); }
}

/* Fila de secciones: marca en pequeño a la izquierda y herramientas a la derecha cuando está fija */
.vxn-nav-in { align-items: center; gap: 0; overflow: visible; }
.vxn-nav-links { display: flex; gap: 28px; min-width: 0; overflow-x: auto; scrollbar-width: none; }
.vxn-nav-links::-webkit-scrollbar { display: none; }
.vxn-nav-brand { display: flex; align-items: center; gap: 10px; flex: 0 0 auto; max-width: 0; opacity: 0; overflow: hidden; visibility: hidden; transition: max-width 350ms cubic-bezier(.2, .7, .2, 1), opacity 250ms ease-out, margin 350ms cubic-bezier(.2, .7, .2, 1), visibility 0s linear 350ms; }
.vxn .vxn-nav-brand { padding: 0; border: 0; }
.vxn-nav-brand::after { display: none; }
.vxn-nav-brand img { height: 16px; width: auto; max-width: none; }
.vxn-nav-brand .vxn-brand-tag { font-size: 10px; line-height: 14px; padding: 2px 5px 2px 7px; }
.vxn-nav-tools { display: flex; align-items: center; gap: 12px; flex: 0 0 auto; margin-left: auto; padding-left: 20px; opacity: 0; visibility: hidden; transition: opacity 250ms ease-out, visibility 0s linear 250ms; }
.vxn-nav-tools .vxn-lang a { width: 36px; height: 28px; font-size: 11px; }
.vxn-nav-tools .vxn-icon-btn { width: 32px; height: 32px; }
.vxn-header.is-stuck .vxn-nav-brand { max-width: 170px; margin-right: 28px; opacity: 1; visibility: visible; transition-delay: 0s; }
.vxn-header.is-stuck .vxn-nav-tools { opacity: 1; visibility: visible; transition-delay: 0s; }

/* Botón de icono (buscar) */
.vxn-icon-btn { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 0; background: transparent; border: 1px solid var(--line-strong); color: var(--ink); cursor: pointer; transition: background 150ms ease-out, border-color 150ms ease-out; }
.vxn-icon-btn:hover, .vxn-icon-btn[aria-expanded="true"] { background: var(--surface-overlay); border-color: var(--ink); }

/* Buscador: se despliega bajo la cabecera */
.vxn-search { position: absolute; left: 0; top: 100%; width: 100%; background: var(--surface-raised); border-bottom: 1px solid var(--line-strong); box-shadow: 0 24px 48px #000000a6; animation: vxn-rise 250ms cubic-bezier(.2, .7, .2, 1) both; }
.vxn-search[hidden] { display: none; }
.vxn-search-in { display: flex; gap: 12px; padding-block: 20px; }
.vxn-search input { flex: 1 1 auto; min-width: 0; height: 48px; padding: 0 16px; background: var(--surface); border: 1px solid var(--line-strong); border-radius: 0; color: var(--ink); font: 400 18px/24px var(--font-sans); }
.vxn-search input::placeholder { color: var(--ink-subtle); }
.vxn-search input:focus { border-color: var(--ink); outline: none; }
.vxn-search .vxn-btn { height: 48px; cursor: pointer; }

/* Temas del momento */
.vxn-topics { border-bottom: 1px solid var(--line); }
.vxn-topics-in { display: flex; align-items: center; gap: 8px; padding-block: 10px; overflow-x: auto; scrollbar-width: none; }
.vxn-topics-in::-webkit-scrollbar { display: none; }
.vxn-topics .vxn-label { flex: 0 0 auto; margin-right: 8px; font-size: 11px; color: var(--ink-subtle); }
.vxn-topics a { flex: 0 0 auto; display: inline-flex; align-items: center; height: 28px; padding: 0 12px; border: 1px solid var(--line); font: 600 13px/18px var(--font-sans); color: var(--ink-soft); white-space: nowrap; transition: border-color 150ms ease-out, color 150ms ease-out, background 150ms ease-out; }
.vxn .vxn-topics a:hover, .vxn .vxn-topics a[aria-current="page"] { border-color: var(--ink); color: var(--ink); background: var(--surface-raised); }

/* Secciones: el color de cada una en el menú y la más reciente en grande */
.vxn-nav-links a[class*="vxn-sec-"]::after { background: var(--sec); }
.vxn-archive { padding-top: 40px; }
.vxn-archive-head { margin-bottom: 24px; padding-bottom: 24px; }
.vxn-archive-lead { display: flex; margin-bottom: 48px; }
.vxn-archive-lead .vxn-hero-lg { min-height: 460px; }

/* Aviso de cookies: franja baja al pie en vez de un cuadro sobre la portada */
body.vxn .vxc { left: 0; right: 0; bottom: 0; width: auto; flex-direction: row; align-items: center; justify-content: center; gap: 28px; padding: 12px var(--gutter); border: 0; border-top: 1px solid var(--line-strong); box-shadow: 0 -16px 40px #00000099; }
body.vxn .vxc-copy { flex-direction: row; align-items: baseline; gap: 14px; min-width: 0; max-width: 860px; }
body.vxn .vxc .vxc-title { flex: 0 0 auto; }
body.vxn .vxc .vxc-text { font-size: 14px; line-height: 21px; }
body.vxn .vxc-actions { flex: 0 0 auto; grid-template-columns: auto auto; }
body.vxn .vxc .vxc-btn { height: 38px; padding: 0 18px; }

@media (max-width: 1180px) {
  .vxn-ticker-date time { display: none; }
}
@media (max-width: 760px) {
  /* En móvil la cabecera entera sigue fija (el menú se abre desde ella) y el idioma pasa al menú desplegado */
  .vxn-ticker-date { display: none; }
  .vxn-masthead { height: 60px; gap: 12px; }
  :root { --mast-h: 60px; }
  .vxn-masthead-right { gap: 8px; }
  .vxn-masthead-right .vxn-lang { display: none; }
  .vxn-nav-in { flex-direction: column; align-items: stretch; }
  .vxn-nav-links { flex-direction: column; gap: 0; overflow: visible; }
  .vxn-nav-brand { display: none; }
  .vxn-nav-tools { opacity: 1; visibility: visible; margin: 16px 0 0; padding: 0; }
  .vxn-nav-tools .vxn-icon-btn { display: none; }
  .vxn-nav-tools .vxn-lang a { width: 56px; height: 40px; font-size: 12px; }
  .vxn-search-in { padding-block: 14px; }
  .vxn-search .vxn-btn { padding: 0 14px; }
  .vxn-topics-in { padding-block: 8px; }
  .vxn-archive { padding-top: 24px; }
  .vxn-archive-lead { margin-bottom: 32px; }
  .vxn-archive-lead .vxn-hero-lg { min-height: 360px; }
  body.vxn .vxc { flex-direction: column; align-items: stretch; gap: 12px; padding: 14px 16px; }
  body.vxn .vxc-copy { flex-direction: column; gap: 4px; }
  body.vxn .vxc-actions { grid-template-columns: 1fr 1fr; }
  body.vxn .vxc .vxc-btn { height: 44px; }
}

/* Enlaces del conmutador de idioma dentro de la fila de secciones: no heredan el aspecto de los enlaces del menú */
.vxn .vxn-nav .vxn-lang a { flex: 0 0 auto; padding: 0; border-bottom: 0; font: 600 11px/16px var(--font-mono); letter-spacing: .08em; color: var(--ink-muted); }
.vxn .vxn-nav .vxn-lang a[aria-current="true"] { color: var(--surface); }
.vxn-nav .vxn-lang a::after, .vxn-nav .vxn-nav-brand::after { display: none; }
/* Anclas: la parte fija mide lo mismo en escritorio (cinta + secciones) y en móvil (cinta + marca) */
html { scroll-padding-top: 104px; }
.vxn-prose h2 { scroll-margin-top: 108px; }
@media (max-width: 760px) {
  /* En las filas de móvil el tiempo de lectura partía la línea en dos: basta con el "hace 2 horas" */
  .vxn-story-row .vxn-meta span { display: none; }
}