/* =========================================================
 * Slider de Noticias Pro (hero cinematográfico)
 * ========================================================= */

.ncehs {
	position: relative;
	width: 100%;
	overflow: hidden;
	border-radius: 10px;
	background-color: #0c0c0c;
}

.ncehs__track {
	position: relative;
	width: 100%;
	height: 620px;
}

/* --- Diapositivas (apiladas con crossfade) --- */
.ncehs__slide {
	position: absolute;
	inset: 0;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.8s ease;
	z-index: 1;
}

.ncehs__slide.is-active {
	opacity: 1;
	visibility: visible;
	z-index: 2;
}

.ncehs__media {
	position: absolute;
	inset: 0;
	overflow: hidden;
}

.ncehs__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transform: scale(1.02);
}

/* Ken Burns: zoom lento mientras la diapositiva está activa */
.ncehs--kenburns .ncehs__slide.is-active .ncehs__media img {
	animation: ncehs-kenburns 8s ease-out forwards;
}

@keyframes ncehs-kenburns {
	from { transform: scale(1.02); }
	to   { transform: scale(1.15) translate(-1.5%, -1.5%); }
}

/* Tinte de color (configurable) + degradado para legibilidad */
.ncehs__overlay {
	position: absolute;
	inset: 0;
	z-index: 2;
	background-color: rgba(0, 0, 0, 0.25);
}

.ncehs__slide::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 2;
	background: linear-gradient(to top, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.25) 45%, rgba(0, 0, 0, 0) 75%);
	pointer-events: none;
}

/* --- Contenido / caption --- */
.ncehs__content {
	position: relative;
	z-index: 3;
	display: flex;
	width: 100%;
	height: 100%;
	box-sizing: border-box;
	padding: 48px clamp(24px, 6vw, 80px) 64px;
}

.ncehs--v-top .ncehs__content    { align-items: flex-start; }
.ncehs--v-middle .ncehs__content { align-items: center; }
.ncehs--v-bottom .ncehs__content { align-items: flex-end; }

.ncehs__inner {
	max-width: 620px;
}

.ncehs--h-left .ncehs__inner   { margin-right: auto; text-align: left; }
.ncehs--h-center .ncehs__inner { margin: 0 auto; text-align: center; }
.ncehs--h-right .ncehs__inner  { margin-left: auto; text-align: right; }

/* Entrada animada de los elementos del caption */
.ncehs__inner > * {
	opacity: 0;
}

.ncehs__slide.is-active .ncehs__inner > * {
	animation: ncehs-rise 0.7s cubic-bezier(0.2, 0.7, 0.2, 1) forwards;
}

.ncehs__slide.is-active .ncehs__badge   { animation-delay: 0.10s; }
.ncehs__slide.is-active .ncehs__title   { animation-delay: 0.22s; }
.ncehs__slide.is-active .ncehs__meta    { animation-delay: 0.34s; }
.ncehs__slide.is-active .ncehs__excerpt { animation-delay: 0.44s; }
.ncehs__slide.is-active .ncehs__btn     { animation-delay: 0.54s; }

@keyframes ncehs-rise {
	from { opacity: 0; transform: translateY(26px); }
	to   { opacity: 1; transform: translateY(0); }
}

.ncehs__badge {
	display: inline-block;
	background-color: #d6263a;
	color: #ffffff;
	font-size: 12px;
	font-weight: 700;
	line-height: 1;
	padding: 7px 12px;
	border-radius: 4px;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	margin-bottom: 16px;
}

.ncehs__title {
	margin: 0 0 14px;
	font-size: clamp(1.6rem, 3.4vw, 3rem);
	line-height: 1.12;
	color: #ffffff;
}

.ncehs__title a {
	color: inherit;
	text-decoration: none;
}

.ncehs__title a:hover {
	text-decoration: underline;
	text-underline-offset: 4px;
}

.ncehs__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
	margin-bottom: 14px;
	font-size: 0.85rem;
	color: rgba(255, 255, 255, 0.85);
}

.ncehs--h-center .ncehs__meta { justify-content: center; }
.ncehs--h-right .ncehs__meta  { justify-content: flex-end; }

.ncehs__excerpt {
	margin: 0 0 22px;
	font-size: 1.02rem;
	line-height: 1.55;
	color: rgba(255, 255, 255, 0.9);
}

