.choose-box  {
  height: 100%;
  padding: 50px 28px 45px;
  background-color: var(--tj-color-common-white);
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
  border-radius: 10px;
  position: relative;
  overflow: hidden;
  z-index: 1;
}

.bg-primary-custom {
  background-color: #233D87 !important;
  color: #fff !important; /* para que el texto se vea */
}

.bg-secondary-custom {
  background-color: #E3027C !important;
  color: #fff !important; /* para que el texto se vea */
}

.bg-white-custom {
  background-color: #fff !important;
} 

.text-custom-primary {
  color: #233D87 !important;
}

.text-custom-secondary{
  color: #E3027C !important;
}

.text-custom-white {
  color: #fff !important;
}

.border-custom-secondary {
  border: 2px solid #E3027C !important;
}

.custom-primary-btn {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 10px;
  position: relative;
  background-color: var(--tj-color-theme-primary);
  font-size: 16px;
  font-weight: var(--tj-fw-sbold);
  padding: 5px 5px 5px 25px;
  text-align: center;
  border-radius: 50px;
  line-height: 1;
  z-index: 2;
  overflow: hidden;
  white-space: nowrap;
}

.btn-outline-pink-pill {
  color: #E3027C;
  border: 2px solid #E3027C;
  background: transparent;
  font-size: 2rem;
  border-radius: 70px;
  padding: 10px 18px;
  transition: all 0.3s ease;
}

.btn-outline-pink-pill:hover {
  background: #E3027C;
  color: #fff;
  border-color: #E3027C;
}

.btn-pink {
  color: #fff;
  background-color: #E3027C;
  border: 2px solid #E3027C;
  border-radius: 70px;
  padding: 10px 18px;
  transition: all 0.3s ease;
}

.btn-pink:hover {
  background: #fff;
  color: #E3027C;
  border-color: #E3027C;
}

.btn-white {
  color: #fff;
  background-color: #E3027C;
  border: 2px solid #E3027C;
  border-radius: 70px;
  padding: 10px 18px;
  transition: all 0.3s ease;
}
/* ========================================= */
/* 1. SECCIÓN flotando encima del slider     */
/* ========================================= */

#choose.tj-choose-section {
  position: relative !important;
  margin-top: -200px !important; /* sube encima del slider */
  z-index: 20 !important;
}

/* ========================================= */
/* EXTRA: MÁS ESPACIO LATERAL COMO LA IMAGEN */
/* ========================================= */

#choose .container {
  max-width: 1400px !important;      /* container más ancho */
  padding-left: 70px !important;     /* aire a la izquierda */
  padding-right: 70px !important;    /* aire a la derecha */
}

/* Más espacio entre tarjetas */
#choose .row {
  --bs-gutter-x: 2.5rem !important;  /* separación horizontal */
}


/* ========================================= */
/* 2. TARJETAS estilo institucional flotante */
/* ========================================= */

#choose .choose-box.style-2 {
  background: #143f92 !important;
  border-radius: 35px !important;
  padding: 55px 25px !important;

  text-align: center !important;
  min-height: 380px !important;

  box-shadow: 0px 18px 35px rgba(0, 0, 0, 0.25) !important;

  transition: all 0.3s ease !important;
}

/* =============================== */
/* HOVER tarjeta completo */
/* =============================== */

#choose .choose-box.style-2:hover {
  background: #ffffff !important;
  transform: translateY(-12px) !important;
}

/* Texto en hover */
#choose .choose-box.style-2:hover h4,
#choose .choose-box.style-2:hover p {
  color: #E3027C !important;
}

/* ========================================= */
/* 3. ICONO grande centrado arriba           */
/* ========================================= */

#choose .choose-content img {
  max-width: 95px !important;
  margin-bottom: 25px !important;
}

/* ========================================= */
/* 4. TÍTULO grande como la imagen           */
/* ========================================= */

#choose .choose-content h4.title {
  font-size: 36px !important;
  font-weight: 700 !important;
  margin-bottom: 18px !important;
  color: #fff !important;
}

/* ========================================= */
/* 5. TEXTO pequeño centrado                 */
/* ========================================= */

#choose .choose-content p.desc {
  font-size: 16px !important;
  line-height: 1.6 !important;
  opacity: 0.9 !important;
  color: #fff !important;
}

@media (max-width: 768px) {

  #choose .container {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  #choose.tj-choose-section {
    margin-top: -60px !important;
  }

  #choose .choose-box.style-2 {
    padding: 40px 25px !important;
    min-height: auto !important;
  }

  #choose .choose-content h4.title {
    font-size: 26px !important;
  }
}


/* =============================== */
/* TITULO PRINCIPAL ABOUT SECTION  */
/* =============================== */

.tj-about-section .sec-title .line {
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  line-height: 1.05 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* SERGIO (delgado) */
.tj-about-section .sec-title .line .item-1 {
  font-size: 48px !important;
  font-weight: 300 !important;
  color: #143f92 !important;
}

/* CASTROMONTE (grueso) */
.tj-about-section .sec-title .line .item-2{
  font-size: 60px !important;
  font-weight: 800 !important;
  color: #143f92 !important;
}


.tj-about-section .desc {
  font-size: 16px !important;
  line-height: 1.7 !important;
  color: #777 !important;
  margin-top: 25px !important;
  max-width: 520px !important;
}

/* =============================== */
/* CONTADORES ROSADOS GRANDES      */
/* =============================== */

.countup-item.style-2 .inline-content {
  display: flex !important;
  align-items: baseline !important;
  gap: 5px !important;
}

/* Símbolo + */
.count-plus {
  font-size: 60px !important;
  font-weight: 800 !important;
  color: #e6007e !important;
}

/* Número gigante */
.countup-number {
  font-size: 95px !important;
  font-weight: 800 !important;
  color: #e6007e !important;
  line-height: 1 !important;
}

.count-text {
  font-size: 15px !important;
  color: #888 !important;
  line-height: 1.5 !important;
  display: block !important;
  max-width: 220px !important;
}

/* FOOTER CANDIDATE NAME*/
/* contenedor que controla el ancho */
.tj-footer-section .candidate-wrapper {
  max-width: 420px;   /* 👈 AJUSTA este valor */
}

/* nombre */
.tj-footer-section .candidate-name {
  font-size: 48px;
  font-weight: 800;
  color: #1f3c88;
  line-height: 1.1;
  margin-bottom: 12px;
}

/* CASTROMONTE ocupa todo el wrapper */
.tj-footer-section .block-text {
  display: block;
  width: 100%;
}

/* bloque rosa ocupa EXACTAMENTE lo mismo */
.tj-footer-section .candidate-location {
  width: 100%;
  background: #e6007e;
  color: #fff;
  font-size: 48px;
  font-weight: 800;
  padding: 6px 0;
  text-align: center;
}


/* Mobile */
@media (max-width: 768px) {
  .tj-footer-section .candidate-name,
  .tj-footer-section .candidate-location {
    font-size: 32px;
  }
}

/* Tamaño normal (desktop) */
.promo-text .line {
    font-weight: 700;
    font-size: 64px;
}

/* 📱 Móviles */
@media (max-width: 768px) {
    .promo-text .line {
        font-size: 40px;
    }
}