/*
Theme Name: GF Core
Theme URI: https://wikiaz.com/
Description: Tema Filho (Child Theme) customizado baseado em Hello Elementor com o framework proprietário GSET (Global Settings). Otimizado para alta performance (Core Web Vitals), acessibilidade W3C e integração nativa com o Design System do WikiAZ.
Author: Gustavo Ferretti
Author URI: https://wikiaz.com/
Template: hello-elementor
Version: 1.2.3
Text Domain: gf-core
*/

/* ============================================================
   1. VARIABLES & DESIGN TOKENS (GSET SYSTEM)
   ============================================================ */

:root {
  /* --- PALETA DE CORES BASE (LIGHT MODE) --- */
  --gset-blue: #1A62EC;            /* Cor primária (Links, botões e destaques) */
  --gset-blue-hover: #1B4BA0;      /* Hover e interações */
  --gset-bg-main: #FFFFFF;         /* Fundo base geral da página */
  --gset-bg-surface: #F4F6F9;      /* Fundo de superfícies, outer wrappers e cards */
  --gset-text-title: #0F141C;      /* Escuro profundo para títulos (H1, H2, H3) */
  --gset-text-body: #0F141C;       /* Escuro profundo para texto corrido e parágrafos */
  --gset-text-muted: #596576;      /* Cinza intermediário para descrições secundárias e placeholders */
  --gset-border: rgba(15, 20, 28, 0.08); /* Borda sutil (8% opacidade) */

  /* --- REGRAS ESTRITAS DE TIPOGRAFIA --- */
  --gset-font-serif: "Times New Roman", Times, Georgia, serif;    /* EXCLUSIVA: Frases e declarações do Hero Banner */
  --gset-font-sans: "Work Sans", "Inter", -apple-system, sans-serif; /* Títulos em Work Sans | Texto corrido em Inter */
  --gset-font-brand: "Montserrat", "Work Sans", sans-serif;    /* EXCLUSIVA: Marca 'WikiAZ' escrita textualmente */

  /* --- ESPAÇAMENTOS E SOMBRAS --- */
  --gset-wrapper-section-padding-v: 20px;
  --gset-shadow-sm: 0 2px 8px rgba(15, 23, 42, 0.04);
  --gset-shadow-md: 0 8px 24px rgba(15, 23, 42, 0.08);
  --gset-transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

/* --- SUPORTE AUTOMÁTICO A DARK MODE (PREFERS-COLOR-SCHEME) --- */
@media (prefers-color-scheme: dark) {
  :root {
    --gset-bg-main: #121316;
    --gset-bg-surface: #1A1C20;
    --gset-text-title: #E2E8F0;
    --gset-text-body: #CBD5E1;
    --gset-text-muted: #94A3B8;
    --gset-border: rgba(255, 255, 255, 0.08);

    --gset-shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.4);
    --gset-shadow-md: 0 8px 24px rgba(0, 0, 0, 0.6);
  }
}

/* ============================================================
   2. GLOBAL RESETS & ELEMENTOR OVERRIDES (PERFORMANCE & CLS=0)
   ============================================================ */

*, *::before, *::after {
  box-sizing: border-box;
}

