:root {
  --accent: #182e1c;   /* Dark green */
  --bg: #F6EFE7;       /* Cream background */
  --text: #2b412f;     /* Deep green text */
  --muted: #718264;    /* Muted grayish green */
  --white: #fff;
}
body {
  background: var(--bg);
  color: var(--text);
}

.hero {
  background: var(--bg);       /* warm cream hero */
}

h1, h2, .brand {
  color: var(--accent);           /* headings in evergreen */
}

.lead, .muted { color: var(--text-muted); }

.btn {
  background: var(--accent);
  color: #fff;
  border: 1px solid var(--accent);
}
.btn:hover { background: #182e25; }  /* ~10–15% darker than --accent */

* { box-sizing: border-box; }
body { margin:0; font-family: Inter, system-ui, Arial, sans-serif; color:var(--text); background:var(--bg); line-height:1.6; }
.container { width: min(1100px, 92%); margin: 0 auto; }
.site-header { border-bottom:1px solid #e6eaf0; background:#F6EFE7; }
.site-header .container { display:flex; align-items:center; justify-content:space-between; padding:16px 0; }
.brand { font-weight:700; color:var(--accent); }
.nav a { margin-left:18px; text-decoration:none; color:var(--muted); }
.hero-inner { display:grid; gap:24px; grid-template-columns:1fr; align-items:center; }
.hero-copy h1 { font-size: clamp(28px, 4vw, 44px); margin:8px 0; }
.eyebrow { display:inline-block; padding:6px 10px; background:#182e1c; color:#fff; border-radius:999px; font-weight:600; font-size:12px; }
.lead { color:var(--muted); font-size:18px; max-width:640px; }
.btn { display:inline-block; padding:12px 18px; border-radius:10px; background:var(--accent); color:#fff; font-weight:600; text-decoration:none; margin-top:12px; }
.section { padding:56px 0; text-align:center; }
.narrow { max-width:760px; margin:0 auto; }
.hero-media img {
  width: 100%;         /* full width of container */
  max-width: 700px;    /* optional: limit max width */
  height: auto;        /* maintain aspect ratio */
  display: block;
  margin: 0 auto;      /* center if smaller than container */
}
.site-footer { border-top:1px solid #e6eaf0; padding:28px 0; text-align:center; color:var(--muted); }
form input[type="email"] { padding:12px; width:320px; max-width:100%; border-radius:10px; border:1px solid #e6eaf0; margin-right:8px; }
@media (min-width:900px) {
  .hero-inner { grid-template-columns:1.1fr 0.9fr; }
}

.site-header .container {
  display: flex;
  justify-content: space-between; /* logo left, nav right */
  align-items: center;            /* vertically center */
  padding: 16px 0;
}

.site-header .brand img {
  height: 100px; /* adjust as needed */
}

.nav .btn {
  color: var(--white);  /* set text to white */
  background: var(--accent); /* keep dark green background */
  border: 1px solid var(--accent);
}

.nav .btn:hover {
  background: #182e25;  /* slightly darker on hover */
  color: var(--white);  /* make sure text stays white on hover */
}
.map-embed { width: 100%; max-width: 900px; margin: 16px auto; }
.map-embed iframe { width: 100%; aspect-ratio: 16 / 9; border: 0; }
@supports not (aspect-ratio: 16 / 9) {
  .map-embed { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; }
  .map-embed iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0; }
}
.disclaimer { margin-top: 16px; color: #374151; font-size: 0.95rem; background: #fff; border-left: 4px solid #718264; padding: 12px; border-radius: 6px; text-align: left; }


.about-inner {
  display: grid;
  gap: 40px;
  grid-template-columns: 1fr;
  align-items: center;
}

.about-media img {
  max-width: 100%;
  border-radius: 12px;
  box-shadow: 0 8px 20px rgba(0,0,0,0.08);
}

.about-text .aside {
  font-size: 0.9rem;
  color: var(--muted);
  margin-top: 12px;
}

@media (min-width: 900px) {
  .about-inner {
    grid-template-columns: 1fr 1fr;
  }
}

.btn-group {
  display: flex;
  gap: 12px;
  justify-content: left; /* centers buttons */
}

.btn-secondary {
  background: #ffffff;     /* light button */
  color: var(--accent);    /* green text */
  border: 1px solid var(--accent);
}

.btn-secondary:hover {
  background: #f0f0f0;
}


/* styles.css */
.hidden {
  display: none;
}