/*
 * Cabeçalho global e marca (T4.2). Botão e ícones: components/button.css. Medidas: tokens.css (01-home-base-escolhida.png, 1003 px).
 * Desktop (≥ 960px): marca | menu centralizado | botão. Abaixo: marca + botão "Menu"; menu e botão num painel.
 */

/* Marca */
.brand {
	display: inline-flex;
	align-items: center;
	gap: var(--fa-brand-gap);
	color: var(--fa-color-heading);
	text-decoration: none;
}

.brand__logo {
	flex: none;
	width: var(--fa-logo-size);
	height: var(--fa-logo-size);
	object-fit: contain;                  /* símbolo com fundo transparente (docs/01-design/brand) */
}

.brand__name {
	display: block;
	font-family: var(--fa-font-heading);
	font-size: var(--fa-size-brand-name);
	font-weight: var(--fa-weight-heading);
	line-height: 0.95;
	text-transform: uppercase;
}

.brand__name-rest {
	display: block;
	white-space: nowrap;
}

.brand__tagline {
	display: block;
	max-width: 13.5em;                    /* em 12 px o slogan quebra em duas linhas sob o nome */
	margin-top: 5px;
	color: var(--fa-color-link);
	font-size: var(--fa-size-brand-tagline);
	line-height: 1.3;
}

/* Cabeçalho */
.site-header {
	position: relative;
	z-index: 10;
	background: var(--fa-color-surface);
}

.site-header__inner {
	display: flex;
	align-items: center;
	gap: var(--fa-nav-gap);
	max-width: calc(var(--fa-header-max) + 2 * var(--fa-gutter));
	margin: 0 auto;
	padding: 8px var(--fa-gutter) 7px;
}

.site-header__toggle {
	display: none;
}

.site-header__panel {
	display: flex;
	flex: 1;
	align-items: center;
	gap: var(--fa-nav-gap);
}

.site-nav {
	margin: 0 auto;
}

.site-nav__list {
	display: flex;
	gap: var(--fa-nav-item-gap);
	margin: 0;
	padding: 0;
	list-style: none;
}

.site-nav__list a {
	display: block;
	padding: 6px 0 9px;
	border-bottom: var(--fa-nav-underline) solid transparent;
	color: var(--fa-color-heading);
	font-size: var(--fa-size-nav);
	font-weight: var(--fa-weight-nav);
	line-height: 1.3;
	text-decoration: none;
	white-space: nowrap;
}

.site-nav__list a:hover {
	color: var(--fa-color-link);
}

.site-nav__list .current-menu-item > a,
.site-nav__list a[aria-current="page"] {
	border-bottom-color: var(--fa-color-link);
	color: var(--fa-color-link);
	font-weight: var(--fa-weight-strong);
}

/* Telas estreitas: menu por botão (sem referência aprovada; adaptação para revisão de Tiago). */
@media (max-width: 959px) {
	.site-header__inner {
		flex-wrap: wrap;
		justify-content: space-between;
	}

	.site-header__toggle {
		display: inline-flex;
		align-items: center;
		gap: 8px;
		min-height: 44px;
		padding: 0 14px;
		border: var(--fa-border-width) solid var(--fa-color-border);
		border-radius: var(--fa-radius-pill);
		background: var(--fa-color-surface);
		color: var(--fa-color-heading);
		font: var(--fa-weight-strong) var(--fa-size-button) / 1 var(--fa-font-body);
		cursor: pointer;
	}

	.site-header__toggle-bars,
	.site-header__toggle-bars::before,
	.site-header__toggle-bars::after {
		display: block;
		width: 16px;
		height: 2px;
		background: currentColor;
	}

	.site-header__toggle-bars {
		position: relative;
	}

	.site-header__toggle-bars::before,
	.site-header__toggle-bars::after {
		position: absolute;
		left: 0;
		content: "";
	}

	.site-header__toggle-bars::before {
		top: -5px;
	}

	.site-header__toggle-bars::after {
		top: 5px;
	}

	.site-header__toggle[aria-expanded="true"] .site-header__toggle-bars {
		background: transparent;
	}

	.site-header__toggle[aria-expanded="true"] .site-header__toggle-bars::before {
		top: 0;
		transform: rotate(45deg);
	}

	.site-header__toggle[aria-expanded="true"] .site-header__toggle-bars::after {
		top: 0;
		transform: rotate(-45deg);
	}

	.site-header__panel {
		flex: 1 0 100%;
		flex-direction: column;
		align-items: stretch;
		gap: 12px;
		padding: 8px 0 16px;
	}

	/* Sem JavaScript o painel fica aberto; com JavaScript, só quando o botão está expandido. */
	.js .site-header__panel:not(.is-open) {
		display: none;
	}

	.site-nav {
		margin: 0;
	}

	.site-nav__list {
		flex-direction: column;
		gap: 0;
	}

	.site-nav__list a {
		display: flex;
		align-items: center;
		min-height: 44px;
		padding: 0;
		border-bottom: var(--fa-border-width) solid var(--fa-color-border);
		font-size: var(--fa-size-body);
	}

	.site-nav__list .current-menu-item > a,
	.site-nav__list a[aria-current="page"] {
		border-bottom-color: var(--fa-color-border);
		box-shadow: inset var(--fa-nav-underline) 0 0 var(--fa-color-link);
		padding-left: 10px;
	}

	.site-header__cta {
		align-self: flex-start;
	}
}

/* Telas muito estreitas: marca e botão na mesma linha (logo menor; "Menu" só para leitores de tela). */
@media (max-width: 400px) {
	.site-header__inner {
		gap: 12px;
	}

	.site-header .brand__logo {
		width: 52px;
		height: 52px;
	}

	.site-header__toggle {
		padding: 0 14px;
	}

	.site-header__toggle-label {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip-path: inset(50%);
		white-space: nowrap;
	}
}

@media (max-width: 359px) {
	.site-header .brand__tagline {
		display: none;
	}
}