@layer hpds-tokens {
  body.hpds-enabled.hpds-preset-reluxe-editorial {
    --hpds-color-brand: #0d0d0d;
    --hpds-color-accent: #c28565;
    --hpds-color-accent-soft: #e7c1b4;
    --hpds-color-text: #171717;
    --hpds-color-text-muted: #62666b;
    --hpds-color-surface: #ffffff;
    --hpds-color-surface-subtle: #f1f3f2;
    --hpds-color-surface-raised: #ffffff;
    --hpds-color-border: #d9d9d3;
    --hpds-color-border-strong: #aaa9a2;
    --hpds-color-link: #713e30;
    --hpds-color-link-hover: #4e291f;
    --hpds-color-club: #b88a1f;
    --hpds-color-rose: #d7a59b;
    --hpds-color-mist: #eef0ef;
    --hpds-font-sans: "Rubik", "Assistant", Arial, sans-serif;
    --hpds-font-display: "Frank Ruhl Libre", "Noto Serif Hebrew", Georgia, serif;
    --hpds-display-weight: 600;
    --hpds-section-space: clamp(3.5rem, 7vw, 6rem);
    --hpds-shadow-sm: 0 0.25rem 1rem rgb(13 13 13 / 0.07);
    --hpds-shadow-md: 0 1rem 3rem rgb(13 13 13 / 0.12);
    --hpds-ease-signature: cubic-bezier(0.22, 1, 0.36, 1);
  }

  body.hpds-enabled.hpds-preset-hairport-base {
    --hpds-font-sans: "Rubik", "Assistant", Arial, sans-serif;
    --hpds-font-display: "Rubik", "Assistant", Arial, sans-serif;
  }
}