/* Tema del Manual de marca V2.02.01 para team.aboutsquat.cl (línea de entrenamiento).
   Tokens copiados de .claude/skills/aboutsquat-producto/tokens/aboutsquat.css.
   La agenda (salud integral) NO usa este archivo: sigue en Pistacho con tema-agenda.css.
   Tipografías autoalojadas en /fonts (subconjunto latino: tildes y ñ). */

@font-face { font-family: 'Archivo Black'; src: url('/fonts/archivo-black.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'Inter'; src: url('/fonts/inter.woff2') format('woff2'); font-weight: 400 700; font-style: normal; font-display: swap; }
@font-face { font-family: 'IBM Plex Mono'; src: url('/fonts/ibm-plex-mono-400.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'IBM Plex Mono'; src: url('/fonts/ibm-plex-mono-500.woff2') format('woff2'); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: 'IBM Plex Mono'; src: url('/fonts/ibm-plex-mono-600.woff2') format('woff2'); font-weight: 600; font-style: normal; font-display: swap; }

:root {
  /* ---- Superficies — MANUAL (paleta) + DERIVADO (asignación de rol) ---- */
  --as-fondo:        #0B0C0E;  /* Negro Volcán — lienzo de la app */
  --as-superficie:   #16191D;  /* Carbón — tarjetas, paneles, filas */
  --as-linea:        #2C3138;  /* Grafito — bordes y separadores, nunca texto */

  /* ---- Texto — MANUAL ---- */
  --as-texto:        #F2F3F0;  /* Hueso — 17.57 sobre Volcán, 15.83 sobre Carbón */
  --as-texto-sutil:  #8A9199;  /* Humo — 6.14 sobre Volcán, 5.53 sobre Carbón */

  /* ---- Familias de servicio — MANUAL ---- */
  --as-volt:         #CCFF33;  /* entrenamiento funcional, 1:1, senior, open box */
  --as-pistacho:     #C7DFA4;  /* salud integral: kinesiología + nutrición */
  --as-coral:        #FF5A3C;  /* «nuevo», últimos cupos, urgencia */

  /* ---- Roles de interacción — DERIVADO ---- */
  --as-accion:       var(--as-volt);      /* acción primaria: un solo llamado por pantalla */
  --as-accion-texto: var(--as-fondo);     /* sobre relleno de color el texto va en Volcán */
  --as-exito:        var(--as-pistacho);  /* confirmaciones; deja Volt libre para la acción */
  --as-peligro:      var(--as-coral);     /* error, destructivo, vencido */
  --as-foco:         var(--as-volt);      /* anillo de foco visible, obligatorio */

  /* ---- Tipografía — MANUAL ---- */
  --as-display: 'Archivo Black', Archivo, sans-serif;      /* titulares, caja alta */
  --as-texto-familia: Inter, system-ui, sans-serif;        /* interfaz y cuerpo */
  --as-datos: 'IBM Plex Mono', ui-monospace, monospace;    /* horarios, precios, series, métricas */

  /* Escala web del manual: H0 72 · H1 56 · H2 40 · H3 26 · cuerpo 17 · mín. 16 */
  --as-h0: 72px;
  --as-h1: 56px;
  --as-h2: 40px;
  --as-h3: 26px;
  --as-cuerpo: 17px;
  --as-menor: 16px;   /* mínimo absoluto en web — nada por debajo */

  /* Escala móvil del manual: 40 · 34 · 28 · 21 · 16 */
  --as-h0-movil: 40px;
  --as-h1-movil: 34px;
  --as-h2-movil: 28px;
  --as-h3-movil: 21px;
  --as-cuerpo-movil: 16px;

  /* ---- Espaciado: unidad de 8 — MANUAL ---- */
  --as-xs: 8px;
  --as-s: 16px;
  --as-m: 24px;
  --as-l: 40px;
  --as-xl: 64px;
  --as-xxl: 96px;

  /* ---- Forma — MANUAL ---- */
  --as-radio: 0;             /* esquinas rectas por defecto */
  --as-radio-control: 4px;   /* solo campos de formulario y botones */
  --as-borde: 1px;
  /* Sin sombras. El manual excluye sombras paralelas y elevaciones:
     la jerarquía se expresa con superficie y con línea, no con profundidad. */

  /* ---- Medidas — MANUAL ---- */
  --as-ancho-contenido: 1280px;
  --as-ancho-texto: 680px;
}

@font-face { font-family: 'Caveat'; src: url('/fonts/caveat.woff2') format('woff2'); font-weight: 400 700; font-style: normal; font-display: swap; } /* solo para «About» del logotipo */