:root {
  --green:#1f7a3a;
  --green2:#8cc63f;
  --deep:#0d3f20;
  --dark:#102417;
  --ink:#18251c;
  --muted:#667066;
  --cream:#f7f2e8;
  --soft:#f8fbf4;
  --gold:#d6a441;
  --whiteGlass:rgba(255,255,255,.9);
}

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

body {
  margin:0;
  font-family:Inter, Arial, sans-serif;
  background:var(--cream);
  color:var(--ink);
  overflow-x:hidden;
}

img { max-width:100%; }

/* ONE SHARED TOP BAR */
.top-bar {
  position:fixed;
  top:20px;
  left:50%;
  transform:translateX(-50%);
  width:min(1240px, calc(100% - 40px));
  z-index:100;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;
  padding:10px 18px;
  background:var(--whiteGlass);
  backdrop-filter:blur(18px);
  border:1px solid rgba(255,255,255,.7);
  border-radius:999px;
  box-shadow:0 20px 60px rgba(0,0,0,.18);
}

.logo-wrap {
  flex:0 0 auto;
  display:flex;
  align-items:center;
}

.logo-wrap img {
  width:80px;
  height:80px;
  object-fit:contain;
  display:block;
  border-radius:14px;
}

.brand-center {
  flex:1;
  text-align:center;
  min-width:0;
  position:relative;
  top:14px;
  left:-5px;
}

.brand-title {
  font-family:Georgia, 'Times New Roman', serif;
  font-size:20px;
  font-weight:700;
  letter-spacing:.4px;
  color:var(--deep);
  white-space:nowrap;
  text-shadow:
    0 1px 0 rgba(255,255,255,.75),
    0 3px 12px rgba(255,255,255,.45),
    0 1px 8px rgba(0,0,0,.08);
}

.brand-line {
  margin-top:8px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
}

.brand-line span {
  width:140px;
  height:2px;
  background:linear-gradient(90deg, transparent, var(--gold), transparent);
}

.brand-line b {
  color:var(--gold);
  font-size:20px;
  line-height:1;
}

.nav {
  flex:0 0 auto;
  display:flex;
  align-items:center;
  gap:8px;
}

.nav a {
  color:#263628;
  text-decoration:none;
  padding:11px 15px;
  border-radius:999px;
  font-weight:800;
  transition:.25s ease;
  white-space:nowrap;
}

.nav a:hover,
.nav a.active {
  background:rgba(31,122,58,.12);
  color:var(--green);
  transform:translateY(-2px);
}

.nav .quote {
  background:linear-gradient(135deg, var(--green2), var(--green));
  color:white;
  box-shadow:0 10px 25px rgba(31,122,58,.32);
}

.nav .quote:hover,
.nav .quote.active {
  color:white;
  background:linear-gradient(135deg, var(--green2), var(--green));
}

/* SHARED BUTTONS */
.actions {
  display:flex;
  justify-content:center;
  gap:16px;
  flex-wrap:wrap;
}

.btn {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:15px 24px;
  border-radius:14px;
  font-weight:900;
  text-decoration:none;
  border:0;
  cursor:pointer;
  transition:.25s ease;
  font-family:inherit;
  font-size:16px;
}

.btn.primary {
  color:white;
  background:linear-gradient(135deg, var(--green2), var(--green));
  box-shadow:0 18px 38px rgba(31,122,58,.35);
}

.btn.secondary {
  color:white;
  border:1px solid rgba(255,255,255,.3);
  background:rgba(255,255,255,.1);
  backdrop-filter:blur(10px);
}

.btn.dark {
  color:white;
  background:linear-gradient(135deg,#193a23,#0b1a10);
}

.btn:hover { transform:translateY(-4px); }

/* HOMEPAGE HERO */
.hero {
  min-height:86vh;
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:165px 34px 90px;
  overflow:hidden;
  background:#102417;
}

.hero::before {
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(rgba(255,255,255,.05), rgba(16,36,23,.18)),
    url('new_bg.png') center/cover;
  filter:blur(2.5px);
  transform:scale(1.035);
  animation:slowZoom 18s ease-in-out infinite alternate;
}

.hero::after {
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 18% 20%, rgba(255,255,255,.45), transparent 28%),
    radial-gradient(circle at 80% 70%, rgba(140,198,63,.24), transparent 32%),
    linear-gradient(rgba(16,36,23,.1), rgba(16,36,23,.42));
}

