/* Visalia · Autores del blog — tokens del Figma (1440 / 768 / 375) */
:root {
	--vsau-primary: #0f7bad;
	--vsau-primary-500: #005e91;
	--vsau-primary-50: #effaff;
	--vsau-text: #3f3f50;
	--vsau-muted: #717181;
	--vsau-border: #ebebf1;

	--vsau-h-xxl: 56px;
	--vsau-h-l: 40px;
	--vsau-h-m: 32px;
	--vsau-h-s: 28px;
	--vsau-h-xs: 24px;
	--vsau-t-l: 20px;
	--vsau-t-m: 16px;
	--vsau-t-s: 14px;
}
@media (max-width: 1024px) {
	:root { --vsau-h-xxl: 48px; --vsau-h-l: 32px; --vsau-h-m: 28px; --vsau-h-s: 24px; --vsau-h-xs: 20px; --vsau-t-l: 16px; }
}
@media (max-width: 600px) {
	:root { --vsau-h-xxl: 40px; --vsau-h-l: 28px; --vsau-h-m: 24px; --vsau-h-s: 24px; --vsau-h-xs: 20px; --vsau-t-l: 16px; }
}

/* Resets frente al tema (especificidad de un elemento) */
/* El tema aplica h1:not(:last-child), li:not(:last-child), * + h3… (0,1,1): «body» sube a (0,1,2). */
body :is(.vsau-firma, .vsau-ficha, .vsau-articulos, .vsau-dir-cabecera, .vsau-directorio, .vsau-contacto) :is(h1, h2, h3, p, ul, li) {
	margin: 0;
}
body :is(.vsau-firma, .vsau-ficha, .vsau-articulos, .vsau-dir-cabecera, .vsau-directorio, .vsau-contacto) :is(h1, h2, h3, p, ul) {
	padding: 0;
}
body .vsau-articulos ul { list-style: none; }

/* Iconos (máscara + currentColor) */
.vsau-ico {
	display: inline-block;
	flex: 0 0 auto;
	width: 20px;
	height: 20px;
	background-color: currentColor;
	-webkit-mask: var(--vsau-ico-arrow) center / contain no-repeat;
	mask: var(--vsau-ico-arrow) center / contain no-repeat;
}
.vsau-ico--linkedin {
	-webkit-mask-image: var(--vsau-ico-linkedin);
	mask-image: var(--vsau-ico-linkedin);
}

/* Avatar: foto o iniciales */
.vsau-avatar {
	display: inline-flex;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	border-radius: 100px;
	background: var(--vsau-primary-50);
	color: var(--vsau-primary);
	font-weight: 600;
	line-height: 1.2;
	text-align: center;
	white-space: nowrap;
}
.vsau-avatar__img { width: 100%; height: 100%; object-fit: cover; display: block; }
.vsau-avatar--s { width: 48px; height: 48px; font-size: 18px; }
.vsau-avatar--m { width: 96px; height: 96px; font-size: var(--vsau-h-s); }
.vsau-avatar--l { width: 120px; height: 120px; font-size: 40px; }

/* Enlace con flecha («Ver artículos», «Leer artículo») */
.vsau-link {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 8px 0;
	color: var(--vsau-primary);
	font-size: 16px;
	font-weight: 700;
	line-height: 20px;
	text-decoration: none;
	white-space: nowrap;
	transition: color .2s;
}
.vsau-link:hover, .vsau-link:focus-visible { color: var(--vsau-primary-500); }
.vsau-link:hover .vsau-ico { transform: translateX(2px); }
.vsau-link .vsau-ico { transition: transform .2s; }

/* Botón redondo de LinkedIn */
.vsau-social {
	display: inline-flex;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	box-sizing: border-box;
	border: 1px solid var(--vsau-border);
	border-radius: 100px;
	color: var(--vsau-primary);
	transition: background-color .2s, border-color .2s;
}
.vsau-social:hover, .vsau-social:focus-visible { background: var(--vsau-primary-50); border-color: var(--vsau-primary); color: var(--vsau-primary); }

/* ---------- Firma en el artículo ---------- */
.vsau-firma {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 8px 24px;
	width: 100%;
}
.vsau-firma__autor { display: flex; align-items: center; gap: 12px; min-width: 0; }
.vsau-firma__avatar { display: inline-flex; text-decoration: none; }
.vsau-firma__texto { display: flex; flex-direction: column; min-width: 0; }
.vsau-firma__nombre { color: var(--vsau-text); font-size: 16px; line-height: 1.6; }
.vsau-firma__nombre a { color: var(--vsau-primary); font-weight: 700; text-decoration: underline; }
.vsau-firma__nombre a:hover { color: var(--vsau-primary-500); }
.vsau-firma__cargo { color: var(--vsau-muted); font-size: var(--vsau-t-s); line-height: 1.6; }
.vsau-firma__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 0 16px; color: var(--vsau-muted); font-size: var(--vsau-t-m); line-height: 1.6; }
.vsau-firma__lectura { font-weight: 700; }

