/* ═══════════════════════════════════════════════════════════
   LE PORC DE SOUZA · TOKENS · direction « Braise »
   Chaleureux et gourmand : crème, brun expresso, rouge braise,
   miel. Ces variables pilotent le site ET la planche de style.
   ═══════════════════════════════════════════════════════════ */
:root {
  /* couleurs */
  --canvas: #F6EDE0;        /* crème chaude : fond de page */
  --panel: #FFF9F1;         /* cartes */
  --ink: #2A1810;           /* brun expresso : texte (15:1 sur le fond) */
  --muted: #6E5646;         /* brun doux : texte secondaire (5,9:1) */
  --steel: #C9B39A;         /* filets et décor, jamais du texte */
  --hair: rgba(42, 24, 16, .14);
  --line: rgba(42, 24, 16, .42);
  --accent: #C93C17;        /* rouge braise : action (texte blanc 5,1:1) */
  --accent-hover: #A8300F;
  --accent-ink: #FFFFFF;
  --accent-text: #A8300F;   /* braise pour du texte sur crème (5,8:1) */
  --amber: #F0A43A;         /* miel, lueur du grill : prix, soulignés, sur fond sombre */
  --amber-ink: #2A1810;
  --night: #1C110B;         /* charbon chaud : la visite, les sections sombres */
  --night-2: #2A1A11;
  --on-night: #FBF3E8;
  --on-night-muted: #D9C6B1;
  --leaf: #4F7A3A;          /* herbe fraîche, en touches rares */

  /* typographie */
  --display: 'Bricolage Grotesque', 'Arial Rounded MT Bold', system-ui, sans-serif;
  --body: 'Bricolage Grotesque', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --hand: 'Caveat', 'Segoe Print', cursive;
  --mono: 'DM Mono', ui-monospace, 'SFMono-Regular', Menlo, monospace;
  --display-weight: 800;

  --t-hero: clamp(40px, 6vw, 96px);
  --t-h2: clamp(34px, 4.6vw, 72px);
  --t-h3: clamp(22px, 2vw, 30px);
  --t-body: clamp(16px, 1.1vw, 18.5px);

  /* formes et rythme */
  --radius: 18px;
  --radius-sm: 10px;
  --gutter: clamp(18px, 4vw, 64px);
  --maxw: 1320px;
  --section-pad: clamp(80px, 12vh, 150px);

  /* mouvement */
  --ease-out: cubic-bezier(.19, 1, .22, 1);
  --ease-inout: cubic-bezier(.77, 0, .175, 1);
  --ease-back: cubic-bezier(.34, 1.56, .64, 1);

  /* lisibilité du texte sur image */
  --tshadow: 0 1px 2px rgba(14, 8, 4, .92), 0 3px 12px rgba(14, 8, 4, .66), 0 10px 40px rgba(14, 8, 4, .55);
}