/* ==========================================================================
   ARCA — componentes globais
   Banner de cookies (LGPD) + botão flutuante "Fale com um consultor".

   Este arquivo é carregado em TODAS as páginas: nas páginas do tema, na
   Home e no Sistema ARCA ESG e também nas páginas/posts feitos no Brizy.
   Por isso ele não depende de nenhum outro CSS do tema.
   ========================================================================== */

.arca-cookies, .arca-cookies *, .arca-cookies *::before, .arca-cookies *::after,
.arca-flutuante, .arca-flutuante *, .arca-flutuante *::before, .arca-flutuante *::after {
  box-sizing: border-box;
}
.arca-cookies :where(h2, h3, p, ul, li) { margin: 0; padding: 0; list-style: none; }
.arca-cookies :where(button) { font: inherit; background: none; border: 0; padding: 0; cursor: pointer; color: inherit; }
.arca-cookies :where(a) { color: inherit; }
.arca-cookies :focus-visible, .arca-flutuante:focus-visible {
  outline: 2px solid #188BC9; outline-offset: 3px;
}

/* ==========================================================================
   BANNER DE COOKIES
   Não bloqueia a navegação (a pessoa pode ler a página antes de decidir).
   "Recusar" tem o mesmo peso visual de "Aceitar", como orienta a ANPD.
   ========================================================================== */
