/* Portfolio — tokens partagés par toutes les expériences.
   Une page peut surcharger n'importe quelle variable dans son propre CSS. */

:root {
  --ground: #D8EEE0;        /* vert pastel — pour du bleu : #D8E8F2 */
  --ground-deep: #C8E2D2;   /* même vert, un ton plus profond (arrière-plan desktop) */
  --paper: #FFF9F0;         /* beige papier, presque blanc */
  --biscuit: #F3E8D5;       /* beige clair */
  --ink: #2A3B32;           /* texte : vert très sombre, pas un noir teinté */
  --ink-soft: #5F7A6C;      /* texte secondaire */
  --leaf: #2E7D57;          /* accent : liens, boutons */
  --shadow-rgb: 42 59 50;   /* rgb(var(--shadow-rgb) / .12) → ombre teintée encre */

  --font: "Nunito", ui-rounded, system-ui, -apple-system, "Segoe UI", sans-serif;
  --radius-bubble: 22px;
  --radius-control: 999px;
}

html {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body {
  margin: 0;
  background: var(--ground);
  color: var(--ink);
  font-family: var(--font);
  font-size: 17px;
  line-height: 1.45;
}

img { max-width: 100%; }

a { color: var(--leaf); }