/* Paleta clara corporativa por padrão */
:root {
  --bg: #ffffff;
  --surface: #f5f7fb;
  --card: #ffffff;
  --text: #0f172a;
  --muted: #6b7280;
  --accent: #1863dc;
  --accent-2: #0ea5e9;
  --border: #e5e7eb;
}
* { box-sizing: border-box; }
html, body { height: 100%; }
body { margin: 0; font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, 'Helvetica Neue', Arial; background: var(--bg); color: var(--text); line-height: 1.5; }

.container { max-width: 1200px; margin: 0 auto; padding: 0 16px; }
.btn { background: var(--accent); color: #fff; border: 0; border-radius: .5rem; padding: .5rem .75rem; cursor: pointer; }
.btn:hover { filter: brightness(1.05); }
.link { background: transparent; color: var(--accent); border: 0; padding: 0; cursor: pointer; }

/* Barra superior data/hora */
.top-info { background: #142a52; color: #cfe1ff; font-size: .85rem; }
.top-info-inner { display: flex; gap: .75rem; align-items: center; padding: .35rem 16px; }
.pill { background: #0d1f3f; color: #a6c8ff; border: 1px solid #1f3d7a; border-radius: .25rem; padding: .1rem .4rem; }

/* Topbar corporativa */
.topbar { position: sticky; top: 0; z-index: 50; background: #ffffff; border-bottom: 1px solid var(--border); }
.topbar .container { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .75rem 16px; }
.brand { display: flex; align-items: center; gap: .75rem; }
.logo { width: 40px; height: 40px; border-radius: .5rem; display: grid; place-items: center; font-weight: 700; color: #fff; background: linear-gradient(135deg, var(--accent), var(--accent-2)); }
.site-title { margin: 0; font-size: 1.25rem; }
.tagline { display: block; color: var(--muted); font-size: .85rem; }
.actions { display: flex; gap: .5rem; align-items: center; }

/* Main nav */
.mainnav { display: flex; align-items: center; gap: 1rem; padding: .5rem 16px; }
.mainnav ul { list-style: none; display: flex; gap: .75rem; padding: 0; margin: 0; }
.mainnav a { color: var(--text); text-decoration: none; padding: .35rem .6rem; border-radius: .4rem; }
.mainnav a:hover { background: var(--surface); }
.last-updated { margin-left: auto; color: var(--muted); font-size: .85rem; }

/* Hero area split */
.hero-area { display: grid; grid-template-columns: 2fr 1fr; gap: 1rem; padding: 1rem 16px; }
.hero-left { display: grid; gap: 1rem; }
.hero-right { display: grid; gap: 1rem; }

/* Ticker */
.ticker { display: grid; grid-template-columns: 200px 1fr; align-items: center; gap: .75rem; background: var(--card); border: 1px solid var(--border); border-radius: .5rem; padding: .5rem; }
.bn-title { background: var(--accent); color: #fff; font-weight: 700; padding: .4rem .6rem; border-radius: .35rem; }
.ticker-track { display: flex; gap: 1rem; overflow-x: auto; white-space: nowrap; scrollbar-width: thin; }
.ticker-track a { color: var(--text); text-decoration: none; position: relative; padding-left: 1rem; }
.ticker-track a::before { content: '\25CF'; color: var(--accent); position: absolute; left: 0; }

/* Lead hero */
.lead { background: var(--card); border: 1px solid var(--border); border-radius: .75rem; overflow: hidden; }
.lead .hero { position: relative; }
.lead img { width: 100%; height: 420px; object-fit: cover; }
.lead .hero-content { position: absolute; left: 0; right: 0; bottom: 0; padding: 1rem; background: linear-gradient(transparent, rgba(0,0,0,.6)); }
.lead .hero-title { margin: 0 0 .35rem; font-size: 1.8rem; color: #fff; }
.lead .hero-title a { color: #fff; }
.lead .hero-meta { color: #e5e7eb; font-size: .9rem; }

/* Cards */
.grid { display: grid; grid-template-columns: 1fr; gap: 1rem; }
.card { background: var(--card); border: 1px solid var(--border); border-radius: .75rem; overflow: hidden; }
.card img { width: 100%; height: 160px; object-fit: cover; }
.card .content { padding: .75rem; }
.card .title { margin: 0 0 .35rem; font-size: 1.15rem; }
.card .meta { color: var(--muted); font-size: .85rem; }
.card .excerpt { color: #374151; }

/* Tabs horizontal segmentadas */
.tabs { display: flex; gap: 0; border: 1px solid var(--border); border-radius: .5rem; overflow: hidden; background: var(--surface); }
.tab { flex: 1; text-align: center; background: transparent; color: var(--text); border: 0; padding: .5rem .75rem; cursor: pointer; font-weight: 600; }
.tab + .tab { border-left: 1px solid var(--border); }
.tab.active { background: var(--accent); color: #fff; }

.tab-content { background: var(--card); border: 1px solid var(--border); border-radius: .5rem; padding: .5rem; }
.hidden { display: none; }
.right-item { display: grid; grid-template-columns: 88px 1fr; gap: .5rem; padding: .5rem; border-bottom: 1px solid var(--border); }
.right-item:last-child { border-bottom: 0; }
.right-item img { width: 88px; height: 66px; object-fit: cover; border-radius: .25rem; }
.right-item .kicker { font-size: .75rem; color: var(--accent); font-weight: 700; }
.right-item .title { margin: .15rem 0; font-size: .95rem; }

/* Search widget */
.search-widget { background: var(--card); border: 1px solid var(--border); border-radius: .5rem; padding: .75rem; }
.search-form { display: grid; grid-template-columns: 1fr auto; gap: .5rem; }
.search-form input { background: var(--surface); color: var(--text); border: 1px solid var(--border); padding: .5rem .75rem; border-radius: .5rem; }

/* Footer */
.site-footer { border-top: 1px solid var(--border); margin-top: 1rem; background: var(--card); }
.site-footer .container { display: flex; justify-content: space-between; gap: 1rem; padding: 1rem 16px; }
.site-footer a { color: var(--muted); text-decoration: none; }
.site-footer a:hover { color: var(--text); }

@media (max-width: 1024px) { .hero-area { grid-template-columns: 1fr; } .lead img { height: 300px; } }