/* ============================================================
   Pilar Digital — IT Company Theme Override
   Dark accent, tech feel, gradient hero
   Load AFTER quickboard-home.css
   ============================================================ */

:root {
  --it-primary: #7c3aed;
  --it-dark: #1a0a2e;
  --it-accent: #a78bfa;
  --it-gradient: linear-gradient(135deg, #1a0a2e 0%, #2d1854 40%, #7c3aed 100%);
}

/* ===== NAVBAR — force fixed on top ===== */
#site-nav {
  position: fixed !important;
  top: 0 !important; left: 0 !important; right: 0 !important;
  z-index: 9999 !important;
}

/* ===== HERO — dark gradient tech style ===== */
.pilar-hero {
  background: var(--it-gradient) !important;
  border: none !important;
  padding: 150px 0 80px !important;
  position: relative;
  overflow: hidden;
}
.pilar-hero::before {
  content: '';
  position: absolute; top: 0; right: 0;
  width: 600px; height: 600px;
  background: radial-gradient(circle, rgba(167,139,250,.15), transparent 70%);
  border-radius: 50%;
}
.pilar-hero::after {
  content: '';
  position: absolute; bottom: -100px; left: -50px;
  width: 400px; height: 400px;
  background: radial-gradient(circle, rgba(124,58,237,.2), transparent 70%);
  border-radius: 50%;
}
.pilar-hero .container { position: relative; z-index: 1; }
.pilar-hero-title {
  color: #fff !important;
  font-size: 42px !important;
  font-weight: 900 !important;
  letter-spacing: -.04em !important;
  line-height: 1.1 !important;
}
.pilar-hero-subtitle {
  color: rgba(255,255,255,.7) !important;
  font-size: 17px !important;
  max-width: 500px;
}
.pilar-cta {
  background: var(--it-accent) !important;
  border-color: var(--it-accent) !important;
  color: #fff !important;
  box-shadow: 0 8px 28px rgba(167,139,250,.35) !important;
}
.pilar-cta:hover {
  background: #6d28d9 !important;
  box-shadow: 0 12px 36px rgba(167,139,250,.45) !important;
  color: #fff !important;
}

