/* Menú superior alineado a la derecha */
html body .tpf-nav-ul { margin-left: auto !important; }

/* Transparencia de la barra superior */
html body .tpf-nav {
  background: linear-gradient(180deg, rgba(255,255,255,.67), rgba(255,255,255,.55)) !important;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}

html { height: -webkit-fill-available; }

/* ===== TPF BARRA INFERIOR MÓVIL — FUENTE ÚNICA (estilo home) ===== */
/* Edita la barra desde aquí. Las copias en cada página quedan supeditadas a este bloque. */
html body .tpf-mob-bar { position: fixed; left: 0px; right: 0px; bottom: 0px; padding: 6px 8px calc(6px + env(safe-area-inset-bottom)); z-index: 9997; align-items: center; gap: 6px; pointer-events: none; display: none !important; background: transparent !important; }
html body .tpf-mob-bar a { flex: 1 1 0px; min-width: 0px; align-items: center; justify-content: center; gap: 2px; font-size: 11px; font-weight: 600; font-family: var(--font); padding: 5px 2px; border-radius: 14px; transition: background 0.15s, transform 0.15s; white-space: nowrap; overflow: hidden; text-align: center; border: 1px solid rgba(0, 0, 0, 0.06); box-shadow: rgba(0, 0, 0, 0.08) 0px 2px 8px, rgba(0, 0, 0, 0.04) 0px 1px 2px; pointer-events: auto; display: flex !important; flex-direction: column !important; color: var(--gray-600) !important; text-decoration: none !important; height: 52px !important; background: rgb(255, 255, 255) !important; }
html body .tpf-mob-bar a.tpf-mob-active { color: var(--blue) !important; background: var(--blue-light) !important; }
html body .tpf-mob-bar a svg { width: 18px; height: 18px; stroke: currentcolor; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; display: block; flex-shrink: 0; }
html body .tpf-mob-bar a.tpf-mob-bar-cta { background: var(--blue) !important; color: rgb(255, 255, 255) !important; border-radius: var(--r-sm) !important; box-shadow: rgba(0, 69, 98, 0.3) 0px 4px 12px, rgba(0, 69, 98, 0.18) 0px 2px 4px !important; border-color: transparent !important; }
html body .tpf-mob-bar a.tpf-mob-bar-cta svg { stroke: rgb(255, 255, 255) !important; }
html body .tpf-mob-bar a.tpf-mob-bar-cta:active { transform: scale(0.95); }
@media (max-width: 880px){
html body .tpf-mob-bar { display: flex !important; flex-direction: row !important; }
html body .tpf-mob-bar { backdrop-filter: blur(9px) saturate(1.7); left: 50% !important; right: auto !important; transform: translateX(-50%) !important; width: calc(100% - 28px) !important; max-width: 520px !important; bottom: 14px !important; padding: 6px !important; gap: 2px !important; height: 62px !important; border-radius: 26px !important; background: rgba(255, 255, 255, 0.82) !important; border: 1px solid rgba(255, 255, 255, 0.7) !important; box-shadow: rgba(0, 0, 0, 0.18) 0px 12px 30px, rgba(255, 255, 255, 0.85) 0px 1px 0px inset !important; }
html body .tpf-mob-bar a { background: transparent !important; border: 1px solid transparent !important; box-shadow: none !important; border-radius: 20px !important; height: auto !important; color: rgb(31, 45, 51) !important; }
html body .tpf-mob-bar a.tpf-mob-active { background: rgba(232, 242, 247, 0.9) !important; color: var(--blue) !important; }
html body .tpf-mob-bar a.tpf-mob-bar-cta { background: transparent !important; color: var(--blue) !important; box-shadow: none !important; border-color: transparent !important; }
html body .tpf-mob-bar a.tpf-mob-bar-cta svg { stroke: var(--blue) !important; }
html body .tpf-mob-bar { backdrop-filter: blur(9px) saturate(1.7); left: 50% !important; right: auto !important; transform: translateX(-50%) !important; width: calc(100% - 28px) !important; max-width: 520px !important; bottom: 14px !important; padding: 6px !important; gap: 2px !important; height: 62px !important; border-radius: 26px !important; background: rgba(255, 255, 255, 0.9) !important; border: 1px solid rgba(255, 255, 255, 0.7) !important; box-shadow: rgba(0, 0, 0, 0.18) 0px 12px 30px, rgba(255, 255, 255, 0.85) 0px 1px 0px inset !important; }
html body .tpf-mob-bar a { background: transparent !important; border: 1px solid transparent !important; box-shadow: none !important; border-radius: 20px !important; height: auto !important; color: rgb(31, 45, 51) !important; }
html body .tpf-mob-bar a.tpf-mob-active { background: rgba(232, 242, 247, 0.9) !important; color: var(--blue) !important; }
html body .tpf-mob-bar a.tpf-mob-bar-cta { background: transparent !important; color: var(--blue) !important; box-shadow: none !important; border-color: transparent !important; }
html body .tpf-mob-bar a.tpf-mob-bar-cta svg { fill: var(--blue) !important; stroke: none !important; }
html body .tpf-mob-bar { background: linear-gradient(rgba(255, 255, 255, 0.93), rgba(255, 255, 255, 0.86)) !important; border: 1px solid rgba(255, 255, 255, 0.6) !important; backdrop-filter: blur(12px) saturate(1.85) !important; }
html body .tpf-mob-bar { background: linear-gradient(rgba(255, 255, 255, 0.86), rgba(255, 255, 255, 0.78)) !important; }
html body .tpf-mob-bar { background: linear-gradient(rgba(255, 255, 255, 0.73), rgba(255, 255, 255, 0.67)) !important; }
}
@media (max-width: 880px) and (prefers-reduced-transparency: reduce){
html body .tpf-mob-bar, .tpf-mobile-menu { background: rgb(255, 255, 255) !important; backdrop-filter: none !important; border: 1px solid var(--gray-200) !important; }
html body .tpf-mob-bar, .tpf-mobile-menu { background: rgb(255, 255, 255) !important; backdrop-filter: none !important; border: 1px solid var(--gray-200) !important; }
}
@media (prefers-reduced-transparency: reduce){
html body .tpf-nav, .tpf-mob-bar, .tpf-mobile-menu { background: rgb(255, 255, 255) !important; backdrop-filter: none !important; }
}

/* Fallback sin backdrop-filter (navegadores antiguos) */
@supports not ((backdrop-filter:blur(2px)) or (-webkit-backdrop-filter:blur(2px))){
@media(max-width:880px){.tpf-mob-bar,.tpf-mobile-menu{background:#fff!important}}
}
