/*
Theme Name: LN Carreira
Theme URI: https://lncarreira.com.br
Author: LN Carreira
Description: Block Theme (FSE) institucional da LN Carreira — Consultoria de Gestão de Pessoas.
Requires at least: 6.4
Tested up to: 6.7
Requires PHP: 8.1
Version: 1.4.3
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: ln-carreira
*/

/* Evita quebra de linha "feia" em títulos display */
.wp-block-heading {
	text-wrap: balance;
}

main {
    margin-block-start: 0;
}

/* Coluna "Nesta página": borda separando do texto principal, como no mockup */
@media (min-width: 782px) {
	.ln-nesta-pagina-col {
		border-left: 1px solid #E2E0E0;
		padding-left: 2rem;
	}
}

/* Índice "Nesta página": cada item tem um traço curto antes do link (cor da
   borda), link em cinza-marca e hover vermelho, como no mockup. */
.ln-toc {
	list-style: none;
	padding-left: 0;
	margin: 0;
}

.ln-toc li {
	margin-bottom: 0.75rem;
}

.ln-toc li:last-child {
	margin-bottom: 0;
}

.ln-toc a {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	color: #4C4C4B;
	text-decoration: none;
	transition: color 0.2s ease;
}

.ln-toc a::before {
	content: "";
	display: block;
	width: 1.5rem;
	height: 1px;
	background-color: #E2E0E0;
	flex-shrink: 0;
	transition: background-color 0.2s ease;
}

.ln-toc a:hover {
	color: #B11E23;
}

.ln-toc a:hover::before {
	background-color: #B11E23;
}

/* Linha fina full-width logo abaixo do hero de "A LN Carreira" */
.ln-hairline {
	height: 1px;
	background-color: #E2E0E0;
}

/* Números das estatísticas nunca devem quebrar no meio (ex: "+3.000") */
.ln-stats-numbers .wp-block-column>p:first-child {
	white-space: nowrap;
}

/*
 * Títulos serifados usam Georgia (o mockup cita "Instrument Serif" mas renderiza
 * Georgia). Mantemos font-weight 400 para não gerar faux-bold nos h1-h3.
 */
.has-instrument-serif-font-family {
	font-weight: 400;
}

/* Hero full-bleed: imagem cobre a seção inteira, conteúdo alinhado à base */
.ln-hero {
	position: relative;
	overflow: hidden;
	min-height: 92vh;
	display: flex;
	align-items: flex-end;
}

/* Vinheta em 3 paradas (clara no topo, escura na base) para manter o texto branco legível */
.ln-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(to bottom, rgba(0, 0, 0, 0.15) 0%, rgba(0, 0, 0, 0.55) 60%, rgba(0, 0, 0, 0.85) 100%);
	z-index: 0;
}

.ln-hero>.wp-block-group {
	position: relative;
	z-index: 1;
	width: 100%;
}

@media (max-width: 782px) {
	.ln-hero {
		min-height: 85vh;
	}
}

/* 1 coluna no mobile, 2 em ≥600px, 4 em ≥782px, como no mockup (sm:grid-cols-2 lg:grid-cols-4) */
.ln-stats-numbers {
	display: grid !important;
	grid-template-columns: 1fr;
	gap: 2rem;
}