/* Hero cards — glassmorphism on dark bg */
.pilar-card {
  background: rgba(255,255,255,.06) !important;
  border: 1px solid rgba(255,255,255,.1) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  color: #fff;
}
.pilar-card:hover {
  background: rgba(255,255,255,.12) !important;
  border-color: rgba(167,139,250,.4) !important;
  box-shadow: 0 12px 32px rgba(0,0,0,.3) !important;
  transform: translateY(-4px) !important;
}
.pilar-card::before { background: var(--it-accent) !important; }
.pilar-card-icon {
  background: rgba(167,139,250,.15) !important;
  color: var(--it-accent) !important;
  border-color: rgba(167,139,250,.2) !important;
}
.pilar-card-title { color: #fff !important; }
.pilar-card-text { color: rgba(255,255,255,.6) !important; }

/* ===== WHY SECTION — keep light ===== */
.pilar-why { background: #f8fafc !important; }
.pilar-why-icon {
  background: rgba(167,139,250,.08) !important;
  color: var(--it-accent) !important;
  border: 1px solid rgba(167,139,250,.12) !important;
  border-radius: 12px !important;
}

/* ===== NETWORK / TECH STACK ===== */
.pilar-network { background: var(--it-dark) !important; color: #fff !important; }
.pilar-section-title { color: inherit !important; }
.pilar-network .pilar-section-title { color: #fff !important; }
.pilar-network .pilar-section-subtitle { color: rgba(255,255,255,.6) !important; }
.pilar-network-list li { color: rgba(255,255,255,.7) !important; }
.pilar-network-list i { color: var(--it-accent) !important; }
.pilar-network .btn-primary { background: var(--it-accent)!important; border-color: var(--it-accent)!important; }
.pilar-network .btn-outline-primary { color: var(--it-accent)!important; border-color: var(--it-accent)!important; }
.pilar-network .btn-outline-primary:hover { background: var(--it-accent)!important; color: #fff!important; }
.pilar-network-stats { background: rgba(255,255,255,.05) !important; border: 1px solid rgba(255,255,255,.1); }
.pilar-network-stat-card { background: rgba(255,255,255,.05) !important; border: 1px solid rgba(255,255,255,.08); }
.pilar-network-stat-card .value { color: var(--it-accent) !important; }
.pilar-network-stat-card .label { color: rgba(255,255,255,.5) !important; }
.pilar-network-note { color: rgba(255,255,255,.4) !important; }

/* ===== STEPS ===== */
.pilar-step-card .step-number {
  background: var(--it-gradient) !important;
  box-shadow: 0 4px 12px rgba(124,58,237,.3) !important;
}

/* ===== CTA ===== */
.pilar-cta-partner {
  background: var(--it-gradient) !important;
}
.pilar-cta-partner .btn-light {
  background: var(--it-accent) !important;
  border-color: var(--it-accent) !important;
  color: #fff !important;
}
.pilar-cta-partner .btn-light:hover {
  background: #6d28d9 !important;
  color: #fff !important;
}

/* ===== NAVBAR — dark purple on top, white on scroll ===== */

/* Default state: dark purple bg → white text */
#site-nav .logo span { color: #fff !important; transition: color .35s ease; }
#site-nav .logo span span { color: #c4b5fd !important; transition: color .35s ease; }
#site-nav .menu-btn,
#site-nav .menu-link { color: rgba(255,255,255,.9) !important; font-weight: 700 !important; transition: all .35s ease; }
#site-nav .menu-btn:hover,
#site-nav .menu-link:hover { color: #fff !important; background: rgba(255,255,255,.12) !important; }
#site-nav .hamburger span { background: #fff !important; transition: background .35s ease; }
#site-nav .menu > li.active > .menu-btn,
#site-nav .menu > li.active > .menu-link { color: #c4b5fd !important; }
#site-nav .menu > li.active > .menu-btn::after,
#site-nav .menu > li.active > .menu-link::after { background: #c4b5fd !important; }
#site-nav .dropdown { background: #1a0a2e !important; border-color: rgba(167,139,250,.2) !important; }
#site-nav .dropdown a { color: rgba(255,255,255,.7) !important; }
#site-nav .dropdown a:hover { color: #fff !important; background: rgba(167,139,250,.15) !important; }
#site-nav .dropdown a.active { color: #c4b5fd !important; background: rgba(167,139,250,.12) !important; }

/* Scrolled state: white bg → dark text */
#site-nav.scrolled .logo span { color: #0f172a !important; }
#site-nav.scrolled .logo span span { color: #7c3aed !important; }
#site-nav.scrolled .menu-btn,
#site-nav.scrolled .menu-link { color: #334155 !important; }
#site-nav.scrolled .menu-btn:hover,
#site-nav.scrolled .menu-link:hover { color: #7c3aed !important; background: rgba(124,58,237,.08) !important; }
#site-nav.scrolled .hamburger span { background: #0f172a !important; }
#site-nav.scrolled .menu > li.active > .menu-btn,
#site-nav.scrolled .menu > li.active > .menu-link { color: #7c3aed !important; }
#site-nav.scrolled .menu > li.active > .menu-btn::after,
#site-nav.scrolled .menu > li.active > .menu-link::after { background: #7c3aed !important; }
#site-nav.scrolled .dropdown { background: #fff !important; border-color: #e2e8f0 !important; }
#site-nav.scrolled .dropdown a { color: #475569 !important; }
#site-nav.scrolled .dropdown a:hover { color: #7c3aed !important; background: rgba(124,58,237,.06) !important; }
#site-nav.scrolled .dropdown a.active { color: #7c3aed !important; }

.btn-top {
  background: var(--it-accent) !important;
  border-color: var(--it-accent) !important;
  box-shadow: 0 4px 14px rgba(167,139,250,.25) !important;
}
.btn-top:hover {
  background: #6d28d9 !important;
  box-shadow: 0 6px 22px rgba(167,139,250,.35) !important;
}

/* Language switcher styling */
#site-nav .lang-btn { color: rgba(255,255,255,.9) !important; border-color: rgba(255,255,255,.2) !important; }
#site-nav .lang-btn:hover { background: rgba(255,255,255,.1) !important; }
#site-nav.scrolled .lang-btn { color: #334155 !important; border-color: #e2e8f0 !important; }
#site-nav.scrolled .lang-btn:hover { background: #f8fafc !important; border-color: #7c3aed !important; color: #7c3aed !important; }

@media (max-width: 991.98px) {
  .pilar-hero { padding: 120px 0 60px !important; }
  .pilar-hero-title { font-size: 28px !important; text-align: center; color: #fff !important; }
  .pilar-hero-subtitle { text-align: center; margin: 10px auto 20px; color: rgba(255,255,255,.7) !important; }
  .pilar-hero .col-lg-6:first-child { text-align: center; }
}