/* ref-07-retro-brand-hero — les jetons de la charte, plus le socle que les fragments supposent.
   Sans la ligne box-sizing, les marges intérieures s'ajoutent aux dimensions et la
   composition ne rend pas ce que la bibliothèque montre. */
*,*::before,*::after{box-sizing:border-box}

:root {
  --vl-card: #FBF7EC;
  --vl-bg: #FBF7EC;
  --vl-ink: #1E1B18;
  --vl-accent: #B2201C;
  --vl-on-accent: #FBF7EC;
  --vl-ground-sky-hi: #D7E6EC;
  --vl-ground-sky-lo: #BBD3DE;
  --vl-ground-sun: #F4EFE2;
  --vl-ground-sea-hi: #7FA8BC;
  --vl-ground-sea-lo: #5E8AA0;
  --vl-ground-foam: #EFEAE0;
  --vl-ground-sand-wet: #C7B49A;
  --vl-ground-sand-dry: #E4D5BC;
  --vl-ph-a-hi: #86B0C4;
  --vl-ph-a-lo: #3F6B84;
  --vl-ph-a-crest: #F1EDE3;
  --vl-ph-b-sky: #C9DEE7;
  --vl-ph-b-canvas: #D8442E;
  --vl-ph-b-canvas-lo: #92251C;
  --vl-ph-b-pole: #EDE4D2;
  --vl-ph-c-hi: #EFE1C6;
  --vl-ph-c-lo: #B9A181;
  --vl-radius-card: 6px;
  --vl-radius-photo: 8px;
  --vl-radius-pill: 4px;
  --vl-gap: 12px;
  --vl-margin: 44px;
  --vl-shadow-card: 0 24px 60px rgba(0, 0, 0, 0.18);
}