/* Both navigation levels share the active indent and dot reveal. */
[data-study="quiet-cards"] {
  --quiet-nav-offset:16px;
  --quiet-nav-duration:300ms;
  --quiet-nav-ease:ease;
}
[data-study="quiet-cards"] .sidebar :is(.nav-link,.sidebar-about) {
  position:relative;
  padding-inline-end:var(--quiet-nav-offset);
}

[data-study="quiet-cards"] .sidebar :is(.nav-copy,.about-heading) {
  color:rgba(0,0,0,.8); /* 2026-10-14: unselected sidebar items (was var(--muted)) */
  transform:translateX(0);
  transition:transform var(--quiet-nav-duration) var(--quiet-nav-ease),color var(--quiet-nav-duration) var(--quiet-nav-ease);
}

[data-theme="dark"][data-study="quiet-cards"] .sidebar :is(.nav-copy,.about-heading) {
  color:rgba(255,255,255,.8);
}

[data-study="quiet-cards"] .sidebar :is(.nav-link,.sidebar-about)[aria-current] :is(.nav-copy,.about-heading) {
  color:var(--ink);
  transform:translateX(var(--quiet-nav-offset));
}

[data-study="quiet-cards"] .sidebar .nav-link[aria-current] .nav-title,
[data-study="quiet-cards"] .sidebar .sidebar-about[aria-current] .about-heading,
[data-study="quiet-cards"] .quiet-mobile-link[aria-current] {
  font-weight:500;
}

[data-study="quiet-cards"] .sidebar :is(.nav-link,.sidebar-about):is(:hover,:focus-visible) :is(.nav-copy,.about-heading) {
  color:var(--ink);
}

[data-study="quiet-cards"] .sidebar :is(.nav-link,.sidebar-about)::after {
  content:'';
  position:absolute;
  inset-inline-start:0;
  top:50%;
  width:6px;
  height:6px;
  margin:0;
  border-radius:50%;
  background:var(--ink);
  opacity:0;
  transform:translateY(-50%);
  pointer-events:none;
  transition:opacity var(--quiet-nav-duration) var(--quiet-nav-ease);
}

[data-study="quiet-cards"] .sidebar :is(.nav-link,.sidebar-about)[aria-current]::after {
  opacity:1;
}

[data-study="quiet-cards"] .qd-item {
  --qd-item-inset:20px;
  position:relative;
}
[data-study="quiet-cards"] .qd-item-main {
  display:flex;
  align-items:center;
  gap:inherit;
  flex:1;
  min-width:0;
  margin-inline-end:var(--quiet-nav-offset);
  transform:translateX(0);
  transition:transform var(--quiet-nav-duration) var(--quiet-nav-ease);
}
[data-study="quiet-cards"] .qd-item-title {
  color:var(--muted);
  transition:color var(--quiet-nav-duration) var(--quiet-nav-ease);
}
[data-study="quiet-cards"] .qd-item:is([aria-current],:hover,:focus-visible) .qd-item-title {
  color:var(--ink);
}
[data-study="quiet-cards"] .qd-item[aria-current] .qd-item-main {
  transform:translateX(var(--quiet-nav-offset));
}
[data-study="quiet-cards"] .qd-item-dot {
  position:absolute;
  inset-inline-start:var(--qd-item-inset);
  top:50%;
  width:6px;
  height:6px;
  background:var(--ink);
  opacity:0;
  transform:translateY(-50%);
  pointer-events:none;
  transition:opacity var(--quiet-nav-duration) var(--quiet-nav-ease);
}
[data-study="quiet-cards"] .qd-item[aria-current] .qd-item-dot { opacity:1; }
@media (max-width:1279px) and (min-width:760px) {
  [data-study="quiet-cards"] .qd-item { --qd-item-inset:16px; }
}
@media (max-width:999px) and (min-width:760px) {
  [data-study="quiet-cards"] .qd-item { --qd-item-inset:13px; }
}
@media (max-width:759px) {
  [data-study="quiet-cards"] .qd-item { --qd-item-inset:18px; }
}

@media (prefers-reduced-motion:reduce) {
  [data-study="quiet-cards"] .sidebar :is(.nav-copy,.about-heading),
  [data-study="quiet-cards"] .sidebar :is(.nav-link,.sidebar-about)::after,
  [data-study="quiet-cards"] :is(.qd-item-main,.qd-item-title,.qd-item-dot) {
    transition:none;
  }
}