/* ============================================
   Marco Hincapié — Representante a la Cámara
   Sistema de diseño propio, basado en los colores
   y la tipografía condensada del logo de campaña.
   ============================================ */

:root {
	--morado: #5150A2;
	--morado-oscuro: #383670;
	--morado-tinta: #211F45;
	--naranja: #F2930B;
	--naranja-oscuro: #C97600;
	--tinta: #1C1B2E;
	--gris: #58566E;
	--crema: #FFFFFF;
	--lino: #F4F2FB;
	--amarillo-suave: #FDF3E1;
	--borde: #E4E1F2;

	--display: 'Oswald', sans-serif;
	--texto: 'Work Sans', sans-serif;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
	margin: 0;
	font-family: var(--texto);
	color: var(--tinta);
	background: var(--crema);
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
}

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

img { max-width: 100%; display: block; }

h1, h2, h3, h4 {
	font-family: var(--display);
	margin: 0;
	line-height: 1.05;
	letter-spacing: 0.01em;
}

p { margin: 0 0 1em; }

.contenido-ancho {
	max-width: 1120px;
	margin: 0 auto;
	padding: 0 32px;
}

/* Foco visible para accesibilidad */
a:focus-visible, button:focus-visible {
	outline: 3px solid var(--naranja);
	outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	* { animation: none !important; transition: none !important; }
}

/* ---------- Franja superior ---------- */
.franja-superior {
	height: 6px;
	background: linear-gradient(90deg, var(--naranja) 0%, var(--naranja) 50%, var(--morado) 50%, var(--morado) 100%);
}

/* ---------- Cabecera ---------- */
.cabecera {
	background: var(--crema);
	border-bottom: 1px solid var(--borde);
	position: sticky;
	top: 0;
	z-index: 50;
}

.cabecera-contenedor {
	max-width: 1120px;
	margin: 0 auto;
	padding: 10px 32px;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.marca {
	display: flex;
	flex-direction: column;
	line-height: 1;
}

.marca-eyebrow {
	font-family: var(--display);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.18em;
	color: var(--naranja);
	text-transform: uppercase;
	margin-bottom: 2px;
}

.marca-nombre {
	font-family: var(--display);
	font-size: 22px;
	font-weight: 700;
	color: var(--morado);
	text-transform: uppercase;
}

.marca-logo-img {
	height: 148px;
	width: auto;
	display: block;
}

.marca-grupo {
	flex-direction: row !important;
	align-items: center;
	gap: 18px;
}

.marca-logo-aliado { height: 84px; }

.nav-principal {
	display: flex;
	align-items: center;
	gap: 28px;
}

.nav-principal a {
	font-family: var(--display);
	font-size: 14px;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--tinta);
	padding: 8px 0;
	border-bottom: 2px solid transparent;
	transition: color 0.15s ease, border-color 0.15s ease;
}

.nav-principal a:hover,
.nav-principal a.activo {
	color: var(--morado);
	border-color: var(--naranja);
}

.nav-cta {
	background: var(--morado);
	color: #fff !important;
	padding: 10px 20px !important;
	border-radius: 3px;
	border-bottom: none !important;
}

.nav-cta:hover { background: var(--morado-oscuro); }

.nav-toggle {
	display: none;
	background: none;
	border: none;
	flex-direction: column;
	gap: 5px;
	cursor: pointer;
	padding: 8px;
}

.nav-toggle span {
	width: 24px;
	height: 2px;
	background: var(--morado);
}

/* ---------- Hero ---------- */
.hero {
	position: relative;
	overflow: hidden;
	background: var(--morado);
	padding: 88px 0 0;
}

.hero-grid {
	max-width: 1120px;
	margin: 0 auto;
	padding: 0 32px 96px;
	display: grid;
	grid-template-columns: 1.15fr 0.85fr;
	gap: 48px;
	align-items: center;
	position: relative;
	z-index: 2;
}

.hero-eyebrow {
	font-family: var(--display);
	font-size: 15px;
	font-weight: 600;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--naranja);
	margin-bottom: 14px;
}

.hero-titulo {
	font-family: var(--display);
	font-size: clamp(48px, 7vw, 92px);
	font-weight: 700;
	color: #fff;
	text-transform: uppercase;
	margin-bottom: 24px;
}

