/* ═══════════════════════════════════════════════════════════
   AxéCloud — Protótipo Cinematográfico
   Paleta: noite de terreiro + ouro (#facc15/#ffc107 do sistema)
   ═══════════════════════════════════════════════════════════ */

/* Fonte versionada para o build de produção. */
:root {
  --noite: #0a0805;
  --noite-2: #120e08;
  --terra: #1c1409;
  --ouro: #ffc107;
  --ouro-claro: #ffe08a;
  --ouro-escuro: #b45309;
  --brasa: #ff6b35;
  --osso: #f5ead3;
  --osso-fraco: rgba(245, 234, 211, 0.55);
  --verde-folha: #7da87b;
  --fonte-display: "Fraunces", serif;
  --fonte-corpo: "Outfit", sans-serif;
}

* { margin: 0; padding: 0; box-sizing: border-box; }
.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; }

html { scroll-behavior: auto; overflow-x: clip; }

body {
  background: var(--noite);
  color: var(--osso);
  font-family: var(--fonte-corpo);
  overflow-x: hidden;
  cursor: none;
}
@media (hover: none), (pointer: coarse) {
  body { cursor: auto; }
  #cursor-vagalume { display: none; }
}

::selection { background: var(--ouro); color: var(--noite); }

/* Grain estático (tile) — evita feTurbulence em full-screen (custo alto de GPU) */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 60;
  pointer-events: none;
  opacity: 0.045;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64'%3E%3Ccircle cx='4' cy='8' r='0.7' fill='%23fff'/%3E%3Ccircle cx='18' cy='3' r='0.6' fill='%23fff'/%3E%3Ccircle cx='31' cy='14' r='0.8' fill='%23fff'/%3E%3Ccircle cx='47' cy='6' r='0.5' fill='%23fff'/%3E%3Ccircle cx='58' cy='19' r='0.7' fill='%23fff'/%3E%3Ccircle cx='9' cy='28' r='0.6' fill='%23fff'/%3E%3Ccircle cx='22' cy='36' r='0.7' fill='%23fff'/%3E%3Ccircle cx='38' cy='25' r='0.5' fill='%23fff'/%3E%3Ccircle cx='51' cy='33' r='0.8' fill='%23fff'/%3E%3Ccircle cx='61' cy='41' r='0.6' fill='%23fff'/%3E%3Ccircle cx='7' cy='48' r='0.7' fill='%23fff'/%3E%3Ccircle cx='19' cy='55' r='0.5' fill='%23fff'/%3E%3Ccircle cx='33' cy='46' r='0.8' fill='%23fff'/%3E%3Ccircle cx='44' cy='58' r='0.6' fill='%23fff'/%3E%3Ccircle cx='56' cy='52' r='0.7' fill='%23fff'/%3E%3Ccircle cx='12' cy='61' r='0.5' fill='%23fff'/%3E%3Ccircle cx='27' cy='18' r='0.6' fill='%23fff'/%3E%3Ccircle cx='41' cy='40' r='0.7' fill='%23fff'/%3E%3Ccircle cx='53' cy='12' r='0.5' fill='%23fff'/%3E%3C/svg%3E");
  background-size: 64px 64px;
  mix-blend-mode: overlay;
  transform: translateZ(0);
  contain: strict;
}

/* ── Preloader — a firmeza ─────────────────────────────── */
#preloader {
  position: fixed;
  inset: 0;
  z-index: 100;
  background: var(--noite);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: opacity 1.1s ease, visibility 1.1s;
}
#preloader.apagado { opacity: 0; visibility: hidden; }
#preloader[hidden] { display: none !important; }
.cinematic-fallback #preloader { display: none !important; }
.cinematic-fallback [data-reveal] { opacity: 1 !important; transform: none !important; }
.firmeza { text-align: center; }
.vela { position: relative; width: 44px; margin: 0 auto 26px; height: 120px; }
.corpo-vela {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 26px;
  height: 78px;
  border-radius: 5px 5px 3px 3px;
  background: linear-gradient(180deg, #fff8e6, #efe0bd 60%, #d9c493);
  box-shadow: 0 0 34px rgba(255, 193, 7, 0.22);
}
.pavio {
  position: absolute;
  bottom: 76px;
  left: 50%;
  transform: translateX(-50%);
  width: 2px;
  height: 8px;
  background: #3a2c18;
}
.chama {
  position: absolute;
  bottom: 82px;
  left: 50%;
  transform-origin: 50% 100%;
  width: 16px;
  height: 30px;
  margin-left: -8px;
  border-radius: 50% 50% 50% 50% / 62% 62% 38% 38%;
  background: radial-gradient(ellipse at 50% 78%, #fff9e8 0%, #ffd35c 38%, #ff8c2b 68%, rgba(255, 90, 20, 0) 100%);
  filter: blur(0.4px) drop-shadow(0 0 18px rgba(255, 170, 40, 0.85));
  animation: tremular 0.9s ease-in-out infinite alternate;
}
@keyframes tremular {
  0% { transform: translateX(-1px) scaleY(1) rotate(-2.5deg); }
  50% { transform: translateX(1px) scaleY(1.08) rotate(1.8deg); }
  100% { transform: translateX(-0.5px) scaleY(0.94) rotate(-1deg); }
}
.firmeza-texto {
  font-family: var(--fonte-display);
  font-style: italic;
  font-weight: 300;
  font-size: 1.05rem;
  color: var(--osso-fraco);
  letter-spacing: 0.06em;
}
.dots span { animation: piscar 1.4s infinite; }
.dots span:nth-child(2) { animation-delay: 0.25s; }
.dots span:nth-child(3) { animation-delay: 0.5s; }
@keyframes piscar { 0%, 60%, 100% { opacity: 0.15; } 30% { opacity: 1; } }
.firmeza-barra {
  width: 180px;
  height: 1px;
  margin: 20px auto 0;
  background: rgba(245, 234, 211, 0.12);
}
.firmeza-progresso {
  width: 0%;
  height: 100%;
  background: linear-gradient(90deg, var(--ouro-escuro), var(--ouro));
  transition: width 0.3s ease;
}

/* ── Ambiente: brasas, fumaça, vinheta, cursor ─────────── */
#embers {
  position: fixed;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  width: 100%;
  height: 100%;
  contain: strict;
}
/* Clarão da fogueira — luz quente respirando rente ao chão */
.clarao-fogueira {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  height: 34vh;
  z-index: 1;
  pointer-events: none;
  background:
    radial-gradient(120% 100% at 50% 115%, rgba(255, 110, 30, 0.16), transparent 62%),
    radial-gradient(60% 70% at 50% 118%, rgba(255, 190, 70, 0.12), transparent 70%);
  animation: respirar-fogo 4.5s ease-in-out infinite alternate;
  will-change: opacity, transform;
  transform: translateZ(0);
}
@keyframes respirar-fogo {
  from { opacity: 0.65; transform: scaleY(0.96) translateZ(0); transform-origin: bottom; }
  to { opacity: 1; transform: scaleY(1.05) translateZ(0); transform-origin: bottom; }
}

/* Wrapper anima transform; glow = gradient suave (sem filter:blur — mesmo look, bem mais leve) */
.fumaca {
  position: fixed;
  z-index: 2;
  pointer-events: none;
  width: 60vw;
  height: 60vh;
  transform: translateZ(0);
  will-change: transform;
  contain: layout style paint;
}
.fumaca-glow {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  filter: none;
  opacity: 0.4;
  mix-blend-mode: screen;
  transform: translateZ(0) scale(1.45);
  contain: paint;
}
.fumaca-a {
  bottom: -26vh;
  left: -10vw;
  animation: deriva-a 26s ease-in-out infinite alternate;
}
.fumaca-a .fumaca-glow {
  background: radial-gradient(circle,
    rgba(180, 83, 9, 0.14) 0%,
    rgba(180, 83, 9, 0.08) 28%,
    rgba(180, 83, 9, 0.035) 48%,
    transparent 70%);
}
.fumaca-b {
  bottom: -22vh;
  right: -12vw;
  animation: deriva-b 32s ease-in-out infinite alternate;
}
.fumaca-b .fumaca-glow {
  background: radial-gradient(circle,
    rgba(255, 193, 7, 0.09) 0%,
    rgba(255, 193, 7, 0.045) 30%,
    rgba(255, 193, 7, 0.018) 50%,
    transparent 70%);
}
.fumaca-c,
.luz-ambiente { display: none; }
@keyframes deriva-a { to { transform: translate3d(7vw, -14vh, 0) scale(1.15); } }
@keyframes deriva-b { to { transform: translate3d(-6vw, -16vh, 0) scale(1.1); } }
/* Pontos riscados subindo na defumação */
#pontos-fumaca {
  position: fixed;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  overflow: hidden;
  contain: strict;
  transform: translateZ(0);
}
.ponto-fumaca {
  position: absolute;
  left: 0;
  top: 0;
  color: var(--ouro);
  /* glow via traço largo no SVG (sem filter/drop-shadow em elemento animado) */
  filter: none;
  will-change: transform, opacity;
  transform: translateZ(0);
  backface-visibility: hidden;
  contain: layout style;
}
.ponto-fumaca svg {
  width: 100%;
  height: 100%;
  fill: none;
  stroke: currentColor;
  stroke-width: 1;
  stroke-linecap: round;
  stroke-linejoin: round;
  overflow: visible;
}
.ponto-fumaca .ponto-glow {
  opacity: 0.28;
  stroke-width: 3.2;
}

.vinheta {
  position: fixed;
  inset: 0;
  z-index: 55;
  pointer-events: none;
  background: radial-gradient(ellipse at center, transparent 52%, rgba(4, 3, 1, 0.62) 100%);
}
#cursor-vagalume {
  position: fixed;
  z-index: 90;
  left: 0;
  top: 0;
  width: 10px;
  height: 10px;
  margin: 0;
  border-radius: 50%;
  background: var(--ouro-claro);
  box-shadow: 0 0 14px 4px rgba(255, 210, 90, 0.55), 0 0 40px 12px rgba(255, 160, 40, 0.18);
  pointer-events: none;
  will-change: transform;
  transform: translateZ(0);
  transition: transform 0.18s ease, opacity 0.3s;
}
#cursor-vagalume.pousado { transform: scale(2.4); }

/* ── Fio de contas (progresso do scroll) ───────────────── */
.fio-de-contas {
  position: fixed;
  right: 26px;
  top: 50%;
  transform: translateY(-50%);
  height: 46vh;
  z-index: 70;
  display: flex;
  align-items: stretch;
}
.fio-linha, .fio-preenchido {
  position: absolute;
  left: 50%;
  top: 0;
  width: 1px;
  transform: translateX(-50%);
}
.fio-linha { height: 100%; background: rgba(245, 234, 211, 0.14); }
.fio-preenchido {
  height: 0%;
  background: linear-gradient(180deg, var(--ouro), var(--ouro-escuro));
  box-shadow: 0 0 8px rgba(255, 193, 7, 0.6);
}
.contas {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
}
.conta {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  border: 1px solid rgba(245, 234, 211, 0.35);
  background: var(--noite);
  margin-left: -4px;
  cursor: pointer;
  transition: all 0.4s ease;
}
.conta.acesa {
  background: var(--ouro);
  border-color: var(--ouro);
  box-shadow: 0 0 12px rgba(255, 193, 7, 0.8);
}
@media (max-width: 860px) { .fio-de-contas { display: none; } }

/* ── Navegação ─────────────────────────────────────────── */
.navegacao {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 80;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 34px;
  background: linear-gradient(180deg, rgba(10, 8, 5, 0.85), transparent);
  backdrop-filter: blur(2px);
}
.marca {
  display: flex;
  align-items: center;
  text-decoration: none;
}
.marca-assinatura {
  display: block;
  width: 168px;
  height: auto;
  object-fit: contain;
  filter: drop-shadow(0 3px 8px rgba(23, 37, 29, 0.14));
  transition: transform 0.3s ease, filter 0.3s ease;
}
.marca:hover .marca-assinatura {
  transform: translateY(-1px);
  filter: drop-shadow(0 5px 10px rgba(242, 185, 15, 0.24));
}
@media (max-width: 520px) {
  .marca-assinatura { width: 148px; }
}
.nav-links { display: flex; gap: 30px; }
.nav-links a {
  color: var(--osso-fraco);
  text-decoration: none;
  font-size: 0.86rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  transition: color 0.3s;
}
.nav-links a:hover { color: var(--ouro); }
.nav-acoes { display: flex; align-items: center; gap: 16px; }
.btn-entrar {
  color: var(--osso-fraco);
  text-decoration: none;
  font-size: 0.86rem;
  font-weight: 500;
  letter-spacing: 0.06em;
  transition: color 0.3s;
}
.btn-entrar:hover { color: var(--ouro); }
@media (max-width: 860px) { .nav-links, .btn-nav { display: none; } }

