/* Fonte base e suavização */
:root {
  --brand: #0d6efd;
  --brand-2: #6610f2;
  --ink: #0f172a;
  --muted: #6b7280;
  --bg-soft: #f5f7fb;
  --card: #ffffff;
  --shadow-sm: 0 2px 5px rgba(2, 6, 23, .06);
  --shadow-md: 0 8px 30px rgba(2, 6, 23, .08);
  --radius: 14px;
}

html { scroll-behavior: smooth; }
body {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Inter, Arial, "Noto Sans", sans-serif;
  color: var(--ink);
  background: linear-gradient(180deg, #f7f9ff 0%, #eef3ff 50%, #f9fbff 100%);
}

/* Navbar fixa com sombra sutil */
.navbar {
  box-shadow: var(--shadow-sm);
}

/* HERO — gradiente, cartão de destaque e avatar */
.hero {
  background: linear-gradient(135deg, var(--brand), var(--brand-2));
  color: #fff;
  padding-top: 5rem;
  padding-bottom: 4rem;
}
.hero .card {
  border: 0;
  border-radius: var(--radius);
  box-shadow: var(--shadow-md);
}
.avatar {
  width: 160px; height: 160px; object-fit: cover;
  border-radius: 50%;
  border: 5px solid rgba(255,255,255,.2);
}

/* Títulos de seção */
.section-title { scroll-margin-top: 6rem; }
.section-title h2,
h2 { font-weight: 700; letter-spacing: .2px; }

/* Cards gerais */
.card {
  border: none;
  border-radius: var(--radius);
  background: var(--card);
  box-shadow: var(--shadow-sm);
  transition: transform .25s ease, box-shadow .25s ease;
}
.card:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-md);
}
.card-title { color: #111827; }

/* List group enxuta */
.list-group-item {
  border: none;
  border-radius: 10px;
  box-shadow: var(--shadow-sm);
  margin-bottom: .5rem;
}

/* Métricas (chips) */
.kpi {
  background: linear-gradient(180deg, #0b1224 0%, #0e1630 100%);
  color: #e8efff;
  border-radius: 16px;
  padding: 18px 20px;
  box-shadow: var(--shadow-md);
}

/* Barras de habilidade (opcional, se usar) */
.skill {
  height: 10px; border-radius: 999px; background: #e5e7eb; overflow: hidden;
}
.skill > span {
  display: block; height: 100%;
  background: linear-gradient(90deg, var(--brand), var(--brand-2));
}

/* Form de contato como “card destacado” */
.contact-card {
  background: #fff;
  border-radius: 18px;
  padding: 22px;
  box-shadow: var(--shadow-md);
}

/* Footer */
footer {
  background: #0b1224;
  color: #e5e7eb;
}
footer a { color: #fff; }

/* Hero Bootstrap override */
.bg-primary {
  background: linear-gradient(135deg, var(--brand) 0%, var(--brand-2) 100%) !important;
}

/* Acessibilidade utilitária */
.sr-only {
  position: absolute !important;
  width: 1px !important; height: 1px !important;
  padding: 0 !important; margin: -1px !important;
  overflow: hidden !important; clip: rect(0,0,0,0) !important;
  white-space: nowrap !important; border: 0 !important;
}

/* Responsividade refinada */
@media (max-width: 991px) {
  .hero { text-align: center; }
}
@media (max-width: 575px) {
  .kpi { text-align: center; }
}