/* ====================================================================
   FMV UNMSM — Rediseño "Clean Academic / Clinical Precision"
   FASE 1: paleta, tipografía y secciones de la HOME (bajo el hero).
   Se carga DESPUÉS de estilos.css; estas reglas prevalecen.
   Para desactivar el rediseño: quitar el <link> de este archivo.
   No se toca header ni hero (se respetan los actuales).
   ==================================================================== */

/* ---- Fuentes del sistema de diseño ---- */
@import url('https://fonts.googleapis.com/css2?family=Archivo+Narrow:wght@400;500;600;700&family=DM+Sans:opsz,wght@9..40,400;9..40,500;9..40,600;9..40,700&family=Newsreader:opsz,wght@6..72,400;6..72,500;6..72,600;6..72,700&display=swap');

/* ---- Paleta clean academic (sobre :root para reutilizar) ---- */
:root {
  --ca-primary:        #6b1020;  /* guinda San Marcos */
  --ca-primary-dark:   #49000f;  /* carmín más profundo (hover/activo) */
  --ca-primary-soft:   rgba(107,16,32,.06);
  --ca-primary-border: rgba(107,16,32,.15);
  --ca-carbon:         #1d1c16;  /* carbón: títulos, iconos, reglas */
  --ca-ink:            #191c1d;  /* texto principal */
  --ca-ink-soft:       #495057;  /* texto secundario/metadatos */
  --ca-white:          #ffffff;
  --ca-surface:        #f8f9fa;  /* gris clínico suave */
  --ca-surface-2:      #f1f3f5;  /* bordes/divisores/tarjetas */
  --ca-border:         #e9ecef;  /* borde fino de tarjetas */
  --ca-shadow-2:       0 4px 20px -2px rgba(29,28,22,.04);
  --ca-shadow-3:       0 12px 32px -4px rgba(29,28,22,.08);

  --ca-font-title: 'Newsreader', Georgia, 'Times New Roman', serif;
  --ca-font-body:  'DM Sans', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
  --ca-font-label: 'Archivo Narrow', 'DM Sans', Arial, sans-serif;
}

/* ---- Base tipográfica del contenido (no toca header/hero) ---- */
main {
  font-family: var(--ca-font-body);
  color: var(--ca-ink);
  background: var(--ca-white);
}
main h1, main h2, main h3, main h4 {
  font-family: var(--ca-font-title);
  color: var(--ca-carbon);
  letter-spacing: -0.01em;
}

/* ---- Secciones ---- */
main .seccion { padding: 72px 0; }
main .seccion--alt { background: var(--ca-surface); border-top: 1px solid var(--ca-surface-2); border-bottom: 1px solid var(--ca-surface-2); }

/* Título de sección: editorial, con regla fina guinda en vez de subrayado dorado */
main .seccion-titulo { text-align: center; margin-bottom: 48px; }
main .seccion-titulo h2 {
  font-family: var(--ca-font-title);
  font-weight: 600;
  font-size: 2.25rem;
  color: var(--ca-carbon);
  padding-bottom: 16px;
  position: relative;
  display: inline-block;
  letter-spacing: -0.02em;
}
main .seccion-titulo h2::after {
  content: "";
  position: absolute; left: 50%; bottom: 0; transform: translateX(-50%);
  width: 56px; height: 2px; background: var(--ca-primary); border-radius: 0;
}
main .seccion-titulo p {
  font-family: var(--ca-font-body);
  color: var(--ca-ink-soft);
  font-size: 1.05rem;
  margin-top: 10px;
}

