/* =====================================================================
   TechL@b Barueri 2026 — "Exploradores do Futuro"
   Estilos restritos a .techlab-page para não afetar as demais páginas.
   Paleta do convite: azul-escuro + acentos de verde-lima.
   ===================================================================== */

.techlab-page {
	--tl-azul: #113a7a;
	--tl-azul-escuro: #0b2a57;
	--tl-azul-claro: #1e5fb4;
	--tl-lima: #8cc63f;
	--tl-lima-escuro: #5d8f1f;
	--tl-areia: #f3f8ec;
	--tl-borda: #dfe7f1;
	--tl-texto: #1d2733;
	--tl-texto-suave: #55637a;
	color: var(--tl-texto);
}

/* ---------- Abertura ---------- */
.techlab-hero {
	background: var(--tl-areia);
	border-bottom: 4px solid var(--tl-lima);
}
.techlab-hero__arte {
	display: block;
	width: 100%;
	height: auto;
	margin: 0 auto;
}
.techlab-hero__conteudo {
	padding-top: 28px;
	padding-bottom: 32px;
}
.techlab-hero__selo {
	display: inline-block;
	background: var(--tl-azul);
	color: #fff;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	padding: 6px 14px;
	border-radius: 20px;
	margin-bottom: 14px;
}
.techlab-page h1 {
	font-size: 34px;
	font-weight: 800;
	line-height: 1.15;
	color: var(--tl-azul);
	margin: 0 0 10px;
}
.techlab-hero__destaque {
	display: block;
	color: var(--tl-lima-escuro);
	text-transform: uppercase;
	letter-spacing: .02em;
}
.techlab-hero__subtitulo {
	font-size: 19px;
	color: var(--tl-texto-suave);
	margin-bottom: 10px;
}
.techlab-hero__apoio {
	font-weight: 700;
	color: var(--tl-azul-claro);
	margin-bottom: 16px;
}
.techlab-hero__apoio span + span::before {
	content: "•";
	margin: 0 8px;
	color: var(--tl-lima);
}
.techlab-hero__chamada {
	font-size: 17px;
	max-width: 680px;
	margin-bottom: 22px;
}
.techlab-botoes {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}

/* ---------- Botões ---------- */
.techlab-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	border-radius: 28px;
	padding: 12px 26px;
	font-weight: 700;
	text-decoration: none;
	border: 2px solid transparent;
	transition: background-color .18s ease, color .18s ease, transform .18s ease;
}
.techlab-btn--primario { background: var(--tl-azul); color: #fff; }
.techlab-btn--primario:hover,
.techlab-btn--primario:focus { background: var(--tl-azul-escuro); color: #fff; text-decoration: none; }
.techlab-btn--secundario { background: var(--tl-lima); color: #15300a; }
.techlab-btn--secundario:hover,
.techlab-btn--secundario:focus { background: var(--tl-lima-escuro); color: #fff; text-decoration: none; }
.techlab-btn--linha { background: #fff; color: var(--tl-azul); border-color: var(--tl-azul); }
.techlab-btn--linha:hover,
.techlab-btn--linha:focus { background: var(--tl-azul); color: #fff; text-decoration: none; }
.techlab-btn:hover { transform: translateY(-2px); }

/* Foco de teclado sempre visível */
.techlab-page a:focus-visible,
.techlab-page button:focus-visible {
	outline: 3px solid var(--tl-lima-escuro);
	outline-offset: 3px;
	border-radius: 4px;
}

/* ---------- Data, horário e local ---------- */
.techlab-dados {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 16px;
	margin: -34px auto 0;
	position: relative;
	z-index: 2;
}
.techlab-dado {
	display: flex;
	align-items: center;
	gap: 14px;
	background: #fff;
	border: 1px solid var(--tl-borda);
	border-left: 5px solid var(--tl-lima);
	border-radius: 14px;
	padding: 18px 20px;
	box-shadow: 0 6px 18px rgba(17, 58, 122, .10);
}
.techlab-dado__icone {
	flex: 0 0 auto;
	width: 46px;
	height: 46px;
	border-radius: 12px;
	background: var(--tl-azul);
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 20px;
}
.techlab-dado__rotulo {
	display: block;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--tl-texto-suave);
}
.techlab-dado__valor {
	font-size: 17px;
	font-weight: 700;
	color: var(--tl-azul);
	line-height: 1.3;
}
.techlab-dado__valor small {
	display: block;
	font-size: 13px;
	font-weight: 400;
	color: var(--tl-texto-suave);
}

/* ---------- Seções ---------- */
.techlab-secao { padding: 46px 0; }
.techlab-secao--clara { background: var(--tl-areia); }
.techlab-page h2 {
	font-size: 26px;
	font-weight: 800;
	color: var(--tl-azul);
	margin-bottom: 6px;
}
.techlab-secao__intro {
	color: var(--tl-texto-suave);
	max-width: 720px;
	margin-bottom: 26px;
}

/* ---------- Atrações ---------- */
.techlab-atracao {
	height: 100%;
	background: #fff;
	border: 1px solid var(--tl-borda);
	border-radius: 14px;
	padding: 22px;
	transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.techlab-atracao:hover {
	transform: translateY(-4px);
	border-color: var(--tl-lima);
	box-shadow: 0 12px 24px rgba(17, 58, 122, .12);
}
.techlab-atracao__icone {
	width: 50px;
	height: 50px;
	border-radius: 14px;
	background: rgba(140, 198, 63, .18);
	color: var(--tl-lima-escuro);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 22px;
	margin-bottom: 14px;
}
.techlab-atracao h3 {
	font-size: 17px;
	font-weight: 700;
	color: var(--tl-azul);
	margin: 0;
}

/* ---------- Como chegar ---------- */
.techlab-local {
	background: #fff;
	border: 1px solid var(--tl-borda);
	border-radius: 14px;
	padding: 26px;
}
.techlab-local h3 { font-size: 19px; font-weight: 700; color: var(--tl-azul); }
.techlab-local address {
	font-style: normal;
	font-size: 16px;
	color: var(--tl-texto);
	margin-bottom: 18px;
}

/* ---------- Convite ---------- */
.techlab-convite__arte {
	display: block;
	width: 100%;
	max-width: 460px;   /* cartaz vertical: não precisa ocupar a coluna inteira */
	height: auto;
	border-radius: 14px;
	border: 1px solid var(--tl-borda);
	box-shadow: 0 10px 26px rgba(17, 58, 122, .14);
}

/* ---------- Telas menores ---------- */
@media (max-width: 991px) {
	.techlab-dados { grid-template-columns: 1fr; margin-top: 18px; }
	.techlab-page h1 { font-size: 28px; }
	.techlab-secao { padding: 34px 0; }
}

@media (max-width: 575px) {
	.techlab-hero__conteudo { padding-top: 20px; padding-bottom: 24px; }
	.techlab-page h1 { font-size: 24px; }
	.techlab-hero__subtitulo { font-size: 17px; }
	.techlab-botoes .techlab-btn { width: 100%; justify-content: center; }
}

@media (prefers-reduced-motion: reduce) {
	.techlab-page * { transition: none !important; }
	.techlab-btn:hover, .techlab-atracao:hover { transform: none; }
}