:root {
	--hsm-menu-width-desktop: 440px;
	--hsm-menu-width-tablet: 400px;
	--hsm-menu-width-mobile: 88vw;
	--hsm-menu-width-current: var(--hsm-menu-width-desktop);
	--hsm-camera-shift: 440px;
	--hsm-duration: 720ms;
	--hsm-panel-duration: 360ms;
	--hsm-parallax: 34px;
	--hsm-stage-bg: #00000017;
	--hsm-stage-bg-resolved: var(--hsm-stage-bg);
	--hsm-ease: cubic-bezier(.76, 0, .24, 1);
	--hsm-panel-ease: cubic-bezier(.72, 0, .28, 1);
	--hsm-adminbar-offset: 0px;
	--hsm-layout-width: 100vw;
}

@media (max-width: 1024px) {
	:root { --hsm-menu-width-current: var(--hsm-menu-width-tablet); }
}

@media (max-width: 767px) {
	:root { --hsm-menu-width-current: var(--hsm-menu-width-mobile); }
}

body.admin-bar { --hsm-adminbar-offset: 32px; }
@media (max-width: 782px) {
	body.admin-bar { --hsm-adminbar-offset: 46px; }
}

/* Antes do JS montar o plano horizontal, o menu-fonte não pode ocupar espaço no Header. */
.hsm-menu-source:not(.hsm-stage-ready) {
	display: none !important;
	visibility: hidden !important;
	pointer-events: none !important;
}

/*
 * CAMERA / MUNDO
 * --------------------------------------------------------------------------
 * A partir da v1.4 a página NÃO é animada isoladamente e o menu NÃO é uma
 * gaveta posicionada atrás dela. O JS coloca #page e .hsm-menu-stage dentro
 * do mesmo plano horizontal. Só esse plano recebe transform.
 *
 * Isso faz a movimentação se comportar como uma câmera indo para a direita:
 * página + menu + header sticky são partes rígidas do mesmo cenário.
 */
html.hsm-camera-active,
body.hsm-initialized {
	overflow-x: clip;
}

.hsm-camera-world {
	position: relative !important;
	display: grid !important;
	grid-template-columns: var(--hsm-layout-width) var(--hsm-menu-width-current) !important;
	grid-template-rows: auto !important;
	align-items: start !important;
	column-gap: 0 !important;
	row-gap: 0 !important;
	width: calc(var(--hsm-layout-width) + var(--hsm-menu-width-current)) !important;
	max-width: none !important;
	min-width: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	outline: 0 !important;
	box-shadow: none !important;
	transform: translate3d(0, 0, 0);
	transform-origin: left top;
	transition: transform var(--hsm-duration) var(--hsm-ease);
	will-change: auto;
}

/*
 * PROFUNDIDADE ENTRE PÁGINA E MENU
 * --------------------------------------------------------------------------
 * A sombra pertence à própria página normal e avança suavemente sobre o stage.
 * Isso cria a leitura de que a página está alguns pixels à frente do menu, sem
 * formar uma faixa/borda artificial e sem exagerar na profundidade.
 */

body.hsm-menu-opening .hsm-camera-world,
body.hsm-menu-open .hsm-camera-world,
body.hsm-menu-closing .hsm-camera-world {
	will-change: transform;
}

body.hsm-menu-open .hsm-camera-world {
	transform: translate3d(calc(-1 * var(--hsm-camera-shift)), 0, 0);
}

body.hsm-menu-closing .hsm-camera-world {
	transform: translate3d(0, 0, 0);
}

/* #page é apenas a primeira coluna do mundo. Não existe transform próprio. */
.hsm-camera-world > #page,
.hsm-camera-world > .hsm-camera-page {
	position: relative;
	grid-column: 1 !important;
	grid-row: 1 !important;
	width: var(--hsm-layout-width) !important;
	max-width: var(--hsm-layout-width) !important;
	min-width: 0 !important;
	transform: none !important;
	z-index: 30 !important;
	box-shadow: 10px 0 28px -16px rgba(0, 0, 0, .32) !important;
	border-right: 0 !important;
	outline: 0 !important;
}

/*
 * MENU LATERAL
 * --------------------------------------------------------------------------
 * É a segunda coluna real do mesmo mundo. Ele não fica atrás da página e não
 * recebe translateX próprio. Enquanto fechado está literalmente fora da
 * viewport, à direita da primeira coluna.
 */
