/**
 * THE LEGACY — Fundo Compartilhado
 * Imagem do mercado financeiro com overlay escuro + gradientes de cor
 * 
 * Uso: incluir <link rel="stylesheet" href="assets/css/fundo.css"> em qualquer página
 * 
 * Personalizar: trocar a URL da imagem na classe body::before abaixo
 */

/* ============================================================
   VARIÁVEIS GLOBAIS (opcional, se não estiverem definidas)
   ============================================================ */
:root{
  --legacy-bg:#07111f;
  --legacy-text:#f5f8fc;
  --legacy-orange:#ff6b00;
  --legacy-gold:#ffc247;
}

/* ============================================================
   BODY BASE
   ============================================================ */
body{
  background-color:var(--legacy-bg);
  color:var(--legacy-text);
  position:relative;
  min-height:100vh;
  overflow-x:hidden;
}

/* ============================================================
   CAMADA 1: IMAGEM DE FUNDO + OVERLAY ESCURO
   ============================================================ */
body::before{
  content:"";
  position:fixed;
  inset:0;
  background:
    linear-gradient(135deg,
      rgba(7,17,31,.94),
      rgba(9,26,46,.88) 50%,
      rgba(7,17,31,.96)
    ),
    url('https://images.unsplash.com/photo-1611974789855-9c2a0a7236a3?auto=format&fit=crop&w=1920&q=85')
    center center / cover no-repeat;
  z-index:-2;
  pointer-events:none;
}

/* ============================================================
   CAMADA 2: GRADIENTES DE COR (laranja + amarelo)
   ============================================================ */
body::after{
  content:"";
  position:fixed;
  inset:0;
  background:
    radial-gradient(circle at 15% 20%, rgba(255,107,0,.18), transparent 45%),
    radial-gradient(circle at 85% 80%, rgba(255,194,71,.12), transparent 45%);
  z-index:-1;
  pointer-events:none;
}

/* ============================================================
   GARANTIR QUE CARDS E CONTEÚDO FIQUEM ACIMA
   ============================================================ */
.container,
.card,
.content{
  position:relative;
  z-index:1;
}