.close-icon.rw-offcanvas__close{
	cursor: pointer;
}

/* --- FILTROS: Estado contraído por defecto para evitar flash de contenido expandido --- */
/* Por defecto: mostrar todos los botones (antes de que JS actúe) */
.rw-journals-grid-categories-list-button {
	display: inline-flex;
}

/* Estado compacto: ocultar botones no seleccionados (cuando JS agrega la clase compact) */
.rw-journals-grid-categories-list-wrapper.compact .rw-journals-grid-categories-list-button:not(.selected) {
	display: none !important;
}

/* Estado expandido: mostrar todos los botones */
.rw-journals-grid-categories-list-wrapper.expanded .rw-journals-grid-categories-list-button {
	display: inline-flex !important;
}

/* Etiqueta de filtros: fuente y peso */
.rw-filters-label {
	font-family: "NeueHelveticaPro55Roman", Arial, sans-serif !important;
	font-weight: 600 !important;
	text-transform: uppercase;
	font-size:11px;
	
	color: #F5333F;
    cursor: pointer;
	padding: 5px 0px 2px;
}

/* Ajuste: imagen de publicaciones a 120px de ancho */
.rw-journal-image {
	/* ancho fijo; altura auto para mantener proporción */
	width: 120px;
	height: auto;
	flex-shrink: 0;
	opacity: 0;
	visibility: hidden;
	transform: translateX(-8px);
	border: 1px solid #F5333F;
	box-sizing: border-box;
	
}

.rw-journal-img {
	/* asegurar que la img ocupe el contenedor y se recorte correctamente */
	width: 100%;
	height: auto;
	max-width: 120px;
	object-fit: cover;
	border-radius: 4px;
	display: block;
}

/* Selector más específico para evitar ser sobreescrito por estilos externos */
.elementor-widget-rw-journal-grid-filters .rw-journal-image {
	width: 120px !important;
	height: auto !important;
}

.elementor-widget-rw-journal-grid-filters .rw-journal-img {
	width: 100% !important;
	height: auto !important;
	max-width: 120px !important;
	object-fit: cover !important;
}

/* Asegurar layout flex y control de orden visual */
.rw-journal-item {
    position: relative;
    display: block; /* dejamos layout por defecto, el contenido controla el flujo */
    align-items: flex-start;
    gap: 15px;
	color:#000;
}

/* Imagen fuera del flujo, a la derecha; solo transición de opacidad (sin transform que desplace) */
.rw-journal-image {
    position: absolute;
    right: -30px;
    top: 0;
    transform: none; /* alineada al top del item */
    width: 120px;
    height: auto;
    opacity: 0;
    visibility: hidden;
   
    z-index: 2;
}

/* Imagen interna */
.rw-journal-img {
    width: 100%;
    height: auto;
    object-fit: cover;
    border-radius: 4px;
    display: block;
}

/* Contenedor de texto: ocupar todo el ancho para que hover funcione en todo el bloque */
.rw-journal-content {
    display: block;
    width: 100%;
    padding-right: 0;
    box-sizing: border-box;
	
    /* NO transition en padding para evitar animación de desplazamiento */
}

/* Mostrar imagen al hacer hover sobre TODO el bloque de texto (sin animación de desplazamiento) */
.rw-journal-content:hover + .rw-journal-image,
.rw-journal-content:focus + .rw-journal-image {
    opacity: 1;
    visibility: visible;
    /* sin transform que provoque desplazamiento */
}

/* Al hacer hover, añadir espacio a la derecha INSTANTÁNEAMENTE (sin transición) */
.rw-journal-content:hover,
.rw-journal-content:focus {
    padding-right: 140px; /* ancho imagen + gap actualizado */
}

/* Off-canvas: panel a la derecha con altura completa */
.rw-offcanvas-backdrop {
	position: fixed;
	inset: 0;
	background: transparent !important; /* backdrop transparente */
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: none;
	z-index: 1199; /* por debajo del panel */
}

/* Offcanvas: estado base (escritorio: entra/sale por la derecha) */
.rw-offcanvas {
	position: fixed;
	top: 0;
	right: 0;
	/* Ajuste responsive: por defecto usar 35vw; en pantallas >=1280px se aplicará 38vw más abajo */
	width: 35vw;
	min-width: 280px;
	height: 100vh;
	background: #F5333F;
    
	/* por defecto cerrada (fuera a la derecha) - SIN fade de opacidad */
	transform: translateX(100%);
	opacity: 1; /* siempre sólido */
	visibility: hidden;
	pointer-events: none;
	transition: transform 1.1s cubic-bezier(.2,.8,.2,1), visibility 0s linear 1.1s;
	z-index: 1200; /* por encima del header */
	display: flex;
	flex-direction: column;
	overflow: hidden;
	padding: 100px 20px 60px 20px;
	box-sizing: border-box;
}