body {
  background-color: var(--gset-bg-main);
  color: var(--gset-text-body);
  font-family: var(--gset-font-sans);
  margin: 0;
  padding: 0;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Trava de scroll no body quando o menu mobile está ativo */
body.gset-menu-lock-scroll {
  overflow: hidden !important;
}

/* Resets rigorosos de títulos e parágrafos */
h1, h2, h3, h4, h5, h6, p {
  margin: 0;
  padding: 0;
  line-height: 1.2;
}

/* Resets de listas e navegação */
ul, ol {
  margin: 0;
  padding: 0;
  list-style: none;
}

a {
  color: inherit;
  text-decoration: none;
  transition: var(--gset-transition);
}

img, svg {
  display: block;
  max-width: 100%;
  height: auto;
}

.elementor-section, .e-con, .e-parent {
  max-width: 100% !important;
}

/* ============================================================
   3. CLASSES UTILITÁRIAS & ACCESSIBILITY (A11Y)
   ============================================================ */

.gset-font-serif {
  font-family: var(--gset-font-serif) !important;
}

.gset-font-brand {
  font-family: var(--gset-font-brand) !important;
}

.gset-sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* ============================================================
   4. SUBSTITUIÇÃO DINÂMICA DE LOGO SVG NO DARK MODE
   ============================================================ */

@media (prefers-color-scheme: dark) {
  img[src*="logo-full-light"], 
  img[src*="logo-full-light.svg"],
  img[src*="wikiaz-logo-full-light"] {
    content: url("https://wikiaz.com/wp-content/uploads/2026/08/wikiaz-logo-full-Dark.svg") !important;
  }

  img[src*="logo-Typog-Light"], 
  img[src*="logo-Typog-Light.svg"] {
    content: url("https://wikiaz.com/wp-content/uploads/2026/08/wikiaz-logo-Typog-Dark.svg") !important;
  }

  img[src*="Icon-Light"], 
  img[src*="Icon-Light.svg"] {
    content: url("https://wikiaz.com/wp-content/uploads/2026/08/wikiaz-Icon-Dark.svg") !important;
  }
}

/* ============================================================
   5. COMPONENTE: HEADER GLOBAL (.gset-header-global)
   ============================================================ */

.gset-header-global {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 72px;
  background-color: transparent;
  border-bottom: 1px solid transparent;
  z-index: 9999;
  transition: background-color 0.3s ease, backdrop-filter 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}

.gset-header-global.gset-header-scrolled {
  background-color: rgba(255, 255, 255, 0.85);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom-color: var(--gset-border);
  box-shadow: var(--gset-shadow-sm);
}

@media (prefers-color-scheme: dark) {
  .gset-header-global.gset-header-scrolled {
    background-color: rgba(18, 19, 22, 0.85);
  }
}

.gset-header-global.gset-header-mobile-expanded {
  background-color: var(--gset-bg-main) !important;
  border-bottom-color: var(--gset-border) !important;
}

.gset-header-container {
  max-width: 1200px;
  height: 100%;
  margin: 0 auto;
  padding: 0 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.gset-header-brand {
  display: flex;
  align-items: center;
  text-decoration: none;
}

.gset-header-logo-img {
  width: 180px;
  height: 32px;
  object-fit: contain;
}

/* RESET ABSOLUTO DO BOTÃO HAMBÚRGUER */
.gset-mobile-toggle,
button.gset-mobile-toggle,
#gsetMobileToggle {
  display: none;
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  cursor: pointer;
  padding: 8px;
  color: var(--gset-text-title) !important;
  transition: var(--gset-transition);
  -webkit-tap-highlight-color: transparent;
}

.gset-mobile-toggle:hover,
.gset-mobile-toggle:focus,
.gset-mobile-toggle:focus-visible,
.gset-mobile-toggle:active,
button.gset-mobile-toggle:hover,
button.gset-mobile-toggle:focus,
button.gset-mobile-toggle:focus-visible,
button.gset-mobile-toggle:active,
#gsetMobileToggle:hover,
#gsetMobileToggle:focus,
#gsetMobileToggle:focus-visible,
#gsetMobileToggle:active {
  background: transparent !important;
  background-color: transparent !important;
  color: var(--gset-blue) !important;
  box-shadow: none !important;
  outline: none !important;
  border: none !important;
}

.gset-mobile-toggle svg,
#gsetMobileToggle svg {
  width: 24px;
  height: 24px;
  stroke: currentColor !important;
  fill: none !important;
}

.gset-mobile-toggle svg path,
#gsetMobileToggle svg path {
  stroke: currentColor !important;
  fill: none !important;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.gset-mobile-toggle:hover svg path,
.gset-mobile-toggle:focus svg path,
.gset-mobile-toggle:active svg path,
#gsetMobileToggle:hover svg path,
#gsetMobileToggle:focus svg path,
#gsetMobileToggle:active svg path {
  stroke: var(--gset-blue) !important;
  fill: none !important;
}

.gset-header-nav {
  display: flex;
  align-items: center;
}

