/* Eden Trees — static rebuild
   Brand green #80c342 and Poppins, matching the original Divi build. */

:root {
  --green: #80c342;
  --green-dark: #6aa835;
  --green-deep: #4d7d26;
  --green-tint: #f2f9ea;
  --ink: #2f2f2f;
  --body: #55605a;
  --muted: #8a938d;
  --line: #e4e9e2;
  --bg: #ffffff;
  --bg-alt: #f7f9f5;
  --maxw: 1140px;
  --radius: 8px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }

body {
  margin: 0;
  font-family: 'Poppins', Helvetica, Arial, sans-serif;
  font-size: 17px;
  line-height: 1.8;
  color: var(--body);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4 {
  font-family: 'Poppins', Helvetica, Arial, sans-serif;
  color: var(--ink);
  line-height: 1.25;
  margin: 0 0 0.6em;
  font-weight: 600;
}

h1 { font-size: clamp(2.1rem, 5vw, 3.4rem); }
h2 { font-size: clamp(1.6rem, 3.2vw, 2.3rem); }
h3 { font-size: 1.2rem; }

p { margin: 0 0 1.3em; }
a { color: var(--green-deep); }
a:hover { text-decoration: underline; }
img { max-width: 100%; height: auto; display: block; }

.wrap { max-width: var(--maxw); margin: 0 auto; padding: 0 24px; }
.narrow { max-width: 800px; margin-left: auto; margin-right: auto; }

.visually-hidden {
  position: absolute; width: 1px; height: 1px;
  margin: -1px; padding: 0; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* ---------- Header ---------- */

.site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  background: #fff;
  border-bottom: 1px solid var(--line);
}

.header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  max-width: var(--maxw);
  margin: 0 auto;
  padding: 12px 24px;
  min-height: 84px;
}

.logo img { height: 58px; width: auto; }

.header-right { display: flex; align-items: center; gap: 28px; }

.header-phone {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 600;
  color: var(--ink);
  text-decoration: none;
  white-space: nowrap;
}

.header-phone:hover { color: var(--green-deep); text-decoration: none; }

.nav-toggle {
  display: none;
  background: none;
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 8px 12px;
  font-size: 1.2rem;
  line-height: 1;
  cursor: pointer;
  color: var(--ink);
}

.nav ul { display: flex; gap: 26px; list-style: none; margin: 0; padding: 0; }

.nav a {
  font-size: 0.94rem;
  font-weight: 500;
  color: var(--ink);
  text-decoration: none;
  padding: 6px 0;
  border-bottom: 2px solid transparent;
  transition: color .2s, border-color .2s;
}

.nav a:hover, .nav a[aria-current="page"] {
  color: var(--green-deep);
  border-bottom-color: var(--green);
  text-decoration: none;
}

/* ---------- Buttons ---------- */

.btn {
  display: inline-block;
  font-size: .92rem;
  font-weight: 600;
  letter-spacing: .03em;
  padding: 15px 34px;
  border-radius: 100px;
  background: var(--green);
  color: #1d2a12;
  border: 2px solid var(--green);
  cursor: pointer;
  text-decoration: none;
  transition: background .2s, border-color .2s;
}

.btn:hover { background: var(--green-dark); border-color: var(--green-dark); text-decoration: none; color: #14200c; }

.btn-ghost { background: transparent; color: #fff; border-color: #fff; }
.btn-ghost:hover { background: #fff; color: var(--ink); border-color: #fff; }

/* ---------- Hero ---------- */

.hero {
  position: relative;
  min-height: 74vh;
  display: flex;
  align-items: center;
  background-size: cover;
  background-position: center;
  padding: 90px 24px;
  color: #fff;
}

.hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(95deg, rgba(20,34,14,.76) 0%, rgba(20,34,14,.52) 55%, rgba(20,34,14,.32) 100%);
}

/* Centre on the same container as the header so the copy lines up with the
   logo, rather than sitting flush against the window edge. */
.hero-inner {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: var(--maxw);
  margin: 0 auto;
}

.hero-inner > * { max-width: 680px; }
.hero h1 { color: #fff; margin-bottom: .35em; }

.hero .lede {
  font-size: clamp(1.02rem, 2vw, 1.22rem);
  margin-bottom: 2em;
  color: rgba(255,255,255,.94);
}

.hero-actions { display: flex; flex-wrap: wrap; gap: 14px; }

.hero-sm { min-height: 40vh; }

/* ---------- Sections ---------- */

.section { padding: 88px 0; }
.section-alt { background: var(--bg-alt); }
.section-green { background: var(--green-tint); }

.section-head { max-width: 780px; margin: 0 auto 52px; text-align: center; }
.section-head p { color: var(--muted); margin-bottom: 0; }

.rule { width: 56px; height: 4px; background: var(--green); border: 0; margin: 0 auto 24px; border-radius: 2px; }
.rule-left { margin-left: 0; }

/* ---------- Services ---------- */

.cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 30px;
}

.card {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: transform .2s, box-shadow .2s;
}

.card:hover { transform: translateY(-3px); box-shadow: 0 14px 30px rgba(0,0,0,.09); }

.card img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.card-body { padding: 28px 26px; flex: 1; display: flex; flex-direction: column; }
.card-body h3 { margin-bottom: .5em; }
.card-body p { margin-bottom: 1.2em; }
.card-body .btn { align-self: flex-start; margin-top: auto; }

/* ---------- Split ---------- */

.split { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center; }
.split.reverse .split-media { order: -1; }
.split-media img { width: 100%; border-radius: var(--radius); box-shadow: 0 16px 36px rgba(0,0,0,.12); }

/* ---------- Featured quote ---------- */

.feature-quote {
  max-width: 840px;
  margin: 0 auto;
  text-align: center;
}

.feature-quote blockquote {
  margin: 0 0 18px;
  font-size: clamp(1.05rem, 2.1vw, 1.3rem);
  line-height: 1.7;
  color: var(--ink);
}

.feature-quote cite { font-style: normal; font-weight: 600; color: var(--green-deep); }

/* ---------- Reviews ---------- */

.reviews {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));
  gap: 24px;
}

