/* ============================================================
   Página institucional de contingencia · Universidad Austral de Chile
   Identidad visual basada en uach.cl
   Sin dependencias externas · CSS puro
   ============================================================ */

:root {
	--uach-azul:        #3d51a8;  /* Azul institucional (footer) */
	--uach-azul-oscuro: #2e3f9e;
	--uach-violeta:     #7a3fbb;  /* Extremo del gradiente del header */
	--uach-dorado:      #ffd600;  /* Acentos y enlaces de barra superior */
	--uach-verde:       #00a651;  /* Botón destacado (Admisión) */
	--uach-verde-hover: #008f45;
	--uach-oscuro:      #1d1d1b;  /* Barra superior */
	--texto:            #212529;
	--texto-suave:      #5a6268;
	--fondo:            #f4f5fa;
	--fuente: "Inter", "Krub", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	--ancho-max: 1140px;
	--sombra-tarjeta: 0 10px 40px rgba(29, 29, 27, .10);
}

* { box-sizing: border-box; margin: 0; padding: 0; }

html { -webkit-text-size-adjust: 100%; }

body {
	font-family: var(--fuente);
	color: var(--texto);
	background: var(--fondo);
	line-height: 1.6;
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}

.contenedor {
	width: 100%;
	max-width: var(--ancho-max);
	margin: 0 auto;
	padding: 0 20px;
}

a { text-decoration: none; }