.hero-titulo span { display: block; color: var(--naranja); }

.hero-lema {
	font-size: 19px;
	color: #E7E5F7;
	max-width: 46ch;
	margin-bottom: 32px;
}

.hero-acciones { display: flex; gap: 16px; flex-wrap: wrap; }

.boton {
	display: inline-block;
	font-family: var(--display);
	font-size: 14px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	padding: 15px 28px;
	border-radius: 3px;
	transition: transform 0.15s ease, background 0.15s ease;
}

.boton-primario { background: var(--naranja); color: #1C1B2E; }
.boton-primario:hover { background: #ffa524; transform: translateY(-2px); }

.boton-secundario { border: 2px solid rgba(255,255,255,0.5); color: #fff; }
.boton-secundario:hover { border-color: #fff; transform: translateY(-2px); }

.hero-panel {
	position: relative;
	background: var(--morado-tinta);
	border: 1px solid rgba(255,255,255,0.12);
	border-radius: 4px;
	padding: 32px;
}

.hero-panel-dato {
	display: flex;
	align-items: baseline;
	gap: 14px;
	padding: 16px 0;
	border-bottom: 1px solid rgba(255,255,255,0.12);
}

.hero-panel-dato:last-child { border-bottom: none; }

.hero-panel-numero {
	font-family: var(--display);
	font-size: 30px;
	font-weight: 700;
	color: var(--naranja);
	min-width: 74px;
}

.hero-panel-texto {
	font-size: 14px;
	color: #D9D7EE;
	line-height: 1.45;
}

.hero-diagonal {
	position: absolute;
	inset: 0;
	background: linear-gradient(135deg, transparent 55%, var(--naranja) 55%, var(--naranja) 57%, transparent 57%),
	            linear-gradient(135deg, transparent 60%, rgba(242,147,11,0.35) 60%, rgba(242,147,11,0.35) 61%, transparent 61%);
	pointer-events: none;
	z-index: 1;
}

.hero-carrusel {
	position: absolute;
	inset: 0;
	z-index: 0;
}

.hero-carrusel-slide {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	opacity: 0;
	transition: opacity 1.2s ease;
}

.hero-carrusel-slide.activa { opacity: 1; }

.hero-carrusel-overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(100deg, rgba(56,54,112,0.94) 0%, rgba(56,54,112,0.82) 45%, rgba(81,80,162,0.55) 100%);
}

.hero-con-fotos .hero-panel {
	background: rgba(33,31,69,0.78);
	backdrop-filter: blur(2px);
}

.hero-carrusel-flecha {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 3;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: rgba(255,255,255,0.18);
	border: 1.5px solid rgba(255,255,255,0.5);
	color: #fff;
	font-size: 24px;
	line-height: 1;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background 0.15s ease;
}

.hero-carrusel-flecha:hover { background: rgba(255,255,255,0.32); }
.hero-carrusel-flecha-izq { left: 20px; }
.hero-carrusel-flecha-der { right: 20px; }

.hero-carrusel-puntos {
	position: absolute;
	bottom: 18px;
	left: 50%;
	transform: translateX(-50%);
	z-index: 3;
	display: flex;
	gap: 8px;
}

.hero-carrusel-punto {
	width: 9px;
	height: 9px;
	border-radius: 50%;
	background: rgba(255,255,255,0.45);
	border: none;
	padding: 0;
	cursor: pointer;
	transition: background 0.15s ease, transform 0.15s ease;
}

.hero-carrusel-punto.activo { background: var(--naranja); transform: scale(1.2); }

/* ---------- Secciones generales ---------- */
.seccion { padding: 68px 0; }
.seccion-lino { background: var(--lino); }
.seccion-amarillo { background: var(--amarillo-suave); }

.seccion-cabecera { max-width: 640px; margin-bottom: 48px; }

.seccion-eyebrow {
	font-family: var(--display);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--naranja);
	margin-bottom: 10px;
}

.seccion-titulo {
	font-size: clamp(30px, 4vw, 42px);
	color: var(--morado);
	text-transform: uppercase;
}

.seccion-texto { font-size: 17px; color: var(--gris); margin-top: 14px; }

.logo-seccion { max-height: 180px; width: auto; margin: 0 auto; display: block; }

/* ---------- Franja de redes sociales (entre Hero y Ejes) ---------- */
.franja-redes {
	background: var(--lino);
	border-bottom: 1px solid var(--borde);
	padding: 20px 0;
}

.franja-redes-contenido {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 20px;
	flex-wrap: wrap;
}

.franja-redes-texto {
	font-family: var(--display);
	font-size: 13.5px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--morado);
	margin: 0;
}

.franja-redes-iconos { display: flex; gap: 10px; }

.franja-red-icono {
	width: 38px;
	height: 38px;
	border-radius: 50%;
	background: var(--morado);
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--display);
	font-size: 15px;
	font-weight: 600;
	transition: background 0.15s ease, transform 0.15s ease;
}

