/* barra de navegación inferior, estilo app */
body { padding-bottom: calc(80px + env(safe-area-inset-bottom, 0px)) !important; }
.nav-app {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 50;
  background: rgba(255, 255, 255, 0.95); -webkit-backdrop-filter: saturate(1.4) blur(12px); backdrop-filter: saturate(1.4) blur(12px);
  border-top: 1px solid #E3D8C6;
  padding: 6px 8px calc(6px + env(safe-area-inset-bottom, 0px));
}
.nav-app ul { list-style: none; margin: 0 auto; padding: 0; max-width: 560px; display: grid; grid-template-columns: repeat(5, 1fr); align-items: end; }
.nav-app a {
  display: flex; flex-direction: column; align-items: center; gap: 3px; padding: 6px 0;
  text-decoration: none; color: #8A7B6B; font-family: 'Jost', 'Futura', 'Century Gothic', system-ui, sans-serif; font-size: 11.5px; letter-spacing: .02em;
}
.nav-app svg { width: 24px; height: 24px; }
.nav-app a[aria-current="page"] { color: #2E1D02; font-weight: 500; }
.nav-app a[aria-current="page"] svg { stroke-width: 2; }
.nav-app a:hover { color: #5A3900; }
/* Inicio, en el medio y destacado */
.nav-app a.centro { margin-top: -22px; }
.nav-app a.centro .bola { width: 54px; height: 54px; border-radius: 50%; background: #5A3900; color: #FDD68C; display: flex; align-items: center; justify-content: center; box-shadow: 0 6px 18px rgba(46,29,2,.28); border: 3px solid #F4EDE2; }
.nav-app a.centro .bola svg { width: 26px; height: 26px; }
.nav-app a.centro[aria-current="page"] .bola { background: #2E1D02; }