/* REVOS layout + background theme for Pixel Hub Host */
:root {
  --fundo: #1F2226 !important;
  --fundo-sec: #2B2F36 !important;
  --azul: #1E8FD6 !important;
  --neon: #2FB8FF !important;
  --texto: #F6F9FC !important;
  --texto-sec: #C5CED8 !important;
  --borda-suave: #3A414A !important;
}

html, body {
  background: var(--fundo) !important;
  color: var(--texto-sec) !important;
}

/* Desliga fundos dinâmicos/partículas para manter fundo uniforme */
#phh-bg-particles,
#phh-glow-bg,
canvas#phh-bg-particles,
canvas#phh-glow-bg {
  display: none !important;
}

body::before,
body::after,
.section-cta::before,
.section-worlds::before,
.section-standard::before,
.faq-section::before,
.faq-section::after {
  background: none !important;
  background-image: none !important;
  content: none !important;
}

header.phh-header,
.phh-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 1000 !important;
  background: var(--fundo) !important;
  border-bottom: 1px solid var(--borda-suave) !important;
  backdrop-filter: none !important;
}

.phh-topbar {
  border-bottom: 1px solid rgba(246, 249, 252, 0.14) !important;
}

.phh-container {
  max-width: 1200px !important;
  margin: 0 auto !important;
  padding: 16px 20px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 24px !important;
}

.phh-logo,
.phh-logo span,
nav.phh-nav a,
.phh-mobile a,
.hero-title,
.phh-hero-title,
.section-title,
h1, h2, h3 {
  color: var(--texto) !important;
  text-shadow: none !important;
}

nav.phh-nav a:hover,
.phh-mobile a:hover,
a:hover {
  color: var(--neon) !important;
}

.phh-mobile {
  background: var(--fundo-sec) !important;
  border-bottom: 1px solid var(--borda-suave) !important;
}

/* HERO layout estilo Revos */
.phh-hero,
.hero-section,
#hero,
main,
section {
  background: var(--fundo) !important;
  background-image: none !important;
}

.phh-hero-content,
.hero-container,
.hero-content {
  max-width: 1200px !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: minmax(320px, 1fr) minmax(280px, 420px) !important;
  align-items: center !important;
  gap: 40px !important;
}

.hero-subtitle,
.phh-hero-desc,
.section-subtitle,
p,
li,
small,
.phh-copy {
  color: var(--texto-sec) !important;
}

.phh-hero-btn,
.btn-hero,
.plan-btn,
.extras-btn,
.discord-btn,
button,
.btn {
  background: var(--neon) !important;
  color: #F6F9FC !important;
  border: none !important;
  box-shadow: none !important;
}

.phh-hero-btn:hover,
.btn-hero:hover,
.plan-btn:hover,
.extras-btn:hover,
.discord-btn:hover,
button:hover,
.btn:hover {
  background: var(--azul) !important;
  color: #F6F9FC !important;
}

/* cards/superfícies */
.feature-card,
.card-standard,
.plan-card,
.faq-item,
.faq-answer,
.world-card,
.phh-mobile,
.phh-socials a,
.plan-summary,
.dashboard-section,
.server-card,
.panel-card,
.modal-content,
.config-container {
  background: var(--fundo-sec) !important;
  border-color: var(--borda-suave) !important;
  color: var(--texto-sec) !important;
  box-shadow: none !important;
}

/* Mantém imagens de fundo dos cards de jogos/planos */
.game-card {
  background-color: var(--fundo-sec) !important;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}

.feature-card h2,
.card-standard h3,
.plan-header h2,
.faq-question,
.game-card h3,
.world-card h3 {
  color: var(--texto) !important;
}

.feature-card i,
.card-standard i,
.plan-features li .icon-svg,
.faq-question svg,
.phh-nav i,
.phh-mobile i,
.world-card i,
.game-card i {
  color: var(--neon) !important;
}

/* remove brilhos fortes antigos */
.vcore-glow,
.plan-card.mais-vendido,
.plan-card:hover,
.feature-card:hover,
.card-standard:hover,
.game-card:hover,
.faq-item:hover,
.phh-burger:hover,
.phh-socials a:hover {
  text-shadow: none !important;
  box-shadow: none !important;
}

/* Footer na MESMA cor do fundo */
footer.phh-footer,
.phh-footer,
#footer-pixelzap,
.footer-darkbot {
  background: var(--fundo) !important;
  border-top: 1px solid var(--borda-suave) !important;
  color: var(--texto-sec) !important;
}

.phh-foot-links h4,
.phh-foot-social h4,
.footer-links h4,
.footer-legal h4,
.footer-community h4 {
  color: var(--texto) !important;
}

.phh-foot-links a,
.footer-links a,
.footer-legal a,
.phh-foot-brand p,
.footer-bottom,
.footer-community p,
.phh-copy {
  color: var(--texto-sec) !important;
}

@media (max-width: 900px) {
  .phh-hero-content,
  .hero-container,
  .hero-content {
    grid-template-columns: 1fr !important;
    text-align: center !important;
  }
}