/* ---------- Ficha del autor ---------- */
.vsau-ficha { display: flex; flex-direction: column; gap: 16px; }
.vsau-ficha__hero { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 24px; }
.vsau-ficha__titulo { display: flex; flex: 1 0 0; flex-direction: column; gap: 4px; min-width: 200px; }
.vsau-ficha__nombre { color: var(--vsau-primary); font-size: var(--vsau-h-l); font-weight: 600; line-height: 1.2; }
.vsau-ficha__cargo { color: var(--vsau-text); font-size: var(--vsau-t-l); line-height: 1.6; }
.vsau-ficha__bio { color: var(--vsau-text); font-size: 16px; line-height: 1.6; }
body .vsau-ficha__bio p + p { margin-top: 16px; }
.vsau-ficha__bio a { color: var(--vsau-primary); font-weight: 700; text-decoration: underline; }
.vsau-ficha__contacto { display: flex; }

/* ---------- Artículos del autor ---------- */
.vsau-articulos { display: flex; flex-direction: column; gap: 24px; margin-top: 56px; scroll-margin-top: 160px; }
.vsau-articulos__titulo { color: var(--vsau-text); font-size: var(--vsau-h-m); font-weight: 600; line-height: 1.2; }
.vsau-articulos__lista { display: flex; flex-direction: column; }
.vsau-articulo {
	display: flex;
	align-items: center;
	gap: 24px;
	padding: 20px 0;
	border-bottom: 1px solid var(--vsau-border);
}
.vsau-articulo__info { display: flex; flex: 1 0 0; flex-direction: column; gap: 4px; min-width: 1px; }
.vsau-articulo__fecha { color: var(--vsau-muted); font-size: var(--vsau-t-s); line-height: 1.6; }
.vsau-articulo__titulo { color: var(--vsau-text); font-size: var(--vsau-t-l); font-weight: 700; line-height: 30px; }
.vsau-articulo__titulo a { color: inherit; text-decoration: none; }
.vsau-articulo__titulo a:hover { color: var(--vsau-primary); }
.vsau-articulos__vacio { color: var(--vsau-muted); }

.vsau-paginacion { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 8px; }
.vsau-paginacion a, .vsau-paginacion span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 12px;
	box-sizing: border-box;
	border: 1px solid var(--vsau-border);
	border-radius: 100px;
	color: var(--vsau-primary);
	font-weight: 700;
	font-size: 16px;
	text-decoration: none;
}
.vsau-paginacion a:hover { background: var(--vsau-primary-50); border-color: var(--vsau-primary); }
.vsau-paginacion .is-actual { background: var(--vsau-primary); border-color: var(--vsau-primary); color: #fff; }
.vsau-paginacion .vsau-paginacion__dots { border-color: transparent; color: var(--vsau-muted); }

/* ---------- Directorio ---------- */
.vsau-dir-cabecera { display: flex; flex-direction: column; gap: 16px; }
.vsau-dir-cabecera__titulo { color: var(--vsau-primary); font-size: var(--vsau-h-xxl); font-weight: 600; line-height: 1.2; }
.vsau-dir-cabecera__intro { color: var(--vsau-text); font-size: var(--vsau-t-l); line-height: 1.6; }

.vsau-directorio { display: flex; flex-direction: column; gap: 24px; margin-top: 56px; }
.vsau-dir-cabecera + .vsau-directorio { margin-top: 56px; }
.vsau-directorio__titulo { color: var(--vsau-primary); font-size: var(--vsau-h-m); font-weight: 600; line-height: 1.2; }
.vsau-directorio__lista { display: flex; flex-direction: column; gap: 16px; }
.vsau-card {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 16px 24px;
	padding: 24px;
	border: 1px solid var(--vsau-border);
	border-radius: 16px;
	background: #fff;
}
.vsau-card__info { display: flex; flex: 1 0 0; flex-direction: column; gap: 8px; min-width: 200px; }
.vsau-card__nombre { color: var(--vsau-primary); font-size: var(--vsau-h-xs); font-weight: 600; line-height: 1.2; }
.vsau-card__nombre a { color: inherit; text-decoration: none; }
.vsau-card__nombre a:hover { color: var(--vsau-primary-500); }
.vsau-card__cargo { color: var(--vsau-muted); font-size: var(--vsau-t-s); line-height: 1.6; }
.vsau-card__desc { color: var(--vsau-text); font-size: 16px; line-height: 1.6; }
body .vsau-card__desc p + p { margin-top: 12px; }
.vsau-card__links { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-top: 8px; }

/* ---------- Contacto del blog (columna lateral) ---------- */
.vsau-contacto {
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 24px;
	border: 1px solid var(--vsau-border);
	border-radius: 16px;
}
.vsau-contacto__titulo { color: var(--vsau-primary); font-size: var(--vsau-h-s); font-weight: 600; line-height: 1.2; }
.vsau-contacto__texto { color: var(--vsau-text); font-size: 16px; line-height: 1.6; }
.vsau-contacto__texto a { color: var(--vsau-primary); font-weight: 700; text-decoration: underline; overflow-wrap: anywhere; }

/* Encaje en las plantillas de Impreza (Figma: 24 px entre título, firma y categorías; 16 px tras «Volver», que mide 36) */
.w-post-elm.post_title ~ .vsau-firma { margin: 24px 0; } /* el margen inferior del título (8) colapsa con este */
.w-btn-wrapper + .vsau-ficha { margin-top: 26px; }

/* Utilidades para la plantilla */
.vsau-mt-32 { margin-top: 32px; }

@media (prefers-reduced-motion: reduce) {
	.vsau-link .vsau-ico, .vsau-link, .vsau-social { transition: none; }
}