:root {
    --brand-1: #1B47F9;
    --brand-2: #001CA7;
    --brand-3: #005BF0;
    --brand-4: #0097FC;
    --brand-dark: #1D1D1B;
}

.grad {
    background: linear-gradient(135deg, var(--brand-2), var(--brand-3) 45%, var(--brand-4));
}

.banner-img {
  display: block;
  width: 100%;
  object-fit: cover;
  height: 9rem;  /* ~ h-36 */
}

@media (min-width: 640px) {
  .banner-img {
    height: 10rem; /* ~ h-40 */
  }
}


.btn-tile {
    background: white;
    border: 1px solid rgba(0, 0, 0, .06);
    box-shadow: 0 0px 10px rgba(0, 0, 0, .05);
    transition: transform .08s ease, box-shadow .08s ease, border-color .08s ease;
}

.btn-tile:active {
    transform: scale(.98);
}

/* Abas com aria-selected (mantido p/ consistência visual) */
.tab-button[aria-selected="true"] {
    background-color: var(--brand-1);
    color: #fff;
}

.tab-button[aria-selected="false"] {
    background-color: #fff;
    color: var(--brand-1);
    border: 1px solid var(--brand-1);
}