:root {
  --primary: #1a3a5c;
  --primary-light: #2e86ab;
  --accent: #27ae60;
  --danger: #e74c3c;
  --warning: #f39c12;
  --bg: #f8fafc;
}

body { background: var(--bg); font-family: 'Segoe UI', system-ui, sans-serif; }

.bg-primary-dark { background: var(--primary) !important; }

/* Hero */
.hero {
  background: linear-gradient(135deg, var(--primary) 0%, var(--primary-light) 100%);
  color: #fff;
  padding: 90px 0 70px;
}
.hero h1 { font-size: 2.8rem; font-weight: 800; }

/* Cards */
.card { border: none; border-radius: 12px; box-shadow: 0 2px 12px rgba(0,0,0,.07); }
.card-header { border-radius: 12px 12px 0 0 !important; font-weight: 600; }

/* Risk badges */
.risk-0 { background: #d5f5e3; color: #1e8449; }
.risk-1 { background: #d6eaf8; color: #1a5276; }
.risk-2 { background: #fef9e7; color: #9a7d0a; }
.risk-3 { background: #fdebd0; color: #a04000; }
.risk-4 { background: #fadbd8; color: #922b21; }

.risk-badge {
  display: inline-block;
  padding: 6px 16px;
  border-radius: 20px;
  font-weight: 700;
  font-size: 1rem;
}

/* Risk bar */
.risk-bar-wrap { background: #e9ecef; border-radius: 8px; height: 22px; overflow: hidden; }
.risk-bar-fill { height: 100%; border-radius: 8px; transition: width .6s ease;
  background: linear-gradient(90deg, #27ae60, #f39c12, #e74c3c); }

/* Layer table */
.layer-row td { vertical-align: middle; font-size: .9rem; }
.layer-score-bar { height: 8px; border-radius: 4px; background: #e9ecef; }
.layer-score-fill { height: 100%; border-radius: 4px; background: var(--primary-light); }

/* Form sections */
.form-section { background: #fff; border-radius: 12px; padding: 24px;
  box-shadow: 0 2px 8px rgba(0,0,0,.06); margin-bottom: 20px; }
.form-section h6 { color: var(--primary); font-weight: 700; margin-bottom: 16px;
  padding-bottom: 8px; border-bottom: 2px solid var(--primary-light); }

/* Pricing cards */
.pricing-card { cursor: pointer; transition: transform .2s, box-shadow .2s; }
.pricing-card:hover, .pricing-card.selected {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(26,58,92,.18) !important;
  border: 2px solid var(--primary-light) !important;
}
.pricing-card .price { font-size: 2.2rem; font-weight: 800; color: var(--primary); }

/* Stat cards */
.stat-card { text-align: center; padding: 20px; }
.stat-card .stat-num { font-size: 2.4rem; font-weight: 800; color: var(--primary); }

/* Nav */
.navbar { box-shadow: 0 2px 8px rgba(0,0,0,.15); }

footer { background: #f1f4f7 !important; }

/* Responsive */
@media (max-width: 576px) {
  .hero h1 { font-size: 1.9rem; }
}