.gset-menu-desktop {
  display: flex;
  align-items: center;
  gap: 32px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.gset-menu-desktop li {
  position: relative;
  list-style: none;
}

.gset-menu-desktop > li > a {
  font-family: var(--gset-font-sans);
  font-size: 16px;
  font-weight: 500;
  color: var(--gset-text-title);
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 24px 0;
  text-decoration: none;
}

.gset-menu-desktop > li > a:hover {
  color: var(--gset-blue);
}

/* ESTILIZAÇÃO BASE DO ÍCONE CHEVRON SVG DE SUBMENU */
.gset-menu-desktop .gset-arrow-icon {
  width: 12px !important;
  height: 12px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-left: 4px !important;
  transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1), color 0.25s ease !important;
  color: var(--gset-text-muted) !important;
  vertical-align: middle !important;
}

/* ============================================================
   COMPORTAMENTO DOS CHEVRONS (DESKTOP >= 1025px)
   ============================================================ */
@media (min-width: 1025px) {
  /* ESTADO DE REPOUSO: Todos os chevrons apontam para a direita (-90deg) */
  .gset-menu-desktop .gset-arrow-icon {
    transform: rotate(-90deg) !important;
  }

  /* NÍVEL 1 & 2: Gira 90deg para apontar para BAIXO (0deg) */
  .gset-menu-desktop > li:hover > a > .gset-arrow-icon,
  .gset-menu-desktop > li.gset-dropdown-open > a > .gset-arrow-icon,
  .gset-menu-desktop ul.sub-menu li:hover > a > .gset-arrow-icon {
    transform: rotate(0deg) !important;
    color: var(--gset-blue) !important;
  }
}

/* ============================================================
   SUBMENUS / DROPDOWNS MULTI-NÍVEL COM MICRO-ANIMAÇÕES (DESKTOP)
   ============================================================ */

.gset-menu-desktop ul.sub-menu,
.gset-menu-desktop .gset-dropdown {
  position: absolute !important;
  top: 100% !important;
  left: 0 !important;
  right: auto !important;
  min-width: 240px !important;
  background-color: var(--gset-bg-surface) !important;
  border: 1px solid var(--gset-border) !important;
  border-radius: 10px !important;
  box-shadow: var(--gset-shadow-md) !important;
  padding: 8px 0 !important;
  margin: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  z-index: 10000 !important;
  list-style: none !important;

  /* ANIMAÇÃO FLUIDA: Opacidade + Transformação suave */
  opacity: 0 !important;
  visibility: hidden !important;
  transform: translateY(8px) !important;
  pointer-events: none !important;
  transition: opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1), transform 0.2s cubic-bezier(0.4, 0, 0.2, 1), visibility 0.2s ease !important;
}

/* Submenu de Nível 2 e Nível 3 (Gavetas Laterais) */
.gset-menu-desktop ul.sub-menu ul.sub-menu {
  top: -8px !important;
  left: 100% !important;
  right: auto !important;
  margin-left: 2px !important;
  margin-right: 0 !important;
  transform: translateX(-8px) !important;
}

/* ESTADO HOVER ATIVO NO DESKTOP */
@media (min-width: 1025px) {
  .gset-menu-desktop li:hover > ul.sub-menu,
  .gset-menu-desktop li.has-dropdown:hover > .gset-dropdown {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) translateX(0) !important;
    pointer-events: auto !important;
  }

  /* Smart Boundary Detection (Submenu voando para a esquerda) */
  .gset-menu-desktop > li.gset-open-left > ul.sub-menu,
  .gset-menu-desktop > li.gset-open-left > .gset-dropdown {
    left: auto !important;
    right: 0 !important;
  }

  .gset-menu-desktop ul.sub-menu li.gset-open-left > ul.sub-menu {
    left: auto !important;
    right: 100% !important;
    margin-left: 0 !important;
    margin-right: 2px !important;
    transform: translateX(8px) !important;
  }

  .gset-menu-desktop ul.sub-menu li.gset-open-left:hover > ul.sub-menu {
    transform: translateX(0) !important;
  }
}