/* ── Botões ────────────────────────────────────────────── */
.btn {
  display: inline-block;
  padding: 14px 30px;
  border-radius: 999px;
  font-family: var(--fonte-corpo);
  font-weight: 600;
  font-size: 0.92rem;
  letter-spacing: 0.04em;
  text-decoration: none;
  transition: transform 0.35s ease, box-shadow 0.35s ease, background 0.35s;
}
.btn-ouro {
  background: linear-gradient(135deg, var(--ouro), #e6a800);
  color: #1a1204;
  box-shadow: 0 6px 30px rgba(255, 193, 7, 0.25);
}
.btn-ouro:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 44px rgba(255, 193, 7, 0.45);
}
.btn-vidro {
  border: 1px solid rgba(245, 234, 211, 0.3);
  color: var(--osso);
  background: rgba(245, 234, 211, 0.04);
  backdrop-filter: blur(6px);
}
.btn-vidro:hover { border-color: var(--ouro); color: var(--ouro); }
.btn-nav { padding: 10px 22px; font-size: 0.82rem; }
.btn-grande { padding: 20px 48px; font-size: 1.05rem; }

/* ── HERO ──────────────────────────────────────────────── */
main { position: relative; z-index: 10; }
.hero {
  position: relative;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  overflow: hidden;
}
.hero-fundo {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: right center;
  pointer-events: none;
  user-select: none;
}
.hero-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    radial-gradient(ellipse 58% 58% at 36% 40%, rgba(255, 252, 246, 0.62) 0%, rgba(255, 252, 246, 0.22) 42%, transparent 70%),
    linear-gradient(90deg, rgba(253, 248, 240, 0.42) 0%, rgba(253, 248, 240, 0.12) 38%, transparent 62%);
}
.hero-fumaca {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  overflow: hidden;
  contain: paint;
}
.hero-fumaca-wisp {
  position: absolute;
  bottom: -8%;
  width: min(42vw, 380px);
  height: min(70vh, 620px);
  opacity: 0.55;
  will-change: transform, opacity;
  transform: translateZ(0);
  animation: hero-fumaca-sobe 18s ease-in-out infinite;
}
.hero-fumaca-glow {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 50% 50% 40% 40%;
  background: radial-gradient(ellipse at 50% 80%,
    rgba(160, 160, 165, 0.42) 0%,
    rgba(175, 175, 180, 0.22) 22%,
    rgba(190, 190, 195, 0.1) 42%,
    transparent 70%);
  filter: none;
  mix-blend-mode: multiply;
  transform: translateZ(0) scale(1.2);
  contain: paint;
}
.hero-fumaca-wisp-a {
  left: 8%;
  animation-duration: 16s;
  animation-delay: 0s;
}
.hero-fumaca-wisp-b {
  left: 28%;
  width: min(36vw, 300px);
  opacity: 0.4;
  animation-duration: 22s;
  animation-delay: -6s;
}
.hero-fumaca-wisp-c {
  left: 48%;
  width: min(48vw, 420px);
  opacity: 0.35;
  animation-duration: 26s;
  animation-delay: -11s;
}
@keyframes hero-fumaca-sobe {
  0% {
    transform: translate3d(0, 12%, 0) scale(0.92) rotate(-2deg);
    opacity: 0.15;
  }
  35% {
    opacity: 0.55;
  }
  70% {
    opacity: 0.38;
  }
  100% {
    transform: translate3d(4vw, -58%, 0) scale(1.35) rotate(3deg);
    opacity: 0;
  }
}
.ponto-riscado-wrap {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: grid;
  place-items: center;
  pointer-events: none;
}
#ponto-riscado {
  width: min(88vmin, 680px);
  height: min(88vmin, 680px);
  opacity: 0.12;
}
.pr-traco {
  stroke: var(--ouro);
  stroke-width: 1.6;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: drop-shadow(0 0 6px rgba(255, 193, 7, 0.35));
}
.pr-fino { stroke-width: 1; opacity: 0.75; }
.pr-estrela { transform-origin: 300px 300px; animation: girar-lento 90s linear infinite; }

.hero-conteudo { position: relative; z-index: 4; padding: 0 22px; max-width: 900px; }
.hero-saudacao span {
  display: inline-block;
  font-size: 0.8rem;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--ouro-escuro);
  opacity: 0.9;
}
.hero-titulo {
  font-family: var(--fonte-corpo);
  font-weight: 400;
  font-size: clamp(3.6rem, 12vw, 8.5rem);
  line-height: 1;
  letter-spacing: -0.02em;
  margin: 26px 0 30px;
  color: var(--osso);
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.35), 0 8px 40px rgba(253, 248, 240, 0.55);
}
.hero-titulo .letra {
  display: inline-block;
  will-change: opacity, transform;
  backface-visibility: hidden;
}
.letra-nuvem { color: var(--ouro); }
.hero-sub {
  font-family: var(--fonte-display);
  font-style: italic;
  font-weight: 300;
  font-size: clamp(1.2rem, 3vw, 1.7rem);
  color: var(--osso);
}
.hero-sub2 {
  margin: 16px auto 0;
  max-width: 560px;
  font-weight: 300;
  font-size: 1rem;
  line-height: 1.7;
  color: var(--osso-fraco);
}
.hero-ctas {
  margin-top: 44px;
  display: flex;
  gap: 18px;
  justify-content: center;
  flex-wrap: wrap;
}
.reveal-linha { overflow: hidden; }
.reveal-linha > span { display: inline-block; }

.hero-scroll-dica {
  position: absolute;
  bottom: 34px;
  left: 50%;
  z-index: 4;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}
.dica-texto {
  font-size: 0.68rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--osso-fraco);
}
.dica-batida {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--ouro);
  animation: batida-coracao 1.15s ease-in-out infinite;
}
@keyframes batida-coracao {
  0%, 100% { transform: scale(1); opacity: 0.5; }
  18% { transform: scale(1.6); opacity: 1; }
  36% { transform: scale(1.1); opacity: 0.7; }
  50% { transform: scale(1.45); opacity: 1; }
}

/* ── Seções gerais ─────────────────────────────────────── */
section { position: relative; padding: 15vh 8vw; }
.selo-secao {
  display: block;
  font-size: 0.74rem;
  letter-spacing: 0.36em;
  text-transform: uppercase;
  color: var(--ouro);
  margin-bottom: 18px;
}
.titulo-secao {
  font-family: var(--fonte-display);
  font-weight: 300;
  font-size: clamp(1.45rem, 3.4vw, 2.85rem);
  line-height: 1.2;
  max-width: none;
  white-space: nowrap;
}
.titulo-secao em {
  font-style: italic;
  color: var(--ouro);
}
@media (max-width: 720px) {
  /* No mobile, reduz e permite quebra só se realmente não couber */
  .titulo-secao {
    white-space: normal;
    font-size: clamp(1.55rem, 6.5vw, 2.2rem);
    max-width: 100%;
  }
}
.sub-secao {
  margin-top: 18px;
  max-width: 520px;
  color: var(--osso-fraco);
  font-weight: 300;
  line-height: 1.7;
}

/* ── Fundamento ────────────────────────────────────────── */
.fundamento { text-align: center; padding: 24vh 8vw; }
.fundamento-linhas .linha-grande {
  font-family: var(--fonte-display);
  font-weight: 300;
  font-size: clamp(1.8rem, 5vw, 3.6rem);
  line-height: 1.35;
  color: rgba(245, 234, 211, 0.35);
}
.linha-grande em { font-style: italic; color: var(--ouro); opacity: 0.9; }
.fundamento-nota {
  margin: 60px auto 0;
  max-width: 480px;
  color: var(--osso-fraco);
  font-weight: 300;
  font-size: 0.95rem;
  line-height: 1.8;
}

/* ── Congá dos módulos (lista + painel) ─────────────────── */
.gira-cabecalho { margin-bottom: 50px; }
.conga-modulos {
  display: grid;
  grid-template-columns: minmax(240px, 340px) 1fr;
  gap: 28px;
  align-items: stretch;
  max-width: 1100px;
}
.conga-lista {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
  max-height: 520px;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: rgba(255, 193, 7, 0.35) transparent;
}
.conga-lista button {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 16px;
  border: 1px solid transparent;
  border-radius: 12px;
  background: transparent;
  color: var(--osso-fraco);
  font-family: var(--fonte-corpo);
  font-size: 0.95rem;
  font-weight: 400;
  text-align: left;
  cursor: pointer;
  transition: background 0.3s, color 0.3s, border-color 0.3s;
}
.conga-lista button:hover { color: var(--osso); background: rgba(255, 193, 7, 0.05); }
.conga-lista button.ativo {
  color: var(--osso);
  border-color: rgba(255, 193, 7, 0.4);
  background: rgba(255, 193, 7, 0.08);
}
.conga-lista .n {
  font-family: var(--fonte-display);
  font-size: 0.8rem;
  color: var(--ouro);
  min-width: 1.6em;
  opacity: 0.75;
}
.conga-lista button.ativo .n { opacity: 1; }

.conga-painel {
  position: relative;
  min-height: 420px;
  padding: 48px 44px;
  border-radius: 24px;
  border: 1px solid rgba(255, 193, 7, 0.22);
  background:
    radial-gradient(100% 80% at 80% 0%, rgba(255, 193, 7, 0.1), transparent 55%),
    linear-gradient(165deg, #18120a, #0d0a06);
  display: flex;
  flex-direction: column;
  justify-content: center;
  overflow: hidden;
}
.conga-num {
  position: absolute;
  top: 20px;
  right: 28px;
  font-family: var(--fonte-display);
  font-weight: 300;
  font-size: clamp(4rem, 10vw, 7rem);
  line-height: 1;
  color: rgba(255, 193, 7, 0.1);
  pointer-events: none;
}
.conga-simbolo {
  width: 72px;
  height: 72px;
  color: var(--ouro);
  margin-bottom: 28px;
  filter: drop-shadow(0 0 18px rgba(255, 193, 7, 0.35));
}
.conga-simbolo svg { width: 100%; height: 100%; }
.conga-painel h3 {
  font-family: var(--fonte-display);
  font-weight: 300;
  font-size: clamp(1.8rem, 3.5vw, 2.6rem);
  line-height: 1.15;
  margin-bottom: 16px;
  max-width: 16ch;
}
.conga-painel p {
  color: var(--osso-fraco);
  font-weight: 300;
  font-size: 1.05rem;
  line-height: 1.7;
  max-width: 38ch;
}
.conga-tag {
  align-self: flex-start;
  margin-top: 28px;
  font-size: 0.68rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--ouro);
  border: 1px solid rgba(255, 193, 7, 0.35);
  padding: 7px 14px;
  border-radius: 999px;
}
.conga-nav {
  position: absolute;
  bottom: 28px;
  right: 28px;
  display: flex;
  gap: 8px;
}
.conga-nav button {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  border: 1px solid rgba(245, 234, 211, 0.25);
  background: transparent;
  color: var(--osso);
  font-size: 1.1rem;
  cursor: pointer;
  transition: border-color 0.3s, color 0.3s, background 0.3s;
}
.conga-nav button:hover {
  border-color: var(--ouro);
  color: var(--ouro);
  background: rgba(255, 193, 7, 0.08);
}
.conga-painel.trocando .conga-simbolo,
.conga-painel.trocando h3,
.conga-painel.trocando p,
.conga-painel.trocando .conga-tag {
  animation: conga-entra 0.45s cubic-bezier(0.22, 1, 0.36, 1) both;
}
@keyframes conga-entra {
  from { opacity: 0; transform: translateY(16px); }
  to { opacity: 1; transform: none; }
}

@media (max-width: 860px) {
  .conga-modulos { grid-template-columns: 1fr; }
  .conga-lista {
    flex-direction: row;
    flex-wrap: nowrap;
    overflow-x: auto;
    max-height: none;
    gap: 8px;
    padding-bottom: 6px;
  }
  .conga-lista button {
    flex: 0 0 auto;
    white-space: nowrap;
    padding: 12px 16px;
    border: 1px solid rgba(245, 234, 211, 0.12);
  }
  .conga-painel { min-height: 360px; padding: 36px 28px 70px; }
}

/* ── Axé Vivo ──────────────────────────────────────────── */
.axe-vivo { text-align: center; }
.axe-vivo .titulo-secao { margin: 0 auto; }
.vivo-grade {
  margin-top: 70px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 20px;
  max-width: 1050px;
  margin-left: auto;
  margin-right: auto;
}
.vivo-item {
  padding: 44px 20px;
  border-radius: 20px;
  border: 1px solid rgba(245, 234, 211, 0.09);
  background: rgba(255, 193, 7, 0.025);
}
.vivo-numero {
  display: block;
  font-family: var(--fonte-display);
  font-weight: 300;
  font-size: clamp(2.6rem, 6vw, 4rem);
  color: var(--ouro);
  text-shadow: 0 0 34px rgba(255, 193, 7, 0.3);
}
.vivo-numero small { font-size: 0.45em; color: var(--osso-fraco); }
.vivo-rotulo {
  display: block;
  margin-top: 10px;
  font-size: 0.85rem;
  font-weight: 300;
  color: var(--osso-fraco);
}
.vivo-fonte {
  margin-top: 34px;
  font-size: 0.72rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(245, 234, 211, 0.35);
}

