:root {
  --navy:#202124;
  --navy2:#2c2d30;
  --teal:#c7964b;
  --white:#fff;
  --muted:#d0c9be;
  --light:#f8f7f5}
* {
  box-sizing:border-box}
html {
  scroll-behavior:smooth}
body {
  margin:0;
  font:16px/1.65 system-ui,-apple-system,'Segoe UI',sans-serif;
  color:#252525;
  background:var(--light)}
a {
  color:inherit}
header {
  background:var(--navy);
  color:white}
.nav {
  max-width:1120px;
  margin:auto;
  padding:22px 24px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px}
.logo {
  font-weight:850;
  font-size:25px;
  text-decoration:none;
  letter-spacing:-.8px}
.logo span {
  color:var(--teal)}
nav {
  display:flex;
  gap:25px}
nav a {
  text-decoration:none;
  font-weight:650}
nav a:hover {
  color:var(--teal)}
.hero {
  background:linear-gradient(130deg,var(--navy),#36302a);
  color:white;
  padding:100px 24px 115px}
.wrap {
  max-width:1120px;
  margin:auto}
.eyebrow {
  color:var(--teal);
  font-size:13px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:2px}
h1 {
  font-size:clamp(38px,6vw,72px);
  line-height:1.1;
  letter-spacing:-2px;
  max-width:820px;
  margin:15px 0 24px}
h2 {
  font-size:clamp(28px,4vw,42px);
  line-height:1.2;
  letter-spacing:-1px}
p {
  max-width:750px}
.lead {
  font-size:20px;
  color:#e7e0d5}
.button {
  display:inline-block;
  background:var(--teal);
  color:#171717;
  padding:14px 24px;
  border-radius:9px;
  font-weight:800;
  text-decoration:none;
  border:0;
  cursor:pointer;
  font:inherit;
  font-weight:800}
.button:hover {
  background:#e2b974}
.section {
  padding:75px 24px}
.grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
  margin-top:30px}
.service {
  background:white;
  border:1px solid #e7e2da;
  border-radius:15px;
  padding:28px;
  box-shadow:0 8px 30px #25252508}
.service .symbol {
  font-size:30px}
.service h3 {
  margin:12px 0 8px}
.service p {
  color:#65605a;
  margin:0}
.band {
  background:var(--navy2);
  color:white;
  padding:60px 24px}
.band p {
  color:var(--muted)}
footer {
  background:#191919;
  color:#d6d2cb;
  padding:26px 24px;
  font-size:14px}
.foot {
  max-width:1120px;
  margin:auto;
  display:flex;
  justify-content:space-between;
  gap:15px;
  flex-wrap:wrap}
footer a {
  color:white}
.contact-card {
  max-width:760px;
  background:white;
  padding:34px;
  border-radius:16px;
  box-shadow:0 12px 35px #20212410}
label {
  display:block;
  font-weight:700;
  margin:16px 0 6px}
input,select,textarea {
  width:100%;
  padding:13px 14px;
  border:1px solid #c9c4bd;
  border-radius:8px;
  font:inherit;
  background:white}
textarea {
  min-height:150px;
  resize:vertical}
.note {
  font-size:13px;
  color:#68635c}
.status {
  margin-top:14px;
  font-weight:700}
.honeypot {
  position:absolute;
  left:-9999px}
@media(max-width:760px) {
  .nav {
  padding:18px 20px}
.logo {
  font-size:22px}
nav {
  gap:14px}
.hero {
  padding:70px 20px 80px}
.section {
  padding:55px 20px}
.grid {
  grid-template-columns:1fr}
.contact-card {
  padding:22px}
h1 {
  letter-spacing:-1px}
.lead {
  font-size:18px}
}