/* En pantallas anchas (>=1280px) usar 38vw como solicitó el usuario */
@media (min-width: 1280px) {
	.rw-offcanvas {
		width: 38vw;
	}
}

/* Estado abierto — mismo selector para todas las resoluciones */
.rw-offcanvas.rw-offcanvas--open {
	transform: translateX(0);
	opacity: 1; /* siempre sólido */
	visibility: visible;
	pointer-events: auto;
	transition: transform 1.1s cubic-bezier(.2,.8,.2,1), visibility 0s;
}

/* Backdrop cuando está abierto */
.rw-offcanvas-backdrop.rw-offcanvas--open {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transition: none;
}

/* --- AJUSTE: al cerrar solo animar transform, mantener opacidad 1 (color sólido) --- */
.rw-offcanvas.rw-offcanvas--open.rw-offcanvas--closing {
    transform: translateX(100%);
    opacity: 1; /* siempre sólido, sin fade */
    transition: transform 1.1s cubic-bezier(.2,.8,.2,1);
}

/* Backdrop cierre: mantener transparente */
.rw-offcanvas-backdrop.rw-offcanvas--open.rw-offcanvas--closing {
    opacity: 0;
    transition: none;
}

/* Off-canvas: panel a la derecha (sección duplicada - mantener para compatibilidad) */
.rw-offcanvas-backdrop {
	position: fixed;
	inset: 0;
	background: transparent !important; /* backdrop transparente */
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	
	z-index: 1199; /* por debajo del panel */
}

/* Offcanvas: estado base (escritorio: entra/sale por la derecha) */
.rw-offcanvas {
	position: fixed;
	top: 0;
	right: 0;
	width: 38vw;
	min-width: 280px;
	height: 100vh;
	background: #F5333F;

	/* por defecto cerrada (fuera a la derecha) - SIN fade de opacidad */
	transform: translateX(100%);
	opacity: 1; /* siempre sólido */
	visibility: hidden;
	pointer-events: none;
	transition: transform 1.1s cubic-bezier(.2,.8,.2,1), visibility 0s linear 1.1s;
	z-index: 1200; /* por encima del header */
	display: flex;
	flex-direction: column;
	overflow: hidden;
	padding: 100px 20px 60px 20px;
	box-sizing: border-box;
}

/* Estado abierto — mismo selector para todas las resoluciones */
.rw-offcanvas.rw-offcanvas--open {
	transform: translateX(0);
	opacity: 1; /* siempre sólido */
	visibility: visible;
	pointer-events: auto;
	transition: transform 1.1s cubic-bezier(.2,.8,.2,1), visibility 0s;
}

/* Backdrop cuando está abierto */
.rw-offcanvas-backdrop.rw-offcanvas--open {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transition: none;
}

/* --- AJUSTE: al cerrar solo animar transform, mantener opacidad 1 (color sólido) --- */
.rw-offcanvas.rw-offcanvas--open.rw-offcanvas--closing {
    transform: translateX(100%);
    opacity: 1; /* siempre sólido, sin fade */
    transition: transform 1.1s cubic-bezier(.2,.8,.2,1);
}

/* Backdrop cierre: mantener transparente */
.rw-offcanvas-backdrop.rw-offcanvas--open.rw-offcanvas--closing {
    opacity: 0;
    transition: none;
}
.rw-group__heading{
	font-family: "NeueHelveticaPro55Roman", Arial, sans-serif;
	font-size: 14px;
	font-weight: bold;
	margin-bottom:4px;
}
/* RESPONSIVE: en tablet/ móvil (<=1024px) usar entrada/salida por abajo (Y axis) y ocupar 100vw */
@media (max-width: 1024px) {
	.rw-offcanvas {
		left: 0;
		right: 0;
		top: auto;
		bottom: 0;
		width: 100vw !important;
		min-width: 0 !important;
		/* estado cerrado: por debajo - SIN fade de opacidad */
		transform: translateY(100%);
		opacity: 1 !important; /* siempre sólido */
		visibility: hidden;
		pointer-events: none;
		transition: transform 1.1s cubic-bezier(.2,.8,.2,1), visibility 0s linear 1.1s;
		z-index: 1200 !important;
	}
	.rw-offcanvas.rw-offcanvas--open {
		transform: translateY(0) !important;
		opacity: 1 !important; /* siempre sólido */
		visibility: visible !important;
		pointer-events: auto !important;
		transition: transform 1.1s cubic-bezier(.2,.8,.2,1), visibility 0s;
	}

	/* asegurar backdrop por debajo del panel */
	.rw-offcanvas-backdrop {
		z-index: 1199 !important;
	}
}
@media (max-width: 1024px) {
    .rw-offcanvas.rw-offcanvas--open.rw-offcanvas--closing {
        transform: translateY(100%) !important;
        opacity: 1 !important; /* siempre sólido, sin fade */
        visibility: hidden !important;
        transition: transform 1.1s cubic-bezier(.2,.8,.2,1) !important;
    }
}
.rw-offcanvas-backdrop.rw-offcanvas--open.rw-offcanvas--closing {
    opacity: 0;
    visibility: hidden;
    transition: opacity 1.1s ease, visibility 0s linear 1.1s;
}

