:root {
	/* Brand typography */
	--vlr-brand-font-display: "Montserrat", "Segoe UI", Arial, sans-serif;
	--vlr-brand-font-body: "Inter", "Segoe UI", Arial, sans-serif;
	--vlr-brand-font-ui: "Inter", "Segoe UI", Arial, sans-serif;

	/* Core palette */
	--vlr-color-bg: #F7F5F2;
	--vlr-color-surface: #F7F5F2;
	--vlr-color-ink: #111111;
	--vlr-color-muted: #6e675d;
	--vlr-color-accent: #F78E2F;
	--vlr-color-accent-strong: #E6761F;
	--vlr-color-green: #123a3f;
	--vlr-color-green-2: #23545a;
	--vlr-color-line: rgba(20, 26, 24, 0.08);
	--vlr-color-border: rgba(28, 26, 22, 0.1);
	--vlr-color-band: #F7F5F2;
	--vlr-color-cool: #F7F5F2;
	--vlr-color-warm: #F7F5F2;
	/* Sobrescrito no inline de asset-loader.php para o mesmo --vlr-color-bg (Customizar). */
	--vlr-color-neutral: #F7F5F2;
	--vlr-color-dark: #111111;
	--vlr-color-hero-start: #f6efe3;
	--vlr-color-hero-mid: #f3e3cf;
	--vlr-color-hero-end: #f7f1e8;
	--vlr-color-hero-panel: #fffaf4;
	--vlr-color-hero-highlight: #F78E2F;
	--vlr-button-bg: #F78E2F;
	--vlr-button-bg-hover: #E6761F;
	--vlr-button-text: #F7F5F2;
	--vlr-button-secondary-text: #F78E2F;
	--vlr-button-secondary-border: #F78E2F;
	--vlr-button-secondary-hover-bg: #F78E2F;
  --vlr-button-secondary-hover-text: #F7F5F2;
  --vlr-card-bg: #F7F5F2;
  --vlr-card-border-color: #e9e1d4;
  --vlr-header-text-all: #ffffff;
  --vlr-header-hover-all: #F78E2F;
  --vlr-header-menu-text: #ffffff;
  --vlr-header-menu-hover: #F78E2F;
  --vlr-header-menu-active: #F78E2F;
  --vlr-header-submenu-text: #111111;
  --vlr-header-submenu-hover: #F78E2F;
  --vlr-header-submenu-active: #F78E2F;
  --vlr-header-bg: #111111;
  --vlr-header-border: #2a2a2a;
  --vlr-header-button-bg: #F78E2F;
  --vlr-header-button-text: #F7F5F2;
  --vlr-header-button-hover-bg: #E6761F;
  --vlr-header-button-hover-text: #F7F5F2;
  --vlr-submenu-bg: #ffffff;
  --vlr-submenu-hover-bg: #f4f4f5;
  --vlr-footer-bg: #16171b;
  --vlr-footer-heading: #ffffff;
  --vlr-footer-text: #cfc7bb;
  --vlr-footer-text-all: #ffffff;
  --vlr-footer-hover-all: #F78E2F;
  --vlr-footer-menu-text: #ffffff;
  --vlr-footer-content-link-text: #cfc7bb;
  --vlr-footer-content-link-hover: #F78E2F;
  --vlr-footer-bar-bg: #111111;
  --vlr-footer-bar-text: #cfc7bb;
  --vlr-footer-bar-link-text: #ffffff;
  --vlr-footer-bar-link-hover: #F78E2F;
  --vlr-footer-menu-hover: #F78E2F;
	--vlr-footer-menu-active: #F78E2F;

	/* Layout */
	--vlr-container-max: 1288px;
	--vlr-gutter-desktop: 28px;
	--vlr-gutter-tablet: 22px;
	--vlr-gutter-mobile: 16px;

	/* Radius */
	--vlr-radius-xl: 32px;
	--vlr-radius-lg: 4px;
	--vlr-radius-md: 4px;
	--vlr-radius-sm: 4px;
	--vlr-radius-pill: 999px;

	/* Shadows */
	--vlr-shadow-soft: 0 16px 40px rgba(17, 20, 18, 0.08);
	--vlr-shadow-card: 0 20px 44px rgba(16, 20, 18, 0.08);
	--vlr-shadow-light: 0 10px 24px rgba(17, 20, 18, 0.04);

	/* Type scale */
	--vlr-title-hero: clamp(2.45rem, 4.1vw, 3.85rem);
	--vlr-title-section: clamp(1.9rem, 2.5vw, 2.65rem);
	--vlr-title-cta: clamp(1.8rem, 2.7vw, 2.5rem);
	--vlr-text-body: 1.03rem;
	--vlr-text-body-lg: 1.05rem;
	--vlr-text-small: 0.98rem;
	--vlr-text-kicker: 0.78rem;

	/* Section spacing */
	--vlr-section-space-desktop: 96px;
	--vlr-section-space-tablet: 80px;
	--vlr-section-space-mobile: 64px;

	/* Buttons */
	--vlr-button-height: 52px;
	--vlr-button-radius: 4px;
	--vlr-button-padding-x: 24px;
	--vlr-button-padding-y: 14px;
	--vlr-card-padding-desktop: 24px;
	--vlr-card-padding-mobile: 16px;
	--vlr-cta-padding-mobile: 24px;
	--vlr-header-padding-y: 20px;
	--vlr-footer-padding-y: 64px;

	/* Mobile typography */
	--vlr-title-mobile: clamp(1.75rem, 7.8vw, 2.15rem);
	--vlr-title-mobile-line: 1.22;
	/* Piso: valores antigos do Customizer (ex.: 1.04) esmagavam linhas com acentos. */
	--vlr-title-mobile-line-safe: clamp(1.2, var(--vlr-title-mobile-line, 1.22), 1.45);

	/* Share bar (Curtir / Compartilhar no artigo) — Personalizar > Share Bar */
	--vlr-share-bar-btn: var(--vlr-color-ink);
	--vlr-share-bar-active: var(--vlr-color-accent-strong);
}

