/**
 * ARANOX Background Engine Premium
 * Release: AW2_148
 * Dependências: AW2_145 + AW2_146 + AW2_147
 */

:root{
  --arx-bg-speed-slow:24s;
  --arx-bg-speed-base:14s;
  --arx-bg-opacity-soft:.06;
  --arx-bg-opacity-base:.12;
  --arx-bg-opacity-strong:.20;
  --arx-bg-grid-size:64px;
  --arx-bg-dot-size:28px;
}

/* Engine base */
.arx-bg{
  position:relative;
  isolation:isolate;
  overflow:hidden;
}

.arx-bg>*{
  position:relative;
  z-index:2;
}

.arx-bg::before,
.arx-bg::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
}

/* 01 — Mesh */
.arx-bg-mesh{
  background:
    radial-gradient(circle at 16% 20%,rgba(66,217,223,.14),transparent 30%),
    radial-gradient(circle at 86% 18%,rgba(119,96,238,.13),transparent 28%),
    radial-gradient(circle at 74% 84%,rgba(83,201,140,.10),transparent 26%),
    linear-gradient(135deg,var(--arx-black),var(--arx-navy-900));
}

.arx-bg-mesh::before{
  opacity:.7;
  background:
    radial-gradient(circle at var(--arx-bg-x,60%) var(--arx-bg-y,40%),rgba(255,255,255,.07),transparent 24%);
  transition:background-position 180ms linear;
}

/* 02 — Technical Grid */
.arx-bg-grid::before{
  opacity:var(--arx-bg-opacity-base);
  background-image:
    linear-gradient(rgba(255,255,255,.08) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px);
  background-size:var(--arx-bg-grid-size) var(--arx-bg-grid-size);
  mask-image:linear-gradient(to bottom,black,transparent 94%);
}

.arx-bg-grid--light::before{
  background-image:
    linear-gradient(rgba(10,40,58,.12) 1px,transparent 1px),
    linear-gradient(90deg,rgba(10,40,58,.12) 1px,transparent 1px);
}

/* 03 — Dots */
.arx-bg-dots::before{
  opacity:var(--arx-bg-opacity-base);
  background-image:radial-gradient(circle,rgba(255,255,255,.55) 1px,transparent 1.5px);
  background-size:var(--arx-bg-dot-size) var(--arx-bg-dot-size);
}

.arx-bg-dots--light::before{
  background-image:radial-gradient(circle,rgba(9,40,58,.40) 1px,transparent 1.5px);
}

/* 04 — Noise */
.arx-bg-noise::after{
  opacity:.045;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.88' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.75'/%3E%3C/svg%3E");
  mix-blend-mode:soft-light;
}

