:root{
  --primary: #2f6f93;
  --primary-ink: #1f4f67;
  --soft: rgba(47,111,147,.08);
}

body{
  background: #f7f8fa;
}

.hero{
  background: linear-gradient(180deg, var(--soft), rgba(255,255,255,0));
  border-bottom: 1px solid rgba(0,0,0,.06);
}

.hero-card{
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(0,0,0,.06);
}

.section-title{
  letter-spacing: .2px;
}

.card{
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 16px;
}

.btn-primary{
  background: var(--primary);
  border-color: var(--primary);
}

.btn-primary:hover{
  background: var(--primary-ink);
  border-color: var(--primary-ink);
}

.tagline{
  color: rgba(0,0,0,.65);
}

.project-featured{
  border: 1px solid rgba(47,111,147,.45);
  box-shadow: 0 12px 35px rgba(47,111,147,.12);
}

.list-group-item.active{
  background: var(--primary) !important;
  border-color: var(--primary) !important;
}
.breadcrumb a:hover{
  text-decoration: underline !important;
}

.hero p, .hero h1 {
  background-color: var(--primary);
  background: rgba(0,0,0,0.5);
}

.hero-home {
  background-image: url("assets/img/hero-home.jpg");
}