/*
 * Ajustes da versao estatica do site da Aura (sem WordPress).
 * Carregado por ultimo em todas as paginas, depois do CSS do Avada.
 */

/* ---------- Menu principal ----------
 * No site original o menu quebrava em duas linhas embaixo do logo e a barra
 * "|" (do CSS personalizado) aparecia ate antes do primeiro item.
 * Aqui nada quebra linha:
 *   >= 1180px  logo a esquerda e os 8 itens numa linha so, separador dourado
 *   ate 1179px botao de menu com lista suspensa (menu.js)
 */
@media only screen and (min-width: 1180px) {
	.fusion-header .fusion-row {
		max-width: min(1200px, 92vw) !important; /* mesma largura do conteudo (site_width do Avada) */
		padding-left: 0 !important;
		padding-right: 0 !important;
	}
	.fusion-header-has-flyout-menu-content {
		display: flex !important;
		align-items: center;
		justify-content: space-between;
		gap: 20px;
	}
	.fusion-header-has-flyout-menu-content .fusion-logo {
		float: none !important;
		flex: 0 0 auto;
	}
	.fusion-header-has-flyout-menu-content .fusion-main-menu {
		float: none !important;
		flex: 1 1 auto;
		display: flex !important;
		justify-content: flex-end;
		min-width: 0;
	}
	#menu-main {
		display: flex !important;
		flex-wrap: nowrap;
		align-items: center;
	}
	#menu-main > li {
		float: none !important;
		padding: 0 !important;
		display: flex;
		align-items: center;
		flex: 0 0 auto;
	}
	#menu-main > li > a {
		white-space: nowrap;
		font-size: 13px !important;
		padding-left: 7px !important;
		padding-right: 7px !important;
		letter-spacing: .02em !important;
		margin: 0 !important;
	}
	#menu-main a :before { content: none !important; }
	#menu-main > li + li::before {
		content: "";
		width: 1px;
		height: 14px;
		background: rgba(215, 171, 76, .55); /* dourado claro #D7AB4C */
	}
	.fusion-header-has-flyout-menu-content .fusion-flyout-menu-icons { display: none !important; }
}
/* Paginas que comecam com fundo claro (privacidade, lista de portfolio, 404):
 * cabecalho preto, senao o menu branco some no fundo branco */