@media (max-width: 1024px) {
	:root {
		--vlr-container-max: 1288px;
	}
}

/*
 * Global Design controls (Customizer)
 * Camada incremental: usa variáveis com fallback para não quebrar layout legado.
 */
:where(.site-container, .container, .velociraptor-container) {
	max-width: min(100%, var(--container-max-width, var(--vlr-container-max, 1288px)));
	padding-left: var(--container-padding-desktop, var(--vlr-gutter-desktop, 28px));
	padding-right: var(--container-padding-desktop, var(--vlr-gutter-desktop, 28px));
	box-sizing: border-box;
}

@media (max-width: 1024px) {
	:where(.site-container, .container, .velociraptor-container) {
		padding-left: var(--container-padding-tablet, var(--vlr-gutter-tablet, 22px));
		padding-right: var(--container-padding-tablet, var(--vlr-gutter-tablet, 22px));
	}
}

@media (max-width: 767px) {
	:where(.site-container, .container, .velociraptor-container) {
		padding-left: var(--container-padding-mobile, var(--vlr-gutter-mobile, 16px));
		padding-right: var(--container-padding-mobile, var(--vlr-gutter-mobile, 16px));
	}
}

/*
 * Mobile safety rail:
 * evita overflow horizontal causado por combinações de alignfull + colunas Gutenberg.
 * Não altera hierarquia visual, apenas garante largura útil da viewport.
 */
@media (max-width: 767px) {
	html,
	body {
		width: 100%;
		max-width: 100%;
		overflow-x: clip;
	}

	:where(#page, #content, .site, .site-content, .inside-article, .entry-content) {
		width: 100%;
		max-width: 100%;
		overflow-x: clip;
	}

	:where(.entry-content > *, .site-main > *, .inside-article > *) {
		max-width: 100%;
		box-sizing: border-box;
	}

	:where(.wp-block-columns) {
		margin-left: 0 !important;
		margin-right: 0 !important;
	}

	:where(.wp-block-columns > .wp-block-column) {
		min-width: 0 !important;
	}

	:where(.entry-content .alignfull, .wp-block-group.alignfull, .wp-block-cover.alignfull) {
		width: 100% !important;
		max-width: 100% !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
	}

	:where(.vlr-home-hero, .vlr-product-hero, .vlr-about-hero) {
		width: 100% !important;
		max-width: 100% !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
	}

	/*
	 * .vlr-home-shell.equipe-shell: não zerar padding — Equipe no Sobre.
	 * .vlr-about-shell: não incluir — páginas Sobre usam-no para gutters; zerar colava toda a página à esquerda.
	 */
	:where(.vlr-home-shell:not(.equipe-shell), .vlr-product-shell) {
		width: calc(100vw - (2 * var(--vlr-gutter-mobile, 16px))) !important;
		max-width: calc(100vw - (2 * var(--vlr-gutter-mobile, 16px))) !important;
		margin-left: auto !important;
		margin-right: auto !important;
		padding-left: 0 !important;
		padding-right: 0 !important;
		box-sizing: border-box;
	}
}

