:where(:root) .bricks-color-primary {color: var(--primary)}:where(:root) .bricks-background-primary {background-color: var(--primary)}:where(:root) .bricks-color-secondary {color: var(--secondary)}:where(:root) .bricks-background-secondary {background-color: var(--secondary)}:where(:root) .bricks-color-light {color: var(--bone)}:where(:root) .bricks-background-light {background-color: var(--bone)}:where(:root) * {border-color: var(--warm)}:where(:root) .bricks-color-dark {color: var(--display)}:where(:root) .bricks-background-dark {background-color: var(--display)} body {font-size: var(--text-m); color: var(--body-text); font-family: "Barlow"; background: none} h1, h2, h3, h4, h5, h6 {font-family: "Barlow Condensed"; color: var(--display); text-transform: uppercase} h1 {font-size: var(--text-2xl); font-weight: 700; font-family: "Barlow Condensed"} h2 {font-size: var(--text-xl)} h3 {font-size: var(--text-l)} h4 {font-size: var(--text-m)} html {font-size: unset; background-color: var(--background)} .bricks-button:not([class*="bricks-background-"]):not([class*="bricks-color-"]):not(.outline) {background-color: var(--primary)} .bricks-button {color: var(--bone); font-family: "Barlow Condensed"; font-size: var(--text-l); font-weight: 600; text-transform: uppercase; border-radius: 4px} :root .bricks-button[class*="primary"]:not(.outline) {background-color: var(--primary)} :root .bricks-button[class*="primary"] {color: var(--bone)} :root .bricks-button[class*="secondary"]:not(.outline) {background-color: var(--accent)} :root .bricks-button[class*="secondary"] {color: var(--body-text)} .brxe-section {padding-right: 1rem; padding-left: 1rem}@media (min-width: 1279px) { .brxe-section {padding-right: unset; padding-left: unset}}