/* Barbearia Gallo – site (classes gg-*). Medidas em px do layout de 1920 × var(--s). */
@font-face { font-family: 'Palmore'; src: url('/wp-content/uploads/gallo-fonts/palmore-regular.woff2') format('woff2'); font-weight: 100 550; font-display: swap; }
@font-face { font-family: 'Palmore'; src: url('/wp-content/uploads/gallo-fonts/palmore-bold.woff2') format('woff2'); font-weight: 551 900; font-display: swap; }
@font-face { font-family: 'Trade Gothic Extended'; src: url('/wp-content/uploads/gallo-fonts/tradegothiclt-extended.woff2') format('woff2'); font-weight: 100 550; font-display: swap; }
@font-face { font-family: 'Trade Gothic Extended'; src: url('/wp-content/uploads/gallo-fonts/tradegothiclt-boldextended.woff2') format('woff2'); font-weight: 551 900; font-display: swap; }
@font-face { font-family: 'Gallo Numeros'; src: url('/wp-content/uploads/gallo-fonts/gallo-numeros.woff2') format('woff2'); font-weight: 100 900; font-display: swap; }

:root {
	--s: min(1px, calc(100vw / 1920));
	--gg-amarelo: #FFDE00;
	--gg-preto: #000;
	--gg-branco: #FFF;
	--gg-display: 'Palmore', serif;
	--gg-sans: 'Trade Gothic Extended', sans-serif;
	--gg-num: 'Gallo Numeros', 'Arial Black', sans-serif;
}
/* --s continua na mesma proporção (100vw/1920) em qualquer largura — os valores de tablet/celular
   que existiam aqui inflavam o layout em 33–37% nessas telas (raiz dos cards do iPad estourando
   a tela e dos textos se sobrepondo); os "max(Npx, calc(...))" abaixo já protegem a leitura. */

