/* ============================================================
   Hero — el sello como un stamp recién pegado en la página.
   ============================================================ */
.apes-hero {
	position: relative;
	background: var(--apes-tinta);
	color: var(--apes-tinta-texto);
	overflow: hidden;
	padding-top: 40px;
}

.apes-hero__rayos {
	position: absolute;
	inset: 0;
	overflow: hidden;
	pointer-events: none;
}

.apes-hero__rayo {
	position: absolute;
	top: 50%;
	right: -10%;
	width: 180%;
	height: 130px;
	transform-origin: right center;
	opacity: 0.85;
}

.apes-hero__rayo--1 { background: var(--apes-acero); transform: translateY(-340px) rotate(-8deg); opacity: 0.5; }
.apes-hero__rayo--2 { background: var(--apes-naranja); transform: translateY(-160px) rotate(-8deg); }
.apes-hero__rayo--3 { background: var(--apes-verde); transform: translateY(10px) rotate(-8deg); opacity: 0.55; }
.apes-hero__rayo--4 { background: var(--apes-rojo); transform: translateY(190px) rotate(-8deg); opacity: 0.5; }

.apes-hero__envoltorio {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(280px, 420px);
	align-items: center;
	gap: 32px;
	padding-top: 56px;
	padding-bottom: 56px;
}

/* Los rayos de colores atrás son puro clima — el texto necesita su propia
   tarjeta encima, si no el contraste se rompe según qué franja le toque
   detrás (ver comentarios del equipo, quedaba ilegible en algunos anchos). */
.apes-hero__texto {
	position: relative;
	background: rgba(10, 15, 31, 0.62);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	border: 1px solid rgba(255, 255, 255, 0.08);
	border-radius: 20px;
	padding: 36px 40px;
	box-shadow: 0 24px 48px rgba(0, 0, 0, 0.35);
}

.apes-hero__texto h1 { margin-bottom: 20px; }

.apes-hero__texto .apes-eyebrow { color: #fff; }

.apes-hero__renglon-naranja { color: var(--apes-naranja); }

.apes-hero__dek {
	max-width: 46ch;
	font-size: 1.15rem;
	color: var(--apes-tinta-texto-tenue);
}

.apes-hero__cta {
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
	margin-top: 8px;
}

.apes-hero__sello {
	position: relative;
	justify-self: center;
	transform: rotate(-6deg);
}

.apes-hero__sello-img {
	width: 100%;
	max-width: 380px;
	filter: drop-shadow(0 22px 40px rgba(0, 0, 0, 0.45));
}

@media (max-width: 900px) {
	.apes-hero__envoltorio { grid-template-columns: 1fr; text-align: center; padding-top: 40px; }
	.apes-hero__texto { order: 2; padding: 26px 22px; }
	.apes-hero__dek { margin-left: auto; margin-right: auto; }
	.apes-hero__cta { justify-content: center; }
	.apes-hero__sello { order: 1; margin-bottom: 8px; }
	.apes-hero__sello-img { max-width: 240px; }
}

/* ============================================================
   Noticias — tarjeta simple, no es contenido "vas a estar ahí"
   ============================================================ */
.apes-noticias-grilla {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	gap: 28px;
}

.apes-noticia-card { text-decoration: none; color: inherit; }

.apes-noticia-card__imagen {
	aspect-ratio: 16 / 10;
	object-fit: cover;
	border-radius: 10px;
	margin-bottom: 14px;
	background: var(--apes-papel-2);
}

.apes-noticia-card__fecha {
	font-family: var(--apes-fuente-dato);
	font-size: 0.75rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--apes-negro-texto-tenue);
}

.apes-noticia-card__titulo {
	font-family: var(--apes-fuente-display);
	font-weight: 700;
	text-transform: uppercase;
	font-size: 1.4rem;
	line-height: 1.02;
	margin: 4px 0 0;
}

.apes-noticia-card:hover .apes-noticia-card__titulo { color: var(--apes-rojo); }

/* ============================================================
   Galería destacada
   ============================================================ */
.apes-galeria-destacada {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
	gap: 14px;
}

.apes-galeria-destacada__item { position: relative; display: block; border-radius: 10px; overflow: hidden; }

.apes-galeria-destacada__item img {
	aspect-ratio: 1 / 1;
	object-fit: cover;
	transition: transform 0.3s ease;
}

.apes-galeria-destacada__item:hover img { transform: scale(1.06); }

.apes-galeria-destacada__etiqueta {
	position: absolute;
	inset: auto 0 0 0;
	padding: 8px 12px;
	background: linear-gradient(0deg, rgba(10, 15, 31, 0.85), transparent);
	color: #fff;
	font-family: var(--apes-fuente-dato);
	font-size: 0.7rem;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

/* ============================================================
   Vacíos: cuando todavía no hay contenido cargado
   ============================================================ */
.apes-vacio {
	border: 1px dashed var(--apes-papel-borde);
	border-radius: var(--apes-radio);
	padding: 28px;
	color: var(--apes-negro-texto-tenue);
}

.apes-seccion--tinta .apes-vacio { border-color: var(--apes-tinta-borde); color: var(--apes-tinta-texto-tenue); }
