/*
Theme Name: Neuro Insights Daily
Theme URI: https://neuroinsightsdaily.com
Author: Neuro Insights Daily
Author URI: https://neuroinsightsdaily.com
Description: Tema personalizado para Neuro Insights Daily. Evidence-based neuroscience, psychology and brain health explicado a traves de investigacion confiable e insights practicos.
Version: 1.0.0
Requires at least: 6.3
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: neuro-insights
*/

body {
  font-family: 'Plus Jakarta Sans', 'Manrope', sans-serif;
}

.brain-bg {
  background-image:
    radial-gradient(ellipse 55% 75% at 78% 45%, rgba(45,115,255,0.10) 0%, transparent 60%),
    linear-gradient(115deg, #ffffff 0%, #f5f7fb 22%, #dbe4f2 38%, #7c93bb 52%, #2a3a5c 64%, #0c1526 78%, #05070d 100%);
}

.brain-visual-wrap {
  position: relative;
  width: 100%;
}

.brain-visual-wrap::before {
  content: "";
  position: absolute;
  inset: -8%;
  background: radial-gradient(ellipse 60% 60% at 46% 45%, rgba(70,140,255,0.35) 0%, rgba(40,90,200,0.14) 45%, transparent 75%);
  filter: blur(24px);
  animation: glowPulse 5s ease-in-out infinite;
  z-index: 0;
  pointer-events: none;
}

.brain-img {
  position: relative;
  z-index: 1;
  width: 100%;
  display: block;
  filter: drop-shadow(0 0 45px rgba(60,130,255,0.40)) brightness(1);
  animation: breathe 6s ease-in-out infinite, brightPulse 4.5s ease-in-out infinite;
  transform-origin: 50% 50%;
}

.brain-overlay {
  position: absolute;
  inset: 0;
  z-index: 2;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.particle {
  position: absolute;
  border-radius: 9999px;
  background: radial-gradient(circle, rgba(190,225,255,0.85) 0%, rgba(120,180,255,0) 70%);
  pointer-events: none;
  animation: particleFloat linear infinite;
  z-index: 3;
}

@keyframes breathe {
  0%, 100% { transform: translate(3%, -3%) scale(1.25); }
  50% { transform: translate(3%, -3%) scale(1.265); }
}

@keyframes brightPulse {
  0%, 100% { filter: drop-shadow(0 0 45px rgba(60,130,255,0.38)) brightness(1); }
  50% { filter: drop-shadow(0 0 62px rgba(60,130,255,0.58)) brightness(1.05); }
}

@keyframes glowPulse {
  0%, 100% { opacity: 0.55; transform: scale(1); }
  50% { opacity: 0.85; transform: scale(1.04); }
}

@keyframes particleFloat {
  0% { transform: translateY(0) translateX(0); opacity: 0; }
  12% { opacity: 0.75; }
  88% { opacity: 0.4; }
  100% { transform: translateY(-36px) translateX(5px); opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .brain-img, .brain-visual-wrap::before, .particle, .impulse-dot animateMotion {
    animation: none !important;
  }
}

/* ============================================================
   Articles Hero - ilustracion integrada (no una imagen colocada)
   ============================================================
   La ilustracion NO es una etiqueta <img> ni vive en un contenedor
   creado para mostrarla: se pinta como parte del fondo del propio
   contenedor de columna del grid, en varias capas que se mezclan entre
   si (igual filosofia que el cerebro de la Home):
     1) gradiente principal del Hero (ya definido en el <section>)
     2) neblina azul + iluminacion ambiental que emana del nucleo (::before)
     3) ilustracion + overlay de color, en un solo background-image
        multicapa (::after), recortada con una mascara muy amplia y
        gradual para que la transicion hacia el fondo sea larga y
        progresiva: no existe ningun borde, rectangulo ni limite
        perceptible. Nace mas alla del borde derecho del Hero y se
        disuelve mucho antes de llegar al texto.
     4) particulas a distintas profundidades (elementos independientes)
   Efectos permitidos unicamente: respiracion muy sutil, iluminacion
   ambiental extremadamente tenue, particulas discretas y soporte
   prefers-reduced-motion. */

.articles-hero-illustration {
  position: relative;
}

/* Capa 2: iluminacion localizada que nace unicamente del nucleo de la
   neurona. Radio pequeño, opacidad baja: no ilumina el resto de la
   ilustracion, es solo el punto de luz del propio nucleo mezclandose
   con el fondo. */
/* Capa 2: atmosfera luminosa azul detras de la neurona. NO es un unico
   radial-gradient circular: son 4 capas superpuestas, cada una con un
   radio, forma (elipse) y centro ligeramente distintos, para que el
   conjunto se sienta como una nube de luz organica y no como un halo
   artificial. Progresion de color de cada capa (centro -> exterior):
   azul intenso saturado -> azul brillante -> azul medio -> azul muy
   claro -> casi blanco -> transparente. Las 4 capas comparten el mismo
   punto de origen aproximado (junto al nucleo, 58% 42%) pero se
   desplazan levemente hacia la derecha/abajo en cada capa sucesiva,
   de forma que la luz se expande en las 4 direcciones (arriba, abajo,
   izquierda, derecha) con una ligera preferencia hacia la derecha,
   donde vive la neurona. El blur generoso funde las 4 capas entre si
   y con el degradado del propio Hero, sin que se perciba ningun
   circulo ni borde. */
/* Capa 2: resplandor ambiental secundario y muy sutil. Ya NO es el
   mecanismo principal de integracion (ese ahora es el drop-shadow
   sensible a la silueta real de la Capa 3, mas el lienzo enriquecido
   de la seccion). Se mantiene aqui, reducido, solo como refuerzo
   atmosferico adicional y porque sostiene la animacion del pulso del
   nucleo (articlesCorePulse). */
.articles-hero-illustration::before {
  content: "";
  position: absolute;
  top: -30%;
  right: -25%;
  bottom: -30%;
  left: -18%;
  background-image: radial-gradient(ellipse 40% 42% at 60% 44%, rgba(80,135,230,0.16) 0%, rgba(120,160,240,0.08) 45%, transparent 75%);
  filter: blur(38px);
  animation: articlesGlowPulse 7s ease-in-out infinite, articlesCorePulse 7s ease-in-out infinite;
  z-index: 0;
  pointer-events: none;
}

/* Capa 3: la nueva ilustracion (var(--articles-hero-neuron-bg)), un PNG
   con transparencia real reconstruida a partir del archivo original del
   usuario. Ya NO se necesita mask-image: la propia transparencia del
   PNG resuelve el "sin bordes visibles" de forma nativa, sin depender
   de una mascara CSS aproximada. background-size:contain muestra la
   ilustracion completa sin recortar ninguna dendrita. */
/* Capa 3: la ilustracion. El TAMAÑO ahora se controla mediante width/
   height con clamp() (piso y techo en px, preferencia fluida en vw) en
   lugar de depender unicamente de los 4 insets porcentuales + 
   background-size:contain. Esto evita que la neurona pierda presencia
   en viewports/zooms mas pequeños: el piso de clamp() garantiza un
   tamaño minimo, y el techo evita que crezca de mas en pantallas muy
   anchas. El punto de anclaje (top/left) y el background-position
   (58% 42%, donde vive el nucleo) NO se tocaron: la posicion visual
   del nucleo se mantiene identica.
   Se añadio ademas una mascara radial centrada en el nucleo: el centro
   (nucleo + dendritas cercanas) permanece completamente nitido, y los
   bordes superior, inferior y derecho se desvanecen progresivamente
   hacia el degradado del Hero en vez de cortarse en seco. */
.articles-hero-illustration::after {
  content: "";
  position: absolute;
  top: -18%;
  left: -12%;
  width: 900px;
  width: clamp(750px, 68vw, 1050px);
  height: 700px;
  background-repeat: no-repeat;
  background-position: 58% 42%;
  background-size: 1050px 700px;
  filter: drop-shadow(0 0 35px rgba(70,130,225,0.45)) drop-shadow(0 0 70px rgba(90,150,240,0.28)) drop-shadow(0 0 130px rgba(110,165,245,0.16));
  animation: articlesBreathe 7.5s ease-in-out infinite;
  transform-origin: 58% 42%;
  z-index: 1;
  pointer-events: none;
}

/* Capa 4: particulas a distintas profundidades. Opacidad aumentada
   respecto a la version anterior (donde eran practicamente imper-
   ceptibles); z-index por encima de la ilustracion para garantizar que
   nunca queden ocultas detras del PNG. */
.articles-hero-particle {
  position: absolute;
  border-radius: 9999px;
  background: radial-gradient(circle, rgba(255,255,255,0.95) 0%, rgba(120,165,240,0.55) 45%, rgba(120,165,240,0) 78%);
  pointer-events: none;
  animation: articlesParticleFloat linear infinite;
  z-index: 2;
}

/* Destellos neuronales: pequeños impulsos blancos con tono azul muy
   suave que aparecen y desaparecen lentamente sobre distintos puntos
   de las ramas principales (nunca todos a la vez: cada uno tiene su
   propia duracion/retraso). z-index por encima de particulas e
   ilustracion para que siempre se vean sobre las dendritas. */
.articles-hero-spark {
  position: absolute;
  width: 9px;
  height: 9px;
  border-radius: 9999px;
  background: radial-gradient(circle, rgba(255,255,255,1) 0%, rgba(130,175,245,0.85) 45%, rgba(130,175,245,0) 78%);
  pointer-events: none;
  animation: articlesSparkFlicker ease-in-out infinite;
  z-index: 3;
}

/* Respiracion: escala 1 -> 1.015 en 7.5s (sin cambios de amplitud
   respecto a la version aprobada; solo se ajusto la duracion dentro
   del rango 7-8s pedido en una iteracion anterior). */
@keyframes articlesBreathe {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.015); }
}

/* Glow ambiental: intensidad reducida respecto a la version anterior,
   para que se sienta como luz que emana del nucleo y no como un
   efecto CSS añadido. */
@keyframes articlesGlowPulse {
  0%, 100% { opacity: 0.42; }
  50% { opacity: 0.62; }
}

/* Pulso del nucleo: sube y baja unicamente la intensidad de la capa de
   glow (ya posicionada exactamente sobre el nucleo), sin tocar la
   imagen de la neurona. Se combina con articlesGlowPulse (arriba, que
   anima "opacity") animando una propiedad distinta ("filter") para que
   ambas convivan en la misma capa sin interferirse. +10% de brillo,
   dentro del rango 8-12% solicitado. */
@keyframes articlesCorePulse {
  0%, 100% { filter: blur(28px) brightness(1); }
  50% { filter: blur(28px) brightness(1.10); }
}

@keyframes articlesParticleFloat {
  0% { transform: translateY(0); opacity: 0; }
  20% { opacity: 0.85; }
  80% { opacity: 0.42; }
  100% { transform: translateY(-20px); opacity: 0; }
}

/* Variedad de movimiento entre las particulas ya existentes (sin
   añadir ningun elemento nuevo): algunas suben, otras bajan, otras se
   desplazan en diagonal, y algunas apenas se mueven. Se distribuyen
   por posicion (nth-child) sobre los mismos 16 elementos del HTML, de
   modo que el conjunto no se mueve de forma uniforme. */
@keyframes articlesParticleFloatDown {
  0% { transform: translateY(0); opacity: 0; }
  20% { opacity: 0.8; }
  80% { opacity: 0.4; }
  100% { transform: translateY(18px); opacity: 0; }
}

@keyframes articlesParticleFloatDiagonal {
  0% { transform: translate(0, 0); opacity: 0; }
  20% { opacity: 0.78; }
  80% { opacity: 0.38; }
  100% { transform: translate(10px, -14px); opacity: 0; }
}

@keyframes articlesParticleFloatStill {
  0%, 100% { transform: translateY(0); opacity: 0.36; }
  50% { transform: translateY(-4px); opacity: 0.6; }
}

.articles-hero-particle:nth-child(4n+1) { animation-name: articlesParticleFloat; }
.articles-hero-particle:nth-child(4n+2) { animation-name: articlesParticleFloatDown; }
.articles-hero-particle:nth-child(4n+3) { animation-name: articlesParticleFloatDiagonal; }
.articles-hero-particle:nth-child(4n+4) { animation-name: articlesParticleFloatStill; }

/* Destello neuronal: aparece, brilla muy suavemente y se apaga dentro
   del primer ~25% del ciclo; el resto del tiempo permanece invisible
   (inactivo), de forma que -con duraciones y retrasos distintos por
   destello- nunca laten todos a la vez ni de forma sincronizada. */
@keyframes articlesSparkFlicker {
  0% { opacity: 0; transform: scale(0.6); }
  10% { opacity: 1; transform: scale(1.05); }
  22% { opacity: 0.65; transform: scale(0.95); }
  40% { opacity: 0.3; transform: scale(0.85); }
  65% { opacity: 0; transform: scale(0.6); }
  100% { opacity: 0; transform: scale(0.6); }
}

@media (prefers-reduced-motion: reduce) {
  .articles-hero-illustration::before,
  .articles-hero-illustration::after,
  .articles-hero-particle,
  .articles-hero-spark {
    animation: none !important;
  }
}

/* ============================================================
   Articles Hero - escalado fluido entre resoluciones de escritorio
   ============================================================
   No se toco el HTML: este bloque se dirige unicamente al contenedor
   grid del Hero de Articles mediante un selector de atributo sobre su
   gradiente de fondo (unico en todo el tema), sin afectar a ningun
   otro elemento del sitio ni a la Home.

   Los valores fijos en px de Tailwind (min-h-[560px], px-8, py-16,
   gap-10) se sustituyen por clamp() equivalentes: el piso y el techo
   coinciden exactamente con los valores aprobados (400-560px de
   altura minima, 32px de padding horizontal, 64px de padding vertical,
   40px de espacio entre columnas), por lo que en los extremos del
   rango (>=~1550px o <=~1024px) el resultado visual es identico al ya
   aprobado; entre esos extremos, la transicion es continua y gradual
   en lugar de saltar entre valores fijos. La mascara y el
   background-size:cover de la ilustracion ya usaban porcentajes
   relativos a esta misma caja, asi que heredan el escalado fluido de
   forma automatica, sin necesidad de tocar ninguna otra regla. */
section[style*="9fb7e6"] > div {
  min-height: clamp(400px, 36vw, 560px) !important;
  padding-left: clamp(20px, 2.2vw, 32px) !important;
  padding-right: clamp(20px, 2.2vw, 32px) !important;
  padding-top: clamp(40px, 4.5vw, 64px) !important;
  padding-bottom: clamp(40px, 4.5vw, 64px) !important;
  column-gap: clamp(24px, 2.8vw, 40px) !important;
  row-gap: clamp(24px, 2.8vw, 40px) !important;
}

/* ============================================================
   Articles Hero - lienzo enriquecido (nueva arquitectura de
   integracion, diagnostico: el problema no era la capa de brillo
   sino el rango tonal del propio fondo de la seccion)
   ============================================================
   El fondo original recorria solo 5 paradas dentro de una banda muy
   estrecha de azul pastel (nunca se alejaba de tonos muy claros). La
   ilustracion de la neurona tiene los bordes de sus propias dendritas
   desvaneciendose hacia tonos claros/blancos (no hacia negro, a
   diferencia del cerebro de la Home). Por eso el lienzo se enriquece
   dentro de la MISMA familia de azules -mas recorrido, mas saturacion
   progresiva hacia la derecha- en lugar de oscurecerse hacia negro:
   asi el fondo tiene un destino de color real dentro del cual los
   bordes de la ilustracion pueden desvanecerse, igual que el cerebro
   de la Home se funde con su propio fondo oscuro. El lado izquierdo
   (donde vive el texto) permanece identico (blanco/muy claro) para
   no afectar la legibilidad. */
section[style*="9fb7e6"] {
  background: linear-gradient(120deg, #ffffff 0%, #f2f6fd 18%, #dce8fb 34%, #b8cef2 50%, #86aee8 66%, #5686d6 80%, #3a68bf 92%, #2c54a8 100%) !important;
}

/* ============================================================
   BLOQUES EDITORIALES (neuro-block)
   ============================================================
   Estilos para los 10 bloques dinamicos del tema. Estos estilos
   funcionan tanto en el frontend como en el editor de bloques
   (se cargan via add_editor_style en functions.php). Cada bloque
   usa el prefijo neuro-block y sigue el sistema de diseno del tema:
   colores #0F172A / #2D73FF, bordes redondeados, tipografia Plus
   Jakarta Sans / Manrope.
   ============================================================ */

.neuro-block {
  margin: 1.5rem 0;
  padding: 1.5rem;
  border-radius: 1rem;
  font-family: 'Plus Jakarta Sans', 'Manrope', sans-serif;
  line-height: 1.6;
  color: #334155;
  font-size: 15px;
}

.neuro-block .neuro-block__eyebrow {
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #2D73FF;
  margin-bottom: 0.5rem;
}

.neuro-block .neuro-block__title {
  font-size: 18px;
  font-weight: 700;
  color: #0F172A;
  margin: 0 0 0.5rem 0;
  line-height: 1.3;
}

.neuro-block .neuro-block__title.is-large {
  font-size: 22px;
}

.neuro-block .neuro-block__text {
  margin: 0;
  color: #334155;
}

.neuro-block .neuro-block__list {
  margin: 0.5rem 0 0 0;
  padding-left: 1.25rem;
  list-style: disc;
}

.neuro-block .neuro-block__list-item {
  margin-bottom: 0.4rem;
  color: #334155;
}

.neuro-block .neuro-block__cta {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  margin-top: 0.75rem;
  font-size: 14px;
  font-weight: 600;
  color: #2D73FF;
  text-decoration: none;
}

.neuro-block .neuro-block__cta:hover {
  color: #1e5fe0;
}

/* --- Clinical Insight --- */
.neuro-block-clinical-insight {
  background: #f0f5ff;
  border-left: 3px solid #2D73FF;
}

/* --- Key Takeaways --- */
.neuro-block-key-takeaways {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
}
.neuro-block-key-takeaways .neuro-block__list {
  list-style: none;
  padding-left: 0;
}
.neuro-block-key-takeaways .neuro-block__list-item {
  position: relative;
  padding-left: 1.5rem;
}
.neuro-block-key-takeaways .neuro-block__list-item::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.55em;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #2D73FF;
}

/* --- Myth vs Fact --- */
.neuro-block-myth-vs-fact {
  display: grid;
  gap: 0.75rem;
  padding: 0;
  overflow: hidden;
  border: 1px solid #e2e8f0;
}
.neuro-block-myth-vs-fact .neuro-block__myth,
.neuro-block-myth-vs-fact .neuro-block__fact {
  padding: 1rem 1.5rem;
}
.neuro-block-myth-vs-fact .neuro-block__myth {
  background: #fef2f2;
}
.neuro-block-myth-vs-fact .neuro-block__fact {
  background: #f0fdf4;
}
.neuro-block-myth-vs-fact .neuro-block__label {
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 2px 10px;
  border-radius: 9999px;
  margin-bottom: 0.4rem;
}
.neuro-block-myth-vs-fact .neuro-block__myth .neuro-block__label {
  background: #fee2e2;
  color: #b91c1c;
}
.neuro-block-myth-vs-fact .neuro-block__fact .neuro-block__label {
  background: #dcfce7;
  color: #15803d;
}

/* --- Did You Know --- */
.neuro-block-did-you-know {
  background: #fefce8;
  border-left: 3px solid #eab308;
}

/* --- Quote --- */
.neuro-block-quote {
  background: #f8fafc;
  border-left: 4px solid #2D73FF;
  padding: 1.5rem 1.75rem;
}
.neuro-block-quote .neuro-block__text {
  font-size: 18px;
  font-style: italic;
  color: #0F172A;
  font-weight: 500;
  line-height: 1.5;
}
.neuro-block-quote .neuro-block__citation {
  display: block;
  margin-top: 0.75rem;
  font-size: 14px;
  font-weight: 600;
  color: #64748b;
  font-style: normal;
}

/* --- Warning --- */
.neuro-block-warning {
  background: #fff7ed;
  border-left: 3px solid #f97316;
}
.neuro-block-warning .neuro-block__title {
  color: #c2410c;
}

/* --- Evidence Box --- */
.neuro-block-evidence-box {
  background: #f0f9ff;
  border: 1px solid #bae6fd;
}
.neuro-block-evidence-box .neuro-block__media {
  margin-top: 0.75rem;
  border-radius: 0.5rem;
  overflow: hidden;
}
.neuro-block-evidence-box .neuro-block__media img {
  display: block;
  width: 100%;
  height: auto;
}

/* --- Research Card --- */
.neuro-block-research-card {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  box-shadow: 0 1px 3px rgba(0,0,0,0.06);
}
.neuro-block-research-card.has-image {
  display: grid;
  grid-template-columns: 120px 1fr;
  gap: 1rem;
  align-items: start;
}
.neuro-block-research-card .neuro-block__media {
  border-radius: 0.5rem;
  overflow: hidden;
}
.neuro-block-research-card .neuro-block__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  max-height: 120px;
}
.neuro-block-research-card .neuro-block__body {
  min-width: 0;
}
.neuro-block-research-card .neuro-block__source {
  display: inline-block;
  margin-top: 0.5rem;
  font-size: 13px;
  font-weight: 600;
  color: #2D73FF;
  text-decoration: none;
}
.neuro-block-research-card .neuro-block__source:hover {
  color: #1e5fe0;
}