/* ── Casas ─────────────────────────────────────────────── */
.casas-grade {
  margin-top: 60px;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
  gap: 22px;
}
.casa-carta {
  position: relative;
  border-radius: 20px;
  overflow: hidden;
  border: 1px solid rgba(245, 234, 211, 0.1);
  background: linear-gradient(180deg, #14100a, #0c0906);
  min-height: 230px;
  padding: 28px 26px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  color: var(--osso);
  text-decoration: none;
  transition: border-color 0.4s, transform 0.4s;
}
.casa-carta:visited { color: var(--osso); }
.casa-carta:hover { border-color: rgba(255, 193, 7, 0.5); transform: translateY(-5px); }
.casa-foto {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  opacity: 0.34;
  transition: opacity 0.5s, transform 0.9s ease;
}
.casa-carta:hover .casa-foto { opacity: 0.5; transform: scale(1.06); }
.casa-veu {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(10, 8, 5, 0.1) 20%, rgba(10, 8, 5, 0.92));
}
.casa-info { position: relative; }
.casa-tradicao {
  display: inline-block;
  font-size: 0.62rem;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--ouro);
  border: 1px solid rgba(255, 193, 7, 0.4);
  border-radius: 999px;
  padding: 4px 11px;
  margin-bottom: 12px;
}
.casa-nome {
  font-family: var(--fonte-display);
  font-weight: 400;
  font-size: 1.25rem;
  line-height: 1.25;
}
.casa-cidade {
  margin-top: 7px;
  font-size: 0.82rem;
  font-weight: 300;
  color: var(--osso-fraco);
}

/* ── Eventos ───────────────────────────────────────────── */
.eventos-lista { margin-top: 60px; display: flex; flex-direction: column; }
.evento-linha {
  display: grid;
  grid-template-columns: 110px 1fr auto;
  gap: 26px;
  align-items: center;
  padding: 30px 10px;
  border-bottom: 1px solid rgba(245, 234, 211, 0.09);
  text-decoration: none;
  color: inherit;
  transition: background 0.35s, padding-left 0.35s;
}
.evento-linha:first-child { border-top: 1px solid rgba(245, 234, 211, 0.09); }
.evento-linha:hover { background: rgba(255, 193, 7, 0.04); padding-left: 22px; }
.evento-data {
  text-align: center;
  font-family: var(--fonte-display);
  line-height: 1;
}
.evento-dia { display: block; font-size: 2.3rem; font-weight: 300; color: var(--ouro); }
.evento-mes {
  display: block;
  margin-top: 6px;
  font-size: 0.72rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--osso-fraco);
}
.evento-nome { font-family: var(--fonte-display); font-weight: 400; font-size: 1.3rem; }
.evento-casa { margin-top: 6px; font-size: 0.85rem; font-weight: 300; color: var(--osso-fraco); }
.evento-tipo {
  font-size: 0.66rem;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--ouro);
  white-space: nowrap;
}
@media (max-width: 640px) {
  .evento-linha { grid-template-columns: 76px 1fr; }
  .evento-tipo { display: none; }
}

/* ── Vozes ─────────────────────────────────────────────── */
.vozes { overflow: hidden; }
.vozes-trilho {
  margin-top: 60px;
  display: flex;
  gap: 24px;
  width: max-content;
  will-change: transform;
}
.vozes-trilho.vazio { width: 100%; transform: none !important; will-change: auto; }
.voz-carta {
  width: 380px;
  padding: 36px 32px;
  border-radius: 20px;
  border: 1px solid rgba(245, 234, 211, 0.1);
  background: linear-gradient(180deg, #14100a, #0d0a06);
}
.voz-texto {
  font-family: var(--fonte-display);
  font-style: italic;
  font-weight: 300;
  font-size: 1.08rem;
  line-height: 1.7;
  color: var(--osso);
}
.voz-texto::before { content: "“"; color: var(--ouro); font-size: 1.6em; }
.voz-autor { margin-top: 22px; font-size: 0.85rem; color: var(--ouro); }
.voz-casa { font-size: 0.78rem; font-weight: 300; color: var(--osso-fraco); margin-top: 3px; }

/* ── Planos / a oferenda ───────────────────────────────── */
.planos { text-align: center; overflow: hidden; }
.planos .titulo-secao, .planos .sub-secao { margin-left: auto; margin-right: auto; }

.oferta {
  position: relative;
  margin-top: 60px;
  max-width: 1100px;
  margin-left: auto;
  margin-right: auto;
}
.oferta-palco {
  position: relative;
  display: grid;
  grid-template-columns: minmax(300px, 0.82fr) minmax(520px, 1.18fr);
  gap: 0;
  border-radius: 32px;
  overflow: hidden;
  border: 1px solid rgba(255, 193, 7, 0.28);
  background: linear-gradient(135deg, #17110a 0%, #0c0906 55%, #14100a 100%);
  box-shadow: 0 30px 90px rgba(0, 0, 0, 0.45), 0 0 80px rgba(255, 193, 7, 0.08);
  text-align: left;
}
.oferta-palco::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(70% 80% at 85% 20%, rgba(255, 193, 7, 0.16), transparent 55%),
    radial-gradient(50% 60% at 10% 90%, rgba(180, 83, 9, 0.12), transparent 60%);
  pointer-events: none;
}

.oferta-copy {
  position: relative;
  z-index: 1;
  padding: 52px 48px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  border-right: 1px solid rgba(255, 193, 7, 0.12);
}
.oferta-selo {
  align-self: flex-start;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: #1a1204;
  background: linear-gradient(135deg, var(--ouro), #e6a800);
  padding: 8px 16px;
  border-radius: 999px;
  margin-bottom: 22px;
}
.oferta-copy h3 {
  font-family: var(--fonte-display);
  font-weight: 300;
  font-size: clamp(2rem, 4vw, 2.8rem);
  line-height: 1.15;
  margin-bottom: 16px;
}
.oferta-copy h3 em { font-style: italic; color: var(--ouro); }
.oferta-copy > p {
  color: var(--osso-fraco);
  font-weight: 300;
  font-size: 1rem;
  line-height: 1.7;
  max-width: 36ch;
}
.oferta-pilares {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-top: 34px;
}
.oferta-pilar {
  padding: 16px 18px;
  border-radius: 14px;
  border: 1px solid rgba(245, 234, 211, 0.1);
  background: rgba(255, 193, 7, 0.04);
}
.oferta-pilar strong {
  display: block;
  font-size: 0.72rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ouro);
  margin-bottom: 6px;
}
.oferta-pilar span {
  font-size: 0.86rem;
  font-weight: 300;
  color: var(--osso-fraco);
  line-height: 1.45;
}

.oferta-preco-lado {
  position: relative;
  z-index: 1;
  padding: 40px 34px 34px;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: center;
  text-align: left;
}
.oferta-planos-cabecalho {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 18px;
}
.oferta-planos-cabecalho span {
  color: var(--ouro);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}
.oferta-planos-cabecalho strong {
  color: var(--osso-fraco);
  font-size: 0.72rem;
  font-weight: 400;
}
.oferta-planos-opcoes {
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
  gap: 14px;
  align-items: stretch;
}
.oferta-plano-card {
  position: relative;
  display: flex;
  min-width: 0;
  flex-direction: column;
  padding: 24px 20px 20px;
  border: 1px solid rgba(245, 234, 211, 0.14);
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.035);
}
.oferta-plano-anual {
  overflow: hidden;
  border-color: rgba(255, 193, 7, 0.62);
  background:
    radial-gradient(95% 70% at 100% 0%, rgba(255, 193, 7, 0.22), transparent 62%),
    linear-gradient(155deg, rgba(255, 193, 7, 0.12), rgba(255, 193, 7, 0.035));
  box-shadow: 0 18px 45px rgba(0, 0, 0, 0.25), inset 0 0 0 1px rgba(255, 193, 7, 0.08);
  transform: translateY(-5px);
}
.oferta-plano-destaque {
  position: absolute;
  right: -42px;
  top: 18px;
  width: 150px;
  padding: 7px 0;
  transform: rotate(42deg);
  background: var(--ouro);
  color: #1a1204;
  text-align: center;
  font-size: 0.57rem;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.oferta-plano-topo {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  min-height: 61px;
}
.oferta-plano-kicker {
  color: var(--ouro);
  font-size: 0.64rem;
  font-weight: 900;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}
.oferta-plano-topo h4 {
  max-width: 14ch;
  margin-top: 5px;
  color: var(--osso);
  font-family: var(--fonte-display);
  font-size: 1.08rem;
  font-weight: 500;
  line-height: 1.15;
}
.oferta-plano-icone {
  display: grid;
  width: 36px;
  height: 36px;
  flex: 0 0 auto;
  place-items: center;
  border: 1px solid rgba(255, 193, 7, 0.28);
  border-radius: 50%;
  color: var(--ouro);
  font-family: var(--fonte-display);
  font-size: 0.84rem;
}
.oferta-plano-preco {
  display: flex;
  align-items: flex-end;
  gap: 4px;
  margin-top: 22px;
  color: var(--ouro);
  white-space: nowrap;
}
.oferta-plano-preco > span {
  align-self: flex-start;
  margin-top: 8px;
  color: var(--osso-fraco);
  font-size: 0.78rem;
}
.oferta-plano-preco strong {
  font-family: var(--fonte-display);
  font-size: clamp(2.15rem, 3.5vw, 3rem);
  font-weight: 400;
  line-height: 0.95;
}
.oferta-plano-preco small {
  padding-bottom: 3px;
  color: var(--osso-fraco);
  font-size: 0.72rem;
}
.oferta-plano-descricao,
.oferta-plano-equivalente {
  min-height: 34px;
  margin-top: 10px;
  color: var(--osso-fraco);
  font-size: 0.72rem;
  line-height: 1.45;
}
.oferta-plano-equivalente strong { color: var(--osso); font-weight: 700; }
.oferta-economia {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin: 12px 0 16px;
  padding: 10px 12px;
  border: 1px solid rgba(255, 193, 7, 0.22);
  border-radius: 12px;
  background: rgba(255, 193, 7, 0.09);
}
.oferta-economia span {
  color: var(--osso);
  font-size: 0.7rem;
}
.oferta-economia strong {
  color: var(--ouro);
  font-size: 0.66rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.oferta-plano-card .oferta-cta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  width: 100%;
  margin-top: auto;
  padding: 13px 16px;
  font-size: 0.76rem;
}
.oferta-cta-secundario {
  border: 1px solid rgba(255, 193, 7, 0.32);
  background: transparent;
  color: var(--ouro);
  box-shadow: none;
}
.oferta-cta-secundario:hover {
  background: rgba(255, 193, 7, 0.08);
  box-shadow: none;
}
.oferta-garantias {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px 18px;
  margin-top: 18px;
  color: var(--osso-fraco);
  font-size: 0.65rem;
}
.oferta-anel {
  position: relative;
  width: min(280px, 70vw);
  height: min(280px, 70vw);
  display: grid;
  place-items: center;
  margin-bottom: 28px;
}
.oferta-anel::before,
.oferta-anel::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  border: 1px solid rgba(255, 193, 7, 0.35);
  animation: anel-pulsa 3.6s ease-in-out infinite;
}
.oferta-anel::after {
  inset: 18px;
  border-color: rgba(255, 193, 7, 0.18);
  animation-delay: 0.6s;
}
@keyframes anel-pulsa {
  0%, 100% { transform: scale(1); opacity: 0.7; }
  50% { transform: scale(1.04); opacity: 1; }
}
.oferta-preco-bloco { position: relative; z-index: 1; }
.oferta-nome {
  font-size: 0.74rem;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--ouro);
  margin-bottom: 8px;
}
.oferta-preco {
  font-family: var(--fonte-display);
  font-weight: 300;
  line-height: 1;
  color: var(--osso);
}
.oferta-moeda { font-size: 1.2rem; color: var(--osso-fraco); vertical-align: top; }
.oferta-valor {
  font-size: clamp(3.6rem, 8vw, 5rem);
  color: var(--ouro);
  text-shadow: 0 0 40px rgba(255, 193, 7, 0.35);
}
.oferta-ciclo { display: block; margin-top: 8px; font-size: 0.9rem; color: var(--osso-fraco); letter-spacing: 0.08em; }

