/* ============================================================
   ALPHA7 — v8 : camada azul-petróleo (energy trading / comex)
   Preto/grafite continua a base premium (hero, header, footer);
   azul-petróleo entra em seções operacionais, overlays e cards.
   Dourado segue como acento; vermelho só na marca.
   ============================================================ */

:root {
  --petrol:        #0d1b26;
  --petrol-2:      #0a141d;
  --petrol-deep:   #081019;
  --petrol-card:   #0f1f2b;
  --petrol-card-2: #132837;
  --petrol-line:   rgba(120, 170, 200, 0.11);
  --petrol-text:   #a4b4bf;
}

/* ---------- 1) HERO: leve overlay azul-petróleo (mantém cinematográfico) ---------- */
.hero-overlay {
  background:
    linear-gradient(180deg, rgba(8,8,10,0.42) 0%, rgba(8,8,10,0.14) 32%, rgba(8,13,18,0.64) 78%, rgba(6,10,14,0.95) 100%),
    radial-gradient(120% 80% at 18% 100%, rgba(13,40,58,0.40), transparent 60%),
    radial-gradient(110% 70% at 86% 6%, rgba(58,13,20,0.22), transparent 55%) !important;
}

/* ---------- 2) PRODUTOS, MERCADOS E OPERAÇÕES: painel azul-petróleo ---------- */
#setores {
  background: linear-gradient(165deg, var(--petrol) 0%, var(--petrol-2) 55%, var(--petrol-deep) 100%);
}
#setores .prod-grid { background: var(--petrol-line); border-color: var(--petrol-line); }
.prod-card { background: var(--petrol-card); }
.prod-card:hover { background: var(--petrol-card-2); }
.prod-card p { color: var(--petrol-text); }
.prod-n { color: rgba(160, 190, 210, 0.45); }
#setores .prod-callout { border-color: var(--petrol-line); }
#setores .prod-callout p { color: #8fa3af; }
#setores .prod-correlated { border-color: var(--petrol-line); }
#setores .prod-correlated .pc-list { color: #7d919d; }

/* ---------- 3) MERCADOS CONECTADOS: tom marítimo ---------- */
.gband { background: linear-gradient(160deg, #0c1822 0%, #091219 60%, #070d13 100%); }
.gband-map { background-image: radial-gradient(rgba(130, 185, 220, 0.13) 1.1px, transparent 1.2px); }
.gband-glow { background: radial-gradient(circle, rgba(16, 52, 74, 0.42), transparent 64%); }

/* ---------- 4) A EMPRESA: overlay petróleo + dourado no bloco visual ---------- */
#sobre .scene::after {
  background:
    repeating-linear-gradient(0deg, rgba(0,0,0,0.10) 0 1px, transparent 1px 3px),
    linear-gradient(165deg, rgba(13,42,60,0.30), rgba(8,18,28,0.42) 72%),
    radial-gradient(80% 55% at 82% 0%, rgba(201,162,75,0.12), transparent 60%),
    radial-gradient(90% 80% at 50% 45%, transparent 42%, rgba(0,0,0,0.5) 100%);
}

/* ---------- 5) FRENTES DE ATUAÇÃO: variação grafite / navy ---------- */
.cards-grid { background: var(--petrol-line); border-color: var(--petrol-line); }
.area-card:nth-child(even) { background: var(--petrol-card); }
.area-card:nth-child(even):hover { background: var(--petrol-card-2); }
.area-card:nth-child(even) p { color: var(--petrol-text); }

/* bloco Comércio Exterior (destaque comex = azul-petróleo + moldura dourada) */
.area-wide {
  background: linear-gradient(160deg, #102131 0%, #0c1622 100%);
  border-color: rgba(201,162,75,0.28);
}
.area-wide:hover { background: linear-gradient(160deg, #132839 0%, #0e1a29 100%); }
.area-wide .aw-body p { color: var(--petrol-text); }

/* ---------- 6) BANDA INSTITUCIONAL (vídeo): overlay petróleo ---------- */
.vband-overlay {
  background:
    radial-gradient(90% 80% at 50% 40%, rgba(8,12,16,0.34), rgba(6,9,13,0.86)),
    radial-gradient(120% 90% at 80% 0%, rgba(13,40,58,0.38), transparent 55%);
}

/* ---------- 7) INSIGHTS: leve esfriada nos thumbs (marítimo) ---------- */
#insights .scene { border-color: var(--petrol-line); }

/* ---------- 8) HERO ROTATIVO (duas mensagens em crossfade) ---------- */
.hero-rotator { position: relative; margin: 18px 0 14px; min-height: 130px; }
.hr-slide {
  position: absolute; left: 0; top: 0; width: 100%;
  opacity: 0; transform: translateY(16px);
  transition: opacity 1s var(--ease), transform 1s var(--ease);
  pointer-events: none;
}
.hr-slide.is-active { opacity: 1; transform: none; pointer-events: auto; }
.hr-tag {
  display: inline-flex; align-items: center; gap: 12px;
  font-family: var(--ff-mono); font-size: 13px; font-weight: 600;
  letter-spacing: 0.28em; text-transform: uppercase; color: var(--gold-lt);
}
.hr-tag::before { content: ""; width: 30px; height: 1px; background: var(--gold-grad); }
.hr-line {
  margin-top: 12px; max-width: 640px;
  font-size: clamp(19px, 2.2vw, 30px); font-weight: 600;
  letter-spacing: -0.02em; line-height: 1.3; color: #ece9e3;
  text-shadow: 0 2px 30px rgba(0,0,0,0.45);
}
.hero-support {
  max-width: 580px; font-size: 14.5px; line-height: 1.6;
  color: rgba(236,233,227,0.62); margin-bottom: 34px;
}
body.no-motion .hr-slide { transition: none; }

/* rotas comerciais sutis sobre o vídeo do hero */
.hero-routes {
  position: absolute; right: -5%; top: 6%; width: min(46%, 620px);
  z-index: 1; opacity: .14; pointer-events: none;
}
.hero-routes .tl-route path { animation: gband-dash 6s linear infinite; }
body.no-motion .hero-routes .tl-route path { animation: none; }
@media (max-width: 760px) {
  .hero-routes { display: none; }
  .hero-rotator { min-height: 175px; }
}

/* entrada cinematográfica dos novos elementos */
@media (prefers-reduced-motion: no-preference) {
  body:not(.no-motion) .hero .hero-rotator { animation: cine-rise 1.1s var(--ease) .45s both; }
  body:not(.no-motion) .hero .hero-support { animation: cine-rise 1.1s var(--ease) .6s both; }
}

/* Hero, header, footer, pband (parceria) e contato permanecem
   preto/grafite/vinho — assinatura premium ALPHA7. */