/* ==========================================================================
   reta-club-claro.css · PADSPOT Club en claro · «Nuevo para el repo»
   PADSPOT Club vive sobre crema (la propuesta del cliente final); PADSPOT
   jugador vive sobre verde. La página entera entra con <body data-mode="light">
   (el remapeo de editorial-tokens.css); los aparatos que muestran la app de
   los jugadores (teléfonos, tablet, pantalla del club, chats, banda de descarga)
   llevan data-mode="dark" y se quedan verdes.
   Va en el <head> DESPUÉS de reta-club-hero-fx.css.
   Por qué en <body> y no en <html>: colors_and_type.css declara :root después
   de importar editorial-tokens.css; con la misma especificidad gana :root y el
   claro no entra. En <body> el remapeo gana por herencia.
   ========================================================================== */

/* Fondo: crema plano en lugar del degradado verde de reta-club.css */
body[data-mode="light"]{background:var(--crema);background-attachment:scroll}

/* Firma de PADSPOT Club en encabezado y cierre */
.club-head__lockup{width:220px}
.club-foot__lockup{width:150px}

/* Entrada del hero: las canchas se encienden verdes sobre crema.
   Apagada = papel con filete verde; encendida = la misma cancha verde. */
body[data-mode="light"]{
  --hfx-off:var(--papel);
  --hfx-line-off:rgba(22,57,31,.14);
  --hfx-halo:rgba(22,57,31,.10);
  --hfx-halo-far:rgba(22,57,31,.05);
}
body[data-mode="light"] .hero-fx__veil{background:linear-gradient(90deg,var(--crema) 0%,color-mix(in srgb,var(--crema) 92%,transparent) 34%,color-mix(in srgb,var(--crema) 35%,transparent) 62%,color-mix(in srgb,var(--crema) 12%,transparent) 100%)}
@media (max-width:699px){
  body[data-mode="light"] .hero-fx__veil{background:linear-gradient(180deg,color-mix(in srgb,var(--crema) 5%,transparent) 0%,color-mix(in srgb,var(--crema) 55%,transparent) 30%,color-mix(in srgb,var(--crema) 85%,transparent) 55%,var(--crema) 100%)}
}
@media (min-width:700px) and (max-width:1099px){
  body[data-mode="light"] .hero-fx__veil{background:linear-gradient(90deg,var(--crema) 0%,color-mix(in srgb,var(--crema) 88%,transparent) 38%,color-mix(in srgb,var(--crema) 25%,transparent) 70%,transparent 100%)}
}