/* public/site-nav.css */

/* Active link helper (optional) */
.navLinks a.active{
  color: var(--text);
  background: rgba(34,49,85,.30);
  border:1px solid rgba(34,49,85,.45);
  padding:9px 9px;
}

/* Dropdown */
.navDrop{
  position:relative;
  display:inline-flex;
  align-items:center;
}

.navDropBtn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:10px 10px;
  border-radius:999px;
  color:var(--muted);
  font-weight:800;
  font-size:14px;
  border:1px solid transparent;
  background: transparent;
  cursor:pointer;
}

.navDropBtn:hover{
  color:var(--text);
  background: rgba(34,49,85,.30);
  border:1px solid rgba(34,49,85,.45);
  padding:9px 9px;
}

.navDrop.open .navDropBtn{
  color:var(--text);
  background: rgba(34,49,85,.30);
  border:1px solid rgba(34,49,85,.45);
  padding:9px 9px;
}

.navDropMenu{
  position:absolute;
  top: calc(100% + 10px);
  right: 0;
  min-width: 220px;
  border-radius: 16px;
  background: linear-gradient(180deg, rgba(10,18,38,.92), rgba(10,18,38,.72));
  border:1px solid rgba(34,49,85,.70);
  box-shadow: var(--shadow);
  padding: 8px;
  display:none;
  z-index: 50;
}

.navDrop.open .navDropMenu{ display:block; }

.navDropMenu a{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:10px 10px;
  border-radius: 12px;
  color: var(--muted);
  font-weight: 900;
  font-size: 13px;
}

.navDropMenu a:hover{
  background: rgba(34,49,85,.30);
  border:1px solid rgba(34,49,85,.45);
  padding:9px 9px;
  color: var(--text);
}

.navDropMenu .sep{
  height:1px;
  background: rgba(34,49,85,.45);
  margin: 6px 6px;
}

/* Calmer reading mode (for legal pages) */
.reading{
  padding-top: 92px;
}

.reading .readWrap{
  max-width: 860px;
  margin: 0 auto;
  padding: 0 18px;
}

.readCard{
  padding: 18px;
}

.readCard h1{
  font-size: clamp(28px, 3.2vw, 40px);
  line-height: 1.1;
  margin: 0 0 10px;
}

.readCard h2{
  margin: 18px 0 10px;
  font-size: 18px;
  letter-spacing: -.1px;
}

.readCard h3{
  margin: 14px 0 8px;
  font-size: 15px;
  color: var(--text);
}

.readCard p{
  color: var(--muted);
  font-weight: 750;
  line-height: 1.75;
}

.readCard ul{
  margin: 10px 0 0;
  padding-left: 18px;
  color: var(--muted);
  font-weight: 750;
  line-height: 1.75;
}