/* Header y título dentro del off-canvas: fila horizontal */
.rw-offcanvas__header {
    display: flex;
    align-items: flex-start; /* alinear título y botón de cierre al top */
    justify-content: space-between;
    gap: 12px;
    margin: 0 0 0 0; /* eliminar espacio inferior extra */
    border-bottom: none;
    background: transparent;
	width:100%;
}

/* Título: color claro sobre fondo rojo */
.rw-offcanvas__title {
    margin: 0;
     font-family: "NeueHelveticaPro63ExtendedMedium", Arial, sans-serif;
    font-size: 36px !important;     
    font-weight: 500;     
    
	 color: rgb(255, 255, 255)!important;
}
@media (max-width: 1280px){
	.rw-offcanvas__title {
		font-size: 29px !important;
	}
}

/* Fuente de la publicación: 14px */
.rw-offcanvas__meta-fuente {
    font-family: "Helvetica Neue", Arial, sans-serif !important; /* cambiado */
    font-weight: 400;    /* regular */
    color: rgb(255, 255, 255);
    font-size: 16px !important; 
    line-height: 16px !important; 
}

/* Mes y año: 14px */
.rw-offcanvas__meta-fecha {
    font-family: "Helvetica Neue", Arial, sans-serif !important; /* cambiado */
    font-weight: 400;    /* regular */
    color: rgb(255, 255, 255);
    font-size: 14px !important; /* 14px */
    line-height: 21px !important; /* 21px */
}

/* Descripción: 14px */
.rw-offcanvas__descripcion {
    font-family: "Helvetica Neue", Arial, sans-serif !important; /* cambiado */
    font-weight: 400;    /* regular */
    color: rgb(255, 255, 255);
    line-height: 18px !important; /* cambiado a 21px */
    flex: 0 0 auto;
    width: 100%;
    box-sizing: border-box;
    font-size: 14px !important; /* 14px */
}

/* Enlaces dentro del contenido del offcanvas: negro, hover blanco */
.rw-offcanvas__descripcion a,
.rw-offcanvas__descripcion a:visited {
	color: #000000 !important;
}

.rw-offcanvas__descripcion a:hover,
.rw-offcanvas__descripcion a:focus,
.rw-offcanvas__descripcion a:active {
	color: #ffffff !important;
}

/* Body del panel: texto claro y SIN scroll (el scroll lo gestiona la imagen) */
.rw-offcanvas__body {
    padding: 0;
    color: #ffffff;
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
	width:100%;
    /* IMPORTANTE: no permitir scroll aquí */
    overflow: visible;
}

/* Contenedor inner: eliminar padding-bottom y pseudo-elemento; solo ocupa el espacio disponible */
.rw-offcanvas__content-inner {
    margin-top: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
    flex: 1 1 auto;
    min-height: 0;
    box-sizing: border-box;
}

/* Pseudo-elemento final: ANULADO — ya no es necesario porque el scroll lo gestiona .rw-offcanvas__details */
.rw-offcanvas__content-inner::after {
    content: none !important; /* anular el pseudo-elemento */
    display: none !important;
}

/* Fila 2: dos columnas (50% cada una) */
.rw-offcanvas__meta-row {
    display: flex;
    gap: 12px;
    margin-top: 4px;    /* espacio de 4px entre header y esta fila */
    margin-bottom: 18px;
}
.rw-offcanvas__meta-row > .rw-offcanvas__meta-col {
    width: 50%;
    box-sizing: border-box;
    text-align: left; /* cambiado a izquierda */
    display: flex;
    align-items: center;
    justify-content: flex-start;
    /* asegurar que el contenido interno ocupe todo el ancho de la columna */
}
.rw-offcanvas__meta-row > .rw-offcanvas__meta-col > * {
    width: 100%;
    box-sizing: border-box;
}

/* Fila 3: detalles verticales. ESTE contenedor ahora controla el scroll */
.rw-offcanvas__details {
    display: flex;
    flex-direction: column;
    gap: 12px;
    /* ocupar todo el espacio vertical disponible y gestionar scroll */
    flex: 1 1 auto;
    min-height: 0; /* importante para que flex-children con overflow funcionen */
    overflow-y: auto; /* scroll vertical aquí (antes estaba en imagen-wrapper) */
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    max-height: calc(100vh - 270px); /* ajustar según paddings/headers */
}

