/* Cabeçalho global (layout.md §4): sticky, altura clamp, drawer mobile via
   checkbox (sem JS). */
.site-header {
  position: sticky; top: 0; z-index: 50;
  height: clamp(56px, 7vh, 72px);
  display: flex; align-items: center; gap: .9rem;
  padding: 0 1rem; box-sizing: border-box;
  background: #ffffff; border-bottom: 1px solid #e2e6ec;
}
.sh-logo { font-weight: 800; font-size: 1.15rem; color: #1c2430; text-decoration: none; }
.sh-logo span { color: #1c4fd6; }
.sh-nav { display: flex; align-items: center; gap: .8rem; flex: 1; min-width: 0; }
.sh-item { color: #1c2430; text-decoration: none; font-size: .9rem; padding: .3rem .2rem; white-space: nowrap; }
.sh-item.active { font-weight: 700; border-bottom: 2px solid #1c4fd6; }
.sh-item.soon { color: #a3aab5; cursor: default; }
.sh-spacer { flex: 1; }
.sh-cta { background: #12a05e; color: #fff; text-decoration: none; font-size: .85rem;
  font-weight: 600; padding: .4rem .7rem; border-radius: 6px; white-space: nowrap; }
.sh-toggle { display: none; }
.sh-burger { display: none; font-size: 1.3rem; cursor: pointer; user-select: none; }

@media (max-width: 1023px) {
  /* §4.2: [☰] [LOGO] … — o menu vira drawer lateral */
  .sh-burger { display: block; }
  .sh-nav {
    display: none;
    position: fixed; top: clamp(56px, 7vh, 72px); left: 0; bottom: 0;
    width: min(78vw, 20rem);
    flex-direction: column; align-items: stretch; gap: 0;
    background: #ffffff; border-right: 1px solid #e2e6ec;
    padding: .6rem .9rem; overflow-y: auto; z-index: 49;
    box-shadow: 0 8px 24px rgba(0,0,0,.18);
  }
  .sh-toggle:checked ~ .sh-nav { display: flex; }
  .sh-item { padding: .7rem .2rem; border-bottom: 1px solid #f0f2f5; }
  .sh-item.active { border-bottom: 1px solid #f0f2f5; color: #1c4fd6; }
  .sh-spacer { flex: 0; height: .6rem; }
  .sh-cta { margin-top: .8rem; text-align: center; }
}
