/** This file comes from automatic-gutenburg.css and retains pre-acss btn styles **/
.wp-block-button[class*="btn--"] {
  padding: 0 !important;
  background-color: transparent !important;
  min-inline-size: 0 !important;
  border: 0 !important
}

.btn--primary {
  --btn-background: var(--primary);
  --btn-background-hover: var(--primary-hover);
  --btn-text-color: var(--primary-ultra-light);
  --btn-text-color-hover: var(--primary-ultra-light);
  --btn-border-color: var(--primary);
  --btn-border-color-hover: var(--primary-hover);
  --focus-color: var(--primary-dark)
}

.btn--secondary {
  --btn-background: var(--secondary);
  --btn-background-hover: var(--secondary-hover);
  --btn-text-color: var(--secondary-ultra-light);
  --btn-text-color-hover: var(--secondary-ultra-light);
  --btn-border-color: var(--secondary);
  --btn-border-color-hover: var(--secondary-hover);
  --focus-color: var(--secondary-dark)
}

.btn--accent {
  --btn-background: var(--accent);
  --btn-background-hover: var(--accent-hover);
  --btn-text-color: #000;
  --btn-text-color-hover: #000;
  --btn-border-color: var(--accent);
  --btn-border-color-hover: var(--accent-hover);
  --focus-color: var(--accent-dark)
}

.btn--black {
  --btn-background: var(--black);
  --btn-background-hover: var(--base-dark);
  --btn-text-color: var(--white);
  --btn-text-color-hover: var(--white);
  --btn-border-color: var(--black);
  --btn-border-color-hover: var(--base-dark);
  --focus-color: var(--primary)
}

.btn--black.btn--outline {
  --btn-background: transparent;
  --btn-background-hover: var(--white);
  --btn-text-color: var(--black);
  --btn-text-color-hover: var(--black);
  --btn-border-width: 0.25rem;
  --btn-border-color: var(--black);
  --btn-border-color-hover: var(--black);
  --focus-color: var(--primary)
}

[class*="btn--"]:not(.btn--none,
  .wp-block-button),
.wp-block-button[class*="btn--"]>.wp-block-button__link,
.wp-block-button[class*="btn--"]>a {
  background: var(--btn-background);
  color: var(--btn-text-color);
  padding-block: var(--btn-padding-block);
  padding-inline: var(--btn-padding-inline);
  min-inline-size: var(--btn-min-width);
  line-height: var(--btn-line-height);
  font-size: var(--btn-font-size, var(--text-m));
  font-weight: var(--btn-font-weight);
  font-style: var(--btn-font-style);
  text-transform: var(--btn-text-transform);
  letter-spacing: var(--btn-letter-spacing);
  text-decoration: var(--btn-text-decoration);
  border-width: var(--btn-border-width);
  border-style: var(--btn-border-style);
  border-radius: var(--btn-radius);
  border-color: var(--btn-border-color);
  transition: var(--btn-transition, var(--transition));
  justify-content: var(--btn-justify-content, center);
  text-align: var(--btn-text-align, center)
}

@media (hover:hover) and (pointer:fine) {

  [class*="btn--"]:not(.btn--none,
    .wp-block-button):hover,
  .wp-block-button[class*="btn--"]>.wp-block-button__link:hover,
  .wp-block-button[class*="btn--"]>a:hover {
    background: var(--btn-background-hover);
    color: var(--btn-text-color-hover);
    border-color: var(--btn-border-color-hover);
    text-decoration: var(--btn-text-decoration-hover)
  }
}

[class*="btn--"]:not(.btn--none,
  .wp-block-button):focus,
.wp-block-button[class*="btn--"]>.wp-block-button__link:focus,
.wp-block-button[class*="btn--"]>a:focus {
  outline-style: solid;
  outline-color: var(--focus-color);
  outline-width: var(--focus-width);
  outline-offset: var(--focus-offset)
}

.btn--xs:not(.wp-block-button),
.wp-block-button.btn--xs>a,
.wp-block-button.btn--xs>.wp-block-button__link {
  font-size: var(--text-xs)
}

.btn--s:not(.wp-block-button),
.wp-block-button.btn--s>a,
.wp-block-button.btn--s>.wp-block-button__link {
  font-size: var(--text-s)
}

.btn--m:not(.wp-block-button),
.wp-block-button.btn--m>a,
.wp-block-button.btn--m>.wp-block-button__link {
  font-size: var(--text-m)
}

.btn--l:not(.wp-block-button),
.wp-block-button.btn--l>a,
.wp-block-button.btn--l>.wp-block-button__link {
  font-size: var(--text-l)
}

.btn--xl:not(.wp-block-button),
.wp-block-button.btn--xl>a,
.wp-block-button.btn--xl>.wp-block-button__link {
  font-size: var(--text-xl)
}

