/* =====================================================
   BP CAPITAL INVESTIMENTOS — estilos compartilhados
   Paleta: verde-escuro profundo + dourado champagne
===================================================== */

html { scroll-behavior: smooth; }
body {
  background: #07130D;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
::selection { background: #C9A227; color: #07130D; }

/* ---- Header fixo ---- */
.site-header {
  background: rgba(7, 19, 13, .82);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(227, 197, 103, .12);
}

/* ---- Glow dourado do hero ---- */
@keyframes heroGlow {
  0%, 100% { opacity: .5; transform: translate(-50%, -30%) scale(1); }
  50%      { opacity: .75; transform: translate(-50%, -30%) scale(1.08); }
}
.hero-glow {
  position: absolute; left: 50%; top: 32%;
  width: 880px; height: 880px; max-width: 170vw;
  transform: translate(-50%, -30%);
  background: radial-gradient(circle, rgba(201,162,39,.16) 0%, rgba(201,162,39,.05) 40%, transparent 66%);
  animation: heroGlow 7s ease-in-out infinite;
  pointer-events: none; will-change: transform, opacity;
}

/* ---- Linha dourada estilo gráfico de mercado ---- */
.spark { position: absolute; inset: auto 0 0 0; width: 100%; height: 42%; opacity: .5; pointer-events: none; }
@keyframes drawLine { to { stroke-dashoffset: 0; } }
.spark .spark-path {
  fill: none; stroke: url(#goldStroke); stroke-width: 1.5;
  stroke-dasharray: 1600; stroke-dashoffset: 1600;
  animation: drawLine 3s cubic-bezier(.4,0,.2,1) .4s forwards;
}
.spark .spark-area { fill: url(#goldFill); opacity: 0; animation: fadeArea 1.6s ease 2s forwards; }
@keyframes fadeArea { to { opacity: 1; } }
@keyframes dotPulse { 0%,100% { opacity: .9; r: 3; } 50% { opacity: .3; r: 5; } }
.spark .spark-dot { fill: #E3C567; animation: dotPulse 2.4s ease-in-out 3.2s infinite; }

/* ---- Botão dourado ---- */
.btn-gold {
  background: linear-gradient(180deg, #E3C567, #C9A227);
  color: #07130D;
  box-shadow: 0 6px 28px rgba(201,162,39,.28), inset 0 1px 0 rgba(255,255,255,.35);
  transition: transform .18s ease, box-shadow .25s ease, filter .25s ease;
  will-change: transform;
}
.btn-gold:hover  { transform: translateY(-2px); filter: brightness(1.06); box-shadow: 0 10px 36px rgba(201,162,39,.4), inset 0 1px 0 rgba(255,255,255,.35); }
.btn-gold:active { transform: scale(.98); }

.btn-outline {
  border: 1px solid rgba(227,197,103,.45);
  color: #E3C567;
  transition: border-color .2s ease, background .2s ease, transform .18s ease;
}
.btn-outline:hover { border-color: #E3C567; background: rgba(201,162,39,.08); transform: translateY(-2px); }

/* ---- Cards glass + filete dourado ---- */
.glass {
  background: rgba(245,242,234,.025);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(245,242,234,.08);
  transition: border-color .25s ease, box-shadow .25s ease, transform .25s ease;
}
.glass:hover {
  border-color: rgba(227,197,103,.55);
  box-shadow: 0 0 26px rgba(201,162,39,.1), inset 0 0 20px rgba(201,162,39,.04);
  transform: translateY(-3px);
}
a.glass { display: block; }

/* ---- Reveal no scroll ---- */
.reveal { opacity: 0; transform: translateY(26px); transition: opacity .7s ease, transform .7s cubic-bezier(.22,1,.36,1); will-change: transform, opacity; }
.reveal.in { opacity: 1; transform: translateY(0); }
.reveal-d1 { transition-delay: .08s; } .reveal-d2 { transition-delay: .16s; }
.reveal-d3 { transition-delay: .24s; } .reveal-d4 { transition-delay: .32s; }

/* ---- Headline stagger ---- */
.word { display: inline-block; will-change: transform, opacity; }

/* ---- Divisor dourado entre seções ---- */
.gold-divider {
  height: 1px; max-width: 1024px; margin: 0 auto;
  background: linear-gradient(90deg, transparent, rgba(227,197,103,.35), transparent);
}

/* ---- Timeline vertical ---- */
.tl-line { background: linear-gradient(to bottom, rgba(201,162,39,.55), rgba(201,162,39,.06)); }
.tl-dot  { box-shadow: 0 0 0 4px rgba(201,162,39,.12), 0 0 14px rgba(201,162,39,.5); }

/* ---- FAQ accordion ---- */
.faq-body { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .35s cubic-bezier(.22,1,.36,1); }
.faq-item.open .faq-body { grid-template-rows: 1fr; }
.faq-body > div { overflow: hidden; }
.faq-chevron { transition: transform .3s ease; }
.faq-item.open .faq-chevron { transform: rotate(45deg); }
.faq-item.open { border-color: rgba(227,197,103,.5); }

/* ---- Tabela comparativa ---- */
.cmp-table th, .cmp-table td { padding: .9rem 1rem; text-align: left; }
.cmp-table tr + tr { border-top: 1px solid rgba(245,242,234,.07); }

/* ---- Menu / drawer mobile ---- */
#drawer { transform: translateX(100%); transition: transform .32s cubic-bezier(.22,1,.36,1); }
#drawer.open { transform: translateX(0); }
#drawer-overlay { opacity: 0; pointer-events: none; transition: opacity .3s ease; }
#drawer-overlay.open { opacity: 1; pointer-events: auto; }

/* ---- Dropdown Soluções (desktop) ---- */
.nav-drop { opacity: 0; transform: translateY(8px); pointer-events: none; transition: opacity .2s ease, transform .2s ease; }
.nav-group:hover .nav-drop, .nav-group:focus-within .nav-drop { opacity: 1; transform: translateY(0); pointer-events: auto; }

/* ---- Botão WhatsApp flutuante ---- */
@keyframes waRing { 0% { box-shadow: 0 0 0 0 rgba(201,162,39,.45); } 100% { box-shadow: 0 0 0 14px rgba(201,162,39,0); } }
.wa-float { animation: waRing 2.6s ease-out infinite; }

/* ---- Formulários ---- */
.field {
  width: 100%;
  background: rgba(245,242,234,.04);
  border: 1px solid rgba(245,242,234,.14);
  border-radius: .75rem;
  padding: .85rem 1rem;
  color: #F5F2EA;
  transition: border-color .2s ease, box-shadow .2s ease;
}
.field::placeholder { color: rgba(245,242,234,.35); }
.field:focus { outline: none; border-color: #C9A227; box-shadow: 0 0 0 3px rgba(201,162,39,.15); }

/* ---- Fotos: hero de fundo, cards e laterais ---- */
.hero-photo { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
.hero-photo img, .hero-photo video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .2; filter: saturate(.55) brightness(.8); }
.hero-photo::after { content: ''; position: absolute; inset: 0; background: linear-gradient(to bottom, rgba(7,19,13,.6), rgba(7,19,13,.3) 45%, #07130D 97%); }

.card-img { position: relative; border-radius: .75rem; overflow: hidden; aspect-ratio: 16/10; margin-bottom: 1.25rem; }
.card-img img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.7); transition: transform .5s ease; will-change: transform; }
.glass:hover .card-img img { transform: scale(1.06); }
.card-img::after { content: ''; position: absolute; inset: 0; background: linear-gradient(to top, rgba(7,19,13,.5), rgba(201,162,39,.06)); }

.img-duo { position: relative; border-radius: 1rem; overflow: hidden; border: 1px solid rgba(227,197,103,.2); }
.img-duo img { width: 100%; height: 100%; object-fit: cover; display: block; filter: saturate(.65) contrast(1.05); }
.img-duo::after { content: ''; position: absolute; inset: 0; background: linear-gradient(160deg, rgba(201,162,39,.16), rgba(7,19,13,.5) 70%); mix-blend-mode: multiply; }

/* ---- Acessibilidade ---- */
a:focus-visible, button:focus-visible { outline: 2px solid #E3C567; outline-offset: 3px; border-radius: 4px; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition-duration: .01ms !important; }
  .reveal { opacity: 1; transform: none; }
  .spark .spark-path { stroke-dashoffset: 0; }
  .spark .spark-area { opacity: 1; }
  .hero-photo video { display: none; }
  html { scroll-behavior: auto; }
}