/*
 * Kairum — Design tokens globais
 * Extraídos do CSS computado da landing de referência (seguru.online/kairum/)
 * e confirmados no brand book / paleta de cores oficial.
 *
 * Estes tokens também estão cadastrados em Elementor → Configurações do
 * Site → Estilos Globais (cores e fontes) para uso direto nos controles
 * do editor. Este arquivo garante que qualquer CSS customizado adicional
 * (containers, popup, marca d'água) use exatamente os mesmos valores.
 */

:root {
	/* Cores */
	--kairum-green: #141F1C;
	--kairum-green-deep: #0C1311;
	--kairum-green-soft: #1C2B27;
	--kairum-gray: #C5C5C5;
	--kairum-gray-2: #8D938F;
	--kairum-paper: #F4F5F3;
	--kairum-paper-2: #E8EAE6;
	--kairum-line: rgba(197, 197, 197, .18);

	/* Gradientes decorativos */
	--kairum-metal: linear-gradient(135deg, #e8eae6 0%, #c5c5c5 28%, #f4f5f3 52%, #a8aaa6 74%, #dfe1dd 100%);
	--kairum-metal-dark: linear-gradient(135deg, #1c2b27 0%, #141F1C 45%, #0c1311 100%);

	/* Layout */
	--kairum-maxw: 1280px;
	--kairum-pad: clamp(20px, 5vw, 72px);
	--kairum-radius: 18px;
	--kairum-ease: cubic-bezier(.16, .84, .32, 1);

	/* Tipografia */
	--kairum-font-display: "TT Hoves", sans-serif;
	--kairum-font-body: "Helvetica World", "TT Hoves", Arial, sans-serif;
}

/* Reset leve de fonte para todo o site, sem depender do tema ativo */
body.kairum-site {
	font-family: var(--kairum-font-body);
	background-color: var(--kairum-paper);
	color: var(--kairum-green);
}

.kairum-site h1,
.kairum-site h2,
.kairum-site h3,
.kairum-site h4 {
	font-family: var(--kairum-font-display);
	letter-spacing: -0.02em;
}

/* Padrão "peso leve + ênfase em negrito" usado em todos os títulos-chave */
.kairum-site .kairum-emphasis {
	font-weight: 700;
}

/* Marca d'água do símbolo Kairum em seções escuras */
.kairum-watermark {
	position: absolute;
	pointer-events: none;
	opacity: .08;
	color: var(--kairum-paper);
	font-family: var(--kairum-font-display);
	font-weight: 200;
	z-index: 0;
	user-select: none;
}

/* Botão primário sobre fundo escuro (metal) */
.kairum-btn-primary {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: var(--kairum-gray);
	color: var(--kairum-green) !important;
	border-radius: 100px;
	padding: 15px 28px;
	font-family: var(--kairum-font-display);
	font-weight: 500;
	font-size: 15px;
	letter-spacing: 0.02em;
	text-decoration: none;
	transition: transform .35s var(--kairum-ease), background-color .35s var(--kairum-ease);
}

.kairum-btn-primary:hover {
	transform: translateY(-2px);
	background-color: #ffffff;
	color: var(--kairum-green) !important;
}

/* Botão secundário (outline) sobre fundo escuro */
.kairum-btn-secondary {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: transparent;
	color: var(--kairum-paper) !important;
	border: 1px solid rgba(197, 197, 197, .4);
	border-radius: 100px;
	padding: 15px 28px;
	font-family: var(--kairum-font-display);
	font-weight: 500;
	font-size: 15px;
	letter-spacing: 0.02em;
	text-decoration: none;
	transition: border-color .35s var(--kairum-ease), background-color .35s var(--kairum-ease);
}

.kairum-btn-secondary:hover {
	border-color: var(--kairum-gray);
	background-color: rgba(197, 197, 197, .08);
}

/* Botão primário sobre fundo claro */
.kairum-btn-primary-dark {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: var(--kairum-green);
	color: var(--kairum-paper) !important;
	border-radius: 100px;
	padding: 15px 28px;
	font-family: var(--kairum-font-display);
	font-weight: 500;
	font-size: 15px;
	letter-spacing: 0.02em;
	text-decoration: none;
	transition: transform .35s var(--kairum-ease), background-color .35s var(--kairum-ease);
}

.kairum-btn-primary-dark:hover {
	transform: translateY(-2px);
	background-color: var(--kairum-green-deep);
}

/* Eyebrow (rótulo pequeno acima de títulos) */
.kairum-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-family: var(--kairum-font-display);
	font-size: 13px;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: var(--kairum-gray-2);
}

.kairum-eyebrow::before {
	content: "";
	width: 28px;
	height: 1px;
	background: currentColor;
	display: inline-block;
}

/* Header sticky com transição suave ao rolar (classe alternada via JS) */
.kairum-header {
	position: sticky;
	top: 0;
	z-index: 999;
	padding: 14px var(--kairum-pad);
	background: transparent;
	transition: background-color .4s var(--kairum-ease), box-shadow .4s var(--kairum-ease), backdrop-filter .4s var(--kairum-ease);
}

.kairum-header.kairum-scrolled {
	background-color: rgba(20, 31, 28, .85);
	backdrop-filter: blur(10px);
	box-shadow: 0 1px 0 var(--kairum-line);
}

/* Cards de veículo do catálogo */
.kairum-card {
	background: var(--kairum-green-soft);
	border-radius: var(--kairum-radius);
	border: 1px solid var(--kairum-line);
	overflow: hidden;
	transition: transform .4s var(--kairum-ease), border-color .4s var(--kairum-ease);
}

.kairum-card:hover {
	transform: translateY(-4px);
	border-color: var(--kairum-gray);
}

/* Popup de aviso legal */
.kairum-popup-card {
	background: var(--kairum-metal-dark);
	border: 1px solid var(--kairum-line);
	border-radius: 20px;
	text-align: center;
	padding: 48px 40px;
}

/* Responsivo: reduz padding de seção no mobile sem perder hierarquia */
@media (max-width: 767px) {
	:root {
		--kairum-pad: 20px;
	}
}