/* NV-CONNECT-HOME · franja de Connect en la home de BT (diseño 29-sep-2026, NO desplegado).
   Es la misma pieza que la franja de planes (.nv-pbb, css/ssr/nv-pbb-styles.css): mismo degradé navy, mismo filete, misma
   caja de 96 px y el mismo botón blanco invertido. Ocupa el HUECO de esa franja cuando ella se oculta (quien ya paga),
   así nunca hay dos franjas apiladas y la página no cambia de alto entre estados. Solo se añade lo que la pieza de
   planes no tiene: los dos logos y el cierre «Ahora no». */
.nv-cbb[hidden] { display: none; }
.nv-cbb .nv-cbb-id { display: flex; align-items: center; gap: 16px; min-width: 0; }
.nv-cbb-logos { flex: none; display: inline-flex; align-items: center; gap: 6px; }
.nv-cbb-logos span { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%; background: #fff; box-shadow: 0 1px 2px rgba(6, 18, 40, .25), 0 3px 10px rgba(6, 18, 40, .16); }
.nv-cbb-logos svg { display: block; width: 22px; height: 22px; }
.nv-cbb .nv-pbb-cta { transition: background .18s ease; }
.nv-cbb .nv-pbb-cta svg { width: 14px; height: 14px; flex: none; transition: transform .18s ease; }
.nv-cbb .nv-pbb-cta:hover svg { transform: translateX(2px); }
.nv-cbb-acc { flex: none; display: inline-flex; align-items: center; gap: 14px; }
.nv-cbb-sec { color: #c8d6ea; font-size: 14px; font-weight: 500; text-decoration: none; white-space: nowrap; border-bottom: 1px solid rgba(255, 255, 255, .3); transition: color .18s ease, border-color .18s ease; }
.nv-cbb-sec:hover { color: #fff; border-bottom-color: #fff; }
.nv-cbb-sec:focus-visible { outline: 3px solid #ffd479; outline-offset: 3px; border-radius: 2px; }
.nv-cbb-off { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; padding: 0; border: 0; border-radius: 6px; background: none; color: #c8d6ea; cursor: pointer; transition: color .18s ease, background .18s ease; }
.nv-cbb-off svg { width: 14px; height: 14px; }
.nv-cbb-off:hover { color: #fff; background: rgba(255, 255, 255, .12); }
.nv-cbb-off:focus-visible { outline: 3px solid #ffd479; outline-offset: 2px; }
@media (max-width: 720px) {
  .nv-cbb .nv-pbb-in { position: relative; }
  .nv-cbb-logos { display: none; }
  .nv-cbb .nv-pbb-t { padding-right: 34px; }
  .nv-cbb-acc { width: 100%; flex-wrap: wrap; gap: 10px 14px; }
  .nv-cbb-acc .nv-pbb-cta { flex: 1 1 100%; order: 1; }
  .nv-cbb-sec { order: 2; }
  .nv-cbb-off { position: absolute; top: 8px; right: 8px; width: 40px; height: 40px; }
}
@media (prefers-reduced-motion: reduce) { .nv-cbb .nv-pbb-cta, .nv-cbb .nv-pbb-cta svg, .nv-cbb-off { transition: none; } }
