/*
 * Equipe: avatar com foto, topo da página do corretor e a carteira dele. A
 * página da equipe e o bloco do corretor na ficha vêm nas seções seguintes.
 *
 * Arquivo próprio em vez de mais um trecho no imob-layout.css, que já passa de
 * 49 KB: tudo o que é da equipe muda junto e vive junto.
 */

/* ---- Avatar ---- */

/* Com foto: a foto ocupa o círculo, os anéis do avatar continuam. */
.imob-avatar--foto {
	overflow: hidden;
	background: var(--imob-azul-palido);
}

.imob-avatar__foto {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: inherit;
}

.imob-avatar--grande {
	width: 128px;
	height: 128px;
	font-size: var(--imob-h3);
	box-shadow: 0 0 0 4px #FFFFFF, 0 0 0 7px var(--imob-acao);
}

/* ---- Página do corretor ---- */

.imob-corretor-topo {
	background: var(--imob-bg);
	padding-top: var(--imob-space-xl);
}

.imob-corretor-topo__grade {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	gap: var(--imob-space-lg);
	align-items: center;
}

.imob-corretor-topo__sobretitulo {
	font-size: var(--imob-caption);
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--imob-apoio);
}

.imob-corretor-topo__nome {
	margin-top: var(--imob-space-xs);
	font-size: var(--imob-h1);
	line-height: var(--imob-h1-lh);
	letter-spacing: -0.02em;
}

.imob-corretor-topo__especialidade {
	margin-top: var(--imob-space-xs);
	font-size: var(--imob-body-lg);
	font-weight: 600;
	color: var(--imob-tinta);
}

.imob-corretor-topo__creci {
	margin-top: var(--imob-space-xs);
	font-size: var(--imob-caption);
	color: var(--imob-apoio);
}

.imob-corretor-topo__bio {
	margin-top: var(--imob-space-md);
	max-width: var(--imob-medida);
	color: var(--imob-apoio);
	line-height: 1.6;
}

.imob-corretor-topo__bio p + p {
	margin-top: var(--imob-space-sm);
}

.imob-corretor-topo .imob-botao {
	margin-top: var(--imob-space-md);
}

.imob-corretor-carteira__titulo {
	margin-bottom: var(--imob-space-lg);
	font-size: var(--imob-h3);
	line-height: var(--imob-h3-lh);
}

.imob-corretor-carteira__vazio a {
	color: var(--imob-acao-hover);
	text-decoration: underline;
}

@media (max-width: 640px) {
	.imob-corretor-topo__grade {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* ---- Página da equipe ---- */

.imob-equipe__grade {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 16rem), 1fr));
	gap: var(--imob-space-lg);
}

.imob-pessoa {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--imob-space-xs);
	padding: var(--imob-space-xl) var(--imob-space-lg) var(--imob-space-lg);
	text-align: center;
	background: var(--imob-surface);
	border: 1px solid var(--imob-outline);
	border-radius: var(--imob-radius-lg);
	box-shadow: var(--imob-shadow-card);
	transition: transform var(--imob-transicao), box-shadow var(--imob-transicao);
}

.imob-pessoa:hover,
.imob-pessoa:focus-within {
	transform: translateY(-4px);
	box-shadow: var(--imob-shadow-card-hover);
}

.imob-pessoa .imob-avatar {
	margin-bottom: var(--imob-space-sm);
}

.imob-pessoa__nome {
	font-size: var(--imob-h4);
	line-height: var(--imob-h4-lh);
}

.imob-pessoa__link {
	color: inherit;
	text-decoration: none;
}

/* (0,2,0): vence o a:hover do tema pai, que pintaria o nome de outra cor. */
.imob-pessoa__link:hover {
	color: var(--imob-acao-hover);
}

.imob-pessoa__link::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
}

.imob-pessoa__link:focus-visible {
	outline: none;
}

.imob-pessoa:has(.imob-pessoa__link:focus-visible) {
	outline: 3px solid var(--imob-acao);
	outline-offset: 3px;
}

.imob-pessoa__especialidade {
	font-weight: 600;
	color: var(--imob-tinta);
}

.imob-pessoa__creci,
.imob-pessoa__carteira {
	font-size: var(--imob-caption);
	color: var(--imob-apoio);
}

.imob-pessoa__carteira {
	margin-top: var(--imob-space-sm);
}

.imob-equipe__vazio {
	color: var(--imob-apoio);
}

@media (prefers-reduced-motion: reduce) {
	.imob-pessoa {
		transition: none;
	}

	.imob-pessoa:hover,
	.imob-pessoa:focus-within {
		transform: none;
	}
}

/* ---- Ficha: corretor responsável ---- */

.imob-corretor__rotulo,
.imob-corretor__nome,
.imob-corretor__papel {
	display: block;
}

.imob-corretor__rotulo {
	font-size: var(--imob-caption);
	color: var(--imob-apoio);
}

/* (0,2,1) no hover: vence o a:hover do tema pai. */
a.imob-corretor__nome {
	color: var(--imob-tinta);
	text-decoration: none;
}

a.imob-corretor__nome:hover,
a.imob-corretor__nome:focus-visible {
	color: var(--imob-acao-hover);
	text-decoration: underline;
}