/* --- Reference List --- */
.neuro-block-reference-list {
  background: #f8fafc;
  border-top: 2px solid #2D73FF;
}
.neuro-block-reference-list .neuro-block__title {
  font-size: 20px;
}
.neuro-block-reference-list .neuro-block__list {
  list-style: none;
  padding-left: 0;
  counter-reset: neuro-ref;
}
.neuro-block-reference-list .neuro-block__reference {
  counter-increment: neuro-ref;
  position: relative;
  padding-left: 2rem;
  margin-bottom: 0.75rem;
  font-size: 14px;
  color: #475569;
  line-height: 1.5;
}
.neuro-block-reference-list .neuro-block__reference::before {
  content: counter(neuro-ref);
  position: absolute;
  left: 0;
  top: 0;
  width: 1.25rem;
  height: 1.25rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 700;
  color: #2D73FF;
  background: #dbeafe;
  border-radius: 50%;
}
.neuro-block-reference-list .neuro-block__ref-title {
  color: #0F172A;
  font-weight: 600;
}
.neuro-block-reference-list .neuro-block__ref-title a {
  color: #2D73FF;
  text-decoration: none;
}
.neuro-block-reference-list .neuro-block__ref-title a:hover {
  text-decoration: underline;
}
.neuro-block-reference-list .neuro-block__ref-authors,
.neuro-block-reference-list .neuro-block__ref-publication,
.neuro-block-reference-list .neuro-block__ref-year {
  color: #64748b;
}
.neuro-block-reference-list .neuro-block__ref-publication {
  font-style: italic;
}

