:root {
	--bg-start: #0a0b0f;
	--bg-end: #0f1d35;
	--panel: #0f1522;
	--ink: #ecf3ff;
	--muted: #a5b4d6;
	--line: #1e2a44;
	--brand: #3b82f6;
	--radius: 16px;
	--shadow: 0 16px 40px rgba(0,0,0,.35);
	--shadow-sm: 0 8px 24px rgba(0,0,0,.28);
	--container: 1120px;
}
* {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}
html, body {
	height: 100%;
}
body {
	background: linear-gradient(180deg, var(--bg-start) 0%, var(--bg-end) 100%);
	color: var(--ink);
	font-family: 'Inter', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
	line-height: 1.65;
	position: relative;
}
/* Efeito de partículas sutis no fundo */
body::before {
	content: "";
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-image:radial-gradient(circle at 10% 20%, rgba(59, 130, 246, 0.05) 0%, transparent 20%),radial-gradient(circle at 90% 40%, rgba(59, 130, 246, 0.05) 0%, transparent 20%),radial-gradient(circle at 50% 80%, rgba(59, 130, 246, 0.05) 0%, transparent 20%);
	z-index: -1;
	pointer-events: none;
}
/* Containers e centralização */
.container {
	width: min(var(--container), 92%);
	margin: 0 auto;
}
.narrow {
	width: min(900px, 92%);
	margin: 0 auto;
}
.center {
	text-align: center;
}
.center-grid {
	justify-items: center;
}
/* Botões */
.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 12px 18px;
	border-radius: 12px;
	text-decoration: none;
	font-weight: 900;
	border: 1px solid #254a95;
	background: transparent;
	color: #eaf2ff;
	box-shadow: var(--shadow-sm);
	transition: transform .06s ease, box-shadow .2s ease, filter .2s ease, background .2s ease;
}
.btn:active {
	transform: translateY(1px);
}
.btn--primary {
	background: linear-gradient(180deg, var(--brand), #245fd6);
	color: #fff;
	border-color: transparent;
	box-shadow: 0 14px 36px rgba(59, 130, 246, .35);
}
.btn--primary:hover {
	filter: brightness(1.05);
}
.btn--lg {
	padding: 16px 22px;
	font-size: 1.05rem;
}
/* HERO fullscreen + GRID branco com fade inferior */
.hero {
	padding: 64px 0 28px;
	position: relative;
	background: linear-gradient(180deg, var(--bg-start) 0%, var(--bg-end) 100%);
}
.hero--full {
	min-height: 100vh;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	position: relative;
	overflow: hidden;
}
.hero--grid::before {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background:repeating-linear-gradient(to right, rgba(255,255,255,.12) 0 1px, transparent 1px 48px),repeating-linear-gradient(to bottom, rgba(255,255,255,.12) 0 1px, transparent 1px 48px);
	opacity: .22;
	-webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,1) 60%, rgba(0,0,0,.85) 75%, rgba(0,0,0,.55) 88%, rgba(0,0,0,0) 100%);
	mask-image: linear-gradient(to bottom, rgba(0,0,0,1) 60%, rgba(0,0,0,.85) 75%, rgba(0,0,0,.55) 88%, rgba(0,0,0,0) 100%);
}
.hero__wrap {
	max-width: 920px;
	margin: 0 auto;
	text-align: center;
	padding: 64px 0;
}
.kicker {
	font-weight: 900;
	letter-spacing: .6px;
	color: #60a5fa;
}
.hero__title {
	font-size: clamp(2.4rem, 4.2vw, 3.4rem);
	line-height: 1.12;
	margin: .6rem 0 1rem;
}
.hero__title .subheadline {
	display: block;
	margin-top: .35rem;
	font-size: clamp(1.1rem, 2vw, 1.6rem);
	line-height: 1.25;
	font-weight: 600;
	color: #e3edff;
	opacity: .95;
}
.hero__sub {
	color: var(--muted);
	font-size: 1.06rem;
	max-width: 820px;
	margin: 0 auto 18px;
}
.scroll-hint {
	margin-top: 22px;
	font-size: .9rem;
	color: #8fb0ff88;
}
/* ============ Seções com transição suave ============ */
.section {
	position: relative;
	padding: 76px 0;
	background: linear-gradient(180deg,rgba(10, 11, 15, 0.8) 0%,rgba(15, 29, 53, 0.8) 50%,rgba(10, 11, 15, 0.8) 100%);
	backdrop-filter: blur(1px);
}
/* Efeito de brilho sutil entre seções */
.section::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(180deg,rgba(59, 130, 246, 0.03) 0%,transparent 15%,transparent 85%,rgba(59, 130, 246, 0.03) 100%);
	pointer-events: none;
	z-index: -1;
}
.section h2 {
	font-size: clamp(1.6rem, 2.1vw, 2.1rem);
	margin: 0 0 14px;
}
.muted {
	color: var(--muted);
}
.small {
	font-size: .95rem;
}
.mt-24 {
	margin-top: 24px;
}
/* Grids / Cards */
.grid-4 {
	display: grid;
	grid-template-columns: repeat(4, minmax(220px, 1fr));
	gap: 16px;
}
.grid-3 {
	display: grid;
	grid-template-columns: repeat(3, minmax(240px, 1fr));
	gap: 16px;
}
.card,.price-card {
	background: var(--panel);
	border: 1px solid #2b5ac3;
	border-radius: 14px;
	padding: 18px;
	box-shadow: var(--shadow);
	text-align: center;
	transition: transform .15s ease, box-shadow .2s ease, border-color .2s ease;
	position: relative;
	overflow: hidden;
}
/* Efeito de brilho sutil nos cards */
.card::before,.price-card::before {
	content: "";
	position: absolute;
	top: 0;
	left: -100%;
	width: 100%;
	height: 100%;
	background: linear-gradient(90deg,transparent,rgba(59, 130, 246, 0.1),transparent);
	transition: left 0.5s ease;
}
.card:hover::before,.price-card:hover::before {
	left: 100%;
}
.card:hover,.price-card:hover {
	transform: translateY(-2px);
	border-color: #3b82f6;
	box-shadow: 0 18px 44px rgba(26, 86, 219, .35);
}
.card h3 {
	margin: .2rem 0 .5rem;
	color: #eaf2ff;
}
.card p {
	color: #cfe1ff;
}
/* Preço - card único central */
.price-card {
	max-width: 560px;
	margin: 18px auto 0;
	padding: 28px 22px;
}
.price-card .from {
	display: block;
	color: #93b4ff;
	text-decoration: line-through;
	font-size: 1rem;
	opacity: .9;
	margin-bottom: 6px;
}
.price-card .now {
	display: block;
	font-size: 3rem;
	line-height: 1;
	margin: .1rem 0 .2rem;
	color: #ffffff;
	font-weight: 900;
}
.price-card .split {
	display: block;
	color: #9db6ff;
	font-size: 1.05rem;
	margin-bottom: 16px;
}
.price-cta {
	width: 100%;
}
/* ========= MENTORES (sem card;
imagem solta ocupa a altura) ========= */
.mentor-section {
	padding: clamp(56px, 8vh, 96px) 0;
}
.mentor__grid {
	display: grid;
	grid-template-columns: 1.05fr .95fr;
	gap: 40px;
	align-items: stretch;
	min-height: 70vh;
	position: relative;
	z-index: 1;
	/* fica acima do blend da seção */
}
.mentor__grid--free {
	background: transparent;
	border: none;
	box-shadow: none;
	padding: 0;
}
.mentor__name {
	font-size: clamp(1.9rem, 3vw, 2.4rem);
	line-height: 1.15;
	margin: 0 0 .35rem;
	color: #eaf2ff;
	font-weight: 900;
}
.mentor__role {
	margin: .1rem 0 1rem;
	color: #9fb8ff;
	font-weight: 700;
}
.mentor__text p {
	color: #cfe1ff;
}
.mentor__bullets {
	margin: 12px 0 0;
	padding-left: 0;
	list-style: none;
	display: grid;
	gap: 6px;
}
.mentor__bullets li {
	position: relative;
	padding-left: 22px;
	color: #d7e6ff;
}
.mentor__bullets li::before {
	content: "•";
	position: absolute;
	left: 0;
	top: 0;
	color: #60a5fa;
	font-weight: 900;
}
/* Mídia "solta" preenchendo a altura da sessão */
.mentor__media {
	position: relative;
	height: 100%;
	display: flex;
	align-items: stretch;
	justify-content: flex-end;
}
.img-mentor {
	height: 100%;
	width: auto;
	max-width: 100%;
	object-fit: cover;
	display: block;
}
/* Placeholder até colocar o PNG */
.img-holder-free {
	height: 100%;
	width: 100%;
	background: linear-gradient(180deg, rgba(96,165,250,.18), rgba(96,165,250,.06));
}
/* FAQ */
.faq details {
	background: var(--panel);
	border: 1px solid var(--line);
	border-radius: 12px;
	padding: 14px 16px;
	margin: 10px 0;
	box-shadow: var(--shadow-sm);
}
.faq summary {
	cursor: pointer;
	font-weight: 900;
	color: #eaf2ff;
}
/* Closing */
.closing {
	text-align: center;
}
/* Footer */
.footer {
	padding: 26px 0;
}
.footer__inner {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 12px;
}
.footer a {
	color: #d0e2ff;
	text-decoration: none;
	font-weight: 800;
	opacity: .9;
}
.footer a:hover {
	opacity: 1;
}
/* CTA flutuante (mobile) */
.floating-cta {
	position: fixed;
	left: 50%;
	transform: translateX(-50%);
	bottom: 12px;
	z-index: 50;
	display: none;
	background: linear-gradient(180deg, var(--brand), #245fd6);
	color: #fff;
	text-decoration: none;
	padding: 14px 18px;
	border-radius: 999px;
	font-weight: 900;
	box-shadow: 0 14px 34px rgba(59,130,246,.35);
}
/* Responsivo */
@media (max-width: 980px) {
	.grid-4, .grid-3 {
		grid-template-columns: 1fr;
	}
	.mentor__grid {
		grid-template-columns: 1fr;
		gap: 22px;
		min-height: auto;
	}
	.mentor__media {
		height: 360px;
	}
	.price-card .now {
		font-size: 2.4rem;
	}
	.floating-cta {
		display: flex;
	}
}
/* ============ ÍCONES PARA OS CARDS ============ */
.card {
	position: relative;
	padding-top: 60px;
	/* Espaço para o ícone */
}
.card::after {
	content: "";
	position: absolute;
	top: 20px;
	left: 50%;
	transform: translateX(-50%);
	width: 40px;
	height: 40px;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}
/* Card 1: Negócio travado - Cadeado */
.card:nth-child(1)::after {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233b82f6'%3E%3Cpath d='M18 8h-1V6c0-2.76-2.24-5-5-5S7 3.24 7 6v2H6c-1.1 0-2 .9-2 2v10c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V10c0-1.1-.9-2-2-2zM12 17c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2zM15.1 8H8.9V6c0-1.71 1.39-3.1 3.1-3.1 1.71 0 3.1 1.39 3.1 3.1v2z'/%3E%3C/svg%3E");
}
/* Card 2: Vende, mas não sobra - Gráfico com seta para baixo */
.card:nth-child(2)::after {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233b82f6'%3E%3Cpath d='M16 18l2.29-2.29-4.88-4.88-4 4L2 7.41 3.41 6l6 6 4-4 6.3 6.29L22 12v6z'/%3E%3C/svg%3E");
}
/* Card 3: Tem gestão, falta escala - Escada/degral */
.card:nth-child(3)::after {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233b82f6'%3E%3Cpath d='M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zM9 17H7v-7h2v7zm4 0h-2V7h2v10zm4 0h-2v-4h2v4z'/%3E%3C/svg%3E");
}
/* Card 4: Expansão real - Foguete */
.card:nth-child(4)::after {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233b82f6'%3E%3Cpath d='M12 2.5s4.5 2.04 4.5 10.5c0 2.49-1.04 5.57-1.6 7H9.1c-.56-1.43-1.6-4.51-1.6-7C7.5 4.54 12 2.5 12 2.5zm2 8.5c0-1.1-.9-2-2-2s-2 .9-2 2 .9 2 2 2 2-.9 2-2zm-6.31 9.52c-.48-1.23-1.52-4.17-1.67-6.87l-1.13.75c-.56.38-.89 1-.89 1.67V22l3.69-1.48zM20 22v-5.93c0-.67-.33-1.29-.89-1.66l-1.13-.75c-.15 2.69-1.2 5.64-1.67 6.87L20 22z'/%3E%3C/svg%3E");
}
/* Efeito hover nos ícones */
.card:hover::after {
	filter: brightness(1.2) drop-shadow(0 0 8px rgba(59, 130, 246, 0.6));
	transform: translateX(-50%) scale(1.1);
	transition: all 0.3s ease;
}
/* Versão com animações mais elaboradas */
.card::after {
	content: "";
	position: absolute;
	top: 20px;
	left: 50%;
	transform: translateX(-50%);
	width: 40px;
	height: 40px;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	transition: all 0.3s ease;
}
/* Animação específica para cada ícone */
.card:nth-child(1)::after {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233b82f6'%3E%3Cpath d='M18 8h-1V6c0-2.76-2.24-5-5-5S7 3.24 7 6v2H6c-1.1 0-2 .9-2 2v10c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V10c0-1.1-.9-2-2-2zM12 17c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2zM15.1 8H8.9V6c0-1.71 1.39-3.1 3.1-3.1 1.71 0 3.1 1.39 3.1 3.1v2z'/%3E%3C/svg%3E");
}
.card:nth-child(2)::after {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233b82f6'%3E%3Cpath d='M16 18l2.29-2.29-4.88-4.88-4 4L2 7.41 3.41 6l6 6 4-4 6.3 6.29L22 12v6z'/%3E%3C/svg%3E");
}
.card:nth-child(3)::after {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233b82f6'%3E%3Cpath d='M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zM9 17H7v-7h2v7zm4 0h-2V7h2v10zm4 0h-2v-4h2v4z'/%3E%3C/svg%3E");
}
.card:nth-child(4)::after {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233b82f6'%3E%3Cpath d='M12 2.5s4.5 2.04 4.5 10.5c0 2.49-1.04 5.57-1.6 7H9.1c-.56-1.43-1.6-4.51-1.6-7C7.5 4.54 12 2.5 12 2.5zm2 8.5c0-1.1-.9-2-2-2s-2 .9-2 2 .9 2 2 2 2-.9 2-2zm-6.31 9.52c-.48-1.23-1.52-4.17-1.67-6.87l-1.13.75c-.56.38-.89 1-.89 1.67V22l3.69-1.48zM20 22v-5.93c0-.67-.33-1.29-.89-1.66l-1.13-.75c-.15 2.69-1.2 5.64-1.67 6.87L20 22z'/%3E%3C/svg%3E");
}
/* Efeitos hover animados */
.card:hover::after {
	filter: brightness(1.3) drop-shadow(0 0 12px rgba(59, 130, 246, 0.8));
	transform: translateX(-50%) scale(1.15);
}
/* Animação de flutuação suave */
@keyframes floatIcon {
	0%, 100% {
		transform: translateX(-50%) translateY(0px);
	}
	50% {
		transform: translateX(-50%) translateY(-3px);
	}
}
.card::after {
	animation: floatIcon 3s ease-in-out infinite;
}
.card:hover::after {
	animation: floatIcon 1s ease-in-out infinite;
}
/* ============ ÍCONES MINIMALISTAS SEM COR ============ */
/* Usando máscara SVG para ícones em branco */
.card--minimalist {
	position: relative;
	padding-top: 70px;
}
.card--minimalist::before {
	content: "";
	position: absolute;
	top: 20px;
	left: 50%;
	transform: translateX(-50%);
	width: 32px;
	height: 32px;
	background-color: #ecf3ff;
	/* Cor branca/neutra do texto */
	-webkit-mask-size: contain;
	mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	opacity: 0.9;
	transition: all 0.3s ease;
}
/* Card 1: Mapa do dinheiro - Ícone de mapa */
.card--minimalist:nth-child(1)::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20.5 3l-.16.03L15 5.1 9 3 3.36 4.9c-.21.07-.36.25-.36.48V20.5c0 .28.22.5.5.5l.16-.03L9 18.9l6 2.1 5.64-1.9c.21-.07.36-.25.36-.48V3.5c0-.28-.22-.5-.5-.5zM15 19l-6-2.11V5l6 2.11V19z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20.5 3l-.16.03L15 5.1 9 3 3.36 4.9c-.21.07-.36.25-.36.48V20.5c0 .28.22.5.5.5l.16-.03L9 18.9l6 2.1 5.64-1.9c.21-.07.36-.25.36-.48V3.5c0-.28-.22-.5-.5-.5zM15 19l-6-2.11V5l6 2.11V19z'/%3E%3C/svg%3E");
}
/* Card 2: Engenharia da venda - Ícone de engrenagem */
.card--minimalist:nth-child(2)::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19.14 12.94c.04-.3.06-.61.06-.94 0-.32-.02-.64-.07-.94l2.03-1.58c.18-.14.23-.41.12-.61l-1.92-3.32c-.12-.22-.37-.29-.59-.22l-2.39.96c-.5-.38-1.03-.7-1.62-.94l-.36-2.54c-.04-.24-.24-.41-.48-.41h-3.84c-.24 0-.43.17-.47.41l-.36 2.54c-.59.24-1.13.57-1.62.94l-2.39-.96c-.22-.08-.47 0-.59.22L2.74 8.87c-.12.21-.08.47.12.61l2.03 1.58c-.05.3-.09.63-.09.94s.02.64.07.94l-2.03 1.58c-.18.14-.23.41-.12.61l1.92 3.32c.12.22.37.29.59.22l2.39-.96c.5.38 1.03.7 1.62.94l.36 2.54c.05.24.24.41.48.41h3.84c.24 0 .44-.17.47-.41l.36-2.54c.59-.24 1.13-.56 1.62-.94l2.39.96c.22.08.47 0 .59-.22l1.92-3.32c.12-.22.07-.47-.12-.61l-2.01-1.58zM12 15.6c-1.98 0-3.6-1.62-3.6-3.6s1.62-3.6 3.6-3.6 3.6 1.62 3.6 3.6-1.62 3.6-3.6 3.6z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19.14 12.94c.04-.3.06-.61.06-.94 0-.32-.02-.64-.07-.94l2.03-1.58c.18-.14.23-.41.12-.61l-1.92-3.32c-.12-.22-.37-.29-.59-.22l-2.39.96c-.5-.38-1.03-.7-1.62-.94l-.36-2.54c-.04-.24-.24-.41-.48-.41h-3.84c-.24 0-.43.17-.47.41l-.36 2.54c-.59.24-1.13.57-1.62.94l-2.39-.96c-.22-.08-.47 0-.59.22L2.74 8.87c-.12.21-.08.47.12.61l2.03 1.58c-.05.3-.09.63-.09.94s.02.64.07.94l-2.03 1.58c-.18.14-.23.41-.12.61l1.92 3.32c.12.22.37.29.59.22l2.39-.96c.5.38 1.03.7 1.62.94l.36 2.54c.05.24.24.41.48.41h3.84c.24 0 .44-.17.47-.41l.36-2.54c.59-.24 1.13-.56 1.62-.94l2.39.96c.22.08.47 0 .59-.22l1.92-3.32c.12-.22.07-.47-.12-.61l-2.01-1.58zM12 15.6c-1.98 0-3.6-1.62-3.6-3.6s1.62-3.6 3.6-3.6 3.6 1.62 3.6 3.6-1.62 3.6-3.6 3.6z'/%3E%3C/svg%3E");
}
/* Card 3: Ponto de ignição - Ícone de faísca */
.card--minimalist:nth-child(3)::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 2v11h3v9l7-12h-4l4-8H7z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 2v11h3v9l7-12h-4l4-8H7z'/%3E%3C/svg%3E");
}
/* Card 4: Efeito BOOM - Ícone de bomba */
.card--minimalist:nth-child(4)::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M11.25 6c1.38 0 2.5 1.12 2.5 2.5 0 .41.34.75.75.75s.75-.34.75-.75C15 6.01 12.99 4 10.5 4c-.41 0-.75.34-.75.75s.34.75.75.75zm5.75 1c-.28 0-.5.22-.5.5s.22.5.5.5c1.38 0 2.5 1.12 2.5 2.5 0 .28.22.5.5.5s.5-.22.5-.5c0-1.93-1.57-3.5-3.5-3.5zm-12 7c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm10.75-5.25c0 .41.34.75.75.75 1.38 0 2.5 1.12 2.5 2.5 0 .41.34.75.75.75s.75-.34.75-.75c0-2.21-1.79-4-4-4-.41 0-.75.34-.75.75zM17 13c-.28 0-.5.22-.5.5s.22.5.5.5c.83 0 1.5.67 1.5 1.5 0 .28.22.5.5.5s.5-.22.5-.5c0-1.38-1.12-2.5-2.5-2.5zm-3.5-4.5c0 .41.34.75.75.75.83 0 1.5.67 1.5 1.5 0 .41.34.75.75.75s.75-.34.75-.75c0-1.66-1.34-3-3-3-.41 0-.75.34-.75.75zM6.5 12c-.28 0-.5.22-.5.5s.22.5.5.5c.83 0 1.5.67 1.5 1.5 0 .28.22.5.5.5s.5-.22.5-.5c0-1.38-1.12-2.5-2.5-2.5z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M11.25 6c1.38 0 2.5 1.12 2.5 2.5 0 .41.34.75.75.75s.75-.34.75-.75C15 6.01 12.99 4 10.5 4c-.41 0-.75.34-.75.75s.34.75.75.75zm5.75 1c-.28 0-.5.22-.5.5s.22.5.5.5c1.38 0 2.5 1.12 2.5 2.5 0 .28.22.5.5.5s.5-.22.5-.5c0-1.93-1.57-3.5-3.5-3.5zm-12 7c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm10.75-5.25c0 .41.34.75.75.75 1.38 0 2.5 1.12 2.5 2.5 0 .41.34.75.75.75s.75-.34.75-.75c0-2.21-1.79-4-4-4-.41 0-.75.34-.75.75zM17 13c-.28 0-.5.22-.5.5s.22.5.5.5c.83 0 1.5.67 1.5 1.5 0 .28.22.5.5.5s.5-.22.5-.5c0-1.38-1.12-2.5-2.5-2.5zm-3.5-4.5c0 .41.34.75.75.75.83 0 1.5.67 1.5 1.5 0 .41.34.75.75.75s.75-.34.75-.75c0-1.66-1.34-3-3-3-.41 0-.75.34-.75.75zM6.5 12c-.28 0-.5.22-.5.5s.22.5.5.5c.83 0 1.5.67 1.5 1.5 0 .28.22.5.5.5s.5-.22.5-.5c0-1.38-1.12-2.5-2.5-2.5z'/%3E%3C/svg%3E");
}
/* Card 5: Visão do dono - Ícone de olho */
.card--minimalist:nth-child(5)::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 4.5C7 4.5 2.73 7.61 1 12c1.73 4.39 6 7.5 11 7.5s9.27-3.11 11-7.5c-1.73-4.39-6-7.5-11-7.5zM12 17c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5zm0-8c-1.66 0-3 1.34-3 3s1.34 3 3 3 3-1.34 3-3-1.34-3-3-3z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 4.5C7 4.5 2.73 7.61 1 12c1.73 4.39 6 7.5 11 7.5s9.27-3.11 11-7.5c-1.73-4.39-6-7.5-11-7.5zM12 17c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5zm0-8c-1.66 0-3 1.34-3 3s1.34 3 3 3 3-1.34 3-3-1.34-3-3-3z'/%3E%3C/svg%3E");
}
/* Efeitos hover */
.card--minimalist:hover::before {
	opacity: 1;
	transform: translateX(-50%) scale(1.1);
	background-color: #ffffff;
	/* Branco puro no hover */
}
/* Animação sutil de flutuação */
@keyframes minimalistFloat {
	0%, 100% {
		transform: translateX(-50%) translateY(0px);
	}
	50% {
		transform: translateX(-50%) translateY(-2px);
	}
}
.card--minimalist::before {
	animation: minimalistFloat 4s ease-in-out infinite;
}
.card--minimalist:hover::before {
	animation: minimalistFloat 2s ease-in-out infinite;
}
/* ===== Steps (sem card) ===== */
.steps {
	margin: 26px auto 0;
	padding: 0;
	list-style: none;
	display: grid;
	grid-template-columns: repeat(5, minmax(140px, 1fr));
	gap: 22px;
	position: relative;
}
.step {
	position: relative;
	display: grid;
	grid-template-rows: auto 1fr;
	gap: 10px;
	padding-top: 6px;
}
.step::before {
	/* linha que conecta os pontos no desktop */
	content: "";
	position: absolute;
	top: 21px;
	left: -50%;
	right: 50%;
	height: 2px;
	background: linear-gradient(90deg, #254a95 0%, #3b82f6 40%, #254a95 100%);
	opacity: .45;
	z-index: 0;
}
.step:first-child::before {
	display: none;
}
.step__dot {
	width: 34px;
	height: 34px;
	display: grid;
	place-items: center;
	border-radius: 999px;
	font-weight: 900;
	color: #fff;
	background: radial-gradient(90% 90% at 30% 20%, #60a5fa 0%, #245fd6 60%, #1b3f99 100%);
	box-shadow: 0 8px 22px rgba(59,130,246,.35), inset 0 0 10px rgba(255,255,255,.15);
	border: 1px solid #2b5ac3;
	position: relative;
	z-index: 1;
}
.step__content {
	padding-left: 2px;
}
.step__title {
	margin: 0 0 4px;
	font-size: 1.05rem;
	line-height: 1.25;
	color: #eaf2ff;
	font-weight: 900;
	letter-spacing: .2px;
}
.step__desc {
	margin: 0;
	color: var(--muted);
	font-size: .98rem;
}
/* micro interação */
.step:hover .step__title {
	color: #ffffff;
}
.step:hover .step__dot {
	filter: brightness(1.06);
	transform: translateY(-1px);
	transition: transform .15s ease, filter .2s ease;
}
/* responsivo */
@media (max-width: 980px) {
	.steps {
		grid-template-columns: 1fr;
		gap: 18px;
	}
	.step::before {
		/* vira uma linha vertical sutil */
		left: 17px;
		right: auto;
		top: 34px;
		bottom: -12px;
		width: 2px;
		height: auto;
		background: linear-gradient(180deg, #254a95, #3b82f6);
		opacity: .35;
	}
	.step:last-child::before {
		display: none;
	}
	.step {
		grid-template-columns: 42px 1fr;
		grid-template-rows: auto;
		align-items: start;
		padding-left: 0;
	}
	.step__dot {
		grid-row: 1 / span 2;
	}
}
/* Estilos para a seção História */
.boom-elements {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 30px;
	margin: 40px 0;
	max-width: 800px;
	margin-left: auto;
	margin-right: auto;
}
.element {
	text-align: center;
	padding: 30px 20px;
	background: var(--panel);
	border-radius: var(--radius);
	border: 1px solid var(--line);
	transition: all 0.3s ease;
	position: relative;
	overflow: hidden;
}
.element::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 3px;
	background: linear-gradient(90deg, var(--brand), #60a5fa);
}
.element:hover {
	transform: translateY(-5px);
	border-color: var(--brand);
	box-shadow: var(--shadow);
}
.element-icon {
	font-size: 2.5rem;
	margin-bottom: 15px;
	display: block;
}
.element h3 {
	margin: 10px 0 5px;
	color: #eaf2ff;
	font-size: 1.3rem;
}
.element p {
	color: var(--muted);
	margin: 0;
}
.boom-result {
	margin-top: 50px;
	text-align: center;
	position: relative;
}
.boom-text {
	font-size: 4rem;
	font-weight: 900;
	color: var(--brand);
	margin-bottom: 20px;
	text-shadow: 0 0 30px rgba(59, 130, 246, 0.5);
	animation: pulse 2s infinite;
}
@keyframes pulse {
	0%, 100% {
		transform: scale(1);
	}
	50% {
		transform: scale(1.05);
	}
}
.subtitle {
	color: var(--muted);
	font-size: 1.1rem;
	margin-bottom: 40px;
	max-width: 600px;
	margin-left: auto;
	margin-right: auto;
}
/* Responsivo */
@media (max-width: 768px) {
	.boom-elements {
		grid-template-columns: 1fr;
		gap: 20px;
	}
	.boom-text {
		font-size: 3rem;
	}
}
/* Estilos para a seção O que é */
.pillars {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: start;
	gap: 30px;
	max-width: 1000px;
	margin: 40px auto;
}
.pillar {
	background: var(--panel);
	border-radius: var(--radius);
	border: 1px solid var(--line);
	overflow: hidden;
	transition: all 0.3s ease;
}
.pillar:hover {
	transform: translateY(-5px);
	border-color: var(--brand);
	box-shadow: var(--shadow);
}
.pillar-header {
	padding: 25px 25px 15px;
	text-align: center;
	background: linear-gradient(180deg, rgba(59, 130, 246, 0.1), transparent);
	border-bottom: 1px solid var(--line);
}
.pillar-icon {
	font-size: 2.5rem;
	margin-bottom: 10px;
}
.pillar-header h3 {
	margin: 0;
	color: #eaf2ff;
	font-size: 1.3rem;
}
.pillar-content {
	padding: 20px 25px 25px;
}
.pillar-content p {
	color: var(--muted);
	margin-bottom: 15px;
	font-weight: 500;
}
.pillar-content ul {
	list-style: none;
	padding: 0;
	margin: 0;
}
.pillar-content li {
	padding: 8px 0;
	padding-left: 25px;
	position: relative;
	color: #d7e6ff;
}
.pillar-content li::before {
	content: "✓";
	position: absolute;
	left: 0;
	color: var(--brand);
	font-weight: bold;
}
.pillar-divider {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	padding: 20px 0;
}
.plus {
	font-size: 3rem;
	color: var(--brand);
	font-weight: 900;
	background: var(--panel);
	width: 60px;
	height: 60px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 2px solid var(--brand);
	box-shadow: 0 0 20px rgba(59, 130, 246, 0.3);
}
.transformation {
	margin-top: 40px;
	text-align: center;
}
.arrow {
	font-size: 2.5rem;
	color: var(--brand);
	margin-bottom: 15px;
	animation: bounce 2s infinite;
}
@keyframes bounce {
	0%, 20%, 50%, 80%, 100% {
		transform: translateY(0);
	}
	40% {
		transform: translateY(-10px);
	}
	60% {
		transform: translateY(-5px);
	}
}
/* Responsivo */
@media (max-width: 768px) {
	.pillars {
		grid-template-columns: 1fr;
		grid-template-rows: auto auto auto;
		gap: 20px;
	}
	.pillar-divider {
		order: 2;
		padding: 10px 0;
	}
	.pillar:first-child {
		order: 1;
	}
	.pillar:last-child {
		order: 3;
	}
	.plus {
		width: 50px;
		height: 50px;
		font-size: 2rem;
	}
}
/* Estilos para a seção Local do Evento (versão simplificada) */
.location-simple {
	max-width: 500px;
	margin: 40px auto;
}
.venue-simple {
	background: var(--panel);
	border-radius: var(--radius);
	border: 1px solid var(--line);
	padding: 40px 30px;
	text-align: center;
	position: relative;
	overflow: hidden;
}
.venue-simple::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 4px;
	background: linear-gradient(90deg, var(--brand), #60a5fa);
}
.venue-simple h3 {
	margin: 0 0 5px;
	color: #eaf2ff;
	font-size: 1.8rem;
	font-weight: 900;
}
.venue-host {
	color: var(--muted);
	font-style: italic;
	margin-bottom: 30px;
	font-size: 1.1rem;
}
.location-details {
	display: flex;
	flex-direction: column;
	gap: 20px;
}
.detail-simple {
	display: flex;
	flex-direction: column;
	gap: 5px;
	padding: 15px;
	background: rgba(59, 130, 246, 0.05);
	border-radius: 10px;
	border: 1px solid rgba(59, 130, 246, 0.1);
}
.detail-simple strong {
	color: #eaf2ff;
	font-size: 1.1rem;
}
.detail-simple span {
	color: var(--muted);
	font-size: 0.95rem;
}
.location-cta {
	text-align: center;
	margin-top: 40px;
	padding-top: 30px;
	border-top: 1px solid var(--line);
}
.location-cta p {
	margin-bottom: 20px;
	color: var(--muted);
	font-size: 1.1rem;
}
/* Responsivo */
@media (max-width: 768px) {
	.venue-simple {
		padding: 30px 20px;
	}
	.venue-simple h3 {
		font-size: 1.5rem;
	}
	.location-details {
		gap: 15px;
	}
	.detail-simple {
		padding: 12px;
	}
}
/* ===== CTA local em cada seção ===== */
.section-cta {
	margin-top: 38px;
	text-align: center;
	animation: fadeInUp .8s ease forwards;
}
.btn--sm {
	display: inline-block;
	padding: 10px 22px;
	font-size: 0.95rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	border-radius: 999px;
	border: none;
	cursor: pointer;
	color: #fff;
	background: linear-gradient(90deg, #245fd6 0%, #3b82f6 100%);
	box-shadow: 0 6px 18px rgba(59,130,246,.35);
	transition: all 0.25s ease;
}
.btn--sm:hover {
	transform: translateY(-2px) scale(1.02);
	box-shadow: 0 8px 24px rgba(59,130,246,.45);
	background: linear-gradient(90deg, #3b82f6 0%, #245fd6 100%);
}
/* Animação de entrada */
@keyframes fadeInUp {
	from {
		opacity: 0;
		transform: translateY(20px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/* ===== Modal base ===== */
.bb-modal {
	position: fixed;
	inset: 0;
	z-index: 10000;
	display: none;
}
.bb-modal[aria-hidden="false"] {
	display: block;
}
.bb-modal__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(3, 6, 12, 0.6);
	backdrop-filter: blur(4px);
}
.bb-modal__dialog {
	position: relative;
	margin: 6vh auto 4vh;
	width: min(820px, 92%);
	background: linear-gradient(180deg, rgba(10,18,35,.9), rgba(10,18,35,.86));
	border: 1px solid rgba(59,130,246,.35);
	/* bordas azuis */
	border-radius: var(--radius, 16px);
	box-shadow: 0 24px 64px rgba(0,0,0,.45), inset 0 0 0 1px rgba(255,255,255,.04);
	color: var(--ink, #ecf3ff);
	overflow: hidden;
	animation: bb-modal-in .24s ease-out both;
}
@keyframes bb-modal-in {
	from {
		transform: translateY(10px);
		opacity: 0;
	}
	to {
		transform: translateY(0);
		opacity: 1;
	}
}
.bb-modal__close {
	position: absolute;
	top: 10px;
	right: 12px;
	font-size: 24px;
	line-height: 1;
	width: 36px;
	height: 36px;
	border-radius: 999px;
	border: 1px solid rgba(159,184,255,.25);
	background: rgba(255,255,255,.05);
	color: #eaf2ff;
	cursor: pointer;
}
.bb-modal__close:hover {
	filter: brightness(1.1);
}
.bb-modal__header {
	padding: 20px 22px 6px;
	border-bottom: 1px solid rgba(159,184,255,.18);
}
.bb-modal__title {
	margin: 0;
	font-size: clamp(1.4rem, 2.2vw, 1.8rem);
	font-weight: 900;
	line-height: 1.2;
}
.bb-modal__subtitle {
	margin: 6px 0 0;
	color: var(--muted, #a5b4d6);
}
/* ===== Form ===== */
.bb-form {
	padding: 18px 22px 22px;
}
.bb-form__row {
	margin: 12px 0;
}
.bb-form__row label {
	display: inline-block;
	margin-bottom: 6px;
	font-weight: 800;
	color: #dfe8ff;
}
.bb-form__row input {
	width: 100%;
	padding: 12px 14px;
	border-radius: 12px;
	border: 1px solid #2b5ac3;
	/* borda azul */
	background: rgba(13, 20, 36, .6);
	color: #eaf2ff;
	box-shadow: inset 0 0 0 1px rgba(255,255,255,.02);
	transition: box-shadow .15s ease, border-color .15s ease, background .15s ease;
}
.bb-form__row input::placeholder {
	color: #9cb4e6;
	opacity: .9;
}
.bb-form__row input:focus {
	outline: none;
	border-color: #3b82f6;
	box-shadow: 0 0 0 3px rgba(59,130,246,.25);
	background: rgba(13, 20, 36, .75);
}
.bb-form__error {
	display: block;
	min-height: 16px;
	margin-top: 6px;
	font-size: .88rem;
	color: #ffb4b4;
}
.bb-form__actions {
	margin-top: 16px;
	display: flex;
	flex-direction: column;
	gap: 8px;
	align-items: flex-start;
}
.bb-form__note {
	color: #9db6ff;
	font-size: .92rem;
}
@media (max-width: 640px) {
	.bb-modal__dialog {
		margin: 10vh auto 4vh;
	}
	.bb-form__actions {
		align-items: stretch;
	}
}
/* ===== Ajuste visual do formulário da modal ===== */
.bb-form__row input {
	height: 64px;
	/* altura maior */
	max-width: 480px;
	/* menos largo */
	margin: 0 auto;
	display: block;
	font-size: 1.05rem;
	padding: 0 18px;
}
.bb-form__row {
	text-align: center;
}
.bb-form__row label {
	text-align: left;
	display: block;
	margin: 0 auto 6px;
	max-width: 480px;
}
/* botão alinhado ao centro */
.bb-form__actions {
	display: flex;
	flex-direction: column;
	align-items: center;
}
.bb-form__actions .btn {
	width: auto;
	min-width: 280px;
	height: 60px;
	font-size: 1.05rem;
}
/* responsivo */
@media (max-width: 640px) {
	.bb-form__row input {
		max-width: 100%;
		height: 56px;
	}
	.bb-form__actions .btn {
		width: 100%;
		height: 56px;
	}
}
/* ===== Ajuste geral da modal (menos larga e mais elegante) ===== */
.bb-modal__dialog {
	position: relative;
	margin: 8vh auto 4vh;
	width: min(620px, 90%);
	/* era 820px — agora mais compacta */
	background: linear-gradient(180deg, rgba(10,18,35,.9), rgba(10,18,35,.86));
	border: 1px solid rgba(59,130,246,.35);
	border-radius: 16px;
	box-shadow: 0 24px 64px rgba(0,0,0,.45), inset 0 0 0 1px rgba(255,255,255,.04);
	color: #ecf3ff;
	overflow: hidden;
	animation: bb-modal-in .25s ease-out both;
}
/* ===== Inputs maiores e centralizados ===== */
.bb-form__row input {
	height: 64px;
	/* altura confortável */
	max-width: 420px;
	/* menos largo */
	margin: 0 auto;
	display: block;
	font-size: 1.05rem;
	padding: 0 18px;
}
.bb-form__row {
	text-align: center;
}
.bb-form__row label {
	text-align: left;
	display: block;
	margin: 0 auto 6px;
	max-width: 420px;
}
/* ===== Botão ===== */
.bb-form__actions {
	display: flex;
	flex-direction: column;
	align-items: center;
	margin-top: 20px;
}
.bb-form__actions .btn {
	width: auto;
	min-width: 260px;
	height: 60px;
	font-size: 1.05rem;
	background: linear-gradient(90deg, #245fd6, #3b82f6);
	border: none;
	border-radius: 999px;
	color: #fff;
	cursor: pointer;
	transition: all .25s ease;
}
.bb-form__actions .btn:hover {
	transform: translateY(-2px);
	box-shadow: 0 0 16px rgba(59,130,246,.4);
}
/* ===== Responsivo ===== */
@media (max-width: 640px) {
	.bb-modal__dialog {
		width: 90%;
		margin: 10vh auto;
	}
	.bb-form__row input {
		max-width: 100%;
		height: 56px;
	}
	.bb-form__actions .btn {
		width: 100%;
		height: 56px;
	}
}
/* ===== Modal centralizada visualmente ===== */
.bb-modal__dialog {
	position: relative;
	margin: 8vh auto 4vh;
	width: min(620px, 90%);
	background: linear-gradient(180deg, rgba(10,18,35,.9), rgba(10,18,35,.86));
	border: 1px solid rgba(59,130,246,.35);
	border-radius: 16px;
	box-shadow: 0 24px 64px rgba(0,0,0,.45), inset 0 0 0 1px rgba(255,255,255,.04);
	color: #ecf3ff;
	overflow: hidden;
	animation: bb-modal-in .25s ease-out both;
	display: flex;
	flex-direction: column;
	align-items: center;
	/* centraliza tudo horizontalmente */
	justify-content: center;
	/* centraliza verticalmente o conteúdo */
	text-align: center;
	padding: 32px 0 40px;
}
/* título e subtítulo */
.bb-modal__header {
	width: 100%;
	text-align: center;
	border: none;
	padding: 0 22px 10px;
}
.bb-modal__title {
	margin: 0 auto;
	font-size: clamp(1.5rem, 2vw, 2rem);
	font-weight: 900;
	line-height: 1.2;
	color: #fff;
}
.bb-modal__subtitle {
	margin: 8px auto 0;
	color: #b7c5ff;
}
/* inputs */
.bb-form {
	width: 100%;
	max-width: 420px;
	margin-top: 20px;
}
.bb-form__row {
	margin: 14px 0;
	text-align: center;
}
.bb-form__row label {
	display: block;
	margin-bottom: 6px;
	text-align: left;
	color: #e0e9ff;
}
.bb-form__row input {
	width: 100%;
	height: 64px;
	border-radius: 12px;
	border: 1px solid #2b5ac3;
	background: rgba(13, 20, 36, .6);
	color: #eaf2ff;
	font-size: 1.05rem;
	padding: 0 18px;
	text-align: center;
}
.bb-form__actions {
	margin-top: 24px;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
}
.bb-form__actions .btn {
	width: 260px;
	height: 60px;
	border-radius: 999px;
	background: linear-gradient(90deg, #245fd6, #3b82f6);
	color: #fff;
	font-size: 1.05rem;
	font-weight: 700;
	border: none;
	cursor: pointer;
	transition: all .25s ease;
}
.bb-form__actions .btn:hover {
	transform: translateY(-2px);
	box-shadow: 0 0 16px rgba(59,130,246,.4);
}
/* botão fechar */
.bb-modal__close {
	position: absolute;
	top: 12px;
	right: 16px;
	font-size: 22px;
	border: none;
	background: transparent;
	color: #9db6ff;
	cursor: pointer;
	transition: opacity .2s;
}
.bb-modal__close:hover {
	opacity: 0.8;
}
/* responsivo */
@media (max-width: 640px) {
	.bb-modal__dialog {
		width: 90%;
		padding: 28px 0 36px;
	}
	.bb-form {
		max-width: 100%;
		padding: 0 18px;
	}
	.bb-form__row input {
		height: 56px;
	}
	.bb-form__actions .btn {
		width: 100%;
		height: 56px;
	}
}
/* Força alinhamento à esquerda apenas nos inputs da modal */
.bb-modal .bb-form__row input {
	text-align: left !important;
	/* prioriza sobre a regra anterior */
	padding-left: 18px;
	/* mantém respiro à esquerda */
	padding-right: 18px;
	direction: ltr;
	/* evita centragem estranha em tel/email */
}
/* Placeholders também vão à esquerda (alguns browsers herdavam o center) */
.bb-modal .bb-form__row input::placeholder {
	text-align: left;
}
/* Modal ocupa a viewport inteira e contém o scroll dentro dela */
.bb-modal {
	position: fixed;
	inset: 0;
	z-index: 10000;
	height: 100dvh;
	/* usa viewport dinâmica (corrige teclado mobile) */
	overscroll-behavior: contain;
	/* evita bounce na página por trás */
}
/* O conteúdo da modal rola internamente, não o body */
.bb-modal__dialog {
	position: relative;
	margin: 12px auto;
	width: min(620px, 92%);
	max-height: calc(100dvh - 24px);
	overflow: auto;
	/* rolagem interna */
	-webkit-overflow-scrolling: touch;
	padding: 24px;
	/* ajuste se já tiver padding próprio */
}
/* Respeita áreas seguras do iOS (notch) */
.bb-modal__dialog {
	padding-top: max(24px, env(safe-area-inset-top));
	padding-bottom: max(24px, env(safe-area-inset-bottom));
}
/* Mobile: modal mais “sheet”, bordas suaves */
@media (max-width: 640px) {
	.bb-modal__dialog {
		width: 94%;
		border-radius: 16px;
		margin: 8px auto;
	}
}
/* Garante fonte >=16px para impedir zoom do iOS ao focar inputs */
.bb-modal .bb-form__row input {
	font-size: 16px;
}
.img-mentor {
	border-radius: 12px;
	width: 100%;
	max-width: 700px;
	height: auto;
	object-fit: cover;
	aspect-ratio: 1;
	border: 1px solid transparent;
	background: linear-gradient(45deg, #e0f7ff, #b3e0ff, #80d0ff, #4dc3ff) border-box;
	animation: border-glow 3s ease-in-out infinite alternate;
	box-shadow: 0 0 15px rgba(77, 195, 255, 0.4);
}
.img-holder-free {
	border-radius: 50%;
	width: 100%;
	max-width: 300px;
	height: 300px;
	background: #ddd;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #888;
	margin: 0 auto;
	border: 3px solid transparent;
	background: linear-gradient(45deg, #e0f7ff, #b3e0ff, #80d0ff, #4dc3ff) border-box;
	animation: border-glow 3s ease-in-out infinite alternate;
	box-shadow: 0 0 15px rgba(77, 195, 255, 0.4);
}
@keyframes border-glow {
	0% {
		box-shadow: 0 0 15px rgba(77, 195, 255, 0.4);
		border-color: #b3e0ff;
	}
	100% {
		box-shadow: 0 0 25px rgba(77, 195, 255, 0.8);
		border-color: #4dc3ff;
	}
}
.hero {
	position: relative;
	overflow: hidden;
}
.hero__wrap {
	position: relative;
	z-index: 2;
}
.hero::before {
	content: '';
	position: absolute;
	top: -50px;
	/* Move a imagem para cima */
	left: 0;
	width: 100%;
	height: 100%;
	background-image: url('pngwing.com\ \(1\)\ copiar.png');
	background-repeat: no-repeat;
	background-position: center top;
	background-size: contain;
	opacity: 0.3;
	/* Ajuste a opacidade conforme necessário */
	z-index: 1;
	pointer-events: none;
}
/* Para garantir que o texto fique legível */
.hero__title,.hero__sub,.hero__cta {
	position: relative;
	z-index: 2;
}
.hero__wrap {
	padding-top: 390px;
}
@media (max-width: 768px) {
	.hero::before {
		top: -10px;
		/* Desce a imagem no mobile */
	}
	.hero__wrap {
		padding-top: 80px;
		/* Sobe o texto no mobile */
	}
}
@media (max-width: 768px) {
	.img-mentor {
		max-width: 420px;
		height: 580px;
		aspect-ratio: auto;
	}
	.img-holder-free {
		max-width: 220px;
		height: 280px;
	}
}
@media (max-width: 768px) {
	.mentor-section {
		padding: 100px 0;
		/* Aumenta o padding vertical */
		min-height: 1100px;
		/* Define uma altura mínima maior */
	}
}
/* ===== CORES UNIFICADAS DO FUNDO ===== */
:root {
	--bg-start: #0a0b0f;
	--bg-end: #0f1d35;
	--panel: #0f1522;
	--ink: #ecf3ff;
	--muted: #a5b4d6;
	--line: #1e2a44;
	--brand: #3b82f6;
	--radius: 16px;
	--shadow: 0 16px 40px rgba(0,0,0,.35);
	--shadow-sm: 0 8px 24px rgba(0,0,0,.28);
	--container: 1120px;
}
* {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}
html, body {
	height: 100%;
}
body {
	background: var(--bg-start);
	/* COR ÚNICA - remove o gradiente */
	color: var(--ink);
	font-family: 'Inter', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
	line-height: 1.65;
	position: relative;
}
/* Remove o gradiente entre seções */
.section {
	position: relative;
	padding: 76px 0;
	background: transparent;
	/* Remove o fundo gradiente das seções */
}
/* Remove o efeito de brilho entre seções */
.section::before {
	display: none;
	/* Remove completamente o pseudo-elemento */
}
/* Mantém apenas o efeito sutil de partículas no fundo geral */
body::before {
	content: "";
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-image:radial-gradient(circle at 10% 20%, rgba(59, 130, 246, 0.05) 0%, transparent 20%),radial-gradient(circle at 90% 40%, rgba(59, 130, 246, 0.05) 0%, transparent 20%),radial-gradient(circle at 50% 80%, rgba(59, 130, 246, 0.05) 0%, transparent 20%);
	z-index: -1;
	pointer-events: none;
}
/* Ajusta o hero para usar a mesma cor */
.hero {
	padding: 64px 0 28px;
	position: relative;
	background: var(--bg-start);
	/* Mesma cor do body */
}
.hero--full {
	min-height: 100vh;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	position: relative;
	overflow: hidden;
	background: var(--bg-start);
	/* Mesma cor do body */
}
/* Ajusta as seções dos mentores */
.mentor-section {
	padding: clamp(56px, 8vh, 96px) 0;
	background: transparent;
	/* Remove qualquer fundo específico */
}
/* Garante que todos os elementos tenham o mesmo fundo */
.section,.hero,.mentor-section,.closing {
	background: var(--bg-start);
}
/* ===== FUNDO CONTÍNUO COM GRADIENTE SUAVE ===== */
:root {
	--bg-start: #0a0b0f;
	--bg-end: #0f1d35;
	--panel: #0f1522;
	--ink: #ecf3ff;
	--muted: #a5b4d6;
	--line: #1e2a44;
	--brand: #3b82f6;
	--radius: 16px;
	--shadow: 0 16px 40px rgba(0,0,0,.35);
	--shadow-sm: 0 8px 24px rgba(0,0,0,.28);
	--container: 1120px;
}
* {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}
html, body {
	height: 100%;
}
body {
	background: linear-gradient(180deg, var(--bg-start) 0%, var(--bg-end) 100%);
	background-attachment: fixed;
	/* Faz o gradiente ser contínuo em toda a página */
	color: var(--ink);
	font-family: 'Inter', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
	line-height: 1.65;
	position: relative;
}
/* Remove todos os fundos das seções individuais */
.section {
	position: relative;
	padding: 76px 0;
	background: transparent;
	/* Remove fundo individual */
}
/* Remove o efeito de brilho entre seções */
.section::before {
	display: none;
}
/* Ajusta o hero para ser transparente também */
.hero {
	padding: 64px 0 28px;
	position: relative;
	background: transparent;
}
.hero--full {
	min-height: 100vh;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	position: relative;
	overflow: hidden;
	background: transparent;
}
/* Ajusta as seções dos mentores */
.mentor-section {
	padding: clamp(56px, 8vh, 96px) 0;
	background: transparent;
}
/* Garante que todos os elementos sejam transparentes */
.section,.hero,.mentor-section,.closing {
	background: transparent;
}
/* Mantém apenas o efeito sutil de partículas no fundo geral */
body::before {
	content: "";
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-image:radial-gradient(circle at 10% 20%, rgba(59, 130, 246, 0.05) 0%, transparent 20%),radial-gradient(circle at 90% 40%, rgba(59, 130, 246, 0.05) 0%, transparent 20%),radial-gradient(circle at 50% 80%, rgba(59, 130, 246, 0.05) 0%, transparent 20%);
	z-index: -1;
	pointer-events: none;
}
body {
	background: linear-gradient(180deg, var(--bg-start) 0%, var(--bg-end) 100%, #1e3a8a 150%);
	background-attachment: fixed;
	color: var(--ink);
	font-family: 'Inter', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
	line-height: 1.65;
	position: relative;
}
/* ===== FAQ ALINHADO À ESQUERDA ===== */
#faq .container.narrow.center {
	text-align: left;
	/* Remove o alinhamento centralizado */
}
#faq .faq {
	text-align: left;
	/* Garante que o conteúdo interno também fique à esquerda */
}
#faq h2 {
	text-align: left;
	/* Título também à esquerda */
	margin-left: 0;
	margin-right: 0;
}
/* ===== ALTERNÂNCIA DE POSICIONAMENTO DOS MENTORES ===== */
/* Mentor 1 (Matheus) - padrão: texto esquerda, foto direita */
#mentor-matheus .mentor__grid {
	grid-template-columns: 1.05fr .95fr;
	/* texto | foto */
}
#mentor-matheus .mentor__text {
	order: 1;
}
#mentor-matheus .mentor__media {
	order: 2;
	justify-content: flex-end;
}
/* Mentor 2 (Wellington) - invertido: foto esquerda, texto direita */
#mentor-wellington .mentor__grid {
	grid-template-columns: .95fr 1.05fr;
	/* foto | texto */
}
#mentor-wellington .mentor__text {
	order: 2;
	text-align: right;
}
#mentor-wellington .mentor__media {
	order: 1;
	justify-content: flex-start;
}
/* Mentor 3 (Ricardo) - padrão: texto esquerda, foto direita */
#mentor-ricardo .mentor__grid {
	grid-template-columns: 1.05fr .95fr;
	/* texto | foto */
}
#mentor-ricardo .mentor__text {
	order: 1;
}
#mentor-ricardo .mentor__media {
	order: 2;
	justify-content: flex-end;
}
/* Ajuste para mobile - todos na mesma ordem */
@media (max-width: 980px) {
	#mentor-matheus .mentor__grid,#mentor-wellington .mentor__grid,#mentor-ricardo .mentor__grid {
		grid-template-columns: 1fr;
	}
	#mentor-matheus .mentor__text,#mentor-wellington .mentor__text,#mentor-ricardo .mentor__text {
		order: 2;
		text-align: left;
	}
	#mentor-matheus .mentor__media,#mentor-wellington .mentor__media,#mentor-ricardo .mentor__media {
		order: 1;
		justify-content: center;
	}
}
/* ===== ALTERNÂNCIA DE POSICIONAMENTO DOS MENTORES ===== */
/* Mentor 1 (Matheus) - padrão: texto esquerda, foto direita */
#mentor-matheus .mentor__grid {
	grid-template-columns: 1.05fr .95fr;
	/* texto | foto */
}
#mentor-matheus .mentor__text {
	order: 1;
	text-align: left;
	/* Garante alinhamento à esquerda */
}
#mentor-matheus .mentor__media {
	order: 2;
	justify-content: flex-end;
}
/* Mentor 2 (Wellington) - invertido: foto esquerda, texto direita */
#mentor-wellington .mentor__grid {
	grid-template-columns: .95fr 1.05fr;
	/* foto | texto */
}
#mentor-wellington .mentor__text {
	order: 2;
	text-align: left;
	/* Mantém alinhamento à esquerda mesmo na direita */
}
#mentor-wellington .mentor__media {
	order: 1;
	justify-content: flex-start;
}
/* Mentor 3 (Ricardo) - padrão: texto esquerda, foto direita */
#mentor-ricardo .mentor__grid {
	grid-template-columns: 1.05fr .95fr;
	/* texto | foto */
}
#mentor-ricardo .mentor__text {
	order: 1;
	text-align: left;
	/* Garante alinhamento à esquerda */
}
#mentor-ricardo .mentor__media {
	order: 2;
	justify-content: flex-end;
}
/* Ajuste para mobile - todos na mesma ordem */
@media (max-width: 980px) {
	#mentor-matheus .mentor__grid,#mentor-wellington .mentor__grid,#mentor-ricardo .mentor__grid {
		grid-template-columns: 1fr;
	}
	#mentor-matheus .mentor__text,#mentor-wellington .mentor__text,#mentor-ricardo .mentor__text {
		order: 2;
		text-align: left;
		/* Todos alinhados à esquerda no mobile */
	}
	#mentor-matheus .mentor__media,#mentor-wellington .mentor__media,#mentor-ricardo .mentor__media {
		order: 1;
		justify-content: center;
	}
}
/* ===== AJUSTE MOBILE - ESPAÇAMENTO ENTRE FOTO E TEXTO ===== */
@media (max-width: 980px) {
	#mentor-matheus .mentor__grid,#mentor-wellington .mentor__grid,#mentor-ricardo .mentor__grid {
		grid-template-columns: 1fr;
		gap: 40px !important;
		/* Aumenta o espaçamento entre foto e texto */
	}
	#mentor-matheus .mentor__text,#mentor-wellington .mentor__text,#mentor-ricardo .mentor__text {
		order: 2;
		text-align: left;
		margin-top: 20px;
		/* Adiciona margem superior extra */
	}
	#mentor-matheus .mentor__media,#mentor-wellington .mentor__media,#mentor-ricardo .mentor__media {
		order: 1;
		justify-content: center;
		height: 300px;
		/* Altura fixa para as fotos no mobile */
		margin-bottom: 10px;
		/* Espaço abaixo da foto */
	}
	/* Garante que as imagens não fiquem muito grandes */
	.img-mentor,.img-holder-free {
		max-height: 280px;
		object-fit: contain;
		/* Mantém proporção sem cortar */
	}
}
@media (max-width: 980px) {
	.mentor__grid {
		grid-template-columns: 1fr !important;
		gap: 50px !important;
		/* Espaçamento generoso */
	}
	.mentor__text {
		order: 2;
		text-align: left;
		padding-top: 30px;
		/* Padding extra no topo do texto */
	}
	.mentor__media {
		order: 1;
		justify-content: center;
		height: 320px;
	}
	/* Garante que o container da seção tenha altura suficiente */
	.mentor-section {
		padding: 80px 0;
		min-height: auto;
		/* Remove altura mínima fixa se existir */
	}
}
@media (max-width: 980px) {
	.mentor__media {
		order: 1;
		justify-content: center;
		height: 400px;
		width: 100%;
		margin-bottom: 0;
	}
	.img-mentor,.img-holder-free {
		width: 100%;
		height: 180%;
		max-width: 100%;
		max-height: none;
		object-fit: cover;
		border-radius: 12px;
	}
}
/* ===== MOBILE - MAIS ESPAÇO ENTRE FOTO E TEXTO ===== */
@media (max-width: 980px) {
	#mentor-matheus .mentor__text,#mentor-wellington .mentor__text,#mentor-ricardo .mentor__text {
		order: 2;
		text-align: left;
		margin-top: 150px;
		/* Aumentei de 20px para 60px */
		padding-top: 30px;
		/* Adiciona padding extra */
	}
	/* OU com gap maior no grid */
	#mentor-matheus .mentor__grid,#mentor-wellington .mentor__grid,#mentor-ricardo .mentor__grid {
		grid-template-columns: 1fr;
		gap: 80px !important;
		/* Aumentei de 40px para 80px */
	}
}
/* CORREÇÃO DO FUNDO MOBILE */
html, body { 
  height: 100%; 
  background: linear-gradient(180deg, var(--bg-start) 0%, var(--bg-end) 100%);
  background-attachment: fixed;
}