@media (min-width: 600px) {
	.ln-stats-numbers {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (min-width: 782px) {
	.ln-stats-numbers {
		grid-template-columns: repeat(4, 1fr);
	}
}

/* Home: grade 2x2 já no mobile, como o mockup do bloco BIGNUMBERS */
.ln-stats-numbers--home {
	grid-template-columns: repeat(2, 1fr);
	gap: 2.5rem 1.25rem;
}

@media (min-width: 782px) {
	.ln-stats-numbers--home {
		gap: 2rem;
	}
}

@media (max-width: 781px) {
	/* remove a divisória vertical dos itens na coluna da direita (2º e 4º) */
	.ln-stats-numbers--home > .wp-block-column:nth-child(2n) {
		border-right: 0 !important;
	}

	/* padding compacto para dar respiro à divisória central no mobile */
	.ln-stats-numbers--home > .wp-block-column {
		padding: 0.25rem 0.75rem !important;
	}
}

/* Cards de "Soluções": realce de borda + leve elevação no hover, como no mockup (.card-soft) */
.ln-card-soft {
	transition: border-color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
}

.ln-card-soft:hover {
	border-color: #B11E23 !important;
	transform: translateY(-2px);
	box-shadow: 0 12px 40px -20px rgba(177, 30, 35, 0.25);
}

/* Botões em formato pill (hero, quote-cta) */
.ln-btn-pill .wp-block-button__link {
	border-radius: 999px;
	padding: 0.85rem 1.6rem;
}

/* CTAs "Conheça mais →" com área de clique e alinhamento de ícone consistentes com o mockup */
.ln-btn-ghost {
	display: inline-flex;
	align-items: center;
	gap: 0.6rem;
	padding: 0.85rem 1.4rem;
	font-size: 0.875rem;
	font-weight: 500;
	text-decoration: none;
}

/* Nos cards de "Soluções" o CTA "Conheça mais" é um link sublinhado sem
   padding (como no mockup: .btn-ghost !p-0 !border-primary), não um botão. */
.ln-card-soft .ln-btn-ghost {
	padding: 0;
	border-bottom: 1px solid currentColor;
	transition: gap 0.25s ease;
}

.ln-card-soft .ln-btn-ghost:hover {
	gap: 1rem;
}

/* Grid de "diferenciais": 1 coluna no mobile, 2 no tablet, 3 no desktop, como no mockup
   (md:grid-cols-2 lg:grid-cols-3), sem cards/bordas. */
.ln-diferenciais-grid {
	display: grid !important;
	grid-template-columns: 1fr;
	column-gap: 3rem;
	row-gap: 2.5rem;
}

@media (min-width: 600px) {
	.ln-diferenciais-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (min-width: 960px) {
	.ln-diferenciais-grid {
		grid-template-columns: repeat(3, 1fr);
	}
}

/* Régua curta acima do título de cada item de diferencial (largura fixa, cor de marca) */
.ln-diferencial-numero-rule {
	display: block;
	height: 1px;
	width: 2.5rem;
	background-color: #B11E23;
}

/* Diferenciais na página "A LN Carreira": lista em 2 colunas (md+), número
   visível à esquerda, sem cards nem linhas — pattern dedicado ln-carreira/diferenciais-sobre. */
.ln-diferenciais-sobre-grid {
	display: grid !important;
	grid-template-columns: 1fr;
	column-gap: 3rem;
	row-gap: 2.5rem;
}

@media (min-width: 768px) {
	.ln-diferenciais-sobre-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

.ln-diferencial-sobre-item {
	display: flex;
	flex-wrap: nowrap;
	gap: 1.5rem;
	align-items: flex-start;
}

.ln-diferencial-sobre-numero {
	width: 2.5rem;
	flex-shrink: 0;
}

/* Grade Visão/Missão/Valores: 3 colunas com filete de 1px entre os cards
   (fundo translúcido claro atrás da grade, como bg-background/15 do mockup). */
.ln-vmv-grid {
	display: grid !important;
	grid-template-columns: 1fr;
	gap: 1px;
	background-color: rgba(255, 255, 255, 0.15);
}

@media (min-width: 782px) {
	.ln-vmv-grid {
		grid-template-columns: repeat(3, 1fr);
	}
}

.ln-vmv-grid>.wp-block-column {
	margin: 0 !important;
}

/* Mini-grade de 3 números na bio da fundadora: filete de 1px entre células */
.ln-bio-stats {
	display: grid !important;
	grid-template-columns: repeat(3, 1fr);
	gap: 1px;
	background-color: #E2E0E0;
	max-width: 32rem;
}

.ln-bio-stats>.wp-block-column {
	margin: 0 !important;
	background-color: #FFFFFF;
}

/* Grid do time: mesma técnica do grid de diferenciais (linhas finas de 1px entre células) */
.ln-time-grid {
	background-color: #E2E0E0;
	gap: 1px !important;
}

.ln-time-grid>.wp-block-column {
	background-color: #FFFFFF;
	display: flex;
	flex-direction: column;
}

.ln-team-phone {
	margin-top: auto;
	text-decoration: none;
}

.ln-team-phone:hover {
	color: #E52929 !important;
}

/* Header fixo com fundo translúcido e desfoque, como no protótipo */
.ln-header-sticky {
	position: sticky;
	top: 0;
	z-index: 50;
	background-color: rgba(255, 255, 255, 0.9);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
    border-bottom: 1px solid #333;
}

/* No mobile o backdrop-filter cria um bloco de contenção que "prende" o overlay
   fixo do menu dentro da altura do header (daí o overflow/scroll). Desliga no
   mobile e usa fundo sólido; o desfoque continua no desktop. */
@media (max-width: 768px) {
	.ln-header-sticky {
		backdrop-filter: none;
		-webkit-backdrop-filter: none;
		background-color: #fff;
	}
}

.ln-nav-links a {
	font-size: 13px;
	letter-spacing: 0.02em;
}

/* Item de menu da página atual: texto vermelho + traço embaixo, como no protótipo */
.ln-nav-links a.current-menu-item,
.ln-nav-links a[aria-current="page"] {
	color: #E52929;
	position: relative;
}

.ln-nav-links a.current-menu-item::after,
.ln-nav-links a[aria-current="page"]::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: -0.5rem;
	height: 2px;
	background-color: #E52929;
}

/* Cor dos ícones de redes sociais (estilo "apenas logo", sem fundo) */
.ln-social-header .wp-social-link {
	color: #4C4C4B;
}

.ln-header-row .wp-block-site-logo img {
	width: 112px;
	height: 79px;
	object-fit: contain;
}

ul.wp-block-social-links.ln-social-header {
	gap: 0.5rem;
}

.ln-social-footer .wp-social-link {
	color: #FFFFFF;
	border: 1px solid rgba(255, 255, 255, 0.3);
	border-radius: 999px;
	padding: 0.4rem !important;
}

.ln-social-footer .wp-social-link:hover {
	border-color: #FFFFFF;
	background-color: transparent;
}

footer {
	margin-block-start: 0;
}

footer .wp-block-site-logo img {
	background-color: white;
}

/* Navegação do footer em grid de 2 colunas x 3 linhas (preenchimento por coluna) */
.ln-footer-nav.wp-block-navigation .wp-block-navigation__container {
	display: grid;
	grid-template-columns: repeat(2, auto);
	grid-template-rows: repeat(3, auto);
	grid-auto-flow: column;
	column-gap: 2.5rem;
	row-gap: 0.6rem;
}

/* Links do footer herdam branco (cor de texto do grupo) em vez do vermelho global do tema;
   sem sublinhado no estado normal, sublinhado só no hover, sem trocar de cor. */
.wp-block-group.has-cinza-marca-background-color a {
	color: inherit;
	text-decoration: none;
}

.wp-block-group.has-cinza-marca-background-color a:hover {
	color: inherit;
	text-decoration: underline;
}

/* Header: logo + (menu + redes sociais) numa linha em telas largas;
   empilha em telas médias antes do menu virar hambúrguer (breakpoint do core em 600px). */
.ln-header-row {
	align-items: center;
	row-gap: 1rem;
}

.ln-header-nav-social {
	align-items: center;
	width: 80%;
}

/* Blocos social/botão aninhados no wp:navigation servem só o overlay mobile;
   no desktop quem aparece são os blocos irmãos (.ln-social-header / .ln-btn-pill). */
@media (min-width: 769px) {
	.ln-nav-links .ln-nav-overlay-social,
	.ln-nav-links .ln-nav-overlay-btn {
		display: none !important;
	}
}

@media (min-width: 769px) and (max-width: 960px) {
	.ln-header-row {
		justify-content: center;
		text-align: center;
	}

	.ln-header-nav-social {
		justify-content: center;
		width: 100%;
	}
}

/* Em telas pequenas: logo · botão "Fale com a LN" · hambúrguer numa única linha
   (como no protótipo). As redes sociais irmãs somem; o botão irmão permanece. */
@media (max-width: 768px) {
	ul.wp-block-social-links.ln-social-header {
		display: none !important;
	}

	.ln-header-row {
		justify-content: space-between;
		flex-wrap: nowrap;
	}

	.ln-header-nav-social {
		width: auto;
		flex: 0 0 auto;
		gap: 0.75rem;
	}

	/* Só os filhos diretos do header (não vaza para o <ul> interno da nav,
	   que também carrega a classe .ln-nav-links). */
	.ln-header-nav-social > .ln-btn-pill {
		order: 1;
	}

	.ln-header-nav-social > .ln-nav-links {
		order: 2;
		/* o core põe position:relative no <nav>; zerar para o painel/X do menu
		   aberto ancorarem no grupo constrained do header (largura/altura totais),
		   não no <nav> (que é só a caixa do hambúrguer). */
		position: static;
	}

	/* Ícone do menu com 3 riscos (o SVG do core tem só 2 barras). */
	.wp-block-navigation__responsive-container-open {
		width: 32px;
		height: 32px;
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cg stroke='%234C4C4B' stroke-width='2' stroke-linecap='round'%3E%3Cline x1='5' y1='10' x2='27' y2='10'/%3E%3Cline x1='5' y1='16' x2='27' y2='16'/%3E%3Cline x1='5' y1='22' x2='27' y2='22'/%3E%3C/g%3E%3C/svg%3E");
		background-repeat: no-repeat;
		background-position: center;
	}

	.wp-block-navigation__responsive-container-open svg {
		display: none;
	}

	/* O menu abre como um painel ancorado logo abaixo do header (nunca por cima).
	   O <header> é position:sticky, então já é o bloco de contenção dos filhos
	   position:absolute — o painel usa top:100% (= altura exata do header, sem
	   constante mágica; funciona também com a barra de admin empurrando tudo). */
	.ln-header-sticky {
		position: sticky;
		z-index: 100001;
		--ln-header-gutter: 0px; /* goteira lateral do header no mobile (medida: 0) */
	}

	/* Zera o posicionamento/animação do core: sem isso o container é fixed na
	   viewport e o X ancora no .responsive-dialog (position:relative do core). */
	.ln-nav-links .wp-block-navigation__responsive-container.is-menu-open,
	.ln-nav-links .is-menu-open .wp-block-navigation__responsive-close,
	.ln-nav-links .is-menu-open .wp-block-navigation__responsive-dialog {
		position: static !important;
		display: block;
		background: transparent;
		overflow: visible;
		max-width: none;
		margin: 0 !important;
		animation: none !important;
	}

	/* Com o menu aberto, some com o ícone de 3 riscos MAS mantém o espaço dele
	   (visibility, não display) para a linha do header não mudar de geometria e
	   o X cair exatamente sobre o mesmo ponto. */
	.ln-nav-links:has(.is-menu-open) .wp-block-navigation__responsive-container-open {
		visibility: hidden;
	}

	/* X exatamente na vaga do ☰: ancorado ao <header>, centralizado na vertical,
	   mesma distância da borda direita (goteira). */
	.ln-nav-links .is-menu-open .wp-block-navigation__responsive-container-close {
		position: absolute;
		top: 0;
		bottom: 0;
		right: var(--ln-header-gutter);
		width: 32px;
		height: auto;
		display: flex;
		align-items: center;
		justify-content: center;
		color: #4C4C4B;
		z-index: 41;
	}

	.ln-nav-links .is-menu-open .wp-block-navigation__responsive-container-close svg {
		width: 28px;
		height: 28px;
		fill: currentColor;
	}

	/* Painel = o próprio content, colado abaixo do header. */
	.ln-nav-links .is-menu-open .wp-block-navigation__responsive-container-content {
		position: absolute;
		top: calc(100% + 1px); /* +1px: borda inferior do header */
		left: 0;
		right: 0;
		z-index: 40;
		display: flex;
		flex-direction: column;
		align-items: stretch;
		gap: 1.25rem;
		padding: 0.5rem 1rem 1.5rem !important;
		background: #fff;
		box-shadow: 0 16px 24px -16px rgba(0, 0, 0, 0.25);
		max-height: calc(100dvh - 100% - 0.5rem);
		overflow-y: auto;
	}

	.ln-nav-links .is-menu-open .wp-block-navigation__container {
		order: 1;
		width: 100%;
		gap: 0;
		align-items: stretch;
	}

	/* Cada link enxuto, largura total, linha fina embaixo. */
	.ln-nav-links .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item {
		width: 100%;
		border-bottom: 1px solid rgba(0, 0, 0, 0.08);
	}

	.ln-nav-links .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item .wp-block-navigation-item__content {
		display: block;
		width: 100%;
		padding: 0.85rem 0;
		font-size: 1.0625rem;
	}

	.ln-nav-links .ln-nav-overlay-social {
		order: 2;
		width: 100%;
		justify-content: flex-start !important;
		gap: 1.25rem;
		margin-top: 0.5rem;
	}

	.ln-nav-links .ln-nav-overlay-social .wp-social-link {
		color: #4C4C4B;
		padding: 0;
	}

	/* Ícones ~24px (além do has-normal-icon-size no markup). */
	.ln-nav-links .ln-nav-overlay-social .wp-social-link svg {
		width: 24px;
		height: 24px;
	}

	/* Botão pill com largura de conteúdo, alinhado à esquerda (como no mockup). */
	.ln-nav-links .ln-nav-overlay-btn {
		order: 3;
		width: auto;
		justify-content: flex-start;
	}

	.ln-nav-links .ln-nav-overlay-btn .wp-block-button,
	.ln-nav-links .ln-nav-overlay-btn .wp-block-button__link {
		width: auto;
	}
}

/* Tabs de serviços 100% CSS (radio oculto + :checked ~): reproduz o layout
   lista+painel lado a lado do protótipo sem nenhum JS. O vínculo radio→label→painel
   é gerado inline por item em servicos-por-eixo.php (IDs dependem do post). */
.ln-servico-tabs {
	position: relative;
}

.ln-servico-tabs-radio {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.ln-servico-tabs-grid {
	display: grid;
	grid-template-columns: repeat(12, 1fr);
	gap: 1px;
	background-color: rgba(226, 224, 224, 0.4);
	border-radius: 2px;
	overflow: hidden;
}

.ln-servico-tabs-list {
	grid-column: span 4;
	display: flex;
	flex-direction: column;
}

.ln-servico-tabs-list.is-style-dark {
	background-color: transparent;
}

.ln-servico-tabs-list.is-style-light {
	background-color: #FEFEFE;
}

.ln-servico-tab-label {
	display: flex;
	align-items: center;
	gap: calc(.25rem * 4);
	min-height: 88px;
	padding: 1.25rem 1.5rem;
	cursor: pointer;
	color: inherit;
	transition: background-color 0.2s ease, color 0.2s ease;
	padding-block: calc(.25rem * 5);
    padding-inline: calc(.25rem * 6);
    flex: 1;
}

/* Seção escura ("Soluções para sua Empresa"): abas inativas em ink/60,
   texto branco 80%, hover ink/40 — igual ao mockup (bg-ink/60 → bg-ink/40). */
.ln-servico-tabs-list.is-style-dark .ln-servico-tab-label {
	background-color: color-mix(in oklab, #4c4c4b 60%, transparent);
	color: rgba(255, 255, 255, 0.8);
	border-bottom: 1px solid rgba(226, 224, 224, 0.3);
}

.ln-servico-tabs-list.is-style-dark .ln-servico-tab-label:hover {
	background-color: color-mix(in oklab, #4c4c4b 40%, transparent);
}

/* Seção creme ("Soluções para a sua Carreira"): abas inativas brancas,
   texto ink, hover creme. */
.ln-servico-tabs-list.is-style-light .ln-servico-tab-label {
	background-color: #FEFEFE;
	color: #4C4C4B;
	border-bottom: 1px solid #E2E0E0;
}

.ln-servico-tabs-list.is-style-light .ln-servico-tab-label:hover {
	background-color: #F5F3F3;
}

.ln-servico-tabs-list .ln-servico-tab-label:last-child {
	border-bottom: none;
}

.ln-servico-numero {
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: 0.625rem;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	opacity: 0.5;
	width: 1.5rem;
	flex-shrink: 0;
}

/* Ícone principal de cada item da lista de abas: sempre em opacidade plena, cor vermelho-marca */
.ln-servico-tab-label svg:first-of-type {
	color: #B11E23;
	flex-shrink: 0;
}

.ln-servico-titulo {
	font-family: Georgia, serif;
	font-size: 1.125rem;
	font-weight: 400;
	line-height: 1.25;
	letter-spacing: -0.01em;
	flex: 1;
}

.ln-servico-badge {
	display: block;
	font-size: 0.625rem;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	margin-top: 0.25rem;
	opacity: 0.8;
}

.ln-servico-tab-label svg:last-child {
	opacity: 0;
	transform: translateX(-4px);
	transition: opacity 0.2s ease, transform 0.2s ease;
	flex-shrink: 0;
}

.ln-servico-tab-label:hover svg:last-child {
	opacity: 0.6;
	transform: translateX(0);
}

.ln-servico-tabs-panels {
	grid-column: span 8;
	background-color: #FEFEFE;
	color: #4C4C4B;
}

.ln-servico-panel {
	display: none;
	padding: 2rem;
}

@media (min-width: 1024px) {
	.ln-servico-panel {
		padding: 3rem;
	}

	.ln-servico-panel-titulo {
		font-size: 2.25rem;
	}
}

.ln-servico-panel-eyebrow {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	margin-bottom: 1.5rem;
}

.ln-servico-panel-rule {
	width: 2.5rem;
	height: 1px;
	background-color: #B11E23;
}

.ln-servico-panel-eyebrow span:last-child {
	font-size: 0.72rem;
	font-weight: 500;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: #B11E23;
}

.ln-servico-panel-titulo {
	font-family: Georgia, serif;
	font-size: 1.875rem;
	font-weight: 400;
	letter-spacing: -0.01em;
	margin-bottom: 1.5rem;
}

.ln-servico-panel-conteudo {
	margin-bottom: 2.5rem;
}

/* Parágrafo de descrição do painel: text-lg / leading-relaxed / muted / max-w-2xl */
.ln-servico-panel-conteudo > p {
	max-width: 42rem;
	font-size: 1.125rem;
	line-height: 1.625;
	color: #6B6B6A;
	margin-bottom: 2.5rem;
}

/* Grupos de bullets: grade de 2 colunas no desktop (mockup grid md:grid-cols-2 gap-8) */
.ln-servico-grupos {
	display: grid;
	grid-template-columns: 1fr;
	gap: 2rem;
}

.ln-servico-grupos .ln-servico-grupo {
    margin-block-start: 0;
}

@media (min-width: 768px) {
	.ln-servico-grupos {
		grid-template-columns: repeat(2, 1fr);
	}
}

.ln-servico-grupo > * {
	margin-top: 0;
	margin-bottom: 0;
}

/* Grupo em prosa (ex.: "Alinhamento ético"): texto no mesmo tom dos bullets */
.ln-servico-grupo p {
	font-size: 0.875rem;
	line-height: 1.625;
	color: #6B6B6A;
	margin: 0;
}

/* Rótulo de cada grupo de bullets: 11px, tracking largo, bold, vermelho-marca */
.ln-servico-panel-conteudo h3 {
	font-size: 0.6875rem;
	text-transform: uppercase;
	letter-spacing: 0.22em;
	font-weight: 700;
	color: #B11E23;
	opacity: 1;
	margin-bottom: 0.75rem;
}

.ln-servico-panel-conteudo ul {
	display: grid;
	gap: 0.5rem;
	padding-left: 0;
	list-style: none;
	margin: 0;
}

.ln-servico-panel-conteudo li {
	display: flex;
	gap: 0.75rem;
	font-size: 0.875rem;
	line-height: 1.625;
	color: #6B6B6A;
}

.ln-servico-panel-conteudo li::before {
	content: "";
	width: 4px;
	height: 4px;
	border-radius: 999px;
	background-color: #B11E23;
	margin-top: 0.5rem;
	flex-shrink: 0;
}

/* CTA do painel: pílula (btn-primary do mockup), com ícone alinhado */
.ln-servico-panel-cta {
	display: inline-flex;
	align-items: center;
	gap: 0.6rem;
	border-radius: 999px;
	padding: 0.85rem 1.6rem;
	font-size: 0.875rem;
	font-weight: 500;
	letter-spacing: 0.02em;
	text-decoration: none;
	transition: background-color 0.25s ease, transform 0.25s ease;
}
.ln-servico-panel a.ln-servico-panel-cta {
    color: white;
}

.ln-servico-panel-cta:hover {
	background-color: #E52929;
	transform: translateY(-1px);
}

@media (max-width: 1023px) {
	.ln-servico-tabs-grid {
		grid-template-columns: 1fr;
	}

	.ln-servico-tabs-list,
	.ln-servico-tabs-panels {
		grid-column: span 12;
	}

	/* Cabeçalho das seções de serviço empilha só abaixo de 1024px (mockup usa
	   o breakpoint lg), não nos 782px padrão do wp:columns. */
	.ln-servicos-secao-head.wp-block-columns {
		flex-wrap: wrap;
	}

	.ln-servicos-secao-head.wp-block-columns > .wp-block-column {
		flex-basis: 100% !important;
	}
}

/* CTA final da página de Serviços: empilha < 1024px, lado a lado e centralizado no desktop */
.ln-servicos-cta-final {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: space-between;
	gap: 2rem;
}

@media (min-width: 1024px) {
	.ln-servicos-cta-final {
		flex-direction: row;
		align-items: center;
	}

	.ln-servicos-cta-final .wp-block-heading {
		font-size: 2.25rem;
	}
}

/* Barra inferior do footer: copyright + localidade lado a lado, empilha no mobile */
.ln-footer-bottom {
	opacity: 0.8;
}

@media (max-width: 600px) {
	.ln-footer-bottom {
		justify-content: center;
		text-align: center;
	}
}

/* Linha de vaga (bloco inteiro é um link): remove sublinhado, cor herdada dos parágrafos internos */
.ln-vaga-row {
	text-decoration: none;
	color: inherit;
	transition: background-color 0.2s ease;
	padding-left: 0.5rem;
	padding-right: 0.5rem;
	margin-left: -0.5rem;
	margin-right: -0.5rem;
	display: block;
}

.ln-vaga-row:hover {
	background-color: rgba(245, 243, 243, 0.5);
}

/* Linha filtrada pela busca: precisa vencer o `display: grid !important` do grid ≥782px */
.ln-vaga-row[hidden] {
	display: none !important;
}

/* Título muda para vermelho-marca ao passar o mouse na linha, como no mockup (group-hover:text-primary) */
.ln-vaga-row-titulo p {
	transition: color 0.2s ease;
}

.ln-vaga-row:hover .ln-vaga-row-titulo p {
	color: #B11E23;
}

/* Mobile: título/local/data/cta empilham (grid só entra em 782px+), com respiro entre eles */
.ln-vaga-row-titulo {
	margin-bottom: 0.75rem;
}

.ln-vaga-row-local,
.ln-vaga-row-data {
	margin-bottom: 0.5rem;
}

@media (min-width: 782px) {

	.ln-vaga-row-titulo,
	.ln-vaga-row-local,
	.ln-vaga-row-data {
		margin-bottom: 0;
	}
}

/* Colunas alinhadas em grid fixo (título/local/CTA sempre na mesma posição entre linhas) */
@media (min-width: 782px) {
	.ln-vaga-row {
		display: grid !important;
		grid-template-columns: repeat(12, 1fr);
		align-items: center;
		column-gap: 1rem;
	}

	.ln-vaga-row-titulo {
		grid-column: 1 / span 5;
	}

	.ln-vaga-row-local {
		grid-column: 8 / span 3;
		justify-content: flex-start !important;
	}

	.ln-vaga-row-data {
		grid-column: 9 / span 2;
		justify-content: flex-start !important;
	}

	.ln-vaga-row-cta {
		grid-column: 11 / span 2;
		text-align: right;
	}
}

/* Ícone da seta do CTA "Candidatar-se": alinhado com o texto, afasta no hover como no mockup */
.ln-vaga-row-cta-texto {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	transition: gap 0.2s ease;
}

.ln-vaga-row-cta-texto svg {
	flex-shrink: 0;
	transition: transform 0.2s ease;
}

.ln-vaga-row:hover .ln-vaga-row-cta-texto {
	gap: 0.75rem;
}

/* CTA final de "Cadastre seu perfil": tamanho e padding responsivos, como no mockup */
.ln-vagas-cta-titulo {
	font-size: 1.5rem;
	max-width: 36rem;
}

.ln-vagas-cta-final {
	padding: 2.5rem !important;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: space-between;
	gap: 1.5rem;
}

@media (min-width: 1024px) {
	.ln-vagas-cta-titulo {
		font-size: 1.875rem;
	}

	.ln-vagas-cta-final {
		padding: 3.5rem !important;
		flex-direction: row;
		align-items: center;
	}
}

.ln-vaga-pin {
	display: inline-flex;
	vertical-align: -2px;
	margin-right: 0.25rem;
}

/* Barra de busca de vagas: pill com input + botão Filtros (decorativo) + botão Buscar */
/* Grupo que encapsula a barra de busca: mantém a barra alinhada à esquerda */
.ln-vagas-busca {
	display: flex;
	justify-content: flex-start;
}

.ln-vagas-search-bar {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	width: 100%;
	max-width: 48rem;
	padding: 0.5rem;
	border: 1px solid #E2E0E0;
	border-radius: 999px;
}

.ln-vagas-search-input {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	flex: 1;
	padding: 0.5rem 1rem;
	color: #4C4C4B;
}

.ln-vagas-search-input input {
	flex: 1;
	border: 0;
	background: transparent;
	outline: none;
	font-size: 0.875rem;
	font-family: inherit;
	color: #4C4C4B;
}

.ln-vagas-search-input input::placeholder {
	color: #6B6B6A;
	opacity: 1;
}

.ln-vagas-search-filtros {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.5rem 1rem;
	border: 0;
	border-left: 1px solid #E2E0E0;
	background: transparent;
	font-size: 0.875rem;
	font-family: inherit;
	color: #6B6B6A;
	cursor: pointer;
}

.ln-vagas-search-submit {
	padding: 0.5rem 1.25rem;
	border: 0;
	border-radius: 999px;
	background-color: #B11E23;
	color: #FEFEFE;
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: 0.02em;
	font-family: inherit;
	cursor: pointer;
}

.ln-vagas-search-submit:hover {
	background-color: #E52929;
}

@media (max-width: 600px) {
	.ln-vagas-search-bar {
		flex-wrap: wrap;
		border-radius: 1.5rem;
	}

	.ln-vagas-search-input {
		width: 100%;
	}
}

/* Grid da "Biblioteca" de vídeos: 1 / 2 / 3 colunas (mockup) */
.ln-video-library-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1.5rem;
}

@media (min-width: 640px) {
	.ln-video-library-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (min-width: 1024px) {
	.ln-video-library-grid {
		grid-template-columns: repeat(3, 1fr);
	}
}

/* Página de Contato: cards de seleção (Empresa / Pessoa Física) — espelha .card-soft do mockup */
.ln-contact-choice .wp-block-columns .wp-block-column:last-child {
    margin-block-start: 0;
}
.ln-contact-choice .wp-block-column {
	display: flex;
}

.ln-contact-card {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	width: 100%;
	height: 100%;
	padding: 2rem;
	background-color: #FFFFFF;
	border: 1px solid #E2E0E0;
	border-radius: 0.375rem;
	transition: all 0.3s ease;
}

.ln-contact-card:hover {
	border-color: #B11E23;
	transform: translateY(-2px);
	box-shadow: 0 12px 40px -20px rgba(177, 30, 35, 0.25);
}

.ln-contact-card-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 1.75rem;
	height: 1.75rem;
	margin-bottom: 1.5rem;
	color: #B11E23;
}

.ln-contact-card h3 {
	color: #4C4C4B;
	margin-bottom: 0.75rem;
}

.ln-contact-card p {
	margin-bottom: 1.5rem;
}

/* Pino do link no rodapé do card para alinhar os dois cards */
.ln-contact-card > p:last-child {
	margin-top: auto;
	margin-bottom: 0;
}

.ln-contact-card-link {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	color: #B11E23;
	font-size: 0.875rem;
	font-weight: 500;
	text-decoration: none;
	transition: gap 0.25s ease;
}

.ln-contact-card-link:hover {
	color: #B11E23;
	gap: 0.75rem;
}

/* Página de Contato: formulários nativos com aparência consistente ao design system */
.ln-contact-form-wrapper {
	background-color: transparent;
}

/* Cabeçalho do formulário: título serif à esquerda + "← voltar" à direita */
.ln-contact-form-head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: 2rem;
}

/* Campos em grade de 2 colunas (textarea ocupa a linha inteira) */
.ln-contact-form-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	column-gap: 2rem;
	row-gap: 1.5rem;
	margin-bottom: 1.5rem;
}

.ln-contact-form-grid .ln-field--full {
	grid-column: 1 / -1;
}

.ln-field label {
	display: block;
	margin-bottom: 0.35rem;
	font-size: 0.72rem;
	font-weight: 500;
	letter-spacing: 0.02em;
	color: #6B6B6A;
}

/* Estilo "linha": sem caixa, apenas borda inferior */
.ln-field input,
.ln-field select,
.ln-field textarea {
	width: 100%;
	padding: 0.5rem 0;
	font-family: inherit;
	font-size: 0.9375rem;
	color: #1A1A1A;
	background-color: transparent;
	border: 0;
	border-bottom: 1px solid #E2E0E0;
	border-radius: 0;
}

.ln-field input:focus,
.ln-field select:focus,
.ln-field textarea:focus {
	outline: none;
	border-bottom-color: #B11E23;
}

.ln-field textarea {
	resize: vertical;
	min-height: 6rem;
}

.ln-btn-pill-submit {
	margin-top: 1.5rem;
	padding: 0.85rem 1.6rem;
	background-color: #B11E23;
	color: #FFFFFF;
	border: 0;
	border-radius: 999px;
	font-size: 0.875rem;
	font-weight: 500;
	letter-spacing: 0.02em;
	cursor: pointer;
	transition: background-color 0.25s ease, transform 0.25s ease;
}

.ln-btn-pill-submit:hover {
	background-color: #E52929;
	transform: translateY(-1px);
}

@media (max-width: 640px) {
	.ln-contact-form-grid {
		grid-template-columns: 1fr;
	}
}

/* Formulários da página de Contato: escondidos por padrão, revelados via :target
   ao clicar no card correspondente (âncora #form-empresa / #form-pessoa) — sem JS.
   Ao abrir um form, a grade de cards e o outro form são ocultados (swap de estado). */
.ln-contact-form-section {
	display: none;
}

.ln-contact-form-section:target {
	display: block;
}

article:has(#form-empresa:target) .ln-contact-choice,
article:has(#form-pessoa:target) .ln-contact-choice,
article:has(#form-empresa:target) #form-pessoa,
article:has(#form-pessoa:target) #form-empresa {
	display: none;
}

.ln-contact-form-back {
	display: inline-block;
	font-size: 0.875rem;
	color: #6B6B6A;
	text-decoration: none;
}

.ln-contact-form-back:hover {
	color: #B11E23;
}

/* =========================================================================
   Página "Carreira em Pauta" — ajustes pixel-perfect (escopo .ln-cep)
   Tudo aqui é exclusivo do pattern ln-carreira/carreira-em-pauta.
   ========================================================================= */

/* Container: 1.5rem no mobile, 2.5rem a partir de 768px (mockup .container-ln) */
.ln-cep .ln-cep-section {
	padding-left: 1.5rem;
	padding-right: 1.5rem;
}

@media (min-width: 768px) {
	.ln-cep .ln-cep-section {
		padding-left: 2.5rem;
		padding-right: 2.5rem;
	}
}

/* Hero: no mockup empilha abaixo de 1024px (colunas nativas quebram só < 782px) */
@media (min-width: 782px) and (max-width: 1023px) {
	.ln-cep .wp-block-columns {
		flex-wrap: wrap;
	}

	.ln-cep .wp-block-columns > .wp-block-column {
		flex-basis: 100% !important;
	}
}

.ln-cep-newsletter {
	background-color: #f4f2ee;
}

/* Seções escuras (vídeo + relatórios): cinza da marca, texto quase branco */
.ln-cep-dark,
.ln-cep-dark .has-branco-color {
	color: #fefefe;
}

/* Link inline claro sobre fundo escuro ("Inscreva-se no canal") */
.ln-cep-inline-link {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	color: rgba(254, 254, 254, 0.7);
	font-size: 0.875rem;
	text-decoration: none;
	transition: color 0.2s ease;
}

.ln-cep-inline-link:hover {
	color: #fefefe;
}

/* Link "ghost" (sublinhado fino) — "Ver todos", "Fale com a LN" */
.ln-cep-ghost-wrap {
	margin-top: 2.5rem;
	text-align: center;
}

.ln-cep-ghost {
	display: inline-flex;
	align-items: center;
	gap: 0.6rem;
	padding-bottom: 2px;
	color: #4c4c4b;
	border-bottom: 1px solid #4c4c4b;
	font-size: 0.875rem;
	font-weight: 500;
	text-decoration: none;
	transition: gap 0.25s ease;
}

.ln-cep-ghost:hover {
	gap: 1rem;
}

/* Card destaque da newsletter */
.ln-newsletter-card {
	display: flex;
	flex-direction: column;
	max-width: 42rem;
	margin: 0 auto 2rem 0;
	background-color: #FFFFFF;
	border: 1px solid #d6d6d6;
	border-radius: 0.375rem;
	overflow: hidden;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}

.ln-newsletter-card-body {
	display: flex;
	align-items: flex-start;
	gap: 1rem;
	padding: 1rem;
}

.ln-newsletter-icon {
	width: 5rem;
	height: 5rem;
	flex-shrink: 0;
	border-radius: 0.25rem;
	background: linear-gradient(135deg, #b11e23, #7a1418);
	display: flex;
	align-items: center;
	justify-content: center;
	color: #FFFFFF;
	text-align: center;
	line-height: 1.25;
	flex-direction: column;
}

.ln-newsletter-icon span {
	display: block;
}

.ln-newsletter-icon .ln-newsletter-icon-serif {
	font-family: var(--wp--preset--font-family--instrument-serif);
	font-size: 0.6875rem;
}

.ln-newsletter-icon .ln-newsletter-icon-sans {
	font-size: 0.5rem;
	letter-spacing: 0.1em;
}

.ln-newsletter-card-main {
	flex: 1;
	min-width: 0;
}

.ln-newsletter-card-toprow {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 0.25rem;
}

.ln-newsletter-card-kicker {
	font-size: 0.75rem;
	color: #666666;
}

.ln-newsletter-card-ellipsis {
	font-size: 1rem;
	line-height: 1;
	color: #666666;
}

.ln-newsletter-card-h3 {
	margin: 0.25rem 0;
	font-family: var(--wp--preset--font-family--inter);
	font-size: 1.25rem;
	font-weight: 600;
	line-height: 1.25;
	color: rgba(0, 0, 0, 0.9);
}

.ln-newsletter-card-desc {
	margin: 0 0 0.75rem;
	font-size: 0.875rem;
	line-height: 1.375;
	color: rgba(0, 0, 0, 0.9);
}

.ln-newsletter-card-footer {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 1rem;
}

.ln-newsletter-card-author {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	min-width: 0;
}

.ln-newsletter-card-avatar {
	width: 36px;
	height: 36px;
	flex-shrink: 0;
	border-radius: 999px;
	object-fit: cover;
}

.ln-newsletter-card-name {
	margin: 0;
	font-size: 0.75rem;
	font-weight: 600;
	color: rgba(0, 0, 0, 0.9);
}

.ln-newsletter-card-role {
	margin: 0;
	font-size: 0.6875rem;
	color: #666666;
}

.ln-newsletter-card-freq {
	flex-shrink: 0;
	text-align: right;
}

.ln-newsletter-card-freq-label {
	margin: 0;
	font-size: 0.6875rem;
	color: #666666;
}

.ln-newsletter-card-freq-count {
	margin: 0;
	font-size: 0.75rem;
	font-weight: 600;
	color: rgba(0, 0, 0, 0.9);
}

.ln-newsletter-card-cta {
	display: block;
	padding: 0.75rem;
	border-top: 1px solid #d6d6d6;
	color: #0a66c2;
	font-size: 0.875rem;
	font-weight: 600;
	text-align: center;
	text-decoration: none;
	transition: background-color 0.2s ease;
}

.ln-newsletter-card-cta:hover {
	background-color: #f3f9ff;
}

/* Grade de 6 posts recentes da newsletter */
.ln-newsletter-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1.25rem;
}

@media (min-width: 640px) {
	.ln-newsletter-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (min-width: 1024px) {
	.ln-newsletter-grid {
		grid-template-columns: repeat(3, 1fr);
	}
}

.ln-newsletter-post-card {
	display: block;
	min-width: 0;
	background-color: #FFFFFF;
	border: 1px solid #D6D6D6;
	border-radius: 0.375rem;
	overflow: hidden;
	color: inherit;
	text-decoration: none;
	transition: box-shadow 0.2s ease;
}

.ln-newsletter-post-card:hover {
	box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
}

.ln-newsletter-post-card:hover .ln-newsletter-post-title {
	text-decoration: underline;
}

.ln-newsletter-post-cover {
	position: relative;
	aspect-ratio: 1.91 / 1;
	background: linear-gradient(135deg, #4C4C4B, #1A1A1A);
	background-size: cover;
	background-position: center;
}

.ln-newsletter-post-meta {
	padding: 1rem;
	background-color: #f4f2ee;
	border-top: 1px solid #E8E8E8;
	border-bottom: 1px solid #E8E8E8;
}

.ln-newsletter-post-title {
	margin: 0 0 0.25rem;
	font-size: 0.875rem;
	font-weight: 600;
	color: rgba(0, 0, 0, 0.9);
	line-height: 1.375;
	overflow-wrap: break-word;
}

.ln-newsletter-post-author {
	margin-top: 0.125rem;
	font-size: 0.6875rem;
	color: #6B6B6A;
}

.ln-newsletter-post-stats {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0.625rem 1rem;
	font-size: 0.6875rem;
	color: #666666;
}

.ln-newsletter-post-stats-left {
	display: flex;
	align-items: center;
}

.ln-newsletter-dots {
	display: inline-flex;
	margin-right: 0.5rem;
}

.ln-newsletter-dots i {
	display: inline-block;
	width: 16px;
	height: 16px;
	border-radius: 999px;
	border: 2px solid #FFFFFF;
	margin-right: -0.25rem;
}

.ln-newsletter-dots i:nth-child(1) { background-color: var(--wp--preset--color--cinza-marca); }
.ln-newsletter-dots i:nth-child(2) { background-color: var(--wp--preset--color--texto-suave); }
.ln-newsletter-dots i:nth-child(3) { background-color: var(--wp--preset--color--vermelho-marca); }

/* Biblioteca de vídeos — cards com play no hover */
.ln-video-library-card {
	display: block;
	color: inherit;
	text-decoration: none;
}

.ln-video-library-thumb {
	position: relative;
	aspect-ratio: 16 / 9;
	background: #111;
	overflow: hidden;
	border-radius: 2px;
}

.ln-video-library-thumb img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.5s ease;
}

.ln-video-library-card:hover .ln-video-library-thumb img {
	transform: scale(1.05);
}

.ln-video-library-thumb-fallback {
	position: absolute;
	inset: 0;
	background: linear-gradient(135deg, #b11e23, #7a1418);
}

.ln-video-library-thumb::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(0, 0, 0, 0.7), transparent);
	opacity: 0;
	transition: opacity 0.3s ease;
}

.ln-video-library-card:hover .ln-video-library-thumb::after {
	opacity: 1;
}

.ln-video-library-play {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 56px;
	height: 56px;
	border-radius: 999px;
	background: #b11e23;
	color: #fefefe;
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	transition: opacity 0.3s ease;
	pointer-events: none;
}

.ln-video-library-card:hover .ln-video-library-play {
	opacity: 1;
}

.ln-video-library-title {
	margin-top: 0.75rem;
	font-family: var(--wp--preset--font-family--instrument-serif);
	font-size: 1.125rem;
	line-height: 1.25;
	color: #fefefe;
	transition: color 0.2s ease;
}

@media (min-width: 1024px) {
	.ln-cep-video-featured-title {
		font-size: 1.875rem;
	}
}

/* Página de Política de Privacidade e Cookies (conteúdo long-form) */
.ln-legal {
	max-width: 44rem;
}

.ln-legal h2 {
	margin-top: 2.5rem;
	margin-bottom: 0.75rem;
	font-family: var(--wp--preset--font-family--instrument-serif);
	font-size: 1.875rem;
	line-height: 1.2;
	color: #4c4c4b;
}

.ln-legal h2:first-child {
	margin-top: 0;
}

.ln-legal p,
.ln-legal li {
	font-size: 1rem;
	line-height: 1.7;
	color: #6b6b6a;
}

.ln-legal ul {
	padding-left: 1.25rem;
}

.ln-legal li + li {
	margin-top: 0.4rem;
}

.ln-legal a {
	color: #b11e23;
	text-decoration: underline;
}

.ln-legal .wp-block-table {
	overflow-x: auto;
}

.ln-legal table {
	border-collapse: collapse;
	width: 100%;
}

.ln-legal th,
.ln-legal td {
	border: 1px solid #e2e0e0;
	padding: 0.6rem 0.75rem;
	font-size: 0.9rem;
	line-height: 1.5;
	text-align: left;
	vertical-align: top;
}

.ln-legal th {
	background-color: #f5f3f3;
	color: #4c4c4b;
	font-weight: 600;
}

@media (max-width: 782px) {
	.ln-legal .wp-block-table {
		overflow-x: auto;
	}

	.ln-legal table {
		min-width: 640px;
	}
}