/* --- Editor panel styles --- */
.neuro-editorial-panel .components-base-control {
  margin-bottom: 12px;
}
.neuro-pdf-upload .components-base-control__field {
  margin: 0;
}

/* --- Article content (single.php) --- */
.neuro-article-content {
  font-family: 'Plus Jakarta Sans', 'Manrope', sans-serif;
  font-size: 16px;
  line-height: 1.7;
  color: #334155;
}
.neuro-article-content p {
  margin-bottom: 1.25rem;
}
.neuro-article-content h2 {
  font-size: 26px;
  font-weight: 700;
  color: #0F172A;
  margin: 2rem 0 1rem;
}
.neuro-article-content h3 {
  font-size: 20px;
  font-weight: 700;
  color: #0F172A;
  margin: 1.5rem 0 0.75rem;
}
.neuro-article-content ul,
.neuro-article-content ol {
  margin-bottom: 1.25rem;
  padding-left: 1.5rem;
}
.neuro-article-content li {
  margin-bottom: 0.5rem;
}
.neuro-article-content a {
  color: #2D73FF;
  text-decoration: underline;
}
.neuro-article-content a:hover {
  color: #1e5fe0;
}
.neuro-article-content blockquote {
  border-left: 4px solid #2D73FF;
  padding: 0.75rem 1.25rem;
  margin: 1.5rem 0;
  background: #f8fafc;
  border-radius: 0 0.5rem 0.5rem 0;
  font-style: italic;
}
.neuro-article-content img {
  border-radius: 0.75rem;
  max-width: 100%;
  height: auto;
}

/* --- Pagination --- */
.nav-links .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  height: 40px;
  padding: 0 8px;
  margin: 0 2px;
  border-radius: 9999px;
  font-size: 14px;
  font-weight: 600;
  color: #334155;
  text-decoration: none;
  transition: all 0.2s;
}
.nav-links .page-numbers.current {
  background: #2D73FF;
  color: #fff;
}
.nav-links .page-numbers:not(.current):hover {
  background: #e2e8f0;
  color: #2D73FF;
}