html {font-size: 100%} body {font-size: var(--text-base); font-family: "Maven Pro", sytem-ui; line-height: 1.7; color: var(--dark-alt)} h1, h2, h3, h4, h5, h6 {font-family: "Zing"; font-weight: 700; color: var(--dark); line-height: 1.1; letter-spacing: -0.02em} h1 {font-size: var(--h1)} h2 {font-size: var(--h2)} h3 {font-size: var(--h3)} .brxe-section {flex-direction: column; row-gap: var(--space-xl); padding-top: var(--space-2xl); padding-right: var(--space-md); padding-bottom: var(--space-2xl); padding-left: var(--space-md)} .brxe-container {width: 100%; max-width: 80rem} .woocommerce main.site-main {width: 100%} #brx-content.wordpress {width: 100%; max-width: 80rem} .brxe-text * + :is(h1, h2, h3, h4, h5, h6), .brxe-post-content:not([data-source=bricks]) * + :is(h1, h2, h3, h4, h5, h6), body:not(.woocommerce-checkout) [class*=woocommerce] * + :is(h1, h2, h3, h4, h5, h6) {margin-block-start: 0px} .brxe-text * + p, .brxe-post-content:not([data-source=bricks]) * + p, body:not(.woocommerce-checkout) [class*=woocommerce] * + p {margin-block-start: 0px} .brxe-text * + *, .brxe-post-content:not([data-source=bricks]) * + *, body:not(.woocommerce-checkout) [class*=woocommerce] * + * {margin-block-start: 0px}ul, ol { padding: 0;}.bricks-button { position: relative; &:hover { transform: translate(calc(var(--btn-translate) * -1), calc(var(--btn-translate) * -1)); } &::after { content: ""; position: absolute; inset: calc(var(--btn-padding) / 2); border: calc(var(--btn-padding) / 2) solid var(--light); border-radius: calc(var(--btn-radius) - (var(--btn-padding) / 2)); }}::selection { background-color: var(--secondary); color: var(--dark); text-shadow: 0.075em 0.075em 0 rgba(0, 0, 0, 0.2);}:focus-visible { outline: 2px solid var(--secondary); outline-offset: 2px;}header.brx-sticky.scrolling > .header { backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);}: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(--light)}:where(:root) .bricks-background-light {background-color: var(--light)}:where(:root) .bricks-color-dark {color: var(--dark)}:where(:root) .bricks-background-dark {background-color: var(--dark)}:where(:root) .bricks-color-info {color: var(--brown)}:where(:root) .bricks-background-info {background-color: var(--brown)} .bricks-button {font-weight: 700; text-transform: uppercase; line-height: 1; letter-spacing: -0.01em; border-radius: 8px; padding-top: calc(1em + var(--btn-padding)); padding-right: calc(2em + var(--btn-padding)); padding-bottom: calc(1em + var(--btn-padding)); padding-left: calc(2em + var(--btn-padding)); box-shadow: 0 0 0 0 var(--dark); transition: transform 200ms ease, box-shadow 200ms ease} .bricks-button:hover {box-shadow: var(--btn-translate) var(--btn-translate) 0 0 var(--dark)} :root .bricks-button[class*="primary"] {color: var(--light); text-shadow: 0.075em 0.075em 0 rgba(0, 0, 0, 0.2)} :root .bricks-button[class*="secondary"] {color: var(--dark)} :root .bricks-button[class*="info"] {color: var(--light)} html {background-color: var(--light)} body {background: none}p, h1,h2,h3,h4,h5,h6, ol, li, figure, blockquote, ul {margin: 0;}