/* pooz — designtokens
 *
 * rfotografie.com is leidend. --rf-inkt is de bevestigde theme-color van de
 * live site (#171310). De overige waarden liggen dicht bij de site maar zijn
 * nog niet uit de repo overgenomen: vervang dit blok door de echte tokens uit
 * de rfotografie-repository zodra je die erbij hebt, dan loopt alles mee.
 */

:root {
  /* Kleur */
  --rf-inkt:        #171310;
  --rf-inkt-zacht:  #3a322c;
  --rf-mist:        #6e635b;
  --rf-creme:       #f7f2ec;
  --rf-papier:      #fffdfa;
  --rf-zand:        #e8ddd1;
  --rf-zand-diep:   #d8c9b8;
  --rf-terracotta:  #b0603c;
  --rf-terracotta-licht: #d08c68;
  --rf-klei:        #8a6a55;
  --rf-succes:      #4f6b52;
  --rf-fout:        #9c3b2c;

  /* Typografie
   * Vervang door de zelfgehoste fonts uit de repo (zie docs/deploy.md).
   */
  --rf-font-display: "Iowan Old Style", "Palatino Linotype", Palatino,
                     "Book Antiqua", Georgia, "Times New Roman", serif;
  --rf-font-tekst:   -apple-system, BlinkMacSystemFont, "SF Pro Text",
                     "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

  --rf-schaal-xs: 0.75rem;
  --rf-schaal-s:  0.875rem;
  --rf-schaal-m:  1rem;
  --rf-schaal-l:  1.25rem;
  --rf-schaal-xl: 1.625rem;
  --rf-schaal-xxl: 2.25rem;

  /* Ruimte */
  --rf-ruimte-1: 0.25rem;
  --rf-ruimte-2: 0.5rem;
  --rf-ruimte-3: 0.75rem;
  --rf-ruimte-4: 1rem;
  --rf-ruimte-5: 1.5rem;
  --rf-ruimte-6: 2rem;
  --rf-ruimte-7: 3rem;

  /* Vorm */
  --rf-radius-s:  10px;
  --rf-radius-m:  18px;
  --rf-radius-l:  28px;
  --rf-radius-xl: 36px;
  --rf-rand:      1px solid var(--rf-zand-diep);

  --rf-schaduw-zacht: 0 1px 2px rgba(23, 19, 16, 0.04),
                      0 8px 24px rgba(23, 19, 16, 0.06);
  --rf-schaduw-diep:  0 2px 6px rgba(23, 19, 16, 0.08),
                      0 18px 48px rgba(23, 19, 16, 0.12);

  /* Layout */
  --rf-max-breedte: 720px;
  --rf-tabbalk-hoogte: 66px;
}