/* ---------------------------------------------------------------------------
   FlexX design tokens
   ---------------------------------------------------------------------------
   Single source of truth for the white/minimal direction. Pages are migrated one
   at a time; anything not yet migrated keeps the existing dark styling untouched.

   Rationale: VegNonVeg and Limited Edt both put the product on white and remove
   almost everything else. The shoe supplies the colour. Chrome should not compete
   with 305 product photographs that are already shot on white - which is exactly
   why a white surface suits this catalogue.
--------------------------------------------------------------------------- */
:root {
  /* surfaces */
  --flexx-bg:            #ffffff;
  --flexx-surface:       #fafafa;
  --flexx-surface-alt:   #f4f4f5;
  --flexx-border:        #e5e5e5;
  --flexx-border-strong: #d4d4d4;

  /* ink */
  --flexx-ink:           #0a0a0a;
  --flexx-ink-muted:     #525252;
  --flexx-ink-subtle:    #8a8a8a;

  /* brand — carried over so the identity survives the theme change */
  --flexx-primary:       #da0b27;
  --flexx-primary-ink:   #ffffff;
  --flexx-volt:          #d4ff00;

  /* status */
  --flexx-success:       #0f7b3d;
  --flexx-warning:       #b45309;
  --flexx-sale:          #da0b27;

  /* type scale */
  --flexx-font:          'Space Grotesk', system-ui, sans-serif;
  --flexx-fs-hero:       clamp(2.5rem, 6vw, 4.5rem);
  --flexx-fs-h1:         clamp(1.75rem, 3.5vw, 2.75rem);
  --flexx-fs-h2:         1.375rem;
  --flexx-fs-body:       0.9375rem;
  --flexx-fs-small:      0.8125rem;
  --flexx-fs-micro:      0.6875rem;

  /* rhythm */
  --flexx-gap-xs: 0.5rem;
  --flexx-gap-sm: 0.75rem;
  --flexx-gap:    1.25rem;
  --flexx-gap-lg: 2rem;
  --flexx-gap-xl: 3.5rem;

  /* form */
  --flexx-radius:     2px;   /* near-square: both competitors avoid soft corners */
  --flexx-radius-pill: 999px;
  --flexx-shadow:     0 1px 2px rgba(0,0,0,.04);
  --flexx-shadow-lift: 0 8px 24px rgba(0,0,0,.08);

  --flexx-maxw: 1440px;
}
