@media (min-width: 768px) {
  :root {
    --wp--preset--font-size--display-large: 3.5rem;
    --wp--preset--font-size--display-medium: 3.25rem;
    --wp--preset--font-size--display-small: 3rem;
    --wp--preset--font-size--title-large: 3rem;
    --wp--preset--font-size--title-h--1: 2rem;
    --wp--preset--font-size--title-h-2: 1.5rem;
    --wp--preset--font-size--title-h-3: 1.25rem;
    --wp--preset--font-size--title-h-4: 1.125rem;
    --wp--preset--font-size--body-large: 1.25rem;
    --wp--preset--font-size--body-medium: 1.125rem;
    --wp--preset--font-size--body-regular: 1rem;
    --wp--preset--font-size--body-small: 0.875rem;
  }
}

@media (min-width: 1024px) {
  :root {
    --wp--preset--font-size--display-large: 4rem;
    --wp--preset--font-size--display-medium: 4rem;
    --wp--preset--font-size--display-small: 3.5rem;
    --wp--preset--font-size--title-large: 4rem;
    --wp--preset--font-size--title-h-1: 2.5rem;
    --wp--preset--font-size--title-h-2: 2rem;
    --wp--preset--font-size--title-h-3: 1.5rem;
    --wp--preset--font-size--title-h-4: 1.25rem;
    --wp--preset--font-size--body-large: 1.5rem;
    --wp--preset--font-size--body-medium: 1.25rem;
    --wp--preset--font-size--body-regular: 1rem;
    --wp--preset--font-size--body-small: 1rem;
  }
}

body.high-contrast {
  --wp--preset--color--baseblack: #fff;
  --wp--preset--color--basewhite: #000;
  --wp--preset--color--black: #fff;
  --wp--preset--color--white: #000;
  --wp--preset--color--green-1: #c3faaf;
  --wp--preset--color--green-2: #bfd9c0;
  --wp--preset--color--green-3: #c3faaf;
  --wp--preset--color--green-4: #c3faaf;
  --wp--preset--color--gray-100: #000;
  --wp--preset--color--gray-800: #fff;
  --wp--preset--color--blur-1: #18223099;
  --wp--preset--color--blue: #fff;
  --wp--preset--color--gray-950: #fcfcfc;
  --wp--preset--color--green-light-dash: #c3faaf;
  --wp--preset--color--gray-light-dash: #c3faaf;
  --wp--preset--color--gray-dark-dash: #fff;
}

/* Estilos generales del componente CTA */
.section-cta {
  background-repeat: no-repeat;
  border-radius: 8px;
  overflow: hidden;
  padding: 24px 17px;
  position: relative;
}

.section-cta::before {
  bottom: 0;
  content: "";
  filter: brightness(0.5);
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 1;
}

.section-cta .container_cta {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: 40px;
  padding: 0;
  position: relative;
  z-index: 2;
}

.section-cta .text {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.section-cta .text h2,
.section-cta .text p {
  color: var(--wp--preset--color--white) !important;
  margin: 0;
  padding: 0;
}

.section-cta .text h2 {
  font-size: 30px;
  font-weight: 500;
}

.section-cta .text p {
  font-size: 16px;
  font-weight: 400;
}

.section-cta a {
  align-items: center;
  background-color: var(--wp--preset--color--white);
  border: 1px solid var(--wp--preset--color--default-purple);
  border-radius: 30px;
  color: var(--wp--preset--color--default-purple) !important;
  display: flex;
  font-size: 16px;
  font-weight: 600;
  gap: 16px;
  padding: 15px 24px;
}

.section-cta a:hover {
  border: 1px solid var(--wp--preset--color--deep-purple);
  color: var(--wp--preset--color--deep-purple) !important;
}

@media (min-width: 1024px) {
  .section-cta {
    padding: 68px 0;
  }

  .section-cta .text {
    align-items: center;
  }

  .section-cta .text h2,
  .section-cta .text p {
    color: var(--wp--preset--color--white) !important;
  }

  .section-cta .text h2 {
    font-size: 38px;
  }

  .section-cta .text p {
    font-size: 20px;
  }
}

body.home .section-cta::before {
  filter: none !important;
}

/* ==========================================================
   AJUSTE DEL BANNER "YA SOMOS BANCO" EN LA HOME
   No depende de la clase numérica dinámica.
   ========================================================== */

/* Mobile */
body.home .section-cta {
  box-sizing: border-box;
  width: 100%;
  min-height: 0;
  padding: 0;

  /*
   * Proporción de la imagen móvil:
   * 3000 × 2778 px
   */
  aspect-ratio: 3000 / 2778;
}

/* Imagen de fondo */
body.home .section-cta::before {
  background-repeat: no-repeat !important;
  background-size: cover !important;
  background-position: center top !important;
  filter: none !important;
}

/* Contenedor: botón abajo a la izquierda en mobile */
body.home .section-cta .container_cta {
  position: absolute;
  inset: 0;
  z-index: 2;

  box-sizing: border-box;
  width: 100%;
  max-width: none;
  height: 100%;
  margin: 0;
  padding: 24px !important;

  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
  gap: 16px;
}

/*
 * El título ya forma parte de la imagen.
 * Los elementos h2 y p del HTML están vacíos.
 */
body.home .section-cta .wrapper.text {
  display: none;
}

/* Contenedor del botón */
body.home .section-cta .wp-block-button {
  box-sizing: border-box;
  width: auto;
  max-width: 100%;
  margin: 0;
  padding: 0;
  align-self: flex-start;
}

/* Enlace del botón */
body.home .section-cta .wp-block-button__link {
  box-sizing: border-box;
  width: auto;
  max-width: 100%;
  min-height: 48px;
  padding: 12px 22px;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  font-size: 16px;
  line-height: 1.3;
  white-space: normal;
  text-align: center;
}

/* ==========================================================
   TABLET Y DESKTOP
   Botón abajo y centrado horizontalmente
   ========================================================== */

@media (min-width: 768px) {
  body.home .section-cta {
    /*
     * Proporción de la imagen desktop:
     * 3000 × 771 px
     */
    aspect-ratio: 3000 / 771;
  }

  body.home .section-cta::before {
    background-position: center center !important;
  }

  body.home .section-cta .container_cta {
    position: absolute !important;
    inset: 0 !important;

    box-sizing: border-box;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 28px 4% !important;

    display: flex;
    flex-direction: column;
    align-items: center !important;
    justify-content: flex-end !important;
  }

  /*
   * Posicionamiento definitivo:
   * centro horizontal y parte inferior.
   */
  body.home .section-cta .wp-block-button {
    position: absolute !important;

    top: auto !important;
    right: auto !important;
    bottom: 28px !important;
    left: 50% !important;

    width: auto;
    max-width: calc(100% - 48px);
    margin: 0 !important;
    padding: 0;

    align-self: auto !important;
    transform: translateX(-50%) !important;
  }
}