/* theme.css - paleta institucional e tipografia (Sora) */
:root{
  --brand-blue-1: #0b67ff;   /* azul vibrante (mantido caso precise) */
  --brand-blue-2: #004ea6;   /* azul escuro (padrão agora) */
  --brand-gold:  #0b67ff ;   /* dourado #e6b759*/
  --bg-dark:      #0b0b0d;   /* fundo escuro institucional */
  --footer-bg:    #07070a;   /* footer super escuro */
  --footer-text:  rgba(255,255,255,0.94);
  --muted:        #9aa3a8;
  --text:         #efefef;
  --max-width:    1200px;
  --font-base:    'Sora', system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
}

/* Tipografia global */
body {
  font-family: var(--font-base);
  color: var(--text);
  background-color: #fff;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

/* Cabeçalhos: usar pesos mais fortes da Sora */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-base);
  color: var(--brand-blue-2); /* títulos em azul escuro padrão do tema */
  margin-bottom: .6rem;
  letter-spacing: 0.2px;
}
h1, .h1 { font-weight: 800; }
h2, .h2 { font-weight: 700; color: var(--brand-blue-2); }
h3 { font-weight: 600; }

/* Sections escuras (ex.: hero) */
.dark-background {
  background: linear-gradient(180deg, rgba(11,11,13,1) 0%, rgba(20,20,23,1) 100%);
  color: var(--text);
}
.dark-background p,
.dark-background span,
.dark-background a {
  color: rgba(255,255,255,0.9);
}

.btn-get-started {
  background: var(--brand-blue-2);
  color: #ffffff;
  border: 0;
  padding: .75rem 1.25rem;
  font-weight: 700;
  border-radius: 6px;
  box-shadow: 0 6px 18px rgba(0,78,166,0.12);
  transition: transform .12s ease, box-shadow .12s ease;
}
.btn-get-started:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 24px rgba(0,0,0,0.25);
}

/* Links e ícones em destaque */
a { color: var(--brand-blue-2); }
a:hover { color: var(--brand-blue-2); }

/* Titles das seções */
.section-title h2 {
  color: var(--brand-blue-2);
  text-transform: uppercase;
  letter-spacing: 1.6px;
  font-weight: 700;
}
.section-title p {
  color: var(--muted);
}

/* Cards / service item accents */
.service-item .icon i,
.member .social a i,
.testimonial-item .stars i {
  color: var(--brand-blue-2);
}

/* Bordas e outlines usando azul do tema */
.service-item,
.member,
.testimonial-item,
.card {
  border: 1px solid rgba(0,78,166,0.12);
}

/* Bordas de inputs e botões secundários */
input, textarea, select {
  border: 1px solid rgba(0,78,166,0.12);
}

/* Footer / header adaptações */
.header, footer {
  font-family: var(--font-base);
}

/* Ajustes responsivos e contraste */
@media (max-width: 767px) {
  h2 { font-size: 1.4rem; }
  .btn-get-started { width: 100%; text-align: center; }
}

/* Exemplo para barra superior / logo (ajuste conforme estrutura do seu header) */
.site-logo {
  font-weight: 800;
  color: var(--brand-blue-2);
  letter-spacing: 1px;
}

/* Header & Footer specific adjustments */
#header.header {
  position: sticky;
  top: 0;
  z-index: 1030;
  transition: background .22s ease, box-shadow .22s ease, color .18s ease, padding .18s ease;
  padding: 18px 0;
  background: transparent;
  backdrop-filter: saturate(120%) blur(6px);
}

#header .logo img {
  max-height: 48px;
  transition: max-height .18s ease;
}
/* Use a single white logo variant everywhere (logo-branca.png). */
#header .logo img { display: inline-block; }
#header .logo .logo-white { display: inline-block; max-height:48px; }

/* Ensure menu links are always in the brand blue color */
#header .navmenu ul li a,
#header .navmenu ul li a:visited {
  color: var(--brand-blue-2) !important;
}

/* Keep hover/active underline and color in brand blue */
#header .navmenu ul li a:hover,
#header .navmenu ul li a.active,
#header .navmenu ul li a:focus {
  color: var(--brand-blue-2) !important;
}

/* underline animation remains blue */
#header .navmenu ul li a::after {
  background: transparent;
}
#header .navmenu ul li a:hover::after,
#header .navmenu ul li a.active::after {
  background: var(--brand-blue-2);
}

#footer.footer {
  background: var(--footer-bg);
  color: var(--footer-text);
  padding: 48px 0;
}

#footer a { color: rgba(255,255,255,0.85); }
#footer a:hover { color: var(--brand-blue-2); }

#footer .social-links a {
  color: rgba(255,255,255,0.9);
  transition: color .12s ease, transform .12s ease;
}
#footer .social-links a:hover { color: var(--brand-blue-2); transform: translateY(-3px); }

#footer .copyright,
#footer .credits { color: rgba(255,255,255,0.6); }

/* Navbar (clean presentation) */
#header .navmenu ul li a {
  padding: .4rem .6rem;
  display: inline-block;
  transition: color .14s ease, transform .16s ease;
  color: var(--brand-blue-2) !important;
  font-weight: 600;
  text-transform: none;
  position: relative;
}

/* underline animation */
#header .navmenu ul li a::after {
  content: '';
  position: absolute;
  left: 12%;
  right: 12%;
  bottom: -6px;
  height: 2px;
  background: transparent;
  transition: background .18s ease, transform .18s ease;
}

#header .navmenu ul li a:hover::after,
#header .navmenu ul li a.active::after {
  background: var(--brand-blue-2);
}

#header .navmenu ul li a:hover { color: var(--brand-blue-2) !important; }

/* Mobile nav toggle icon contrast */
#header .mobile-nav-toggle { transition: color .12s ease; }

/* --- Page-specific header behavior --- */
/* Home: transparent header over hero */
/* Keep header background behavior as before, but menu links will remain blue.
   This ensures the client-requested blue menu items and the white logo are always visible.
*/
.header-scrolled {
  /* keep visual compacting on scroll */
  background: rgba(255,255,255,0.98) !important;
  color: #222222 !important;
  box-shadow: 0 8px 24px rgba(0,0,0,0.12) !important;
  padding: 10px 0 !important;
}
.header-scrolled .logo img { max-height: 40px !important; }

@media (max-width: 991px) {
  #header.header { padding: 12px 0; }
  #header .navmenu ul li a { padding: .5rem .5rem; }
}
