.text-block {
  inline-size: 100%;
  padding-block: 4rem;
  padding-inline: 2rem;
}

.text-block__container {
  inline-size: 100%;
  margin-inline: auto;
  max-inline-size: 81.25rem;
}

.text-block__content {
  inline-size: 100%;
  margin-inline: auto;
  max-inline-size: 56.25rem;
  padding-block-start: 3rem;
  text-align: start;
}

.text-block__content:first-child {
  padding-block-start: 0;
}

.text-block__content h1 {
  font-family: var(--h1-font-family, var(--primary-font));
  font-size: var(--h1-font-size, 3rem);
  font-weight: var(--h1-font-weight, 700);
  line-height: 1.2;
  padding-block-start: 3rem;
}

.text-block__content h2 {
  font-family: var(--h2-font-family, var(--primary-font));
  font-size: var(--h2-font-size, 2.25rem);
  font-weight: var(--h2-font-weight, 700);
  line-height: 1.2;
  padding-block-start: 2.5rem;
}

.text-block__content h3 {
  font-family: var(--h3-font-family, var(--primary-font));
  font-size: var(--h3-font-size, 1.75rem);
  font-weight: var(--h3-font-weight, 600);
  line-height: 1.3;
  padding-block-start: 2rem;
}

.text-block__content h4 {
  font-family: var(--h4-font-family, var(--primary-font));
  font-size: var(--h4-font-size, 1.5rem);
  font-weight: var(--h4-font-weight, 600);
  line-height: 1.3;
  padding-block-start: 2rem;
}

.text-block__content h5 {
  font-family: var(--h5-font-family, var(--primary-font));
  font-size: var(--h5-font-size, 1.25rem);
  font-weight: var(--h5-font-weight, 600);
  line-height: 1.4;
  padding-block-start: 1.5rem;
}

.text-block__content h6 {
  font-family: var(--h6-font-family, var(--primary-font));
  font-size: var(--h6-font-size, 1rem);
  font-weight: var(--h6-font-weight, 600);
  line-height: 1.4;
  padding-block-start: 1.5rem;
}

.text-block__content > :first-child {
  padding-block-start: 0;
}

.text-block__content p {
  font-size: var(--p-font-size, 1rem);
  line-height: 1.7;
  padding-block-start: 1.25rem;
}

.text-block__content > p:first-child {
  padding-block-start: 0;
}

.text-block__content ul,
.text-block__content ol {
  font-size: var(--p-font-size, 1rem);
  line-height: 1.7;
  padding-block-start: 1.25rem;
  padding-inline-start: 1.5rem;
}

.text-block__content > ul:first-child,
.text-block__content > ol:first-child {
  padding-block-start: 0;
}

.text-block__content ul {
  list-style-type: disc;
}

.text-block__content ol {
  list-style-type: decimal;
}

.text-block__content li {
  padding-block-start: 0.5rem;
}

.text-block__content li:first-child {
  padding-block-start: 0;
}

.text-block__content ul ul,
.text-block__content ol ol,
.text-block__content ul ol,
.text-block__content ol ul {
  padding-block-start: 0.5rem;
}

.text-block__content a {
  color: var(--link-color, var(--primary-color, #4285F4));
  text-decoration: underline;
  transition: color 0.3s ease;
}

.text-block__content a:hover {
  color: var(--link-hover-color, #357ae8);
}

.text-block__content blockquote {
  border-inline-start: 0.25rem solid var(--primary-color, #4285F4);
  font-style: italic;
  margin-block: 1.5rem;
  margin-inline: 0;
  padding-block: 1rem;
  padding-inline: 1.5rem;
}

.text-block__content > blockquote:first-child {
  margin-block-start: 0;
}

.text-block__content blockquote * {
  padding-block-start: 0;
}

/* Pretitle */
.text-block__pretitle {
  color: var(--body-color, #212529);
  display: block;
  font-family: inherit;
  font-size: var(--p-font-size, 1rem);
  font-weight: 600;
  letter-spacing: 0.05em;
  margin-block: 0;
  margin-inline: auto;
  max-inline-size: 56.25rem;
}

/* Title */
.text-block__title {
  font-size: var(--h2-font-size, 2.5rem);
  font-weight: 700;
  line-height: 1.2;
  margin-inline: auto;
  max-inline-size: 56.25rem;
  padding-block-start: 1rem;
}

.text-block__title:first-child {
  padding-block-start: 0;
}

/* Description */
.text-block__description {
  font-size: calc(var(--p-font-size, 1rem) + 0.2rem);
  line-height: 1.6;
  margin-inline: auto;
  max-inline-size: 56.25rem;
  padding-block-start: 1.5rem;
}

.text-block__description:first-child {
  padding-block-start: 0;
}

.text-block__description p {
  font-size: inherit;
  margin-block-end: 1rem;
}

.text-block__description p:last-child {
  margin-block-end: 0;
}

/* CTAs */
.text-block__cta-wrapper {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: center;
  padding-block-start: 3rem;
}

.text-block__cta-wrapper--visible {
  opacity: 1;
}

/* Center Alignment — pretitle, title, and description */
.text-block.text-center .text-block__pretitle,
.text-block.text-center .text-block__title,
.text-block.text-center .text-block__description {
  text-align: center;
}

/* ==========================================================================
   Two Columns Layout
   ========================================================================== */

.text-block--two-columns .text-block__grid {
  align-items: start;
  display: grid;
  gap: 3rem;
  grid-template-columns: 1fr 1fr;
}

.text-block--two-columns .text-block__pretitle {
  text-align: start;
}

.text-block--two-columns .text-block__title {
  text-align: start;
}

.text-block--two-columns .text-block__description {
  margin-inline: 0;
  max-inline-size: none;
  padding-block-start: 0;
  text-align: start;
}

.text-block--two-columns .text-block__description:first-child {
  padding-block-start: 0;
}

.text-block--two-columns .text-block__cta-wrapper {
  justify-content: flex-start;
}

@media (max-width: 48rem) {
  .text-block {
    padding-block: 3rem;
    padding-inline: 1.5rem;
  }

  .text-block--two-columns .text-block__grid {
    grid-template-columns: 1fr;
  }
}