/* ─── VARIÁVEIS ─── */
:root {
  --bg-deep: #060b18;
  --bg-dark: #0a1020;
  --bg-card: #111827;
  --bg-card-hover: #1a2540;
  --blue-core: #2563eb;
  --blue-bright: #3b82f6;
  --blue-glow: #60a5fa;
  --blue-dim: #1e3a5f;
  --gold: #f59e0b;
  --gold-light: #fcd34d;
  --white: #f0f6ff;
  --white-dim: #94a3b8;
  --white-faint: #1e2d4a;
  --green-cta: #16a34a;
  --green-cta-hover: #15803d;
  --font-head: 'Space Grotesk', sans-serif;
  --font-body: 'Inter', sans-serif;
  --radius: 16px;
  --radius-sm: 8px;
}

/* ─── RESET ─── */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  background: var(--bg-deep);
  color: var(--white);
  font-family: var(--font-body);
  overflow-x: hidden;
  line-height: 1.6;
}

/* ─── SKIP LINK (Acessibilidade — teclado) ─── */
.skip-link {
  position: absolute;
  top: -100%;
  left: 16px;
  z-index: 9999;
  background: var(--blue-core);
  color: #fff;
  font-family: var(--font-head);
  font-weight: 700;
  font-size: 0.9rem;
  padding: 10px 20px;
  border-radius: var(--radius-sm);
  text-decoration: none;
  transition: top 0.2s;
}
.skip-link:focus {
  top: 16px;
}

/* ─── FOCUS VISÍVEL (Acessibilidade — teclado) ─── */
:focus-visible {
  outline: 3px solid var(--blue-bright);
  outline-offset: 3px;
  border-radius: 4px;
}

/* Remove outline para mouse mas mantém para teclado */
:focus:not(:focus-visible) {
  outline: none;
}

/* ─── TEXTO DE LOGO (WordPress-ready) ─── */
.nav-logo-text {
  display: inline;
}
.nav-logo-img {
  width: auto;
  height: 36px;
  object-fit: contain;
}
