/* =====================================================================
   BASE — reset, tipografía y comportamiento de documento.
   Sin media queries: todos los breakpoints viven en layout.css.
   ===================================================================== */
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{-webkit-text-size-adjust:100%}
html,body{margin:0;padding:0}

body{
  background:var(--papel);
  font-family:var(--ff-cuerpo);
  color:var(--tinta);
  font-size:var(--fs-160);
  line-height:1.45;
  min-height:100dvh;
  overscroll-behavior-y:none;
  /* Lo que escribe la gente (títulos, nombres, notas) puede traer una palabra
     larguísima sin espacios: sin esto ensancha la página entera. `anywhere`
     además achica el ancho mínimo de las cajas flexibles, que con
     `break-word` seguirían desbordando. Sólo parte cuando no cabe. */
  overflow-wrap:anywhere;
}

button{font-family:inherit;font-size:inherit;border:0;background:none;cursor:pointer;color:inherit;padding:0;user-select:none}
input,select,textarea{font-family:inherit;font-size:inherit}
img,svg{max-width:100%}
ul,ol{margin:0;padding:0;list-style:none}

h1,h2,h3{font-family:var(--ff-titulo);font-weight:700;text-transform:uppercase;letter-spacing:.02em;line-height:1.05;margin:0}
h1{font-size:var(--fs-titulo)}
h2{font-size:var(--fs-titulo-chico)}

/* Título de sección, portado del prototipo */
.h2{font-family:var(--ff-titulo);font-size:var(--fs-titulo-chico);font-weight:700;text-transform:uppercase;letter-spacing:.03em;line-height:1;color:var(--tinta);margin:var(--sp-6) 0 var(--sp-3)}
/* Barra roja debajo: corta la pantalla en bloques que se ven desde lejos. */
.h2::after{content:"";display:block;width:2.5rem;height:.1875rem;background:var(--primario);margin-top:var(--sp-2)}
.p{font-size:var(--fs-135);color:var(--gris);line-height:1.45}

.eyebrow{
  font-family:var(--ff-titulo);font-size:var(--fs-190);font-weight:700;
  letter-spacing:.1em;text-transform:uppercase;color:var(--tinta);
  display:flex;align-items:center;gap:var(--sp-2);margin:var(--sp-6) 0 var(--sp-2);
}
.eyebrow::before{content:"";width:.5625rem;height:.5625rem;background:var(--primario);flex:0 0 auto}
.eyebrow .der{margin-left:auto;color:var(--primario);letter-spacing:.05em}

/* Título de bloque con una acción a la derecha (p. ej. "Cargar partido"), para
   que la acción esté junto a lo que afecta y no al final de la pantalla. */
.seccion-cab{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);margin:var(--sp-6) 0 var(--sp-2)}
.seccion-cab .eyebrow{margin:0}

.mono{font-family:var(--ff-mono)}
.sr{position:absolute;top:0;left:0;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

*:focus-visible{outline:2px solid var(--primario);outline-offset:2px}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
