/* ============================================================
   Cabecera — TABLERO deportivo (no masthead, no logo-rombo)
   Barra fija clara con wordmark "bplay" en minúsculas + punto
   "en vivo" pulsante, navegación tipo marcador y dos CTA.
   ============================================================ */

.tablero {
  position: sticky; top: 0; z-index: 50;
  background: rgba(244,248,244,0.9);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--linea);
}
.tablero__barra {
  width: var(--cancha); max-width: 1300px; margin-inline: auto;
  display: flex; align-items: center; gap: 1.4rem;
  padding: 0.85rem var(--calle);
}

/* ---- wordmark bplay ---- */
.tablero__marca {
  display: inline-flex; align-items: center; gap: 0.55ch;
  font-family: "Gabarito", sans-serif; font-weight: 800;
  font-size: var(--t-marca); letter-spacing: -0.02em; color: var(--tinta);
}
.tablero__marca em { font-style: normal; color: var(--cesped); }
.tablero__vivo {
  width: 0.7em; height: 0.7em; border-radius: 50%;
  background: var(--brillo); box-shadow: 0 0 0 0 rgba(22,196,109,0.6);
  animation: pulso-vivo 2.4s ease-out infinite;
}
@keyframes pulso-vivo {
  0%   { box-shadow: 0 0 0 0 rgba(22,196,109,0.55); }
  70%  { box-shadow: 0 0 0 0.6em rgba(22,196,109,0); }
  100% { box-shadow: 0 0 0 0 rgba(22,196,109,0); }
}

/* ---- navegación (wp_nav_menu → .tablero__nav > ul.tablero__menu > li > a) ---- */
.tablero__nav { display: flex; align-items: center; margin-inline: auto; }
.tablero__nav > ul { display: flex; align-items: center; gap: clamp(1rem, 2vw, 2.1rem); }
.tablero__nav a {
  font-family: "Gabarito", sans-serif;
  font-size: 0.92rem; font-weight: 600; color: var(--tinta-media);
  position: relative; padding: 0.3em 0; transition: color 0.2s ease;
}
.tablero__nav a::after {
  content: ""; position: absolute; left: 0; bottom: -3px;
  width: 0; height: 2px; background: var(--brillo); transition: width 0.25s ease;
}
.tablero__nav a:hover { color: var(--tinta); }
.tablero__nav a:hover::after { width: 100%; }

/* ---- acciones ---- */
.tablero__act { display: flex; align-items: center; gap: 0.9rem; }
.tablero__ingresar {
  font-family: "Gabarito", sans-serif; font-weight: 700; font-size: 0.92rem;
  color: var(--cesped-hondo); white-space: nowrap;
}
.tablero__ingresar:hover { color: var(--tinta); }
.tablero__cta { white-space: nowrap; padding: 0.7em 1.4em; }

/* ---- burger + panel móvil ---- */
.tablero__burger { display: none; flex-direction: column; gap: 5px; padding: 8px; background: none; border: 0; cursor: pointer; }
.tablero__burger span { width: 24px; height: 2px; background: var(--tinta); display: block; border-radius: 2px; }

.tablero__movil {
  display: none; flex-direction: column; gap: 0.1rem;
  padding: 0.4rem var(--calle) 1.4rem;
  border-top: 1px solid var(--linea); background: var(--cal-claro);
}
.tablero__movil ul { display: flex; flex-direction: column; }
.tablero__movil a {
  display: block;
  font-family: "Gabarito", sans-serif; font-weight: 600; font-size: 1.05rem;
  color: var(--tinta-media); padding: 0.95rem 0; border-bottom: 1px solid var(--linea);
}
.tablero__movil .boton { margin-top: 1.1rem; }

@media (max-width: 1024px) {
  .tablero__nav, .tablero__act .tablero__ingresar { display: none; }
  .tablero__act { margin-left: auto; }
  .tablero__burger { display: flex; }
}
