/*
Theme Name:   Engitech Child
Theme URI:    http://wpdemo.archiwp.com/engitech/
Description:  Make your modifications to [Parent Theme] in this Engitech child theme.
Author:       OceanThemes
Author URI:   http://oceanthemes.net/
Template:     engitech
Version:      1.1
License:      GNU General Public License v2 or later
License URI:  http://www.gnu.org/licenses/gpl-2.0.html
Tags:         light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
Text Domain:  engitech-child
*/

/* =Theme customization starts here
------------------------------------------------------- */

/* Telefone do cabeçalho em uma linha só */
.header-desktop .elementor-icon-box-description {
	white-space: nowrap;
}

/* Slider: o contador "01 / 04" ficava por cima da seta da direita e bloqueava o clique */
sr7-module sr7-arrow.sr7-arrows {
	z-index: 1100 !important;
}

/* Imagens que "sangram" para fora da coluna (margem negativa), como no demo.
   No Elementor atual o widget fica com 100% da coluna e a margem negativa não aumenta a largura,
   então a imagem encolhia. Aqui a largura soma as margens negativas de volta. */
@media (min-width: 1025px) {
	.elementor-2274 .elementor-element.elementor-element-0f677d2 { width: calc(100% + 382px) !important; max-width: none !important; }
	.elementor-1579 .elementor-element.elementor-element-d41fd46 { width: calc(100% + 105px) !important; max-width: none !important; }
}

/* Cards com a mesma altura em cada linha (diferenciais e "Como trabalhamos" da home).
   A coluna estica até a altura da mais alta e o card ocupa a altura toda. */
@media (min-width: 768px) {
	.elementor-2274 .elementor-element-8da485e > .elementor-container > .elementor-column > .elementor-widget-wrap,
	.hl-cards-iguais > .elementor-container > .elementor-column > .elementor-widget-wrap,
	#como-trabalhamos .elementor-inner-section .elementor-column > .elementor-widget-wrap {
		flex-direction: column;
		flex-wrap: nowrap;
		align-content: stretch;
	}
	.elementor-2274 .elementor-element-8da485e .elementor-widget-iserv_box_2,
	.hl-cards-iguais .elementor-widget-iserv_box_2,
	#como-trabalhamos .elementor-widget-iservice_box {
		flex: 1 1 auto;
	}
	.elementor-2274 .elementor-element-8da485e .elementor-widget-iserv_box_2 > .elementor-widget-container,
	.elementor-2274 .elementor-element-8da485e .serv-box-2,
	.hl-cards-iguais .elementor-widget-iserv_box_2 > .elementor-widget-container,
	.hl-cards-iguais .serv-box-2,
	#como-trabalhamos .elementor-widget-iservice_box > .elementor-widget-container,
	#como-trabalhamos .service-box {
		height: 100%;
	}
}

/* Diferenciais: "SAIBA MAIS" alinhado no rodapé de cada card */
@media (min-width: 768px) {
	.elementor-2274 .elementor-element-8da485e .serv-box-2,
	.hl-cards-iguais .serv-box-2 { display: flex; flex-direction: column; }
	.elementor-2274 .elementor-element-8da485e .serv-box-2 .content-box,
	.hl-cards-iguais .serv-box-2 .content-box { flex: 1 1 auto; display: flex; flex-direction: column; }
	.elementor-2274 .elementor-element-8da485e .serv-box-2 .btn-details,
	.hl-cards-iguais .serv-box-2 .btn-details { margin-top: auto; align-self: flex-start; }
}
@media (min-width: 768px) {
	.elementor-2274 .elementor-element-8da485e .serv-box-2 .content-box > div,
	.hl-cards-iguais .serv-box-2 .content-box > div { margin-bottom: 30px; }
}

/* Ícones próprios no mesmo estilo dos flaticons do tema (seguem a cor e o hover do texto).
   Para usar o logo oficial da Sankhya no lugar de "hl-plataforma", troque o arquivo
   images/icons/hl-plataforma.svg (de preferência um SVG de uma cor só). */
