/* ==========================================================================
   BASE — resets, tipografia e elementos compartilhados por todo o site.
   ========================================================================== */

body.gle-page {
	background: var(--gle-bg);
	color: var(--gle-white);
	font-family: var(--gle-font-body);
	line-height: 1.55;
	-webkit-font-smoothing: antialiased;
	overflow-x: hidden;
}

.gle-page *,
.gle-page *::before,
.gle-page *::after {
	box-sizing: border-box;
}

.gle-page a {
	color: inherit;
	text-decoration: none;
}

.gle-page img {
	max-width: 100%;
	display: block;
}

.gle-page button {
	font-family: inherit;
	cursor: pointer;
}

.gle-page input {
	font-family: inherit;
}

.gle-sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
}

/* Skip to content — visível apenas quando recebe foco por teclado. */
.gle-skip-link {
	position: absolute;
	top: -100px;
	left: 1rem;
	z-index: 100;
	background: var(--gle-cyan);
	color: #04101F;
	font-family: var(--gle-font-mono);
	font-size: .85rem;
	font-weight: 600;
	padding: .8rem 1.2rem;
	border-radius: 6px;
	transition: top .2s;
}

.gle-skip-link:focus {
	top: 1rem;
}

/* Rede de segurança: garante contorno de foco visível em qualquer link,
   botão ou campo que não tenha um estilo de foco mais específico definido
   em outro arquivo (WCAG 2.4.7 — Focus Visible). */
.gle-page a:focus-visible,
.gle-page button:focus-visible,
.gle-page input:focus-visible,
.gle-page textarea:focus-visible {
	outline: 2px solid var(--gle-cyan);
	outline-offset: 2px;
}

.gle-eyebrow {
	font-family: var(--gle-font-mono);
	font-size: .75rem;
	letter-spacing: .12em;
	color: var(--gle-cyan);
	margin: 0 0 1rem;
	text-transform: uppercase;
}

.gle-h1 {
	font-family: var(--gle-font-display);
	font-weight: 600;
	font-size: clamp(2.4rem, 5.2vw, 4rem);
	line-height: 1.08;
	letter-spacing: -0.01em;
	margin: 0 0 1.25rem;
	color: var(--gle-white);
}

.gle-h2 {
	font-family: var(--gle-font-display);
	font-weight: 600;
	font-size: clamp(2rem, 4vw, 2.75rem);
	line-height: 1.15;
	margin: 0 0 1rem;
	text-align: center;
}

.gle-accent {
	background: linear-gradient(90deg, var(--gle-blue), var(--gle-cyan));
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

.gle-lead {
	font-size: 1.05rem;
	color: var(--gle-silver);
	max-width: 34rem;
	margin: 0 0 2rem;
}

.gle-lead--center {
	margin-inline: auto;
	text-align: center;
}

/* Formulário de e-mail (Hero + Newsletter) — compartilhado entre seções. */
.gle-form {
	display: flex;
	gap: .6rem;
	max-width: 30rem;
}

.gle-form input {
	flex: 1;
	min-width: 0;
	background: var(--gle-panel);
	border: 1px solid var(--gle-panel-line);
	color: var(--gle-white);
	padding: .85rem 1rem;
	border-radius: 6px;
	font-size: .95rem;
}

.gle-form input::placeholder {
	color: var(--gle-muted);
}

.gle-form input:focus-visible {
	outline: 2px solid var(--gle-cyan);
	outline-offset: 2px;
}

.gle-form button {
	background: linear-gradient(90deg, var(--gle-blue), var(--gle-cyan));
	color: #04101F;
	border: none;
	font-weight: 600;
	font-size: .95rem;
	padding: .85rem 1.4rem;
	border-radius: 6px;
	clip-path: polygon(6% 0, 100% 0, 94% 100%, 0% 100%);
	transition: filter .2s;
	white-space: nowrap;
}

.gle-form button:hover {
	filter: brightness(1.12);
}

.gle-form button:focus-visible {
	outline: 2px solid var(--gle-white);
	outline-offset: 2px;
}

.gle-fineprint {
	font-family: var(--gle-font-mono);
	font-size: .72rem;
	color: var(--gle-muted);
	margin: .7rem 0 0;
}

.gle-trustbar {
	margin-top: 2.2rem;
	display: flex;
	gap: .6rem;
	align-items: center;
	font-family: var(--gle-font-mono);
	font-size: .72rem;
	letter-spacing: .06em;
	color: var(--gle-muted);
	text-transform: uppercase;
}

/* Páginas institucionais/blog que usam index.php/page.php (fora da Home). */
.gle-content-wrap {
	max-width: 1280px;
	margin-inline: auto;
	padding: clamp(2.5rem, 5vw, 4rem) clamp(1.25rem, 5vw, 3.5rem);
}

.gle-entry-content {
	color: var(--gle-silver);
	max-width: 46rem;
}

.gle-entry-content a {
	color: var(--gle-cyan);
	text-decoration: underline;
}