:root {
  --green: #28a745;
  --blue:  #3498db;
  --gold:  #f1c40f;
  --dark:  #212529;
  --light: #f8f9fa;
  --font:  'Poppins', sans-serif;
}

body {
  font-family: var(--font);
  padding-top: 70px; /* accommodate fixed navbar */
  background-color: var(--light);
  color: var(--dark);
}

/* Navbar */
.bg-green { background-color: var(--green) !important; }

/* Hero */
.hero-section {
  position: relative;
  height: 60vh;
  background:
    linear-gradient(135deg, rgba(40,167,69,0.8), rgba(52,152,219,0.8)),
    url('hero-bg.jpg') center/cover no-repeat;
}
.hero-section .overlay {
  position: absolute; inset: 0;
  background: rgba(0,0,0,0.3);
}
.hero-section h1,
.hero-section p { z-index: 1; }

.btn-gold {
  background-color: var(--gold);
  color: var(--dark);
  border: none;
  transition: background-color .3s, transform .2s;
}
.btn-gold:hover {
  background-color: #d4ac0d;
  transform: translateY(-2px);
}

.btn-green {
  background-color: var(--green);
  color: #fff;
  border: none;
  transition: background-color .3s;
}
.btn-green:hover {
  background-color: #218838;
}

.section-title {
  font-weight: 600;
  font-size: 2rem;
  margin-bottom: 1.5rem;
}

.text-blue { color: var(--blue) !important; }

/* Table */
.table-dark { background-color: var(--dark); color: #fff; }

/* Footer */
footer {
  background-color: var(--dark);
  color: #fff;
}