.nav-dropdown { position: relative; display: inline-block; }
.nav-dropdown-toggle {
    background: none; border: none; font: inherit; color: inherit; cursor: pointer;
    display: inline-flex; align-items: center; gap: 4px; padding: 0; margin: inherit;
    text-decoration: none;
}
.main-nav .nav-dropdown-toggle { padding: inherit; }
.nav-dropdown-arrow { font-size: 0.7em; transition: transform 0.2s ease; display: inline-block; }
.nav-dropdown.is-open .nav-dropdown-arrow { transform: rotate(180deg); }

.nav-dropdown-menu {
    display: none; position: absolute; top: 100%; left: 0; margin-top: 8px; background: #fff;
    border-radius: 12px; box-shadow: 0 10px 30px rgba(0,0,0,0.16); padding: 8px; min-width: 200px; z-index: 60;
    animation: nav-dropdown-fade 0.15s ease;
}
@keyframes nav-dropdown-fade { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: translateY(0); } }
.nav-dropdown.is-open .nav-dropdown-menu { display: block; }
.nav-dropdown-menu a {
    display: block; padding: 9px 12px; color: #222 !important; text-decoration: none; border-radius: 6px;
    white-space: nowrap; font-size: 14px; font-weight: 500;
}
.nav-dropdown-menu a:hover { background: #f3f4f6; }
.nav-dropdown-menu a.active { background: #eef0ff; font-weight: 700; }

@media (max-width: 860px) {
    .nav-dropdown { display: block; width: 100%; }
    .nav-dropdown-toggle { width: 100%; justify-content: space-between; padding: 10px 0; }
    .nav-dropdown-menu {
        display: none; position: static; box-shadow: none; background: transparent; padding: 0 0 0 16px;
        margin-top: 0; min-width: 0;
    }
    .nav-dropdown.is-open .nav-dropdown-menu { display: block; }
    .nav-dropdown-menu a { color: inherit !important; padding: 8px 0; }
}