/* ============================================
   CSS GLOBAL - Isaac Mungongo
   ============================================ */

* { 
  font-family: 'Inter', sans-serif; 
  scroll-behavior: smooth; 
}

:root { 
  --blue-primary: #1E3A5F;
  --blue-secondary: #2C5282;
  --blue-accent: #3182CE;
  --blue-light: #4299E1;
  --blue-dark: #1A365D;
  --dark-bg: #0F172A;
  --dark-card: #1E293B;
  --dark-surface: #334155;
  --dark-border: #2D3748;
  --text-primary: #F8FAFC;
  --text-secondary: #94A3B8;
}

body { 
  background-color: var(--dark-bg);
  color: var(--text-primary);
}

/* ============================================
   TIPOGRAFIA E CORES
   ============================================ */
.blue-text { color: var(--blue-light); }
.blue-bg { background: linear-gradient(135deg, var(--blue-primary) 0%, var(--blue-secondary) 100%); }

/* ============================================
   BOTÕES
   ============================================ */
.btn-primary { 
  background: linear-gradient(135deg, var(--blue-primary) 0%, var(--blue-secondary) 100%);
  transition: all 0.2s ease; 
  border: 1px solid rgba(66, 153, 225, 0.3);
}
.btn-primary:hover { 
  transform: translateY(-2px); 
  box-shadow: 0 8px 20px -5px rgba(49, 130, 206, 0.3);
  border-color: var(--blue-light);
}

/* ============================================
   HEADER / NAVEGAÇÃO
   ============================================ */
.glass-effect { 
  background: rgba(15, 23, 42, 0.95); 
  backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(66, 153, 225, 0.2);
}

/* ============================================
   SCROLLBAR CUSTOMIZADA
   ============================================ */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: var(--dark-bg); }
::-webkit-scrollbar-thumb { background: var(--blue-light); border-radius: 4px; }

/* ============================================
   EFEITOS DE HOVER
   ============================================ */
.hover-lift {
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.hover-lift:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 24px -8px rgba(0,0,0,0.3);
}

/* ============================================
   FORMULÁRIOS (GLOBAL)
   ============================================ */
input, select, textarea {
  background-color: var(--dark-surface);
  border-color: var(--dark-border);
  color: var(--text-primary);
}
input:focus, select:focus, textarea:focus {
  border-color: var(--blue-light);
  outline: none;
  box-shadow: 0 0 0 3px rgba(66, 153, 225, 0.1);
}
input::placeholder, textarea::placeholder {
  color: #64748B;
}

/* ============================================
   MENU MOBILE
   ============================================ */
#mobileMenu {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background: #0F172A !important;
  background-color: #0F172A !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  z-index: 999;
  transform: translateX(-100%);
  transition: transform 0.3s ease-out;
  overflow-y: auto;
}
#mobileMenu.open { 
  transform: translateX(0); 
}
#mobileMenu .mobile-menu-content { 
  background: #0F172A; 
  min-height: 100vh; 
}
#closeMenuBtn {
  position: absolute;
  top: 20px;
  right: 20px;
  z-index: 1000;
  background: #1E293B;
  border: 1px solid #2D3748;
}

/* ============================================
   CARDS DE CONTATO
   ============================================ */
.contact-card {
  transition: all 0.3s ease;
}
.contact-card:hover {
  transform: translateY(-6px);
}

/* ============================================
   FAQ ACCORDION
   ============================================ */
.faq-item { 
  transition: all 0.2s ease; 
  cursor: pointer; 
}
.faq-answer { 
  max-height: 0; 
  overflow: hidden; 
  transition: max-height 0.4s ease; 
}
.faq-item.open .faq-answer { 
  max-height: 300px; 
}
.faq-item.open .faq-icon { 
  transform: rotate(180deg); 
}

/* ============================================
   CARDS DE EVENTOS
   ============================================ */
.event-card {
  transition: all 0.3s ease;
}
.event-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 25px 40px -15px rgba(66, 153, 225, 0.2);
}

/* ============================================
   LIVROS DE CURSOS
   ============================================ */
.course-book {
  transition: all 0.3s ease;
  cursor: pointer;
}
.course-book:hover {
  transform: translateY(-8px) scale(1.03);
  z-index: 20;
  box-shadow: 0 25px 40px -15px rgba(66, 153, 225, 0.3);
}

/* ============================================
   GALERIA DE IMAGENS
   ============================================ */
.gallery-item {
  transition: all 0.2s ease;
}
.gallery-item:hover {
  transform: translateY(-3px);
  box-shadow: 0 20px 30px -12px rgba(0,0,0,0.4);
}

/* ============================================
   MODAL / LIGHTBOX
   ============================================ */
.lightbox-modal {
  transition: opacity 0.3s ease, visibility 0.3s ease;
}

/* ============================================
   IMAGENS (EVITA FLICKER NO HOVER)
   ============================================ */
img {
  transition: none;
}