.ncehs__btn {
	display: inline-block;
	background-color: #d6263a;
	color: #ffffff;
	font-weight: 600;
	font-size: 0.95rem;
	text-decoration: none;
	padding: 13px 26px;
	border-radius: 6px;
	transition: background-color 0.2s ease, transform 0.2s ease;
}

.ncehs__btn:hover {
	background-color: #b51e30;
	transform: translateY(-2px);
}

/* --- Flechas --- */
.ncehs__arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 50px;
	height: 50px;
	display: flex;
	align-items: center;
	justify-content: center;
	border: none;
	border-radius: 50%;
	background-color: rgba(255, 255, 255, 0.15);
	color: #ffffff;
	backdrop-filter: blur(6px);
	cursor: pointer;
	z-index: 10;
	padding: 0;
	transition: background-color 0.2s ease, transform 0.2s ease;
}

.ncehs__arrow:hover {
	background-color: rgba(255, 255, 255, 0.3);
	transform: translateY(-50%) scale(1.06);
}

.ncehs__arrow--prev { left: 18px; }
.ncehs__arrow--next { right: 18px; }

.ncehs__arrow[disabled] {
	opacity: 0.3;
	cursor: default;
	pointer-events: none;
}

/* --- Barra de progreso --- */
.ncehs__progress {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 4px;
	background-color: rgba(255, 255, 255, 0.2);
	z-index: 10;
}

.ncehs__progress span {
	display: block;
	width: 100%;
	height: 100%;
	background-color: #d6263a;
	transform: scaleX(0);
	transform-origin: left center;
}

/* --- Navegación: puntos --- */
.ncehs__nav--dots {
	position: absolute;
	bottom: 22px;
	left: 0;
	width: 100%;
	display: flex;
	justify-content: center;
	gap: 9px;
	z-index: 10;
}

.ncehs__dot {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	border: none;
	background-color: rgba(255, 255, 255, 0.5);
	cursor: pointer;
	padding: 0;
	transition: width 0.25s ease, background-color 0.25s ease, border-radius 0.25s ease;
}

.ncehs__dot.is-active {
	width: 30px;
	border-radius: 5px;
	background-color: #d6263a;
}

/* --- Navegación: miniaturas --- */
.ncehs__nav--thumbs {
	position: absolute;
	bottom: 18px;
	right: 18px;
	display: flex;
	gap: 10px;
	z-index: 10;
	max-width: 70%;
	overflow-x: auto;
	scrollbar-width: none;
	padding-bottom: 2px;
}

.ncehs__nav--thumbs::-webkit-scrollbar { display: none; }

.ncehs__thumb {
	position: relative;
	flex: 0 0 auto;
	width: 110px;
	height: 66px;
	border: 2px solid transparent;
	border-radius: 6px;
	overflow: hidden;
	padding: 0;
	cursor: pointer;
	background: #222;
	opacity: 0.6;
	transition: opacity 0.2s ease, border-color 0.2s ease;
}

.ncehs__thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.ncehs__thumb.is-active {
	opacity: 1;
	border-color: #d6263a;
}

.ncehs__thumb:hover { opacity: 1; }

.ncehs__thumb-title {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	padding: 4px 6px;
	font-size: 10px;
	line-height: 1.2;
	color: #fff;
	text-align: left;
	background: linear-gradient(to top, rgba(0, 0, 0, 0.85), transparent);
	white-space: normal;
}

/* --- Responsivo --- */
@media ( max-width: 1024px ) {
	.ncehs__nav--thumbs { max-width: 60%; }
	.ncehs__thumb { width: 90px; height: 54px; }
}

@media ( max-width: 767px ) {
	.ncehs__content { padding: 32px 22px 56px; }
	.ncehs__nav--thumbs { display: none; }
	.ncehs__arrow { width: 42px; height: 42px; }
	.ncehs__arrow--prev { left: 10px; }
	.ncehs__arrow--next { right: 10px; }
	.ncehs__thumb-title { display: none; }
}

@media ( prefers-reduced-motion: reduce ) {
	.ncehs--kenburns .ncehs__slide.is-active .ncehs__media img,
	.ncehs__slide.is-active .ncehs__inner > * {
		animation: none;
	}
	.ncehs__inner > * { opacity: 1; }
}

/* Aviso en el editor cuando no hay noticias */
.nspe-empty {
	padding: 24px;
	text-align: center;
	border: 1px dashed #c4c4c4;
	border-radius: 8px;
	color: #777;
	font-size: 0.95rem;
}