.franja-red-icono:hover { background: var(--naranja); color: var(--tinta); transform: translateY(-2px); }

/* ---------- Ejes de trabajo ---------- */
.ejes {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 1px;
	background: var(--borde);
	border: 1px solid var(--borde);
}

.eje {
	background: var(--crema);
	padding: 40px 32px;
}

.eje-letra {
	font-family: var(--display);
	font-size: 46px;
	font-weight: 700;
	color: var(--naranja);
	line-height: 1;
	margin-bottom: 18px;
}

.eje h3 {
	font-size: 21px;
	color: var(--morado);
	text-transform: uppercase;
	margin-bottom: 10px;
}

.eje p { color: var(--gris); font-size: 15px; margin: 0; }

/* ---------- Biografía ---------- */
.bio-grid {
	display: grid;
	grid-template-columns: 0.8fr 1.2fr;
	gap: 56px;
	align-items: start;
}

.bio-ficha {
	background: var(--morado);
	color: #fff;
	padding: 32px;
	border-radius: 4px;
}

.bio-ficha h3 {
	font-size: 15px;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--naranja);
	margin-bottom: 18px;
}

.bio-ficha-foto {
	margin: -32px -32px 24px;
	aspect-ratio: 4/5;
	overflow: hidden;
	border-radius: 4px 4px 0 0;
}

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

.bio-ficha ul { list-style: none; margin: 0; padding: 0; }

.bio-ficha li {
	padding: 12px 0;
	border-bottom: 1px solid rgba(255,255,255,0.15);
	font-size: 14.5px;
	line-height: 1.5;
}

.bio-ficha li:last-child { border-bottom: none; }

.bio-texto p {
	font-size: 17px;
	color: var(--tinta);
	text-align: justify;
	text-justify: inter-word;
	hyphens: auto;
}

.bio-texto p:first-of-type::first-letter {
	font-family: var(--display);
	font-size: 58px;
	font-weight: 700;
	color: var(--naranja);
	float: left;
	line-height: 0.8;
	margin: 6px 8px 0 0;
}

/* ---------- Trayectoria (línea de tiempo real) ---------- */
.linea-tiempo {
	position: relative;
	margin-top: 8px;
	padding-left: 32px;
	border-left: 3px solid var(--borde);
}

.hito {
	position: relative;
	padding-bottom: 40px;
}

.hito:last-child { padding-bottom: 0; }

.hito::before {
	content: '';
	position: absolute;
	left: -41px;
	top: 4px;
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background: var(--naranja);
	border: 3px solid var(--crema);
	box-shadow: 0 0 0 2px var(--naranja);
}

.hito-anio {
	font-family: var(--display);
	font-size: 14px;
	font-weight: 600;
	color: var(--morado);
	letter-spacing: 0.04em;
	margin-bottom: 4px;
}

.hito h4 { font-size: 19px; color: var(--tinta); margin-bottom: 6px; }
.hito p { color: var(--gris); font-size: 15px; margin: 0; }

/* ---------- Gestión legislativa (placeholder) ---------- */
.proximamente {
	background: var(--morado);
	border-radius: 6px;
	padding: 64px 48px;
	text-align: center;
	color: #fff;
}

.proximamente-icono {
	width: 64px;
	height: 64px;
	margin: 0 auto 24px;
	border: 3px solid var(--naranja);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--display);
	font-size: 26px;
	font-weight: 700;
	color: var(--naranja);
}

.proximamente h2 {
	font-size: 28px;
	text-transform: uppercase;
	margin-bottom: 14px;
}

.proximamente p {
	color: #D9D7EE;
	max-width: 52ch;
	margin: 0 auto;
}

