style(tipografia): adiciona fonte America Medium e padroniza pesos de texto

Adiciona os arquivos `america-medium.woff2` e `america-bold.woff2` e
registra o weight 500 no `font_index.ts`.

Padroniza o uso de `font-medium` em substituição a `font-semibold` e
`font-bold` em títulos, valores monetários e rótulos de destaque em
todos os componentes do app, landing page e componentes de UI base.

`Card` ganha `hover:border-primary/40` e `CardTitle` recebe `text-base`.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

src/features/payers/components/details/payer-card-usage-card.tsx

@@ -43,7 +43,7 @@ export function PayerCardUsageCard({ items }: PagadorCardUsageCardProps) {
 											className="h-full w-full object-contain"
 										/>
 									) : (
-										<span className="text-sm font-semibold uppercase text-muted-foreground">
+										<span className="text-sm font-medium uppercase text-muted-foreground">
 											{initials}
 										</span>
 									)}

src/features/payers/components/details/payer-header-card.tsx

@@ -118,7 +118,7 @@ export function PayerHeaderCard({
 
 					<div className="flex flex-1 flex-col gap-2">
 						<div className="flex flex-wrap items-center gap-2">
-							<CardTitle className="text-xl font-semibold text-foreground">
+							<CardTitle className="text-xl font-medium text-foreground">
 								{payer.name}
 							</CardTitle>
 							{isAdmin ? (
@@ -197,11 +197,11 @@ export function PayerHeaderCard({
 							<DialogTitle>Confirmar envio do resumo</DialogTitle>
 							<DialogDescription>
 								Resumo de{" "}
-								<span className="font-semibold text-foreground">
+								<span className="font-medium text-foreground">
 									{summary.periodLabel}
 								</span>{" "}
 								para{" "}
-								<span className="font-semibold text-foreground">
+								<span className="font-medium text-foreground">
 									{payer.email}
 								</span>
 							</DialogDescription>
@@ -218,7 +218,7 @@ export function PayerHeaderCard({
 											<p className="text-sm font-medium text-muted-foreground">
 												Total de Despesas
 											</p>
-											<p className="text-2xl font-bold text-foreground">
+											<p className="text-2xl font-medium text-foreground">
 												{formatCurrency(summary.totalExpenses)}
 											</p>
 										</div>
@@ -235,11 +235,11 @@ export function PayerHeaderCard({
 								<div className="rounded-lg border p-3">
 									<div className="mb-2 flex items-center gap-2 text-muted-foreground">
 										<RiBankCard2Line className="size-4" />
-										<span className="text-xs font-semibold uppercase">
+										<span className="text-xs font-medium uppercase">
 											Cartões
 										</span>
 									</div>
-									<p className="text-lg font-bold text-foreground">
+									<p className="text-lg font-medium text-foreground">
 										{formatCurrency(summary.paymentSplits.card)}
 									</p>
 								</div>
@@ -247,11 +247,11 @@ export function PayerHeaderCard({
 								<div className="rounded-lg border p-3">
 									<div className="mb-2 flex items-center gap-2 text-muted-foreground">
 										<RiBillLine className="size-4" />
-										<span className="text-xs font-semibold uppercase">
+										<span className="text-xs font-medium uppercase">
 											Boletos
 										</span>
 									</div>
-									<p className="text-lg font-bold text-foreground">
+									<p className="text-lg font-medium text-foreground">
 										{formatCurrency(summary.paymentSplits.boleto)}
 									</p>
 								</div>
@@ -259,11 +259,11 @@ export function PayerHeaderCard({
 								<div className="rounded-lg border p-3">
 									<div className="mb-2 flex items-center gap-2 text-muted-foreground">
 										<RiExchangeDollarLine className="size-4" />
-										<span className="text-xs font-semibold uppercase">
+										<span className="text-xs font-medium uppercase">
 											Pix/Débito
 										</span>
 									</div>
-									<p className="text-lg font-bold text-foreground">
+									<p className="text-lg font-medium text-foreground">
 										{formatCurrency(summary.paymentSplits.instant)}
 									</p>
 								</div>
@@ -274,7 +274,7 @@ export function PayerHeaderCard({
 									<div className="rounded-lg border p-3">
 										<div className="mb-2 flex items-center gap-2">
 											<RiBankCard2Line className="size-4 text-muted-foreground" />
-											<span className="text-xs font-semibold uppercase text-muted-foreground">
+											<span className="text-xs font-medium uppercase text-muted-foreground">
 												Cartões Utilizados
 											</span>
 										</div>
@@ -299,14 +299,14 @@ export function PayerHeaderCard({
 									<div className="rounded-lg border p-3">
 										<div className="mb-2 flex items-center gap-2">
 											<RiBillLine className="size-4 text-muted-foreground" />
-											<span className="text-xs font-semibold uppercase text-muted-foreground">
+											<span className="text-xs font-medium uppercase text-muted-foreground">
 												Status de Boletos
 											</span>
 										</div>
 										<div className="grid gap-2 sm:grid-cols-2">
 											<div>
 												<p className="text-xs text-muted-foreground">Pagos</p>
-												<p className="text-sm font-semibold text-success">
+												<p className="text-sm font-medium text-success">
 													{formatCurrency(summary.boletoStats.paidAmount)}{" "}
 													<span className="text-xs font-normal">
 														({summary.boletoStats.paidCount})
@@ -317,7 +317,7 @@ export function PayerHeaderCard({
 												<p className="text-xs text-muted-foreground">
 													Pendentes
 												</p>
-												<p className="text-sm font-semibold text-warning">
+												<p className="text-sm font-medium text-warning">
 													{formatCurrency(summary.boletoStats.pendingAmount)}{" "}
 													<span className="text-xs font-normal">
 														({summary.boletoStats.pendingCount})

src/features/payers/components/details/payer-history-card.tsx

@@ -50,7 +50,7 @@ const ValueLabel = (props: LabelProps) => {
 			y={labelY}
 			fill="currentColor"
 			textAnchor="middle"
-			className="text-[11px] font-semibold text-muted-foreground"
+			className="text-xs font-medium text-muted-foreground"
 		>
 			{amount}
 		</text>
@@ -63,7 +63,7 @@ export function PayerHistoryCard({ data }: PagadorHistoryCardProps) {
 	return (
 		<Card className="border">
 			<CardHeader className="gap-1.5 pb-3">
-				<CardTitle className="text-lg font-semibold">
+				<CardTitle className="text-lg font-medium">
 					Evolução (últimos 6 meses)
 				</CardTitle>
 				<p className="text-xs text-muted-foreground">

src/features/payers/components/details/payer-info-card.tsx

@@ -31,7 +31,7 @@ export function PagadorInfoCard({ payer }: PayerInfoCardProps) {
 	return (
 		<Card className="border gap-4">
 			<CardHeader className="gap-1.5">
-				<CardTitle className="text-lg font-semibold">
+				<CardTitle className="text-lg font-medium">
 					Detalhes do pagador
 				</CardTitle>
 				<CardDescription>
@@ -79,7 +79,7 @@ export function PagadorInfoCard({ payer }: PayerInfoCardProps) {
 					<InfoItem
 						label="Aviso"
 						value={
-							<span className="text-[13px] text-warning">
+							<span className="text-sm text-warning">
 								Cadastre um e-mail para permitir o envio automático.
 							</span>
 						}
@@ -118,7 +118,7 @@ type InfoItemProps = {
 function InfoItem({ label, value, className }: InfoItemProps) {
 	return (
 		<div className={cn("space-y-1", className)}>
-			<span className="text-xs font-semibold uppercase tracking-wide text-muted-foreground/80">
+			<span className="text-xs font-medium uppercase tracking-wide text-muted-foreground/80">
 				{label}
 			</span>
 			<div className="text-base text-foreground">{value}</div>

src/features/payers/components/details/payer-leave-share-card.tsx

@@ -53,7 +53,7 @@ export function PayerLeaveShareCard({
 	return (
 		<Card className="border">
 			<CardHeader>
-				<CardTitle className="text-base font-semibold">
+				<CardTitle className="text-base font-medium">
 					Acesso Compartilhado
 				</CardTitle>
 				<p className="text-sm text-muted-foreground">
@@ -63,7 +63,7 @@ export function PayerLeaveShareCard({
 			</CardHeader>
 			<CardContent className="space-y-4">
 				<div className="flex flex-col gap-2 rounded-lg border border-dashed p-4 text-sm">
-					<span className="text-xs font-semibold uppercase text-muted-foreground/80">
+					<span className="text-xs font-medium uppercase text-muted-foreground/80">
 						Informações do compartilhamento
 					</span>
 					<div className="flex flex-col gap-1">

src/features/payers/components/details/payer-monthly-summary-card.tsx

@@ -51,7 +51,7 @@ export function PayerMonthlySummaryCard({
 	return (
 		<Card>
 			<CardHeader className="flex flex-col gap-1.5">
-				<CardTitle className="text-lg font-semibold">Totais do mês</CardTitle>
+				<CardTitle className="text-lg font-medium">Totais do mês</CardTitle>
 				<p className="text-xs text-muted-foreground">
 					{periodLabel} - Despesas por forma de pagamento
 				</p>
@@ -65,7 +65,7 @@ export function PayerMonthlySummaryCard({
 						</span>
 						<MoneyValues
 							amount={breakdown.totalExpenses}
-							className="block text-2xl font-semibold text-foreground"
+							className="block text-2xl font-medium text-foreground"
 						/>
 					</div>
 
@@ -100,7 +100,7 @@ export function PayerMonthlySummaryCard({
 							totalBase > 0 ? Math.round((entry.value / totalBase) * 100) : 0;
 						return (
 							<div key={entry.key} className="space-y-1 rounded-lg border p-3">
-								<span className="flex items-center gap-2 text-[11px] font-semibold uppercase tracking-wide text-muted-foreground/70">
+								<span className="flex items-center gap-2 text-xs font-medium uppercase tracking-wide text-muted-foreground/70">
 									<span
 										className={cn("size-2 rounded-full", entry.color)}
 										aria-hidden
@@ -109,7 +109,7 @@ export function PayerMonthlySummaryCard({
 								</span>
 								<MoneyValues
 									amount={entry.value}
-									className="block text-lg font-semibold text-foreground"
+									className="block text-lg font-medium text-foreground"
 								/>
 								<span className="text-xs text-muted-foreground">
 									{percent}% das despesas

src/features/payers/components/details/payer-sharing-card.tsx

@@ -84,9 +84,7 @@ export function PayerSharingCard({
 	return (
 		<Card className="border">
 			<CardHeader>
-				<CardTitle className="text-lg font-semibold">
-					Compartilhamentos
-				</CardTitle>
+				<CardTitle className="text-lg font-medium">Compartilhamentos</CardTitle>
 				<p className="text-sm text-muted-foreground">
 					Compartilhe o código abaixo com outra pessoa. Ela poderá adicioná-lo
 					na página de pagadores usando a opção Adicionar por código para ter
@@ -95,7 +93,7 @@ export function PayerSharingCard({
 			</CardHeader>
 			<CardContent className="space-y-4">
 				<div className="flex flex-col gap-2 rounded-lg border border-dashed p-4 text-sm">
-					<span className="text-xs font-semibold uppercase text-muted-foreground/80">
+					<span className="text-xs font-medium uppercase text-muted-foreground/80">
 						Código de compartilhamento
 					</span>
 					<div className="flex flex-wrap items-center gap-2">

src/features/payers/components/payer-card.tsx

@@ -42,7 +42,7 @@ export function PayerCard({ payer, onEdit, onRemove }: PayerCardProps) {
 
 				{/* Nome e badges */}
 				<div className="flex items-center gap-1.5">
-					<h3 className="text-base font-semibold text-foreground">
+					<h3 className="text-base font-medium text-foreground">
 						{payer.name}
 					</h3>
 					{isAdmin ? (