/* ============ Barra superior ============ */
.barra-superior {
	background: var(--uach-oscuro);
	font-size: .8rem;
}
.barra-superior__fila { display: flex; justify-content: flex-start; }
.barra-superior__nav { display: flex; flex-wrap: wrap; }
.barra-superior__nav a {
	color: var(--uach-dorado);
	padding: 8px 14px 8px 0;
	margin-right: 14px;
	border-right: 1px solid rgba(255, 255, 255, .18);
	transition: color .2s ease;
}
.barra-superior__nav a:last-child { border-right: 0; margin-right: 0; }
.barra-superior__nav a:hover,
.barra-superior__nav a:focus-visible { color: #fff; }

/* ============ Encabezado ============ */
.encabezado {
	background: linear-gradient(100deg, var(--uach-azul-oscuro) 0%, #4a36a6 45%, var(--uach-violeta) 100%);
	box-shadow: 0 2px 12px rgba(29, 29, 27, .25);
	position: relative;
}
.encabezado__fila {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	padding-top: 14px;
	padding-bottom: 14px;
}
.encabezado__marca img {
	display: block;
	width: 196px;
	height: auto;
}
.encabezado__nav {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 4px;
}
.encabezado__nav a {
	color: #fff;
	font-size: .95rem;
	font-weight: 500;
	padding: 8px 13px;
	border-radius: 4px;
	transition: background .2s ease;
	white-space: nowrap;
}
.encabezado__nav a:hover,
.encabezado__nav a:focus-visible { background: rgba(255, 255, 255, .14); }
.encabezado__nav .boton-admision {
	background: var(--uach-verde);
	font-weight: 600;
	margin-left: 8px;
	padding: 9px 20px;
}
.encabezado__nav .boton-admision:hover,
.encabezado__nav .boton-admision:focus-visible { background: var(--uach-verde-hover); }

/* Menú móvil (solo CSS, sin JavaScript) */
.menu-movil__checkbox { display: none; }
.menu-movil__boton {
	display: none;
	flex-direction: column;
	justify-content: center;
	gap: 5px;
	width: 44px;
	height: 44px;
	padding: 9px;
	cursor: pointer;
	border: 1px solid rgba(255, 255, 255, .4);
	border-radius: 6px;
}
.menu-movil__boton span {
	display: block;
	height: 2px;
	background: #fff;
	border-radius: 2px;
}

/* ============ Área principal ============ */
.principal {
	flex: 1;
	display: flex;
	align-items: center;
	padding: 56px 0 64px;
}
.principal .contenedor { display: flex; justify-content: center; }

.tarjeta {
	background: #fff;
	max-width: 720px;
	width: 100%;
	padding: 52px 48px 44px;
	border-radius: 10px;
	box-shadow: var(--sombra-tarjeta);
	border-top: 5px solid var(--uach-azul);
	text-align: center;
}
.tarjeta__sitio {
	color: var(--uach-azul);
	font-weight: 700;
	font-size: 1.02rem;
	letter-spacing: .02em;
	text-transform: uppercase;
	margin-bottom: 22px;
}
.tarjeta__icono {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 84px;
	height: 84px;
	border-radius: 50%;
	background: rgba(61, 81, 168, .08);
	color: var(--uach-azul);
	margin-bottom: 22px;
}
.tarjeta__titulo {
	font-size: clamp(1.5rem, 3.2vw, 2.05rem);
	font-weight: 700;
	color: var(--texto);
	margin-bottom: 18px;
	line-height: 1.25;
}
.tarjeta__mensaje {
	color: var(--texto-suave);
	font-size: 1.02rem;
	max-width: 560px;
	margin: 0 auto;
}
.tarjeta__mensaje p + p { margin-top: 10px; }
.tarjeta__acciones {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 14px;
	margin-top: 32px;
}
.boton {
	display: inline-block;
	font-weight: 600;
	font-size: .97rem;
	padding: 12px 26px;
	border-radius: 5px;
	border: 2px solid transparent;
	transition: background .2s ease, color .2s ease, border-color .2s ease;
}
.boton--primario {
	background: var(--uach-verde);
	color: #fff;
}
.boton--primario:hover,
.boton--primario:focus-visible { background: var(--uach-verde-hover); }
.boton--secundario {
	background: transparent;
	color: var(--uach-azul);
	border-color: var(--uach-azul);
}
.boton--secundario:hover,
.boton--secundario:focus-visible {
	background: var(--uach-azul);
	color: #fff;
}
.tarjeta__contacto {
	margin-top: 30px;
	font-size: .88rem;
	color: var(--texto-suave);
}
.tarjeta__contacto a {
	color: var(--uach-azul);
	font-weight: 600;
}
.tarjeta__contacto a:hover { text-decoration: underline; }

/* ============ Footer ============ */
.footer {
	background: var(--uach-azul);
	color: rgba(255, 255, 255, .92);
	font-size: .92rem;
}
.footer__grilla {
	display: grid;
	grid-template-columns: 1.4fr 1fr 1fr;
	gap: 36px;
	padding-top: 44px;
	padding-bottom: 36px;
}
.footer__col--marca img { display: block; width: 150px; height: auto; margin-bottom: 14px; }
.footer__col--marca p { line-height: 1.7; }
.footer__titulo {
	font-size: 1rem;
	font-weight: 700;
	color: var(--uach-dorado);
	margin-bottom: 12px;
}
.footer__col ul { list-style: none; }
.footer__col li { margin-bottom: 7px; }
.footer__col a { color: rgba(255, 255, 255, .92); transition: color .2s ease; }
.footer__col a:hover,
.footer__col a:focus-visible { color: var(--uach-dorado); }
.footer__legal {
	border-top: 1px solid rgba(255, 255, 255, .22);
	padding: 14px 0;
	font-size: .84rem;
	text-align: center;
	color: rgba(255, 255, 255, .8);
}

/* ============ Responsive ============ */
@media (max-width: 900px) {
	.menu-movil__boton { display: flex; }
	.encabezado__nav {
		display: none;
		position: absolute;
		top: 100%;
		left: 0;
		right: 0;
		flex-direction: column;
		align-items: stretch;
		background: var(--uach-azul-oscuro);
		padding: 12px 20px 18px;
		box-shadow: 0 12px 20px rgba(29, 29, 27, .3);
		z-index: 50;
	}
	.encabezado__nav a { padding: 12px 10px; border-bottom: 1px solid rgba(255,255,255,.12); }
	.encabezado__nav .boton-admision {
		margin: 12px 0 0;
		text-align: center;
		border-bottom: 0;
	}
	.menu-movil__checkbox:checked ~ .encabezado__nav { display: flex; }
	.encabezado__marca img { width: 160px; }
	.footer__grilla { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 620px) {
	.barra-superior__nav a { padding: 7px 10px 7px 0; margin-right: 10px; }
	.principal { padding: 34px 0 44px; }
	.tarjeta { padding: 38px 24px 34px; }
	.tarjeta__acciones { flex-direction: column; align-items: stretch; }
	.footer__grilla { grid-template-columns: 1fr; gap: 26px; }
}