/* Depois do safety rail: iPad mini retrato (~744px) — gutters e shell de tablet (22px), não 16px */
@media (min-width: 720px) and (max-width: 767px) {
	:where(.site-container, .container, .velociraptor-container) {
		padding-left: var(--container-padding-tablet, var(--vlr-gutter-tablet, 22px));
		padding-right: var(--container-padding-tablet, var(--vlr-gutter-tablet, 22px));
	}

	:where(.vlr-home-shell:not(.equipe-shell), .vlr-product-shell) {
		width: calc(100vw - (2 * var(--vlr-gutter-tablet, 22px))) !important;
		max-width: calc(100vw - (2 * var(--vlr-gutter-tablet, 22px))) !important;
	}
}

:where(section, .vlr-home-section, .vlr-product-section) {
	padding-top: var(--section-padding-top, var(--vlr-section-space-desktop, 96px));
	padding-bottom: var(--section-padding-bottom, var(--vlr-section-space-desktop, 96px));
}

:where(
	.wp-block-columns,
	.wp-block-post-template.is-layout-grid,
	.vlr-cards,
	.vlr-product-cards,
	.vlr-home-blog-grid
) {
	gap: var(--global-gap, 24px);
}

:where(.card, .vlr-card, .vlr-service-card, .vlr-testimonial-card, .vlr-product-card) {
	padding: var(--card-padding, var(--vlr-card-padding-desktop, 24px));
	border-radius: var(--card-radius, var(--vlr-ui-card-radius, 16px));
}

:where(
	.chip,
	.vlr-other-insurance-chip,
	.vlr-product-chip,
	.vlr-all-insurances-list > li
) {
	padding: var(--chip-padding, 8px);
	border-radius: var(--chip-radius, 999px);
}

:where(.button, .btn, .wp-block-button__link) {
	padding: var(--button-padding, var(--vlr-button-padding-y, 14px));
	border-radius: var(--button-radius, var(--vlr-button-radius, 4px));
}

h1 {
	font-size: var(--h1-size, var(--vlr-title-hero, clamp(2.45rem, 4.1vw, 3.85rem)));
}

h2 {
	font-size: var(--h2-size, var(--vlr-title-section, clamp(1.9rem, 2.5vw, 2.65rem)));
}

h3 {
	font-size: var(--h3-size, 1.5rem);
}

body,
p {
	font-size: var(--body-size, 16px);
	line-height: var(--line-height, 1.72);
}

@media (max-width: 767px) {
	h1 {
		font-size: var(--h1-size-mobile, 30px);
	}

	h2 {
		font-size: var(--h2-size-mobile, 26px);
	}

	h3 {
		font-size: var(--h3-size-mobile, 19px);
	}
}

/*
 * Bridge para blocos legados (Home/Produtos) com alta especificidade.
 * Garante efeito visível dos controles globais sem reescrever estrutura existente.
 */
body.home .vlr-home-title,
body.home .vlr-section-title,
body.home .vlr-cta-title {
	line-height: var(--line-height, 1.2) !important;
}

body.home .vlr-home-title {
	font-size: var(--h1-size, var(--vlr-title-hero, clamp(2.45rem, 4.1vw, 3.85rem))) !important;
}

body.home .vlr-section-title,
body.home .vlr-cta-title {
	font-size: var(--h2-size, var(--vlr-title-section, clamp(1.9rem, 2.5vw, 2.65rem))) !important;
}

body.home .vlr-home-lead,
body.home .vlr-section-text,
body.home .vlr-cta-text,
body.home .vlr-card-text {
	font-size: var(--body-size, 16px) !important;
	line-height: var(--line-height, 1.6) !important;
}

body.home .vlr-card,
body.home .vlr-service-card,
body.home .vlr-testimonial-card,
body.home .vlr-home-blog-card {
	padding: var(--card-padding, var(--vlr-card-padding-desktop, 24px)) !important;
	border-radius: var(--card-radius, var(--vlr-ui-card-radius, 16px)) !important;
}

body.home .vlr-other-insurance-chip,
body.home .vlr-product-chip {
	padding: var(--chip-padding, 8px) !important;
	border-radius: var(--chip-radius, 999px) !important;
}

body.home .vlr-btn-primary .wp-block-button__link,
body.home .vlr-btn-secondary .wp-block-button__link {
	padding-top: var(--button-padding, var(--vlr-button-padding-y, 14px)) !important;
	padding-bottom: var(--button-padding, var(--vlr-button-padding-y, 14px)) !important;
	border-radius: var(--button-radius, var(--vlr-button-radius, 4px)) !important;
}