/* Essor Studio is strictly monochrome. Every colour below is black, white or a
   neutral grey. Colour only ever enters the interface as CLIENT WORK imagery. */
:root{
  /* base ramp — values 000/FFF/D9D9D9/444444/ECECEC/C9C9C9 are from the brand board */
  --noir:#000000;
  --noir-800:#0D0D0D;
  --noir-700:#1A1A1A;
  --gris-fonce:#444444;
  --gris-600:#6E6E6E;
  --gris-moyen:#C9C9C9;
  --gris:#D9D9D9;
  --gris-clair:#ECECEC;
  --blanc-off:#FAFAFA;
  --blanc:#FFFFFF;

  /* semantic — light surfaces (portfolio / project presentation) */
  --surface-page:var(--blanc-off);
  --surface-card:var(--blanc);
  --surface-sunken:var(--gris-clair);
  --surface-inverse:var(--noir);
  --text-title:var(--noir);
  --text-body:var(--gris-fonce);
  --text-muted:var(--gris-600);
  --text-meta:var(--noir);
  --text-on-inverse:var(--blanc);
  --text-body-on-inverse:var(--gris-moyen);
  --text-muted-on-inverse:var(--gris-600);

  /* semantic — dark surfaces (brand experience: hero, studio, contact) */
  --surface-dark:var(--noir);
  --surface-dark-raised:var(--noir-700);

  /* interactive */
  --action-fill:var(--noir);
  --action-fill-hover:var(--gris-fonce);
  --action-text-on-fill:var(--blanc);
  --action-fill-inverse:var(--blanc);
  --action-text-on-fill-inverse:var(--noir);
  --action-ghost-border:var(--noir);
  --action-disabled-fill:var(--gris);
  --action-disabled-text:var(--gris-600);
}