body.aura-topo-solido .fusion-header,
body.aura-topo-solido .fusion-header-wrapper .fusion-header { background-color: #000 !important; }
/* ...e o cabecalho deixa de flutuar por cima: o conteudo comeca embaixo dele */
body.aura-topo-solido .fusion-header-wrapper { position: relative !important; }
/* sem foto embaixo, a sobra de 60px do Avada abaixo do menu fica um vazio preto */
body.aura-topo-solido .fusion-header .fusion-row { padding-bottom: 16px !important; }

/* Links legais na faixa de baixo do rodape */
.aura-links-legais {
	display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 12px;
	margin-top: 10px; font-size: 13px; line-height: 1.6;
}
.aura-links-legais a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.aura-links-legais a:hover, .aura-links-legais a:focus-visible { color: #D7AB4C; }
.aura-links-legais span { opacity: .5; }

/* Todos os itens em maiusculas, no padrao do menu */
#menu-main .menu-text, #menu-main-1 .menu-text { text-transform: uppercase; }

/* Menu do celular e tablet: botao + lista suspensa simples (menu.js) */
.aura-menu-botao, .aura-menu-cel { display: none; }
@media only screen and (min-width: 1366px) {
	#menu-main > li > a {
		font-size: 14px !important;
		padding-left: 10px !important;
		padding-right: 10px !important;
	}
}
@media only screen and (max-width: 1179px) {
	#menu-main a :before { content: none !important; }
	.fusion-header-has-flyout-menu-content {
		display: flex !important;
		align-items: center;
		justify-content: space-between;
	}
	/* esconde o menu de desktop e o menu em tela cheia do Avada */
	.fusion-header-has-flyout-menu-content .fusion-main-menu,
	.fusion-flyout-menu-icons, .fusion-flyout-menu-bg, .fusion-flyout-menu,
	.fusion-mobile-navigation { display: none !important; }
	.fusion-header { position: relative; }

	.aura-menu-botao {
		display: flex; flex-direction: column; justify-content: center; gap: 6px;
		width: 44px; height: 44px; padding: 10px 8px; margin: 0 0 0 auto;
		background: none; border: 0; cursor: pointer; flex: 0 0 auto;
	}
	.aura-menu-botao span {
		display: block; height: 2px; width: 100%; background: #fff; border-radius: 2px;
		transition: transform .2s ease, opacity .2s ease;
	}
	.aura-menu-botao.aberto span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
	.aura-menu-botao.aberto span:nth-child(2) { opacity: 0; }
	.aura-menu-botao.aberto span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }
	.aura-menu-botao:focus-visible { outline: 2px solid #D7AB4C; outline-offset: 2px; }

	.aura-menu-cel {
		display: block; position: absolute; left: 0; right: 0; top: 100%; z-index: 100000;
		background: #000; border-top: 1px solid rgba(215, 171, 76, .45);
		box-shadow: 0 12px 24px rgba(0, 0, 0, .35);
		max-height: 0; overflow: hidden; visibility: hidden;
		transition: max-height .25s ease, visibility 0s linear .25s;
	}
	.aura-menu-cel.aberto {
		max-height: 80vh; overflow-y: auto; visibility: visible;
		transition: max-height .25s ease;
	}
	.aura-menu-cel ul { list-style: none; margin: 0; padding: 4px 0; }
	.aura-menu-cel li + li { border-top: 1px solid rgba(255, 255, 255, .08); }
	.aura-menu-cel a {
		display: block; padding: 14px 24px; min-height: 48px; box-sizing: border-box;
		font-family: Montserrat, sans-serif; font-size: 15px; font-weight: 400; line-height: 1.35;
		letter-spacing: .02em; text-transform: uppercase; color: #fff; text-decoration: none;
	}
	.aura-menu-cel a:hover, .aura-menu-cel a:focus-visible, .aura-menu-cel a[aria-current="page"] { color: #D7AB4C; }
}

/* ---------- Aviso de cookies no celular ----------
 * No original o texto ficava espremido, o botao ACEITE cortado e o icone do
 * WhatsApp por cima. Aqui texto em cima, botao embaixo, sem sobrepor.
 */
@media only screen and (max-width: 640px) {
	.fusion-privacy-bar .fusion-privacy-bar-main {
		display: flex !important;
		flex-direction: column;
		align-items: center;
		gap: 10px;
		padding: 14px 16px !important;
		text-align: center;
	}
	.fusion-privacy-bar .fusion-privacy-bar-main > span { line-height: 1.4 !important; font-size: 15px !important; }
	.fusion-privacy-bar .fusion-privacy-bar-acceptance { margin: 0 !important; font-size: 15px !important; }
	/* botao do WhatsApp: no canto de baixo (o tema deixava a 100px, quase no meio da tela do iPhone);
	   so sobe enquanto o aviso de cookies esta aberto */
	.whats-aura { bottom: calc(16px + env(safe-area-inset-bottom, 0px)) !important; right: 16px !important; }
	body:has(.fusion-privacy-bar:not([style*="none"])) .whats-aura { bottom: 160px !important; }
}

/* ---------- Area de toque no celular (auditoria 28/10/2026) ----------
 * Links pequenos ganham uma area de clique invisivel maior, sem mudar o
 * desenho: credito do rodape, botao de WhatsApp do rodape, icones sociais.
 */
@media only screen and (max-width: 800px) {
	.fusion-footer a, .fusion-social-networks a.fusion-social-network-icon { position: relative; }
	.fusion-footer a::after,
	.fusion-social-networks a.fusion-social-network-icon::after {
		content: ""; position: absolute; inset: -12px -8px;
	}
	.fusion-footer .footer-telefone { min-height: 44px; }

	/* Formularios: caixas de marcar e campo de arquivo maiores */
	.wpcf7 input[type="radio"], .wpcf7 input[type="checkbox"] {
		width: 22px; height: 22px; accent-color: #B36F31; vertical-align: middle; margin-right: 6px;
	}
	.wpcf7 .wpcf7-list-item { display: inline-flex; align-items: center; min-height: 44px; margin-right: 18px; }
	.wpcf7 .wpcf7-list-item label { display: inline-flex; align-items: center; }
	.wpcf7 input[type="file"] { min-height: 44px; padding: 8px 0; max-width: 100%; }
	.wpcf7 input, .wpcf7 select, .wpcf7 textarea { font-size: 16px !important; } /* evita o zoom do iPhone ao tocar no campo */
}

/* ---------- Formularios (substituem o Contact Form 7) ---------- */
.wpcf7 form .wpcf7-response-output { display: none; }
.wpcf7 form.sent .wpcf7-response-output,
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.failed .wpcf7-response-output { display: block; margin: 1em 0 0; padding: .8em 1em; }
.wpcf7 form.sent .wpcf7-response-output { border-color: #46b450; color: #2e7d32; background: #f1f9f1; }
.wpcf7 form.invalid .wpcf7-response-output { border-color: #ffb900; color: #8a6100; background: #fffaf0; }
.wpcf7 form.failed .wpcf7-response-output { border-color: #dc3232; color: #b71c1c; background: #fdf2f2; }
.wpcf7 form .wpcf7-response-output .close { display: none; }
.wpcf7-not-valid-tip { display: block; color: #dc3232; font-size: .85em; font-weight: normal; margin-top: 4px; }
.wpcf7 form.submitting .wpcf7-submit { opacity: .6; pointer-events: none; }
.aura-recaptcha-aviso { font-size: 12px !important; line-height: 1.5; opacity: .75; margin: 8px 0 0 !important; }
.aura-recaptcha-aviso a { color: inherit; text-decoration: underline; }
.wpcf7-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }

/* Nossos numeros: "+ de 8 estados" nao pode quebrar a linha */
.fusion-counters-box .content-box-counter{white-space:nowrap}
.fusion-counters-box .display-counter:before{content:'+\00a0 de\00a0 ' !important}
/* entre celular e notebook: 2 por linha em vez de 4 espremidos */
@media (min-width:641px) and (max-width:1023px){
	.fusion-row:has(> .fusion_builder_column_inner_1_4 .fusion-counters-box) > .fusion_builder_column_inner_1_4{width:50% !important;flex:0 0 50% !important;max-width:50% !important;margin-bottom:28px}
}
@media (min-width:1024px) and (max-width:1279px){
	.fusion-counters-box .content-box-counter .display-counter{font-size:clamp(48px,6vw,80px) !important}
	.fusion-counters-box .display-counter:before{font-size:clamp(20px,2.2vw,30px) !important}
	.fusion-counters-box .content-box-counter .unit{font-size:clamp(22px,2.4vw,36px) !important}
}

/* Nossa equipe (/sobre-nos/): diretor e financeiro em destaque, resto em grade */
.aura-equipe{max-width:1200px;margin:0 auto}
.aura-equipe-destaque{display:grid;grid-template-columns:repeat(2,minmax(0,360px));justify-content:center;gap:40px;margin-bottom:56px}
.aura-equipe-grade{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:28px 20px}
.aura-pessoa{margin:0;text-align:center}
.aura-pessoa img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;background:#111}
.aura-pessoa figcaption{padding-top:12px;display:flex;flex-direction:column;gap:4px}
.aura-pessoa-nome{font-family:Montserrat,sans-serif;font-size:16px;font-weight:600;color:#332f2c;line-height:1.3}
.aura-pessoa-cargo{font-family:Montserrat,sans-serif;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#8a5a26;line-height:1.4}
.aura-equipe-destaque .aura-pessoa img{border:1px solid #cb983d;padding:6px;background:#fff;box-sizing:border-box}
.aura-equipe-destaque .aura-pessoa-nome{font-size:22px}
.aura-equipe-destaque .aura-pessoa-cargo{font-size:14px;font-weight:600}
@media (max-width:1100px){.aura-equipe-grade{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:800px){.aura-equipe-grade{grid-template-columns:repeat(3,minmax(0,1fr))}.aura-equipe-destaque{gap:24px}}
@media (max-width:560px){
	.aura-equipe-destaque{grid-template-columns:minmax(0,300px);gap:32px;margin-bottom:40px}
	.aura-equipe-grade{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 14px}
	.aura-pessoa-nome{font-size:15px}
	.aura-equipe-destaque .aura-pessoa-nome{font-size:20px}
}

/* Titulos que eram <h1> extras viraram <h2> (um h1 por pagina, para busca e IA): mesmo visual */
.fusion-title h2.aura-h1{font-family:var(--h1_typography-font-family);font-size:var(--h1_typography-font-size);font-weight:var(--h1_typography-font-weight);line-height:var(--h1_typography-line-height);letter-spacing:var(--h1_typography-letter-spacing)}

/* Titulos do texto que mudaram de nivel (a11y_html.py): tamanho e espaco do nivel original */
.post-content [data-aura-nivel="4"]:not(.fusion-title-heading){font-size:var(--h4_typography-font-size);line-height:var(--h4_typography-line-height);letter-spacing:var(--h4_typography-letter-spacing);margin-top:var(--h4_typography-margin-top);margin-bottom:var(--h4_typography-margin-bottom)}
.post-content [data-aura-nivel="5"]:not(.fusion-title-heading){font-size:var(--h5_typography-font-size);line-height:var(--h5_typography-line-height);letter-spacing:var(--h5_typography-letter-spacing);margin-top:var(--h5_typography-margin-top);margin-bottom:var(--h5_typography-margin-bottom)}
.post-content [data-aura-nivel="6"]:not(.fusion-title-heading){font-size:var(--h6_typography-font-size);line-height:var(--h6_typography-line-height);letter-spacing:var(--h6_typography-letter-spacing);margin-top:var(--h6_typography-margin-top);margin-bottom:var(--h6_typography-margin-bottom)}
h2.aura-h4:not(.fusion-title-heading):not(.widget-title){font-size:var(--h4_typography-font-size);line-height:var(--h4_typography-line-height);letter-spacing:var(--h4_typography-letter-spacing)}

/* Contraste (pedido do Brenner em 28/10, Acessibilidade 100):
   - faixas de fundo claro (aura-fundo-claro, marcadas pelo a11y_html.py) e rodape:
     dourado e bronze viram bronze escuro #8A5A26; botao dourado vira bronze com letra branca
   - no resto (fundo preto, foto, video) o dourado fica igual e o botao ganha letra preta */
body{--button_accent_color:#000;--button_accent_hover_color:#000}
.aura-fundo-claro{--awb-color4:#8a5a26;--awb-color5:#8a5a26;--awb-color6:#7c5418;
	--button_gradient_top_color:#8a5a26;--button_gradient_bottom_color:#8a5a26;
	--button_gradient_top_color_hover:#6e4718;--button_gradient_bottom_color_hover:#6e4718;
	--button_accent_color:#fff;--button_accent_hover_color:#fff}
.fusion-footer{--footer_headings_typography-color:#7c5418;--awb-color6:#7c5418}
.fusion-footer .footer-telefone{background-color:#8a5a26 !important}
.fusion-privacy-bar .fusion-button,.fusion-privacy-bar-acceptance{color:#000 !important}
.aura-fundo-escuro{--awb-color4:#d7ab4c;--awb-color5:#cb983d;--awb-color6:#b36f31;
	--button_gradient_top_color:#cb983d;--button_gradient_bottom_color:#cb983d;--button_accent_color:#000;--button_accent_hover_color:#000}
/* botoes personalizados (telefone e e-mail do /contato/) em fundo claro: letra branca no bronze */
.aura-fundo-claro .fusion-button.button-custom,.aura-fundo-claro .fusion-button.button-custom *{color:#fff !important}

/* Galeria de videos da home (perf_html.galeria_youtube): capa na hora, player do YouTube so no toque */
.aura-yt{display:flex;flex-direction:column;gap:20px;max-width:1100px;margin:0 auto}
.aura-yt-tela{position:relative;aspect-ratio:16/9;width:100%;max-width:100%;background:#000;border-radius:6px;overflow:hidden}
.aura-yt-tela iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.aura-yt-capa{position:absolute;inset:0;width:100%;height:100%;padding:0;border:0;background:#000;cursor:pointer;display:block}
.aura-yt-capa img{width:100%;height:100%;object-fit:cover;display:block}
.aura-yt-play{position:absolute;left:50%;top:50%;width:76px;height:76px;margin:-38px 0 0 -38px;border-radius:50%;background:#cb983d;box-shadow:0 6px 24px rgba(0,0,0,.45);transition:transform .2s}
.aura-yt-play::after{content:"";position:absolute;left:31px;top:24px;border-style:solid;border-width:14px 0 14px 22px;border-color:transparent transparent transparent #000}
.aura-yt-capa:hover .aura-yt-play,.aura-yt-capa:focus-visible .aura-yt-play{transform:scale(1.08)}
.aura-yt-capa:focus-visible{outline:3px solid #d7ab4c;outline-offset:-3px}
.aura-yt-lista{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.aura-yt-item{display:flex;flex-direction:column;gap:8px;width:100%;padding:0;border:0;background:none;cursor:pointer;text-align:left;color:#f5f2ec;font:inherit}
.aura-yt-item img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:4px;border:2px solid transparent;opacity:.85;transition:opacity .2s,border-color .2s}
.aura-yt-item span{font-size:13px;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.aura-yt-item:hover img,.aura-yt-item:focus-visible img{opacity:1}
.aura-yt-item.ativo img{border-color:#cb983d;opacity:1}
.aura-yt-item:focus-visible{outline:2px solid #d7ab4c;outline-offset:3px}
@media (max-width:800px){.aura-yt-lista{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 12px}.aura-yt-play{width:60px;height:60px;margin:-30px 0 0 -30px}.aura-yt-play::after{left:24px;top:18px;border-width:12px 0 12px 18px}}

/* Cabecalho no celular e tablet: o tema deixava 60px vazios embaixo do logo */
@media (max-width:1179px){
	.fusion-header .fusion-row,body.aura-topo-solido .fusion-header .fusion-row{padding-top:10px !important;padding-bottom:10px !important}
	.fusion-header .fusion-logo{margin-top:0 !important;margin-bottom:0 !important}
	.fusion-header .fusion-logo img{max-height:40px;width:auto}
}
@media (max-width:800px){.fusion-fullwidth:has([data-aura-yt]){padding-left:16px !important;padding-right:16px !important}}

/* Videos do YouTube do tema (depoimentos da /sobre-nos/): no celular ficavam
   estreitos e encostados a direita; aqui centralizados e na largura da coluna */
@media (max-width:800px){
	.fusion-video.fusion-youtube{width:100% !important;max-width:100% !important;margin-left:auto !important;margin-right:auto !important;float:none !important}
	.fusion-video.fusion-youtube .video-shortcode{width:100% !important;max-width:100% !important;margin:0 auto !important}
	.fusion-video.fusion-youtube iframe{width:100% !important;height:auto !important;aspect-ratio:16/9}
	/* a coluna herdava o recuo de 60px do tablet e empurrava o video para a direita */
	.fusion-layout-column:has(.fusion-youtube) > .fusion-column-wrapper{padding-left:0 !important;padding-right:0 !important}
	.fusion-fullwidth:has(.fusion-youtube){padding-left:16px !important;padding-right:16px !important}
}
/* Colunas com recuo lateral so para tablet (sem valor para celular) carregavam o recuo no
   celular e tiravam titulos e videos do centro (ex.: Depoimentos da /sobre-nos/) */
@media (max-width:640px){
	.fusion-layout-column[style*="--awb-padding-left-medium"]:not([style*="--awb-padding-left-small"]) > .fusion-column-wrapper{padding-left:0 !important}
	.fusion-layout-column[style*="--awb-padding-right-medium"]:not([style*="--awb-padding-right-small"]) > .fusion-column-wrapper{padding-right:0 !important}
}