.arca-cookies__banner {
  position: fixed; left: 24px; bottom: 24px; z-index: 4000;
  width: min(460px, calc(100vw - 48px));
  padding: 26px 26px 22px;
  font-family: 'Montserrat', system-ui, sans-serif; color: #323332;
  background: rgba(255, 255, 255, 0.94);
  -webkit-backdrop-filter: blur(18px) saturate(160%);
  backdrop-filter: blur(18px) saturate(160%);
  border: 1px solid rgba(0, 0, 0, 0.06); border-radius: 22px;
  box-shadow: 0 30px 70px -24px rgba(15, 38, 60, 0.42);
  overflow: hidden;
  opacity: 0; transform: translateY(24px); visibility: hidden;
  transition: opacity 420ms cubic-bezier(0.4, 0, 0.2, 1),
    transform 520ms cubic-bezier(0.22, 1, 0.36, 1), visibility 0s linear 520ms;
}
/* filete superior no degradê da marca */
.arca-cookies__banner::before {
  content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px;
  background: linear-gradient(90deg, #0F4C7A 0%, #188BC9 52%, #23A849 100%);
}
.arca-cookies__banner.is-aberto {
  opacity: 1; transform: none; visibility: visible;
  transition: opacity 420ms cubic-bezier(0.4, 0, 0.2, 1), transform 520ms cubic-bezier(0.22, 1, 0.36, 1);
}
.arca-cookies__titulo {
  display: flex; align-items: center; gap: 10px;
  font-size: 18px; font-weight: 600; letter-spacing: -0.04em; line-height: 1.2;
  margin-bottom: 10px;
}
.arca-cookies__titulo svg { width: 22px; height: 22px; color: #23A849; flex: none; }
.arca-cookies__texto {
  font-size: 14px; line-height: 1.55; letter-spacing: -0.02em; color: #4A4B4A;
}
.arca-cookies__texto a { color: #188BC9; text-decoration: underline; text-underline-offset: 2px; }
.arca-cookies__acoes {
  display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 18px;
}
.arca-cookies__btn {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 46px; padding: 12px 16px; border-radius: 999px;
  font-size: 14px; font-weight: 600; letter-spacing: -0.03em; line-height: 1.1; text-align: center;
  transition: background 200ms, color 200ms, box-shadow 200ms, transform 200ms;
}
.arca-cookies__btn--primario { background: #188BC9; color: #fff; box-shadow: 0 10px 24px -10px rgba(24,139,201,0.7); }
.arca-cookies__btn--primario:hover { background: #1568A0; transform: translateY(-1px); }
.arca-cookies__btn--secundario { color: #188BC9; box-shadow: inset 0 0 0 1.5px #188BC9; }
.arca-cookies__btn--secundario:hover { background: #188BC9; color: #fff; }
.arca-cookies__personalizar {
  display: block; margin: 14px auto 0;
  font-size: 13px; font-weight: 500; color: #5D5D5D;
  text-decoration: underline; text-underline-offset: 3px;
}
.arca-cookies__personalizar:hover { color: #188BC9; }

/* ---------- janela de preferências ---------- */
.arca-cookies__janela {
  position: fixed; inset: 0; z-index: 4100;
  display: flex; align-items: center; justify-content: center; padding: 20px;
  font-family: 'Montserrat', system-ui, sans-serif; color: #323332;
  visibility: hidden; opacity: 0;
  transition: opacity 280ms cubic-bezier(0.4, 0, 0.2, 1), visibility 0s linear 280ms;
}
.arca-cookies__janela.is-aberto { visibility: visible; opacity: 1; transition: opacity 280ms cubic-bezier(0.4, 0, 0.2, 1); }
.arca-cookies__fundo {
  position: absolute; inset: 0;
  background: rgba(6, 20, 32, 0.55);
  -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px);
}
.arca-cookies__caixa {
  position: relative; width: min(580px, 100%); max-height: calc(100vh - 40px); overflow-y: auto;
  background: #fff; border-radius: 26px; padding: 34px 32px 28px;
  box-shadow: 0 40px 90px -30px rgba(0, 0, 0, 0.5);
  transform: translateY(18px) scale(0.98);
  transition: transform 380ms cubic-bezier(0.22, 1, 0.36, 1);
}
.arca-cookies__janela.is-aberto .arca-cookies__caixa { transform: none; }
.arca-cookies__fechar {
  position: absolute; top: 18px; right: 18px;
  width: 38px; height: 38px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  color: #5D5D5D; transition: background 200ms;
}
.arca-cookies__fechar:hover { background: #EFEFEF; }
.arca-cookies__fechar svg { width: 20px; height: 20px; }
.arca-cookies__caixa h2 {
  font-size: 26px; font-weight: 400; letter-spacing: -0.06em; line-height: 1.1;
  padding-right: 40px; margin-bottom: 10px;
}
.arca-cookies__caixa > p { font-size: 14px; line-height: 1.55; color: #4A4B4A; margin-bottom: 22px; }

.arca-cookies__categorias { display: flex; flex-direction: column; gap: 12px; }
.arca-cookies__categoria {
  display: grid; grid-template-columns: 1fr auto; gap: 6px 18px; align-items: center;
  padding: 16px 18px; border-radius: 16px; background: #F5F6F5;
}
.arca-cookies__categoria h3 { font-size: 15px; font-weight: 600; letter-spacing: -0.03em; }
.arca-cookies__categoria p { grid-column: 1 / -1; font-size: 13px; line-height: 1.5; color: #5D5D5D; }
.arca-cookies__sempre { font-size: 12px; font-weight: 600; color: #23A849; letter-spacing: 0.02em; }

/* interruptor (checkbox com aparência de switch; continua acessível) */
.arca-cookies__switch { position: relative; display: inline-flex; width: 48px; height: 28px; flex: none; }
.arca-cookies__switch input {
  position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; z-index: 1;
}
.arca-cookies__switch span {
  position: absolute; inset: 0; border-radius: 999px; background: #C9CCC9;
  transition: background 220ms;
}
.arca-cookies__switch span::after {
  content: ""; position: absolute; top: 3px; left: 3px; width: 22px; height: 22px; border-radius: 50%;
  background: #fff; box-shadow: 0 2px 6px rgba(0,0,0,0.2);
  transition: transform 260ms cubic-bezier(0.22, 1, 0.36, 1);
}
.arca-cookies__switch input:checked + span { background: #23A849; }
.arca-cookies__switch input:checked + span::after { transform: translateX(20px); }
.arca-cookies__switch input:focus-visible + span { outline: 2px solid #188BC9; outline-offset: 3px; }

.arca-cookies__rodape-janela {
  display: flex; flex-wrap: wrap; gap: 10px; justify-content: flex-end; margin-top: 24px;
}
.arca-cookies__rodape-janela .arca-cookies__btn { min-width: 170px; }

/* ==========================================================================
   BOTÃO FLUTUANTE — "Fale com um consultor" (ícone de envelope)
   ========================================================================== */
.arca-flutuante {
  position: fixed; right: 24px; bottom: 24px; z-index: 3900;
  display: inline-flex; align-items: center; gap: 12px;
  padding: 8px 24px 8px 8px; border-radius: 999px;
  font-family: 'Montserrat', system-ui, sans-serif;
  font-size: 15px; font-weight: 600; letter-spacing: -0.04em; line-height: 1;
  color: #fff; text-decoration: none; white-space: nowrap;
  background: linear-gradient(120deg, #1568A0 0%, #188BC9 55%, #1E9E7A 100%);
  box-shadow: 0 18px 40px -14px rgba(15, 76, 122, 0.7), inset 0 0 0 1px rgba(255,255,255,0.18);
  opacity: 0; transform: translateY(20px) scale(0.96); pointer-events: none;
  transition: opacity 420ms cubic-bezier(0.4, 0, 0.2, 1), transform 520ms cubic-bezier(0.22, 1, 0.36, 1),
    box-shadow 260ms, bottom 420ms cubic-bezier(0.22, 1, 0.36, 1);
}
.arca-flutuante.is-visivel { opacity: 1; transform: none; pointer-events: auto; }
.arca-flutuante:hover {
  color: #fff;
  transform: translateY(-3px);
  box-shadow: 0 24px 48px -14px rgba(15, 76, 122, 0.8), inset 0 0 0 1px rgba(255,255,255,0.28);
}
.arca-flutuante__icone {
  position: relative; width: 42px; height: 42px; flex: none; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  background: #fff; color: #188BC9;
}
.arca-flutuante__icone svg { width: 20px; height: 20px; transition: transform 260ms cubic-bezier(0.22, 1, 0.36, 1); }
.arca-flutuante:hover .arca-flutuante__icone svg { transform: translateY(-1px) scale(1.06); }

/* com qualquer menu mobile aberto (do tema ou da Home/Sistema) o botão some */
body:has(.arca-menu-mobile.is-aberto) .arca-flutuante,
body:has(.mobile-menu.open) .arca-flutuante { opacity: 0; pointer-events: none; }

/* Evita "piscar" o português antes de trocar para EN/ES. A classe é colocada
   no <head> e retirada pelo arca-global.js; se o script falhar, a página
   aparece sozinha depois de 1,5 s. */
.arca-traduzindo body { opacity: 0; animation: arcaMostrarPagina 0s linear 1.5s forwards; }
@keyframes arcaMostrarPagina { to { opacity: 1; } }

@media (max-width: 640px) {
  .arca-cookies__banner {
    left: 12px; right: 12px; bottom: 12px; width: auto;
    padding: 22px 20px 18px; border-radius: 20px;
  }
  .arca-cookies__acoes { grid-template-columns: 1fr; }
  .arca-cookies__caixa { padding: 28px 20px 22px; border-radius: 22px; }
  .arca-cookies__rodape-janela .arca-cookies__btn { flex: 1 1 100%; }

  .arca-flutuante { right: 14px; bottom: 14px; font-size: 14px; padding: 6px 18px 6px 6px; gap: 10px; }
  .arca-flutuante__icone { width: 38px; height: 38px; }
  /* com o banner de cookies aberto, o botão sobe para não ficar por baixo dele */
  .arca-cookies-aberto .arca-flutuante { bottom: calc(var(--arca-cookies-altura, 220px) + 24px); }
}

@media (prefers-reduced-motion: reduce) {
  .arca-cookies__banner, .arca-flutuante, .arca-cookies__caixa, .arca-flutuante__icone svg { transition: none; }
}

/* não imprime componentes flutuantes */
@media print { .arca-cookies, .arca-flutuante { display: none !important; } }

/* ==========================================================================
   TEXTO DE BASE da Home e do Sistema (ver inc/apps.php)
   Já vem no HTML do servidor para buscadores e leitores de tela. Com
   JavaScript fica fora da vista até a aplicação assumir o lugar; sem
   JavaScript, é o conteúdo da página.
   ========================================================================== */
.arca-js .arca-base {
  position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0;
  overflow: hidden; clip-path: inset(50%); border: 0;
}
.arca-base {
  max-width: 820px; margin: 0 auto; padding: 48px 24px;
  font-family: 'Montserrat', system-ui, sans-serif; font-size: 17px; line-height: 1.6; color: #323332;
}
.arca-base h1 { font-size: 40px; font-weight: 300; line-height: 1.1; margin: 0 0 16px; }
.arca-base h2 { font-size: 28px; font-weight: 400; line-height: 1.2; margin: 44px 0 12px; }
.arca-base h3 { font-size: 20px; font-weight: 600; margin: 24px 0 6px; }
.arca-base p, .arca-base ul, .arca-base ol { margin: 0 0 14px; }
.arca-base ul, .arca-base ol { padding-left: 22px; }
.arca-base a { color: #188BC9; }
.arca-base nav a { margin-right: 14px; }