.gset-menu-desktop ul.sub-menu li {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.gset-menu-desktop ul.sub-menu li a {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 10px 20px !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  color: var(--gset-text-body) !important;
  text-decoration: none !important;
  transition: var(--gset-transition) !important;
  white-space: nowrap !important;
}

.gset-menu-desktop ul.sub-menu li a:hover {
  background-color: rgba(26, 98, 236, 0.08) !important;
  color: var(--gset-blue) !important;
}

/* ============================================================
   REGRAS RESPONSIVAS E ACCORDION ANIMAÇÕES (MOBILE <= 1024px)
   ============================================================ */
@media (max-width: 1024px) {
  .gset-mobile-toggle,
  button.gset-mobile-toggle,
  #gsetMobileToggle {
    display: block !important;
  }

  .gset-header-nav {
    position: fixed;
    top: 72px;
    left: 0;
    width: 100%;
    height: calc(100vh - 72px);
    background-color: var(--gset-bg-main);
    flex-direction: column;
    align-items: flex-start;
    padding: 24px;
    overflow-y: auto;
    display: flex !important;
    border-top: 1px solid var(--gset-border);

    /* ANIMAÇÃO FLUIDA DE ABERTURA DA GAVETA MOBILE */
    opacity: 0 !important;
    visibility: hidden !important;
    transform: translateY(-12px) !important;
    pointer-events: none !important;
    transition: opacity 0.25s cubic-bezier(0.4, 0, 0.2, 1), transform 0.25s cubic-bezier(0.4, 0, 0.2, 1), visibility 0.25s ease !important;
  }

  .gset-header-nav.gset-nav-open {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) !important;
    pointer-events: auto !important;
  }

  .gset-menu-desktop {
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    gap: 0;
  }

  .gset-menu-desktop li {
    width: 100%;
    border-bottom: 1px solid var(--gset-border);
  }

  .gset-menu-desktop li a {
    width: 100%;
    justify-content: space-between;
    padding: 16px 0;
  }

  /* RESET DE OVERRIDE DESKTOP NO MOBILE */
  .gset-menu-desktop ul.sub-menu {
    position: static !important;
    box-shadow: none !important;
    border: none !important;
    border-left: 2px solid var(--gset-blue) !important;
    border-radius: 0 !important;
    padding: 0 0 0 12px !important;
    margin: 0 0 0 12px !important;
    background: transparent !important;
    width: calc(100% - 12px) !important;

    /* ANIMAÇÃO DA SANFORA (ACCORDION) MOBILE */
    max-height: 0 !important;
    opacity: 0 !important;
    visibility: hidden !important;
    overflow: hidden !important;
    transform: none !important;
    pointer-events: none !important;
    transition: max-height 0.3s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.25s ease, padding 0.25s ease, margin 0.25s ease !important;
  }

  .gset-menu-desktop li.gset-dropdown-open > ul.sub-menu {
    max-height: 500px !important; /* Altura limite segura para transição suave */
    opacity: 1 !important;
    visibility: visible !important;
    padding: 4px 0 12px 12px !important;
    margin: 4px 0 8px 12px !important;
    pointer-events: auto !important;
  }

  /* MOBILE CHEVRONS ROTATION */
  .gset-menu-desktop .gset-arrow-icon,
  .gset-menu-desktop ul.sub-menu li > a > .gset-arrow-icon {
    transform: rotate(-90deg) !important;
    transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1), color 0.25s ease !important;
  }

  .gset-menu-desktop li.gset-dropdown-open > a > .gset-arrow-icon,
  .gset-menu-desktop ul.sub-menu li.gset-dropdown-open > a > .gset-arrow-icon {
    transform: rotate(0deg) !important;
    color: var(--gset-blue) !important;
  }
}

/* ============================================================
   6. COMPONENTE: HERO BANNER (.gset-hero-wrapper)
   ============================================================ */

.gset-hero-title,
.gset-hero__statement,
h1.gset-hero__statement {
  font-family: var(--gset-font-serif) !important;
  font-style: italic !important;
  color: var(--gset-text-title) !important;
}

.gset-hero-subtitle,
.gset-hero__substatement,
h2.gset-hero__substatement {
  font-family: var(--gset-font-serif) !important;
  font-style: italic !important;
  color: var(--gset-text-title) !important;
}

.gset-hero-wrapper {
  border-bottom: none !important;
}

