/* Layout base */
.site{ padding:12px; margin:0 auto; width:100%;}
@media (min-width:992px){ .site{ max-width:1200px; padding:16px; } }
@media (min-width:1400px){ .site{ max-width:1360px; } }
body{ background:#e8edf0; color:#0f172a; }

.topbar .brand img {
    width: 10rem;
    height: auto;
    max-height: 15rem;
    object-fit: contain;
}

.header-pill {
    background: #fff;
    border-radius:var(--card-radius);
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.08);
}

/* Logo no header */
.header-logo {
    width: 36px;
    height: 36px;
    object-fit: contain;
}

@media (max-width: 576px) {
    .header-logo {
        width: 32px;
        height: auto;
        max-height: 36px;
    }
}

/* Header e cartões */
.card-ui{ border:0; border-radius:var(--card-radius); overflow:hidden; box-shadow:0 8px 24px rgba(0,0,0,.08); background:#fff; }
.card-dark{ background:var(--brand-dark); color:#fff; border-radius:var(--card-radius); box-shadow:0 8px 24px rgba(0,0,0,.10); }

/* Hero “dentro” da coluna */
.hero-img{ aspect-ratio:16/9; width:10%; object-fit:cover; }
.overlay-grad{ position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,0,0,0) 40%, rgba(0,0,0,.6) 100%); }

/* Thumb notícia */
.thumb{ width:74px; height:74px; border-radius:14px; object-fit:cover; }

/* Coluna direita fixa no desktop */
@media (min-width:992px){ .right-col{ position:sticky; top:88px; } }

/* Service cards */
.service-card{ border:1px solid #e5e7eb; border-radius:14px; background:#fff; padding:16px; position:relative; min-height:110px; }
.service-icon{ font-size:24px; color:var(--brand); }
.service-card .go{ position:absolute; right:10px; bottom:10px; width:34px; height:34px; border-radius:50%; display:grid; place-items:center; background:var(--brand); color:#fff; }

/* Pills (com <a class="btn pill">) */
.pill-tabs{ background:#fff; border-radius:22px; padding:6px; display:flex; gap:6px; overflow:auto; }
/* reset do .btn do Bootstrap dentro das tabs */
.pill-tabs .pill.btn{ border:0; background:transparent; color:inherit; box-shadow:none; }
.pill-tabs .pill{ border-radius:18px; padding:8px 14px; font-weight:600; white-space:nowrap; }
.pill-tabs .pill.active{ background:rgba(37,99,235,.16); color:#1e40af; box-shadow:0 4px 14px rgba(37,99,235,.25); }