/* Use the same fonts everywhere */
body {
  font-family: "Public Sans", "Noto Sans", sans-serif;
}

/* Hero background */
.hero-section {
  position: relative;
  height: 500px;
  background: url('https://lh3.googleusercontent.com/aida-public/AB6AXuA_Ksze7Oyn2eLNEUGIQH1SmG-Bn40qRAYRXMTfhOaRf3VZXgOfZBzcjq8exfVn172f8XDJZE1eXxV812Jzox4tZq7BKbPe40WlxfAhMXQiCk6ChxHtpnmne16_KjzRM_AIVYteC12Lx8nFanZR-kxbL0bY2JfdDitz5WE7hkMtogzIdmtytTP8wImNij5ga3ZmBxdv0B1jUjXIKs4FUIS6PNL-0nkknt0PE7y0k6-KitYuBzQwsFDJYGiHyVOkohLQvsHhm2khIi4') center/cover no-repeat;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: white;
}

.hero-content {
  position: relative;
  z-index: 10;
  max-width: 800px;
  padding: 0 1rem;
}

.hero-content h1 {
  font-size: 3rem;
  font-weight: 800;
  line-height: 1.2;
}

.hero-content p {
  margin-top: 1.5rem;
  font-size: 1.2rem;
}

.hero-buttons {
  margin-top: 2rem;
  display: flex;
  gap: 1rem;
  justify-content: center;
}

/* Reusable buttons */
.btn-orange {
  background: #f97316;
  color: white;
  padding: 0.5rem 1.25rem;
  border-radius: 0.5rem;
  font-weight: 600;
  transition: background 0.2s;
}
.btn-orange:hover { background: #ea580c; }

.btn-blue {
  background: #1e3a8a;
  color: white;
  padding: 0.5rem 1.25rem;
  border-radius: 0.5rem;
  font-weight: 600;
  transition: background 0.2s;
}
.btn-blue:hover { background: #1e40af; }

.btn-white {
  background: #ffffff;
  color: #374151;
  padding: 0.5rem 1.25rem;
  border-radius: 0.5rem;
  font-weight: 600;
  transition: background 0.2s;
}
.btn-white:hover { background: #e5e7eb; }