.gestion-adelanto {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
	margin-top: 48px;
}

.gestion-tarjeta {
	border: 1px solid var(--borde);
	border-radius: 4px;
	padding: 28px;
}

.gestion-tarjeta h4 {
	color: var(--morado);
	font-size: 17px;
	text-transform: uppercase;
	margin-bottom: 8px;
}

.gestion-tarjeta p { color: var(--gris); font-size: 14.5px; margin: 0; }

/* ---------- Contacto ---------- */
.contacto-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 56px;
}

.contacto-lista { list-style: none; padding: 0; margin: 32px 0 0; }

.contacto-lista li {
	display: flex;
	gap: 16px;
	padding: 20px 0;
	border-bottom: 1px solid var(--borde);
}

.contacto-lista strong {
	display: block;
	font-family: var(--display);
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--naranja);
	margin-bottom: 4px;
}

.contacto-lista span { color: var(--tinta); font-size: 15.5px; }

.contacto-panel {
	background: var(--lino);
	border-radius: 6px;
	padding: 40px;
}

.contacto-panel h3 {
	color: var(--morado);
	font-size: 20px;
	text-transform: uppercase;
	margin-bottom: 16px;
}

.campo { margin-bottom: 18px; }

.campo label {
	display: block;
	font-family: var(--display);
	font-size: 12.5px;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	color: var(--gris);
	margin-bottom: 6px;
}

.campo input, .campo textarea {
	width: 100%;
	padding: 12px 14px;
	border: 1px solid var(--borde);
	border-radius: 3px;
	font-family: var(--texto);
	font-size: 15px;
	background: #fff;
}

.campo textarea { resize: vertical; min-height: 110px; }

/* ---------- CTA final ---------- */
.cta-final {
	background: var(--morado);
	padding: 64px 0;
	text-align: center;
}

.cta-final h2 {
	color: #fff;
	font-size: clamp(28px, 3.6vw, 38px);
	text-transform: uppercase;
	margin-bottom: 16px;
}