/* ---- Botones ---- */
main .btn--primario {
  background: var(--ca-primary); color: #fff;
  border-radius: 4px; font-family: var(--ca-font-label);
  font-weight: 600; letter-spacing: .03em; text-transform: none;
  border: 1px solid var(--ca-primary);
  transition: background .15s, transform .05s;
}
main .btn--primario:hover { background: var(--ca-primary-dark); color: #fff; }
main .btn--primario:active { transform: scale(.99); }
main .btn--dorado {
  background: transparent; color: var(--ca-primary);
  border: 1px solid var(--ca-primary); border-radius: 4px;
  font-family: var(--ca-font-label); font-weight: 600;
}
main .btn--dorado:hover { background: var(--ca-primary-soft); color: var(--ca-primary); }
main .btn--gris {
  background: transparent; color: var(--ca-carbon);
  border: 1px solid var(--ca-border); border-radius: 4px;
  font-family: var(--ca-font-label); font-weight: 600;
}
main .btn--gris:hover { background: var(--ca-surface-2); }

/* ---- Tarjetas (eventos, noticias) ---- */
main .grid-cards { gap: 24px; }
main .card {
  background: var(--ca-white);
  border: 1px solid var(--ca-surface-2);
  border-radius: 8px;
  box-shadow: none;
  overflow: hidden;
  transition: border-color .18s, box-shadow .18s, transform .18s;
}
main .card:hover {
  transform: translateY(-3px);
  border-color: var(--ca-primary);
  box-shadow: var(--ca-shadow-2);
}
main .card__body { padding: 20px; }
main .card__cat {
  font-family: var(--ca-font-label);
  font-size: .72rem; font-weight: 600; text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--ca-primary);
  background: var(--ca-primary-soft);
  border: 1px solid var(--ca-primary-border);
  padding: 3px 8px; border-radius: 4px;
  display: inline-block; margin-bottom: 10px;
}
main .card__titulo {
  font-family: var(--ca-font-title);
  font-weight: 600; font-size: 1.1rem; line-height: 1.35;
  color: var(--ca-carbon); margin: 0 0 10px;
}
main .card__fecha, main .card__meta {
  font-family: var(--ca-font-label);
  color: var(--ca-ink-soft); font-size: .82rem;
}
main .card__link {
  font-family: var(--ca-font-label); font-weight: 600;
  color: var(--ca-primary); letter-spacing: .02em;
}
main .card__link:hover { color: var(--ca-primary-dark); }

/* Badge de fecha (evento) sobre la imagen: rectangular, guinda */
main .card__badge-fecha {
  background: var(--ca-primary); color: #fff;
  border-radius: 4px;
  font-family: var(--ca-font-label);
}
main .card__badge-fecha .dia { font-weight: 700; }
main .card__badge-fecha .mes { letter-spacing: .06em; }

/* ---- Presentación (texto + fachada + RIVEP) ---- */
main .presentacion__texto h2 {
  font-family: var(--ca-font-title); font-size: 2rem; color: var(--ca-carbon);
}
main .presentacion__texto .eyebrow {
  font-family: var(--ca-font-label);
  color: var(--ca-primary); font-weight: 600;
  text-transform: uppercase; letter-spacing: .08em; font-size: .8rem;
}
main .presentacion__texto p { font-family: var(--ca-font-body); color: var(--ca-ink-soft); }
main .presentacion__img img { border-radius: 8px; box-shadow: var(--ca-shadow-2); }

/* Tarjeta RIVEP */
main .rivep-card {
  background: var(--ca-white);
  border: 1px solid var(--ca-surface-2);
  border-radius: 8px;
}
main .rivep-card__marca { font-family: var(--ca-font-title); color: var(--ca-primary); }

/* ---- Estadísticas: franja clínica con hairlines ---- */
main .estadisticas-franja {
  background: var(--ca-surface);
  border: 1px solid var(--ca-surface-2);
  border-radius: 8px;
}
main .stat__valor {
  font-family: var(--ca-font-title);
  color: var(--ca-primary); font-weight: 600;
}
main .stat__etiqueta {
  font-family: var(--ca-font-label);
  color: var(--ca-ink-soft); text-transform: uppercase;
  letter-spacing: .05em; font-size: .78rem;
}