/* Ocultar la barra de scroll visualmente en .rw-offcanvas__details */
/* WebKit (Chrome, Safari) */
.rw-offcanvas__details::-webkit-scrollbar {
    width: 0;
    height: 0;
}
/* Firefox */
.rw-offcanvas__details {
    scrollbar-width: none;
}
/* IE / Edge Legacy */
.rw-offcanvas__details {
    -ms-overflow-style: none;
}

/* Descripción: ahora NO scrollea individualmente, forma parte del flujo scrollable de .rw-offcanvas__details */
.rw-offcanvas__descripcion {
    color: rgba(255,255,255,0.95);
    line-height: 1.45;
    flex: 0 0 auto; /* tamaño automático según contenido */
    width: 100%;
    box-sizing: border-box;
}

/* Wrapper de la imagen: YA NO tiene scroll individual, solo contiene la imagen */
.rw-offcanvas__imagen-wrapper {
    flex: 0 0 auto; /* tamaño automático según contenido, sin scroll propio */
    overflow: visible; /* quitar scroll individual */
    width: 100%;
    box-sizing: border-box;
}

/* Ocultar títulos en el listado cuando estamos en la agrupación "por título" */
.rw-group--title .rw-journal-title {
	display: none !important;
}

/* --- Ajustes: imagen más pequeña y alineada al top --- */

/* tamaño base de la imagen en los items (reducida a 120px) */
.rw-journal-image {
	/* ancho fijo; altura auto para mantener proporción */
	width: 120px;
	height: auto;
	flex-shrink: 0;
	opacity: 0;
	visibility: hidden;
	/* alineada al top en vez de centrada verticalmente */
	top: 0;
	transform: none;
}

/* ajustar el tamaño máximo de la img interna */
.rw-journal-img {
	/* asegurar que la img ocupe el contenedor y se recorte correctamente */
	width: 100%;
	height: auto;
	max-width: 120px;
	object-fit: cover;
	border-radius: 4px;
	display: block;
}

/* selector específico del widget */
.elementor-widget-rw-journal-grid-filters .rw-journal-image,
.elementor-widget-rw-journal-by-year .rw-journal-image {
	width: 120px !important;
	height: auto !important;
}

/* cuando se reservaba espacio en hover: reducir padding-right acorde al nuevo ancho (120px + gap 20px = 140px) */
.rw-journal-content:hover,
.rw-journal-content:focus {
	padding-right: 140px; /* actualizado para evitar solapamiento */
}

/* Para las reglas de overlay que movían la imagen "fuera" del contenedor, ajustar desplazamiento y alineación al top */
.elementor-widget-rw-journal-grid-filters .rw-journal-item .rw-journal-image,
.rw-journal-item .rw-journal-image {
	position: absolute !important;
	/*right: -30px !important;  ajustar separación visual hacia la derecha */
	top: 0 !important;       /* alinear al top del item */
	transform: none !important;
	width: 120px !important;
}

/* En desktop (>=1025px) la reserva permanente pasa a 140px */
@media (min-width: 1025px) {
	.elementor-widget-rw-journal-grid-filters .rw-journal-content,
	.rw-journal-content {
		/* padding-right: 140px !important; 120px imagen + 20px gap */
		box-sizing: border-box !important;
	}
}

/* También asegurar que en las reglas añadidas previamente donde había valores mayores (200/220) se use 140px.
   Si existen otras declaraciones repetidas en el fichero que fijaban padding-right a 200/220px, anularlas con la regla anterior. */

/* Ajustes para pantallas muy pequeñas */
@media (max-width: 480px) {
	.rw-journals-grid-categories {
		padding-left: 6px;
		padding-right: 6px;
		gap: 6px;
	}
	.rw-journals-grid-categories-list-button {
		padding: 8px 12px;
		font-size: 12px;
	}
	.rw-filters-label {
		font-size: 12px;
	}
}

.journals-tab-controls {
  display: flex;
  gap: 10px;
  justify-content: center;
}

.journals-tab-btn {
  padding: 15px 17px;
  font-size: 12px;
  font-weight: 500;
  border: 1px solid #F5333F;
  border-radius: 100px;
  background: #fff;
  color: #F5333F;
  cursor: pointer;
  transition: background 0.3s ease, color 0.3s ease, border-color 0.3s ease;
  font-family: "NeueHelveticaPro63ExtendedMedium", Arial, sans-serif;
}

.journals-tab-btn.active {
  background: #F5333F;
  color: #fff;
  border-color: #F5333F;
}
.journals-tab-btn:hover {
  background: #F5333F;
  color: #fff;
  border-color: #F5333F;
}
.journals-tab-
	.rw-group__heading{
	font-family: "NeueHelveticaPro55Roman", Arial, sans-serif;
	font-size: 13px;
	font-weight: bold;
	margin-bottom:4px;
}