.oferta-gb {
  position: absolute;
  right: -6px;
  top: 18px;
  width: 96px;
  height: 96px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: linear-gradient(145deg, #ffc107, #e6a800);
  color: #1a1204;
  box-shadow: 0 10px 36px rgba(255, 193, 7, 0.45);
  animation: gb-flutua 3.2s ease-in-out infinite alternate;
  z-index: 2;
}
@keyframes gb-flutua {
  from { transform: translateY(0) rotate(-4deg); }
  to { transform: translateY(-10px) rotate(4deg); }
}
.oferta-gb strong {
  font-family: var(--fonte-display);
  font-weight: 400;
  font-size: 1.55rem;
  line-height: 1;
}
.oferta-gb strong small { font-size: 0.48em; }
.oferta-gb span {
  display: block;
  margin-top: 2px;
  font-size: 0.52rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.oferta-gb-legenda {
  font-size: 0.82rem;
  font-weight: 300;
  color: var(--osso-fraco);
  max-width: 26ch;
  line-height: 1.55;
  margin-bottom: 26px;
}
.oferta-gb-legenda strong { color: var(--ouro); font-weight: 600; }

.oferta-cta {
  display: inline-block;
  padding: 16px 36px;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--ouro), #e6a800);
  color: #1a1204;
  font-weight: 700;
  text-decoration: none;
  box-shadow: 0 10px 40px rgba(255, 193, 7, 0.35);
  transition: transform 0.35s, box-shadow 0.35s;
}
.oferta-cta:hover {
  transform: translateY(-3px);
  box-shadow: 0 16px 50px rgba(255, 193, 7, 0.5);
}
.oferta-nota {
  margin-top: 14px;
  font-size: 0.72rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(245, 234, 211, 0.4);
}

.oferta-beneficios {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  margin-top: 28px;
}
.oferta-beneficios span {
  padding: 10px 16px;
  border-radius: 999px;
  border: 1px solid rgba(255, 193, 7, 0.22);
  background: rgba(255, 193, 7, 0.05);
  font-size: 0.78rem;
  color: var(--osso-fraco);
  letter-spacing: 0.04em;
}
.oferta-beneficios span::before {
  content: "✦ ";
  color: var(--ouro);
}

@media (max-width: 860px) {
  .oferta-palco { grid-template-columns: 1fr; }
  .oferta-copy { border-right: none; border-bottom: 1px solid rgba(255, 193, 7, 0.12); padding: 36px 28px; }
  .oferta-preco-lado { padding: 40px 24px 36px; }
  .oferta-planos-opcoes { grid-template-columns: 1fr 1.08fr; }
  .oferta-gb { right: 8px; top: 8px; width: 84px; height: 84px; }
  .oferta-gb strong { font-size: 1.3rem; }
  .oferta-pilares { grid-template-columns: 1fr; }
}
@media (max-width: 620px) {
  .oferta-planos-cabecalho { align-items: flex-start; flex-direction: column; gap: 5px; }
  .oferta-planos-opcoes { grid-template-columns: 1fr; }
  .oferta-plano-anual { transform: none; }
  .oferta-plano-card { padding: 24px 22px 22px; }
  .oferta-plano-topo h4 { max-width: none; }
}

/* ── Quem está por trás ────────────────────────────────── */
.quem-somos {
  position: relative;
  max-width: 1180px;
  margin: 0 auto;
  padding-top: 6vh;
  padding-bottom: 6vh;
}
.quem-grade {
  display: grid;
  grid-template-columns: 0.95fr 1.05fr;
  gap: 22px;
  align-items: stretch;
}
.quem-historia {
  border-radius: 28px;
  padding: clamp(28px, 4vw, 44px);
  background:
    radial-gradient(90% 70% at 10% 0%, rgba(255, 193, 7, 0.16), transparent 55%),
    linear-gradient(165deg, #1a140c, #0c0906 70%);
  border: 1px solid rgba(255, 193, 7, 0.22);
  color: #f5ead3;
  box-shadow: 0 24px 50px rgba(0, 0, 0, 0.28);
}
.quem-selo {
  display: inline-block;
  background: var(--ouro);
  color: #1a1204;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  padding: 8px 14px;
  border-radius: 999px;
  margin-bottom: 22px;
}
.quem-historia .titulo-secao {
  color: #fff;
  font-size: clamp(1.45rem, 2.8vw, 2.35rem);
  white-space: normal;
  max-width: 18ch;
  line-height: 1.2;
}
.quem-historia .titulo-secao em { color: var(--ouro); }
.quem-historia > p {
  margin-top: 18px;
  color: rgba(245, 234, 211, 0.68);
  font-weight: 300;
  line-height: 1.75;
  font-size: 0.98rem;
}
.quem-pilares {
  list-style: none;
  margin: 28px 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.quem-pilares li {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  font-size: 0.92rem;
  color: rgba(245, 234, 211, 0.82);
  line-height: 1.45;
}
.quem-ico {
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: rgba(255, 193, 7, 0.15);
  color: var(--ouro);
  font-size: 0.85rem;
}
.quem-casas {
  border-radius: 28px;
  padding: clamp(28px, 4vw, 40px);
  border: 1px solid rgba(245, 234, 211, 0.14);
  background: rgba(255, 193, 7, 0.04);
  display: flex;
  flex-direction: column;
}
.quem-casas-topo {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 22px;
}
.quem-casas-topo .selo-secao { margin-bottom: 8px; }
.quem-casas-topo h3 {
  font-family: var(--fonte-display);
  font-weight: 300;
  font-size: clamp(1.5rem, 3vw, 2rem);
  color: var(--osso);
  line-height: 1.2;
}
.quem-casas-topo h3 em { font-style: italic; color: var(--ouro); }
.quem-link {
  color: var(--ouro);
  text-decoration: none;
  font-size: 0.88rem;
  font-weight: 600;
  white-space: nowrap;
}
.quem-link:hover { text-decoration: underline; }
.quem-casas-lista {
  display: flex;
  flex-direction: column;
  gap: 10px;
  flex: 1;
}
.quem-casa {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 16px 18px;
  border-radius: 16px;
  border: 1px solid rgba(245, 234, 211, 0.12);
  background: rgba(255, 255, 255, 0.03);
  text-decoration: none;
  color: inherit;
  transition: border-color 0.3s, transform 0.3s;
}
.quem-casa:hover {
  border-color: rgba(255, 193, 7, 0.4);
  transform: translateY(-2px);
}
.quem-casa-ico {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: rgba(255, 193, 7, 0.16);
  color: var(--ouro);
  flex-shrink: 0;
}
.quem-casa strong {
  display: block;
  font-size: 0.95rem;
  color: var(--osso);
  line-height: 1.3;
}
.quem-casa small {
  display: block;
  margin-top: 4px;
  font-size: 0.78rem;
  color: var(--osso-fraco);
}
.quem-nota {
  margin-top: 16px;
  font-size: 0.72rem;
  color: var(--osso-fraco);
  line-height: 1.55;
}
.quem-atalhos {
  margin-top: 18px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.quem-atalhos a {
  padding: 9px 14px;
  border-radius: 999px;
  border: 1px solid rgba(255, 193, 7, 0.28);
  background: rgba(255, 193, 7, 0.05);
  color: var(--osso);
  text-decoration: none;
  font-size: 0.78rem;
  font-weight: 500;
  transition: border-color 0.3s, background 0.3s;
}
.quem-atalhos a:hover {
  border-color: var(--ouro);
  background: rgba(255, 193, 7, 0.12);
}
@media (max-width: 900px) {
  .quem-grade { grid-template-columns: 1fr; }
}

/* ── Memória da casa (mural) ───────────────────────────── */
.memoria {
  position: relative;
  max-width: 1180px;
  margin: 0 auto;
  padding-top: 8vh;
  padding-bottom: 8vh;
}
.memoria-cabeca {
  max-width: 720px;
  margin-bottom: 40px;
}
.memoria .titulo-secao {
  font-size: clamp(1.4rem, 3vw, 2.55rem);
}
.memoria-mural {
  display: grid;
  grid-template-columns: 1.45fr 1fr 1fr;
  grid-template-rows: 1fr;
  gap: 14px;
  min-height: 420px;
}
.memoria-foto {
  position: relative;
  margin: 0;
  border-radius: 22px;
  overflow: hidden;
  border: 1px solid rgba(245, 234, 211, 0.16);
  min-height: 420px;
  isolation: isolate;
}
.memoria-foto.tema-conga {
  background:
    radial-gradient(70% 60% at 50% 70%, rgba(255, 170, 40, 0.35), transparent 60%),
    linear-gradient(165deg, #2a1a08 0%, #120c06 55%, #0a0805 100%);
}
.memoria-foto.tema-toque {
  background:
    radial-gradient(80% 50% at 50% 30%, rgba(180, 83, 9, 0.28), transparent 55%),
    linear-gradient(180deg, #1c140c, #0c0906);
}
.memoria-foto.tema-oferenda {
  background:
    radial-gradient(70% 55% at 50% 45%, rgba(255, 193, 7, 0.22), transparent 58%),
    linear-gradient(160deg, #24180c, #0e0a06);
}
.memoria-cena {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  overflow: hidden;
}
.cena-brilho {
  position: absolute;
  width: 70%;
  height: 55%;
  bottom: 8%;
  left: 15%;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 193, 7, 0.22), transparent 70%);
  filter: blur(18px);
  animation: respirar-luz 5s ease-in-out infinite alternate;
}
.cena-velas {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: flex-end;
  gap: 18px;
  height: 58%;
  margin-bottom: 8%;
}
.cena-vela {
  position: relative;
  width: 14px;
  height: 72px;
  border-radius: 3px 3px 2px 2px;
  background: linear-gradient(180deg, #fff6df, #e8d4a4 70%, #c9b07a);
  box-shadow: 0 0 20px rgba(255, 193, 7, 0.15);
}
.cena-vela.alta { height: 96px; width: 16px; }
.cena-vela.media { height: 80px; }
.cena-vela i {
  position: absolute;
  left: 50%;
  bottom: 100%;
  width: 12px;
  height: 22px;
  margin: 0 0 2px -6px;
  border-radius: 50% 50% 50% 50% / 60% 60% 40% 40%;
  background: radial-gradient(ellipse at 50% 75%, #fff8e8 0%, #ffd35c 40%, #ff8c2b 72%, transparent 100%);
  filter: drop-shadow(0 0 10px rgba(255, 160, 40, 0.85));
  animation: tremular 0.9s ease-in-out infinite alternate;
  transform-origin: 50% 100%;
}
.cena-vela.alta i { animation-delay: 0.15s; }
.cena-vela.media i { animation-delay: 0.35s; }
.cena-ponto {
  position: absolute;
  top: 14%;
  right: 10%;
  width: 72px;
  height: 72px;
  color: rgba(255, 193, 7, 0.35);
  animation: girar-lento 50s linear infinite;
}
.cena-atabaque {
  position: relative;
  z-index: 1;
  width: 88px;
  height: auto;
  color: #e8c57a;
  filter: drop-shadow(0 12px 28px rgba(0, 0, 0, 0.45));
}
.cena-ondas {
  position: absolute;
  bottom: 22%;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 8px;
}
.cena-ondas i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  border: 1px solid rgba(255, 193, 7, 0.45);
  animation: onda-atabaque 1.4s ease-out infinite;
}
.cena-ondas i:nth-child(2) { animation-delay: 0.25s; }
.cena-ondas i:nth-child(3) { animation-delay: 0.5s; }
.cena-oferenda {
  position: relative;
  z-index: 1;
  width: 120px;
  height: auto;
  color: #ffc107;
  filter: drop-shadow(0 0 24px rgba(255, 193, 7, 0.25));
}
.memoria-foto::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 35%, rgba(8, 6, 3, 0.9) 100%);
  pointer-events: none;
  z-index: 2;
}
.memoria-foto figcaption {
  position: absolute;
  left: 18px;
  right: 18px;
  bottom: 18px;
  z-index: 3;
  color: #f5ead3;
}
.memoria-foto figcaption span {
  display: block;
  font-family: var(--fonte-display);
  font-size: 1.15rem;
  font-weight: 400;
}
.memoria-foto figcaption small {
  display: block;
  margin-top: 4px;
  font-size: 0.72rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(245, 234, 211, 0.65);
}
.memoria-foto-grande { min-height: 420px; }

.memoria-rodape {
  margin-top: 28px;
  display: grid;
  grid-template-columns: auto 1.2fr 1fr;
  gap: 28px;
  align-items: center;
  padding: 28px 32px;
  border-radius: 22px;
  border: 1px solid rgba(255, 193, 7, 0.28);
  background:
    radial-gradient(80% 120% at 0% 50%, rgba(255, 193, 7, 0.12), transparent 55%),
    linear-gradient(135deg, rgba(255, 255, 255, 0.04), rgba(255, 193, 7, 0.03));
}
.memoria-selo-gb {
  width: 96px;
  height: 96px;
  border-radius: 50%;
  display: grid;
  place-content: center;
  text-align: center;
  background: linear-gradient(145deg, #ffc107, #e6a800);
  color: #1a1204;
  box-shadow: 0 12px 36px rgba(255, 193, 7, 0.35);
  flex-shrink: 0;
}
.memoria-selo-gb strong {
  font-family: var(--fonte-display);
  font-size: 2rem;
  font-weight: 400;
  line-height: 1;
}
.memoria-selo-gb span {
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.14em;
}
.memoria-rodape-texto h3 {
  font-family: var(--fonte-display);
  font-weight: 400;
  font-size: 1.35rem;
  margin-bottom: 8px;
  color: var(--osso);
}
.memoria-rodape-texto p {
  color: var(--osso-fraco);
  font-weight: 300;
  line-height: 1.65;
  max-width: 36ch;
}
.memoria-pilares {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.memoria-pilares li {
  padding: 10px 14px;
  border-radius: 999px;
  border: 1px solid rgba(255, 193, 7, 0.28);
  background: rgba(255, 193, 7, 0.06);
  font-size: 0.85rem;
  color: var(--osso);
  white-space: nowrap;
}
.memoria-pilares li::before {
  content: "✦ ";
  color: var(--ouro);
}

@media (max-width: 960px) {
  .memoria-mural {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto;
    min-height: 0;
  }
  .memoria-foto-grande {
    grid-column: 1 / -1;
    min-height: 280px;
    aspect-ratio: 16 / 10;
  }
  .memoria-foto:not(.memoria-foto-grande) {
    min-height: 240px;
    aspect-ratio: 4 / 5;
  }
  .memoria-rodape {
    grid-template-columns: auto 1fr;
    gap: 20px;
  }
  .memoria-pilares { grid-column: 1 / -1; flex-direction: row; flex-wrap: wrap; }
}
@media (max-width: 560px) {
  .memoria-mural { grid-template-columns: 1fr; }
  .memoria-foto-grande { width: 100%; min-width: 0; min-height: 280px; aspect-ratio: auto; }
  .memoria-foto:not(.memoria-foto-grande) { aspect-ratio: 5 / 4; min-height: 220px; }
  .memoria-rodape { grid-template-columns: 1fr; justify-items: start; padding: 22px; }
  .memoria .titulo-secao { white-space: normal; }
}

/* ── FAQ ───────────────────────────────────────────────── */
.faq {
  position: relative;
  max-width: 920px;
  margin: 0 auto;
  padding-top: 10vh;
  padding-bottom: 10vh;
}
.faq::before {
  content: "";
  position: absolute;
  inset: 8% -8% auto;
  height: 55%;
  background:
    radial-gradient(ellipse 70% 55% at 50% 40%, rgba(255, 193, 7, 0.07), transparent 70%),
    radial-gradient(ellipse 40% 40% at 20% 70%, rgba(180, 60, 20, 0.06), transparent 70%);
  pointer-events: none;
  z-index: 0;
}
.faq-cabeca,
.faq-lista { position: relative; z-index: 1; }
.faq-cabeca { margin-bottom: 52px; }
.faq-lista { display: flex; flex-direction: column; gap: 10px; }
.faq-item {
  position: relative;
  border-radius: 16px;
  border: 1px solid rgba(245, 234, 211, 0.1);
  background:
    linear-gradient(135deg, rgba(255, 193, 7, 0.03), transparent 40%),
    linear-gradient(180deg, rgba(22, 17, 10, 0.96), rgba(10, 8, 5, 0.99));
  overflow: hidden;
  transition: border-color 0.4s, box-shadow 0.4s, transform 0.35s;
}
.faq-item::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  background: transparent;
  transition: background 0.35s, box-shadow 0.35s;
}
.faq-item:hover {
  border-color: rgba(255, 193, 7, 0.28);
  transform: translateY(-1px);
}
.faq-item.aberto {
  border-color: rgba(255, 193, 7, 0.42);
  box-shadow:
    0 16px 48px rgba(0, 0, 0, 0.35),
    0 0 0 1px rgba(255, 193, 7, 0.06) inset;
}
.faq-item.aberto::before {
  background: linear-gradient(180deg, var(--ouro), rgba(255, 193, 7, 0.2));
  box-shadow: 0 0 18px rgba(255, 193, 7, 0.45);
}
.faq-pergunta {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 22px 26px;
  background: none;
  border: none;
  color: var(--osso);
  font-family: var(--fonte-corpo);
  font-size: 1.05rem;
  font-weight: 500;
  text-align: left;
  cursor: pointer;
  transition: color 0.3s;
}
.faq-pergunta:hover { color: var(--ouro-claro); }
.faq-item.aberto .faq-pergunta { color: var(--ouro-claro); }
.faq-num {
  flex-shrink: 0;
  font-family: var(--fonte-display);
  font-size: 0.9rem;
  font-weight: 300;
  color: var(--ouro);
  letter-spacing: 0.1em;
  min-width: 2em;
  opacity: 0.85;
}
.faq-texto { flex: 1; line-height: 1.45; }
.faq-icone {
  flex-shrink: 0;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  border: 1px solid rgba(255, 193, 7, 0.35);
  display: grid;
  place-items: center;
  color: var(--ouro);
  font-size: 1.25rem;
  line-height: 1;
  transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1), background 0.3s, border-color 0.3s;
}
.faq-item.aberto .faq-icone {
  transform: rotate(45deg);
  background: rgba(255, 193, 7, 0.18);
  border-color: var(--ouro);
  box-shadow: 0 0 16px rgba(255, 193, 7, 0.25);
}
.faq-resposta {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}
.faq-resposta-inner {
  padding: 0 26px 26px calc(26px + 2em + 18px);
  color: var(--osso-fraco);
  font-weight: 300;
  font-size: 0.96rem;
  line-height: 1.8;
  border-top: 1px solid rgba(255, 193, 7, 0.12);
  margin: 0 26px;
  padding-top: 18px;
}
.faq-resposta-inner a {
  color: var(--ouro);
  text-decoration: none;
  border-bottom: 1px solid rgba(255, 193, 7, 0.35);
  transition: border-color 0.25s, color 0.25s;
}
.faq-resposta-inner a:hover {
  color: var(--ouro-claro);
  border-bottom-color: var(--ouro-claro);
}
@media (max-width: 640px) {
  .faq-pergunta { padding: 18px 18px; font-size: 0.95rem; gap: 12px; }
  .faq-resposta-inner { padding-left: 18px; margin: 0 18px; padding-right: 18px; }
  .faq-num { display: none; }
}

/* ── Segurança / rack ──────────────────────────────────── */
.seguranca {
  position: relative;
  max-width: 1180px;
  margin: 0 auto;
  padding: 10vh 24px 6vh;
}
.seguranca::before {
  content: "";
  position: absolute;
  inset: 10% 5% auto;
  height: 70%;
  background:
    radial-gradient(ellipse 50% 45% at 75% 45%, rgba(73, 230, 165, 0.06), transparent 70%),
    radial-gradient(ellipse 45% 40% at 20% 60%, rgba(255, 193, 7, 0.05), transparent 70%);
  pointer-events: none;
}
.seguranca-grade {
  position: relative;
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: clamp(40px, 6vw, 72px);
  align-items: center;
}
.seguranca-texto .titulo-secao { margin-bottom: 16px; }
.seguranca-texto .sub-secao { max-width: 34em; margin-bottom: 28px; }
.seg-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  margin-bottom: 28px;
}
.seg-stat {
  border-radius: 14px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(255, 255, 255, 0.04);
  padding: 14px 10px;
  text-align: center;
  backdrop-filter: blur(8px);
}
.seg-stat strong {
  display: block;
  font-family: var(--fonte-display);
  font-size: 1.35rem;
  font-weight: 500;
  line-height: 1.1;
}
.seg-stat span {
  display: block;
  margin-top: 6px;
  font-size: 0.62rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--osso-fraco);
}
.tom-verde { color: #49e6a5; }
.tom-ceu { color: #7ec8ff; }
.tom-ouro { color: var(--ouro); }
.tom-osso { color: var(--osso); }
.seg-pontos { display: flex; flex-direction: column; gap: 10px; }
.seg-ponto {
  display: flex;
  gap: 14px;
  padding: 14px 16px;
  border-radius: 16px;
  border: 1px solid rgba(255, 193, 7, 0.14);
  background: rgba(255, 255, 255, 0.035);
}
.seg-ponto-ico {
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  border: 1px solid rgba(255, 193, 7, 0.28);
  background: rgba(255, 193, 7, 0.08);
  color: var(--ouro);
  font-size: 0.95rem;
}
.seg-ponto h3 {
  margin: 0 0 4px;
  font-size: 0.92rem;
  font-weight: 600;
  color: var(--ouro);
}
.seg-ponto p {
  margin: 0;
  font-size: 0.88rem;
  font-weight: 300;
  line-height: 1.55;
  color: var(--osso-fraco);
}

/* Rack visual */
.seguranca-cena {
  position: relative;
  min-height: 560px;
  display: grid;
  place-items: center;
}
.rack-halo {
  position: absolute;
  width: min(480px, 90%);
  aspect-ratio: 1;
  border-radius: 50%;
  border: 1px solid rgba(255, 193, 7, 0.08);
  background: radial-gradient(circle, rgba(255, 193, 7, 0.07), rgba(73, 230, 165, 0.03) 42%, transparent 70%);
}
.rack-halo::before,
.rack-halo::after {
  content: "";
  position: absolute;
  inset: 12%;
  border: 1px dashed rgba(255, 255, 255, 0.06);
  border-radius: inherit;
  animation: rack-girar 42s linear infinite;
}
.rack-halo::after {
  inset: 28%;
  border-color: rgba(73, 230, 165, 0.08);
  animation-direction: reverse;
  animation-duration: 32s;
}
.rack {
  position: relative;
  z-index: 2;
  width: min(420px, calc(100% - 16px));
  padding: 14px 16px 14px;
  border: 1px solid #45464d;
  border-radius: 16px;
  background: linear-gradient(100deg, #090a0c 0 4%, #202127 4% 7%, #101115 7% 93%, #202127 93% 96%, #090a0c 96%);
  box-shadow:
    0 34px 58px rgba(0, 0, 0, 0.55),
    inset 0 1px rgba(255, 255, 255, 0.12),
    inset 0 0 0 3px #07080a;
}
.rack::before,
.rack::after {
  content: "";
  position: absolute;
  z-index: 3;
  top: 8px;
  bottom: 8px;
  width: 7px;
  border: 1px solid #303136;
  background: repeating-linear-gradient(to bottom, #1e1f24 0 11px, #090a0c 11px 20px);
}
.rack::before { left: 5px; }
.rack::after { right: 5px; }
.rack-topo {
  height: 56px;
  padding: 0 8px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border: 1px solid #2d2e34;
  border-radius: 7px 7px 3px 3px;
  background: linear-gradient(180deg, #1d1e23, #0b0c0f);
}
.rack-marca { display: flex; align-items: center; gap: 9px; }
.rack-marca img {
  width: 32px;
  height: 32px;
  border-radius: 8px;
  object-fit: cover;
  box-shadow: 0 0 18px rgba(255, 193, 7, 0.12);
}
.rack-marca strong {
  display: block;
  color: #e8e6e0;
  font-size: 10px;
  letter-spacing: 0.14em;
}
.rack-marca small {
  display: block;
  margin-top: 2px;
  color: #9a9ba0;
  font-size: 7px;
  letter-spacing: 0.13em;
}
.rack-online {
  display: flex;
  align-items: center;
  gap: 6px;
  color: #b5b8b9;
  font-size: 8px;
  font-weight: 700;
  letter-spacing: 0.1em;
}
.rack-online i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #49e6a5;
  box-shadow: 0 0 10px #49e6a5;
  animation: led-pulse 2.2s steps(1, end) infinite;
}
.rack-unidade {
  position: relative;
  height: 78px;
  margin-top: 7px;
  padding: 8px 10px 8px 16px;
  display: grid;
  grid-template-columns: 72px 1fr 64px 16px;
  gap: 8px;
  align-items: center;
  border: 1px solid #3c3d45;
  border-radius: 4px;
  background: linear-gradient(180deg, #1d1e23 0%, #111217 46%, #090a0d 100%);
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.1), 0 3px 8px rgba(0, 0, 0, 0.3);
}
.rack-parafuso {
  position: absolute;
  top: 8px;
  width: 5px;
  height: 5px;
  border: 1px solid #55565c;
  border-radius: 50%;
  background: #15161a;
  box-shadow: 0 54px #15161a, 0 54px 0 1px #55565c;
}
.rack-parafuso.esq { left: 5px; }
.rack-parafuso.dir { right: 5px; }
.rack-baias { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; }
.rack-baias i {
  position: relative;
  height: 24px;
  border: 1px solid #34353b;
  border-radius: 3px;
  background: linear-gradient(135deg, #202126, #0c0d10);
}
.rack-baias i::after {
  content: "";
  position: absolute;
  right: 4px;
  bottom: 4px;
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: #286f51;
  box-shadow: 0 0 5px rgba(73, 230, 165, 0.4);
  animation: led-pulse 2.4s steps(1, end) infinite;
}
.rack-baias i:nth-child(2)::after { animation-delay: -0.4s; }
.rack-baias i:nth-child(3)::after { animation-delay: -1.1s; }
.rack-baias i:nth-child(4)::after { animation-delay: -0.7s; }
.rack-vent {
  display: grid;
  grid-template-columns: repeat(4, 4px);
  justify-content: center;
  gap: 5px 6px;
}
.rack-vent i {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #050608;
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
}
.rack-tela {
  min-height: 48px;
  padding: 6px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  border: 1px solid #3a4545;
  border-radius: 4px;
  background: #050b0c;
  box-shadow: inset 0 0 8px rgba(73, 230, 165, 0.04);
}
.rack-tela small { color: #91999a; font-size: 8px; letter-spacing: 0.08em; }
.rack-tela strong {
  margin: 2px 0;
  color: #b9f8df;
  font-size: 11px;
  letter-spacing: 0.07em;
  text-shadow: 0 0 4px rgba(73, 230, 165, 0.15);
}
.rack-tela span { color: #78a69e; font-size: 8px; }
.rack-leds {
  height: 42px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
}
.led {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  opacity: 0.3;
  animation: led-pulse 1.9s steps(1, end) infinite;
}
.led.verde { background: #49e6a5; color: #49e6a5; }
.led.ambar { background: #ffb72c; color: #ffb72c; }
.led.d2 { animation-delay: -0.35s; animation-duration: 1.35s; }
.led.d3 { animation-delay: -0.8s; animation-duration: 2.45s; }
.led.d4 { animation-delay: -1.2s; animation-duration: 1.7s; }
.led.d5 { animation-delay: -0.55s; animation-duration: 2.8s; }
.led.d6 { animation-delay: -1.5s; animation-duration: 1.15s; }
.rack-metricas {
  min-height: 40px;
  margin-top: 7px;
  padding: 0 10px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  align-items: center;
  border: 1px solid #292a30;
  border-radius: 3px 3px 7px 7px;
  background: #090a0d;
}
.rack-metricas span { color: #8b8d92; font-size: 8px; letter-spacing: 0.08em; }
.rack-metricas strong { display: block; margin-top: 3px; color: #d0d2d1; font-size: 9px; }
.rack-metricas span:last-child strong { color: #49e6a5; }
.rack-chao {
  position: absolute;
  z-index: 1;
  bottom: 56px;
  width: 340px;
  height: 42px;
  border-radius: 50%;
  background: rgba(255, 193, 7, 0.06);
  filter: blur(16px);
  transform: rotateX(70deg);
}
.rack-chip {
  position: absolute;
  z-index: 4;
  padding: 9px 12px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 10px;
  background: rgba(17, 17, 21, 0.85);
  color: #c8c6cc;
  font-size: 10px;
  font-weight: 700;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.35);
  backdrop-filter: blur(12px);
}
.chip-a { left: 0; top: 18%; }
.chip-b { right: 0; top: 34%; }
.chip-c { right: 6%; bottom: 10%; }
.rack-nota {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  margin: 0;
  text-align: center;
  font-size: 0.7rem;
  color: rgba(253, 248, 240, 0.35);
  letter-spacing: 0.02em;
}
@keyframes led-pulse {
  0%, 100% { opacity: 0.22; box-shadow: none; }
  12%, 36% { opacity: 1; box-shadow: 0 0 9px currentColor, 0 0 2px #fff; }
  48%, 72% { opacity: 0.42; box-shadow: 0 0 3px currentColor; }
}
@keyframes rack-girar { to { transform: rotate(360deg); } }

@media (max-width: 960px) {
  .seguranca-grade { grid-template-columns: 1fr; gap: 48px; }
  .seguranca-cena { min-height: 520px; order: -1; }
  .seg-stats { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  .seguranca { padding-left: 16px; padding-right: 16px; }
  .rack { width: min(100%, 380px); }
  .rack-unidade { height: 70px; grid-template-columns: 60px 1fr 54px 14px; gap: 6px; padding-left: 14px; }
  .rack-parafuso { box-shadow: 0 46px #15161a, 0 46px 0 1px #55565c; }
  .chip-a { left: 0; top: 12%; font-size: 9px; }
  .chip-b { right: 0; top: 28%; font-size: 9px; }
  .chip-c { right: 2%; bottom: 8%; font-size: 9px; }
}

/* ── Chamado ───────────────────────────────────────────── */
.chamado {
  position: relative;
  min-height: 72vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  overflow: hidden;
  padding: 8vh 24px;
}
.chamado-ponto {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  pointer-events: none;
  opacity: 0.3;
}
.chamado-ponto svg { width: min(70vmin, 520px); animation: girar-lento 70s linear infinite; }
.chamado-titulo {
  position: relative;
  font-family: var(--fonte-display);
  font-weight: 300;
  font-size: clamp(4.4rem, 15vw, 11rem);
  line-height: 1;
  text-shadow: 0 0 80px rgba(255, 193, 7, 0.25);
}
.ponto-final { color: var(--ouro); }
.chamado-sub {
  position: relative;
  margin: 22px 0 44px;
  font-family: var(--fonte-display);
  font-style: italic;
  font-weight: 300;
  font-size: clamp(1.05rem, 2.6vw, 1.5rem);
  color: var(--osso-fraco);
}
.chamado-selos {
  position: relative;
  margin-top: 26px;
  font-size: 0.74rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(245, 234, 211, 0.4);
}

/* ── Rodapé ────────────────────────────────────────────── */
.rodape {
  position: relative;
  z-index: 10;
  text-align: center;
  padding: 60px 8vw 46px;
  border-top: 1px solid rgba(245, 234, 211, 0.08);
  font-weight: 300;
  font-size: 0.9rem;
  color: var(--osso-fraco);
}
.rodape-onda { color: rgba(255, 193, 7, 0.35); margin-bottom: 30px; }
.rodape-onda svg { width: min(420px, 70vw); height: 22px; }
.rodape strong { color: var(--osso); font-weight: 600; }
.rodape-nota { margin-top: 10px; font-size: 0.76rem; }
.rodape-links { margin-top: 14px; font-size: 0.82rem; line-height: 2; }
.rodape-links a { color: var(--osso-fraco); text-decoration: none; transition: color 0.3s; }
.rodape-links a:hover { color: var(--ouro); }
.rodape a { color: var(--ouro); text-decoration: none; }

/* ── Estados de carregamento ───────────────────────────── */
.carregando {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 60px 0;
  color: var(--osso-fraco);
  font-style: italic;
  font-family: var(--fonte-display);
}
.chama-mini {
  width: 9px;
  height: 15px;
  border-radius: 50% 50% 50% 50% / 62% 62% 38% 38%;
  background: radial-gradient(ellipse at 50% 78%, #fff9e8, #ff8c2b 75%);
  animation: tremular 0.8s ease-in-out infinite alternate;
}
.aviso-vazio {
  grid-column: 1 / -1;
  text-align: center;
  padding: 50px 20px;
  color: var(--osso-fraco);
  font-family: var(--fonte-display);
  font-style: italic;
  font-size: 1.05rem;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
  .hero-fumaca { display: none; }
}

/* Aba em segundo plano: congela deriva/fumaça/respiração (GPU descansa) */
html.aba-oculta .fumaca,
html.aba-oculta .clarao-fogueira,
html.aba-oculta .hero-fumaca-wisp,
html.aba-oculta .pr-estrela,
html.aba-oculta .chamado-ponto svg,
html.aba-oculta .luz-ambiente {
  animation-play-state: paused !important;
}

/* ═══════════════════════════════════════════════════════════
   AxéCloud — Home clara + dourado
   Override só da página principal (body.tema-claro).
   Internas e rodapé institucional preto não usam este arquivo.
   ═══════════════════════════════════════════════════════════ */

/* Fonte versionada para o build de produção. */
body.tema-claro {
  --noite: #faf8f4;
  --noite-2: #ffffff;
  --terra: #f3eee6;
  --ouro: #ffc107;
  --ouro-claro: #e6a800;
  --ouro-escuro: #b45309;
  --brasa: #d97706;
  --osso: #1b1813;
  --osso-fraco: rgba(27, 24, 19, 0.58);
  --verde-folha: #4a7c59;

  background:
    radial-gradient(120% 80% at 50% -10%, rgba(255, 193, 7, 0.14), transparent 55%),
    radial-gradient(80% 50% at 100% 40%, rgba(255, 193, 7, 0.06), transparent 50%),
    var(--noite);
  color: var(--osso);
  cursor: auto;
}

body.tema-claro::before {
  opacity: 0.028;
}

body.tema-claro ::selection {
  background: var(--ouro);
  color: #1a1204;
}

/* ── Preloader ─────────────────────────────────────────── */
body.tema-claro #preloader {
  display: none !important;
}
body.tema-claro .firmeza-texto {
  color: rgba(27, 24, 19, 0.55);
}
body.tema-claro .firmeza-barra {
  background: rgba(27, 24, 19, 0.1);
}

/* ── Ambiente claro: pó dourado, luz quente, defumação ──── */
body.tema-claro #cursor-vagalume {
  display: none !important;
}
body.tema-claro .clarao-fogueira {
  display: none !important;
}

/* Canvas de pó dourado (pemba) — visível e discreto */
body.tema-claro #embers {
  display: none;
}

/* Halo dourado respirando (substitui o clarão da fogueira) */
body.tema-claro .luz-ambiente {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    radial-gradient(90% 55% at 50% 108%, rgba(255, 193, 7, 0.22), transparent 58%),
    radial-gradient(55% 40% at 12% 18%, rgba(255, 210, 100, 0.12), transparent 60%),
    radial-gradient(50% 38% at 88% 22%, rgba(180, 83, 9, 0.07), transparent 62%);
  animation: respirar-luz 7s ease-in-out infinite alternate;
  will-change: opacity;
  transform: translateZ(0);
  contain: paint;
}
@keyframes respirar-luz {
  from { opacity: 0.7; }
  to { opacity: 1; }
}

/* Nuvens douradas lentas — defumação no claro (sem filter:blur) */
body.tema-claro .fumaca-glow {
  opacity: 0.7;
  mix-blend-mode: multiply;
  filter: none;
  transform: translateZ(0) scale(1.5);
}
body.tema-claro .fumaca-a {
  width: 70vw;
  height: 55vh;
  bottom: -20vh;
  left: -12vw;
}
body.tema-claro .fumaca-a .fumaca-glow {
  background: radial-gradient(circle,
    rgba(255, 193, 7, 0.32) 0%,
    rgba(255, 193, 7, 0.16) 28%,
    rgba(255, 193, 7, 0.06) 48%,
    transparent 70%);
}
body.tema-claro .fumaca-b {
  width: 55vw;
  height: 50vh;
  bottom: -18vh;
  right: -10vw;
}
body.tema-claro .fumaca-b .fumaca-glow {
  background: radial-gradient(circle,
    rgba(212, 160, 40, 0.22) 0%,
    rgba(212, 160, 40, 0.1) 30%,
    rgba(212, 160, 40, 0.04) 50%,
    transparent 70%);
}
body.tema-claro .fumaca-c {
  display: block;
  position: fixed;
  z-index: 2;
  pointer-events: none;
  width: 50vw;
  height: 45vh;
  top: 8vh;
  left: 30vw;
  animation: deriva-c 38s ease-in-out infinite alternate;
  transform: translateZ(0);
  will-change: transform;
  contain: layout style paint;
}
body.tema-claro .fumaca-c .fumaca-glow {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  filter: none;
  opacity: 0.45;
  mix-blend-mode: multiply;
  background: radial-gradient(circle,
    rgba(255, 220, 140, 0.26) 0%,
    rgba(255, 220, 140, 0.12) 30%,
    rgba(255, 220, 140, 0.045) 50%,
    transparent 70%);
  transform: translateZ(0) scale(1.55);
  contain: paint;
}
@keyframes deriva-c {
  to { transform: translate3d(-8vw, 10vh, 0) scale(1.2); }
}

/* Ferramentas dos orixás na fumaça — um pouco mais presentes */
body.tema-claro .ponto-fumaca {
  color: rgba(160, 110, 20, 0.42);
  filter: none;
}
body.tema-claro .ponto-fumaca .ponto-glow {
  opacity: 0.22;
}

/* Vinheta clara: bordas levemente mais quentes, sem escurecer o centro */
body.tema-claro .vinheta {
  display: block;
  background:
    radial-gradient(ellipse at center, transparent 48%, rgba(212, 180, 110, 0.14) 100%),
    radial-gradient(ellipse at 50% 100%, rgba(255, 193, 7, 0.08), transparent 45%);
}

/* ── Fio de contas ─────────────────────────────────────── */
body.tema-claro .fio-linha {
  background: rgba(27, 24, 19, 0.12);
}
body.tema-claro .conta {
  background: #fff;
  border-color: rgba(27, 24, 19, 0.22);
}
body.tema-claro .conta.acesa {
  background: var(--ouro);
  border-color: var(--ouro);
  box-shadow: 0 0 10px rgba(255, 193, 7, 0.55);
}
body.tema-claro .fio-preenchido {
  box-shadow: 0 0 6px rgba(255, 193, 7, 0.4);
}

/* ── Nav ───────────────────────────────────────────────── */
body.tema-claro .navegacao {
  background: linear-gradient(180deg, rgba(250, 248, 244, 0.94), rgba(250, 248, 244, 0.55) 70%, transparent);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(27, 24, 19, 0.04);
}
body.tema-claro .btn-vidro {
  border-color: rgba(27, 24, 19, 0.18);
  color: var(--osso);
  background: rgba(255, 255, 255, 0.65);
}
body.tema-claro .btn-vidro:hover {
  border-color: var(--ouro-escuro);
  color: var(--ouro-escuro);
  background: #fff;
}
body.tema-claro .btn-ouro {
  box-shadow: 0 8px 28px rgba(255, 193, 7, 0.35);
}

/* ── Hero ──────────────────────────────────────────────── */
body.tema-claro #ponto-riscado {
  opacity: 0.1;
}
body.tema-claro .pr-traco {
  filter: drop-shadow(0 0 4px rgba(255, 193, 7, 0.15));
}
body.tema-claro .hero-titulo {
  font-family: var(--fonte-corpo);
  font-weight: 400;
  color: #1b1813;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.45), 0 10px 36px rgba(253, 248, 240, 0.65);
}
body.tema-claro .letra-nuvem {
  color: var(--ouro);
}
body.tema-claro .hero-saudacao span {
  color: var(--ouro-escuro);
}
body.tema-claro .hero-sub2 {
  color: rgba(27, 24, 19, 0.55);
}
body.tema-claro .hero-fumaca-glow {
  mix-blend-mode: multiply;
  background: radial-gradient(ellipse at 50% 80%, rgba(140, 140, 145, 0.42) 0%, rgba(180, 180, 185, 0.16) 40%, transparent 72%);
}

/* ── Tipografia de seção ───────────────────────────────── */
body.tema-claro .fundamento-linhas .linha-grande {
  color: rgba(27, 24, 19, 0.28);
}
body.tema-claro .fundamento-linhas .linha-grande.acesa,
body.tema-claro .linha-grande.acesa {
  color: var(--osso);
}
body.tema-claro .vivo-fonte {
  color: rgba(27, 24, 19, 0.35);
}
body.tema-claro .vivo-numero {
  text-shadow: none;
}
body.tema-claro .vivo-item {
  border-color: rgba(27, 24, 19, 0.08);
  background: linear-gradient(180deg, #fff, rgba(255, 193, 7, 0.06));
  box-shadow: 0 10px 30px rgba(27, 24, 19, 0.04);
}

/* ── Congá / módulos ───────────────────────────────────── */
body.tema-claro .conga-lista button:hover {
  color: var(--osso);
  background: rgba(255, 193, 7, 0.1);
}
body.tema-claro .conga-lista button.ativo {
  color: var(--osso);
  border-color: rgba(180, 83, 9, 0.35);
  background: rgba(255, 193, 7, 0.12);
}
body.tema-claro .conga-painel {
  border-color: rgba(255, 193, 7, 0.35);
  background:
    radial-gradient(100% 80% at 80% 0%, rgba(255, 193, 7, 0.18), transparent 55%),
    linear-gradient(165deg, #ffffff, #f7f1e6);
  box-shadow: 0 20px 50px rgba(27, 24, 19, 0.08);
  color: var(--osso);
}
body.tema-claro .conga-num {
  color: rgba(255, 193, 7, 0.22);
}
body.tema-claro .conga-simbolo {
  filter: none;
}
body.tema-claro .conga-nav button {
  border-color: rgba(27, 24, 19, 0.18);
  color: var(--osso);
}
body.tema-claro .conga-lista button {
  border-color: transparent;
}
@media (max-width: 860px) {
  body.tema-claro .conga-lista button {
    border-color: rgba(27, 24, 19, 0.1);
    background: #fff;
  }
}

/* ── Casas ─────────────────────────────────────────────── */
body.tema-claro .casa-carta {
  border-color: rgba(27, 24, 19, 0.1);
  background: linear-gradient(180deg, #fff, #f4efe6);
  color: var(--osso);
  box-shadow: 0 12px 32px rgba(27, 24, 19, 0.06);
}
body.tema-claro .casa-carta:visited { color: var(--osso); }
body.tema-claro .casa-veu {
  background: linear-gradient(180deg, rgba(250, 248, 244, 0.15) 15%, rgba(250, 248, 244, 0.92));
}
body.tema-claro .casa-carta:has(.casa-foto[style*="url"]) .casa-veu {
  background: linear-gradient(180deg, rgba(27, 24, 19, 0.05) 10%, rgba(27, 24, 19, 0.78));
}
body.tema-claro .casa-carta:has(.casa-foto[style*="url"]) {
  color: #f5ead3;
}
body.tema-claro .casa-carta:has(.casa-foto[style*="url"]) .casa-cidade {
  color: rgba(245, 234, 211, 0.7);
}
body.tema-claro .casa-foto {
  opacity: 0.55;
}

/* ── Eventos ───────────────────────────────────────────── */
body.tema-claro .evento-linha {
  border-bottom-color: rgba(27, 24, 19, 0.08);
}
body.tema-claro .evento-linha:first-child {
  border-top-color: rgba(27, 24, 19, 0.08);
}
body.tema-claro .evento-linha:hover {
  background: rgba(255, 193, 7, 0.08);
}

/* ── Vozes / depoimentos ───────────────────────────────── */
body.tema-claro .voz-carta {
  border-color: rgba(27, 24, 19, 0.1);
  background: linear-gradient(180deg, #ffffff, #f6f1e8);
  box-shadow: 0 14px 36px rgba(27, 24, 19, 0.06);
  color: var(--osso);
}

/* ── Planos ────────────────────────────────────────────── */
body.tema-claro .oferta-palco {
  border-color: rgba(255, 193, 7, 0.4);
  background: linear-gradient(135deg, #ffffff 0%, #fffdf8 45%, #f7f0e4 100%);
  box-shadow: 0 24px 60px rgba(27, 24, 19, 0.08), 0 0 0 1px rgba(255, 193, 7, 0.06);
}
body.tema-claro .oferta-palco::before {
  background:
    radial-gradient(70% 80% at 85% 20%, rgba(255, 193, 7, 0.2), transparent 55%),
    radial-gradient(50% 60% at 10% 90%, rgba(180, 83, 9, 0.08), transparent 60%);
}
body.tema-claro .oferta-copy {
  border-right-color: rgba(255, 193, 7, 0.22);
}
body.tema-claro .oferta-pilar {
  border-color: rgba(27, 24, 19, 0.08);
  background: rgba(255, 193, 7, 0.08);
}

/* Mantém o primeiro viewport estável e barato para CPU/GPU. */
body.tema-claro .fumaca,
body.tema-claro #pontos-fumaca,
body.tema-claro .hero-fumaca {
  display: none !important;
}
body.tema-claro .pr-estrela,
body.tema-claro .dica-batida {
  animation: none;
}
body.tema-claro .oferta-planos-cabecalho strong,
body.tema-claro .oferta-plano-preco > span,
body.tema-claro .oferta-plano-preco small,
body.tema-claro .oferta-plano-descricao,
body.tema-claro .oferta-plano-equivalente,
body.tema-claro .oferta-garantias {
  color: rgba(27, 24, 19, 0.55);
}
body.tema-claro .oferta-plano-topo h4,
body.tema-claro .oferta-plano-equivalente strong,
body.tema-claro .oferta-economia span {
  color: #1b1813;
}
body.tema-claro .oferta-plano-card {
  border-color: rgba(27, 24, 19, 0.11);
  background: rgba(255, 255, 255, 0.78);
  box-shadow: 0 12px 30px rgba(27, 24, 19, 0.05);
}
body.tema-claro .oferta-plano-anual {
  border-color: rgba(204, 143, 0, 0.62);
  background:
    radial-gradient(95% 70% at 100% 0%, rgba(255, 193, 7, 0.26), transparent 62%),
    linear-gradient(155deg, #fffbef, #fff6d8);
  box-shadow: 0 18px 42px rgba(126, 85, 0, 0.15), inset 0 0 0 1px rgba(255, 193, 7, 0.1);
}
body.tema-claro .oferta-cta-secundario {
  border-color: rgba(180, 83, 9, 0.3);
  background: #fff;
  color: #9b6a00;
}
body.tema-claro .oferta-valor {
  text-shadow: none;
}
body.tema-claro .oferta-nota {
  color: rgba(27, 24, 19, 0.4);
}
body.tema-claro .oferta-beneficios span {
  border-color: rgba(180, 83, 9, 0.2);
  background: #fff;
  color: rgba(27, 24, 19, 0.65);
  box-shadow: 0 4px 14px rgba(27, 24, 19, 0.04);
}
body.tema-claro .oferta-gb {
  box-shadow: 0 10px 28px rgba(180, 83, 9, 0.28);
}

/* ── Quem está por trás ────────────────────────────────── */
body.tema-claro .quem-casas {
  border-color: #e8dfd0;
  background: #faf6ef;
  box-shadow: 0 16px 40px rgba(27, 24, 19, 0.05);
}
body.tema-claro .quem-casa {
  border-color: #e8dfd0;
  background: #fff;
}
body.tema-claro .quem-atalhos a {
  border-color: #d8cfc0;
  background: #fff;
}
body.tema-claro .quem-link { color: #a87400; }

/* ── Memória da casa ───────────────────────────────────── */
body.tema-claro .memoria-foto {
  border-color: rgba(27, 24, 19, 0.1);
  box-shadow: 0 18px 40px rgba(27, 24, 19, 0.1);
}
body.tema-claro .memoria-rodape {
  border-color: rgba(255, 193, 7, 0.35);
  background:
    radial-gradient(80% 120% at 0% 50%, rgba(255, 193, 7, 0.14), transparent 55%),
    #fff;
  box-shadow: 0 16px 40px rgba(27, 24, 19, 0.06);
}
body.tema-claro .memoria-pilares li {
  background: #fdf8f0;
  border-color: rgba(180, 83, 9, 0.2);
}

/* ── FAQ ───────────────────────────────────────────────── */
body.tema-claro .faq::before {
  background:
    radial-gradient(ellipse 70% 55% at 50% 40%, rgba(255, 193, 7, 0.1), transparent 70%),
    radial-gradient(ellipse 40% 40% at 20% 70%, rgba(180, 83, 9, 0.05), transparent 70%);
}
body.tema-claro .faq-item {
  border-color: rgba(27, 24, 19, 0.1);
  background:
    linear-gradient(135deg, rgba(255, 193, 7, 0.06), transparent 45%),
    linear-gradient(180deg, #ffffff, #faf6ef);
  box-shadow: 0 8px 24px rgba(27, 24, 19, 0.04);
}
body.tema-claro .faq-item:hover {
  border-color: rgba(255, 193, 7, 0.45);
}
body.tema-claro .faq-item.aberto {
  border-color: rgba(180, 83, 9, 0.4);
  box-shadow: 0 14px 36px rgba(180, 83, 9, 0.08);
}
body.tema-claro .faq-pergunta {
  color: var(--osso);
}
body.tema-claro .faq-pergunta:hover,
body.tema-claro .faq-item.aberto .faq-pergunta {
  color: var(--ouro-escuro);
}
body.tema-claro .faq-resposta-inner {
  color: rgba(27, 24, 19, 0.62);
  border-top-color: rgba(255, 193, 7, 0.22);
}
body.tema-claro .faq-resposta-inner a {
  color: var(--ouro-escuro);
  border-bottom-color: rgba(180, 83, 9, 0.35);
}
body.tema-claro .faq-icone {
  border-color: rgba(180, 83, 9, 0.35);
  color: var(--ouro-escuro);
}

/* ── Segurança (texto claro; rack permanece escuro) ─────── */
body.tema-claro .seguranca::before {
  background:
    radial-gradient(ellipse 50% 45% at 75% 45%, rgba(73, 230, 165, 0.08), transparent 70%),
    radial-gradient(ellipse 45% 40% at 20% 60%, rgba(255, 193, 7, 0.1), transparent 70%);
}
body.tema-claro .seg-stat {
  border-color: rgba(27, 24, 19, 0.08);
  background: #fff;
  box-shadow: 0 8px 22px rgba(27, 24, 19, 0.04);
}
body.tema-claro .seg-ponto {
  border-color: rgba(255, 193, 7, 0.28);
  background: #fff;
  box-shadow: 0 8px 22px rgba(27, 24, 19, 0.04);
}
body.tema-claro .seg-ponto h3 {
  color: var(--ouro-escuro);
}
body.tema-claro .seg-ponto-ico {
  border-color: rgba(180, 83, 9, 0.3);
  background: rgba(255, 193, 7, 0.12);
  color: var(--ouro-escuro);
}
body.tema-claro .tom-osso { color: var(--osso); }
body.tema-claro .rack-nota {
  color: rgba(27, 24, 19, 0.4);
}
body.tema-claro .rack-halo {
  border-color: rgba(255, 193, 7, 0.15);
  background: radial-gradient(circle, rgba(255, 193, 7, 0.1), rgba(73, 230, 165, 0.04) 42%, transparent 70%);
}

/* ── Chamado final ─────────────────────────────────────── */
body.tema-claro .chamado {
  background:
    radial-gradient(ellipse 70% 60% at 50% 40%, rgba(255, 193, 7, 0.12), transparent 65%),
    linear-gradient(180deg, transparent, rgba(255, 193, 7, 0.05));
}
body.tema-claro .chamado-ponto {
  opacity: 0.18;
}
body.tema-claro .chamado-titulo {
  text-shadow: none;
  color: var(--osso);
}
body.tema-claro .chamado-selos {
  color: rgba(27, 24, 19, 0.4);
}

/* ── Ritmo cromático: marfim + preto quente + ouro ─────── */
body.tema-claro .fundamento,
body.tema-claro .axe-vivo,
body.tema-claro .quem-somos,
body.tema-claro .chamado {
  color: #f8f3e9;
  border-top: 1px solid rgba(255, 193, 7, 0.12);
  border-bottom: 1px solid rgba(255, 193, 7, 0.1);
  background:
    radial-gradient(80% 75% at 50% 12%, rgba(255, 193, 7, 0.09), transparent 58%),
    linear-gradient(145deg, #201b14 0%, #17140f 52%, #0f0d0a 100%);
}

body.tema-claro .fundamento::before,
body.tema-claro .axe-vivo::before,
body.tema-claro .quem-somos::before,
body.tema-claro .chamado::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0.16;
  background-image: radial-gradient(rgba(255, 215, 110, 0.55) 0.55px, transparent 0.55px);
  background-size: 22px 22px;
}

body.tema-claro .fundamento-linhas .linha-grande {
  color: rgba(248, 243, 233, 0.48);
}
body.tema-claro .fundamento-linhas .linha-grande.acesa,
body.tema-claro .fundamento .linha-grande.acesa {
  color: #f8f3e9;
}
body.tema-claro .fundamento-nota {
  color: rgba(248, 243, 233, 0.58);
}

body.tema-claro .axe-vivo .titulo-secao,
body.tema-claro .quem-somos .titulo-secao,
body.tema-claro .chamado-titulo {
  color: #f8f3e9;
}
body.tema-claro .axe-vivo .vivo-item {
  border-color: rgba(255, 193, 7, 0.17);
  background:
    radial-gradient(90% 80% at 50% 0%, rgba(255, 193, 7, 0.1), transparent 62%),
    rgba(255, 255, 255, 0.025);
  box-shadow: 0 18px 44px rgba(0, 0, 0, 0.24);
}
body.tema-claro .axe-vivo .vivo-rotulo,
body.tema-claro .axe-vivo .vivo-numero small {
  color: rgba(248, 243, 233, 0.56);
}
body.tema-claro .axe-vivo .vivo-fonte {
  color: rgba(248, 243, 233, 0.38);
}

body.tema-claro .quem-somos {
  max-width: none;
  margin: 0;
  padding-left: 8vw;
  padding-right: 8vw;
}
body.tema-claro .quem-somos .quem-grade {
  max-width: 1180px;
  margin: 0 auto;
}
body.tema-claro .quem-somos .quem-historia {
  background:
    radial-gradient(90% 70% at 10% 0%, rgba(255, 193, 7, 0.15), transparent 55%),
    linear-gradient(165deg, #282117, #14110d 70%);
}
body.tema-claro .quem-somos .quem-casas {
  border-color: rgba(255, 193, 7, 0.16);
  background: rgba(255, 255, 255, 0.025);
  box-shadow: 0 20px 48px rgba(0, 0, 0, 0.2);
}
body.tema-claro .quem-somos .quem-casas-topo h3,
body.tema-claro .quem-somos .quem-casa strong {
  color: #f8f3e9;
}
body.tema-claro .quem-somos .quem-casa {
  border-color: rgba(248, 243, 233, 0.1);
  background: rgba(255, 255, 255, 0.035);
  color: #f8f3e9;
}
body.tema-claro .quem-somos .quem-casa:hover {
  border-color: rgba(255, 193, 7, 0.45);
  background: rgba(255, 193, 7, 0.055);
}
body.tema-claro .quem-somos .quem-casa small,
body.tema-claro .quem-somos .quem-nota {
  color: rgba(248, 243, 233, 0.48);
}
body.tema-claro .quem-somos .quem-atalhos a {
  border-color: rgba(255, 193, 7, 0.25);
  background: rgba(255, 193, 7, 0.04);
  color: rgba(248, 243, 233, 0.8);
}

body.tema-claro .chamado {
  background:
    radial-gradient(ellipse 65% 60% at 50% 45%, rgba(255, 193, 7, 0.13), transparent 66%),
    linear-gradient(145deg, #201b14, #0f0d0a);
}
body.tema-claro .chamado-ponto {
  opacity: 0.12;
}
body.tema-claro .chamado-sub {
  color: rgba(248, 243, 233, 0.68);
}
body.tema-claro .chamado-selos {
  color: rgba(248, 243, 233, 0.4);
}

/* ── Rodapé legado da página (se houver) ───────────────── */
body.tema-claro .rodape {
  border-top-color: rgba(27, 24, 19, 0.08);
}
body.tema-claro .rodape strong {
  color: var(--osso);
}

/* Rodapé institucional — igual ao MarketingMockupFooter da produção */
/* Fonte versionada para o build de produção. */
.site-footer {
  position: relative;
  z-index: 20;
  background: #000;
  color: rgba(255, 255, 255, 0.6);
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  padding: 64px 6vw 28px;
  font-family: "Outfit", system-ui, sans-serif;
}
.site-footer-grade {
  max-width: 1180px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 36px 28px;
}
.site-footer-marca {
  font-family: "Fraunces", Georgia, serif;
  font-size: 1.35rem;
  color: #fff;
  text-decoration: none;
  display: inline-block;
  margin-bottom: 14px;
}
.site-footer-marca em { color: #ffc107; font-style: normal; }
.site-footer-desc {
  font-size: 0.78rem;
  line-height: 1.7;
  max-width: 260px;
  margin-bottom: 18px;
}
.site-footer h2 {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #fff;
  margin-bottom: 16px;
}
.pular-conteudo {
  position: fixed; left: 16px; top: 10px; z-index: 9999; padding: 12px 18px;
  border-radius: 999px; background: #ffc107; color: #17130d; font: 700 .85rem "Outfit", sans-serif;
  text-decoration: none; transform: translateY(-180%); transition: transform .2s;
}
.pular-conteudo:focus { transform: translateY(0); }
:where(a, button, input, select, textarea):focus-visible { outline: 3px solid #ffc107 !important; outline-offset: 3px; }
.menu-mobile-botao { display: none; }
.menu .menu-cta { display: none; padding: 10px 16px; border: 1px solid rgba(255,193,7,.55); border-radius: 999px; color: #ffc107; white-space: nowrap; }
.nav-links .menu-cta { display: none; }
.vozes-copia { display: contents; }
.site-footer ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
/* Precisa vencer .site-footer ul (mesma tag + classe) — senão vira coluna */
.site-footer ul.site-footer-sociais {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: 8px;
}
.site-footer-sociais a {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.15);
  color: rgba(255, 255, 255, 0.7);
  transition: border-color 0.3s, color 0.3s;
}
.site-footer-sociais a:hover { border-color: rgba(255, 193, 7, 0.4); color: #ffc107; }
.site-footer-sociais svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.site-footer-sociais .tiktok-icon { fill: currentColor; stroke: none; }
.site-footer ul a {
  font-size: 0.78rem;
  color: rgba(255, 255, 255, 0.6);
  text-decoration: none;
  transition: color 0.3s;
}
.site-footer ul a:hover { color: #ffc107; }

.site-footer-baixo {
  max-width: 1180px;
  margin: 48px auto 0;
  padding-top: 24px;
  border-top: 1px solid rgba(255, 255, 255, 0.15);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  font-size: 0.75rem;
  text-align: center;
}
.site-footer-baixo .italico { font-style: italic; }

@media (max-width: 960px) {
  .site-footer-grade { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 1120px) {
  .navegacao,
  body > nav.menu-pronto {
    position: relative !important;
    z-index: 120 !important;
    width: auto !important;
    max-width: calc(100vw - 24px) !important;
    min-width: 0 !important;
    margin-left: 12px !important;
    margin-right: 12px !important;
    padding-left: max(14px, env(safe-area-inset-left)) !important;
    padding-right: max(14px, env(safe-area-inset-right)) !important;
    flex-wrap: nowrap !important;
    overflow: visible !important;
  }
  .navegacao { padding-top: 14px !important; padding-bottom: 14px !important; }
  body > nav.menu-pronto > .marca,
  .navegacao > .marca { min-width: 0; flex: 0 1 auto; }
  .navegacao .btn-nav { display: none !important; }
  .navegacao .nav-acoes { gap: 9px; }
  .menu-mobile-botao {
    display: grid; place-content: center; gap: 5px; width: 44px; height: 44px; flex: 0 0 44px;
    position: relative; margin-left: auto; border: 1px solid rgba(255,193,7,.45); border-radius: 50%;
    background: rgba(10,8,5,.94); color: #ffc107; cursor: pointer; z-index: 122;
    touch-action: manipulation;
  }
  .menu-mobile-botao span { display: block; width: 18px; height: 2px; background: currentColor; transition: transform .2s, opacity .2s; }
  .menu-aberto .menu-mobile-botao span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .menu-aberto .menu-mobile-botao span:nth-child(2) { opacity: 0; }
  .menu-aberto .menu-mobile-botao span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
  .navegacao .nav-links, body > nav .menu {
    display: none !important;
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    left: auto;
    bottom: auto;
    z-index: 121;
    width: min(360px, calc(100vw - 24px)) !important;
    height: auto !important;
    max-height: calc(100dvh - 96px);
    min-height: 0;
    padding: 10px;
    border: 1px solid rgba(255, 193, 7, 0.22);
    border-radius: 20px;
    background: rgba(20, 17, 13, 0.98);
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.36);
    backdrop-filter: blur(18px);
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: stretch;
    justify-content: flex-start;
    gap: 3px;
    overflow-y: auto;
  }
  .menu-aberto .navegacao .nav-links,
  body.menu-aberto > nav .menu { display: flex !important; }
  .navegacao .nav-links a, body > nav .menu a {
    display: block;
    padding: 12px 14px;
    border: 0;
    border-radius: 11px;
    color: rgba(248, 243, 233, 0.82) !important;
    font-size: .82rem !important;
    font-weight: 600;
    letter-spacing: .08em;
    line-height: 1.3;
    transition: color .2s, background .2s;
  }
  .navegacao .nav-links a:hover,
  body > nav .menu a:hover,
  body > nav .menu a.atual {
    color: #ffc107 !important;
    background: rgba(255, 193, 7, 0.08);
  }
  .nav-links .menu-cta,
  body > nav .menu .menu-cta {
    display: block;
    margin-top: 7px;
    padding: 14px;
    text-align: center;
    background: #ffc107;
    color: #17130d !important;
    border-radius: 999px;
  }
  .nav-links .menu-cta:hover,
  body > nav .menu .menu-cta:hover {
    color: #17130d !important;
    background: #ffd044;
  }
}
@media (max-width: 420px) {
  .navegacao .marca { font-size: 1.08rem; }
}
@media (max-width: 560px) {
  .navegacao .btn-entrar {
    display: inline-flex !important;
    align-items: center;
    font-size: 0.82rem;
    letter-spacing: 0.06em;
    padding: 8px 10px;
    white-space: nowrap;
  }
  .site-footer-grade { grid-template-columns: 1fr; }
  .site-footer-baixo { flex-direction: column; }
}