/* Colours sampled directly from the Verdeo Atelier reference render. */
:root{
  /* Cream / shell — the page itself */
  --cream-50:#FDF7EC;   /* lightest: send-message button, wave highlights */
  --cream-100:#F7EFE1;  /* card cream */
  --cream-200:#F4EADA;  /* PAGE BACKGROUND — the default canvas */
  --cream-300:#EFE4D2;  /* work / projects band */

  /* Sand — warm neutral bands and plaster */
  --sand-200:#E9DCC6;
  --sand-300:#E4D4BB;   /* process band */
  --sand-400:#DBCBB2;
  --sand-500:#C9BBA1;

  /* Olive — the primary brand colour */
  --olive-900:#4A4832;
  --olive-800:#5A5839;  /* pressed */
  --olive-700:#75734F;  /* PRIMARY: services band, primary button */
  --olive-600:#868364;  /* hover / lifted */
  --olive-400:#A8A587;
  --olive-200:#C9C6A4;  /* body copy on olive */

  /* Clay / terracotta — the single warm accent */
  --clay-700:#9E6440;
  --clay-600:#A66A46;   /* pressed */
  --clay-500:#B87550;   /* CTA band, accent */
  --clay-400:#C98F68;
  --clay-300:#D9AC8A;
  --clay-200:#E7C9B0;

  /* Taupe — footer bar, dividers, stone */
  --taupe-600:#8C7660;
  --taupe-500:#A38C71;  /* footer bar */
  --taupe-300:#C4B29A;
  --taupe-200:#D8CBB8;

  /* Ink — warm near-black, never pure grey */
  --ink-900:#3E3A2B;
  --ink-700:#4F4938;    /* headings */
  --ink-500:#7A7365;    /* body copy */
  --ink-400:#9A9284;    /* muted, nav idle, captions */
  --ink-300:#B6AE9F;

  /* ---- Semantic aliases: use these in components ---- */
  --surface-page:var(--cream-200);
  --surface-raised:var(--cream-50);
  --surface-card:var(--cream-100);
  --surface-muted:var(--cream-300);
  --surface-band-sand:var(--sand-300);
  --surface-band-olive:var(--olive-700);
  --surface-band-clay:var(--clay-500);
  --surface-footer:var(--taupe-500);

  --text-display:var(--ink-700);
  --text-body:var(--ink-500);
  --text-muted:var(--ink-400);
  --text-eyebrow:var(--ink-400);
  --text-on-olive:#F2EEDC;
  --text-on-olive-muted:var(--olive-200);
  --text-on-clay:#FBF3E8;
  --text-on-clay-muted:#F0DCCB;

  --accent:var(--clay-500);
  --brand:var(--olive-700);

  --border-hairline:rgba(122,115,101,.28);
  --border-on-dark:rgba(242,238,220,.32);
  --divider:rgba(122,115,101,.18);

  --field-underline:rgba(251,243,232,.55);
  --focus-ring:rgba(117,115,79,.45);
}