html {font-size: 100%} body {font-family: "DM Sans"} h1 {font-family: "Barlow Condensed"} h2 {font-family: "Barlow Condensed"} h3 {font-family: "Barlow Condensed"} .bricks-button:not([class*="bricks-background-"]):not([class*="bricks-color-"]):not(.outline) {background-color: var(--primary)} .bricks-button {color: var(--light); font-size: var(--text-m); font-weight: 600; letter-spacing: -.01em; border: 1px solid var(--primary); border-radius: var(--radius-s); transition: all 200ms; padding-top: var(--space-2xs); padding-right: var(--space-s); padding-bottom: var(--space-2xs); padding-left: var(--space-s)} .bricks-button:not([class*="bricks-background-"]):not([class*="bricks-color-"]):not(.outline):hover {background-color: var(--primary-l-2)} .bricks-button.sm {padding-top: var(--space-3xs); padding-right: var(--space-xs); padding-bottom: var(--space-3xs); padding-left: var(--space-xs); font-size: var(--text-s)} :root .bricks-button[class*="primary"]:not(.outline) {background-color: var(--primary)} :root .bricks-button[class*="primary"] {border: 1px solid var(--primary); color: var(--light)} .bricks-button.md {font-size: var(--text-m); padding-top: var(--space-2xs); padding-right: var(--space-s); padding-bottom: var(--space-2xs); padding-left: var(--space-s)} :root .bricks-button[class*="secondary"] {color: var(--base); border: 1px solid var(--secondary)} :root .bricks-button[class*="secondary"]:not(.outline) {background-color: var(--secondary)} :root .bricks-button[class*="light"]:not(.bricks-lightbox) {color: var(--light); border: 1px solid var(--light-50)} :root .bricks-button[class*="light"]:not(.outline):not(.bricks-lightbox) {background-color: rgba(0, 0, 0, 0)} :root .bricks-button[class*="dark"] {color: var(--base); border: 1px solid var(--base-50)} :root .bricks-button[class*="secondary"]:not(.outline):hover {background-color: var(--secondary-d-1)} :root .bricks-button[class*="secondary"]:hover {border-color: var(--secondary-d-1)} :root .bricks-button[class*="light"]:not(.bricks-lightbox):hover {border-color: var(--light)} :root .bricks-button[class*="dark"]:hover {border-color: var(--base)} :root .bricks-button[class*="primary"]:not(.outline):hover {background-color: var(--primary-l-2)} :root .bricks-button[class*="primary"]:hover {border-color: var(--primary-l-2)} :root .bricks-button[class*="muted"]:not(.outline) {background-color: var(--base-10)} :root .bricks-button[class*="muted"] {border: 0; color: var(--base)} :root .bricks-button[class*="dark"]:not(.outline) {background-color: rgba(0, 0, 0, 0)} :root .bricks-button[class*="dark"].outline {border: 1px solid var(--dark-50)} :root .bricks-button[class*="dark"]:not(.outline):hover {background-color: rgba(0, 0, 0, 0)}