body {
  background: linear-gradient(180deg, var(--bg-start) 0%, var(--bg-end) 100%);
  background-attachment: fixed;
  min-height: 100vh;
}

/* Remove fundos individuais das seções */
.section,
.hero,
.mentor-section,
.closing {
  background: transparent !important;
}

/* Remove qualquer overlay que possa estar cobrindo */
.section::before {
  display: none;
}
/* AJUSTE DA IMAGEM DA HERO NO MOBILE */
@media (max-width: 768px) {
  .hero::before {
    top: -20px; /* Sobe mais a imagem */
    background-size: 120% auto; /* Aumenta o tamanho da imagem */
    opacity: 0.4; /* Aumenta ligeiramente a opacidade */
  }
  
  .hero__wrap {
    padding-top: 120px; /* Ajusta o padding para compensar a imagem maior */
  }
}

/* Para telas muito pequenas */
@media (max-width: 480px) {
  .hero::before {
    top: -10px;
    background-size: 120% auto; /* Imagem ainda maior em telas pequenas */
  }
  
  .hero__wrap {
    padding-top: 100px;
  }
}
/* IMAGEM QUE ENCAIXA NA LARGURA DO MOBILE */
@media (max-width: 768px) {
  .hero::before {
    background-image: url('hero\ mobile.png');
    background-size: 100% auto; /* Largura 100%, altura automática */
    background-position: center top;
    background-repeat: no-repeat;
    opacity: 0.3;
    top: 0px;
  }
  
  .hero__wrap {
    padding-top: 200px;
  }
}

/* Para telas muito pequenas */
@media (max-width: 480px) {
  .hero::before {
    background-size: 100% auto; /* Mantém 100% da largura */
  }
  
  .hero__wrap {
    padding-top: 180px;
  }
}
/* ====== Mantém tudo em linha no desktop ====== */
.pillars {
  display: grid;
  grid-template-columns: 1fr auto 1fr auto 1fr; /* 3 cards e 2 divisores '+' */
  align-items: start;
  justify-content: center;
  gap: 30px;
}

/* Centraliza os "+" */
.pillar-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  font-size: 28px;
  line-height: 1;
}

/* ====== Responsivo: empilha no mobile ====== */
@media (max-width: 900px) {
  .pillars {
    grid-template-columns: 1fr; /* empilha tudo */
    gap: 20px;
  }

  .pillar-divider {
    margin: 0;
  }
}
/* Mobile: remove os divisores "+" e ajusta o espaçamento entre os cards */
@media (max-width: 900px) {
  .pillar-divider {
    display: none !important;
  }
  .pillars {
    row-gap: 20px; /* respiro entre os cards quando empilhados */
  }
}