.review {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 26px 26px 22px;
}

.review p { font-size: .95rem; line-height: 1.7; margin-bottom: 14px; }
.review .stars { color: #f5a623; letter-spacing: 2px; font-size: .95rem; margin-bottom: 10px; }
.review cite { display: block; font-style: normal; font-weight: 600; color: var(--ink); font-size: .92rem; }
.review .source { font-size: .8rem; color: var(--muted); }

/* ---------- Values ---------- */

.values { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 34px; }

.value h3 { color: var(--green-deep); margin-bottom: .5em; }
.value p { font-size: .96rem; margin-bottom: 0; }

/* ---------- Quote form ---------- */

.quote-panel {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 40px 38px;
  box-shadow: 0 18px 44px rgba(0,0,0,.08);
}

.field { margin-bottom: 20px; }

.field label {
  display: block;
  font-size: .84rem;
  font-weight: 600;
  color: var(--ink);
  margin-bottom: 7px;
}

.field input, .field textarea {
  width: 100%;
  font-family: inherit;
  font-size: 1rem;
  color: var(--ink);
  padding: 13px 15px;
  border: 2px solid var(--line);
  border-radius: var(--radius);
  background: #fff;
  transition: border-color .2s;
}

.field input:focus, .field textarea:focus { outline: none; border-color: var(--green); }
.field textarea { min-height: 130px; resize: vertical; }

.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }

.consent {
  font-size: .84rem;
  line-height: 1.6;
  color: var(--muted);
  margin: 4px 0 22px;
}

.hp { position: absolute; left: -9999px; }

/* ---------- Contact strip ---------- */

.contact-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 36px; text-align: center; }
.contact-grid h3 { margin-bottom: .3em; font-size: 1.02rem; }
.contact-grid p { margin-bottom: 0; }

/* ---------- Badge ---------- */

.badge-strip { text-align: center; }
.badge-strip img { max-width: 420px; margin: 0 auto; }

/* ---------- Footer ---------- */

.site-footer { background: var(--ink); color: #c3ccc0; padding: 56px 0 28px; font-size: .94rem; }
.footer-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 36px; margin-bottom: 36px; }
.site-footer h3 { color: #fff; font-size: 1.02rem; }
.site-footer a { color: var(--green); }
.site-footer ul { list-style: none; margin: 0; padding: 0; }
.site-footer li { margin-bottom: 8px; }

.footer-bottom {
  border-top: 1px solid rgba(255,255,255,.12);
  padding-top: 22px;
  text-align: center;
  color: var(--muted);
  font-size: .86rem;
}

/* ---------- Responsive ---------- */

@media (max-width: 900px) {
  .section { padding: 62px 0; }
  .split { grid-template-columns: 1fr; gap: 34px; }
  .split.reverse .split-media { order: 0; }
  .field-row { grid-template-columns: 1fr; gap: 0; }
  .quote-panel { padding: 30px 24px; }

  .nav-toggle { display: block; }
  .header-right { gap: 14px; }
  .header-phone span { display: none; }

  .nav {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: #fff;
    border-bottom: 1px solid var(--line);
    box-shadow: 0 12px 24px rgba(0,0,0,.08);
  }

  .nav.open { display: block; }
  .nav ul { flex-direction: column; gap: 0; padding: 8px 24px 18px; }
  .nav li { border-bottom: 1px solid var(--line); }
  .nav li:last-child { border-bottom: 0; }
  .nav a { display: block; padding: 14px 0; border-bottom: 0; }
}

/* ---------- Print ----------
   Browsers drop background colours when printing, which would strip the brand
   green and the section blocks out of any PDF. Added for the review PDF sent to
   Nathan, and correct for anyone printing the page. */

@media print {
  *, *::before, *::after {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  /* Don't split a card or the form across a page break. */
  .card, .testimonial, form, .values li { break-inside: avoid; }
}