.hsm-menu-stage {
	position: sticky !important;
	grid-column: 2 !important;
	grid-row: 1 !important;
	align-self: start !important;
	top: var(--hsm-adminbar-offset) !important;
	left: auto !important;
	right: auto !important;
	bottom: auto !important;
	z-index: 20 !important;
	display: flex !important;
	flex-direction: column !important;
	width: var(--hsm-menu-width-current) !important;
	max-width: var(--hsm-menu-width-current) !important;
	min-width: var(--hsm-menu-width-current) !important;
	height: calc(100dvh - var(--hsm-adminbar-offset)) !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	overflow: hidden !important;
	visibility: hidden !important;
	pointer-events: none !important;
	opacity: 1 !important;
	transform: none !important;
	transition: none !important;
	background: var(--hsm-stage-bg-resolved, #00000017) !important;
	box-shadow: none !important;
	border: 0 !important;
	outline: 0 !important;
	overscroll-behavior: contain;
	box-sizing: border-box !important;
}

body.hsm-menu-opening .hsm-menu-stage,
body.hsm-menu-open .hsm-menu-stage,
body.hsm-menu-closing .hsm-menu-stage {
	visibility: visible !important;
}

body.hsm-menu-opening .hsm-menu-stage,
body.hsm-menu-open .hsm-menu-stage {
	pointer-events: auto !important;
}

body.hsm-menu-closing .hsm-menu-stage {
	pointer-events: none !important;
}

/* Nenhum parallax na abertura principal: conteúdo e stage viajam 1:1 com o mundo. */
.hsm-menu-stage > .hsm-menu-head,
.hsm-menu-stage > .hsm-menu-nav,
.hsm-menu-stage > .hsm-menu-foot {
	transform: none !important;
	transition: none !important;
}

/* Elementor às vezes limita a largura/altura por wrappers internos. */
.hsm-menu-stage > .e-con-inner,
.hsm-menu-stage > .elementor-container,
.hsm-menu-stage > .elementor-widget-wrap {
	width: 100% !important;
	max-width: none !important;
	height: 100% !important;
	min-height: 0 !important;
}

.hsm-menu-stage .hsm-menu-head,
.hsm-menu-stage .hsm-menu-foot {
	flex: 0 0 auto;
	min-height: 0;
	position: relative;
	z-index: 4;
}

.hsm-menu-stage .hsm-menu-nav {
	position: relative;
	z-index: 2;
	flex: 1 1 auto;
	min-height: 0;
	height: 100%;
	overflow: hidden !important;
	perspective: 900px;
	transform-style: preserve-3d;
}

.hsm-menu-stage .hsm-menu-nav.hsm-nav-enhanced {
	display: block !important;
}

.hsm-menu-stage .hsm-original-nav {
	display: none !important;
}

.hsm-menu-panels {
	position: absolute;
	inset: 0;
	min-height: 0;
	overflow: hidden;
	perspective: 900px;
	transform-style: preserve-3d;
}

.hsm-menu-panel {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	min-height: 0;
	padding: 0 2px;
	overflow-y: auto;
	overflow-x: hidden;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transform: rotateY(-90deg);
	transform-origin: 50% 50%;
	transform-style: preserve-3d;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
	transition:
		transform var(--hsm-panel-duration) cubic-bezier(.645, .045, .355, 1),
		opacity 80ms linear,
		visibility 0s linear var(--hsm-panel-duration);
	will-change: transform;
	-webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 44px, #000 calc(100% - 44px), transparent 100%);
	mask-image: linear-gradient(to bottom, transparent 0, #000 44px, #000 calc(100% - 44px), transparent 100%);
	scrollbar-width: thin;
	scroll-behavior: smooth;
	overscroll-behavior: contain;
}

.hsm-menu-panel.is-active {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transform: rotateY(0deg);
	transform-origin: 50% 50%;
	transition-delay: 0s;
}

/*
 * Prisma no próprio eixo — AVANÇAR:
 * a face atual gira para a direita (+90°), enquanto a nova face parte de
 * -90° e termina em 0°. Nenhuma das faces recebe translateX.
 */
.hsm-menu-panel.is-active.is-entering-forward {
	transform: rotateY(-90deg);
	transform-origin: 50% 50%;
}

.hsm-menu-panel.is-leaving-forward {
	opacity: 1;
	visibility: visible;
	pointer-events: none;
	transform: rotateY(90deg);
	transform-origin: 50% 50%;
}

/*
 * Prisma no próprio eixo — VOLTAR:
 * movimento perfeitamente inverso: atual vai a -90° e a anterior entra
 * partindo de +90°.
 */
.hsm-menu-panel.is-active.is-entering-back {
	transform: rotateY(90deg);
	transform-origin: 50% 50%;
}

.hsm-menu-panel.is-leaving-back {
	opacity: 1;
	visibility: visible;
	pointer-events: none;
	transform: rotateY(-90deg);
	transform-origin: 50% 50%;
}

.hsm-panel-head {
	position: sticky;
	top: 0;
	z-index: 5;
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 46px 22px 18px;
	background: linear-gradient(to bottom, var(--hsm-stage-bg-resolved) 58%, rgba(255,255,255,0));
}

.hsm-panel-back {
	appearance: none;
	border: 0;
	background: transparent;
	padding: 7px 8px 7px 0;
	margin: 0;
	font: inherit;
	color: inherit;
	cursor: pointer;
}

.hsm-panel-back::before {
	content: "←";
	display: inline-block;
	margin-right: 7px;
	transition: transform 180ms ease;
}

.hsm-panel-back:hover::before,
.hsm-panel-back:focus-visible::before {
	transform: translateX(-3px);
}

.hsm-panel-title {
	font: inherit;
	font-weight: 600;
	line-height: 1.1;
}

.hsm-menu-panel > ul {
	list-style: none;
	margin: 0 !important;
	padding: 48px 22px !important;
}

.hsm-menu-panel:not([data-hsm-root="1"]) > ul {
	padding-top: 12px !important;
}

.hsm-menu-panel li {
	position: relative;
	list-style: none;
	margin: 0;
	padding: 0;
}

.hsm-menu-panel li + li {
	margin-top: 2px;
}

.hsm-menu-panel li > a {
	display: flex !important;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	width: 100%;
	min-height: 42px;
	padding: 8px 0 !important;
	text-decoration: none !important;
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
}

.hsm-menu-panel li > a[data-hsm-open-panel] {
	cursor: pointer;
}

.hsm-menu-arrow {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 22px;
	height: 22px;
	font-size: 20px;
	line-height: 1;
	transition: transform 180ms ease;
}

.hsm-menu-panel li > a[data-hsm-open-panel]:hover .hsm-menu-arrow,
.hsm-menu-panel li > a[data-hsm-open-panel]:focus-visible .hsm-menu-arrow {
	transform: translateX(3px);
}

/* Remove definitivamente o caret para baixo nativo do Nav Menu do Elementor. */
.hsm-menu-panel .sub-arrow,
.hsm-menu-panel a[data-hsm-open-panel] > .sub-arrow {
	display: none !important;
	visibility: hidden !important;
	width: 0 !important;
	height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
}

/* Neutraliza posicionamentos de dropdown do Elementor no clone usado pelo plugin. */
.hsm-menu-panel .sub-menu,
.hsm-menu-panel .elementor-nav-menu--dropdown,
.hsm-menu-panel ul ul {
	position: static !important;
	left: auto !important;
	top: auto !important;
	width: auto !important;
	min-width: 0 !important;
	max-width: none !important;
	display: block !important;
	visibility: visible !important;
	opacity: 1 !important;
	transform: none !important;
	box-shadow: none !important;
	background-color: transparent !important;
}

/*
 * HEADER / TROCA VISUAL
 * --------------------------------------------------------------------------
 * O header permanece sticky desde o início. Assim logo, ações e hamburger não
 * mudam de coordenada vertical enquanto a página rola. Ao atingir o threshold
 * o JS apenas troca o estado visual para o header escuro; não há reposicionamento.
 * Horizontalmente ele continua dentro do #page e acompanha o mundo quando o menu
 * é aberto, sem invadir a coluna lateral.
 */
#masthead.hsm-header-track,
.hsm-header-track {
	position: sticky !important;
	top: var(--hsm-adminbar-offset) !important;
	left: auto !important;
	right: auto !important;
	width: 100% !important;
	max-width: 100% !important;
	z-index: 1000 !important;
	transform: none !important;
	box-shadow: none !important;
	background-color: rgba(18,18,18,0);
	-webkit-backdrop-filter: blur(0px);
	backdrop-filter: blur(0px);
	transition:
		background-color 480ms cubic-bezier(.22, 1, .36, 1),
		-webkit-backdrop-filter 480ms cubic-bezier(.22, 1, .36, 1),
		backdrop-filter 480ms cubic-bezier(.22, 1, .36, 1);
}

#masthead.hsm-header-sticky,
.hsm-header-sticky {
	background-color: rgba(18,18,18,.70);
	-webkit-backdrop-filter: blur(16px);
	backdrop-filter: blur(16px);
	box-shadow: none !important;
}

/*
 * O template Elementor 1097 usa ícones/elementos escuros. O JS adiciona esta
 * classe apenas quando esse template está realmente dentro do #masthead.
 * Mantemos exatamente o mesmo blur e a mesma transição do header padrão,
 * trocando somente a cor da superfície para preservar o contraste.
 */
#masthead.hsm-header-track.hsm-header-light-surface,
.hsm-header-track.hsm-header-light-surface {
	background-color: rgba(255,255,255,0);
}

#masthead.hsm-header-sticky.hsm-header-light-surface,
.hsm-header-sticky.hsm-header-light-surface {
	background-color: rgba(255,255,255,.70);
}

/* O grupo de ícones não compacta nem desloca ao abrir o menu. */
.hsm-header-actions {
	transform: none !important;
}


/*
 * BUSCA EXPANSÍVEL DO HEADER
 * --------------------------------------------------------------------------
 * A expansão acontece no PRÓPRIO .hsm-header-actions. O container original
 * aumenta de largura para a esquerda e, por continuar ancorado pela direita,
 * mantém a mesma borda direita e o mesmo visual do Elementor.
 *
 * Elementor:
 * - ícone de lupa: hsm-menu-search
 * - widget Search: hsm-search-widget
 */
.hsm-header-actions.hsm-search-ready {
	--hsm-search-base-width: 300px;
	--hsm-search-panel-width: 235px;
	position: relative !important;
	box-sizing: border-box !important;
	width: var(--hsm-search-base-width) !important;
	min-width: var(--hsm-search-base-width) !important;
	max-width: none !important;
	flex-grow: 0 !important;
	flex-shrink: 0 !important;
	flex-basis: auto !important;
	margin-left: auto !important;
	overflow: hidden !important;
	isolation: isolate;
	transition:
		width 360ms cubic-bezier(.22, 1, .36, 1),
		min-width 360ms cubic-bezier(.22, 1, .36, 1);
	will-change: width;
}

/* Estado realmente expandido: a borda direita fica parada e a esquerda cresce. */
.hsm-header-actions.hsm-search-open,
.hsm-header-actions.hsm-search-ready:has(.hsm-menu-search:hover),
.hsm-header-actions.hsm-search-ready:has(.hsm-menu-search:focus-within) {
	width: calc(var(--hsm-search-base-width) + var(--hsm-search-panel-width)) !important;
	min-width: calc(var(--hsm-search-base-width) + var(--hsm-search-panel-width)) !important;
}

/*
 * O Elementor centraliza os ícones no container. Quando a largura cresce para
 * a esquerda, o centro geométrico do container também anda para a esquerda.
 * Esta compensação de metade da expansão mantém TODOS os ícones exatamente na
 * mesma coordenada da tela durante cada frame da animação.
 */
.hsm-header-actions.hsm-search-ready > .elementor-element:not(.hsm-search-widget) {
	transition: transform 360ms cubic-bezier(.22, 1, .36, 1) !important;
	will-change: transform;
}

.hsm-header-actions.hsm-search-open > .elementor-element:not(.hsm-search-widget),
.hsm-header-actions.hsm-search-ready:has(.hsm-menu-search:hover) > .elementor-element:not(.hsm-search-widget),
.hsm-header-actions.hsm-search-ready:has(.hsm-menu-search:focus-within) > .elementor-element:not(.hsm-search-widget) {
	transform: translate3d(calc(var(--hsm-search-panel-width) / 2), 0, 0) !important;
}

.hsm-menu-search {
	position: relative !important;
	z-index: 5;
	cursor: pointer;
}

/*
 * O Search fica dentro do espaço NOVO do próprio container. O right usa a
 * largura original da cápsula: assim a borda direita do campo coincide com a
 * antiga borda esquerda do menu, enquanto o container cresce ao redor dele.
 *
 * IMPORTANTE: esta regra vale desde o primeiro paint, e não apenas depois de
 * .hsm-search-ready. O widget Search existe no HTML como filho do flex e, se
 * aguardarmos o JavaScript para torná-lo absoluto, ele participa por alguns
 * instantes do cálculo de gap/centralização e empurra os ícones para a direita.
 * Mantê-lo absoluto e invisível desde o CSS inicial elimina esse layout shift.
 */
.hsm-header-actions .hsm-search-widget,
.hsm-header-actions .hsm-search-widget.elementor-element {
	position: absolute !important;
	top: 50% !important;
	right: calc(var(--hsm-search-base-width) - 8px) !important;
	left: auto !important;
	bottom: auto !important;
	z-index: 4 !important;
	width: calc(var(--hsm-search-panel-width) - 24px) !important;
	max-width: calc(var(--hsm-search-panel-width) - 24px) !important;
	min-width: 0 !important;
	height: calc(100% - 10px) !important;
	margin: 0 !important;
	padding: 0 !important;
	align-self: auto !important;
	flex: 0 0 auto !important;
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transform: translate3d(8px, -50%, 0);
	transform-origin: right center;
	transition:
		transform 300ms cubic-bezier(.22, 1, .36, 1),
		opacity 150ms ease,
		visibility 0s linear 360ms;
	will-change: transform, opacity;
}

.hsm-header-actions.hsm-search-open .hsm-search-widget,
.hsm-header-actions.hsm-search-open .hsm-search-widget.elementor-element,
.hsm-header-actions.hsm-search-ready:has(.hsm-menu-search:hover) .hsm-search-widget,
.hsm-header-actions.hsm-search-ready:has(.hsm-menu-search:focus-within) .hsm-search-widget {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transform: translate3d(0, -50%, 0);
	transition-delay: 55ms, 55ms, 0s;
}

/* Usado pelo JS apenas para recalcular a largura original em resize/breakpoint. */
.hsm-header-actions.hsm-search-ready.hsm-search-measuring {
	width: var(--width, auto) !important;
	min-width: 0 !important;
	max-width: none !important;
	transition: none !important;
}

.hsm-header-actions.hsm-search-ready.hsm-search-measuring > .elementor-element:not(.hsm-search-widget) {
	transform: none !important;
	transition: none !important;
}

/* Elementor pode iniciar o componente Search com .hidden. */
.hsm-header-actions.hsm-search-open .hsm-search-widget .e-search.hidden,
.hsm-header-actions.hsm-search-ready:has(.hsm-menu-search:hover) .hsm-search-widget .e-search.hidden,
.hsm-header-actions.hsm-search-ready:has(.hsm-menu-search:focus-within) .hsm-search-widget .e-search.hidden {
	display: block !important;
}

/* Neutraliza completamente o visual padrão branco/preto do Search do Elementor. */
.hsm-search-widget search,
.hsm-search-widget .e-search,
.hsm-search-widget form,
.hsm-search-widget .e-search-form,
.hsm-search-widget .elementor-search-form,
.hsm-search-widget .e-search-input-wrapper {
	width: 100% !important;
	max-width: 100% !important;
	height: 100% !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	background: transparent !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
}

.hsm-search-widget .e-search-form,
.hsm-search-widget .elementor-search-form {
	display: flex !important;
	align-items: center !important;
}

.hsm-search-widget .e-search-input-wrapper {
	display: flex !important;
	align-items: center !important;
	position: relative !important;
}

.hsm-search-widget input[type="search"],
.hsm-search-widget input[type="text"],
.hsm-search-widget .e-search-input,
.hsm-search-widget .elementor-search-form__input {
	width: 100% !important;
	height: 100% !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 0 20px 0 10px !important;
	background: transparent !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	outline: 0 !important;
	color: #fff !important;
	font: inherit !important;
	font-size: 14px !important;
	font-weight: 400 !important;
}

.hsm-search-widget input[type="search"]::placeholder,
.hsm-search-widget input[type="text"]::placeholder,
.hsm-search-widget .e-search-input::placeholder,
.hsm-search-widget .elementor-search-form__input::placeholder {
	color: rgba(255,255,255,.70) !important;
	opacity: 1 !important;
}

/* A lupa do header já é o acionador visual; o botão padrão do widget não aparece. */
.hsm-search-widget .e-search-submit,
.hsm-search-widget .elementor-search-form__submit,
.hsm-search-widget button[type="submit"] {
	display: none !important;
}

/* Mantém o X de limpeza do Search discreto dentro da cápsula. */
.hsm-search-widget .e-search-input-wrapper > svg,
.hsm-search-widget .e-search-input-wrapper .e-font-icon-svg {
	position: absolute !important;
	right: 6px !important;
	top: 50% !important;
	width: 10px !important;
	height: 10px !important;
	transform: translateY(-50%) !important;
	fill: rgba(255,255,255,.72) !important;
	color: rgba(255,255,255,.72) !important;
}

@media (max-width: 1024px) {
	.hsm-header-actions.hsm-search-ready {
		--hsm-search-panel-width: 210px;
	}
}

@media (max-width: 767px) {
	.hsm-header-actions.hsm-search-ready {
		--hsm-search-panel-width: min(58vw, 220px);
	}
}

.hsm-menu-trigger {
	position: relative !important;
	cursor: pointer;
	outline-offset: 5px;
}

.hsm-menu-trigger .elementor-icon {
	position: relative !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
}

.hsm-menu-trigger .hsm-trigger-x {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	opacity: 0;
	pointer-events: none;
	transform: rotate(50deg) scale(.72);
	transform-origin: center;
	transition: transform 360ms var(--hsm-ease), opacity 220ms ease;
}

.hsm-menu-trigger .hsm-trigger-x::before,
.hsm-menu-trigger .hsm-trigger-x::after {
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	width: 22px;
	height: 2px;
	border-radius: 99px;
	background: currentColor;
	transform-origin: center;
}

.hsm-menu-trigger .hsm-trigger-x::before {
	transform: translate(-50%, -50%) rotate(45deg);
}

.hsm-menu-trigger .hsm-trigger-x::after {
	transform: translate(-50%, -50%) rotate(-45deg);
}

.hsm-menu-trigger svg,
.hsm-menu-trigger .elementor-icon > i {
	transition: opacity 220ms ease, transform 360ms var(--hsm-ease);
}

body.hsm-menu-opening .hsm-menu-trigger svg,
body.hsm-menu-open .hsm-menu-trigger svg,
body.hsm-menu-opening .hsm-menu-trigger .elementor-icon > i,
body.hsm-menu-open .hsm-menu-trigger .elementor-icon > i {
	opacity: 0;
	transform: rotate(-35deg) scale(.78);
}

body.hsm-menu-opening .hsm-menu-trigger .hsm-trigger-x,
body.hsm-menu-open .hsm-menu-trigger .hsm-trigger-x {
	opacity: 1;
	transform: rotate(0) scale(1);
}

html.hsm-scroll-locked,
body.hsm-scroll-locked {
	overscroll-behavior: none;
}

@media (prefers-reduced-motion: reduce) {
	body.hsm-respect-reduced-motion {
		--hsm-duration: 1ms;
		--hsm-panel-duration: 1ms;
	}

	body.hsm-respect-reduced-motion *,
	body.hsm-respect-reduced-motion *::before,
	body.hsm-respect-reduced-motion *::after {
		scroll-behavior: auto !important;
	}
}

/*
 * NAVBAR CENTRAL / POTENCIÔMETRO VERTICAL
 * --------------------------------------------------------------------------
 * A navegação ocupa o centro geométrico completo do stage. A lista possui uma
 * janela de exatamente 5 passos visuais e é o ÚNICO elemento que rola.
 * O JS calcula a distância de cada item até o centro vertical e alimenta as
 * variáveis de profundidade/escala sem alterar o fluxo da lista.
 */
.hsm-menu-stage .hsm-menu-nav.hsm-nav-enhanced {
	--hsm-pot-row: 64px;
	--hsm-pot-visible: 5;
	--hsm-pot-list-height: calc(var(--hsm-pot-row) * var(--hsm-pot-visible));
	--hsm-pot-head-height: 58px;
	position: absolute !important;
	inset: 0 !important;
	z-index: 2 !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 100% !important;
	height: 100% !important;
	min-height: 0 !important;
	padding: 0 30px !important;
	overflow: hidden !important;
	perspective: 850px;
	pointer-events: none;
	box-sizing: border-box !important;
}

/* Como a navegação agora é absoluta, o rodapé continua preso ao final do stage. */
.hsm-menu-stage .hsm-menu-foot {
	margin-top: auto !important;
}

.hsm-menu-stage .hsm-menu-panels {
	position: relative !important;
	inset: auto !important;
	flex: 0 0 auto !important;
	width: min(100%, 340px) !important;
	max-width: 340px !important;
	height: calc(var(--hsm-pot-list-height) + var(--hsm-pot-head-height)) !important;
	max-height: calc(100dvh - var(--hsm-adminbar-offset) - 80px) !important;
	min-height: 0 !important;
	overflow: hidden !important;
	perspective: 850px;
	transform-style: preserve-3d;
	pointer-events: auto;
}

.hsm-menu-stage .hsm-menu-panel {
	position: absolute !important;
	inset: 0 !important;
	min-height: 0 !important;
	padding: 0 !important;
	overflow: hidden !important;
	-webkit-mask-image: none !important;
	mask-image: none !important;
	perspective: 850px;
	transform-style: preserve-3d;
}

/* Painel raiz: mantém o potenciômetro completo, com 2 passos virtuais nas pontas. */
.hsm-menu-stage .hsm-menu-panel[data-hsm-root="1"] > ul.hsm-pot-list {
	top: 50% !important;
	transform: translateY(-50%) !important;
	padding-top: calc(var(--hsm-pot-row) * 2) !important;
	padding-bottom: calc(var(--hsm-pot-row) * 2) !important;
}

/*
 * Submenu sem fundo próprio: mantém visível o fundo da seção externa.
 * Diferente do menu raiz, NÃO possui passos virtuais nas pontas: o primeiro
 * item para na primeira posição e o último para na quinta posição.
 */
.hsm-menu-stage .hsm-menu-panel:not([data-hsm-root="1"]) {
	background: transparent !important;
}

.hsm-menu-stage .hsm-menu-panel:not([data-hsm-root="1"]) > ul.hsm-pot-list {
	top: var(--hsm-pot-head-height) !important;
	transform: none !important;
	padding-top: 0 !important;
	padding-bottom: 0 !important;
	-webkit-mask-image: none !important;
	mask-image: none !important;
}

.hsm-menu-stage .hsm-panel-head {
	position: absolute !important;
	top: 0 !important;
	left: 0 !important;
	right: 0 !important;
	height: var(--hsm-pot-head-height) !important;
	min-height: var(--hsm-pot-head-height) !important;
	z-index: 6 !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 8px !important;
	padding: 0 8px !important;
	margin: 0 !important;
	background: transparent !important;
	box-sizing: border-box !important;
}

/* A seta fica imediatamente à esquerda do título; somente ela é clicável. */
.hsm-menu-stage .hsm-panel-back {
	position: static !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	flex: 0 0 auto !important;
	width: 24px !important;
	height: 28px !important;
	margin: 0 !important;
	padding: 0 !important;
	transform: none !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	font-family: "Montserrat", sans-serif !important;
	font-size: 18px !important;
	font-weight: 400 !important;
	line-height: 1 !important;
	color: rgba(20,20,20,.70) !important;
	cursor: pointer !important;
	transition: color 180ms ease !important;
}

.hsm-menu-stage .hsm-panel-back::before {
	content: none !important;
	display: none !important;
}

.hsm-menu-stage .hsm-panel-back-icon {
	display: inline-block;
	line-height: 1;
	transform: translateX(0);
	transition: transform 180ms cubic-bezier(.22, 1, .36, 1), color 180ms ease;
}

.hsm-menu-stage .hsm-panel-back:hover,
.hsm-menu-stage .hsm-panel-back:focus-visible {
	background: transparent !important;
	color: rgba(12,12,12,.96) !important;
}

.hsm-menu-stage .hsm-panel-back:hover .hsm-panel-back-icon,
.hsm-menu-stage .hsm-panel-back:focus-visible .hsm-panel-back-icon {
	transform: translateX(-3px);
}

.hsm-menu-stage .hsm-panel-title {
	font-family: "Montserrat", sans-serif;
	font-size: 15px;
	font-weight: 400;
	line-height: 1.2;
	color: rgba(20,20,20,.86);
	text-align: left;
}

/* A rolagem acontece SOMENTE nesta lista. */
.hsm-menu-stage .hsm-menu-panel > ul.hsm-pot-list {
	position: absolute !important;
	left: 0 !important;
	right: 0 !important;
	width: 100% !important;
	height: var(--hsm-pot-list-height) !important;
	max-height: var(--hsm-pot-list-height) !important;
	min-height: var(--hsm-pot-list-height) !important;
	margin: 0 !important;
	padding: 0 20px !important;
	box-sizing: border-box !important;
	list-style: none !important;
	overflow-y: auto !important;
	overflow-x: hidden !important;
	scrollbar-width: none;
	-ms-overflow-style: none;
	scroll-snap-type: y mandatory;
	scroll-behavior: smooth;
	overscroll-behavior: contain;
	-webkit-overflow-scrolling: touch;
	-webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 16px, #000 calc(100% - 16px), transparent 100%);
	mask-image: linear-gradient(to bottom, transparent 0, #000 16px, #000 calc(100% - 16px), transparent 100%);
}

.hsm-menu-stage .hsm-menu-panel > ul.hsm-pot-list::-webkit-scrollbar {
	display: none;
	width: 0;
	height: 0;
}

/* Com 5 itens ou menos não existe rolagem: o grupo inteiro fica centralizado. */
.hsm-menu-stage .hsm-menu-panel > ul.hsm-pot-list.hsm-pot-short {
	display: flex !important;
	flex-direction: column !important;
	justify-content: center !important;
	padding-top: 0 !important;
	padding-bottom: 0 !important;
	overflow-y: hidden !important;
	scroll-snap-type: none;
}

.hsm-menu-stage .hsm-menu-panel > ul.hsm-pot-list > li {
	--hsm-pot-scale: 1;
	--hsm-pot-z: 0px;
	--hsm-pot-opacity: .82;
	position: relative !important;
	flex: 0 0 var(--hsm-pot-row) !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 100% !important;
	height: var(--hsm-pot-row) !important;
	min-height: var(--hsm-pot-row) !important;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
	scroll-snap-align: center;
	scroll-snap-stop: always;
	perspective: 850px;
}

.hsm-menu-stage .hsm-menu-panel > ul.hsm-pot-list > li + li {
	margin-top: 0 !important;
}

.hsm-menu-stage .hsm-menu-panel > ul.hsm-pot-list > li > a {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 10px !important;
	width: 100% !important;
	height: 100% !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 0 8px !important;
	border: 0 !important;
	outline: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	text-align: center !important;
	text-decoration: none !important;
	font-family: "Montserrat", sans-serif !important;
	font-size: 18px !important;
	font-weight: 300 !important;
	line-height: 1.15 !important;
	letter-spacing: 0 !important;
	color: rgba(28,28,28,.78) !important;
	opacity: var(--hsm-pot-opacity, .82);
	transform-origin: center center;
	transform: perspective(850px) translateZ(var(--hsm-pot-z, 0px)) scale(var(--hsm-pot-scale, 1));
	transition:
		transform 190ms cubic-bezier(.22, 1, .36, 1),
		opacity 190ms ease,
		color 190ms ease;
	will-change: transform, opacity;
}

/* O item mais próximo ao centro ganha presença sem ficar exagerado. */
.hsm-menu-stage .hsm-menu-panel > ul.hsm-pot-list > li.is-hsm-pot-center > a {
	color: rgba(12,12,12,.94) !important;
	font-weight: 400 !important;
}

/* Hover: um pouco mais escuro, mais próximo e com escala levemente maior. */
.hsm-menu-stage .hsm-menu-panel > ul.hsm-pot-list > li:hover > a,
.hsm-menu-stage .hsm-menu-panel > ul.hsm-pot-list > li:focus-within > a {
	color: #0d0d0d !important;
	opacity: 1 !important;
	transform: perspective(850px)
		translateZ(calc(var(--hsm-pot-z, 0px) + 12px))
		scale(calc(var(--hsm-pot-scale, 1) + .035));
}

.hsm-menu-stage .hsm-menu-panel > ul.hsm-pot-list .hsm-menu-arrow {
	position: static !important;
	flex: 0 0 auto;
	width: auto !important;
	height: auto !important;
	margin-left: 2px;
	font-size: 17px;
	line-height: 1;
}

/* O item ativo do WordPress não recebe caixa/borda; mantém o mesmo sistema visual. */
.hsm-menu-stage .hsm-menu-panel > ul.hsm-pot-list .current-menu-item > a,
.hsm-menu-stage .hsm-menu-panel > ul.hsm-pot-list .current_page_item > a,
.hsm-menu-stage .hsm-menu-panel > ul.hsm-pot-list a.elementor-item-active {
	background: transparent !important;
	box-shadow: none !important;
	border: 0 !important;
}

@media (max-width: 767px) {
	.hsm-menu-stage .hsm-menu-nav.hsm-nav-enhanced {
		--hsm-pot-row: 58px;
		padding-left: 22px !important;
		padding-right: 22px !important;
	}

	.hsm-menu-stage .hsm-menu-panels {
		width: min(100%, 300px) !important;
		max-width: 300px !important;
	}

	.hsm-menu-stage .hsm-menu-panel > ul.hsm-pot-list > li > a {
		font-size: 16px !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	.hsm-menu-stage .hsm-menu-panel > ul.hsm-pot-list {
		scroll-behavior: auto;
	}

	.hsm-menu-stage .hsm-menu-panel > ul.hsm-pot-list > li > a {
		transition-duration: 1ms !important;
	}
}

.elementor-24 .elementor-element.elementor-element-781587c .e-search-input{
    font-family: "Montserrat" !important;
    font-weight: 300 !important;
    text-transform: uppercase !important;
    font-size: 12px !important;
}

.elementor-1097 .elementor-element.elementor-element-50d7513 .e-search-input{
    font-family: "Montserrat" !important;
    font-weight: 300 !important;
    text-transform: uppercase !important;
    font-size: 12px !important;
}
/* Cor configurável por cabeçalho. A transparência não altera o blur existente. */
#masthead.hsm-header-sticky, .hsm-header-sticky { background-color:var(--hsm-scroll-background, rgba(18,18,18,.70)); }
#masthead.hsm-header-sticky.hsm-header-light-surface,.hsm-header-sticky.hsm-header-light-surface { background-color:var(--hsm-scroll-background, rgba(255,255,255,.70)); }
/* Mantém o snap/painéis giratórios, mas rasteriza o texto na camada plana,
   sem scaling 3D fracionário, principal causador do aspecto embaçado. */
.hsm-menu-stage .hsm-menu-panel > ul.hsm-pot-list > li > a,
.hsm-menu-stage .hsm-menu-panel > ul.hsm-pot-list > li:hover > a,
.hsm-menu-stage .hsm-menu-panel > ul.hsm-pot-list > li:focus-within > a {
  transform:none!important;
  perspective:none!important;
  backface-visibility:visible;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  will-change:opacity;
}