.cta-action {
  --section-padding-vertical: calc(var(--primary-vertical-padding) - 4.5vh);
  --title-font-size: 1.45rem;
  --title-margin-bottom: 2rem;
  --text-margin-bottom: 2.5rem;
  --text-font-size: inherit;
  --button-min-width: 15rem;
  --button-padding-vertical: 10.5px;
  --button-padding-horizontal: 15px;
  --text-max-width: 30rem;
  --text-width: fit-content;
  --button-width: min-content;
  --button-margin-vertical: 0;
  --actions-max-width: 40rem;
  --actions-gap: 1rem;

  width: 100%;

  background-color: #595857;

  padding-top: var(--section-padding-vertical);
  padding-right: var(--primary-horizontal-padding);
  padding-bottom: var(--section-padding-vertical);
  padding-left: var(--primary-horizontal-padding);
}

.cta-action__block__title {
  max-width: var(--text-max-width);
  width: var(--text-width);

  margin-right: auto;
  margin-bottom: var(--title-margin-bottom);
  margin-left: auto;
}

.cta-action__block__title p {
  color: var(--primary-base-color-code);
  font-size: var(--title-font-size);
  font-weight: bold;
}

.cta-action__block__text {
  max-width: var(--text-max-width);
  width: var(--text-width);

  margin-right: auto;
  margin-bottom: var(--text-margin-bottom);
  margin-left: auto;
}

.cta-action__block__text p {
  color: var(--primary-base-color-code);
  font-size: var(--text-font-size);
}

.cta-action__block__actions {
  max-width: var(--actions-max-width);
  width: 100%;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(var(--button-min-width), max-content));
  justify-content: center;
  gap: var(--actions-gap);
  margin: 0 auto;
}

.cta-action__block__button {
  width: var(--button-width);
  min-width: var(--button-min-width);
  text-align: center;
  border-radius: var(--radius-card);
  transition-property: var(--transition-property-default);
  transition-duration: var(--transition-duration-base);
  transition-timing-function: var(--transition-ease-default);
}

.cta-action__block__button--primary {
  background-color: var(--accent-color-code);
}

.cta-action__block__button--secondary {
  background-color: transparent;
  box-shadow: inset 0 0 0 1px rgb(var(--primary-base-color-rgb) / 0.3);
}

.cta-action__block__button a {
  display: block;
  color: var(--primary-base-color-code);
  text-decoration: none;

  padding-top: var(--button-padding-vertical);
  padding-right: var(--button-padding-horizontal);
  padding-bottom: var(--button-padding-vertical);
  padding-left: var(--button-padding-horizontal);
}

.cta-action__block__button--primary:hover {
  filter: brightness(1.175);
}

.cta-action__block__button--secondary:hover {
  background-color: rgb(var(--primary-base-color-rgb) / 0.08);
}

@media screen and (max-width: 959px) {
  .cta-action {
    --section-padding-vertical: var(--primary-vertical-padding);
    --title-font-size: 1.15rem;
    --title-margin-bottom: 0.95rem;
    --text-margin-bottom: 1.25rem;
    --text-font-size: 0.875rem;
    --button-min-width: 150px;
    --button-padding-vertical: 7.5px;
    --button-padding-horizontal: 10px;
    --text-width: fit-content;
    --button-width: fit-content;
    --button-margin-vertical: 0.75rem;
    --actions-gap: 0.75rem;
  }

  .cta-action__block__text {
    padding-right: var(--primary-horizontal-padding);
    padding-left: var(--primary-horizontal-padding);
  }

  .cta-action__block__actions {
    grid-template-columns: 1fr;
  }

  .cta-action__block__button {
    width: 100%;
  }

  .cta-action__block__button a {
    font-size: 0.89rem;
  }
}