/*
* Global button styling
*/
/*
* Breakpoint debugging
*/
/*
* MEDIA QUERIES
* Breakpoints for responsive sites
*/
/*
* SASS Parent append
* Useful if you want to add an append to the parent without writing it out again
* Usage: @include parent-append(":hover")
* Source: https://codepen.io/imkremen/pen/RMVBvq
*/
/*
* Skew
* Useful mixing to create skewed edges
* Usage: @include angle-edge(bottomright, 3deg, topleft, 3deg, #fff);
* Source: http://www.hongkiat.com/blog/skewed-edges-css/
*/
.block-intro {
  background: var(--wp--preset--color--secondary);
  color: var(--wp--preset--color--off-white);
  margin: 0;
  padding: 8rem 0;
  position: relative;
}
@media (min-width: 783px) {
  .block-intro {
    padding: 12rem 0;
  }
}
@media (min-width: 1441px) {
  .block-intro {
    padding: 20rem 0;
  }
}
.block-intro__overlay {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-attachment: fixed;
  background-repeat: no-repeat;
  opacity: 0.1;
  position: absolute;
  background-image: url("../../../img/custom/overlay-pattern.svg");
  background-position: 0% 50%;
  background-size: auto 1949px;
}
.block-intro__wrapper {
  margin: 0 auto;
  max-width: 1387px;
  padding: 0 2rem;
}
.block-intro p:not([class]) {
  font-size: var(--wp--preset--font-size--heading);
}