/* ──────────────────────────────────────────────────────────
 * SFC Theme — design tokens
 * Defined globally on :root so any rule can reference them.
 * Application is gated behind .sfc-preview-active in sfc.css.
 * ──────────────────────────────────────────────────────── */
:root {
  /* ── Surfaces ─────────────────────────────────────────── */
  --sfc-bg:               #0b0b0c;
  --sfc-surface:          #141416;
  --sfc-surface-2:        #1d1d20;
  --sfc-hairline:         rgba(255, 255, 255, 0.08);
  --sfc-hairline-strong:  rgba(255, 255, 255, 0.16);

  /* ── Text ─────────────────────────────────────────────── */
  --sfc-text:             #ededee;
  --sfc-text-muted:       #9a9aa0;
  --sfc-text-dim:         #6a6a72;

  /* ── Accent (gym red — matches logo) ─────────────────── */
  --sfc-accent:           #e03020;
  --sfc-accent-hover:     #f04030;
  --sfc-accent-dim:       #b02818;
  --sfc-accent-fg:        #ffffff;

  /* ── Status ───────────────────────────────────────────── */
  --sfc-success:          #5dab63;
  --sfc-error:            #d35a4e;

  /* ── Type scale (fluid for marketing pages) ───────────── */
  --sfc-font-display:     'Saira Condensed', 'Helvetica Neue', system-ui, sans-serif;
  --sfc-font-body:        'Commissioner', system-ui, -apple-system, sans-serif;

  --sfc-text-display-1:   clamp(3.5rem, 8vw, 6.5rem);   /* hero H1 */
  --sfc-text-display-2:   clamp(2.25rem, 5vw, 4rem);    /* section H2 */
  --sfc-text-display-3:   clamp(1.5rem, 3vw, 2.5rem);   /* sub-heading */
  --sfc-text-body-lg:     1.125rem;
  --sfc-text-body:        1rem;
  --sfc-text-body-sm:     0.875rem;
  --sfc-text-eyebrow:     0.6875rem;

  --sfc-leading-display:  0.95;
  --sfc-leading-tight:    1.15;
  --sfc-leading-body:     1.6;

  --sfc-tracking-display: -0.02em;
  --sfc-tracking-tight:   -0.01em;
  --sfc-tracking-eyebrow: 0.18em;

  /* ── Spacing ──────────────────────────────────────────── */
  --sfc-space-section:        clamp(4rem, 10vw, 7.5rem);
  --sfc-space-section-tight:  clamp(2.5rem, 6vw, 4rem);
  --sfc-space-block:          clamp(1.5rem, 4vw, 2.5rem);
  --sfc-gutter:               clamp(1rem, 4vw, 2.5rem);

  /* ── Radii ────────────────────────────────────────────── */
  --sfc-radius-card:        1.5rem;
  --sfc-radius-card-inner:  1.125rem;
  --sfc-radius-pill:        9999px;
  --sfc-radius-tile:        0.75rem;

  /* ── Container ────────────────────────────────────────── */
  --sfc-container:          78rem;

  /* ── Shadows (diffuse, never harsh) ───────────────────── */
  --sfc-shadow-edge-top:    inset 0 1px 0 rgba(255, 255, 255, 0.06);
  --sfc-shadow-card:        0 30px 60px -25px rgba(0, 0, 0, 0.55);
  --sfc-shadow-float:       0 20px 40px -15px rgba(0, 0, 0, 0.40);

  /* ── Motion ───────────────────────────────────────────── */
  --sfc-easing-spring:    cubic-bezier(0.32, 0.72, 0, 1);
  --sfc-easing-emphasis:  cubic-bezier(0.16, 1, 0.3, 1);
  --sfc-duration-fast:    180ms;
  --sfc-duration:         320ms;
  --sfc-duration-slow:    720ms;

  /* ── Z-index scale (systemic) ─────────────────────────── */
  --sfc-z-banner:         50;
  --sfc-z-nav:            60;
  --sfc-z-overlay:        80;
  --sfc-z-modal:          100;
}