/*
 * Intro Content block.
 * Loaded by abefactors_acf_block_enqueue_assets() only on pages that contain the block (and in the editor).
 * No JavaScript is needed for this block.
 *
 * The head and the button use the theme styles.
 */

.section_intro_content {
  position: relative;
}
.section_intro_content .section_inner {
  position: relative;
}
.section_intro_content.has_bg::before {
  content: '';
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0.7;
  background: var(--wp--preset--color--secondary);
}
.section_intro_content .intro_buttons {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 15px 20px;
}

/* Buttons only (no title or description above them): no extra space on top. */
.section_intro_content .section_inner .head_box .intro_buttons:first-child {
  margin-top: 0;
}

/* The row follows "Align text" from the block toolbar. */
.section_intro_content.text-align-center .intro_buttons {
  justify-content: center;
}

.section_intro_content.text-align-right .intro_buttons {
  justify-content: flex-end;
}

/* Empty block in the editor. */
.intro_content_empty {
  margin: 0;
  padding: 40px 20px;
  border: 1px dashed var(--wp--preset--color--mediumgrey);
  border-radius: 24px;
  text-align: center;
}

/* ---------------------------------------------------------------------------
 * "Lead text" block style (block sidebar > Styles)
 * Home page, under the banner: one large centred paragraph and a button.
 * Design: Red Hat Display SemiBold 40/60, black, about 1290px wide (5 lines at 1728px); 65px to the button.
 * Use with Background "Light Grey" and Align text "Center".
 * ------------------------------------------------------------------------- */
.section_intro_content.is-style-lead .section_inner .head_box .section_description {
  max-width: 1290px;
  color: var(--wp--preset--color--black);
  font-size: var(--wp--preset--font-size--medium-40);
  font-weight: 600;
  line-height: 1.5;
  @media screen and (max-width: 900px) {
    font-size: var(--wp--preset--font-size--small-24);
  }
}

/* No title above it: no space on top. */
.section_intro_content.is-style-lead .section_inner .head_box .section_description:first-child {
  margin-top: 0;
}

.section_intro_content.is-style-lead .section_description p {
  margin: 0;
}

.section_intro_content.is-style-lead .section_description p + p {
  margin-top: 0.75em;
}

.section_intro_content.is-style-lead .section_inner .head_box .intro_buttons {
  margin-top: clamp(36px, 3.76vw, 65px);
}

/* Lead text is always centred, also when "Align text" was not set. */
.section_intro_content.is-style-lead .head_box {
  text-align: center;
}

.section_intro_content.is-style-lead .section_description {
  margin-left: auto;
  margin-right: auto;
}

.section_intro_content.is-style-lead .intro_buttons {
  justify-content: center;
}