@media (max-width: 1024px) {
	/* Forzar tamaño de fuente de título / fecha / fuente dentro del grid en pantallas pequeñas */
	.elementor-widget-rw-journal-grid-filters .rw-journal-title,
	.elementor-widget-rw-journal-grid-filters .rw-journal-fecha,
	.elementor-widget_rw_journal-grid-filters .rw-journal-fuente,
	.elementor-widget-rw-journal-by-year .rw-journal-title,
	.elementor-widget-rw-journal-by-year .rw-journal-fecha,
	.elementor-widget-rw-journal-by-year .rw-journal-fuente {
		font-size: 14px !important;
		line-height: 1.3 !important;
	}

	/* También asegurar consistencia cuando están dentro de grupos */
	.rw-journals-grid .rw-journal-title,
	.rw-journals-grid .rw-journal-fecha,
	.rw-journals-grid .rw-journal-fuente {
		font-size: 14px !important;
		line-height: 1.3 !important;
	}

	/* En pantallas pequeñas (<=1024px) la imagen NO debe mostrarse al hacer hover */
	.rw-journal-image {
		opacity: 0 !important;
		visibility: hidden !important;
		pointer-events: none !important;
	}

	/* Anular la regla de hover que muestra la imagen */
	.rw-journal-content:hover + .rw-journal-image,
	.rw-journal-content:focus + .rw-journal-image {
		opacity: 0 !important;
		visibility: hidden !important;
	}

	/* Evitar que el hover añada padding (desplazamiento) en móvil/tablet */
	.rw-journal-content:hover,
	.rw-journal-content:focus {
		padding-right: 0 !important;
	}

	/* En tablet/móvil: ocupar el 100% del ancho y entrar desde abajo */
	.rw-offcanvas {
		left: 0 !important;
		right: 0 !important;
		top: auto !important;
		bottom: 0 !important;
		width: 100vw !important;
		min-width: 0 !important;
		transform: translateY(100%) !important;
		transition: transform 1.1s cubic-bezier(.2,.8,.2,1) !important;
		opacity: 1 !important; /* siempre sólido, sin fade */
		visibility: hidden !important;
		z-index: 10001 !important; /* mantener 999 en móvil para estar encima del header */
	}

	/* Estado abierto en móvil: subir desde abajo SIN fade */
	.rw-offcanvas.rw-offcanvas--open {
		transform: translateY(0) !important;
		opacity: 1 !important; /* siempre sólido */
		visibility: visible !important;
	}

	/* Backdrop: misma transición suave y z-index por debajo del offcanvas */
	.rw-offcanvas-backdrop {
		transition: none !important;
		z-index: 998 !important;
	}
}

/* Reducir altura de línea SOLO en el listado (grid) */
.rw-journals-grid .rw-journal-content,
.rw-journals-grid .rw-journal-title,
.rw-journals-grid .rw-journal-fecha,
.rw-journals-grid .rw-journal-fuente {
	line-height: 1.12 !important; /* ajustable: 1.0 (muy apretado) → 1.3 (más suelto) */
}

/* Mantener line-height más holgado en el off-canvas */
.rw-offcanvas__descripcion,
.rw-offcanvas__meta-fuente,
.rw-offcanvas__meta-fecha {
	line-height: 1.25 !important;
}

/* Forzar font-size 14px en escritorio para título / fecha / fuente */
@media (min-width: 1025px) {
	.elementor-widget-rw-journal-grid-filters .rw-journal-title,
	.elementor-widget-rw-journal-grid-filters .rw-journal-fecha,
	.elementor-widget-rw-journal-grid-filters .rw-journal-fuente,
	.elementor-widget-rw-journal-by-year .rw-journal-title,
	.elementor-widget-rw-journal-by-year .rw-journal-fecha,
	.elementor-widget-rw-journal-by-year .rw-journal-fuente,
	.rw-journal-title,
	.rw-journal-fecha,
	.rw-journal-fuente {
		font-size: 14px !important;
		line-height: 1.3 !important;
	}
}

/* Forzar cursor pointer en elementos interactivos del grid */
.elementor-widget-rw-journal-grid-filters .rw_journals-grid .rw-journal-title,
.elementor-widget-rw-journal-grid-filters .rw_journals-grid .rw-journal-fecha,
.elementor-widget-rw-journal-grid-filters .rw_journals-grid .rw-journal-fuente,
.elementor-widget-rw-journal-by-year .rw-journals-grid .rw-journal-title,
.elementor-widget-rw-journal-by-year .rw-journals-grid .rw-journal-fecha,
.elementor-widget-rw-journal-by-year .rw-journals-grid .rw-journal-fuente,
.elementor-widget-rw-journal-grid-filters .rw_journals-grid__item,
.rw-journals-grid__item,
.elementor-widget-rw-journal-grid-filters .rw-journal-content,
.elementor-widget-rw-journal-by-year .rw-journal-content,
.rw-journal-content,
.rw-journals-grid-categories-list-button {
	cursor: pointer !important;
}