/* ---- Estaciones IVITA ---- */
main .estacion { border-radius: 8px; overflow: hidden; border: 1px solid var(--ca-surface-2); }
main .estacion__overlay h3 { font-family: var(--ca-font-title); }
main .estacion__overlay span { font-family: var(--ca-font-label); letter-spacing: .04em; }

/* ---- Lista de documentos (home) ---- */
main .doc-item {
  border: 1px solid var(--ca-surface-2);
  border-radius: 8px;
  background: var(--ca-white);
}
main .doc-item:hover { border-color: var(--ca-primary); box-shadow: var(--ca-shadow-2); }
main .doc-item__titulo { font-family: var(--ca-font-body); color: var(--ca-carbon); }
main .doc-item__meta { font-family: var(--ca-font-label); color: var(--ca-ink-soft); }
main .doc-item__btn {
  background: var(--ca-primary); color: #fff; border-radius: 4px;
  font-family: var(--ca-font-label); font-weight: 600;
}
main .doc-item__btn:hover { background: var(--ca-primary-dark); }

/* ---- Bloques editoriales (veterhistoria, intercambio) ---- */
main .veterhistoria__inner h2, main .intercambio__texto h2 {
  font-family: var(--ca-font-title); color: var(--ca-carbon);
}

/* ---- Responsive: respeta los breakpoints del sistema ---- */
@media (max-width: 1023px) {
  main .seccion { padding: 56px 0; }
}
@media (max-width: 767px) {
  main .seccion { padding: 40px 0; }
  main .seccion-titulo h2 { font-size: 1.75rem; }
}


/* ====================================================================
   FASE 2 — Páginas internas (detalle, listado, documentos)
   Estas vistas usan var(--granate)/var(--dorado). Redefinimos esas
   variables al lenguaje clean academic para que adopten el nuevo look
   sin editar las vistas. Además, ajustes finos por vista.
   ==================================================================== */

/* Redefinición de las variables base heredadas (clean academic).
   Afecta a todo lo que use var(--granate)/var(--dorado) en el sitio. */
:root {
  --granate:       #6b1020;
  --granate-osc:   #49000f;
  --granate-claro: #832330;
  --dorado:        #6b1020;   /* el "dorado" pasa a guinda: se elimina el oro */
  --dorado-claro:  #832330;
}

/* ---- Hero de cabecera de página interna (pagina-hero) ---- */
main .pagina-hero {
  background-color: var(--ca-primary-dark);
}
main .pagina-hero h1 { font-family: var(--ca-font-title); letter-spacing: -0.01em; }
main .pagina-migas, main .pagina-migas a, main .pagina-migas span {
  font-family: var(--ca-font-label); letter-spacing: .03em;
}

/* ---- Detalle de publicación ---- */
main .detalle-categoria {
  background: var(--ca-primary);
  border-radius: 4px;
  font-family: var(--ca-font-label);
  text-transform: uppercase; letter-spacing: .06em;
}
main .post-contenido { font-family: var(--ca-font-body); color: var(--ca-ink); }
main .detalle-ficha {
  background: var(--ca-surface);
  border: 1px solid var(--ca-surface-2);
  border-radius: 8px;
}
main .detalle-ficha__titulo {
  font-family: var(--ca-font-title);
  color: var(--ca-carbon);
  border-bottom: 2px solid var(--ca-primary);
}
main .detalle-ficha__lista strong { color: var(--ca-carbon); }
main .detalle-aside__img { border-radius: 8px; box-shadow: var(--ca-shadow-2); }