/* ============================================================
   7. COMPONENTE: EDITORIAL MISSION BRIEFING (.lset-briefing-wrapper)
   ============================================================ */

.lset-briefing-wrapper {
  background-color: var(--gset-bg-main);
  padding: 60px 0;
  border-bottom: none !important;
}

.lset-briefing-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 24px;
  display: grid;
  grid-template-columns: 1fr 300px;
  gap: 48px;
  align-items: center;
}

.lset-briefing-content {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.lset-briefing-title {
  font-family: var(--gset-font-sans);
  font-size: 32px;
  font-weight: 700;
  color: var(--gset-text-title);
}

.lset-briefing-desc {
  font-family: var(--gset-font-sans);
  font-size: 16px;
  line-height: 1.6;
  color: var(--gset-text-muted);
}

@media (max-width: 900px) {
  .lset-briefing-container {
    grid-template-columns: 1fr;
    gap: 32px;
  }
}

/* ============================================================
   8. COMPONENTE: RODAPÉ GLOBAL (.lset-footer-wrapper)
   ============================================================ */

.lset-footer-wrapper {
  width: 100% !important;
  background-color: var(--gset-bg-surface) !important;
  padding-top: 16px !important;
  padding-bottom: 16px !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box !important;
  border-top: 1px solid var(--gset-border) !important;
  clear: both !important;
}

.lset-footer-wrapper *,
.lset-footer-wrapper *::before,
.lset-footer-wrapper *::after {
  box-sizing: border-box !important;
}

.lset-footer-container {
  max-width: 1200px !important;
  width: 100% !important;
  margin: 0 auto !important;
  padding: 0 24px !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 24px !important;
}

.lset-footer-nav {
  display: flex !important;
  align-items: center !important;
  gap: 24px !important;
}

.lset-footer-nav ul,
.lset-footer-nav .lset-footer-menu {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 24px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.lset-footer-nav ul li,
.lset-footer-nav .lset-footer-menu li {
  display: inline-block !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.lset-footer-wrapper a.lset-footer-link,
.lset-footer-link,
.lset-footer-nav a {
  font-family: var(--gset-font-sans) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--gset-text-title) !important;
  text-decoration: none !important;
  background: transparent !important;
  padding: 2px 0 !important;
  transition: var(--gset-transition) !important;
  display: inline-block !important;
}

.lset-footer-wrapper a.lset-footer-link:hover,
.lset-footer-link:hover,
.lset-footer-nav a:hover {
  color: var(--gset-blue) !important;
  text-decoration: underline !important;
  text-underline-offset: 4px !important;
}

.lset-footer-copyright {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-family: var(--gset-font-sans) !important;
  font-size: 13.5px !important;
  color: var(--gset-text-muted) !important;
  white-space: nowrap !important;
}

.lset-footer-typog-logo {
  height: 17px !important;
  max-height: 18px !important;
  width: auto !important;
  max-width: 105px !important;
  object-fit: contain !important;
  display: inline-block !important;
  vertical-align: middle !important;
  margin: 0 2px !important;
}

.lset-footer-copyright strong {
  color: var(--gset-text-title) !important;
  font-weight: 600 !important;
}

@media (max-width: 820px) {
  .lset-footer-container {
    flex-direction: column !important;
    justify-content: center !important;
    text-align: center !important;
    gap: 16px !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  .lset-footer-nav,
  .lset-footer-nav ul,
  .lset-footer-nav .lset-footer-menu {
    justify-content: center !important;
    gap: 20px !important;
  }

  .lset-footer-copyright {
    flex-wrap: wrap !important;
    justify-content: center !important;
    white-space: normal !important;
    line-height: 1.5 !important;
  }
}

@media (max-width: 430px) {
  .lset-footer-container {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  .lset-footer-nav,
  .lset-footer-nav ul,
  .lset-footer-nav .lset-footer-menu {
    gap: 16px !important;
  }

  .lset-footer-link,
  .lset-footer-nav a {
    font-size: 13px !important;
  }

  .lset-footer-copyright {
    font-size: 12px !important;
  }

  .lset-footer-typog-logo {
    height: 15px !important;
    max-width: 90px !important;
  }
}