/* Aumentar z-index de la imagen para que aparezca por encima del contenido del item
   pero no capture eventos del ratón (evita parpadeos al aparecer). */
.elementor-widget-rw-journal-grid-filters .rw-journal-image,
.rw-journal-image {
	z-index: 60 !important;
	pointer-events: none !important;
}

/* OVERRIDES: backdrop transparente y animación de cierre consistente */

/* Base: backdrop transparente */
#rwOffcanvasBackdrop,
.rw-offcanvas-backdrop {
	background: transparent !important; /* backdrop transparente */
	pointer-events: none;
	opacity: 0;
	visibility: hidden;
	transition: none;
	z-index: 1199; /* por debajo del offcanvas */
}

/* Cuando está abierto: backdrop es click‑able pero sigue transparente */
#rwOffcanvasBackdrop.rw-offcanvas--open,
.rw-offcanvas-backdrop.rw-offcanvas--open {
	background: transparent !important; /* backdrop transparente */
	pointer-events: auto !important;
	opacity: 1 !important;
	visibility: visible !important;
	transition: none;
}

/* Al cerrar: mantener transparente */
#rwOffcanvasBackdrop.rw-offcanvas--open.rw-offcanvas--closing,
.rw-offcanvas-backdrop.rw-offcanvas--open.rw-offcanvas--closing {
	opacity: 0 !important;
	pointer-events: none !important;
	transition: none !important;
}

/* Offcanvas: cierre (desktop) — salir hacia la derecha SIN fade de opacidad */
.rw-offcanvas.rw-offcanvas--open.rw-offcanvas--closing {
	transform: translateX(100%);
	opacity: 1; /* siempre sólido, sin fade */
	transition: transform 1.1s cubic-bezier(.2,.8,.2,1);
}

/* Offcanvas: cierre (móvil) — salir hacia abajo SIN fade de opacidad */
@media (max-width: 1024px) {
	.rw-offcanvas.rw-offcanvas--open.rw-offcanvas--closing {
		transform: translateY(100%) !important;
		opacity: 1 !important; /* siempre sólido, sin fade */
		transition: transform 1.1s cubic-bezier(.2,.8,.2,1) !important;
	}
}

/* Seguridad: NO forzar visibility durante closing - dejar que la transición funcione */
.rw-offcanvas.rw-offcanvas--closing,
.rw-offcanvas.rw-offcanvas--open.rw-offcanvas--closing {
	/* NO forzar visibility aquí - permitir que transform/opacity animen */
}
.rw-journal-image {
	z-index: 60 !important;
	pointer-events: none !important;
}

/* OVERRIDE corregido: asegurar que el offcanvas esté a la derecha en escritorio
    y que use el id real "rwOffcanvas" (minuscula 'c') */
#rwOffcanvas.rw-offcanvas {
	position: fixed !important;
	top: 0 !important;
	right: 0 !important;
	left: auto !important;
	/* Por defecto (pantallas medias/pequeñas) usar 35vw; en >=1280px se fuerza 38vw más abajo */
	width: 35vw !important;
	min-width: 280px !important;
	height: 100vh !important;
	transform: translateX(100%) !important; /* cerrado: totalmente a la derecha */
	transform-origin: center right !important;
	opacity: 1 !important; /* siempre sólido, sin fade */
	visibility: hidden !important;
	pointer-events: none !important;
	will-change: transform !important;
	transition: transform 1.1s cubic-bezier(.2,.8,.2,1)!important;
	z-index: 1200 !important;
}
@media (min-width: 1281px) {
	#rwOffcanvas.rw-offcanvas {
		width: 38vw !important;
	}
}
/* Estado abierto (escritorio) */
#rwOffcanvas.rw-offcanvas--open {
    transform: translateX(0) !important;
    opacity: 1 !important; /* siempre sólido */
    visibility: visible !important;
    pointer-events: auto !important;
}

/* Cierre (animación de salida) — salir hacia la derecha SIN fade */
#rwOffcanvas.rw-offcanvas--open.rw-offcanvas--closing {
    transform: translateX(100%) !important;
    opacity: 1 !important; /* siempre sólido, sin fade */
    pointer-events: none !important;
    transition: transform 1.1s cubic-bezier(.2,.8,.2,1) !important;
}

/* MOBILE: forzar eje Y (entrar desde abajo / salir hacia abajo) - usar el id correcto también */
@media (max-width: 1024px) {
    #rwOffcanvas.rw-offcanvas {
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        top: auto !important;
        width: 100vw !important;
        min-width: 0 !important;
        transform: translateY(100%) !important; /* cerrado: debajo de la pantalla */
        transform-origin: center bottom !important;
        opacity: 1 !important; /* siempre sólido, sin fade */
        visibility: hidden !important;
        pointer-events: none !important;
        transition: transform 1.1s cubic-bezier(.2,.8,.2,1) !important;
    }
    #rwOffcanvas.rw-offcanvas--open {
        transform: translateY(0) !important;
        opacity: 1 !important; /* siempre sólido */
        visibility: visible !important;
        pointer-events: auto !important;
    }
    #rwOffcanvas.rw-offcanvas--open.rw-offcanvas--closing {
        transform: translateY(100%) !important; /* salir hacia abajo */
        opacity: 1 !important; /* siempre sólido, sin fade */
        pointer-events: none !important;
        transition: transform 1.1s cubic-bezier(.2,.8,.2,1) !important;
    }
}

