.nav-ref { position: relative; }
.nav-ref > summary { list-style: none; display: inline-flex; align-items: center; gap: 6px; cursor: pointer; }
.nav-ref > summary::-webkit-details-marker { display: none; }
.nav-ref-caret { transition: transform .2s ease; }
.nav-ref[open] .nav-ref-caret { transform: rotate(180deg); }
.nav-ref > summary[data-active], .nav-ref[open] > summary { color: #806038 !important; }
.nav-ref > summary[data-active]::after { content: ""; position: absolute; left: 0; right: 16px; bottom: -6px; height: 1px; background: #c9a84c; }
.nav-ref > summary:focus-visible { outline: 2px solid #9c4a2e; outline-offset: 4px; border-radius: 4px; }
.nav-ref-panel { position: absolute; top: calc(100% + 18px); left: 50%; transform: translateX(-50%); width: 340px; padding: 8px; border: 1px solid rgba(128, 96, 56, .22); border-radius: 16px; background: #fbf8f2; box-shadow: 0 18px 40px rgba(60, 42, 18, .14); z-index: 60; }
.nav-ref-item { display: flex; align-items: center; gap: 12px; padding: 11px 12px; border-radius: 10px; text-decoration: none; color: #32271f; }
.nav-ref-item + .nav-ref-item { border-top: 1px solid rgba(128, 96, 56, .12); }
.nav-ref-item:hover, .nav-ref-item:focus-visible { background: rgba(201, 168, 76, .1); outline: none; }
.nav-ref-item[aria-current="page"] .nav-ref-t { color: #806038; }
.nav-ref-ic { flex: none; color: #9a7b3c; }
.nav-ref-t { display: block; font: 600 .92rem/1.25 Manrope, sans-serif; color: #32271f; }
.nav-ref-s { display: block; font: 500 .78rem/1.35 Manrope, sans-serif; color: #6b655c; margin-top: 2px; }
.nav-ref-all .nav-ref-t { color: #806038; }
.mobile-ref > summary { list-style: none; display: flex; align-items: center; justify-content: space-between; cursor: pointer; }
.mobile-ref > summary::-webkit-details-marker { display: none; }
.mobile-ref > summary::after { content: "+"; font-weight: 500; font-size: 20px; color: #9a7b3c; }
.mobile-ref[open] > summary::after { content: "−"; }
.mobile-ref-list { padding: 4px 0 10px; }
.mobile-ref-item { display: flex; align-items: center; gap: 12px; min-height: 48px; padding: 8px 0; text-decoration: none; color: #32271f; border-bottom: 1px solid rgba(128, 96, 56, .1); }
.mobile-ref-item:last-child { border-bottom: 0; }
.mobile-ref-item[aria-current="page"] .nav-ref-t { color: #806038; }
.mobile-ref-item .nav-ref-t { font-size: 15px; }
@media (prefers-reduced-motion: reduce) { .nav-ref-caret { transition: none; } }