/* Bloque de documentos para descargar (badges por tipo se mantienen) */
main .docs-descarga {
  background: var(--ca-white);
  border: 1px solid var(--ca-surface-2);
  border-radius: 8px;
  box-shadow: none;
}
main .docs-descarga__titulo { font-family: var(--ca-font-title); color: var(--ca-carbon); }
main .docs-descarga__cabecera { border-bottom: 2px solid var(--ca-primary); }
main .docs-descarga__icono { background: var(--ca-primary); border-radius: 4px; }
main .doc-btn { font-family: var(--ca-font-label); font-weight: 600; border-radius: 4px; }
main .doc-btn--ver { color: var(--ca-primary); border: 1px solid var(--ca-primary); }
main .doc-btn--ver:hover { background: var(--ca-primary); color: #fff; }
main .doc-btn--descargar { background: var(--ca-primary); border: 1px solid var(--ca-primary); }
main .doc-btn--descargar:hover { background: var(--ca-primary-dark); border-color: var(--ca-primary-dark); }

/* Galería del detalle */
main .galeria-pub__titulo { font-family: var(--ca-font-title); color: var(--ca-carbon); }
main .galeria-pub__cabecera { border-bottom: 2px solid var(--ca-primary); }

/* ---- Listado (pestañas eventos + filtro categorías) ---- */
main .filtro-categorias .btn--primario { background: var(--ca-primary); border-color: var(--ca-primary); }
main .eventos-tabs { border-bottom: 2px solid var(--ca-surface-2); }
main .eventos-tab { font-family: var(--ca-font-label); font-weight: 600; letter-spacing: .03em; color: var(--ca-ink-soft); }
main .eventos-tab:hover { color: var(--ca-primary); }
main .eventos-tab.activo { color: var(--ca-primary); border-bottom-color: var(--ca-primary); }

/* Paginación */
main .paginacion__num.activo { background: var(--ca-primary); border-color: var(--ca-primary); color: #fff; }
main .paginacion__btn:hover, main .paginacion__num:hover { border-color: var(--ca-primary); color: var(--ca-primary); }

/* ---- Documentos (acordeón + buscador) ---- */
main .doc-buscador input { border-radius: 4px; border-color: var(--ca-border); font-family: var(--ca-font-body); }
main .doc-buscador input:focus { border-color: var(--ca-primary); box-shadow: 0 0 0 1px var(--ca-primary); }
main .acc { background: var(--ca-white); border: 1px solid var(--ca-surface-2); border-radius: 8px; }
main .acc__cab:hover { background: var(--ca-surface); }
main .acc__titulo { font-family: var(--ca-font-title); color: var(--ca-carbon); }
main .acc__cont { background: var(--ca-primary-soft); color: var(--ca-primary); border: 1px solid var(--ca-primary-border); border-radius: 4px; font-family: var(--ca-font-label); }
main .acc__ico::before, main .acc__ico::after { background: var(--ca-primary); }
main .acc__mas { border: 1px dashed var(--ca-primary-border); color: var(--ca-primary); border-radius: 4px; font-family: var(--ca-font-label); }
main .acc__mas:hover { background: var(--ca-primary-soft); }
main .doc-res-cat { background: var(--ca-primary-soft); color: var(--ca-primary); border-radius: 4px; font-family: var(--ca-font-label); }
main mark { background: #ffe08a; }

/* ---- RIVEP bloque (publicaciones de la revista) ---- */
main .rivep-bloque__titulo { font-family: var(--ca-font-title); color: var(--ca-primary); }
main .rivep-bloque__portada { border-radius: 8px; background: var(--ca-primary-dark); }


/* ====================================================================
   FASE 2b — Footer "Clean Academic" (fondo carbón/negro)
   Administrable desde Panel -> Configuración -> grupo Footer.
   ==================================================================== */
.footer-ca {
  background: #191c1d;          /* carbón casi negro */
  color: #c9ccce;
  font-family: var(--ca-font-body);
  padding: 56px 0 0;
  margin-top: 0;
}
.footer-ca__inner { }
.footer-ca__grid {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1.2fr 1.2fr;
  gap: 40px;
  padding-bottom: 40px;
}
.footer-ca__col { min-width: 0; }

/* Marca */
.footer-ca__logo { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.footer-ca__logo img { height: 40px; width: auto; object-fit: contain; }
.footer-ca__logotxt {
  font-family: var(--ca-font-title);
  font-size: 1.25rem; font-weight: 600; color: #fff; letter-spacing: .01em;
}
.footer-ca__dir { color: #c9ccce; font-size: .9rem; line-height: 1.6; margin: 0 0 12px; }
.footer-ca__desc { color: #9aa0a3; font-size: .88rem; line-height: 1.6; margin: 0 0 14px; }
.footer-ca__tel { color: #7f8689; font-size: .82rem; font-family: var(--ca-font-label); letter-spacing: .02em; margin: 0; }

/* Títulos de columna */
.footer-ca__titulo {
  font-family: var(--ca-font-label);
  font-size: .8rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .08em; color: #fff; margin: 0 0 18px;
}

/* Listas */
.footer-ca__lista { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.footer-ca__lista li { color: #b3b8ba; font-size: .9rem; line-height: 1.45; }
.footer-ca__lista a { color: #b3b8ba; text-decoration: none; transition: color .15s; }
.footer-ca__lista a:hover { color: #fff; }

/* Botón de emergencias (contorno guinda) */
.footer-ca__emergencia {
  display: inline-block; margin-top: 18px;
  font-family: var(--ca-font-label); font-weight: 700; font-size: .82rem;
  letter-spacing: .02em; color: #ff8c94;
  border: 1px solid rgba(255,140,148,.5); border-radius: 4px;
  padding: 10px 16px; background: rgba(107,16,32,.25);
}

/* Barra inferior */
.footer-ca__bottom {
  border-top: 1px solid rgba(255,255,255,.08);
  padding: 22px 0 26px;
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: 12px;
}
.footer-ca__copy { color: #7f8689; font-size: .82rem; margin: 0; }
.footer-ca__legales { display: flex; gap: 26px; flex-wrap: wrap; }
.footer-ca__legales a {
  color: #9aa0a3; font-size: .82rem; text-decoration: none;
  font-family: var(--ca-font-label); letter-spacing: .02em; transition: color .15s;
}
.footer-ca__legales a:hover { color: #fff; }

/* Responsive */
@media (max-width: 1023px) {
  .footer-ca__grid { grid-template-columns: 1fr 1fr; gap: 32px; }
}
@media (max-width: 640px) {
  .footer-ca__grid { grid-template-columns: 1fr; gap: 28px; }
  .footer-ca__bottom { flex-direction: column; align-items: flex-start; }
}


/* ====================================================================
   FASE 2c — Afinado de páginas CMS + alineación de UVISEG
   ==================================================================== */

/* ---- UVISEG: alinear al clean academic (guinda, sin dorado) ---- */
.tema-uviseg .seccion-titulo h2 { color: var(--ca-carbon); }
.tema-uviseg .seccion-titulo h2::after { background: var(--ca-primary); }
.tema-uviseg .btn--primario { background: var(--ca-primary); border-color: var(--ca-primary); }
.tema-uviseg .btn--primario:hover { background: var(--ca-primary-dark); }
.tema-uviseg .btn--dorado { background: transparent; color: var(--ca-primary); border: 1px solid var(--ca-primary); }
.tema-uviseg .btn--dorado:hover { background: var(--ca-primary-soft); color: var(--ca-primary); }
.tema-uviseg .pagina-hero h1::after { background: var(--ca-primary); }
.tema-uviseg .tarjeta-inst { border-top-color: var(--ca-primary); }
.tema-uviseg .tarjeta-inst h4 { color: var(--ca-carbon); }
.tema-uviseg .tarjeta-inst__link { color: var(--ca-primary); }
.tema-uviseg .ec-col__cabecera { background: var(--ca-primary); }
.tema-uviseg .ec-persona__avatar { border-color: var(--ca-primary); }
.tema-uviseg .ec-persona__avatar--defecto { color: var(--ca-primary); }
.tema-uviseg .mv-card { border-left-color: var(--ca-primary); }
.tema-uviseg .mv-card--dorado { border-left-color: var(--ca-primary-dark); }
.tema-uviseg .doc-item { border-left-color: var(--ca-primary); }
.tema-uviseg .doc-item:hover { border-color: var(--ca-primary); border-left-color: var(--ca-primary); }
.tema-uviseg .doc-item__icono { background: var(--ca-primary); }
.tema-uviseg .doc-item__btn { color: #fff; background: var(--ca-primary); }
.tema-uviseg .dp-anio-btn.activo { background: var(--ca-primary); }

/* ---- Títulos de bloque (h3) en tarjetas de contenido: serif editorial ---- */
main .mv-card h3,
main .ec-card h3,
main .ec-col h3,
main .datos-clave-item h3,
main .perfil-card h3,
main .tarjeta-inst h4 {
  font-family: var(--ca-font-title);
  color: var(--ca-carbon);
}

/* ---- Tarjetas de contenido: borde fino + sombra sutil (clean) ---- */
main .mv-card,
main .ec-card,
main .ec-col,
main .cronologia-item,
main .datos-clave-item,
main .perfil-card,
main .tarjeta-inst {
  border: 1px solid var(--ca-surface-2);
  border-radius: 8px;
  box-shadow: none;
  transition: border-color .18s, box-shadow .18s, transform .18s;
}
main .perfil-card:hover,
main .tarjeta-inst:hover {
  border-color: var(--ca-primary);
  box-shadow: var(--ca-shadow-2);
  transform: translateY(-3px);
}

/* Acentos de borde izquierdo/superior en guinda */
main .mv-card { border-left: 4px solid var(--ca-primary); }
main .mv-card--dorado { border-left-color: var(--ca-primary-dark); background: var(--ca-surface); }
main .cronologia-item { border-top: 3px solid var(--ca-primary); }
main .tarjeta-inst { border-top: 3px solid var(--ca-primary); }

/* Cronología: chip de periodo */
main .cronologia-item__periodo {
  background: var(--ca-primary-soft);
  color: var(--ca-primary);
  border: 1px solid var(--ca-primary-border);
  border-radius: 4px;
  font-family: var(--ca-font-label);
  letter-spacing: .03em;
}

/* Datos clave: número/valor destacado en serif guinda */
main .datos-clave-item .valor,
main .datos-clave-item strong {
  font-family: var(--ca-font-title);
  color: var(--ca-primary);
}

/* Franja destacada: fondo guinda, tipografía editorial */
main .franja-destacada {
  background: var(--ca-primary-dark);
}
main .franja-destacada h2, main .franja-destacada h3 { font-family: var(--ca-font-title); color: #fff; }

/* Perfiles de acceso */
main .perfil-card h3 { font-family: var(--ca-font-title); }
main .perfiles-grid { gap: 20px; }

/* Documentos por periodo (tabs año/mes): botones guinda */
main .dp-anio-btn.activo, main .dp-mes-btn.activo {
  background: var(--ca-primary);
  color: #fff;
  border-radius: 4px;
}
main .dp-mes-titulo { font-family: var(--ca-font-title); color: var(--ca-carbon); }

/* Equipo/contacto: cabecera de columna */
main .ec-col__cabecera { background: var(--ca-primary); font-family: var(--ca-font-label); letter-spacing: .04em; }
main .ec-persona__avatar { border-color: var(--ca-primary); }

/* Tabla institucional (popup) ya afinada en fase anterior; reforzar cabecera */
main .tabla-inst thead th {
  font-family: var(--ca-font-label);
  text-transform: uppercase; letter-spacing: .05em;
  border-bottom: 2px solid var(--ca-carbon);
}