.btn--xxl:not(.wp-block-button),
.wp-block-button.btn--xxl>a,
.wp-block-button.btn--xxl>.wp-block-button__link {
  font-size: var(--text-xxl)
}

a[class*="btn--"] {
  display: inline-flex
}

.btn--clear.btn--clear,
.btn--none.btn--none {
  background: none;
  border: none
}

.editor-styles-wrapper {
  width: 100% !important
}


/** This file comes from automatic-bricks.css and retains pre-acss btn and text styles **/

body {
  color: var(--body-color, var(--neutral-ultra-dark));
  background-color: var(--body-bg-color, var(--base))
}

html:has(body.boxed-layout) {
  background-color: var(--device-bg-color, var(--white))
}

body {
  font-size: var(--default-font-size, var(--text-m));
  color: var(--text-color);
  line-height: var(--text-line-height);
  text-wrap: var(--text-text-wrap)
}

p,
li {
  line-height: var(--text-line-height, calc(6px + 2.3ex))
}

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
.h--1,
.h--2,
.h--3,
.h--4,
.h--5,
.h--6 {
  color: var(--heading-color);
  line-height: var(--heading-line-height);
  font-weight: var(--heading-font-weight);
  text-wrap: var(--heading-text-wrap)
}

h1 {
  font-size: var(--h1);
  line-height: var(--h1-line-height);
  max-width: var(--h1-max-width)
}

h2 {
  font-size: var(--h2);
  line-height: var(--h2-line-height)
}

h3 {
  font-size: var(--h3);
  line-height: var(--h3-line-height)
}

h4 {
  font-size: var(--h4);
  line-height: var(--h4-line-height)
}

h5 {
  font-size: var(--h5);
  line-height: var(--h5-line-height)
}

h6 {
  font-size: var(--h6);
  line-height: var(--h6-line-height)
}

body a:where(:not([class *=btn--])) {
  color: var(--link-color, var(--base-ultra-dark));
  font-weight: var(--link-weight, inherit);
  -webkit-text-decoration: var(--link-decoration, inherit);
  text-decoration: var(--link-decoration, inherit);
  text-underline-offset: var(--link-underline-offset, 0);
  transition: var(--link-transition, var(--transition))
}

@media (hover: hover) and(pointer: fine) {
  body a:where(:not([class *=btn--])):hover {
    color: var(--link-color-hover, var(--primary-hover))
  }
}

h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
  font-weight: inherit;
  text-decoration: inherit;
  color: currentcolor;
  text-underline-offset: var(--link-underline-offset, 0)
}

@media (hover: hover) and(pointer: fine) {

  h1 a:hover,
  h2 a:hover,
  h3 a:hover,
  h4 a:hover,
  h5 a:hover,
  h6 a:hover {
    color: currentcolor
  }
}

body:where(.bricks-is-frontend),
body:where(:not(.bricks-is-frontend)) {
  color: var(--body-color, var(--neutral-ultra-dark))
}

[class *="btn--"]:where(:not(.btn--none, .wp-block-button)) {
  background: var(--btn-background);
  color: var(--btn-text-color);
  padding-block: var(--btn-padding-block);
  padding-inline: var(--btn-padding-inline);
  min-inline-size: var(--btn-min-width);
  line-height: var(--btn-line-height);
  font-size: var(--btn-font-size, var(--text-m));
  font-weight: var(--btn-font-weight);
  font-style: var(--btn-font-style);
  text-transform: var(--btn-text-transform);
  letter-spacing: var(--btn-letter-spacing);
  text-decoration: var(--btn-text-decoration);
  border-width: var(--btn-border-width);
  border-style: var(--btn-border-style);
  border-radius: var(--btn-radius);
  border-color: var(--btn-border-color);
  transition: var(--btn-transition, var(--transition));
  justify-content: var(--btn-justify-content, center);
  text-align: var(--btn-text-align, center)
}

@media (hover: hover) and(pointer: fine) {
  [class *="btn--"]:where(:not(.btn--none, .wp-block-button)):hover {
    background: var(--btn-background-hover);
    color: var(--btn-text-color-hover);
    border-color: var(--btn-border-color-hover);
    text-decoration: var(--btn-text-decoration-hover)
  }
}

[class *="btn--"]:where(:not(.btn--none, .wp-block-button)):focus {
  outline-style: solid;
  outline-color: var(--focus-color);
  outline-width: var(--focus-width);
  outline-offset: var(--focus-offset)
}

.btn--xs {
  font-size: var(--text-xs)
}

.btn--s {
  font-size: var(--text-s)
}

.btn--m {
  font-size: var(--text-m)
}

.btn--l {
  font-size: var(--text-l)
}

.btn--xl {
  font-size: var(--text-xl)
}

.btn--xxl {
  font-size: var(--text-xxl)
}

.btn--clear.btn--clear,
.btn--none.btn--none {
  background: none;
  border: none
}