/* Max Gestor Imobiliário — ajustes de identidade visual sobre o skin accounting-2 do Porto */

/* Paleta azul/roxo (10-identidade-visual-e-direcao-de-design.md) substituindo o verde
   herdado do skin "accounting" do Porto — verde fica reservado a indicadores positivos. */
:root {
	--primary: #4338ca;
	--primary-100: #3730a3;
	--primary-200: #312e81;
	--primary-300: #27225f;
	--primary--100: #5b4fe0;
	--primary--200: #7364e8;
	--primary--300: #8b7ded;
	--primary-rgba-0: rgba(67, 56, 202, 0);
	--primary-rgba-10: rgba(67, 56, 202, 0.1);
	--primary-rgba-20: rgba(67, 56, 202, 0.2);
	--primary-rgba-30: rgba(67, 56, 202, 0.3);
	--primary-rgba-40: rgba(67, 56, 202, 0.4);
	--primary-rgba-50: rgba(67, 56, 202, 0.5);
	--primary-rgba-60: rgba(67, 56, 202, 0.6);
	--primary-rgba-70: rgba(67, 56, 202, 0.7);
	--primary-rgba-80: rgba(67, 56, 202, 0.8);
	--primary-rgba-90: rgba(67, 56, 202, 0.9);
}

body {
	font-family: 'Poppins', sans-serif;
}

.bg-color-grey {
	background-color: #f7f8fb;
}

.section-hero {
	background: linear-gradient(180deg, #f2f4ff 0%, #ffffff 100%);
}

/* Mockup de notebook para screenshots do sistema, conforme direção visual (10-identidade-visual) */
.mockup-notebook {
	background: #1f2430;
	border-radius: 14px;
	padding: 14px 14px 22px;
	box-shadow: 0 25px 50px -12px rgba(31, 36, 48, 0.35);
}
.mockup-notebook img {
	border-radius: 6px;
	display: block;
	width: 100%;
	max-height: 480px;
	object-fit: cover;
	object-position: top;
}

/* Mockup de celular para telas de app/portal */
.mockup-phone {
	background: #1f2430;
	border-radius: 34px;
	padding: 16px 10px;
	max-width: 280px;
	margin: 0 auto;
	box-shadow: 0 25px 50px -12px rgba(31, 36, 48, 0.35);
}
.mockup-phone img {
	border-radius: 20px;
	display: block;
	width: 100%;
	max-height: 560px;
	object-fit: cover;
	object-position: top;
}

/* O pseudo-elemento ::before do .box-shadow-1 (tema Porto, css/theme.css:10787) é absolutely
   positioned e cobre 100% do card sem pointer-events:none — como é "positioned" ele pinta acima
   dos filhos static (inputs/textarea), bloqueando cliques em qualquer formulário dentro de um
   card com essa classe (ex.: contato.html, demonstracao.html). É puramente decorativo (só desenha
   a sombra), então nunca deveria interceptar o ponteiro. */
.box-shadow-1:before {
	pointer-events: none;
}

/* Botão flutuante de WhatsApp, fixo em todas as páginas */
.whatsapp-float {
	position: fixed;
	right: 24px;
	bottom: 24px;
	width: 58px;
	height: 58px;
	background-color: #25D366;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	font-size: 28px;
	box-shadow: 0 8px 20px rgba(0, 0, 0, 0.25);
	z-index: 1000;
	text-decoration: none;
}
.whatsapp-float:hover {
	color: #fff;
	transform: scale(1.05);
}
