:root {
  /* Font Family */
  --vr-font-primary: var(--font-headings, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif);
  --vr-font-secondary: var(--font-base, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif);
  /* Font size */
  --vr-font-size-base: 1rem; /* 16/16 */
  /* Line Height */
  --vr-line-height-body: 1.7;
  --vr-line-height-heading: 1.3;
  --vr-line-height-page-title: 1.1;
  --vr-line-height-page-title-small: 1.2;
  /* Color */
  --vr-color-primary: #28303d;
  --vr-color-background: #fff;
}

html {
  font-family: var(--vr-font-secondary);
  line-height: var(--vr-line-height-body);
}

body {
  --wp--typography--line-height: var(--vr-line-height-body);
  color: var(--vr-color-primary);
  background-color: var(--vr-color-background);
  font-family: var(--vr-font-secondary);
  font-size: var(--vr-font-size-base);
  font-weight: normal;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
}

/* Links styles */
.wp-block a {
  color: var(--wp--style--color--link, var(--vr-color-primary));
}
.wp-block a:hover {
  text-decoration-style: dotted;
}
.wp-block a:focus {
  outline: 2px solid var(--wp--style--color--link, var(--vr-color-primary));
  text-decoration: none;
}

/* Enforce the custom link color even if a custom background color has been set.
 * The extra specificity here is required to override the background color styles.
 */
.has-background {
  /* Target both current level and nested block. */
}
.has-background .has-link-color a, .has-background.has-link-color a {
  color: var(--wp--style--color--link, var(--vr-color-primary));
}

button,
a {
  cursor: pointer;
}