.cta-final p { color: #B8B6CC; margin-bottom: 28px; }

/* ---------- Popup de bienvenida (Inicio) ---------- */
.popup-bienvenida {
	position: fixed;
	inset: 0;
	z-index: 200;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
	animation: popup-bienvenida-entrada 0.25s ease;
}

.popup-bienvenida-cerrando { animation: popup-bienvenida-salida 0.2s ease forwards; }

@keyframes popup-bienvenida-entrada { from { opacity: 0; } to { opacity: 1; } }
@keyframes popup-bienvenida-salida { from { opacity: 1; } to { opacity: 0; } }

.popup-bienvenida-fondo {
	position: absolute;
	inset: 0;
	background: rgba(28,27,46,0.78);
	cursor: pointer;
}

.popup-bienvenida-caja {
	position: relative;
	z-index: 1;
	max-width: 820px;
	max-height: 88vh;
	width: 100%;
	background: #fff;
	border-radius: 10px;
	overflow: hidden;
	box-shadow: 0 24px 60px rgba(0,0,0,0.35);
	animation: popup-bienvenida-subir 0.3s ease;
}

@keyframes popup-bienvenida-subir { from { transform: translateY(16px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }

.popup-bienvenida-caja img { display: block; width: 100%; height: auto; max-height: 88vh; object-fit: contain; }

.popup-bienvenida-cerrar {
	position: absolute;
	top: 12px;
	right: 12px;
	z-index: 2;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: rgba(28,27,46,0.65);
	color: #fff;
	border: none;
	font-size: 16px;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background 0.15s ease;
}

.popup-bienvenida-cerrar:hover { background: var(--tinta); }

.popup-bienvenida-texto {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	z-index: 1;
	padding: 34px 50px 46px;
	background: linear-gradient(180deg, rgba(0,0,0,0.68) 0%, rgba(0,0,0,0.3) 70%, transparent 100%);
	text-align: center;
}

.popup-bienvenida-texto-principal {
	font-family: 'Playfair Display', serif;
	font-weight: 700;
	font-size: 40px;
	line-height: 1.15;
	color: #fff;
	text-shadow: 0 2px 14px rgba(0,0,0,0.55);
}

.popup-bienvenida-texto-secundario {
	margin-top: 8px;
	font-family: 'Playfair Display', serif;
	font-style: italic;
	font-weight: 500;
	font-size: 17px;
	letter-spacing: 0.02em;
	color: rgba(255,255,255,0.88);
	text-shadow: 0 2px 10px rgba(0,0,0,0.5);
}

@media (max-width: 640px) {
	.popup-bienvenida-texto { padding: 24px 36px 32px; }
	.popup-bienvenida-texto-principal { font-size: 27px; }
	.popup-bienvenida-texto-secundario { font-size: 14.5px; }
}

@media (max-width: 640px) {
	.popup-bienvenida-caja { max-width: 100%; }
}

/* ---------- Slider de Noticias ---------- */
.noticias-slider-wrap { position: relative; }

.noticias-slider {
	position: relative;
	background: var(--morado);
	border-radius: 8px;
	overflow: hidden;
	min-height: 460px;
}

.noticia-slide {
	display: none;
	grid-template-columns: 1fr 1fr;
	min-height: 460px;
}

.noticia-slide.activa { display: grid; }

.noticia-slide-texto {
	padding: 48px 44px 48px 68px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	color: #fff;
}

.noticia-slide-fecha { display: block; font-size: 13px; color: #D9D7EE; margin: 8px 0 14px; }

.noticia-slide-texto h3 {
	font-family: var(--texto);
	font-size: 26px;
	font-weight: 700;
	line-height: 1.25;
	margin: 0 0 16px;
}

.noticia-slide-texto h3 a { color: #fff; }
.noticia-slide-texto h3 a:hover { color: var(--naranja); }

.noticia-slide-texto p {
	color: #D9D7EE;
	font-size: 15.5px;
	line-height: 1.6;
	margin: 0 0 28px;
	max-width: 46ch;
}

.noticia-slide-texto .boton { align-self: flex-start; }

.noticia-slide-imagen {
	position: relative;
	background-color: var(--morado-oscuro);
	background-size: cover;
	background-position: center;
}

.noticias-slider-flecha {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 3;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: rgba(255,255,255,0.18);
	border: 1.5px solid rgba(255,255,255,0.5);
	color: #fff;
	font-size: 24px;
	line-height: 1;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background 0.15s ease;
}

.noticias-slider-flecha:hover { background: rgba(255,255,255,0.32); }
.noticias-slider-flecha-izq { left: 20px; }
.noticias-slider-flecha-der { right: 20px; }

.noticias-slider-puntos {
	position: absolute;
	bottom: 18px;
	left: 50%;
	transform: translateX(-50%);
	z-index: 3;
	display: flex;
	gap: 8px;
}

.noticias-slider-punto {
	width: 9px;
	height: 9px;
	border-radius: 50%;
	background: rgba(255,255,255,0.45);
	border: none;
	padding: 0;
	cursor: pointer;
	transition: background 0.15s ease, transform 0.15s ease;
}

.noticias-slider-punto.activo { background: var(--naranja); transform: scale(1.2); }

@media (max-width: 860px) {
	.noticia-slide { grid-template-columns: 1fr; min-height: 0; }
	.noticias-slider { min-height: 0; }
	.noticia-slide-imagen { min-height: 220px; order: -1; }
	.noticia-slide-texto { padding: 32px 24px; }
	.noticias-slider-flecha { display: none; }
}

/* ---------- Noticias (listado completo) ---------- */
.grid-noticias {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 28px;
}

.tarjeta-noticia {
	background: #fff;
	border: 1px solid var(--borde);
	border-radius: 6px;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.tarjeta-noticia:hover { transform: translateY(-3px); box-shadow: 0 12px 28px rgba(28,27,46,0.08); }

.tarjeta-noticia-img {
	display: block;
	position: relative;
	aspect-ratio: 16/10;
	background: var(--lino) center/cover no-repeat;
}

.badge-destacada {
	position: absolute;
	top: 12px;
	left: 12px;
	z-index: 2;
	background: var(--naranja);
	color: var(--tinta);
	font-family: var(--display);
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	padding: 5px 11px;
	border-radius: 3px;
}

.tarjeta-noticia-cuerpo { padding: 20px 22px 24px; display: flex; flex-direction: column; flex: 1; }

.tarjeta-noticia-categoria {
	display: inline-block;
	font-family: var(--display);
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	color: var(--naranja);
	margin-bottom: 8px;
}

.tarjeta-noticia-fecha {
	display: block;
	font-size: 12.5px;
	color: var(--gris);
	margin-bottom: 10px;
}

.tarjeta-noticia-cuerpo h3 {
	font-family: var(--texto);
	font-size: 18px;
	font-weight: 600;
	color: var(--tinta);
	margin: 0 0 10px;
	line-height: 1.3;
}

.tarjeta-noticia-cuerpo h3 a { color: inherit; }
.tarjeta-noticia-cuerpo h3 a:hover { color: var(--morado); }

.tarjeta-noticia-cuerpo p { color: var(--gris); font-size: 14.5px; margin: 0 0 16px; flex: 1; }

.tarjeta-noticia-link {
	font-family: var(--display);
	font-size: 13px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	color: var(--morado);
}

.tarjeta-noticia-link:hover { color: var(--naranja); }

/* ---------- Widgets sociales (Facebook + X) ---------- */
.grid-widgets-sociales {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 32px;
	align-items: start;
	justify-items: center;
}

.grid-widgets-sociales-una { grid-template-columns: 1fr; }

.widget-social-columna { width: 100%; max-width: 500px; }

.noticia-contenido p { color: var(--tinta); font-size: 17px; line-height: 1.75; margin: 0 0 20px; text-align: justify; text-justify: inter-word; hyphens: auto; }

/* ---------- Proposiciones ---------- */
.lista-proposiciones { display: flex; flex-direction: column; gap: 18px; }

.tarjeta-proposicion {
	display: grid;
	grid-template-columns: 56px 1fr auto;
	align-items: center;
	gap: 20px;
	background: #fff;
	border: 1px solid var(--borde);
	border-radius: 6px;
	padding: 24px;
}

.tarjeta-proposicion-destacada { border-color: var(--naranja); box-shadow: 0 0 0 1px var(--naranja); }

.tarjeta-proposicion-icono {
	width: 56px;
	height: 56px;
	border-radius: 50%;
	background: var(--lino);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 24px;
}

.tarjeta-proposicion-cuerpo h3 { font-size: 18px; color: var(--tinta); margin: 4px 0 8px; font-family: var(--texto); font-weight: 600; }
.tarjeta-proposicion-cuerpo p { color: var(--gris); font-size: 14.5px; margin: 0; }

.tarjeta-proposicion-boton { white-space: nowrap; }

@media (max-width: 700px) {
	.tarjeta-proposicion { grid-template-columns: 1fr; text-align: center; }
	.tarjeta-proposicion-icono { margin: 0 auto; }
}

/* ---------- Multimedia (público) ---------- */
.multimedia-destacado {
	position: relative;
	aspect-ratio: 21/9;
	border-radius: 6px;
	background-size: cover;
	background-position: center;
	background-color: var(--morado);
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	overflow: hidden;
}

.multimedia-destacado::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(28,27,46,0) 40%, rgba(28,27,46,0.55) 100%);
}

.multimedia-play {
	position: relative;
	z-index: 2;
	width: 72px;
	height: 72px;
	border-radius: 50%;
	background: rgba(255,255,255,0.92);
	color: var(--morado);
	font-size: 22px;
	border: none;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: transform 0.15s ease;
}

.multimedia-play:hover { transform: scale(1.08); }

.multimedia-destacado-titulo {
	text-align: center;
	color: var(--gris);
	font-size: 14.5px;
	margin: 14px 0 0;
}

.grid-multimedia {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 16px;
	margin-top: 24px;
}

.multimedia-item {
	position: relative;
	aspect-ratio: 4/3;
	border-radius: 4px;
	background-size: cover;
	background-position: center;
	background-color: var(--lino);
	cursor: pointer;
	overflow: hidden;
	transition: transform 0.15s ease;
}

.multimedia-item:hover { transform: scale(1.03); }

.multimedia-item-play {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(28,27,46,0.35);
	color: #fff;
	font-size: 22px;
}

.multimedia-lightbox {
	display: none;
	position: fixed;
	inset: 0;
	background: rgba(15,14,28,0.92);
	z-index: 200;
	align-items: center;
	justify-content: center;
	padding: 32px;
}

.multimedia-lightbox.abierto { display: flex; }

.multimedia-lightbox-contenido {
	max-width: 1100px;
	width: 100%;
	max-height: 85vh;
}

.multimedia-lightbox-contenido img {
	width: 100%;
	max-height: 85vh;
	object-fit: contain;
	border-radius: 4px;
}

.multimedia-lightbox-contenido iframe {
	width: 100%;
	aspect-ratio: 16/9;
	border: none;
	border-radius: 4px;
}

.multimedia-lightbox-cerrar {
	position: absolute;
	top: 24px;
	right: 32px;
	background: none;
	border: none;
	color: #fff;
	font-size: 26px;
	cursor: pointer;
}

/* ---------- Widget de Facebook ---------- */
.widget-facebook {
	display: flex;
	justify-content: center;
	max-width: 500px;
	margin: 0 auto;
}

.widget-facebook iframe { width: 100%; }

/* ---------- Pie de página ---------- */
.pie { background: var(--morado-tinta); color: #D9D7EE; padding: 64px 0 0; }

.pie-contenedor {
	max-width: 1120px;
	margin: 0 auto;
	padding: 0 32px;
	display: grid;
	grid-template-columns: 1.2fr 1fr;
	gap: 48px;
	padding-bottom: 48px;
	border-bottom: 1px solid rgba(255,255,255,0.12);
}

.pie-marca .marca-eyebrow { color: var(--naranja); }

.marca-nombre-pie {
	font-family: var(--display);
	font-size: 24px;
	font-weight: 700;
	color: #fff;
	text-transform: uppercase;
	display: block;
	margin: 2px 0 12px;
}

.pie-marca p { color: #A6A4C2; font-size: 14.5px; }

.pie-columnas {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 24px;
}

.pie-columnas h4 {
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--naranja);
	margin-bottom: 14px;
}

.pie-columnas a, .pie-columnas span {
	display: block;
	font-size: 14.5px;
	color: #D9D7EE;
	margin-bottom: 10px;
}

.pie-columnas a:hover { color: #fff; }

.pie-redes {
	border-bottom: 1px solid rgba(255,255,255,0.12);
}

.pie-redes-contenido {
	display: flex;
	gap: 12px;
	padding: 24px 32px;
}

.pie-red-icono {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	border: 1.5px solid rgba(255,255,255,0.35);
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	font-family: var(--display);
	font-size: 16px;
	font-weight: 600;
	transition: background 0.15s ease, border-color 0.15s ease;
}

.pie-red-icono:hover {
	background: var(--naranja);
	border-color: var(--naranja);
	color: var(--tinta);
}

.pie-legal {
	max-width: 1120px;
	margin: 0 auto;
	padding: 20px 32px;
	font-size: 13px;
	color: #8A88A8;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 8px;
}

.pie-creditos a { color: #A6A4C2; text-decoration: underline; text-underline-offset: 2px; }
.pie-creditos a:hover { color: #fff; }

/* ---------- Responsive ---------- */
@media (max-width: 860px) {
	.marca-logo-img { max-height: 76px; }
	.marca-logo-aliado { max-height: 48px; }
	.marca-grupo { gap: 10px; }
	.logo-seccion { max-height: 110px; }
	.nav-principal {
		position: absolute;
		top: 100%;
		left: 0;
		right: 0;
		background: var(--crema);
		flex-direction: column;
		align-items: flex-start;
		padding: 16px 32px 24px;
		border-bottom: 1px solid var(--borde);
		display: none;
		gap: 14px;
	}
	.nav-principal.abierto { display: flex; }
	.nav-toggle { display: flex; }
	.hero-grid { grid-template-columns: 1fr; }
	.hero-diagonal { display: none; }
	.hero-carrusel-flecha { display: none; }
	.bio-grid { grid-template-columns: 1fr; }
	.ejes { grid-template-columns: 1fr; }
	.grid-multimedia { grid-template-columns: repeat(2, 1fr); }
	.grid-noticias { grid-template-columns: 1fr; }
	.grid-widgets-sociales { grid-template-columns: 1fr; }
	.gestion-adelanto { grid-template-columns: 1fr; }
	.contacto-grid { grid-template-columns: 1fr; }
	.pie-contenedor { grid-template-columns: 1fr; }
	.pie-columnas { grid-template-columns: 1fr 1fr; }
}
