.accordion {
	max-width: 600px;
	margin: 2rem auto;
	font-family: system-ui, sans-serif;
}

/* --- estilização do summary (título do accordion) --- */
.accordion summary {
	cursor: pointer;
	padding: 14px 16px;
	font-size: 18px; /* &lt;-- tamanho da fonte */
	color: #1f2568; /* &lt;-- cor do texto */
	font-weight: bold;
	background: #f3f4f6; /* fundo */
	border-radius: 8px;
	margin-bottom: 8px;
	transition: background .2s, color .2s;
}

.accordion summary:hover {
	background: #e5e7eb; /* muda fundo ao passar o mouse */
	color: #c6870d; /* muda cor da fonte */
}

/* --- ícone com CSS puro (abre/fecha) --- */
.accordion summary::after {
	content: &quot;
	float: right;
	transition: transform .2s;
}

.accordion details[open] summary::after {
	content: &quot;
}

/* --- conteúdo do accordion --- */
.accordion .content {
	padding: 0 16px 12px 16px;
	font-size: 16px; /* tamanho da fonte do conteúdo */
	color: #374151; /* cor do texto do conteúdo */
	animation: fade .25s ease;
}

@keyframes fade {

	from {
		opacity: 0;
		transform: translateY(-4px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}

}