/* Pilotos de Cristo — Patch v17 */

/* Remove spark particles */
[style*="sparkFloat"] { display: none !important; opacity: 0 !important; }
.hero-logo-wrap::before { display: none !important; animation: none !important; }

/* Reveal fix — força visibilidade independente de scroll */
.reveal { opacity: 1 !important; transform: none !important; transition: none !important; }

/* =============================================
   SECTION DARK — fundo escuro e texto branco
   ============================================= */
.section-dark {
  background: #0d0d0d !important;
  color: #ffffff !important;
}
.section-dark .section-title,
.section-dark h1, .section-dark h2, .section-dark h3, .section-dark h4 {
  color: #ffffff !important;
}
/* Inline dark backgrounds */
[style*="background:var(--dark"] h1,
[style*="background:var(--dark"] h2,
[style*="background:var(--dark"] h3,
[style*="background:var(--dark"] h4 {
  color: #ffffff !important;
}
[style*="background:var(--black"] h1,
[style*="background:var(--black"] h2,
[style*="background:var(--black"] h3 {
  color: #ffffff !important;
}
/* Section title escuro por padrão (fundo claro); branco só em .section-dark */
.section-title { color: #0d0d0d !important; }
.section-dark .section-title { color: #ffffff !important; }

/* Support ways */
.support-way h4 { color: #ffffff !important; }
.support-way p { color: rgba(255,255,255,0.75) !important; }

/* Donation card hover — fundo escuro com borda vermelha */
.donation-card:hover,
.donation-card.selected {
  background: #1a0505 !important;
  border-color: #cc0000 !important;
  transform: translateY(-4px) !important;
}
.donation-card:hover .amount,
.donation-card.selected .amount {
  color: #ffffff !important;
}

/* Hero — fundo branco */
.hero { background: #ffffff !important; }
.hero-bg { background: #ffffff !important; }
.hero-bg::before, .hero-bg::after { display: none !important; content: none !important; background: none !important; }
.hero-content::before { display: none !important; content: none !important; }

/* =============================================
   HERO PILOT COMPOSITION — topfuel + logo
   ============================================= */
.hero-pilot-composition {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  box-shadow: 0 12px 48px rgba(0,0,0,0.22) !important;
}
.hero-topfuel-img {
  width: 100% !important;
  height: auto !important;
  display: block !important;
  animation: topfuelRide 5s ease-in-out infinite !important;
  max-height: 520px !important;
  object-fit: cover !important;
  object-position: center top !important;
}
@keyframes topfuelRide {
  0%   { transform: scale(1) translateX(0); }
  25%  { transform: scale(1.03) translateX(4px); }
  50%  { transform: scale(1.05) translateX(0px); }
  75%  { transform: scale(1.03) translateX(-4px); }
  100% { transform: scale(1) translateX(0); }
}
/* Overlay gradiente na imagem para destacar o logo */
.hero-pilot-composition::after {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(135deg,
    rgba(204,0,0,0.08) 0%,
    transparent 50%,
    rgba(0,0,0,0.35) 100%) !important;
  pointer-events: none !important;
  z-index: 1 !important;
}
/* Logo sobre a foto do piloto */
.hero-logo-overlay {
  position: absolute !important;
  bottom: 14px !important;
  right: 14px !important;
  width: clamp(80px, 28%, 160px) !important;
  z-index: 2 !important;
  filter: drop-shadow(0 4px 18px rgba(204,0,0,0.6)) drop-shadow(0 0 30px rgba(0,0,0,0.9)) !important;
  animation: logoFloatOver 3.2s ease-in-out infinite !important;
}
@keyframes logoFloatOver {
  0%, 100% { transform: translateY(0) scale(1); }
  50%       { transform: translateY(-7px) scale(1.04); }
}

/* Hero visual sem background */
.hero-visual { background: transparent !important; border-radius: 0 !important; }

/* HERO LOGO — standalone (usado quando não há topfuel) */
@keyframes heroLogoPulse {
  0%   { transform: translateY(0px) scale(1) rotate(-0.5deg); }
  20%  { transform: translateY(-10px) scale(1.03) rotate(0.8deg); }
  45%  { transform: translateY(-20px) scale(1.06) rotate(-0.5deg); }
  70%  { transform: translateY(-10px) scale(1.03) rotate(0.3deg); }
  100% { transform: translateY(0px) scale(1) rotate(-0.5deg); }
}
.hero-logo {
  width: clamp(460px, 56vw, 860px) !important;
  animation: heroLogoPulse 3s ease-in-out infinite !important;
  filter: drop-shadow(0 10px 28px rgba(0,0,0,0.18)) !important;
}

.hero-title { color: #1a1a1a !important; }
.hero-statement {
  font-family: var(--font-heading);
  font-size: clamp(1.05rem, 1.7vw, 1.45rem);
  line-height: 1.4;
  color: #2a2a2a;
  margin: 0.2rem 0 1rem;
  max-width: 30ch;
}
.hero-statement strong { color: var(--red); font-weight: 800; }
.hero-tagline { color: #555 !important; }
.hero .btn-outline { color: #1a1a1a !important; border-color: rgba(0,0,0,0.3) !important; background: transparent !important; }

/* HERO CONTENT — 2 colunas (texto | logo centralizado) */
@media (min-width: 901px) {
  .hero-content-3col {
    grid-template-columns: 1fr 1fr !important;
    gap: 30px !important;
    align-items: center !important;
  }
  .hero-content-3col .hero-visual {
    justify-content: center !important;
    margin-left: 50px !important;
    position: relative !important;
  }
  .hero-content-3col .hero-visual::after {
    content: '' !important;
    position: absolute !important;
    width: 78% !important; height: 78% !important;
    top: 50% !important; left: 50% !important;
    transform: translate(-50%, -50%) !important;
    background: radial-gradient(circle, rgba(204,0,0,0.12) 0%, rgba(204,0,0,0.04) 45%, rgba(204,0,0,0) 70%) !important;
    border-radius: 50% !important;
    z-index: 0 !important;
    pointer-events: none !important;
  }
}

/* Stats */
.stats-strip { background: #e8e8e8 !important; border-top: 1px solid #d0d0d0 !important; border-bottom: 1px solid #d0d0d0 !important; }
.stats-strip .stat-number { color: #cc0000 !important; }
.stats-strip .stat-label { color: #555 !important; }
.stats-strip .stat-divider { background: #c8c8c8 !important; }

/* Sponsors */
.sponsors-track, .sponsors-inner { display: flex !important; flex-wrap: wrap !important; width: auto !important; animation: none !important; gap: 28px !important; justify-content: center !important; align-items: center !important; padding: 24px 0 !important; }
.sponsor-item { width: 240px !important; height: 130px !important; display: flex !important; align-items: center !important; justify-content: center !important; background: #fff !important; border: 1px solid #eee !important; border-radius: 10px !important; padding: 14px !important; box-sizing: border-box !important; }
.sponsor-item a { display: flex !important; align-items: center !important; justify-content: center !important; width: 100% !important; height: 100% !important; padding: 0 !important; }
.sponsor-item img { width: 210px !important; height: 100px !important; object-fit: contain !important; display: block !important; max-width: none !important; max-height: none !important; }

/* =============================================
   NAVBAR — fundo preto
   ============================================= */
.navbar { background: #0d0d0d !important; border-bottom: 2px solid #cc0000 !important; box-shadow: 0 2px 20px rgba(0,0,0,0.5) !important; }
.navbar .nav-link { color: rgba(255,255,255,0.85) !important; }
.navbar .nav-link:hover,
.navbar .nav-link.active { color: #cc0000 !important; }
.navbar .nav-link.active::after { background: #cc0000 !important; }
.navbar .brand-text { color: #ffffff !important; }
.navbar .brand-text span { color: rgba(255,255,255,0.6) !important; }
.navbar .nav-cta { background: #cc0000 !important; color: #fff !important; border-radius: 6px !important; padding: 6px 14px !important; }
.navbar .nav-cta:hover { background: #aa0000 !important; color: #fff !important; }
.hamburger span { background: #ffffff !important; }

/* LOGO NAVBAR — força branco + animação */
.navbar-brand img {
  filter: brightness(0) invert(1) !important;
  animation: navLogoRide 2.8s ease-in-out infinite !important;
  transform-origin: bottom center !important;
}
@keyframes navLogoRide {
  0%   { transform: translateY(0px) rotate(-1deg); }
  25%  { transform: translateY(-3px) rotate(0deg); }
  50%  { transform: translateY(-5px) rotate(1.5deg); }
  75%  { transform: translateY(-2px) rotate(0deg); }
  100% { transform: translateY(0px) rotate(-1deg); }
}

/* =============================================
   CONTAGIROS (TACHOMETER)
   ============================================= */
.hero-tach-col {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
}

#tach-canvas {
  filter: drop-shadow(0 0 22px rgba(204,0,0,0.3)) drop-shadow(0 0 6px rgba(0,0,0,0.6)) !important;
  border-radius: 50% !important;
}

.tach-rpm-num {
  font-family: 'Courier New', monospace !important;
  font-size: 1.35rem !important;
  font-weight: bold !important;
  color: #cc0000 !important;
  letter-spacing: 2px !important;
  min-width: 90px !important;
  text-align: center !important;
  text-shadow: 0 0 8px rgba(204,0,0,0.4) !important;
}

.tach-rpm-unit {
  font-size: 0.62rem !important;
  color: #777 !important;
  letter-spacing: 4px !important;
  text-transform: uppercase !important;
}

@media (max-width: 900px) {
  .hero-tach-col { display: none !important; }
}

/* =============================================
   BOTÃO WHATSAPP — lado esquerdo
   ============================================= */
.whatsapp-float { position: fixed !important; bottom: 28px !important; left: 28px !important; right: auto !important; width: 62px !important; height: 62px !important; background: #25d366 !important; border-radius: 50% !important; display: flex !important; align-items: center !important; justify-content: center !important; color: #fff !important; font-size: 32px !important; box-shadow: 0 4px 20px rgba(37,211,102,0.45) !important; z-index: 9999 !important; text-decoration: none !important; transition: transform 0.2s, box-shadow 0.2s !important; }
.whatsapp-float:hover { transform: scale(1.1) !important; box-shadow: 0 6px 28px rgba(37,211,102,0.6) !important; color: #fff !important; }
.wa-tooltip { display: none !important; position: absolute !important; left: 72px !important; right: auto !important; background: #1a1a1a !important; color: #fff !important; font-size: 0.75rem !important; padding: 6px 12px !important; border-radius: 6px !important; white-space: nowrap !important; pointer-events: none !important; }
.whatsapp-float:hover .wa-tooltip { display: block !important; }


/* ===== PILOTOS DE CRISTO — HERO ESTILO CORRIDA (claro, sobrio) ===== */
.hero{ position: relative; overflow: hidden; background: #ffffff !important; }
.hero-circle,.hero-dots{ display: none !important; }
.hero-bg{
  position:absolute !important; inset:0 !important; z-index:0 !important;
  background-image: conic-gradient(#cfd2d6 90deg, transparent 90deg 180deg, #cfd2d6 180deg 270deg, transparent 270deg) !important;
  background-size:74px 74px !important; opacity:.16 !important;
  transform: skewX(-10deg) rotate(-6deg) !important;
  -webkit-mask: radial-gradient(120% 100% at 78% 32%, #000 32%, transparent 70%) !important;
          mask: radial-gradient(120% 100% at 78% 32%, #000 32%, transparent 70%) !important;
  pointer-events:none; }
.hero .container{ position:relative; z-index:1; }
.hero-title{ font-size:clamp(3.4rem,6.8vw,6.2rem) !important; font-style: normal !important; color:#141414 !important; letter-spacing:-1px; }
.hero-title .highlight{ color:#e10600 !important; }
.hero-eyebrow{ color:#e10600 !important; letter-spacing:4px; }
.hero-statement strong{ color:#141414 !important; }
.hero-visual img{ display:none !important; }
.hero-visual{
  width:min(58vw,820px) !important; max-width:820px !important; min-height:min(46vw,470px);
  background:center / contain no-repeat url("data:image/svg+xml,<svg viewBox='0 0 1100 600' xmlns='http://www.w3.org/2000/svg'><defs><linearGradient id='body' x1='0' y1='0' x2='0' y2='1'><stop offset='0' stop-color='%232b2e33'/><stop offset='1' stop-color='%23101113'/></linearGradient><linearGradient id='rim' x1='0' y1='0' x2='1' y2='1'><stop offset='0' stop-color='%23eef0f2'/><stop offset='1' stop-color='%23a9adb2'/></linearGradient></defs><ellipse cx='540' cy='556' rx='470' ry='26' fill='%23000' opacity='.10'/><g fill='%2315171a'><rect x='720' y='150' width='300' height='18' rx='4'/><rect x='724' y='150' width='12' height='150'/><rect x='1006' y='150' width='12' height='150'/><rect x='720' y='176' width='300' height='10' rx='3' fill='%23e10600'/></g><circle cx='838' cy='470' r='116' fill='%230c0d0e'/><circle cx='838' cy='470' r='116' fill='none' stroke='%23202327' stroke-width='5'/><circle cx='838' cy='470' r='50' fill='url(%23rim)'/><circle cx='838' cy='470' r='50' fill='none' stroke='%237d8086' stroke-width='2'/><g stroke='%239a9da2' stroke-width='6'><line x1='838' y1='470' x2='838' y2='424'/><line x1='838' y1='470' x2='877' y2='493'/><line x1='838' y1='470' x2='799' y2='493'/></g><circle cx='838' cy='470' r='9' fill='%23e10600'/><path d='M120 508 L700 472 L760 488 L150 524 Z' fill='url(%23body)'/><path d='M560 472 C600 422 660 410 720 416 C760 420 786 448 788 488 C700 500 620 500 560 494 Z' fill='url(%23body)'/><path d='M724 470 C724 432 780 436 784 478 L724 478 Z' fill='%23e10600' opacity='.9'/><path d='M612 472 C612 432 700 432 700 474' fill='none' stroke='%2334383d' stroke-width='8' stroke-linecap='round'/><circle cx='650' cy='454' r='20' fill='%2315171a'/><path d='M642 452 a8 8 0 0 1 16 0' fill='%23e10600'/><rect x='700' y='432' width='48' height='44' rx='4' fill='%231a1c1f'/><g stroke='%23cfd2d6' stroke-width='6' stroke-linecap='round' fill='none'><path d='M712 434 L726 408'/><path d='M724 434 L740 408'/><path d='M736 434 L754 408'/></g><path d='M120 502 L66 494 L66 504 L120 512 Z' fill='%2315171a'/><path d='M150 510 l40 -6 l0 10 l-40 6 Z' fill='%23e10600' opacity='.85'/><circle cx='190' cy='522' r='30' fill='%230c0d0e' stroke='%23202327' stroke-width='4'/><circle cx='190' cy='522' r='11' fill='url(%23rim)'/></svg>") !important;
}
.navbar-brand img{ height:60px !important; }
.navbar-brand .brand-text{ font-size:1.4rem !important; }
.navbar-brand .brand-text span{ font-size:.72rem !important; }
@media (max-width:768px){
  .hero-title{ font-size:3.6rem !important; }
  .hero-visual{ min-height:240px; }
  .hero-bg{ opacity:.10 !important; }
  .navbar-brand img{ height:48px !important; }
}


/* ===== HERO — imagem de fundo personalizada (carro Pilotos de Cristo) ===== */
.hero-bg{
  background:#f2f3f3 url('../Capa%202') right top / auto 88% no-repeat !important;
  opacity:1 !important; transform:none !important;
  -webkit-mask:none !important; mask:none !important; inset:0 !important;
}
.hero-visual{ display:none !important; }

.hero{ background:#f2f3f3 !important; }
