/* GhostEncryptor — Neon Glass */
:root{
  --bg:#0a0a10;
  --panel:#14141b;
  --cyan:#1fd4ff;
  --cyan-20: rgba(31,212,255,.20);
  --cyan-40: rgba(31,212,255,.40);
  --text:#ffffff;
  --muted:#b9c3cf;
}
*{ box-sizing:border-box }
html,body{ height:100% }
body{
  background:var(--bg);
  color:var(--text);
  font-family: "Inter", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}
.fw-800{ font-weight:800; }
.fw-600{ font-weight:600; }

/* NAVBAR */
.bg-ghost{
  background: linear-gradient(180deg,#0f1118 0%, #0d1016 100%);
  border-bottom: 1px solid rgba(255,255,255,.04);
}
.navbar .nav-link{ color:#bcd1e0; }
.navbar .nav-link:hover, .navbar .nav-link.active{ color:#fff; }

/* BOTÕES */
.btn-ghost{
  background: linear-gradient(180deg, var(--cyan) 0%, #2ab7ff 100%);
  color:#001018; border:0; font-weight:700;
  box-shadow: 0 6px 18px var(--cyan-20), inset 0 0 0 1px rgba(255,255,255,.12);
}
.btn-ghost:hover{ filter:brightness(1.05) }
.btn-outline-ghost{
  color:#e8f7ff; border:1px solid var(--cyan-40);
  background: rgba(20,20,27,.35);
}
.btn-outline-ghost:hover{ background: rgba(20,20,27,.55); }

/* HERO */
.hero-ghost{
  background-position:center;
  background-size:cover;
  min-height: 72vh;
  display:flex; align-items:center;
  border-bottom: 1px solid rgba(255,255,255,.06);
  box-shadow: 0 20px 60px rgba(0,0,0,.35);
}
.hero-inner{ padding: 5.5rem 0; }

/* PAINEL VIDRO */
.panel-ghost{
  background: linear-gradient(180deg,#0e0f15 0%, #12131a 100%);
}
.feature-card{
  background: rgba(20,20,27,.55);
  border-radius: 16px;
  padding: 2rem;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  box-shadow: 0 12px 38px rgba(0,0,0,.35), 0 0 0 1px rgba(255,255,255,.03) inset;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.feature-card:hover{
  transform: translateY(-6px);
  border-color: var(--cyan-40);
  box-shadow: 0 14px 44px rgba(31,212,255,.20);
}
.feature-icon{
  width:82px; height:auto; margin:-0.25rem auto 1rem;
}

/* SUB-HERO (títulos de páginas internas) */
.sub-hero{
  background: linear-gradient(180deg,#12131a 0%, #0e1016 100%);
  padding: 4.5rem 0 3.5rem;
  border-bottom: 1px solid rgba(255,255,255,.06);
}

/* RODAPÉ */
.footer-ghost{
  background: linear-gradient(180deg,#0e1016 0%, #0b0d12 100%);
  padding: 2rem 0; border-top: 1px solid rgba(255,255,255,.04);
}


/* ===== Navbar transparente com blur e glow ciano ===== */
.navbar-ghost{
  background: rgba(10, 12, 18, .30);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(255,255,255,.06);
  box-shadow: 0 6px 22px rgba(0,0,0,.28), 0 0 0 1px rgba(255,255,255,.03) inset;
}
.navbar-ghost .nav-link{ color:#bcd1e0; }
.navbar-ghost .nav-link:hover,
.navbar-ghost .nav-link.active{ color:#fff; }
.logo-ghost{
  width:28px; height:28px; object-fit:contain;
  filter: drop-shadow(0 0 8px rgba(31,212,255,.35));
}

/* ===== Botões estilo neon ===== */
.btn-ghost{
  background: linear-gradient(180deg, #1fd4ff 0%, #2ab7ff 100%);
  color:#001018; border:0; font-weight:700;
  box-shadow: 0 6px 18px rgba(31,212,255,.22), inset 0 0 0 1px rgba(255,255,255,.12);
}
.btn-ghost:hover{ filter: brightness(1.06); }
.btn-outline-ghost{
  color:#e8f7ff; border:1px solid rgba(31,212,255,.40);
  background: rgba(20,20,27,.35);
}
.btn-outline-ghost:hover{ background: rgba(20,20,27,.55); }

/* ===== HERO com a nova imagem ===== */

.hero-inner{
  padding-top: 7rem;          /* compensa a navbar fixa transparente */
  padding-bottom: 5.5rem;
}

/* ===== Painel & Cards (glassmorphism) ===== */
.panel-ghost{
  background: linear-gradient(180deg,#0e0f15 0%, #12131a 100%);
}
.feature-card{
  background: rgba(20,20,27,.55);
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 16px;
  padding: 2rem;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  box-shadow: 0 12px 38px rgba(0,0,0,.35), 0 0 0 1px rgba(255,255,255,.03) inset;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.feature-card:hover{
  transform: translateY(-6px);
  border-color: rgba(31,212,255,.40);
  box-shadow: 0 14px 44px rgba(31,212,255,.20);
}
.feature-icon{
  width:82px; height:auto; margin:-0.25rem auto 1rem;
  filter: drop-shadow(0 0 12px rgba(31,212,255,.35));
}

/* Tipografia utilitária (se ainda não houver) */
.fw-800{ font-weight:800; }
.fw-600{ font-weight:600; }


/* ===== HERO: mais visibilidade da imagem ===== */
.hero-ghost{
  position: relative;
  background-position: center 20%;   /* sobe um pouco o foco */
  background-size: cover;
  min-height: 78vh;
  display: flex; align-items: center;
  border-bottom: 1px solid rgba(255,255,255,.06);
  box-shadow: 0 20px 60px rgba(0,0,0,.35);
  /* aumenta a presença da imagem */
  filter: contrast(1.12) saturate(1.08) brightness(1.06);
}


.hero-inner{ padding-top: 7.5rem; padding-bottom: 5.5rem; }

/* título com leve glow para recortar do fundo */
.hero-title{
  text-shadow: 0 2px 14px rgba(0,0,0,.55), 0 0 24px rgba(31,212,255,.15);
}
.hero-subtitle{
  text-shadow: 0 1px 10px rgba(0,0,0,.45);
}

/* Navbar sobre a imagem continua translúcida */
.navbar-ghost{
  background: rgba(10,12,18,.30);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(255,255,255,.06);
}

/* Mobile: aumenta um pouco o escurecimento para leitura */
@media (max-width: 576px){
  .hero-ghost::before{
    background:
      linear-gradient(to bottom, rgba(10,12,18,.62) 0%, rgba(10,12,18,.30) 34%, rgba(10,12,18,.26) 100%),
      radial-gradient(120% 85% at 50% 40%, rgba(0,0,0,0) 0%, rgba(0,0,0,.22) 70%, rgba(0,0,0,.32) 100%);
  }
  .hero-ghost{ filter: contrast(1.08) saturate(1.04) brightness(1.04); }
}
.badge.text-bg-dark.border.border-info{
  background: rgba(20,20,27,.55);
  border-color: rgba(31,212,255,.40) !important;
  color: #e8f7ff;
  box-shadow: 0 4px 14px rgba(31,212,255,.18);
}

.logo-ghost{
  width: 46px; height: 46px; object-fit: contain;
  filter: drop-shadow(0 0 8px rgba(31,212,255,.35));
}
.navbar-ghost{
  background: rgba(10,12,18,.30);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(255,255,255,.06);
}