:root {
  --azul-1: #0b1f3a;
  --azul-2: #123c6b;
  --azul-3: #eaf5ff;
  --laranja: #ff7a00;
  --laranja-2: #ff9d3d;
  --texto: #18324a;
  --muted: #6c7d90;
  --branco: #ffffff;
  --borda: rgba(15, 35, 62, 0.08);
  --shadow: 0 16px 40px rgba(9, 33, 62, 0.10);
}
body {background: linear-gradient(180deg,#f7fbff 0%,#eef5fb 100%); color: var(--texto); font-family: Arial, Helvetica, sans-serif;}
.navbar-brand img {height: 42px;}
.hero {background: radial-gradient(circle at top left, rgba(255,122,0,.18), transparent 25%), linear-gradient(135deg, #0b1f3a 0%, #123c6b 60%, #15518d 100%); color: #fff; border-radius: 24px; padding: 48px; box-shadow: var(--shadow);}
.hero .badge-tech {background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.25); color: #fff;}
.card-premium {border: 1px solid var(--borda); border-radius: 22px; box-shadow: var(--shadow); background: #fff; overflow: hidden;}
.card-premium .thumb {height: 220px; object-fit: cover; width: 100%; background: #dbeefe;}
.btn-primary {background: linear-gradient(135deg,var(--laranja),var(--laranja-2)); border: none; border-radius: 14px;}
.btn-outline-primary {border-radius: 14px;}
.section-title {font-weight: 800; color: var(--azul-1);}
.metric {background:#fff; border:1px solid var(--borda); border-radius:20px; padding:18px; box-shadow: var(--shadow);}
.sidebar {min-height:100vh; background: linear-gradient(180deg,#0b1f3a,#102e54); color:#fff;}
.sidebar a {color:#dfeeff; text-decoration:none; padding:10px 14px; display:block; border-radius:12px;}
.sidebar a:hover, .sidebar a.active {background: rgba(255,255,255,.12); color:#fff;}
.table-wrap {background:#fff; border-radius:20px; border:1px solid var(--borda); box-shadow: var(--shadow); padding: 18px;}
.topbar {background:#fff; border-bottom:1px solid var(--borda);}
.login-wrap {min-height:100vh; display:flex; align-items:center; justify-content:center;}
.login-card {max-width:420px; width:100%;}
.footer {color:#567;}
.carousel-item img {height: 420px; object-fit: cover; border-radius: 24px;}
@media (max-width: 768px) {
  .hero {padding: 26px;}
  .carousel-item img {height: 240px;}
}