:root{
  --brand-orange:#ff7a18;
  --brand-blue:#2f80ff;
  --ink:#0f172a;
  --muted:#64748b;
  --card:#ffffff;
  --soft:#f6f7fb;
  --radius:18px;
  --shadow: 0 12px 35px rgba(2, 6, 23, .10);
}

*{font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;}
.bg-soft{background: radial-gradient(1200px 600px at 20% -10%, rgba(255,122,24,.18), transparent 60%),
                     radial-gradient(1000px 600px at 90% 10%, rgba(47,128,255,.16), transparent 60%),
                     var(--soft); color: var(--ink);}
.fw-800{font-weight:800;}
.fw-600{font-weight:600;}
.brand-mark{
  width:28px;height:28px;border-radius:10px;
  background: conic-gradient(from 210deg, var(--brand-orange), #ffd3b0 40%, var(--brand-blue) 85%, #d8e7ff);
  box-shadow: 0 8px 20px rgba(255,122,24,.20);
}
.navbar-glass{
  background: rgba(255,255,255,.65);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(15,23,42,.06);
}
.avatar{
  width:34px;height:34px;border-radius:12px;
  display:grid;place-items:center;
  background: linear-gradient(135deg, rgba(255,122,24,.18), rgba(47,128,255,.18));
  color: var(--ink);
  font-weight: 800;
  border: 1px solid rgba(15,23,42,.06);
}

.hero{
  border-radius: 26px;
  overflow: hidden;
  position: relative;
  box-shadow: var(--shadow);
  background:
    radial-gradient(900px 400px at 20% 10%, rgba(255,122,24,.22), transparent 60%),
    radial-gradient(900px 400px at 90% 30%, rgba(47,128,255,.20), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.90), rgba(255,255,255,.60));
  border: 1px solid rgba(15,23,42,.06);
}
.hero::after{
  content:"";
  position:absolute; inset:-80px -120px auto auto;
  width:300px;height:300px;border-radius:999px;
  background: radial-gradient(circle at 30% 30%, rgba(255,122,24,.35), transparent 60%);
  filter: blur(2px);
}
.hero .confetti{
  position:absolute; inset:0;
  background-image: radial-gradient(rgba(255,122,24,.35) 1px, transparent 1px);
  background-size: 22px 22px;
  opacity:.20;
  mask-image: radial-gradient(circle at 30% 30%, black 0, transparent 65%);
}

.card-soft{
  background: rgba(255,255,255,.86);
  border: 1px solid rgba(15,23,42,.06);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}
.btn-primary{
  background: linear-gradient(90deg, var(--brand-orange), #ff9a4c);
  border: 0;
  box-shadow: 0 10px 25px rgba(255,122,24,.22);
}
.btn-primary:hover{filter: brightness(.98);}
.btn-outline-primary{
  border-color: rgba(255,122,24,.45);
  color: #d85c00;
}
.btn-outline-primary:hover{
  background: rgba(255,122,24,.10);
  color: #b94c00;
  border-color: rgba(255,122,24,.55);
}

.kpi{
  border-radius: 20px;
  padding: 18px 18px;
  background: linear-gradient(135deg, rgba(47,128,255,.16), rgba(255,122,24,.14));
  border: 1px solid rgba(15,23,42,.06);
  box-shadow: 0 10px 25px rgba(2,6,23,.08);
}
.kpi .num{font-size: 34px; font-weight: 800; line-height:1;}
.kpi .lbl{color: var(--muted); font-weight: 600;}

.badge-soft{
  background: rgba(2,6,23,.06);
  color: var(--ink);
  border: 1px solid rgba(15,23,42,.06);
}

.table thead th{
  color: var(--muted);
  font-weight: 700;
  border-bottom: 1px solid rgba(15,23,42,.08);
}
.table td, .table th{vertical-align: middle;}
.pill{
  padding: .35rem .6rem;
  border-radius: 999px;
  font-weight: 700;
  font-size: .78rem;
}
.pill-new{background: rgba(47,128,255,.12); color:#1d4ed8;}
.pill-contact{background: rgba(255,122,24,.12); color:#b45309;}
.pill-site{background: rgba(16,185,129,.14); color:#047857;}
.pill-closed{background: rgba(100,116,139,.16); color:#334155;}

.footer{border-top: 1px solid rgba(15,23,42,.06); background: rgba(255,255,255,.55); backdrop-filter: blur(10px);}
.alert-soft{background: rgba(255,255,255,.85);}

.form-control, .form-select{
  border-radius: 14px;
  border: 1px solid rgba(15,23,42,.10);
  padding: .75rem .9rem;
}
.form-control:focus, .form-select:focus{
  box-shadow: 0 0 0 .25rem rgba(255,122,24,.14);
  border-color: rgba(255,122,24,.55);
}