/* =====================================================================
   SOUL CORE ADS · waves.css
   CHROMATIC WAVES (Originkit) — camada de atmosfera, direcao de arte.

   FILOSOFIA
   O campo NUNCA e o assunto. Ele existe para dar profundidade ao preto
   e fazer o dourado da marca respirar. Toda decisao aqui e subtrativa:
   mascarar, apagar, desacelerar, silenciar. Se em duvida — menos.

   ARQUITETURA DE CAMADAS (z-index)
     -2  #soul-waves ......... campo de pontos (WebGL, fixo, 1 contexto)
     -1  #ambient-canvas ..... "data intelligence" legado (intocado)
      0+ conteudo
     100 header (o glass DESFOCA o campo — integracao gratuita)
    1000 drawer (halftone estatico proprio, sem WebGL)

   ROLLBACK TOTAL: remover as 2 tags (<link> + <script>) do index.html
   e o <div id="soul-waves">. Nenhum arquivo original foi reescrito.
   ===================================================================== */

:root{
  /* Paleta do campo — 5 paradas, alpha crescente. A 1a e TRANSPARENTE:
     e ela que faz as celulas de baixa luminancia sumirem (campo esparso). */
  --wv-c1: #A8822A00;   /* dourado profundo · invisivel  */
  --wv-c2: #A8822A33;   /* dourado profundo · 20%        */
  --wv-c3: #D4AF3777;   /* dourado principal · 47%       */
  --wv-c4: #E7C765AA;   /* dourado claro · 67%           */
  --wv-c5: #C9CDD6D8;   /* prata do logo · 85% (so picos)*/

  --wv-op: .16;         /* opacidade da zona (JS regula)  */
}

/* ---------------------------------------------------------------------
   1. CAMADA GLOBAL · fixa, atras de tudo, inerte a interacao
   Duas mascaras ANINHADAS (nunca mask-composite: suporte irregular):
     externa  = fade vertical  (silencia topo sob o header e o rodape)
     interna  = protecao do miolo (o texto sempre cai na zona quieta)
   --------------------------------------------------------------------- */
