/* ============================================================
   San Isidro FC — Portal
   variables.css · tokens de diseño (paleta, tipografía, escala)
   Paleta derivada del escudo: negro / celeste / blanco
   ============================================================ */

:root {
  /* --- Colores base (escudo) --- */
  --negro:          #0B0B0F;
  --negro-2:        #14141B;   /* superficies elevadas */
  --negro-3:        #1D1D27;   /* bordes/cards */
  --celeste:        #0085BD;   /* primary — raya central del escudo */
  --celeste-claro:  #2BA7DC;
  --celeste-oscuro: #00638C;
  --blanco:         #FFFFFF;

  /* --- Texto --- */
  --txt:            #F2F4F7;
  --txt-suave:      #A6AEB9;
  --txt-tenue:      #6B7280;

  /* --- Semánticos --- */
  --bg:             var(--negro);
  --bg-elev:        var(--negro-2);
  --surface:        var(--negro-3);
  --primary:        var(--celeste);
  --primary-hover:  var(--celeste-claro);
  --linea:          rgba(255, 255, 255, .08);

  /* --- Tipografía --- */
  --font-display: "Anton", "Arial Narrow", sans-serif;
  --font-body:    "Inter", system-ui, -apple-system, sans-serif;

  /* escala tipográfica */
  --fs-eyebrow: .78rem;
  --fs-body:    1rem;
  --fs-lead:    1.18rem;
  --fs-h3:      clamp(1.3rem, 2.2vw, 1.8rem);
  --fs-h2:      clamp(2rem, 5vw, 3.4rem);
  --fs-hero:    clamp(3rem, 11vw, 8.5rem);

  /* --- Layout --- */
  --maxw:        1240px;
  --gutter:      clamp(1.2rem, 4vw, 3rem);
  --radius:      14px;
  --radius-sm:   9px;
  --header-h:    74px;

  /* --- Animación --- */
  --ease:        cubic-bezier(.22, 1, .36, 1);
  --dur:         .55s;

  /* --- Sombra --- */
  --shadow:      0 18px 50px -24px rgba(0, 0, 0, .8);
}

/* Patrón de rayas verticales celeste/blanco — firma del club.
   Reutilizable como background-image en cualquier franja. */
:root {
  --rayas: repeating-linear-gradient(
    90deg,
    var(--blanco)  0  10px,
    var(--celeste) 10px 20px
  );
}

@media (prefers-reduced-motion: reduce) {
  :root { --dur: .001s; }
}