/*
 *  Base styles
 */

html {
 font-size: 100%;
}

.styling-container {
  --text-size-80: 0.694rem;
  --text-size-90: 0.833rem;
  --text-size-100: 1rem;
  --text-size-200: 1.2rem;
  --text-size-250: 1.31rem;
  --text-size-300: 1.44rem;
  --text-size-400: 1.728rem;
  --text-size-500: 2.074rem;
  --text-size-600: 2.986rem;
  --text-size-700: 4.3rem;
  font-family: Inter, sans-serif;
  font-weight: 500;
  line-height: 1.65;
  color: #111111;
}

@media (max-width: 1024px) {
  .styling-container {
    --text-size-80: 0.674rem;    /* -3% */
    --text-size-90: 0.800rem;    /* -4% */
    --text-size-100: 0.950rem;   /* -5% */
    --text-size-200: 1.128rem;   /* -6% */
    --text-size-250: 1.218rem;   /* -7% */
    --text-size-300: 1.325rem;   /* -8% */
    --text-size-400: 1.555rem;   /* -10% */
    --text-size-500: 1.815rem;   /* -12.5% */
    --text-size-600: 2.538rem;   /* -15% */
    --text-size-700: 3.440rem;   /* -20% */
  }
}

@media (max-width: 768px) {
  .styling-container {
    --text-size-80: 0.654rem;    /* Another -3% */
    --text-size-90: 0.768rem;    /* Another -4% */
    --text-size-100: 0.903rem;   /* Another -5% */
    --text-size-200: 1.060rem;   /* Another -6% */
    --text-size-250: 1.133rem;   /* Another -7% */
    --text-size-300: 1.219rem;   /* Another -8% */
    --text-size-400: 1.400rem;   /* Another -10% */
    --text-size-500: 1.588rem;   /* Another -12.5% */
    --text-size-600: 2.157rem;   /* Another -15% */
    --text-size-700: 2.752rem;   /* Another -20% */
  }
}

/*
 *  Global element styles
 */

.styling-container .paragraph {
  line-height: 1.60;
  text-wrap: pretty;
  color: #444444;
  font-family: Inter, sans-serif;
  font-size: 16px
}

.styling-container .paragraph.lead {
  font-size: var(--text-size-250);
  text-wrap: pretty;
  line-height: 1.55;
}

.styling-container .paragraph.lead-big {
  font-size: var(--text-size-300);
  text-wrap: pretty;
  line-height: 1.55;
}

.styling-container .paragraph.text-light {
  color: #ffffff;
}

.styling-container .paragraph.text-accent {
  color: #4f46e5;
}

.styling-container .paragraph.text-light.text-accent {
  color: #ffffff;
}

.styling-container .text-element {
  line-height: 1.60;
  text-wrap: pretty;
  color: #444444;
  font-family: Inter, sans-serif;
}

.styling-container .text-element.text-light {
  color: #ffffff;
}

.styling-container .text-element.text-accent {
  color: #4f46e5;
}

.styling-container .text-element.text-light.text-accent {
  color: #ffffff;
}

.styling-container .heading-1 {
   font-weight: 700;
   line-height: 1.15;
   letter-spacing: -0.022em;
   font-size: var(--text-size-700);
   color: #111111;
   font-family: Inter, sans-serif;
}

.styling-container .heading-2 {
   font-weight: 700;
   line-height: 1.15;
   letter-spacing: -0.022em;
   font-size: var(--text-size-600);
   color: #111111;
   font-family: Inter, sans-serif;
}

.styling-container .heading-3 {
   font-weight: 700;
   line-height: 1.15;
   letter-spacing: -0.022em;
   font-size: var(--text-size-500);
   color: #111111;
   font-family: Inter, sans-serif;
}

.styling-container .heading-4 {
   font-weight: 700;
   line-height: 1.15;
   letter-spacing: -0.022em;
   font-size: var(--text-size-400);
   color: #111111;
   font-family: Inter, sans-serif;
}

.styling-container .heading-5 {
   font-weight: 700;
   line-height: 1.15;
   letter-spacing: -0.022em;
   font-size: var(--text-size-300);
   color: #111111;
   font-family: Inter, sans-serif;
}

.styling-container .heading-6 {
   font-weight: 700;
   line-height: 1.15;
   letter-spacing: -0.022em;
   font-size: var(--text-size-200);
   color: #111111;
   font-family: Inter, sans-serif;
}

.styling-container .heading-1.text-light,
.styling-container .heading-2.text-light,
.styling-container .heading-3.text-light,
.styling-container .heading-4.text-light,
.styling-container .heading-5.text-light,
.styling-container .heading-6.text-light {
  color: #ffffff;
}

.styling-container .subtitle {
   font-size: 16px
   line-height: 1.25rem;
   text-wrap: pretty;
   color: #4f46e5;
   font-family: Inter, sans-serif;
   font-weight: 900;
   text-transform: uppercase;
   letter-spacing: 0;
 }

.styling-container .subtitle.text-light {
   color: #ffffff;
}

.styling-container .button {
  display: block;
  text-align: center;
  border-radius: 12px;
  background-color: #000000;
  padding: 0.55rem 1.8rem;
  font-weight: 600;
  color: white;
  box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
  transition: all 0.2s;
  font-size: 16px
}

.styling-container .button:hover {
  background-color: #6366f1;
  text-decoration: none;
  opacity: 0.65;
}

.styling-container .button.button-primary {
  border-radius: 12px;
  background-color: #4f46e5;
  color: #ffffff;
}

.styling-container .button.button-secondary {
  border-radius: 12px;
  background-color: #ffffff;
  color: #101828;
}

.styling-container .editor-content {
  line-height: 1.60;
  text-wrap: pretty;
  color: #444444;
  font-family: Inter, sans-serif;
  font-size: 16px
}

.styling-container .editor-content > * {
  margin-bottom: 15px;
}

.styling-container .editor-content > *:last-child {
  margin-bottom: 0;
}

.styling-container .editor-content ul {
  list-style-type: square;
  padding-left: 16px;
}

.styling-container .editor-content ul li {
  padding-left: 8px;
}

.styling-container .editor-content ol {
  list-style-type: numbers;
  padding-left: 16px;
}

.styling-container .editor-content ol li {
  padding-left: 8px;
}

.styling-container .editor-content .lead {
  font-size: var(--text-size-250);
  text-wrap: pretty;
  line-height: 1.55;
}

.styling-container .editor-content.text-light {
  color: #ffffff;
}

.styling-container .editor-content.text-accent {
  color: #4f46e5;
}

.styling-container .editor-content.text-light.text-accent {
  color: #ffffff;
}

/*
 *  Render the block background styles
 */

      .styling-container section#block-b39ca3ba2abe2490aaaf34d0 {
      background-image: none;
      background-color: #514d4d;
      background-position: center center;
      background-size: cover;
    }
          .styling-container section#block-c76227927ec85c1fa0d1fd12 {
      background-image: url(https://cdn.sitemacher.com/assets/initials/backgrounds/bg.jpg?width=2200&quality=80);
      background-color: #d9d9d9;
      background-position: center center;
      background-size: cover;
    }
          .styling-container section#block-8a1fcb1ee3600160688ece9f {
      background-image: none;
      background-color: #ffffff;
      background-position: center center;
      background-size: cover;
    }
            .styling-container section#block-4bf8636f93b5cfc4d3d999a7 {
      background-image: none;
      background-color: #ffffff;
      background-position: center center;
      background-size: cover;
    }