.hero-bubble {
  position:relative;
  z-index:2;
  width:min(1100px, 100%);
  padding:46px 64px;
  text-align:center;
  color:white;
  border-radius:38px;
  background:rgba(16,36,23,.82);
  border:1px solid rgba(255,255,255,.2);
  backdrop-filter:blur(14px);
  box-shadow:0 30px 90px rgba(0,0,0,.34);
}

.kicker {
  display:inline-block;
  margin-bottom:22px;
  color:var(--gold);
  font-size:15px;
  font-weight:950;
  letter-spacing:1.6px;
  text-transform:uppercase;
}

.hero-bubble h1 {
  max-width:980px;
  margin:0 auto 26px;
  font-size:clamp(50px, 5.8vw, 86px);
  line-height:.96;
  letter-spacing:-3px;
  text-shadow:0 18px 45px rgba(0,0,0,.38);
}

.hero-bubble h1 .highlight {
  background:linear-gradient(135deg, #fff, #dfffb7 55%, #f6d687);
  -webkit-background-clip:text;
  color:transparent;
}

.hero-bubble h1 .plain {
  color:#fff;
}

.cms-text { white-space:pre-line; }

.hero-bubble p {
  max-width:740px;
  margin:0 auto 34px;
  font-size:19px;
  line-height:1.65;
  color:rgba(255,255,255,.88);
}

/* INTERIOR PAGE HERO */
.page-hero {
  min-height:60vh;
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:165px 34px 90px;
  overflow:hidden;
  color:white;
  background:#102417;
}

.page-hero::before {
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(rgba(16,36,23,.58), rgba(16,36,23,.84)),
    url('new_bg.png') center/cover;
  transform:scale(1.03);
  filter:blur(1.5px);
}

.page-hero::after {
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 18% 25%, rgba(214,164,65,.25), transparent 26%),
    radial-gradient(circle at 80% 75%, rgba(140,198,63,.24), transparent 28%);
}

.page-hero-card {
  position:relative;
  z-index:2;
  width:min(980px, 100%);
  text-align:center;
  padding:42px;
  border-radius:34px;
  background:rgba(16,36,23,.74);
  border:1px solid rgba(255,255,255,.18);
  backdrop-filter:blur(14px);
  box-shadow:0 30px 90px rgba(0,0,0,.34);
}

.page-hero-card h1 {
  margin:0 0 18px;
  font-size:clamp(44px, 7vw, 80px);
  line-height:.95;
  letter-spacing:-3px;
}

.page-hero-card p {
  max-width:760px;
  margin:0 auto;
  font-size:19px;
  line-height:1.7;
  color:rgba(255,255,255,.84);
}

