/* Desplegable "Servicios" del nav — compartido por index.html y servicio.html */
.nav-dd { position: relative; }
.nav-dd-btn { display: flex; align-items: center; gap: 6px; background: none; border: 1px solid rgba(255,255,255,.22); color: #fff; border-radius: 8px; padding: 8px 14px; font-weight: 700; font-size: .88rem; cursor: pointer; transition: border-color .2s, color .2s; white-space: nowrap; font-family: inherit; }
.nav-dd-btn:hover, .nav-dd.open .nav-dd-btn { border-color: var(--blue); color: var(--blue); }
.nav-dd-btn .caret { font-size: .7rem; transition: transform .2s; }
.nav-dd.open .nav-dd-btn .caret { transform: rotate(180deg); }
.nav-dd-menu { display: none; position: absolute; top: calc(100% + 10px); left: 50%; transform: translateX(-50%); background: #fff; border-radius: 14px; box-shadow: 0 18px 48px rgba(13,27,42,.28); padding: 10px; min-width: 520px; grid-template-columns: 1fr 1fr; gap: 2px; z-index: 1100; max-height: 70vh; overflow-y: auto; }
.nav-dd.open .nav-dd-menu { display: grid; }
.nav-dd-menu a { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 8px; color: var(--text); font-size: .9rem; font-weight: 600; transition: background .15s, color .15s; }
.nav-dd-menu a:hover, .nav-dd-menu a.active { background: var(--blue-l); color: var(--blue-d); }
.nav-dd-icon { width: 30px; height: 30px; flex-shrink: 0; border-radius: 8px; background: var(--light); display: flex; align-items: center; justify-content: center; font-size: 1rem; }
.mobile-svc-toggle { display: flex !important; justify-content: space-between; align-items: center; width: 100%; }
.mobile-svc-toggle .caret { transition: transform .2s; font-size: .75rem; }
.mobile-svc-toggle.open .caret { transform: rotate(180deg); }
#mobile-svc-list { display: none; flex-direction: column; padding-left: 14px; border-left: 2px solid var(--blue); margin: -4px 0 4px; }
#mobile-svc-list.open { display: flex; }
#mobile-svc-list a { font-size: .9rem; padding: 8px 0; color: rgba(255,255,255,.85); }
@media (max-width: 1240px) { .nav-dd-menu { left: auto; right: 0; transform: none; } }
@media (max-width: 700px) { .nav-dd { display: none; } }
