/* Jetons de design repris de la maquette Claude Design, avec deux écarts
   assumés.

   L'accent, d'abord. La maquette posait un terracotta #B26B4A, la teinte
   que prend par défaut n'importe quelle page au fond crème. L'accent est
   maintenant l'ocre du mur de son cabinet, #B4883F, relevé sur ses propres
   photographies : la page s'accorde avec ses images au lieu de leur
   répondre à côté, et la spec d'origine demandait déjà « la palette ocre
   du mur de son cabinet ». Comme le terracotta avant lui, cet ocre mesure
   moins de 4,5:1 (2,69:1) : filets, aplats et décor seulement, jamais de
   texte. Le texte prend --accent-fonce, #7A5A1E, à 5,32:1.

   Les libellés, ensuite : #8E8578 dans la maquette (3,04:1), assombris en
   #665F56. Un test verrouille les deux couleurs écartées. */

:root {
  /* Fonds, du plus sombre au plus clair */
  --vert: #3E4A3E;
  --sable: #E7E1D6;
  --fond: #EFEAE3;

  /* Quatre unités séparaient --fond de --fond-2 : l'alternance de sections
     ne se voyait pas et la page paraissait molle. L'écart est porté à une
     valeur perceptible, assez pour rythmer la lecture, assez peu pour ne
     pas découper la page en bandes. */
  --fond-2: #E8E1D4;
  --creme: #FAF6F0;
  --carte: #FDFBF8;

  /* Textes */
  --texte: #2A2724;
  --texte-doux: #5C554B;
  --libelle: #665F56;

  /* Accents */
  --accent: #B4883F;
  --accent-fonce: #7A5A1E;
  --peche: #F5EAD5;
  --peche-bord: #E2CFA6;

  /* Filets */
  --bord: #E4DBCF;
  --bord-fort: #D6CCBE;
  --bord-doux: #DED4C6;
  --bord-marque: #C9BEAE;

  /* Typographie */
  --serif: 'Cormorant Garamond', 'Cormorant Garamond secours', Georgia, 'Times New Roman', serif;
  --sans: 'Karla', 'Karla secours', system-ui, -apple-system, 'Segoe UI', sans-serif;

  /* Rythme et formes */
  --rythme: clamp(3.5rem, 9vw, 7rem);
  --rayon: 6px;
  --rayon-net: 2px;
  --rayon-pilule: 999px;
  --arche: 240px 240px 4px 4px;
  --arche-petite: 150px 150px 4px 4px;
  --conteneur: 72rem;
  --mesure: 68ch;

  /* Profondeur */
  --ombre-douce: 0 24px 50px -30px rgb(42 39 36 / 22%);
  --ombre-portee: 0 30px 60px -30px rgb(42 39 36 / 30%);

  /* Grain : texture appliquée par ::before sur les blocs qui la portent */
  --grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='0.22'/%3E%3C/svg%3E");
}