/**
 * Widget "Introdução de Página" (widgets/pagina-intro.php)
 *
 * Valores conferidos contra `.intro` dos mockups aprovados.
 */

.fjpn-intro {
	background: var(--fjpn-intro-secao-bg, transparent);
	padding-block: var(--fjpn-space-section-py-sm);
}

/* A largura máxima vem do painel (controle "Largura máxima do bloco"), que já
   nasce com os 980px do modelo. Aqui fica só o que não é configurável. */
.fjpn-intro__bloco {
	max-width: 980px;
}

.fjpn-intro__eyebrow {
	display: block;
	margin-bottom: var(--fjpn-gap-icon-text);
	font-family: var(--fjpn-font-sans);
	font-size: var(--fjpn-text-eyebrow);
	font-weight: var(--fjpn-weight-bold);
	text-transform: uppercase;
	letter-spacing: 0.02em;
	color: var(--fjpn-intro-eyebrow, var(--fjpn-orange-primary));
}

/* No modelo o título da introdução é maior que o das demais seções (36px
   contra 34px) — é a abertura da página e carrega mais peso. */
.fjpn-intro__titulo {
	margin: 0 0 18px;
	font-family: var(--fjpn-font-sans);
	font-size: var(--fjpn-text-heading-lg);
	font-weight: var(--fjpn-weight-bold);
	line-height: 1.26;
	color: var(--fjpn-intro-titulo, var(--fjpn-text-primary));
}

@media (min-width: 800px) {
	.fjpn-intro__titulo {
		font-size: var(--fjpn-text-heading-lg-md);
	}
}

.fjpn-intro__texto {
	font-family: var(--fjpn-font-sans);
	font-size: var(--fjpn-text-body);
	line-height: 1.72; /* medida do modelo, mais aberta que a do corpo padrão */
	color: var(--fjpn-intro-texto, var(--fjpn-text-muted));
}

/* O editor rico devolve os próprios <p>: o espaçamento fica entre eles e as
   margens das pontas são zeradas para o bloco não descolar do título. */
.fjpn-intro__texto p {
	margin: 0 0 14px; /* valor do modelo */
}

.fjpn-intro__texto > :first-child {
	margin-top: 0;
}

.fjpn-intro__texto > :last-child {
	margin-bottom: 0;
}

.fjpn-intro__texto a {
	color: var(--fjpn-blue-primary);
	text-decoration: underline;
}

/* Lista dentro da introdução precisa de recuo próprio: o reset do tema zera o
   padding de <ul>/<ol>, e sem isto os marcadores ficam fora do bloco. */
.fjpn-intro__texto ul,
.fjpn-intro__texto ol {
	margin: 0 0 14px;
	padding-inline-start: 1.25rem;
}