/* ==========================================================================
   LP Jiu-Jitsu (GVS × BJJ House) — tokens
   Sistema herdado de gvsgroup.com.br (tipografia, ritmo, motion, raio).
   Paleta desta LP: branco de base, preto e vermelho (cor da BJJ House).
   Sem azul-marinho e sem amarelo aqui, por decisão de 18/09/2026.
   ========================================================================== */

:root {
  /* --- marca --------------------------------------------------------------- */
  --preto: #0a0a0a;
  --branco: #ffffff;
  /* Vermelho da BJJ House como o site dela usa (bjjhouse.com.br): passa
     contraste AA sobre branco. O PNG da logo é #FB2326, mais saturado; esse
     fica para textos e detalhes SOBRE PRETO, onde é ele que passa AA. */
  --vermelho: #d11c1c;
  --vermelho-escuro: #b01515;
  --vermelho-no-preto: #fb2326;
  --accent: var(--vermelho);          /* trocado para --vermelho-no-preto nos blocos pretos */

  --cinza: #5f5f5f;                   /* texto secundário sobre claro */
  --cinza-claro: #b9b9b9;             /* texto secundário sobre preto */
  --cinza-fundo: #f4f4f2;             /* fundo alternativo, respiro entre blocos brancos */
  --font-family: 'Poppins', sans-serif;
  --radius: 16px;                     /* botão, cartão, bloco: nunca pílula */

  /* --- derivados ------------------------------------------------------------ */
  --line-on-dark: rgba(255, 255, 255, 0.14);
  --line-on-dark-strong: rgba(255, 255, 255, 0.34);
  --line-on-light: rgba(10, 10, 10, 0.12);
  --line-on-light-strong: rgba(10, 10, 10, 0.34);
  --fill-on-dark: rgba(255, 255, 255, 0.05);
  --fill-on-light: rgba(10, 10, 10, 0.04);
  --shadow-card: 0 24px 48px -24px rgba(10, 10, 10, 0.28);
  --shadow-dark: 0 18px 40px -18px rgba(10, 10, 10, 0.45);
  --shadow-red: 0 10px 28px -8px rgba(209, 28, 28, 0.45);

  /* --- layout --------------------------------------------------------------- */
  --container: 1200px;
  --gutter: clamp(20px, 5vw, 64px);
  --header-h: 68px;
  --section-y: clamp(88px, 12vw, 160px);
  --section-top: 28px;
  --grid-gap: clamp(20px, 2.5vw, 32px);

  /* --- tipografia ---------------------------------------------------------- */
  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-md: 1.125rem;
  --text-lg: clamp(1.125rem, 1.05rem + 0.4vw, 1.25rem);
  --text-xl: clamp(1.25rem, 1.15rem + 0.5vw, 1.5rem);
  --display-2: clamp(2rem, 1.25rem + 3.4vw, 4rem);       /* título de seção: 64px no desktop */
  --display-1: clamp(2.5rem, 1.2rem + 6vw, 5.75rem);
  --tracking-caps: 0.14em;

  /* --- movimento ------------------------------------------------------------ */
  --dur: 0.7s;
  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --ease-spring: cubic-bezier(0.34, 1.3, 0.64, 1);
}