/* --- Imagen fuera del flujo y más desplazada a la derecha --- */
/* Permitir que la imagen sobresalga del item */
.elementor-widget-rw-journal-grid-filters .rw-journal-item,
.elementor-widget-rw-journal-grid-filters .rw-journals-grid__item,
.elementor-widget-rw-journal-by-year .rw-journal-item,
.elementor-widget-rw-journal-by-year .rw-journals-grid__item {
	position: relative !important;
	overflow: visible !important;
}

/* Evitar que contenedores padres recorten la imagen */
.elementor-widget-rw-journal-grid-filters .rw-journals-grid__grid--wrapper,
.elementor-widget-rw-journal-grid-filters .rw-journals-grid__grid,
.elementor-widget-rw-journal-grid-filters .rw-group__items,
.elementor-widget-rw-journal-by-year .rw-journals-grid__grid--wrapper,
.elementor-widget-rw-journal-by-year .rw-journals-grid__grid,
.elementor-widget-rw-journal-by-year .rw-group__items {
	overflow: visible !important;
}

/* Colocar la imagen inicialmente fuera a la derecha y, al mostrarla, que quede aún más desplazada */
.elementor-widget-rw-journal-grid-filters .rw-journal-image {
	position: absolute !important;
	/* right negativo para que, una vez visible, quede "echada" hacia la derecha */
	right: -50px !important;
	top: 0 !important;
	width: 120px !important;
	height: auto !important;
	/* mantenerla fuera inicialmente (imagen + gap = 140px → aumentamos a 180 para mayor desplazamiento) */
	transform: translateX(180px);
	opacity: 0;
	visibility: visible; /* no usamos hidden porque está fuera por transform */
	
	z-index: 999 !important;
	pointer-events: none !important;
	box-shadow: none !important;
	background: transparent !important;
}

.rw-journal-image,
.elementor-widget-rw-journal-grid-filters .rw-journal-image {
	border: 1px solid #F5333F;
	box-sizing: border-box;
}

/* Al hover/focus entra desde la derecha sin provocar reflow y queda desplazada por right:-20px */
.elementor-widget-rw-journal-grid-filters .rw-journal-item:hover .rw-journal-image,
.elementor-widget-rw-journal-grid-filters .rw-journal-item:focus-within .rw-journal-image {
	transform: translateX(0) !important;
	opacity: 1 !important;
}

/* Asegurar que el texto no cambie de tamaño o padding al aparecer la imagen */
.elementor-widget-rw-journal-grid-filters .rw-journal-content,
.elementor-widget-rw-journal-grid-filters .rw-journal-content:hover,
.elementor-widget-rw-journal-grid-filters .rw-journal-content:focus {
	padding-right: 0 !important;
	box-sizing: border-box !important;
	min-width: 0 !important;
	font-family: "NeueHelveticaPro55Roman", Arial, sans-serif !important;
	font-size: 14px !important;
	line-height: 21px !important;
}

/* En móvil/tablet seguir ocultando la imagen */
@media (max-width: 1024px) {
	.elementor-widget-rw-journal-grid-filters .rw-journal-image {
		transform: translateX(180px) !important;
		opacity: 0 !important;
		pointer-events: none !important;
	}
}
      
    .rw-journal-content {
        padding-right: 0 !important;
    }



/* Asegurar que la reserva de espacio (padding-right) sea suficiente para evitar solapamientos.
   Si ya existe una regla más específica, esta la anula. */
.rw-journal-content,
.elementor-widget-rw-journal-grid-filters .rw-journal-content {
    box-sizing: border-box;
    /*padding-right: 140px !important; *//* 120px imagen + 20px gap */
}

/* En móvil/tablet seguimos ocultando la imagen (reglas existentes lo manejaban),
   mantener la anulación si aplica: */
@media (max-width: 1024px) {
    .rw-journal-image {
        opacity: 0 !important;
    
	margin-bottom:4px;    visibility: hidden !important;
        pointer-events: none !important;
    }
    .rw-journal-content {
        padding-right: 0 !important;
    }
}

/* Imagen dentro del off-canvas: ocupar TODO el ancho disponible (100%) */
.rw-offcanvas__imagen,
.rw-offcanvas__imagen img {
    display: block;
    width: 100% !important; /* forzar 100% del ancho disponible */
    max-width: none !important; /* quitar cualquier limitación de max-width */
    box-sizing: border-box;
    height: auto;
    border-radius: 0; /* sin radio */
    object-fit: cover; /* cubrir el espacio disponible sin deformar */
}