#soul-waves{
  position:fixed; inset:0;
  z-index:-2;                       /* abaixo do #ambient-canvas (-1) */
  pointer-events:none;              /* jamais intercepta clique/toque */
  contain:layout paint style;       /* isola do layout da pagina      */
  opacity:0;                        /* entra por fade, nunca "pipoca" */
  transition:opacity 1200ms cubic-bezier(.22,1,.36,1);

  -webkit-mask-image:linear-gradient(to bottom,
      transparent 0%, #000 10%, #000 86%, transparent 100%);
          mask-image:linear-gradient(to bottom,
      transparent 0%, #000 10%, #000 86%, transparent 100%);
}
#soul-waves.wv-ready{ opacity:var(--wv-op); }

/* Palco: recebe a mascara radial de leitura. O gradiente mantem apenas
   ~8% do campo no centro optico (onde vive o texto) e vai a 100% nas
   bordas — o efeito "existe pela periferia", como Stripe/Linear. */
.wv-stage{
  position:absolute; inset:0;
  -webkit-mask-image:radial-gradient(115% 88% at 50% 44%,
      rgba(0,0,0,.08) 0%, rgba(0,0,0,.26) 28%, rgba(0,0,0,.58) 48%,
      rgba(0,0,0,.92) 74%, #000 100%);
          mask-image:radial-gradient(115% 88% at 50% 44%,
      rgba(0,0,0,.08) 0%, rgba(0,0,0,.26) 28%, rgba(0,0,0,.58) 48%,
      rgba(0,0,0,.92) 74%, #000 100%);
}
.wv-stage canvas{ display:block; width:100%; height:100%; }

/* Convivencia com o ambient legado: dois campos animados a 100% brigam.
   O "data intelligence" recua para 2o plano — o campo de pontos passa a
   ser a atmosfera, o ambient continua sendo a narrativa de dados.
   ROLLBACK: apagar esta regra devolve o ambient ao peso original. */
html.wv-on #ambient-canvas.dc-ambient.dc-ambient-on{ opacity:.62; }

/* ---------------------------------------------------------------------
   2. HALFTONE ESTATICO · mesmo DNA visual, custo ZERO (sem GPU/JS)
   Usado onde WebGL seria indefensavel: splash (protege o LCP) e drawer
   (ja tem 2 camadas decorativas) — e como fallback sem WebGL2.
   --------------------------------------------------------------------- */
#sca-splash::after,
.menu-drawer .drawer-tex::after{
  content:""; position:absolute; inset:0;
  pointer-events:none;
  background-image:radial-gradient(rgba(212,175,55,.55) 1px, transparent 1.6px);
  background-size:22px 22px;
}

/* SPLASH · o halftone floresce atras da logo e some no centro, para nao
   competir com o elemento de LCP. Sem WebGL aqui: 0ms no caminho critico. */
#sca-splash::after{
  opacity:.42;
  -webkit-mask-image:radial-gradient(80% 60% at 50% 32%,
      transparent 0%, transparent 30%, #000 78%);
          mask-image:radial-gradient(80% 60% at 50% 32%,
      transparent 0%, transparent 30%, #000 78%);
}

/* DRAWER · a textura nasce no MESMO ponto de origem do clip-path do menu
   (canto do hamburguer): o painel abre e a trama floresce junto. */
.menu-drawer .drawer-tex::after{
  opacity:.5;
  -webkit-mask-image:radial-gradient(72% 52% at 88% 5%, #000, transparent 72%);
          mask-image:radial-gradient(72% 52% at 88% 5%, #000, transparent 72%);
}

/* ---------------------------------------------------------------------
   3. FALLBACK · sem WebGL2 (Safari antigo, GPU bloqueada, contexto perdido)
   O site nao perde a identidade: recebe o halftone estatico, discretissimo.
   --------------------------------------------------------------------- */
html.wv-nogl #soul-waves{ opacity:1; }
/* No .wv-stage (nao no #soul-waves) para herdar AS DUAS mascaras — a
   trama estatica e uniforme, entao precisa ainda mais do miolo protegido. */
html.wv-nogl .wv-stage{
  background-image:radial-gradient(rgba(212,175,55,.16) 1px, transparent 1.7px);
  background-size:24px 24px;
}

/* ---------------------------------------------------------------------
   4. ACESSIBILIDADE · prefers-reduced-motion
   O campo NAO some (faz parte do design) — ele CONGELA. O JS desenha
   exatamente 1 frame e encerra o rAF: zero movimento, zero consumo.
   --------------------------------------------------------------------- */
@media (prefers-reduced-motion:reduce){
  #soul-waves{ transition:none; }
  #sca-splash::after, .menu-drawer .drawer-tex::after{ opacity:.3; }
}

/* ---------------------------------------------------------------------
   5. RESPONSIVO · a intensidade cai junto com a area de tela.
   Em telas pequenas o texto ocupa quase todo o viewport: sobra pouca
   periferia, entao o campo precisa recuar (o JS ainda reduz cellSize,
   frequencia e velocidade — ver waves.js §PRESETS).
   --------------------------------------------------------------------- */
@media (max-width:1024px){
  #soul-waves{
    -webkit-mask-image:linear-gradient(to bottom,
        transparent 0%, #000 12%, #000 84%, transparent 100%);
            mask-image:linear-gradient(to bottom,
        transparent 0%, #000 12%, #000 84%, transparent 100%);
  }
  .wv-stage{
    -webkit-mask-image:radial-gradient(120% 80% at 50% 42%,
        rgba(0,0,0,.05) 0%, rgba(0,0,0,.20) 30%, rgba(0,0,0,.55) 52%, #000 88%);
            mask-image:radial-gradient(120% 80% at 50% 42%,
        rgba(0,0,0,.05) 0%, rgba(0,0,0,.20) 30%, rgba(0,0,0,.55) 52%, #000 88%);
  }
}
@media (max-width:600px){
  .menu-drawer .drawer-tex::after{ background-size:18px 18px; opacity:.42; }
  #sca-splash::after{ background-size:18px 18px; opacity:.34; }
}

/* Telas muito largas: a mascara radial abre junto, senao o campo forma
   um "halo" oval evidente no centro de monitores ultrawide. */
@media (min-width:1800px){
  .wv-stage{
    -webkit-mask-image:radial-gradient(100% 105% at 50% 44%,
        rgba(0,0,0,.08) 0%, rgba(0,0,0,.28) 26%, rgba(0,0,0,.62) 46%, #000 78%);
            mask-image:radial-gradient(100% 105% at 50% 44%,
        rgba(0,0,0,.08) 0%, rgba(0,0,0,.28) 26%, rgba(0,0,0,.62) 46%, #000 78%);
  }
}

/* Impressao: nada de atmosfera no papel. */
@media print{ #soul-waves{ display:none !important; } }
