/* ============================================================
   ELIENAI — ambience.css
   Ambiência ao fundo (aurora) + glassmorphism + micro-movimento
   Aditivo: não altera a base editorial, só acrescenta atmosfera.
   ============================================================ */

/* ===== AMBIÊNCIA — aurora ao fundo, atrás de tudo ===== */
.ambience{
  position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;
  /* mistura suave com o navio de fundo */
  mix-blend-mode:screen;
}
.ambience .orb{
  position:absolute;border-radius:50%;filter:blur(90px);opacity:.5;
  will-change:transform;
}
.orb.o1{width:52vw;height:52vw;left:-12vw;top:-14vw;
  background:radial-gradient(circle at 40% 40%,rgba(61,136,245,.55),rgba(26,101,232,.10) 60%,transparent 72%)}
.orb.o2{width:44vw;height:44vw;right:-10vw;top:8vh;
  background:radial-gradient(circle at 50% 50%,rgba(112,170,248,.34),transparent 68%)}
.orb.o3{width:40vw;height:40vw;left:18vw;bottom:-16vw;
  background:radial-gradient(circle at 50% 50%,rgba(201,162,75,.22),transparent 66%)}
.orb.o4{width:30vw;height:30vw;right:12vw;bottom:2vh;
  background:radial-gradient(circle at 50% 50%,rgba(18,72,200,.40),transparent 70%)}

/* fallback quando o movimento está desligado — orbes parados, discretos */
.no-motion .ambience .orb{opacity:.34}

/* ===== ETHEREAL — véu de sombra na cor da marca, respira devagar =====
   Leve: o filtro rasteriza uma vez; só transform/opacity animam (compositor). */
.ether{position:absolute;inset:-8%;pointer-events:none;opacity:.5;
  animation:ether-breathe 32s ease-in-out infinite alternate;will-change:transform,opacity}
.ether-shape{position:absolute;inset:0;filter:url(#etherFx) blur(24px);
  background:
    radial-gradient(38% 44% at 30% 34%,rgba(26,101,232,.32),transparent 68%),
    radial-gradient(42% 40% at 72% 60%,rgba(61,136,245,.20),transparent 70%),
    radial-gradient(30% 34% at 52% 82%,rgba(201,162,75,.13),transparent 72%);
  -webkit-mask:radial-gradient(82% 82% at 50% 46%,#000 18%,transparent 84%);
          mask:radial-gradient(82% 82% at 50% 46%,#000 18%,transparent 84%)}
@keyframes ether-breathe{
  0%{transform:translate3d(-2.4%,-1.4%,0) scale(1.04) rotate(-1.4deg)}
  100%{transform:translate3d(2.4%,1.4%,0) scale(1.12) rotate(1.4deg)}
}
/* leveza em telas pequenas: sem filtro SVG, só o gradiente suave */
@media (max-width:860px){
  .ether-shape{filter:none;opacity:.72}
  .ether{opacity:.4}
}
@media (prefers-reduced-motion:reduce){.ether{animation:none}}

/* garante que o conteúdo fique acima da aurora sem alterar cada seção */
body > header,
body > section,
body > footer,
body > a#top{position:relative;z-index:1}

/* o hero é translúcido no fundo para a aurora respirar sob o grid */
.hero{background:radial-gradient(120% 80% at 78% 0%,rgba(26,101,232,.12),transparent 55%),
  linear-gradient(180deg,rgba(5,15,51,.55),rgba(5,15,51,.86))}

/* ===== GLASSMORPHISM ===== */

/* header: vidro fosco assim que rola (reforça o que já existia) */
.site-header.scrolled{
  background:rgba(6,26,92,.42);
  -webkit-backdrop-filter:blur(20px) saturate(1.35);
  backdrop-filter:blur(20px) saturate(1.35);
  border-bottom:1px solid var(--gold-line);
}

/* moldura do atelier — placa de vidro sobre a aurora */
.frame{
  background:rgba(10,28,73,.46);
  -webkit-backdrop-filter:blur(18px) saturate(1.2);
  backdrop-filter:blur(18px) saturate(1.2);
}

/* faixa de números — painel de vidro */
.stat-strip{
  background:rgba(8,24,80,.30);
  -webkit-backdrop-filter:blur(14px) saturate(1.15);
  backdrop-filter:blur(14px) saturate(1.15);
  border:1px solid var(--hair);
  padding:34px 34px 30px;
}

/* destaque 04 — cartão de vidro (mantém o filete dourado) */
.feat{
  background:linear-gradient(135deg,rgba(12,34,86,.55),rgba(10,28,73,.34));
  -webkit-backdrop-filter:blur(20px) saturate(1.2);
  backdrop-filter:blur(20px) saturate(1.2);
}

/* depoimentos — cada cartão de vidro sobre o navio */
.quote-grid{background:var(--hair-strong);border:1px solid var(--hair)}
.quote{
  background:rgba(9,25,78,.34);
  -webkit-backdrop-filter:blur(16px) saturate(1.12);
  backdrop-filter:blur(16px) saturate(1.12);
}

/* menu mobile em vidro — alpha alto: sem backdrop-filter (headless, browsers
   antigos) o painel abre sobre o H1 da hero e precisa continuar legível */
.nav-links[style]{
  background:rgba(6,18,66,.93)!important;
  -webkit-backdrop-filter:blur(22px) saturate(1.3);
  backdrop-filter:blur(22px) saturate(1.3);
  border:1px solid var(--gold-line)!important;
}

/* brilho de borda sutil comum às placas de vidro */
.frame,.feat,.quote,.stat-strip{
  box-shadow:0 40px 90px -46px rgba(0,0,0,.75),
             inset 0 1px 0 rgba(236,228,209,.08);
}

/* ===== MICRO-MOVIMENTO ===== */
/* botões com ímã — a transição fica suave no retorno */
.btn.magnetic{will-change:transform}

/* parallax alvo */
[data-parallax]{will-change:transform}

/* reveal por palavra (hero) */
.word-reveal .w{display:inline-block;overflow:hidden;vertical-align:top}
.word-reveal .w > span{display:inline-block;transform:translateY(105%)}
.no-motion .word-reveal .w > span{transform:none}

@media (prefers-reduced-motion:reduce){
  .ambience .orb{opacity:.3!important;animation:none!important}
  .word-reveal .w > span{transform:none!important}
}

/* telas menores: aurora mais contida para não pesar */
@media (max-width:860px){
  .ambience .orb{filter:blur(66px);opacity:.4}
}