html { scroll-behavior: smooth; overflow-x: hidden; }
body:has(.gg-hero) { background: #000; font-family: var(--gg-sans); overflow-x: hidden; }

/* ---------- Base ---------- */
.gg-sec { position: relative; overflow: hidden !important; padding: 0 !important; gap: 0 !important; font-family: var(--gg-sans); }
:where(.gg-sec) .e-con { padding: 0 !important; gap: 0; }
:where(.gg-sec) .elementor-widget { margin: 0 !important; }
/* Bug do Safari/iOS: dentro de contêiner flex com flex-direction:column + align-items:center (não
   "stretch"), o item não fica limitado à largura do pai — texto/título calcula a largura "encolhe
   pro conteúdo" errado e não quebra linha, "explodindo" pra fora da tela. Chrome não tem esse bug
   (por isso nunca aparecia nos nossos testes), só em iPhone/Safari real. max-width:100% força o
   item a nunca passar da largura disponível, em qualquer navegador. */
.gg-sec .elementor-widget, .gg-sec .elementor-widget-container { max-width: 100%; box-sizing: border-box; }
.gg-sec .elementor-heading-title,
.gg-sec .elementor-widget-text-editor,
.gg-sec .elementor-icon-list-text,
.gg-sec .elementor-button { font-family: var(--gg-sans) !important; line-height: 1.1; margin: 0; letter-spacing: 0; }
.gg-sec p { margin: 0 0 1.1em; }
.gg-sec p:last-child { margin-bottom: 0; }
.gg-dark { background-color: var(--gg-preto) !important; }
.gg-yellow { background-color: var(--gg-amarelo) !important; }
.gg-wrap { width: 100% !important; max-width: calc(1200 * var(--s)) !important; margin-inline: auto !important; }

.gg-display .elementor-heading-title { font-family: var(--gg-display) !important; font-weight: 700 !important; text-transform: uppercase; line-height: .82 !important; }
.gg-display .elementor-heading-title span { display: block; }
.gg-amarelo-txt .elementor-heading-title { color: var(--gg-amarelo) !important; }
.gg-preto-txt .elementor-heading-title { color: var(--gg-preto) !important; }

/* Rótulo com linhas laterais */
.gg-rotulo { width: 100%; }
.gg-rotulo .elementor-heading-title {
	display: flex; align-items: center; gap: calc(20 * var(--s));
	font-size: max(10px, calc(17 * var(--s))) !important; font-weight: 700 !important; text-transform: uppercase;
}
.gg-rotulo .elementor-heading-title::before,
.gg-rotulo .elementor-heading-title::after { content: ""; flex: 1; height: max(1px, calc(1.5 * var(--s))); }
.gg-rotulo .elementor-heading-title span { display: inline-flex; align-items: center; justify-content: center; height: calc(31 * var(--s)); min-height: 20px; border-radius: calc(12 * var(--s)); white-space: nowrap; }
.gg-rotulo--claro .elementor-heading-title { color: var(--gg-amarelo) !important; }
.gg-rotulo--claro .elementor-heading-title::before, .gg-rotulo--claro .elementor-heading-title::after { background: var(--gg-preto); }
.gg-rotulo--claro .elementor-heading-title span { background: var(--gg-preto); width: calc(300 * var(--s)); min-width: 110px; }
.gg-rotulo--escuro .elementor-heading-title { color: var(--gg-branco) !important; }
.gg-rotulo--escuro .elementor-heading-title::before, .gg-rotulo--escuro .elementor-heading-title::after { background: var(--gg-amarelo); }
.gg-rotulo--escuro .elementor-heading-title span {
	background: var(--gg-preto); border: max(1px, calc(2 * var(--s))) solid var(--gg-amarelo); padding: 0 calc(16 * var(--s));
	box-shadow: 0 0 calc(22 * var(--s)) rgba(255, 222, 0, .35);
}

/* Texto-sombra: cópia contornada, ampliada a partir do centro */
.gg-sec .gg-sombra-wrap { position: relative; width: max-content !important; max-width: 100%; }
.gg-sombra-wrap .elementor-heading-title { width: max-content; }
.gg-sombra { position: absolute !important; inset: 0; pointer-events: none; z-index: 0; }
.gg-sombra .elementor-heading-title { color: transparent !important; -webkit-text-stroke: max(1px, calc(2 * var(--s))) rgba(255, 255, 255, .95); }
.gg-sombra-wrap > .elementor-widget:not(.gg-sombra) { position: relative; z-index: 1; }

/* ---------- 0. Barra de navegação ----------
   Deliberadamente fora da identidade Gallo (sem amarelo/preto, sem Palmore/Trade Gothic):
   vidro escuro translúcido com borrão, tipografia neutra do sistema, textos finos e espaçados. */
.gg-navbar {
	position: sticky !important; top: 0 !important; z-index: 70 !important; overflow: visible !important;
	background: rgba(10, 10, 10, .48) !important;
	-webkit-backdrop-filter: blur(16px) saturate(150%); backdrop-filter: blur(16px) saturate(150%);
	border-bottom: 1px solid rgba(255, 255, 255, .09);
	padding: calc(15 * var(--s)) 0 !important;
	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif !important;
}
.gg-navbar-wrap { flex-wrap: nowrap !important; }
.gg-navbar-nav { gap: max(18px, calc(46 * var(--s))) !important; }
/* A classe css_classes do widget "botão" do Elementor vai no <div> que embrulha o link, não no
   <a class="elementor-button"> que aparece na tela — por isso todo estilo visual mira o filho. */
.gg-navbar-btn { position: relative; }
.gg-navbar-btn .elementor-button {
	background: transparent !important; border: 0 !important; border-radius: 0 !important;
	color: rgba(255, 255, 255, .78) !important; font-family: inherit !important;
	font-size: max(11px, calc(14 * var(--s))) !important; font-weight: 500 !important;
	letter-spacing: .12em; text-transform: uppercase; line-height: 1 !important;
	padding: 4px 1px !important; min-height: 0; min-width: 0; white-space: nowrap; position: relative; display: inline-flex;
	transition: color .25s ease;
}
.gg-navbar-btn .elementor-button::after {
	content: ""; position: absolute; left: 50%; bottom: -4px; width: 100%; height: 1px;
	background: #fff; scale: 0 1; opacity: 0; transition: scale .3s cubic-bezier(.2, .8, .2, 1), opacity .3s ease;
	transform: translateX(-50%);
}
.gg-navbar-btn:hover .elementor-button, .gg-navbar-btn .elementor-button:focus-visible { color: #fff !important; }
.gg-navbar-btn:hover .elementor-button::after, .gg-navbar-btn .elementor-button:focus-visible::after { scale: 1 1; opacity: 1; }
.gg-navbar-burger-wrap { display: none; }
.gg-navbar-burger {
	display: none; position: absolute; right: 16px; top: 50%; translate: 0 -50%;
	width: 42px; height: 42px; flex: none; padding: 0; cursor: pointer;
	background: rgba(255, 255, 255, .12); border: 1px solid rgba(255, 255, 255, .22); border-radius: 10px;
	transition: background .2s ease, border-color .2s ease;
}
.gg-navbar-burger:hover, .gg-navbar-burger:focus-visible { background: rgba(255, 255, 255, .2); }
.gg-navbar-burger span, .gg-navbar-burger span::before, .gg-navbar-burger span::after {
	content: ""; position: absolute; height: 2.2px; border-radius: 2px;
	background: #fff; box-shadow: 0 0 3px rgba(0, 0, 0, .5);
	transition: top .2s ease, transform .2s ease, opacity .2s ease;
}
/* left/right:11px é relativo ao botão (42px) só para o "span" base; ::before/::after têm o
   próprio span (já estreito) como containing block — usar 11px de novo ali dava 11+11=22px
   numa caixa de ~18px, largura negativa vira 0 (só a barra do meio aparecia). */
.gg-navbar-burger span { top: 50%; margin-top: -1.1px; left: 11px; right: 11px; }
.gg-navbar-burger span::before, .gg-navbar-burger span::after { left: 0; right: 0; }
.gg-navbar-burger span::before { top: -7px; }
.gg-navbar-burger span::after { top: 7px; }
/* opacity:0 no span escondia também os pseudo-elementos (::before/::after são filhos dele na
   árvore de renderização — opacity do pai apaga visualmente os filhos mesmo com opacity:1 neles,
   o que apagava o X inteiro). Esconder só a própria barra (background/sombra) resolve. */
.gg-navbar.is-aberto .gg-navbar-burger span { background: transparent; box-shadow: none; }
.gg-navbar.is-aberto .gg-navbar-burger span::before { top: 0; transform: rotate(45deg); }
.gg-navbar.is-aberto .gg-navbar-burger span::after { top: 0; transform: rotate(-45deg); }

/* Seções âncora não ficam escondidas atrás da barra fixa ao clicar num link do menu. */
.gg-sec[id] { scroll-margin-top: max(60px, calc(78 * var(--s))); }

/* ---------- 1. Hero ---------- */
.gg-hero { min-height: calc(1560 * var(--s)) !important; padding: calc(120 * var(--s)) 0 calc(79 * var(--s)) !important; justify-content: space-between !important; }
.gg-sec.gg-hero::before {
	content: "" !important; display: block !important; position: absolute !important; z-index: 2 !important; left: 0 !important; right: 0; width: 100% !important; top: calc(-60 * var(--s)) !important; height: calc(197 * var(--s)) !important;
	background: var(--gg-amarelo) !important; opacity: 1 !important; border-radius: 0 0 0 calc(70 * var(--s)) !important;
	transform: skewY(-1.35deg); transform-origin: left bottom;
}
.gg-sec.gg-hero::after {
	content: "" !important; position: absolute; inset: 0; pointer-events: none; z-index: 0;
	background: linear-gradient(180deg, rgba(0,0,0,0) 45%, rgba(0,0,0,.55) 75%, #000 100%);
}
.gg-hero > .e-con, .gg-hero > .elementor-widget { position: relative; z-index: 1; }
.gg-hero-topo { align-items: center; }
.gg-logo img { width: calc(251 * var(--s)) !important; min-width: 110px; height: auto; }
.gg-hero-conteudo { align-items: center; }
.gg-selo .elementor-heading-title {
	display: inline-block; padding: calc(13 * var(--s)) calc(28 * var(--s)); border-radius: calc(12 * var(--s));
	background: #000; border: max(1px, calc(2 * var(--s))) solid var(--gg-amarelo);
	color: var(--gg-branco) !important; font-size: max(11px, calc(27.5 * var(--s))) !important; font-weight: 700 !important; letter-spacing: .04em !important; text-transform: uppercase;
}
.gg-selo .elementor-heading-title span { color: var(--gg-amarelo); }
.gg-hero-sub { margin-top: calc(8 * var(--s)) !important; }
.gg-hero-sub .elementor-heading-title { font-size: calc(92 * var(--s)) !important; font-weight: 400 !important; letter-spacing: -.04em !important; text-transform: uppercase; color: var(--gg-branco) !important; }
.gg-hero-titulo { margin-top: calc(-9 * var(--s)) !important; }
.gg-hero-titulo .elementor-heading-title { font-size: calc(258 * var(--s)) !important; letter-spacing: .01em !important; }
.gg-tesoura { width: calc(963 * var(--s)); margin-top: calc(26 * var(--s)) !important; }
.gg-tesoura-linha { display: flex; align-items: center; color: var(--gg-amarelo); }
.gg-tesoura-linha svg { width: calc(62 * var(--s)); height: calc(48 * var(--s)); min-width: 24px; min-height: 18px; flex: none; margin-right: calc(-4 * var(--s)); }
.gg-tesoura-linha::after { content: ""; flex: 1; background: var(--gg-amarelo); clip-path: polygon(0 0, 100% 40%, 100% 60%, 0 100%); height: calc(5 * var(--s)); min-height: 2px; }
.gg-tagline { margin-top: calc(26 * var(--s)) !important; }
.gg-tagline .elementor-heading-title { color: var(--gg-branco) !important; font-size: max(11px, calc(27.5 * var(--s))) !important; font-weight: 700 !important; text-transform: uppercase; }
.gg-tagline .elementor-heading-title span { color: var(--gg-amarelo); }

/* ---------- 2. Serviços ---------- */
.gg-sec.gg-servicos { overflow: visible !important; z-index: 3 !important; position: relative !important; padding: calc(30 * var(--s)) 0 calc(66 * var(--s)) !important; }
.gg-sec.gg-servicos::before {
	content: "" !important; display: block !important; position: absolute !important; z-index: -1 !important; left: 0 !important; width: 100% !important; top: 0 !important; height: calc(200 * var(--s)) !important;
	background: var(--gg-amarelo) !important; opacity: 1 !important; border-radius: 0 calc(90 * var(--s)) 0 0 !important;
	transform: skewY(-1.3deg); transform-origin: left top;
}
.gg-serv-topo { flex-direction: row !important; align-items: center !important; justify-content: center !important; gap: calc(51 * var(--s)) !important; margin-top: calc(48 * var(--s)) !important; }
.gg-serv-textos { width: auto !important; align-items: flex-start; }
.gg-serv-icone img { width: calc(264 * var(--s)) !important; min-width: 90px; }
.gg-serv-titulo .elementor-heading-title { font-size: calc(162 * var(--s)) !important; }
.gg-serv-titulo .elementor-heading-title .l1 { letter-spacing: .02em; }
.gg-serv-titulo .elementor-heading-title .l2 { letter-spacing: .145em; margin-top: calc(-3 * var(--s)); margin-right: -.145em; }
.gg-serv-titulo.gg-sombra { scale: 1.1; transform-origin: 50% 50%; }
.gg-serv-sub { margin-top: calc(29 * var(--s)) !important; }
.gg-serv-sub .elementor-heading-title { font-size: max(12px, calc(34 * var(--s))) !important; font-weight: 400 !important; text-transform: uppercase; color: var(--gg-preto) !important; letter-spacing: .02em !important; }
.gg-cards { flex-direction: row !important; margin-top: calc(80 * var(--s)) !important; gap: calc(26 * var(--s)) !important; align-items: stretch !important; }
.gg-sec .gg-card {
	position: relative; overflow: visible !important; flex: 1 1 0 !important; background: var(--gg-preto) !important; border-radius: calc(22 * var(--s)) !important;
	padding: calc(72 * var(--s)) calc(28 * var(--s)) calc(34 * var(--s)) !important; text-align: center; align-items: center !important;
}
.gg-card-icone { position: absolute !important; top: calc(-52 * var(--s)); left: 50%; translate: -50% 0; width: auto !important; }
.gg-card-icone img { width: calc(104 * var(--s)) !important; min-width: 56px; height: auto; border-radius: 50%; }
/* Bug do Safari: mesmo com a largura do item forçada, o texto ainda tentava ficar numa linha só e
   vazava pra fora. align-self:stretch + min-width:0 tiram qualquer ambiguidade de largura do item
   flex. NÃO usar overflow-x:hidden aqui: como .gg-card já tem overflow:visible (necessário pro
   ícone "estourar" o topo do card), misturar overflow-x diferente de overflow-y faz o CSS forçar
   o outro eixo pra "auto" (vira scroll interno, ver [[project-barbearia-gallo-site]]) — colapsa a
   altura do card e cria barra de rolagem. Descoberto tentando essa mesma correção nesta sessão.*/
.gg-card-titulo, .gg-card-texto { width: 100%; max-width: 100%; min-width: 0; align-self: stretch; box-sizing: border-box; }
.gg-card-titulo .elementor-heading-title { color: var(--gg-amarelo) !important; font-size: max(13px, calc(24 * var(--s))) !important; font-weight: 700 !important; text-transform: uppercase; }
.gg-card-texto { margin-top: calc(14 * var(--s)) !important; }
.gg-card-texto, .gg-card-texto p { color: var(--gg-branco) !important; font-size: max(12px, calc(17.5 * var(--s))) !important; line-height: 1.22 !important; text-align: center; hyphens: auto; overflow-wrap: break-word; word-break: break-word; }
.gg-serv-nota { margin-top: calc(8 * var(--s)) !important; }
.gg-serv-nota, .gg-serv-nota p { color: var(--gg-preto) !important; font-size: max(14px, calc(29 * var(--s))) !important; line-height: 1.05 !important; text-align: center; }

/* ---------- 3. Unidades ---------- */
.gg-unidades { padding: calc(120 * var(--s)) 0 0 !important; }
.gg-perto-sub { margin-top: calc(72 * var(--s)) !important; }
.gg-perto-sub .elementor-heading-title { font-size: calc(52 * var(--s)) !important; font-weight: 400 !important; text-transform: uppercase; color: var(--gg-branco) !important; }
.gg-perto-titulo { margin-top: calc(-29 * var(--s)) !important; }
.gg-perto-titulo .elementor-heading-title { font-size: calc(250 * var(--s)) !important; letter-spacing: .013em !important; }
.gg-localizador { margin-top: calc(49 * var(--s)) !important; width: 100% !important; align-self: stretch !important; }

.gg-loc { width: 100%; color: var(--gg-branco); font-family: var(--gg-sans); }
.gg-loc-filtros { display: grid; grid-template-columns: repeat(3, 1fr); gap: calc(12 * var(--s)); width: calc(1014 * var(--s)); margin: 0 auto calc(104 * var(--s)); }
.gg-loc-campo { display: flex; flex-direction: column; gap: calc(12 * var(--s)); margin: 0; }
.gg-loc-campo span { color: var(--gg-amarelo); font-size: max(11px, calc(21 * var(--s))); font-weight: 700; text-transform: uppercase; line-height: 1; padding-left: calc(16 * var(--s)); }
.gg-loc-campo select {
	appearance: none; -webkit-appearance: none; width: 100%; height: calc(48 * var(--s)); min-height: 38px;
	background: #000 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 34'%3E%3Cpath fill='%23FFDE00' d='M50 13C45 5 36 3 28 8 22 12 17 18 10 17 6 16 4 12 6 8 2 10 0 16 3 21 9 29 22 30 32 26 41 22 46 19 50 23 54 19 59 22 68 26 78 30 91 29 97 21 100 16 98 10 94 8 96 12 94 16 90 17 83 18 78 12 72 8 64 3 55 5 50 13Z'/%3E%3C/svg%3E") no-repeat right calc(20 * var(--s)) center / max(18px, calc(30 * var(--s))) auto;
	border: max(1px, calc(2 * var(--s))) solid var(--gg-amarelo); border-radius: calc(10 * var(--s)); color: #cfcfcf;
	font-family: var(--gg-sans); font-size: max(11px, calc(14 * var(--s))); text-transform: uppercase; padding: 0 calc(60 * var(--s)) 0 calc(16 * var(--s)); cursor: pointer;
}
.gg-loc-campo select:disabled { opacity: .5; cursor: not-allowed; }
.gg-loc-campo select:focus { outline: 2px solid var(--gg-amarelo); outline-offset: 2px; }
.gg-loc-campo option { background: #111; color: #fff; text-transform: none; }
.gg-loc-corpo { display: grid; grid-template-columns: calc(380 * var(--s)) 1fr; gap: 0; align-items: start; }
.gg-loc-lista { list-style: none; margin: 0; padding: 0; max-height: calc(487 * var(--s)); min-height: 200px; overflow-y: auto; scrollbar-width: thin; scrollbar-color: var(--gg-amarelo) #111; }
.gg-loc-item { display: flex; gap: calc(18 * var(--s)); padding: calc(45 * var(--s)) calc(10 * var(--s)) calc(38 * var(--s)) 0; border-bottom: max(1px, calc(1.5 * var(--s))) solid var(--gg-amarelo); cursor: pointer; transition: background .2s; }
.gg-loc-item:hover, .gg-loc-item.is-ativa { background: rgba(255, 222, 0, .07); }
.gg-loc-icone { width: calc(50 * var(--s)); min-width: 30px; height: auto; flex: none; color: var(--gg-amarelo); }
.gg-loc-nome { font-family: var(--gg-sans); font-weight: 400; color: var(--gg-amarelo); font-size: max(17px, calc(31 * var(--s))); line-height: 1; margin: 0 0 calc(10 * var(--s)); }
.gg-loc-end, .gg-loc-horario, .gg-loc-tel { color: var(--gg-branco); font-size: max(12px, calc(15.5 * var(--s))); line-height: 1.3; margin: 0 0 calc(20 * var(--s)); white-space: pre-line; }
.gg-loc-tel { margin-bottom: 0; }
.gg-loc-botoes { display: flex; flex-wrap: wrap; gap: calc(10 * var(--s)); margin-top: calc(18 * var(--s)); }
.gg-loc-btn {
	display: inline-flex; align-items: center; gap: 6px; padding: calc(9 * var(--s)) calc(18 * var(--s)); min-height: 28px; border-radius: 99px;
	font-size: max(10px, calc(14 * var(--s))); font-weight: 700; text-transform: uppercase; text-decoration: none !important; transition: filter .2s, background .2s, color .2s;
}
.gg-loc-btn--wa { background: var(--gg-amarelo); color: var(--gg-preto) !important; }
.gg-loc-btn--wa::before {
	content: ""; width: 14px; height: 14px; background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 0 0-8.6 15.1L2 22l5-1.3A10 10 0 1 0 12 2zm5.3 14.1c-.2.6-1.3 1.2-1.8 1.3-.5 0-1 .3-3.3-.7-2.8-1.2-4.6-4-4.7-4.2-.1-.2-1.1-1.5-1.1-2.9s.7-2 1-2.3c.3-.3.6-.3.8-.3h.6c.2 0 .4 0 .6.5l.9 2.1c.1.2.1.4 0 .6l-.4.6-.4.5c-.1.1-.3.3-.1.6.2.3.8 1.3 1.7 2.1 1.2 1 2.1 1.3 2.4 1.5.3.1.5.1.6-.1l.9-1.1c.2-.3.4-.2.7-.1l2 1c.3.1.5.2.5.3.1.2.1.7-.1 1.3z'/%3E%3C/svg%3E") center/contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 0 0-8.6 15.1L2 22l5-1.3A10 10 0 1 0 12 2zm5.3 14.1c-.2.6-1.3 1.2-1.8 1.3-.5 0-1 .3-3.3-.7-2.8-1.2-4.6-4-4.7-4.2-.1-.2-1.1-1.5-1.1-2.9s.7-2 1-2.3c.3-.3.6-.3.8-.3h.6c.2 0 .4 0 .6.5l.9 2.1c.1.2.1.4 0 .6l-.4.6-.4.5c-.1.1-.3.3-.1.6.2.3.8 1.3 1.7 2.1 1.2 1 2.1 1.3 2.4 1.5.3.1.5.1.6-.1l.9-1.1c.2-.3.4-.2.7-.1l2 1c.3.1.5.2.5.3.1.2.1.7-.1 1.3z'/%3E%3C/svg%3E") center/contain no-repeat;
}
.gg-loc-btn--wa:hover { filter: brightness(1.08); }
.gg-loc-btn--rota { border: 1px solid var(--gg-amarelo); color: var(--gg-branco) !important; }
.gg-loc-btn--rota:hover { background: var(--gg-amarelo); color: var(--gg-preto) !important; }
.gg-loc-vazio { color: #cfcfcf; font-size: 14px; padding: 20px 0; }
.gg-loc-voltar {
	color: var(--gg-amarelo); font-size: max(12px, calc(14 * var(--s))); font-weight: 600; cursor: pointer;
	padding: calc(14 * var(--s)) calc(10 * var(--s)) calc(14 * var(--s)) 0; border-bottom: max(1px, calc(1.5 * var(--s))) solid var(--gg-amarelo);
	transition: opacity .2s;
}
.gg-loc-voltar:hover { opacity: .75; }
.gg-loc-mapa { height: calc(487 * var(--s)); min-height: 300px; overflow: hidden; }
.gg-loc-mapa iframe { width: 100%; height: 100%; border: 0; display: block; }

/* ---------- 4. Números ---------- */
.gg-sec .gg-numeros-wrap { border-top: max(1px, calc(1.5 * var(--s))) solid rgba(255, 222, 0, .6); border-bottom: max(1px, calc(1.5 * var(--s))) solid rgba(255, 222, 0, .6); margin-top: calc(104 * var(--s)) !important; padding: calc(138 * var(--s)) 0 calc(133 * var(--s)) !important; align-items: center; }
.gg-num-intro, .gg-num-intro p { color: var(--gg-branco) !important; font-size: max(14px, calc(27.5 * var(--s))) !important; line-height: 1.1 !important; text-align: center; }
.gg-num-intro span { color: var(--gg-amarelo); }
.gg-num-bloco { align-items: center !important; width: auto !important; }
.gg-num-bloco--xl { margin-top: calc(74 * var(--s)) !important; }
.gg-num-linha { flex-direction: row !important; justify-content: center !important; width: 100% !important; gap: calc(110 * var(--s)) !important; margin-top: calc(50 * var(--s)) !important; }
.gg-num .elementor-heading-title { font-family: var(--gg-num) !important; font-weight: 900 !important; line-height: .74 !important; letter-spacing: 0 !important; display: inline-flex; align-items: center; }
.gg-num .elementor-heading-title .gg-n {
	display: inline-block; letter-spacing: -.1em; padding: .26em .14em 0 0; margin: -.2em -.24em 0 0;
	background-image: linear-gradient(180deg, #FFDE00 0%, #FFDE00 48%, #1F1900 100%) !important;
	-webkit-background-clip: text !important; background-clip: text !important; -webkit-text-fill-color: transparent; color: transparent;
}
.gg-num .elementor-heading-title .gg-mais {
	display: inline-flex; align-items: center; justify-content: center; flex: none;
	width: calc(88 * var(--s)); height: calc(88 * var(--s)); min-width: 26px; min-height: 26px; margin-right: calc(-6 * var(--s)); align-self: center; position: relative; z-index: 1;
	border: max(1.5px, calc(3 * var(--s))) solid var(--gg-amarelo); border-radius: 50%;
}
.gg-num .elementor-heading-title .gg-mais::before { content: "+"; font-family: var(--gg-sans); font-weight: 700; color: var(--gg-amarelo); -webkit-text-fill-color: var(--gg-amarelo); font-size: max(16px, calc(62 * var(--s))); line-height: 1; letter-spacing: 0; }
.gg-num--xl .elementor-heading-title { font-size: calc(238 * var(--s)) !important; }
.gg-num--lg .elementor-heading-title { font-size: calc(224 * var(--s)) !important; }
.gg-num--lg .elementor-heading-title .gg-n { letter-spacing: -.04em; margin-right: -.18em; }
.gg-num--lg .elementor-heading-title .gg-mais { width: calc(78 * var(--s)); height: calc(78 * var(--s)); }
.gg-num-rotulo .elementor-heading-title { color: var(--gg-branco) !important; font-weight: 700 !important; text-transform: uppercase; }
.gg-num-rotulo--xl { margin-top: calc(20 * var(--s)) !important; }
.gg-num-rotulo--xl .elementor-heading-title { font-size: max(14px, calc(48 * var(--s))) !important; }
.gg-num-rotulo--sm { margin-top: calc(26 * var(--s)) !important; }
.gg-num-rotulo--sm .elementor-heading-title { font-size: max(12px, calc(32 * var(--s))) !important; }

/* ---------- 5. História ---------- */
.gg-historia-sec { padding: 0 0 calc(82 * var(--s)) !important; }
.gg-ano-linha { flex-direction: row !important; justify-content: center !important; align-items: center !important; width: 100% !important; gap: calc(26 * var(--s)) !important; margin-top: calc(93 * var(--s)) !important; }
.gg-ano, .gg-ano-rotulo { width: auto !important; }
.gg-ano .elementor-heading-title { font-family: var(--gg-display) !important; font-weight: 700 !important; color: var(--gg-amarelo) !important; font-size: calc(202 * var(--s)) !important; letter-spacing: -.07em !important; line-height: .8 !important; }
.gg-ano-rotulo .elementor-heading-title { color: var(--gg-branco) !important; font-size: max(14px, calc(46.8 * var(--s))) !important; font-weight: 700 !important; text-transform: uppercase; line-height: 1.05 !important; letter-spacing: -.02em !important; }
.gg-historia-titulo { margin-top: calc(100 * var(--s)) !important; }
.gg-historia-titulo .elementor-heading-title { font-size: calc(250 * var(--s)) !important; letter-spacing: .02em !important; }
.gg-historia-sub { margin-top: calc(12 * var(--s)) !important; }
.gg-historia-sub .elementor-heading-title { color: var(--gg-branco) !important; font-size: max(15px, calc(55 * var(--s))) !important; font-weight: 700 !important; text-transform: uppercase; letter-spacing: -.02em !important; }
.gg-historia { margin-top: calc(123 * var(--s)) !important; }
.gg-historia, .gg-historia p { color: var(--gg-branco) !important; font-size: max(14px, calc(27 * var(--s))) !important; line-height: 1.15 !important; text-align: justify; hyphens: auto; }
.gg-historia p { margin-bottom: 1.1em !important; }
.gg-historia::after { content: ""; display: table; clear: both; }
/* Moldura nas cores da Gallo: borda amarela + fio preto interno (padding com fundo preto) + foto.
   Tudo dentro da caixa da imagem, porque a animação gg-revela-foto usa clip-path e cortaria
   qualquer outline/sombra que ficasse do lado de fora. */
.gg-historia img.gg-historia-foto {
	float: right; box-sizing: border-box; width: calc(470 * var(--s)); height: auto; aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 30%;
	margin: 0 0 calc(30 * var(--s)) calc(56 * var(--s));
	border: max(5px, calc(10 * var(--s))) solid var(--gg-amarelo); padding: max(4px, calc(7 * var(--s))); background: #000;
	border-radius: max(10px, calc(20 * var(--s)));
}

/* ---------- 6. Faixa ---------- */
.gg-faixa { padding: calc(81 * var(--s)) 0 calc(175 * var(--s)) !important; align-items: center; }
.gg-faixa-wrap { align-items: center; }
.gg-faixa-titulo .elementor-heading-title { text-align: center; }
.gg-faixa-titulo .elementor-heading-title .l1 { font-size: calc(449 * var(--s)); letter-spacing: .02em; }
.gg-faixa-titulo .elementor-heading-title .l2 { font-size: calc(202 * var(--s)); letter-spacing: .008em; margin-top: calc(-19 * var(--s)); }
.gg-faixa-titulo.gg-sombra { scale: 1.27; transform-origin: 50% 50%; }

/* ---------- 7. CTA ---------- */
.gg-cta { background-color: var(--gg-branco) !important; padding: calc(70 * var(--s)) 0 !important; }
.gg-cta-wrap { flex-direction: row !important; justify-content: space-between !important; align-items: center !important; gap: 24px !important; }
.gg-cta-esq { flex-direction: row !important; align-items: center !important; gap: calc(24 * var(--s)) !important; width: auto !important; }
.gg-cta-icone img { width: calc(60 * var(--s)) !important; min-width: 34px; }
.gg-cta-texto, .gg-cta-texto p { color: #111 !important; font-size: max(14px, calc(28 * var(--s))) !important; line-height: 1.12 !important; }
.gg-cta-texto strong { font-weight: 700; }
.gg-cta-btn .elementor-button {
	background: var(--gg-preto) !important; color: var(--gg-amarelo) !important; border-radius: 99px !important;
	font-size: max(12px, calc(24 * var(--s))) !important; font-weight: 700 !important; text-transform: uppercase; line-height: 1 !important;
	padding: calc(23 * var(--s)) calc(30 * var(--s)) !important; width: calc(375 * var(--s)); min-width: 200px; white-space: nowrap; transition: transform .25s;
}
.gg-cta-btn .elementor-button:hover { transform: translateY(-2px); }

/* ---------- 8. Rodapé ---------- */
.gg-rodape { padding: calc(76 * var(--s)) 0 calc(100 * var(--s)) !important; }
.gg-rodape-linha { flex-direction: row !important; align-items: flex-start !important; justify-content: flex-start !important; }
.gg-rodape-logo { width: auto !important; flex: none !important; margin-top: 0 !important; }
.gg-rodape-logo .elementor-widget-container, .gg-rodape-logo { text-align: left !important; }
.gg-sec .gg-rodape-col { width: calc(533 * var(--s)) !important; flex: none !important; padding-top: calc(87 * var(--s)) !important; }
.gg-sec .gg-rodape-col--2 { width: calc(388 * var(--s)) !important; }
.gg-rodape-titulo .elementor-heading-title { color: var(--gg-amarelo) !important; font-size: max(13px, calc(27 * var(--s))) !important; font-weight: 700 !important; text-transform: uppercase; }
.gg-rodape-lista { margin-top: calc(22 * var(--s)) !important; }
.gg-rodape-lista .elementor-icon-list-item { padding: 0 !important; margin: 0 0 calc(8 * var(--s)) !important; }
.gg-rodape-lista .elementor-icon-list-text, .gg-rodape-lista a { color: var(--gg-branco) !important; font-size: max(11px, calc(15 * var(--s))) !important; font-weight: 700 !important; text-transform: uppercase; line-height: 1 !important; }
.gg-rodape-lista .elementor-icon-list-item::before { content: ""; width: calc(5 * var(--s)); height: calc(5 * var(--s)); min-width: 4px; min-height: 4px; border-radius: 50%; background: var(--gg-branco); margin-right: calc(12 * var(--s)); flex: none; align-self: center; }
.gg-rodape-lista a:hover .elementor-icon-list-text { color: var(--gg-amarelo) !important; }
.gg-rodape-logo img { width: calc(192 * var(--s)) !important; min-width: 100px; }
.gg-rodape-baixo { flex-direction: row !important; justify-content: space-between !important; margin-top: calc(80 * var(--s)) !important; gap: 10px !important; }
.gg-rodape-copy, .gg-rodape-copy p { color: #8a8a8a !important; font-size: max(9px, calc(11 * var(--s))) !important; text-transform: uppercase; line-height: 1 !important; }

/* ---------- Tablet ---------- */
@media (max-width: 1024px) {
	.gg-wrap { max-width: calc(100% - 64px) !important; }
	.gg-loc-corpo { grid-template-columns: 1fr; gap: 24px; }
	.gg-loc-filtros { width: 100%; }
}

/* ---------- Celular ---------- */
@media (max-width: 767px) {
	.gg-wrap { max-width: calc(100% - 32px) !important; }
	.gg-navbar-wrap { max-width: calc(100% - 32px) !important; }
	.gg-hero { min-height: 100svh; padding: 60px 0 90px !important; }
	.gg-hero-sub .elementor-heading-title { font-size: 26px !important; }

	/* Menu vira um botão "hambúrguer": abre uma lista por cima do conteúdo, sem espremer os links.
	   !important em tudo aqui porque o CSS do próprio Elementor gera uma classe (.elementor-element-xxxxx)
	   de mesma especificidade para cada container e carrega depois do nosso arquivo, então venceria no empate. */
	/* O <div> que o Elementor gera em volta do widget html (.gg-navbar-burger-wrap) fica com
	   position:relative e encolhe pra 0x0 (só tem um filho position:absolute dentro) — isso fazia
	   o botão se posicionar relativo a esse wrapper fantasma (centralizado, cortado no topo) em vez
	   da barra. position:static aqui faz o absolute do botão "atravessar" até o .gg-navbar (sticky). */
	.gg-navbar-burger, .gg-navbar-burger-wrap { display: block !important; }
	/* O Elementor aplica position:relative por padrão nos containers "e-con" — tanto o .gg-navbar-wrap
	   quanto o wrapper do widget html do burger (.gg-navbar-burger-wrap) herdam isso e viram, cada um,
	   uma referência de posicionamento válida (mesmo com tamanho 0x0) para o position:absolute do botão,
	   fazendo-o se ancorar num desses invólucros fantasmas em vez de subir até o .gg-navbar (sticky).
	   position:static nos dois força o absolute do botão a "atravessar" até o .gg-navbar. */
	.gg-navbar-wrap, .gg-navbar-burger-wrap { position: static !important; }
	.gg-navbar-burger-wrap { width: 0 !important; height: 0 !important; }
	/* Com o menu (.gg-navbar-nav) e o wrapper do burger fora do fluxo (absolute/0x0), o padding
	   escalado (calc(15*var(--s)), ~3px numa tela de 390px) sobra como única fonte de altura da
	   barra — vira uma faixa minúscula. Altura mínima fixa (não escalada) resolve. */
	.gg-navbar { min-height: 58px !important; }
	.gg-navbar-nav {
		box-sizing: border-box !important;
		position: absolute !important; top: 100% !important; left: 0 !important; right: 0 !important;
		flex-direction: column !important; align-items: stretch !important; width: 100% !important;
		background: rgba(8, 8, 8, .92) !important; -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px);
		padding: 0 20px !important; gap: 0 !important;
		max-height: 0 !important; overflow: hidden !important; opacity: 0 !important; pointer-events: none;
		transition: max-height .3s ease, padding .3s ease, opacity .25s ease;
	}
	.gg-navbar.is-aberto { box-shadow: none; }
	.gg-navbar.is-aberto .gg-navbar-nav { max-height: 70vh !important; padding: 4px 20px 16px !important; opacity: 1 !important; pointer-events: auto; overflow-y: auto !important; }
	.gg-navbar-nav .gg-navbar-btn { display: block; }
	.gg-navbar-nav .gg-navbar-btn .elementor-button {
		width: 100%; color: var(--gg-branco) !important; text-align: left; justify-content: flex-start; border-radius: 0 !important;
		padding: 15px 6px !important; border: 0 !important; border-bottom: 1px solid rgba(255, 255, 255, .14) !important;
	}
	.gg-navbar-nav > :last-child .gg-navbar-btn .elementor-button { border-bottom: 0 !important; }
	.gg-navbar-nav .gg-navbar-btn:hover .elementor-button, .gg-navbar-nav .gg-navbar-btn .elementor-button:focus-visible { background: rgba(255, 255, 255, .07) !important; }
	.gg-navbar-nav .gg-navbar-btn .elementor-button::after { display: none !important; }
	.gg-serv-topo { flex-direction: column !important; gap: 20px !important; }
	.gg-serv-textos { align-items: center; }
	.gg-serv-sub .elementor-heading-title { text-align: center; }
	.gg-cards { flex-direction: column !important; gap: 56px !important; margin-top: 70px !important; }
	.gg-sec .gg-card { padding: 48px 20px 26px !important; }
	.gg-card-icone { top: -30px; }
	.gg-perto-sub .elementor-heading-title { font-size: 20px !important; }
	.gg-loc-filtros { grid-template-columns: 1fr; gap: 14px; margin-bottom: 32px; }
	.gg-loc-lista { max-height: 380px; }
	.gg-ano-rotulo .elementor-heading-title { font-size: 13px !important; }
	.gg-historia { margin-top: 36px !important; }
	.gg-historia, .gg-historia p { text-align: left; font-size: 16px !important; line-height: 1.55 !important; hyphens: manual; }
	.gg-historia p { margin-bottom: 1.15em !important; }
	.gg-historia img.gg-historia-foto { float: none; display: block; width: 100%; max-width: 100%; margin: 0 0 28px; border-width: 6px; padding: 5px; border-radius: 14px; }
	.gg-historia-sec { padding-bottom: 80px !important; }
	.gg-cta-wrap, .gg-cta-esq { flex-direction: column !important; text-align: center; }
	.gg-rodape-linha { flex-direction: column !important; gap: 28px; }
	.gg-sec .gg-rodape-col, .gg-sec .gg-rodape-col--2 { width: 100% !important; padding-top: 0 !important; }
	.gg-rodape-baixo { flex-direction: column !important; }
	.gg-rodape-lista .elementor-icon-list-item { margin-bottom: 14px !important; }
	.gg-serv-nota, .gg-serv-nota p, .gg-num-intro, .gg-num-intro p { font-size: 13px !important; }
	.gg-cta-texto, .gg-cta-texto p { font-size: 14px !important; }
}
.gg-loc-icone svg { width: 100%; height: auto; display: block; }


/* ---------- Acessibilidade ---------- */
/* Foco visível para quem navega pelo teclado (não aparece no clique do mouse). */
.gg-sec a:focus-visible,
.gg-sec .elementor-button:focus-visible,
.gg-sec select:focus-visible { outline: 3px solid var(--gg-amarelo) !important; outline-offset: 3px; }
.gg-yellow a:focus-visible, .gg-cta a:focus-visible, .gg-cta .elementor-button:focus-visible { outline-color: var(--gg-preto) !important; }
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	.gg-sec *, .gg-sec *::before, .gg-sec *::after { transition: none !important; }
}

/* Área de toque maior nos links do rodapé (sem mudar o espaçamento visual). */
.gg-rodape-lista a { display: inline-block; padding: 7px 0; margin: -7px 0; }

/* Crédito da agência no rodapé */
.gg-credito { margin-top: calc(40 * var(--s)) !important; }
.gg-credito, .gg-credito p { color: #8a8a8a !important; font-size: max(9px, calc(11 * var(--s))) !important; text-transform: uppercase; letter-spacing: .04em; line-height: 1 !important; text-align: center; }
.gg-credito p { display: flex; align-items: center; justify-content: center; gap: calc(12 * var(--s)); }
.gg-credito img.gg-credito-logo { height: max(18px, calc(26 * var(--s))); width: auto; opacity: .75; }
@media (max-width: 767px) { .gg-credito { margin-top: 24px !important; } .gg-credito p { gap: 8px; } }

/* ---------- Tesoura cortando a linha (topo) ---------- */
.gg-corte {
	--p: 0;
	--w: max(24px, calc(62 * var(--s)));
	--h: max(2px, calc(5 * var(--s)));
	position: relative; width: 100%; height: max(18px, calc(48 * var(--s)));
	color: var(--gg-amarelo); transition: opacity .45s ease;
}
.gg-corte.is-sumindo { opacity: 0; }
.gg-corte-linha { position: absolute; left: calc(var(--w) * .57); right: 0; top: calc(50% - var(--h) / 2); height: var(--h); }
.gg-corte-linha i { display: block; width: 100%; height: 100%; background: var(--gg-amarelo); clip-path: polygon(0 0, 100% 40%, 100% 60%, 0 100%); }
.gg-corte-linha--base { clip-path: inset(0 0 0 calc(var(--p) * 100%)); }
.gg-corte-linha--cima { clip-path: inset(0 calc((1 - var(--p)) * 100%) 50% 0); transform: translateY(calc(var(--h) * -.9)); }
.gg-corte-linha--baixo { clip-path: inset(50% calc((1 - var(--p)) * 100%) 0 0); transform: translateY(calc(var(--h) * .9)); }
.gg-corte-tesoura { position: absolute; top: 0; left: calc(var(--p) * (100% - var(--w) * .57)); width: var(--w); height: 100%; overflow: visible; z-index: 1; }
.gg-lamina { transform-box: view-box; transform-origin: 19.7px 11px; }
.gg-corte.is-cortando .gg-lamina--a { animation: gg-corta-a .34s ease-in-out infinite; }
.gg-corte.is-cortando .gg-lamina--b { animation: gg-corta-b .34s ease-in-out infinite; }
@keyframes gg-corta-a { 0%, 100% { transform: rotate(0); } 50% { transform: rotate(13deg); } }
@keyframes gg-corta-b { 0%, 100% { transform: rotate(0); } 50% { transform: rotate(-13deg); } }

/* ---------- Surgimento ao rolar (só com JS ativo e sem "reduzir movimento") ---------- */
/* O CSS de animação da Hostinger (AOS) esconde tudo com data-aos até o script dele rodar; o script não é usado na LP. */
.gg-sec[data-aos], .gg-sec [data-aos], .gg-sec.hostinger-elementor-aos, .gg-sec .hostinger-elementor-aos,
.gg-navbar[data-aos], .gg-navbar [data-aos], .gg-navbar.hostinger-elementor-aos, .gg-navbar .hostinger-elementor-aos { opacity: 1 !important; transform: none !important; }
.gg-anim .gg-sec .gg-surge {
	transition: opacity .9s ease var(--gg-atraso, 0s), translate .9s cubic-bezier(.2, .7, .2, 1) var(--gg-atraso, 0s) !important;
}
.gg-anim .gg-sec .gg-surge:not(.is-in) { opacity: 0 !important; translate: 0 28px; }

/* ---------- Redes sociais (símbolos oficiais) ---------- */
.gg-redes { display: flex; align-items: center; gap: max(14px, calc(22 * var(--s))); margin-top: calc(24 * var(--s)); }
.gg-rede { display: inline-flex; color: var(--gg-branco); transition: color .2s, translate .2s; }
.gg-rede svg { width: max(26px, calc(34 * var(--s))); height: auto; fill: currentColor; display: block; }
a.gg-rede:hover { color: var(--gg-amarelo); translate: 0 -2px; }
a.gg-rede:focus-visible { outline: 3px solid var(--gg-amarelo); outline-offset: 4px; border-radius: 4px; }

/* =====================================================================
   MOVIMENTO (só com .gg-anim: JS ativo e sem "reduzir movimento").
   Usa translate/scale/rotate/opacity em elementos internos: a regra que
   neutraliza a animação da Hostinger força transform/opacity nos blocos.
   ===================================================================== */

/* Animações contínuas pausam quando a seção está fora da tela. */
.gg-anim .gg-sec:not(.gg-visivel) *,
.gg-anim .gg-sec:not(.gg-visivel) *::before,
.gg-anim .gg-sec:not(.gg-visivel) *::after { animation-play-state: paused !important; }

@keyframes gg-sobe { from { opacity: 0; translate: 0 36px; } to { opacity: 1; translate: 0 0; } }
@keyframes gg-desce { from { opacity: 0; translate: 0 -22px; } to { opacity: 1; translate: 0 0; } }
@keyframes gg-aparece-escala { from { opacity: 0; scale: .72; rotate: -25deg; } to { opacity: 1; scale: 1; rotate: 0deg; } }
@keyframes gg-titulo-entra { from { translate: 0 40px; scale: 1.08; } to { translate: 0 0; scale: 1; } }
/* Logo e título entram já visíveis (o Google mede o "conteúdo principal" só em elementos visíveis). */
@keyframes gg-logo-entra { from { scale: .8; rotate: -25deg; } to { scale: 1; rotate: 0deg; } }
@keyframes gg-zoom-lento { from { scale: 1; } to { scale: 1.12; } }
@keyframes gg-flutua { 0%, 100% { translate: 0 0; } 50% { translate: 0 -8px; } }
@keyframes gg-respira-serv { 0%, 100% { scale: 1.1; } 50% { scale: 1.155; } }
@keyframes gg-respira-faixa { 0%, 100% { scale: 1.27; } 50% { scale: 1.33; } }
@keyframes gg-brilho { 0%, 55% { background-position: 160% 0, 0 0; } 100% { background-position: -60% 0, 0 0; } }
@keyframes gg-pulso { 0%, 100% { scale: 1; } 50% { scale: 1.12; } }
@keyframes gg-onda { 0% { opacity: .55; scale: 1; } 100% { opacity: 0; scale: 1.9; } }
@keyframes gg-halo { 0%, 100% { box-shadow: 0 0 calc(22 * var(--s)) rgba(255, 222, 0, .35); } 50% { box-shadow: 0 0 calc(44 * var(--s)) rgba(255, 222, 0, .7); } }
@keyframes gg-pop { 0% { scale: 0; rotate: -90deg; } 70% { scale: 1.15; rotate: 8deg; } 100% { scale: 1; rotate: 0deg; } }
@keyframes gg-linha-cresce { from { scale: 0 1; } to { scale: 1 1; } }
@keyframes gg-varre { 0%, 70% { translate: -120% 0; } 100% { translate: 220% 0; } }
@keyframes gg-revela-foto { from { clip-path: inset(0 100% 0 0); scale: 1.12; } to { clip-path: inset(0 0 0 0); scale: 1; } }
@keyframes gg-lado-esq { from { opacity: 0; translate: -60px 0; } to { opacity: 1; translate: 0 0; } }
@keyframes gg-lado-dir { from { opacity: 0; translate: 60px 0; } to { opacity: 1; translate: 0 0; } }

/* ---------- Topo: entrada em sequência e zoom lento na foto ---------- */
.gg-hero-zoom {
	position: absolute; inset: 0; z-index: 0; pointer-events: none;
	background-size: cover; background-position: center center; background-repeat: no-repeat;
	transform-origin: 60% 40%;
}
.gg-anim .gg-hero-zoom { animation: gg-zoom-lento 22s ease-in-out infinite alternate; }
.gg-anim .gg-hero .gg-logo img { animation: gg-logo-entra 1.1s cubic-bezier(.2, .8, .2, 1) both; }
.gg-anim .gg-navbar-btn { animation: gg-desce .6s ease both; }
.gg-anim .gg-navbar-nav > :nth-child(1) .elementor-button { animation-delay: .1s; }
.gg-anim .gg-navbar-nav > :nth-child(2) .elementor-button { animation-delay: .17s; }
.gg-anim .gg-navbar-nav > :nth-child(3) .elementor-button { animation-delay: .24s; }
.gg-anim .gg-navbar-nav > :nth-child(4) .elementor-button { animation-delay: .31s; }
.gg-anim .gg-selo .elementor-heading-title { animation: gg-sobe .8s ease .35s both; }
.gg-anim .gg-hero-sub .elementor-heading-title { animation: gg-sobe .9s ease .7s both; }
.gg-anim .gg-hero-titulo .elementor-heading-title { animation: gg-titulo-entra 1.3s cubic-bezier(.2, .8, .2, 1) both; }
.gg-anim .gg-tesoura .gg-corte { animation: gg-sobe .8s ease 1.15s both; }
.gg-anim .gg-tagline .elementor-heading-title { animation: gg-sobe .8s ease 1.3s both; }

/* ---------- Linhas dos rótulos se desenham a partir do selo ---------- */
.gg-anim .gg-rotulo .elementor-heading-title::before { transform-origin: right center; scale: 0 1; }
.gg-anim .gg-rotulo .elementor-heading-title::after { transform-origin: left center; scale: 0 1; }
.gg-anim .gg-rotulo.is-in .elementor-heading-title::before,
.gg-anim .gg-rotulo.is-in .elementor-heading-title::after { animation: gg-linha-cresce 1.1s cubic-bezier(.2, .8, .2, 1) .15s both; }
.gg-anim .gg-rotulo--escuro .elementor-heading-title span { animation: gg-halo 3.2s ease-in-out infinite; }

/* ---------- Serviços ---------- */
.gg-anim .gg-serv-icone img { animation: gg-flutua 4.2s ease-in-out infinite; }
.gg-anim .gg-serv-titulo.gg-sombra { animation: gg-respira-serv 6s ease-in-out infinite; }
.gg-anim .gg-card.is-in .gg-card-icone img { animation: gg-pop .8s cubic-bezier(.3, 1.4, .5, 1) calc(var(--gg-atraso, 0s) + .35s) both; }
.gg-anim .gg-sec .gg-card.gg-surge.is-in { transition: translate .35s ease, box-shadow .35s ease, opacity .9s ease var(--gg-atraso, 0s) !important; }
.gg-sec .gg-card.is-in:hover { translate: 0 -8px; box-shadow: 0 18px 40px rgba(0, 0, 0, .28); }
.gg-card-icone img { transition: rotate .45s ease; }
.gg-card:hover .gg-card-icone img { rotate: 14deg; }

/* ---------- Números: brilho que passa sobre o degradê, "+" gira ao aparecer ---------- */
.gg-anim .gg-num .elementor-heading-title .gg-n {
	background-image: linear-gradient(105deg, transparent 38%, rgba(255, 255, 255, .7) 50%, transparent 62%), linear-gradient(180deg, #FFDE00 0%, #FFDE00 48%, #1F1900 100%) !important;
	background-size: 250% 100%, 100% 100%;
	background-repeat: no-repeat;
	animation: gg-brilho 4.5s ease-in-out infinite;
}
.gg-anim .gg-num-linha .gg-num-bloco:nth-child(2) .gg-n { animation-delay: .6s; }
.gg-anim .gg-num-bloco.is-in .gg-mais { animation: gg-aparece-escala .8s cubic-bezier(.3, 1.4, .5, 1) calc(var(--gg-atraso, 0s) + .2s) both; }

/* ---------- 2001: ano entra pela esquerda, rótulo pela direita ---------- */
.gg-anim .gg-ano-linha.is-in .gg-ano .elementor-heading-title { animation: gg-lado-esq .9s cubic-bezier(.2, .8, .2, 1) both; }
.gg-anim .gg-ano-linha.is-in .gg-ano-rotulo .elementor-heading-title { animation: gg-lado-dir .9s cubic-bezier(.2, .8, .2, 1) .15s both; }

/* ---------- História: foto se revela como uma cortina ---------- */
.gg-anim .gg-historia.is-in img.gg-historia-foto { animation: gg-revela-foto 1.3s cubic-bezier(.2, .8, .2, 1) .25s both; }

/* ---------- Faixa: a sombra "respira" (continua centralizada no texto) ---------- */
.gg-anim .gg-faixa-titulo.gg-sombra { animation: gg-respira-faixa 7s ease-in-out infinite; }

/* ---------- Contato: WhatsApp pulsando com onda, botão com brilho ---------- */
.gg-cta-icone { position: relative; }
.gg-anim .gg-cta-icone img { animation: gg-pulso 2.4s ease-in-out infinite; }
.gg-anim .gg-cta-icone::after {
	content: ""; position: absolute; left: 0; top: 0; width: 100%; aspect-ratio: 1; border-radius: 50%;
	border: 2px solid #111; pointer-events: none; animation: gg-onda 2.4s ease-out infinite;
}
.gg-sec .gg-cta-btn .elementor-button { position: relative; overflow: hidden; }
.gg-anim .gg-cta-btn .elementor-button::after {
	content: ""; position: absolute; top: 0; bottom: 0; left: 0; width: 45%; pointer-events: none;
	background: linear-gradient(100deg, transparent, rgba(255, 222, 0, .45), transparent);
	animation: gg-varre 3.6s ease-in-out infinite;
}

/* ---------- Rodapé e topo: selo gira ao aparecer e ao passar o mouse ---------- */
.gg-anim .gg-rodape-linha.is-in .gg-rodape-logo img { animation: gg-aparece-escala 1.2s cubic-bezier(.2, .8, .2, 1) .3s both; }
.gg-rodape-logo img, .gg-logo img { transition: rotate .8s cubic-bezier(.2, .8, .2, 1); }
.gg-rodape-logo:hover img, .gg-logo:hover img { rotate: 360deg; }

/* ---------- Página de Política de Privacidade ---------- */
body.gg-priv-body { background: #000; margin: 0; }
.gg-priv { min-height: 100vh; background: #000; color: #e8e8e8; font-family: var(--gg-sans); }
.gg-priv-topo { position: sticky; top: 0; z-index: 10; display: flex; align-items: center; justify-content: space-between; padding: 16px max(16px, calc((100% - 860px) / 2)); background: rgba(0,0,0,.92); border-bottom: 1px solid rgba(255,222,0,.4); }
.gg-priv-logo img { width: 64px; height: auto; display: block; }
.gg-priv-fechar { width: 48px; height: 48px; display: inline-flex; align-items: center; justify-content: center; border: 2px solid var(--gg-amarelo); border-radius: 50%; color: var(--gg-amarelo); transition: background .2s, color .2s; }
.gg-priv-fechar svg { width: 22px; height: 22px; }
.gg-priv-fechar:hover { background: var(--gg-amarelo); color: #000; }
.gg-priv-corpo { max-width: 860px; margin: 0 auto; padding: 56px 16px 80px; font-size: 16px; line-height: 1.65; }
.gg-priv-corpo h1 { font-family: var(--gg-display); font-weight: 700; text-transform: uppercase; color: var(--gg-amarelo); font-size: clamp(40px, 7vw, 76px); line-height: .9; margin: 0 0 32px; }
.gg-priv-corpo h2 { font-family: var(--gg-sans); font-weight: 700; text-transform: uppercase; color: var(--gg-amarelo); font-size: 18px; letter-spacing: .03em; margin: 40px 0 12px; }
.gg-priv-corpo p, .gg-priv-corpo li { color: #e8e8e8; }
.gg-priv-corpo ul { padding-left: 20px; }
.gg-priv-corpo strong { color: #fff; }
.gg-priv-corpo a { color: var(--gg-amarelo); }
.gg-priv-acoes { margin-top: 48px; }
.gg-priv-voltar { display: inline-block; background: var(--gg-amarelo); color: #000 !important; font-weight: 700; text-transform: uppercase; text-decoration: none; padding: 14px 28px; border-radius: 99px; }
.gg-priv-voltar:hover { filter: brightness(1.08); }