/************************************************************
 *
 * Text + image Paragraph
 *
 ************************************************************/
.paragraph--type--text-and-title--wrapper {
  display: flex;
  margin: 0 auto;
  gap: 4em;
  padding-top: 90px;
  align-items: start;
  justify-content: end;
}
@media (max-width: 767px) {
  .paragraph--type--text-and-title--wrapper {
    flex-direction: column;
    padding-top: 0px;
  }
}


.paragraph--type--text-and-title--title {
  width: min-content;
  min-width: min(380px, 100%);
}
@media (max-width: 767px) {
  .paragraph--type--text-and-title--title {
    width: 100%;
    display: block;
  }
}
.paragraph--type--text-and-title--text {
  position: relative;
  width: 50%;
  &:after {
    content: '';
    position: absolute;
    z-index: 0;
    left: 0;
    right: 0;
    bottom: 0;
    top: -90px;
    background-image: url('../../../base/images/pattern.svg');
  }
}
@media (max-width: 767px) {
  .paragraph--type--text-and-title--text {
    width: 100%;
  }
  .paragraph--type--text-and-title--text:after {
    display: none;
  }
}


.paragraph--type--text-and-title--text-inner {
  position: relative;
  z-index: 1;
  background-color: white;
  max-width: 320px;
  padding: 30px 30px 30px 0;
  margin-top: -30px;
}
@media (max-width: 767px) {
  .paragraph--type--text-and-title--text-inner {
    max-width: 100%;
    padding: 0;
    margin: 0;
  }
}



  .paragraph--type--text-and-title--title h2 {
    border-color: #C7A88C;
  }
  .paragraph--type--text-and-title--title h2.underline:before {
    background-color: #C7A88C;
  }


.paragraph--type--text-and-title--text:after {
  background-position: right top;
}


  .bg-brown-light .paragraph--type--text-and-title--text-inner {
    background-color: #F1E8E0;
  }
  .bg-brown-light .paragraph--type--text-and-title--text:after {
    background-image: url('../../../base/images/pattern.svg');
  }
  .bg-brown-light .paragraph--type--text-and-title--title h2 {
    border-color: #0D1D2C;
  }
  .bg-brown-light .paragraph--type--text-and-title--title h2.underline:before {
    background-color: #0D1D2C;
  }


  .bg-blue-dark .paragraph--type--text-and-title--text-inner {
    background-color: #0D1D2C;
  }
  .bg-blue-dark .paragraph--type--text-and-title--text:after {
    background-image: url('../../../base/images/pattern-white.svg');
  }
  .bg-blue-dark .paragraph--type--text-and-title--title h2 {
    color: white;
    border-color: white;
  }
  .bg-blue-dark .paragraph--type--text-and-title--title h2.underline:before {
    background-color: white;
  }


.patern-patern_2 .paragraph--type--text-and-title--text:after {
  background-image: url('../../../base/images/pattern-2.svg');
}
.patern-patern_3 .paragraph--type--text-and-title--text:after {
  background-image: url('../../../base/images/pattern-3.svg');
}
.bg-blue-dark.patern-patern_2 .paragraph--type--text-and-title--text:after {
  background-image: url('../../../base/images/pattern-2-white.svg');
}
.bg-blue-dark.patern-patern_3 .paragraph--type--text-and-title--text:after {
  background-image: url('../../../base/images/pattern-3-white.svg');
}







/*# sourceMappingURL=paragraph-text-and-image.css.map */