:root {
  --primary-green: #2c8a3a;
  --dark-green:    #1f5e2b;
  --light-bg:      #f4f8f5;
  --accent:        #ffc107;
}

body { font-family: 'Segoe UI', Arial, sans-serif; color: #2b2b2b; }

.public-navbar { background: #fff; box-shadow: 0 2px 6px rgba(0,0,0,0.05); }
.public-navbar .navbar-brand { font-weight: 700; color: var(--dark-green); }
.site-logo { height: 42px; width: auto; }
.public-navbar .nav-link { color: #333; font-weight: 500; }
.public-navbar .nav-link:hover { color: var(--primary-green); }

/* HERO */
.hero-banner { background: #1f5e2b; line-height: 0; }
.hero-banner-img { width: 100%; height: auto; display: block; }
.hero-title-bar {
  background: linear-gradient(135deg, var(--dark-green) 0%, var(--primary-green) 100%);
}
.hero-title-bar h1 { text-shadow: 0 2px 6px rgba(0,0,0,0.3); }

.btn-success { background-color: var(--primary-green); border-color: var(--primary-green); }
.btn-success:hover { background-color: var(--dark-green); border-color: var(--dark-green); }
.btn-outline-success { color: var(--primary-green); border-color: var(--primary-green); }
.btn-outline-success:hover { background-color: var(--primary-green); }
.text-success { color: var(--primary-green) !important; }
.bg-success { background-color: var(--primary-green) !important; }

.feature-pill {
  background: var(--light-bg);
  padding: 12px;
  border-radius: 8px;
  text-align: center;
  font-weight: 500;
  font-size: 0.95rem;
  height: 100%;
  border: 1px solid #e0e8e0;
}

.overview-card {
  background: #fff;
  border-radius: 12px;
  padding: 24px 16px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.06);
  border: 1px solid #e7ece7;
  transition: transform .2s, box-shadow .2s;
  height: 100%;
}
.overview-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 20px rgba(0,0,0,0.12);
}
.overview-icon {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: var(--light-bg);
  color: var(--primary-green);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.6rem;
  margin: 0 auto 12px;
}
.overview-value {
  font-size: 1.85rem;
  font-weight: 700;
  color: var(--dark-green);
  line-height: 1.1;
}
.overview-label {
  font-size: 0.85rem;
  color: #666;
  margin-top: 4px;
  text-transform: uppercase;
  letter-spacing: 0.4px;
}

.city-card { transition: transform .2s, box-shadow .2s; border: 0; overflow: hidden; }
.city-card:hover { transform: translateY(-4px); box-shadow: 0 8px 20px rgba(0,0,0,0.12) !important; }
.city-card .card-img-top { height: 200px; object-fit: cover; }

.drive-card { border: 0; border-radius: 12px; overflow: hidden; }
.drive-card img { min-height: 220px; }

.monitoring-card { border: 0; transition: transform .2s; }
.monitoring-card:hover { transform: scale(1.02); }
.monitoring-card .card-img-top { height: 170px; object-fit: cover; }

.partners-section { border-top: 4px solid var(--primary-green); }
.site-footer { background: var(--dark-green); color: #fff; }

.city-hero h1 { text-shadow: 0 2px 8px rgba(0,0,0,0.5); }

@media (max-width: 576px) {
  .hero-section { min-height: 340px; }
  .brand-text { font-size: .9rem; }
}