/* /carteirinhas/style.css */

/* Hero com gradiente suave e textura */
.cb-hero {
  background: radial-gradient(1200px 600px at 10% 10%, rgba(13,110,253,.10), transparent),
              linear-gradient(180deg, rgba(13,110,253,.06), transparent 40%),
              #ffffff;
}

/* Badge discreta */
.cb-badge {
  background: rgba(13,110,253,.12);
  color: #0d6efd;
  padding: .5rem .9rem;
  letter-spacing: .04em;
}

/* Cartão “Selecione sua Cidade” com efeito glass sutil */
.cb-city-card {
  backdrop-filter: blur(6px);
  background: rgba(255,255,255,.88);
  border-radius: 1rem;
}

/* Select com um toque mais moderno */
.cb-select {
  border-radius: .75rem;
  padding-top: 1.15rem; /* melhora alinhamento com label floating */
}

/* Botões sociais */
.cb-social-btn {
  border-radius: .75rem;
}
.cb-social-btn:hover {
  transform: translateY(-1px);
}

/* Ajustes responsivos */
@media (max-width: 575.98px) {
  .cb-hero .display-5 { font-size: 2rem; }
}

.text-justify {
  text-align: justify !important;
}

/* Branded Side Column Cards - Gabarito Colors */
.card-gabarito-blue {
  background: linear-gradient(to bottom right, rgb(30, 76, 154, 0.9), rgb(0, 43, 92, 0.9));
  color: white;
  border: none;
}
.card-gabarito-blue h5,
.card-gabarito-blue p,
.card-gabarito-blue ul {
  color: white;
}

.card-gabarito-orange {
  background: linear-gradient(to bottom right, rgb(255, 160, 0, 0.9), rgb(255, 111, 0, 0.9));
  color: white;
  border: none;
}
.card-gabarito-orange h5,
.card-gabarito-orange p,
.card-gabarito-orange ul {
  color: white;
}

/* END OF /carteirinhas/style.css */