[class^="flaticon-hl-"]::before,
[class*=" flaticon-hl-"]::before {
	content: "";
	display: inline-block;
	width: 1em;
	height: 1em;
	background-color: currentColor;
	vertical-align: top;
	-webkit-mask: var(--hl-icon) no-repeat center / contain;
	mask: var(--hl-icon) no-repeat center / contain;
}
.flaticon-hl-plataforma { --hl-icon: url("images/icons/hl-plataforma.svg"); }
.flaticon-hl-integracoes { --hl-icon: url("images/icons/hl-integracoes.svg"); }

/* Símbolo oficial da Sankhya (extraído de logo-header.svg). O arquivo mantém o verde original;
   aqui ele é usado como máscara para seguir a cor dos outros ícones (branco). */
.flaticon-sankhya-simbolo::before {
	content: "";
	display: inline-block;
	width: 1.07em;
	height: 1em;
	vertical-align: top;
	background-color: currentColor;
	-webkit-mask: url("images/icons/sankhya-simbolo.svg") no-repeat center / contain;
	mask: url("images/icons/sankhya-simbolo.svg") no-repeat center / contain;
}

/* Botão flutuante do WhatsApp (functions.php). Fica acima do "voltar ao topo" do tema. */
.hl-whatsapp {
	position: fixed;
	right: 30px;
	bottom: 100px;
	z-index: 9990;
	width: 56px;
	height: 56px;
	border-radius: 50%;
	background: #25D366;
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 30px;
	box-shadow: 0 6px 18px rgba(10, 22, 40, 0.25);
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.hl-whatsapp:hover,
.hl-whatsapp:focus-visible {
	color: #fff;
	transform: scale(1.06);
	box-shadow: 0 8px 22px rgba(10, 22, 40, 0.35);
}
.hl-whatsapp:focus-visible { outline: 3px solid #1C8EF2; outline-offset: 3px; }
@media (max-width: 767px) {
	.hl-whatsapp { right: 35px; bottom: 100px; width: 52px; height: 52px; font-size: 28px; }
}
@media print { .hl-whatsapp { display: none; } }

/* Link "Saiba mais" dentro da descrição dos cards de serviço */
.hl-saiba-mais {
	display: table;
	margin-top: 10px;
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	color: #1C8EF2;
}
.hl-saiba-mais i { font-size: 11px; margin-left: 4px; }
.hl-saiba-mais:hover { color: #0A1628; }

/* Formas de contratação (/servicos/): a tabela de preços do tema sem o preço */
#formas-de-contratacao .ot-pricing-table .inner-table h2:empty { display: none; }
#formas-de-contratacao .ot-pricing-table .inner-table > span { display: block; min-height: 2.6em; padding-right: 70px; }

/* Fecho de /servicos/: segundo botão em estilo contorno, ao lado do principal */
.hl-btn-secundario .octf-btn { background: transparent !important; border: 2px solid #fff; color: #fff !important; }
.hl-btn-secundario .octf-btn:hover { background: #fff !important; color: #0A1628 !important; }

/* Fecho de /servicos/: botões lado a lado (empilham sozinhos no celular) */
.elementor-2407 .elementor-element-73be24f .elementor-widget-wrap { justify-content: center; }
.elementor-2407 .elementor-element-73be24f .elementor-widget-ibutton { width: auto; margin: 0 8px 12px; }

/* Ícone de integrações (traço fino) um pouco maior, para ter o mesmo peso visual dos ícones do tema */
.icon-box-s2 .flaticon-hl-integracoes::before { transform: scale(1.18); transform-origin: left center; }

/* Rótulo de cada linha de cards em /servicos/ ("EIP Sankhya" / "Software e integrações") */
.hl-linha-titulo {
	margin: 10px 0 25px;
	padding-bottom: 10px;
	border-bottom: 1px solid #e6eaf0;
	font-size: 13px;
	font-weight: 800;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #1C8EF2;
}

/* Integrações que já entregamos */
.hl-integracoes { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 20px; }
.hl-int { position: relative; padding: 26px 26px 22px 70px; border: 1px solid #e6eaf0; border-radius: 6px; background: #fff; }
.hl-int-icone { position: absolute; left: 24px; top: 26px; font-size: 28px; color: #1C8EF2; line-height: 1; }
.hl-int h6 { margin: 0 0 8px; font-size: 17px; color: #0A1628; }
.hl-int h6 small { display: block; margin-top: 3px; font-size: 12px; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; color: #8FA3BF; }
.hl-int p { margin: 0; font-size: 15px; line-height: 1.6; }
.hl-int a { color: #1C8EF2; }
@media (max-width: 1024px) { .hl-integracoes { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 767px)  { .hl-integracoes { grid-template-columns: 1fr; } }

/* Links "Saiba mais" e dos cards: mesma cor visitados ou não (o tema pinta todo link visitado de verde) */
.hl-saiba-mais, .hl-saiba-mais:visited, .hl-int a, .hl-int a:visited { color: #1C8EF2; }
.hl-saiba-mais:hover, .hl-saiba-mais:focus, .hl-int a:hover, .hl-int a:focus { color: #0A1628; }

/* Tipos de personalização (Desenvolvimento Sankhya): Add-ons em destaque */
/* destaque só ao passar o mouse, igual em todos os cards */
.hl-int { transition: border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease; }
.hl-int:hover { border-color: #1C8EF2; background: #f2f8fe; box-shadow: 0 6px 18px rgba(10, 22, 40, 0.06); }

/* Elementos marcados como ocultos em todos os tamanhos (desktop, tablet e celular) ficam ocultos de verdade.
   Nos modelos de cabeçalho/rodapé do tema, o CSS responsivo do Elementor não é carregado e eles apareciam. */
.elementor-hidden-desktop.elementor-hidden-tablet.elementor-hidden-phone { display: none !important; }

/* Formulários do Contact Form 7 na caixa ".main-form": fundo claro em vez do degradê do tema */
.wpcf7 .main-form {
	background: #F4F7FB !important;
	background-image: none !important;
	border: 1px solid #E1E8F0;
	color: #0A1628;
}
.wpcf7 .main-form h2 { color: #0A1628; }
.wpcf7 .main-form p.font14,
.wpcf7 .main-form p { color: #5A6B80; }
.wpcf7 .main-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]),
.wpcf7 .main-form select,
.wpcf7 .main-form textarea {
	background: #fff !important;
	border: 1px solid #D6DEE8 !important;
	color: #0A1628 !important;
}
.wpcf7 .main-form ::placeholder { color: #8FA3BF !important; opacity: 1; }
.wpcf7 .main-form input:focus,
.wpcf7 .main-form textarea:focus,
.wpcf7 .main-form select:focus {
	border-color: #1C8EF2 !important;
	box-shadow: 0 0 0 3px rgba(28, 142, 242, 0.15);
	outline: none;
}
.wpcf7 .main-form button,
.wpcf7 .main-form .octf-btn {
	background: #1C8EF2 !important;
	border-color: #1C8EF2 !important;
	color: #fff !important;
}
.wpcf7 .main-form button:hover,
.wpcf7 .main-form .octf-btn:hover { background: #0A1628 !important; border-color: #0A1628 !important; }
/* mensagens de validação e de envio legíveis no fundo claro */
.wpcf7 .main-form input.wpcf7-not-valid:not([type="submit"]):not([type="checkbox"]):not([type="radio"]),
.wpcf7 .main-form textarea.wpcf7-not-valid,
.wpcf7 .main-form select.wpcf7-not-valid { border-color: #D93025 !important; }
.wpcf7 .main-form .wpcf7-not-valid-tip { display: block !important; color: #D93025; font-size: 13px; margin-top: 4px; }
.wpcf7 form .wpcf7-response-output { color: #0A1628; background: #fff; border-radius: 4px; }
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output { border-color: #F2B705; }
.wpcf7 form.sent .wpcf7-response-output { border-color: #2E9E5B; }
.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output { border-color: #D93025; }

/* Cards de diferenciais sem "Saiba mais": esconde o link vazio que o widget ainda imprime */
.serv-box-2 .btn-details:empty,
.serv-box-2 .btn-details:not([href]) { display: none; }

/* Abas das etapas ("Do diagnóstico ao acompanhamento"): 4 em linha, 2x2 no tablet, empilhadas no celular */
.ot-tabs .tabs-heading { display: flex; flex-wrap: wrap; gap: 8px; }
.ot-tabs .tabs-heading li.tab-link {
	flex: 1 1 auto;
	margin: 0 !important;
	padding-left: 8px !important;
	padding-right: 8px !important;
	text-align: center;
	min-width: 0;
	white-space: nowrap;
	font-size: 12px;
	letter-spacing: 0 !important;
}
@media (max-width: 1024px) { .ot-tabs .tabs-heading li.tab-link { flex: 1 1 calc(50% - 8px); } }
@media (max-width: 767px)  { .ot-tabs .tabs-heading li.tab-link { flex: 1 1 100%; } }

/* Abas: inativas em contorno com texto branco, ativa preenchida (contraste no fundo marinho) */
.ot-tabs .tabs-heading li.tab-link { background: transparent !important; border: 1px solid #1C8EF2 !important; color: #fff !important; }
.ot-tabs .tabs-heading li.tab-link:hover,
.ot-tabs .tabs-heading li.tab-link.current { background: #1C8EF2 !important; color: #fff !important; }

/* Abas das etapas: todas as respostas ocupam o mesmo espaço (o da mais longa),
   para a seção não mudar de altura ao trocar de aba */
.ot-tabs { display: grid; }
.ot-tabs .tabs-heading { grid-row: 1; grid-column: 1; }
.ot-tabs .tab-content { display: block !important; grid-row: 2; grid-column: 1; visibility: hidden; }
.ot-tabs .tab-content.current { visibility: visible; }

/* Sobre: missão, visão, filosofia e estratégia (cards com âncora; os quadros com foto levam até eles) */
html { scroll-padding-top: 120px; }
.hl-mv-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 30px; }
.hl-mv {
	position: relative;
	padding: 40px 40px 36px;
	border: 1px solid #e6eaf0;
	border-top: 3px solid #1C8EF2;
	border-radius: 6px;
	background: #fff;
	scroll-margin-top: 120px;
	transition: border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
}
.hl-mv:hover, .hl-mv:target { border-color: #1C8EF2; background: #f2f8fe; box-shadow: 0 6px 18px rgba(10, 22, 40, 0.06); }
.hl-mv-num { position: absolute; top: 26px; right: 32px; font-size: 44px; font-weight: 800; line-height: 1; color: #eef2f7; }
.hl-mv-icone { display: block; margin-bottom: 20px; font-size: 34px; color: #1C8EF2; }
.hl-mv h3, .hl-mv h5 { margin: 0 0 12px; font-size: 22px; line-height: 1.3; color: #0A1628; }
.hl-mv p { margin: 0; font-size: 16px; line-height: 1.75; }
@media (max-width: 767px) {
	.hl-mv-grid { grid-template-columns: 1fr; gap: 20px; }
	.hl-mv { padding: 30px 26px 26px; scroll-margin-top: 90px; }
	html { scroll-padding-top: 90px; }
}

/* Faixa de logos de clientes (Home): cinza e discreta, ganha cor ao passar o mouse */
.hl-clientes .swiper-slide { display: flex; align-items: center; justify-content: center; }
.hl-clientes .swiper-slide-image { max-width: 200px; width: 100%; height: auto; filter: grayscale(1); opacity: 0.6; transition: filter 0.3s ease, opacity 0.3s ease; }
.hl-clientes .swiper-slide:hover .swiper-slide-image { filter: none; opacity: 1; }
@media (hover: none) { .hl-clientes .swiper-slide-image { filter: none; opacity: 1; } }

/* Página 404: dois botões lado a lado (empilham no celular) */
.hl-404-botoes { display: flex; flex-wrap: wrap; justify-content: center; gap: 15px; margin-top: 30px; }
.hl-404-botoes .octf-btn { margin: 0; }
.hl-404-botoes .octf-btn i { margin-right: 6px; }
.hl-404-botoes .octf-btn { display: inline-flex; align-items: center; }
.hl-404-botoes .hl-btn-contorno, .hl-404-botoes .hl-btn-contorno:visited { background: transparent; color: #1C8EF2; box-shadow: inset 0 0 0 2px #1C8EF2; }
.hl-404-botoes .hl-btn-contorno:hover, .hl-404-botoes .hl-btn-contorno:focus { background: #1C8EF2; color: #fff; }
@media (min-width: 768px) { .hl-404-botoes { margin-left: -80px; margin-right: -80px; } }

/* Política de Privacidade: texto longo com leitura confortável */
body.privacy-policy .entry-content { box-sizing: border-box; max-width: 1200px; margin: 0 auto; padding: 100px 0 110px; }
@media (max-width: 767px) { body.privacy-policy .entry-content { padding: 60px 0 70px; } }
body.privacy-policy .entry-content h2 { margin: 45px 0 15px; font-size: 26px; line-height: 1.3; }
body.privacy-policy .entry-content h3 { margin: 28px 0 10px; font-size: 19px; }
body.privacy-policy .entry-content a, body.privacy-policy .entry-content a:visited { color: #1C8EF2; }
body.privacy-policy .entry-content ul { margin-bottom: 20px; }

/* Aviso de cookies (LGPD) */
.hl-cookies { position: fixed; left: 20px; bottom: 20px; z-index: 99999; max-width: 640px; padding: 22px 26px; border-radius: 6px; background: #0A1628; color: #c9d4e3; box-shadow: 0 10px 30px rgba(10, 22, 40, 0.25); display: flex; align-items: center; gap: 20px; }
.hl-cookies[hidden] { display: none; }
.hl-cookies p { margin: 0; font-size: 14px; line-height: 1.6; }
.hl-cookies a, .hl-cookies a:visited { color: #fff; text-decoration: underline; }
.hl-cookies-botoes { display: flex; gap: 10px; flex-shrink: 0; }
.hl-cookies .octf-btn { padding: 10px 20px; font-size: 13px; }
.hl-cookies .hl-btn-contorno-claro { background: transparent; color: #fff; box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.6); }
.hl-cookies .hl-btn-contorno-claro:hover, .hl-cookies .hl-btn-contorno-claro:focus { background: #fff; color: #0A1628; }
@media (max-width: 767px) {
	.hl-cookies { left: 10px; right: 10px; bottom: 10px; flex-direction: column; align-items: stretch; gap: 14px; padding: 18px; }
	.hl-cookies-botoes .octf-btn { flex: 1; justify-content: center; }
	body.hl-cookies-aberto .hl-whatsapp, body.hl-cookies-aberto #back-to-top { display: none; }
}
.hl-rodape-links { display: inline-block; margin-left: 6px; }
.hl-rodape-links a, .hl-rodape-links a:visited { color: inherit; text-decoration: underline; }

/* Mapa do Google: espera aceite ou clique */
.hl-mapa { position: relative; }
.hl-mapa-aviso { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; padding: 20px; background: #eef2f7; text-align: center; }
.hl-mapa-aviso p { margin: 0; color: #0A1628; }
.hl-mapa.hl-mapa-carregado .hl-mapa-aviso { display: none; }

/* Formulário de contato: ciência da política */
.hl-ciencia { font-size: 14px; }
.hl-ciencia a, .hl-ciencia a:visited { color: #1C8EF2; }
.hl-ciencia input { margin-right: 6px; }
.hl-ciencia .wpcf7-list-item { margin: 0; }
.hl-ciencia label { display: flex; align-items: center; gap: 8px; cursor: pointer; }
.hl-ciencia input[type="checkbox"] { width: 16px; height: 16px; margin: 0; flex-shrink: 0; }

/* Acessibilidade: contraste mínimo (WCAG AA) nos textos pequenos sobre fundo claro.
   Mesmas cores da marca, um tom mais fechado. Subtítulos com cor própria no Elementor não mudam. */
body .ot-heading > span { color: #4A7A0B; }
body .octf-btn, body .octf-btn:visited { background: #1474D6; }
body .octf-btn:hover, body .octf-btn:focus { background: #0F5DB0; }
body .hl-saiba-mais, body .hl-saiba-mais:visited, body .hl-int a, body .hl-int a:visited,
.hl-ciencia a, .hl-ciencia a:visited, body.privacy-policy .entry-content a, body.privacy-policy .entry-content a:visited { color: #1474D6; }
.hl-404-botoes .hl-btn-contorno, .hl-404-botoes .hl-btn-contorno:visited { color: #1474D6; box-shadow: inset 0 0 0 2px #1474D6; }
.hl-404-botoes .hl-btn-contorno:hover, .hl-404-botoes .hl-btn-contorno:focus { background: #1474D6; color: #fff; }

/* Antispam do formulário: campo "pote de mel" fora da tela (invisível para pessoas) */
.hl-campo-extra { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }