/* ==========================================================================
   Rank Level / base
   Design de referência: Figma, frame Home de 1440px.
   No desktop (>= 1024px) as medidas são escaladas a partir do frame de 1440px
   com a unidade --px (1px do Figma). Abaixo disso, cada seção declara seu
   layout mobile.
   ========================================================================== */

@font-face {
	font-family: "Plus Jakarta Sans";
	font-style: normal;
	font-weight: 200 800;
	font-display: swap;
	src: url(../fonts/PlusJakartaSans.woff2) format("woff2");
}

:root {
	--rl-primary-950: #192a52;
	--rl-primary-800: #214387;
	--rl-primary-600: #2b73e5;
	--rl-primary-500: #519af2;
	--rl-gray-950: #0c111d;
	--rl-gray-700: #344054;
	--rl-gray-300: #d0d5dd;
	--rl-gray-200: #eaecf0;
	--rl-white: #ffffff;
	--rl-green: #319f43;

	--rl-font: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;

	/* Largura útil do mobile (gutter de 20px). */
	--rl-gutter: 20px;
}

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

:where(html) { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; background: var(--rl-white); }

:where(body) {
	margin: 0;
	background: var(--rl-white);
	color: var(--rl-gray-950);
	font-family: var(--rl-font);
	font-weight: 400;
	line-height: 1.4;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

:where(h1, h2, h3, h4, p, ul, ol, figure, blockquote) { margin: 0; padding: 0; }
:where(ul, ol) { list-style: none; }
:where(img, svg, video) { display: block; max-width: 100%; }
:where(a) { color: inherit; text-decoration: none; }
:where(button) { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }

.rl-visually-hidden {
	position: absolute !important;
	width: 1px; height: 1px;
	overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%);
	white-space: nowrap;
}

/* Contêiner de escala: 1px do Figma = --px. */
.rl-page {
	container-type: inline-size;
	position: relative;
	overflow-x: clip;
	--px: calc(100cqw / 1440);
}
@media (max-width: 1023.98px) {
	.rl-page { --px: 1px; }
}

/* ---------- Botões ---------- */
.rl-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: var(--rl-primary-600);
	color: var(--rl-white);
	border-radius: calc(4 * var(--px));
	font-size: calc(16 * var(--px));
	font-weight: 600;
	line-height: 1.4;
	white-space: nowrap;
	transition: background-color .2s ease;
}
.rl-btn:hover { background: #1f63d1; }
.rl-btn--solid { padding: calc(16 * var(--px)) calc(24 * var(--px)); }
.rl-btn--arrow {
	gap: calc(24 * var(--px));
	padding: calc(8 * var(--px)) calc(8 * var(--px)) calc(8 * var(--px)) calc(24 * var(--px));
}
.rl-btn__icon {
	display: grid;
	place-items: center;
	width: calc(42 * var(--px));
	height: calc(42 * var(--px));
	border-radius: calc(4 * var(--px));
	background: var(--rl-primary-500);
	transition: transform .2s ease;
}
.rl-btn__icon img { width: calc(24 * var(--px)); height: calc(24 * var(--px)); }
.rl-btn--arrow:hover .rl-btn__icon { transform: translate(2px, -2px); }

.rl-link-arrow {
	display: inline-flex;
	align-items: center;
	gap: calc(8 * var(--px));
	font-size: calc(16 * var(--px));
	line-height: 1.4;
	white-space: nowrap;
}
.rl-link-arrow img { width: calc(24 * var(--px)); height: calc(24 * var(--px)); transition: transform .2s ease; }
.rl-link-arrow:hover img { transform: translateX(3px); }

/* ---------- Top bar (Figma 30003:74) ---------- */
.rl-topbar {
	position: relative;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: center;
	height: calc(36 * var(--px));
	background: #214387 url(../img/topbar/bg.webp) center / 100% 100% no-repeat;
	color: var(--rl-white);
}
.rl-topbar__text {
	font-size: calc(14 * var(--px));
	font-weight: 500;
	line-height: 1.4;
	white-space: nowrap;
}

/* ---------- Header (Figma 30003:54; fixo ao rolar = Frame 482709) ---------- */
.rl-header {
	position: absolute;
	z-index: 50;
	top: calc(36 * var(--px));
	left: 0;
	right: 0;
	color: var(--rl-white);
}
.rl-header__bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: calc(20 * var(--px)) calc(80 * var(--px));
	border-bottom: 1px solid rgba(255, 255, 255, .1);
}
.rl-brand { display: block; flex: none; }
.rl-brand__logo { width: calc(196 * var(--px)); height: calc(33.845 * var(--px)); }
.rl-brand__logo--dark { display: none; }

