/* Cabecera de la PÁGINA de autor (andamiaje propio, per-page como article/section).
   El listado reutiliza ParaTi (portada.css). El CSS lo lleva el usuario: punto de
   partida, ajústalo a tu gusto. Nota: distinta de author.css (la ficha del detalle). */
.author-hero {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 36px;
	align-items: start;
	border-top: 3px solid var(--lv-blue);
	padding-top: 28px;
	margin-bottom: 30px;
}
.author-hero__photo {
	width: 132px;
	height: 132px;
	border-radius: 50%;
	overflow: hidden;
	background: var(--paper-2);
	border: 1px solid var(--hair);
	display: grid;
	place-items: center;
}
.author-hero__photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.author-hero__initials {
	font-family: var(--f-sans);
	font-size: var(--fs-32);
	font-weight: 600;
	color: var(--lv-blue);
}
.author-hero__body {
	max-width: 760px;
	padding-top: 6px;
}
.author-hero__name {
	margin: 0;
	font-family: var(--f-headline);
	font-weight: 600;
	font-size: var(--fs-38);
	line-height: 1.04;
	letter-spacing: -0.01em;
	color: var(--lv-blue);
}
.author-hero__role {
	margin-top: 8px;
	font-family: var(--f-sans);
	font-size: var(--fs-12);
	font-weight: 600;
	letter-spacing: var(--letter-spacing-kicker);
	text-transform: uppercase;
	color: var(--lv-blue);
}
.author-hero__bio {
	margin: 14px 0 0;
	font-family: var(--f-headline);
	font-size: var(--fs-18);
	font-weight: 100;
	line-height: 1.45;
	color: var(--deck);
	text-wrap: pretty;
}
.author-hero__socials {
	display: flex;
	gap: 10px;
	margin-top: 22px;
	padding-top: 20px;
	border-top: 1px solid var(--hair);
}
.author-hero__social {
	width: 38px;
	height: 38px;
	border-radius: 50%;
	border: 1px solid var(--hair);
	display: grid;
	place-items: center;
	color: var(--ink);
	transition:
		border-color 0.15s,
		color 0.15s;
}
.author-hero__social:hover {
	border-color: var(--lv-blue);
	color: var(--lv-blue);
}
.author-hero__social svg {
	width: 17px;
	height: 17px;
}
@media (max-width: 760px) {
	.author-hero {
		grid-template-columns: 1fr;
		gap: 18px;
		margin-bottom: 22px;
	}
	.author-hero__photo {
		width: 92px;
		height: 92px;
	}
	.author-hero__name {
		font-size: var(--fs-30);
	}
	.author-hero__bio {
		font-size: var(--fs-16);
	}
}