/* SECTIONS */
.section {
  position:relative;
  padding:100px 40px;
  background:
    radial-gradient(circle at 10% 10%, rgba(140,198,63,.18), transparent 26%),
    linear-gradient(180deg, #fff, var(--cream));
}

.section.alt {
  background:linear-gradient(180deg,var(--cream),#fff);
}

.section.dark-band {
  color:white;
  background:
    radial-gradient(circle at 15% 20%, rgba(140,198,63,.22), transparent 28%),
    linear-gradient(135deg,#102417,#1c3d25 58%,#0b1a10);
}

.section-head {
  max-width:840px;
  margin:0 auto 52px;
  text-align:center;
}

.section-eyebrow {
  margin-bottom:14px;
  color:var(--green);
  font-weight:950;
  letter-spacing:1.6px;
  text-transform:uppercase;
}

.section h2,
.section-head h2 {
  font-size:clamp(36px,4.5vw,62px);
  margin:0 0 16px;
  color:#102417;
  letter-spacing:-2px;
  line-height:1;
}

.dark-band h2,
.dark-band .section-head h2 { color:white; }

.section-head p,
.section > p {
  max-width:780px;
  margin:0 auto;
  color:var(--muted);
  font-size:18px;
  line-height:1.7;
}

.dark-band p { color:rgba(255,255,255,.78); }

.grid {
  max-width:1160px;
  margin:auto;
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  gap:22px;
}

.box,
.card {
  position:relative;
  min-height:200px;
  padding:28px;
  border-radius:28px;
  overflow:hidden;
  text-align:left;
  background:#fff;
  box-shadow:0 18px 50px rgba(16,36,23,.12);
  border:1px solid rgba(31,122,58,.1);
  transition:.3s ease;
  display:grid;
  grid-template-columns:auto 1fr;
  grid-template-rows:auto auto;
  column-gap:16px;
  align-content:start;
}

.box::before,
.card::before {
  content:"";
  position:absolute;
  inset:0;
  opacity:.12;
  background:linear-gradient(135deg, var(--green2), var(--green));
}

.box::after,
.card::after {
  content:"";
  position:absolute;
  width:120px;
  height:120px;
  right:-35px;
  bottom:-35px;
  border-radius:50%;
  background:linear-gradient(135deg, var(--green2), var(--gold));
  opacity:.28;
  transition:.3s ease;
}

.box:hover,
.card:hover {
  transform:translateY(-10px);
  box-shadow:0 28px 70px rgba(16,36,23,.2);
}

.box:hover::after,
.card:hover::after { transform:scale(1.35); opacity:.42; }

.icon {
  position:relative;
  grid-column:1;
  grid-row:1;
  width:54px;
  height:54px;
  border-radius:18px;
  display:grid;
  place-items:center;
  font-size:26px;
  background:linear-gradient(135deg, var(--green2), var(--green));
  box-shadow:0 12px 26px rgba(31,122,58,.28);
  margin-bottom:0;
  align-self:center;
}

.box h3,
.card h3 {
  position:relative;
  grid-column:2;
  grid-row:1;
  font-size:22px;
  margin:0;
  color:#102417;
  align-self:center;
}

.box p,
.card p {
  position:relative;
  grid-column:1 / -1;
  grid-row:2;
  color:#627061;
  line-height:1.6;
  margin:10px 0 0;
}

.story-wrap {
  max-width:1160px;
  margin:auto;
  display:grid;
  grid-template-columns:.95fr 1.05fr;
  gap:34px;
  align-items:center;
}

.image-card {
  min-height:500px;
  border-radius:36px;
  background:
    linear-gradient(rgba(7,20,12,.08), rgba(7,20,12,.35)),
    url('new_bg.png') center/cover;
  box-shadow:0 30px 90px rgba(7,20,12,.18);
  position:relative;
  overflow:hidden;
}

.image-card::after {
  content:"Commercial + Residential";
  position:absolute;
  left:28px;
  bottom:28px;
  padding:18px 22px;
  border-radius:22px;
  color:white;
  font-weight:950;
  background:rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.22);
  backdrop-filter:blur(16px);
}

.text-card {
  padding:42px;
  border-radius:36px;
  background:white;
  box-shadow:0 24px 80px rgba(7,20,12,.12);
}

.text-card h2 {
  font-size:clamp(36px,5vw,58px);
  line-height:1;
  letter-spacing:-2px;
  margin:0 0 18px;
}

.text-card p {
  color:#667066;
  line-height:1.8;
  font-size:18px;
}

.values {
  margin-top:34px;
  display:grid;
  gap:14px;
}

.value {
  padding:18px 20px;
  border-radius:20px;
  background:linear-gradient(135deg,rgba(166,226,46,.18),rgba(31,143,77,.08));
  border:1px solid rgba(31,143,77,.12);
  font-weight:800;
  transition:.25s ease;
}

.value:hover {
  transform:translateX(8px);
  box-shadow:0 16px 40px rgba(31,143,77,.13);
}

.split {
  max-width:1160px;
  margin:auto;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:30px;
  align-items:start;
}

.info-card,
.form-card,
.review-card,
.quote-card {
  background:white;
  border:1px solid rgba(31,122,58,.1);
  border-radius:34px;
  padding:34px;
  box-shadow:0 24px 80px rgba(7,20,12,.12);
}

.info-card h3,
.form-card h2,
.quote-card h2 {
  margin:0 0 14px;
  color:#102417;
  font-size:clamp(28px,3vw,42px);
  letter-spacing:-1px;
}

.info-list {
  display:grid;
  gap:16px;
  margin-top:24px;
}

.info-row {
  display:flex;
  gap:14px;
  align-items:flex-start;
  padding:16px;
  border-radius:20px;
  background:linear-gradient(135deg,rgba(140,198,63,.16),rgba(31,122,58,.06));
}

.info-row b { color:#102417; display:block; margin-bottom:4px; }
.info-row span { color:#667066; line-height:1.5; }

.form-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
}

.form-group { display:grid; gap:8px; margin-bottom:16px; }
.form-group.full { grid-column:1 / -1; }

label {
  font-weight:900;
  color:#102417;
  font-size:14px;
}

input,
select,
textarea {
  width:100%;
  border:1px solid rgba(16,36,23,.14);
  background:#fbfff8;
  color:#102417;
  border-radius:16px;
  padding:14px 15px;
  font:inherit;
  outline:none;
  transition:.2s ease;
}

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

input:focus,
select:focus,
textarea:focus {
  border-color:rgba(31,122,58,.5);
  box-shadow:0 0 0 4px rgba(140,198,63,.15);
  background:white;
}

.notice {
  display:none;
  margin-top:16px;
  padding:14px 16px;
  border-radius:16px;
  font-weight:800;
}

.notice.success {
  display:block;
  color:#0d3f20;
  background:rgba(140,198,63,.18);
  border:1px solid rgba(31,122,58,.2);
}

.notice.error {
  display:block;
  color:#6b1111;
  background:rgba(255,0,0,.08);
  border:1px solid rgba(255,0,0,.18);
}

.review-grid,
.card-grid {
  max-width:1160px;
  margin:auto;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:22px;
}

.review-card {
  position:relative;
  overflow:hidden;
}

.review-stars {
  color:var(--gold);
  font-size:20px;
  letter-spacing:2px;
  margin-bottom:18px;
}

.review-card p {
  color:#667066;
  line-height:1.7;
}

.review-card b {
  display:block;
  margin-top:22px;
  color:#102417;
}

.cta {
  padding:90px 40px;
  background:
    linear-gradient(rgba(16,36,23,.76), rgba(16,36,23,.84)),
    url('new_bg.png') center/cover;
  color:white;
  text-align:center;
}

.cta h2 {
  font-size:clamp(34px,4vw,56px);
  margin:0 0 16px;
}

.cta p {
  max-width:720px;
  margin:0 auto 28px;
  color:rgba(255,255,255,.82);
  line-height:1.7;
}

/* FOOTER */
.footer {
  background:linear-gradient(135deg,#0b0f0c,#111612 55%,#06150b);
  color:white;
}

.footer-main {
  max-width:1160px;
  margin:auto;
  display:grid;
  grid-template-columns:1.2fr repeat(3,1fr);
  gap:34px;
  padding:70px 40px;
}

.footer-logo {
  width:86px;
  height:86px;
  border-radius:16px;
  margin-bottom:18px;
  background:white;
}

.footer p,
.footer a,
.footer li {
  color:rgba(255,255,255,.78);
  line-height:1.7;
  text-decoration:none;
}

.footer h3 {
  margin:0 0 18px;
  color:var(--green2);
  font-size:15px;
  text-transform:uppercase;
  letter-spacing:1px;
}

.footer ul { list-style:none; padding:0; margin:0; display:grid; gap:8px; }
.footer-hours { margin-top:10px; }
.footer a:hover { color:white; }

.socials { display:flex; gap:10px; margin-top:20px; }
.socials a {
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:linear-gradient(135deg,var(--green2),var(--green));
  color:white;
  font-weight:900;
}

.footer-bottom {
  text-align:center;
  padding:18px 20px;
  background:linear-gradient(135deg,var(--green),#0d3f20);
  color:white;
  font-size:14px;
}

@keyframes slowZoom {
  from { transform:scale(1.035); }
  to { transform:scale(1.09); }
}