.rl-nav { display: contents; }
.rl-nav__list {
	display: flex;
	align-items: center;
	gap: calc(32 * var(--px));
	font-size: calc(16 * var(--px));
	line-height: 1.4;
	white-space: nowrap;
}
.rl-nav__link { transition: color .2s ease; }
.rl-nav__link:hover { color: var(--rl-primary-500); }

.rl-header__actions {
	display: flex;
	align-items: center;
	gap: calc(24 * var(--px));
}
.rl-login {
	display: flex;
	align-items: center;
	gap: calc(12 * var(--px));
	font-size: calc(16 * var(--px));
	line-height: 1.4;
}
.rl-login__icon { width: calc(24 * var(--px)); height: calc(24 * var(--px)); }
.rl-login:hover { color: var(--rl-primary-500); }

.rl-menu-toggle { display: none; }

/* Estado fixo: barra branca flutuante. */
.rl-header.is-stuck {
	position: fixed;
	top: 0;
	padding: calc(16 * var(--px)) 0 0;
	color: var(--rl-gray-700);
	animation: rl-header-in .35s cubic-bezier(.2, .7, .2, 1);
}
.rl-header.is-stuck .rl-header__bar {
	width: calc(1314 * var(--px));
	margin-inline: auto;
	padding: calc(16 * var(--px));
	background: var(--rl-white);
	border: 1px solid rgba(0, 0, 0, .1);
	border-radius: calc(4 * var(--px));
}
.rl-header.is-stuck .rl-brand__logo--light { display: none; }
.rl-header.is-stuck .rl-brand__logo--dark { display: block; }
.rl-header.is-stuck .rl-nav__link:hover,
.rl-header.is-stuck .rl-login:hover { color: var(--rl-primary-600); }
@keyframes rl-header-in {
	from { transform: translateY(-100%); opacity: 0; }
	to { transform: none; opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
	.rl-header.is-stuck { animation: none; }
}

/* ---------- Mobile ---------- */
@media (max-width: 1023.98px) {
	/* Botões nunca passam da largura disponível: o texto quebra se preciso. */
	.rl-btn, .rl-link-arrow { max-width: 100%; white-space: normal; text-align: left; }
	.rl-btn__icon { flex: none; }

	.rl-topbar { height: 36px; }
	.rl-topbar__text { font-size: 13px; }

	.rl-header { top: 36px; }
	.rl-header__bar { padding: 16px var(--rl-gutter); min-height: 72px; }
	.rl-brand__logo { width: 150px; height: auto; }

	.rl-menu-toggle {
		display: flex;
		flex-direction: column;
		justify-content: center;
		gap: 5px;
		width: 44px;
		height: 44px;
		margin-right: -10px;
		padding: 10px;
	}
	.rl-menu-toggle__bar {
		display: block;
		height: 2px;
		border-radius: 2px;
		background: currentColor;
		transition: transform .25s ease, opacity .2s ease;
	}
	.rl-menu-toggle[aria-expanded="true"] .rl-menu-toggle__bar:nth-child(2) { transform: translateY(7px) rotate(45deg); }
	.rl-menu-toggle[aria-expanded="true"] .rl-menu-toggle__bar:nth-child(3) { opacity: 0; }
	.rl-menu-toggle[aria-expanded="true"] .rl-menu-toggle__bar:nth-child(4) { transform: translateY(-7px) rotate(-45deg); }

	.rl-nav {
		display: none;
		position: absolute;
		top: 100%;
		left: 0;
		right: 0;
		flex-direction: column;
		gap: 24px;
		padding: 24px var(--rl-gutter) 28px;
		background: var(--rl-primary-950);
		border-bottom: 1px solid rgba(255, 255, 255, .1);
		color: var(--rl-white);
		max-height: calc(100dvh - 72px);
		overflow-y: auto;
	}
	.rl-header.is-open .rl-nav { display: flex; }
	.rl-nav__list { flex-direction: column; align-items: flex-start; gap: 4px; font-size: 18px; }
	.rl-nav__link { display: block; padding: 8px 0; }
	.rl-header__actions { flex-direction: column; align-items: stretch; gap: 16px; }
	.rl-login { font-size: 16px; gap: 12px; padding: 8px 0; }
	.rl-login__icon { width: 24px; height: 24px; }
	.rl-header__actions .rl-btn { font-size: 16px; padding: 16px 24px; border-radius: 4px; }

	.rl-header.is-stuck { padding: 8px 12px 0; }
	.rl-header.is-stuck .rl-header__bar { width: auto; padding: 10px 16px; min-height: 64px; border-radius: 4px; }
	.rl-header.is-stuck .rl-nav { top: calc(100% + 8px); left: 12px; right: 12px; background: var(--rl-white); color: var(--rl-gray-700); border: 1px solid rgba(0, 0, 0, .1); border-radius: 4px; }
	.rl-header.is-stuck .rl-nav .rl-btn { color: var(--rl-white); }
}

/* ---------- Tipografia e peças compartilhadas ---------- */
.rl-h2 {
	font-size: calc(48 * var(--px));
	font-weight: 500;
	line-height: 1.2;
	color: var(--rl-gray-950);
	font-feature-settings: "salt" 1;
}
.rl-icon-box {
	display: grid;
	place-items: center;
	flex: none;
	width: calc(42 * var(--px));
	height: calc(42 * var(--px));
	border-radius: calc(4 * var(--px));
	background: #dcedfd;
}
.rl-icon-box img { width: calc(24 * var(--px)); height: calc(24 * var(--px)); }

@media (max-width: 1023.98px) {
	.rl-h2 { font-size: clamp(30px, 8vw, 40px); }
	.rl-icon-box { width: 42px; height: 42px; border-radius: 4px; }
	.rl-icon-box img { width: 24px; height: 24px; }
}

/* Rolagem suave para as âncoras do menu (sem movimento se o usuário preferir). */
@media (prefers-reduced-motion: no-preference) {
	:where(html) { scroll-behavior: smooth; }
}
:where([id]) { scroll-margin-top: calc(110 * var(--px, 1px)); }

/* ---------- Rodapé (Figma 30009:304: 1440 x 795) ---------- */
.rl-footer {
	padding: 0 calc(16 * var(--px)) calc(16 * var(--px));
	background: #1f5cbd url(../img/footer/bg.webp) center / 100% 100% no-repeat;
}
.rl-footer__card {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: calc(64 * var(--px));
	height: calc(779 * var(--px));
	padding: calc(80 * var(--px)) 0;
	border-radius: calc(4 * var(--px));
	background: var(--rl-white);
	color: var(--rl-gray-700);
	font-size: calc(16 * var(--px));
	line-height: 1.4;
}
.rl-footer__card > * { width: calc(1280 * var(--px)); }
.rl-footer__top { display: flex; align-items: center; justify-content: space-between; }
/* Linha de altura 0 com traço de 1px logo acima (como no Figma). */
.rl-footer__line { position: relative; height: 0; }
.rl-footer__line::before { content: ""; position: absolute; left: 0; right: 0; top: -1px; height: 1px; background: rgba(0, 0, 0, .1); }
.rl-footer__brand { display: flex; align-items: stretch; gap: calc(32 * var(--px)); }
.rl-footer__logo { width: calc(243.227 * var(--px)); height: calc(42 * var(--px)); }
.rl-footer__divider { width: 1px; background: rgba(0, 0, 0, .1); }
.rl-footer__social { display: flex; align-items: center; gap: calc(16 * var(--px)); }
.rl-footer__social-link { display: grid; place-items: center; width: calc(42 * var(--px)); height: calc(42 * var(--px)); border-radius: calc(4 * var(--px)); background: var(--rl-primary-600); transition: background-color .2s ease; }
.rl-footer__social-link:hover { background: #1f63d1; }
.rl-footer__social-link img { width: calc(24 * var(--px)); height: calc(24 * var(--px)); }
.rl-footer__top-link { display: flex; align-items: center; gap: calc(8 * var(--px)); color: var(--rl-gray-950); font-weight: 500; }
.rl-footer__top-link img { width: calc(24 * var(--px)); height: calc(24 * var(--px)); transition: transform .2s ease; }
.rl-footer__top-link:hover img { transform: translateY(-3px); }

.rl-footer__cols { display: flex; align-items: flex-start; gap: calc(64 * var(--px)); }
.rl-footer__col { flex: 1 0 0; min-width: 0; display: flex; flex-direction: column; align-items: flex-start; gap: calc(24 * var(--px)); white-space: nowrap; }
.rl-footer__col ul { display: flex; flex-direction: column; gap: calc(24 * var(--px)); }
.rl-footer__col-title { color: var(--rl-gray-950); font-size: calc(18 * var(--px)); font-weight: 500; line-height: 1.4; }
.rl-footer__col a { transition: color .2s ease; }
.rl-footer__col ul a:hover { color: var(--rl-primary-600); }
.rl-footer__contact { align-self: stretch; display: flex; flex-direction: column; align-items: flex-start; gap: calc(12 * var(--px)); padding: calc(16 * var(--px)); border: 1px solid rgba(0, 0, 0, .1); border-radius: calc(4 * var(--px)); transition: border-color .2s ease; }
.rl-footer__contact:hover { border-color: rgba(43, 115, 229, .4); }
.rl-footer__contact-cta { display: flex; align-items: center; gap: calc(8 * var(--px)); color: var(--rl-primary-600); font-weight: 500; }
.rl-footer__contact-cta img { width: calc(16 * var(--px)); height: calc(16 * var(--px)); transition: transform .2s ease; }
.rl-footer__contact:hover .rl-footer__contact-cta img { transform: translateX(3px); }

.rl-footer__bottom { display: flex; align-items: center; justify-content: space-between; font-size: calc(14 * var(--px)); }
.rl-footer__made { display: flex; align-items: center; gap: calc(8 * var(--px)); }
.rl-footer__made-logo { width: calc(53.239 * var(--px)); height: calc(16 * var(--px)); }

@media (max-width: 1023.98px) {
	.rl-footer { padding: 0 8px 8px; background-size: cover; }
	.rl-footer__card { height: auto; gap: 40px; padding: 48px 20px; border-radius: 4px; font-size: 16px; }
	.rl-footer__card > * { width: 100%; }
	.rl-footer__top { flex-direction: column; align-items: flex-start; gap: 24px; }
	.rl-footer__brand { gap: 20px; }
	.rl-footer__logo { width: 180px; height: auto; }
	.rl-footer__social { gap: 12px; }
	.rl-footer__social-link { width: 42px; height: 42px; border-radius: 4px; }
	.rl-footer__social-link img, .rl-footer__top-link img { width: 24px; height: 24px; }
	.rl-footer__top-link { gap: 8px; }
	.rl-footer__cols { display: grid; grid-template-columns: 1fr 1fr; gap: 36px 20px; }
	.rl-footer__col, .rl-footer__col ul { gap: 16px; white-space: normal; }
	.rl-footer__col:nth-child(n + 3) { grid-column: 1 / -1; }
	.rl-footer__col-title { font-size: 18px; }
	.rl-footer__contact { gap: 8px; padding: 16px; border-radius: 4px; }
	.rl-footer__contact-cta img { width: 16px; height: 16px; }
	.rl-footer__bottom { flex-direction: column; align-items: flex-start; gap: 12px; font-size: 14px; }
	.rl-footer__made { gap: 8px; }
	.rl-footer__made-logo { width: 53px; height: 16px; }
}

/* Conteúdo genérico (index.php). */
.rl-index { max-width: 760px; margin: 0 auto; padding: 200px 20px 80px; }