/* ---- Hero ---- */
.hero {
  background: linear-gradient(135deg, #08384f 0%, #0a6ea4 55%, #14a3a6 100%);
  color: #fff;
  padding: 6rem 1.5rem 5rem;
  margin: -1rem -1rem 2.5rem;   /* bleed to edges of full-width layout */
  text-align: center;
}
.hero-inner { max-width: 820px; margin: 0 auto; }
.hero-title { color: #fff; font-weight: 700; line-height: 1.15; }
.hero-sub {
  font-size: 1.25rem;
  opacity: 0.95;
  margin: 1.2rem auto 2rem;
  max-width: 640px;
}
.hero .btn { margin: 0.35rem; }

/* ---- Content width ---- */
.content-block { max-width: 1040px; margin: 0 auto; }

/* ---- Stats row ---- */
.stats-row {
  display: flex; flex-wrap: wrap; gap: 1.5rem;
  justify-content: center;
  margin: 2rem 0 1rem;
}
.stat {
  flex: 1 1 160px; text-align: center;
  background: #f3f8fb; border-radius: 12px; padding: 1.4rem 1rem;
}
.stat-num { display: block; font-size: 2.4rem; font-weight: 700; color: #0a6ea4; }
.stat-label { display: block; color: #4a606b; font-size: 0.95rem; margin-top: 0.25rem; }

/* ---- CTA band ---- */
.cta-band {
  background: #f3f8fb; border-radius: 14px;
  padding: 2rem; text-align: center; margin: 2.5rem 0;
}
.cta-band h3 { margin-top: 0; }

/* ---- Service / feature grid ---- */
.grid h3 { margin-top: 0; }

/* ---- Contact ---- */
.contact-card {
  background: #f3f8fb; border-radius: 12px; padding: 1.5rem 1.75rem;
  margin: 1.5rem 0; line-height: 2;
}
.contact-form { max-width: 560px; margin-top: 1.5rem; }
.contact-form input, .contact-form textarea {
  width: 100%; padding: 0.55rem 0.7rem;
  border: 1px solid #cdd9df; border-radius: 8px;
  font-size: 1rem;
}
.contact-form label { font-weight: 600; }
.contact-form .hp { display: none; }   /* honeypot — bots fill it, humans can't see it */