/* 05 — Aurora */
.arx-bg-aurora{
  background:linear-gradient(145deg,#04080c,#0a1f2d 56%,#08131d);
}

.arx-bg-aurora::before{
  inset:-30%;
  opacity:.68;
  filter:blur(70px);
  background:
    conic-gradient(
      from 180deg at 50% 50%,
      rgba(66,217,223,.22),
      rgba(119,96,238,.16),
      rgba(83,201,140,.15),
      rgba(66,217,223,.22)
    );
  animation:arxBgAurora var(--arx-bg-speed-slow) linear infinite;
}

/* 06 — Neural */
.arx-bg-neural::before{
  opacity:.16;
  background-image:url("data:image/svg+xml,%3Csvg width='240' height='240' viewBox='0 0 240 240' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%2342d9df' stroke-opacity='.5'%3E%3Cpath d='M20 44L88 92l62-46 70 40M88 92l14 78 72 28M150 46l24 152M20 196l82-26 118 26'/%3E%3C/g%3E%3Cg fill='%2342d9df'%3E%3Ccircle cx='20' cy='44' r='3'/%3E%3Ccircle cx='88' cy='92' r='4'/%3E%3Ccircle cx='150' cy='46' r='3'/%3E%3Ccircle cx='220' cy='86' r='3'/%3E%3Ccircle cx='102' cy='170' r='4'/%3E%3Ccircle cx='174' cy='198' r='3'/%3E%3Ccircle cx='20' cy='196' r='3'/%3E%3Ccircle cx='220' cy='196' r='3'/%3E%3C/g%3E%3C/svg%3E");
  background-size:240px 240px;
  animation:arxBgDrift var(--arx-bg-speed-slow) linear infinite;
}

/* 07 — Data Flow */
.arx-bg-dataflow::before{
  opacity:.18;
  background:
    linear-gradient(90deg,transparent 0 12%,rgba(66,217,223,.55) 12.2% 12.4%,transparent 12.6% 36%,rgba(119,96,238,.48) 36.2% 36.4%,transparent 36.6% 64%,rgba(83,201,140,.48) 64.2% 64.4%,transparent 64.6% 100%);
  background-size:340px 100%;
  animation:arxBgData var(--arx-bg-speed-base) linear infinite;
}

/* 08 — Radar */
.arx-bg-radar::before{
  inset:50% auto auto 50%;
  width:min(78vw,760px);
  aspect-ratio:1;
  transform:translate(-50%,-50%);
  border-radius:50%;
  opacity:.18;
  background:
    repeating-radial-gradient(circle,rgba(66,217,223,.50) 0 1px,transparent 1px 68px),
    conic-gradient(from 0deg,transparent 0 78%,rgba(66,217,223,.28) 92%,transparent 100%);
  animation:arxBgRadar 12s linear infinite;
}

/* 09 — Hex Grid */
.arx-bg-hex::before{
  opacity:.11;
  background-image:url("data:image/svg+xml,%3Csvg width='84' height='96' viewBox='0 0 84 96' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M21 2h42l19 22v48L63 94H21L2 72V24L21 2Z' fill='none' stroke='%2342d9df' stroke-opacity='.6'/%3E%3C/svg%3E");
  background-size:84px 96px;
}

/* 10 — Blueprint */
.arx-bg-blueprint{
  background:linear-gradient(145deg,#081d2a,#0a3247);
}

.arx-bg-blueprint::before{
  opacity:.14;
  background-image:
    linear-gradient(rgba(255,255,255,.15) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.15) 1px,transparent 1px),
    linear-gradient(rgba(255,255,255,.08) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px);
  background-size:64px 64px,64px 64px,16px 16px,16px 16px;
}

/* 11 — Energy Wave */
.arx-bg-energy::before{
  inset:auto -10% 4% -10%;
  height:52%;
  opacity:.28;
  background:
    radial-gradient(ellipse at 50% 100%,rgba(83,201,140,.30),transparent 54%),
    repeating-radial-gradient(ellipse at 50% 100%,transparent 0 24px,rgba(66,217,223,.34) 25px 27px,transparent 28px 52px);
  animation:arxBgEnergy 7s ease-in-out infinite;
}

/* 12 — Industrial */
.arx-bg-industrial::before{
  opacity:.12;
  background:
    linear-gradient(115deg,transparent 0 45%,rgba(255,255,255,.08) 45.2% 45.4%,transparent 45.6% 100%),
    linear-gradient(65deg,transparent 0 45%,rgba(255,255,255,.06) 45.2% 45.4%,transparent 45.6% 100%);
  background-size:140px 140px;
}

/* 13 — Trust */
.arx-bg-trust{
  background:
    radial-gradient(circle at 80% 16%,rgba(66,217,223,.12),transparent 24%),
    linear-gradient(135deg,#05090d,#102838);
}

.arx-bg-trust::before{
  opacity:.16;
  background-image:url("data:image/svg+xml,%3Csvg width='180' height='180' viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%2342d9df' stroke-opacity='.55'%3E%3Ccircle cx='90' cy='90' r='52'/%3E%3Cpath d='M90 28v124M28 90h124M46 46l88 88M134 46l-88 88'/%3E%3C/g%3E%3C/svg%3E");
  background-size:180px 180px;
}

/* 14 — Security */
.arx-bg-security{
  background:
    radial-gradient(circle at 20% 20%,rgba(119,96,238,.12),transparent 25%),
    linear-gradient(145deg,#06080d,#111a28);
}

.arx-bg-security::before{
  inset:8%;
  opacity:.15;
  border:1px solid rgba(66,217,223,.35);
  border-radius:32px;
  box-shadow:
    0 0 0 36px rgba(66,217,223,.025),
    0 0 0 72px rgba(66,217,223,.018),
    0 0 0 108px rgba(66,217,223,.012);
}

/* 15 — AI */
.arx-bg-ai{
  background:
    radial-gradient(circle at 78% 20%,rgba(119,96,238,.18),transparent 28%),
    radial-gradient(circle at 22% 78%,rgba(66,217,223,.12),transparent 30%),
    linear-gradient(145deg,#05070c,#141028);
}

/* 16 — ESG */
.arx-bg-esg{
  background:
    radial-gradient(circle at 18% 22%,rgba(83,201,140,.18),transparent 26%),
    radial-gradient(circle at 82% 78%,rgba(66,217,223,.10),transparent 28%),
    linear-gradient(145deg,#06100c,#113026);
}

/* 17 — Executive */
.arx-bg-executive{
  background:
    radial-gradient(circle at 88% 12%,rgba(66,217,223,.10),transparent 24%),
    linear-gradient(145deg,#05070a,#111923);
}

.arx-bg-executive::before{
  opacity:.13;
  background:
    linear-gradient(120deg,transparent 0 49%,rgba(255,255,255,.12) 49.2% 49.4%,transparent 49.6% 100%);
  background-size:180px 180px;
}

/* 18 — Glass Overlay */
.arx-bg-glass::after{
  inset:18px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:var(--arx-radius-xl);
  background:rgba(255,255,255,.035);
  backdrop-filter:blur(18px);
}

/* 19 — Glow Engine */
.arx-bg-glow::before{
  opacity:.9;
  background:
    radial-gradient(circle at var(--arx-bg-x,70%) var(--arx-bg-y,30%),rgba(66,217,223,.15),transparent 24%);
}

/* 20 — Vignette */
.arx-bg-vignette::after{
  background:radial-gradient(circle at center,transparent 42%,rgba(0,0,0,.42) 100%);
}

/* Layer helpers */
.arx-bg-soft::before{opacity:var(--arx-bg-opacity-soft)}
.arx-bg-strong::before{opacity:var(--arx-bg-opacity-strong)}
.arx-bg-static::before,
.arx-bg-static::after{animation:none!important}

.arx-bg-mask-bottom::before,
.arx-bg-mask-bottom::after{
  mask-image:linear-gradient(to bottom,black 0 74%,transparent 100%);
}

.arx-bg-mask-center::before,
.arx-bg-mask-center::after{
  mask-image:radial-gradient(circle at center,black 0 58%,transparent 92%);
}

/* Keyframes */
@keyframes arxBgAurora{
  to{transform:rotate(360deg) scale(1.08)}
}

@keyframes arxBgDrift{
  to{background-position:240px 120px}
}

@keyframes arxBgData{
  to{background-position:340px 0}
}

@keyframes arxBgRadar{
  to{transform:translate(-50%,-50%) rotate(360deg)}
}

@keyframes arxBgEnergy{
  0%,100%{transform:translateY(0) scaleX(1)}
  50%{transform:translateY(-12px) scaleX(1.04)}
}

/* Safe auto-enhancement */
:where(.tc-page,.rai-page,.esg-page,.sic-page,.compliance-page) :where(.hero,.tc-hero,.rai-hero){
  isolation:isolate;
}

@media(max-width:760px){
  :root{
    --arx-bg-grid-size:42px;
    --arx-bg-dot-size:22px;
  }

  .arx-bg-glass::after{
    inset:8px;
    border-radius:var(--arx-radius-lg);
  }
}

@media(prefers-reduced-motion:reduce){
  .arx-bg::before,
  .arx-bg::after{
    animation:none!important;
  }
}