:root {
  --navy:#0b3a61;
  --teal:#159d90;
  --mint:#eaf6f5;
  --ink:#152331;
  --orange:#e98b2d;
  --white:#fff
}

* {
  box-sizing:border-box
}

body {
  margin:0;
  font:16px/1.6 Arial,sans-serif;
  color:var(--ink);
  background:#fff
}

a {
  color:inherit
}

.wrap {
  width:min(1120px,calc(100% - 40px));
  margin:auto
}

.top {
  border-top:5px solid var(--teal);
  padding:18px 0;
  background:#fff
}

.nav {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:25px
}

.logo {
  width:255px;
  height:auto
}

.navlinks {
  display:flex;
  gap:22px;
  font-weight:bold;
  color:var(--navy)
}

.navlinks a {
  text-decoration:none
}

.hero {
  background:linear-gradient(110deg,#f6fbfb 20%,#d7f0ed);
  padding:72px 0
}

.hero-grid,.incident-grid {
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:50px;
  align-items:center
}

h1 {
  font-size:clamp(2.25rem,5vw,4.2rem);
  line-height:1.1;
  color:var(--navy);
  margin:0 0 22px
}

h2 {
  font-size:2rem;
  line-height:1.2;
  color:var(--navy);
  margin:0 0 18px
}

h3 {
  margin:8px 0;
  color:var(--navy)
}

.lead {
  font-size:1.18rem;
  max-width:600px
}

.button {
  display:inline-block;
  background:var(--teal);
  color:#fff;
  text-decoration:none;
  font-weight:bold;
  padding:13px 21px;
  border-radius:5px;
  margin:12px 8px 0 0
}

.button.alt {
  background:var(--navy)
}

.hero img {
  width:100%
}

.section {
  padding:72px 0
}

.muted {
  background:var(--mint)
}

.cards {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:22px
}

.card {
  background:#fff;
  padding:25px;
  border-radius:8px;
  box-shadow:0 5px 20px #0b3a6117
}

.number {
  color:var(--teal);
  font-size:2rem;
  font-weight:bold
}

.reviews {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:22px
}

.quote {
  padding:25px;
  background:#fff;
  border-left:5px solid var(--orange);
  box-shadow:0 3px 14px #0b3a6112
}

.stars {
  color:var(--orange);
  letter-spacing:2px
}

.contact {
  background:var(--navy);
  color:#fff;
  padding:52px 0
}

.contact h2 {
  color:#fff
}

.placeholder {
  font-weight:bold;
  color:#b8eee8
}

.footer {
  background:#072a47;
  color:#d7e5ec;
  padding:22px 0;
  font-size:.9rem
}

.notice {
  border-left:5px solid var(--orange);
  background:#fff4e6;
  padding:16px 20px;
  margin:24px 0
}

.form-card {
  background:#fff;
  border-radius:10px;
  padding:30px;
  box-shadow:0 8px 28px #0b3a6120
}

label {
  font-weight:bold;
  display:block;
  margin-top:16px
}

input,textarea,select {
  font:inherit;
  width:100%;
  border:1px solid #9cb6c4;
  border-radius:4px;
  padding:11px;
  margin-top:5px
}

textarea {
  min-height:120px;
  resize:vertical
}

button {
  border:0;
  font:inherit;
  cursor:pointer
}

.small {
  font-size:.9rem;
  color:#526576
}

.check {
  display:flex;
  gap:10px;
  align-items:flex-start
}

.check input {
  width:auto;
  margin-top:7px
}

.page-title {
  background:var(--mint);
  padding:54px 0
}

.alert {
  background:#fff4e6;
  border:1px solid #f0c48b;
  border-radius:6px;
  padding:15px;
  margin:18px 0
}

@media(max-width:760px) {
  .nav,.hero-grid,.incident-grid {
  display:block
}

.navlinks {
  margin-top:10px;
  font-size:.9rem;
  gap:13px
}

.hero {
  padding:48px 0
}

.hero img {
  margin-top:28px
}

.cards,.reviews {
  grid-template-columns:1fr
}

.section {
  padding:48px 0
}

}