/* ===== Infinite Scroll: sentinel + loading spinner ===== */

/* El sentinel es un nodo invisible al final del grid que activa el observer */
.rw-infinite-sentinel {
    display: block;
    width: 100%;
    height: 1px;
    overflow: hidden;
    pointer-events: none;
    visibility: hidden;
}

/* Contenedor del spinner de carga */
.rw-journals-loading {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    padding: 24px 0;
    gap: 10px;
}

/* Spinner: círculo animado con el color del tema */
.rw-journals-loading__spinner {
    display: inline-block;
    width: 24px;
    height: 24px;
    border: 2px solid rgba(245, 51, 63, 0.25);
    border-top-color: #F5333F;
    border-radius: 50%;
    animation: rwJournalsSpin 0.75s linear infinite;
    flex-shrink: 0;
}

@keyframes rwJournalsSpin {
    to { transform: rotate(360deg); }
}

/* ── Widget: rw-journal-by-year ─────────────────────────────────────────────
   Años apilados en filas; items dentro de cada año en grid de columnas.
   Estas reglas sobreescriben cualquier inline-CSS generado por Elementor.
   ─────────────────────────────────────────────────────────────────────────── */
.elementor-widget-rw-journal-by-year .rw-journals-grid__grid--wrapper {
    display: flex !important;
    flex-direction: column !important;
}

.elementor-widget-rw-journal-by-year .rw-group__items {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

/* Hacer los items nativamente tappables en iOS Safari */
.elementor-widget-rw-journal-by-year .rw-journals-grid__item {
    cursor: pointer !important;
    touch-action: manipulation !important;
    -webkit-tap-highlight-color: transparent;
    user-select: none;
}

/* ── Tipografía: igual que grid-filters ── */
.elementor-widget-rw-journal-by-year .rw-journal-item,
.elementor-widget-rw-journal-by-year .rw-journal-content,
.elementor-widget-rw-journal-by-year .rw-journal-title,
.elementor-widget-rw-journal-by-year .rw-journal-fuente,
.elementor-widget-rw-journal-by-year .rw-journal-fecha {
    font-family: "NeueHelveticaPro55Roman", Arial, sans-serif !important;
    font-size: 14px !important;
    line-height: 1.3 !important;
    color: #000 !important;
    text-decoration: none !important;
}

/* anular links que puedan venir del tema/Elementor */
.elementor-widget-rw-journal-by-year a,
.elementor-widget-rw-journal-by-year .rw-journals-grid__item a {
    color: #000 !important;
    text-decoration: none !important;
}

/* ── Imagen hover: overflow visible en toda la cadena de padres ── */
.elementor-widget-rw-journal-by-year .rw-journals-grid,
.elementor-widget-rw-journal-by-year .rw-journals-grid__grid,
.elementor-widget-rw-journal-by-year .rw-journals-grid__grid--wrapper,
.elementor-widget-rw-journal-by-year .rw-group,
.elementor-widget-rw-journal-by-year .rw-group__items,
.elementor-widget-rw-journal-by-year .rw-journals-grid__item,
.elementor-widget-rw-journal-by-year .rw-journal-item {
    overflow: visible !important;
}

/* Imagen: se posiciona dentro del item (esquina superior derecha),
   no sale fuera de la columna y nunca se recorta */
.elementor-widget-rw-journal-by-year .rw-journal-image {
    position: absolute !important;
    right: 0 !important;
    left: auto !important;
    top: 0 !important;
    transform: none !important;
    width: 90px !important;
    height: auto !important;
    opacity: 0;
    visibility: hidden;
    z-index: 60 !important;
    pointer-events: none !important;
}

.elementor-widget-rw-journal-by-year .rw-journal-content:hover + .rw-journal-image,
.elementor-widget-rw-journal-by-year .rw-journal-content:focus + .rw-journal-image {
    opacity: 1 !important;
    visibility: visible !important;
}

/* Cuando la imagen está visible NO añadir padding: la imagen flota encima sin alterar el layout */
.elementor-widget-rw-journal-by-year .rw-journal-content:hover,
.elementor-widget-rw-journal-by-year .rw-journal-content:focus {
    padding-right: 0 !important;
}

/* ── Responsive: ocultar hover-image en móvil/tablet (<=1024px) ── */
@media (max-width: 1024px) {
    .elementor-widget-rw-journal-by-year .rw-journal-image {
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }
    .elementor-widget-rw-journal-by-year .rw-journal-content:hover + .rw-journal-image,
    .elementor-widget-rw-journal-by-year .rw-journal-content:focus + .rw-journal-image {
        opacity: 0 !important;
        visibility: hidden !important;
    }
}