/* Evergreen Yard Co. v2 — living landscape scene */
:root{
  --forest:#1e4d2b;--leaf:#4c9a52;--lime:#a3d977;--soil:#7c5c3e;
  --mist:#f2f6ee;--ink:#26302a;--sun:#f5c542;--sky1:#bfe3f2;--sky2:#e8f5d9;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{font-family:"Trebuchet MS","Segoe UI",sans-serif;color:var(--ink);background:#fff;line-height:1.65;overflow-x:hidden;}
a{text-decoration:none;color:inherit;}
.container{max-width:1080px;margin:0 auto;padding:0 20px;}
.reveal{opacity:0;transform:translateY(30px);transition:opacity .75s,transform .75s;}
.reveal.in{opacity:1;transform:none;}
.reveal.d1{transition-delay:.12s}.reveal.d2{transition-delay:.24s}.reveal.d3{transition-delay:.36s}

header{position:sticky;top:0;z-index:60;background:#fff;box-shadow:0 2px 12px rgba(30,77,43,.14);}
.nav{display:flex;justify-content:space-between;align-items:center;padding:14px 0;gap:10px;}
.logo{font-weight:800;font-size:1.25rem;color:var(--forest);}
.logo::before{content:"🌲 ";}
nav ul{display:none;}
.btn{display:inline-block;background:var(--leaf);color:#fff;padding:13px 28px;border-radius:10px;font-weight:800;border:none;cursor:pointer;font-size:.97rem;transition:transform .2s,box-shadow .2s;}
.btn:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(76,154,82,.35);}
.btn-forest{background:var(--forest);}
.btn-sun{background:var(--sun);color:var(--forest);}

/* ===== Hero: animated SVG landscape ===== */
.hero{position:relative;color:#fff;overflow:hidden;background:linear-gradient(180deg,var(--sky1),var(--sky2) 78%);}
.scene{position:absolute;inset:0;pointer-events:none;}
.scene svg{position:absolute;bottom:0;left:0;width:100%;height:100%;}
.sun-disc{position:absolute;top:34px;right:9%;width:92px;height:92px;border-radius:50%;background:radial-gradient(circle at 38% 38%,#ffe89a,var(--sun) 65%);box-shadow:0 0 60px 22px rgba(245,197,66,.5);animation:sunpulse 6s ease-in-out infinite;}
@keyframes sunpulse{0%,100%{box-shadow:0 0 60px 22px rgba(245,197,66,.5)}50%{box-shadow:0 0 90px 36px rgba(245,197,66,.65)}}
.cloud{position:absolute;background:#fff;border-radius:999px;opacity:.9;animation:cloudmove linear infinite;}
.cloud::before,.cloud::after{content:"";position:absolute;background:#fff;border-radius:50%;}
.c1{top:56px;width:110px;height:34px;animation-duration:52s;}
.c1::before{width:46px;height:46px;top:-22px;left:18px;}
.c1::after{width:34px;height:34px;top:-14px;left:56px;}
.c2{top:130px;width:80px;height:26px;opacity:.7;animation-duration:70s;animation-delay:-30s;}
.c2::before{width:34px;height:34px;top:-16px;left:14px;}
.c2::after{width:26px;height:26px;top:-10px;left:42px;}
@keyframes cloudmove{from{left:-160px}to{left:105%}}
/* swaying grass blades */
.blade{position:absolute;bottom:-4px;width:10px;height:70px;background:linear-gradient(180deg,var(--lime),var(--forest));border-radius:100% 100% 0 0/100% 100% 0 0;transform-origin:bottom center;animation:sway 3.6s ease-in-out infinite;}
@keyframes sway{0%,100%{transform:rotate(-7deg)}50%{transform:rotate(7deg)}}
.hero-inner{position:relative;padding:76px 0 150px;display:grid;gap:34px;color:var(--forest);}
.hero h1{font-size:2.3rem;line-height:1.14;margin-bottom:14px;animation:fadeUp .9s .1s both;}
.hero h1 span{color:var(--leaf);}
.hero .lede{font-size:1.08rem;margin-bottom:22px;max-width:520px;color:#3c4f41;animation:fadeUp .9s .3s both;}
.trust-bullets{list-style:none;font-size:.95rem;color:#3c4f41;animation:fadeUp .9s .5s both;}
.trust-bullets li{margin-bottom:8px;}
.trust-bullets li::before{content:"✅ ";}
@keyframes fadeUp{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
.quote-form{background:#fff;color:var(--ink);border-radius:18px;padding:28px;box-shadow:0 24px 54px rgba(30,77,43,.28);animation:fadeUp .9s .4s both;position:relative;z-index:2;}
.quote-form h3{color:var(--forest);margin-bottom:4px;}
.quote-form .hint{font-size:.83rem;color:#79857c;margin-bottom:14px;}
.quote-form input,.quote-form select{width:100%;padding:12px;margin-bottom:11px;border:1px solid #cfdcc9;border-radius:8px;font:inherit;font-size:.95rem;transition:border-color .2s,box-shadow .2s;}
.quote-form input:focus,.quote-form select:focus{outline:none;border-color:var(--leaf);box-shadow:0 0 0 3px rgba(76,154,82,.18);}
.quote-form .btn{width:100%;}

section{padding:64px 0;}
h2{font-size:1.95rem;text-align:center;color:var(--forest);margin-bottom:8px;}
.sub{text-align:center;color:#5f6b62;margin-bottom:40px;}

/* Services — grow-on-hover leaf cards */
.svc-grid{display:grid;gap:18px;}
.svc{background:var(--mist);border-radius:18px;padding:28px;border-left:5px solid var(--leaf);transition:transform .3s,box-shadow .3s;}
.svc:hover{transform:translateY(-6px) scale(1.01);box-shadow:0 16px 36px rgba(30,77,43,.14);}
.svc h3{color:var(--forest);margin-bottom:6px;}
.svc h3 .ic{display:inline-block;margin-right:8px;transition:transform .4s;}
.svc:hover .ic{transform:scale(1.35) rotate(-8deg);}
.svc p{font-size:.93rem;color:#5f6b62;}

/* Before/After slider */
.projects{background:var(--mist);}
.ba-slider{max-width:760px;margin:0 auto;position:relative;border-radius:18px;overflow:hidden;box-shadow:0 16px 40px rgba(30,77,43,.2);user-select:none;}
.ba-pane{height:300px;display:flex;align-items:center;justify-content:center;flex-direction:column;color:#fff;font-weight:800;letter-spacing:2px;font-size:1.3rem;}
.ba-pane small{font-weight:400;letter-spacing:0;font-size:.9rem;margin-top:8px;opacity:.9;}
.pane-before{background:
  radial-gradient(ellipse 30% 18% at 20% 78%,#6e5d40 0%,transparent 100%),
  radial-gradient(ellipse 26% 14% at 70% 84%,#857450 0%,transparent 100%),
  linear-gradient(180deg,#b8c4bd 0%,#9b8a6b 55%,#83704f 100%);color:#4a3f2c;}
.pane-after{position:absolute;inset:0;width:50%;overflow:hidden;background:
  radial-gradient(ellipse 34% 20% at 30% 80%,#2f6b33 0%,transparent 100%),
  radial-gradient(ellipse 30% 16% at 75% 86%,#57a85e 0%,transparent 100%),
  linear-gradient(180deg,#bfe3f2 0%,#57a85e 55%,var(--forest) 100%);}
.pane-after .ba-pane{position:absolute;inset:0;width:100vw;max-width:760px;}
.ba-handle{position:absolute;top:0;bottom:0;left:50%;width:4px;background:#fff;cursor:ew-resize;box-shadow:0 0 12px rgba(0,0,0,.4);}
.ba-handle::after{content:"⇄";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:42px;height:42px;background:#fff;color:var(--forest);border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:1.1rem;}
.ba-range{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;}
.ba-caption{text-align:center;margin-top:16px;font-size:.9rem;color:#5f6b62;}

/* Reviews */
.rev-strip{max-width:720px;margin:0 auto;text-align:center;}
.rev-strip blockquote{font-size:1.3rem;line-height:1.55;color:var(--forest);margin-bottom:14px;}
.stars{color:var(--sun);letter-spacing:3px;font-size:1.1rem;}
.who{font-size:.92rem;color:#5f6b62;margin-top:6px;}
.mini-revs{display:grid;gap:14px;margin-top:34px;}
.mini{background:var(--mist);border-radius:12px;padding:18px;font-size:.9rem;text-align:left;transition:transform .25s;}
.mini:hover{transform:translateY(-4px);}
.mini .who{margin-top:8px;font-weight:700;color:var(--forest);}

/* Packages */
.pkg-grid{display:grid;gap:18px;}
.pkg{border:2px solid #dfe8da;border-radius:18px;padding:30px;text-align:center;position:relative;background:#fff;transition:transform .3s,box-shadow .3s;}
.pkg:hover{transform:translateY(-8px);box-shadow:0 18px 40px rgba(30,77,43,.14);}
.pkg.hl{border-color:var(--leaf);}
.pkg .tag{position:absolute;top:-13px;left:50%;transform:translateX(-50%);background:var(--sun);color:var(--forest);font-size:.72rem;font-weight:800;padding:4px 14px;border-radius:999px;white-space:nowrap;}
.pkg .price{font-size:2.1rem;font-weight:800;color:var(--forest);margin:8px 0 2px;}
.pkg .per{font-size:.88rem;color:#79857c;}
.pkg ul{list-style:none;font-size:.9rem;color:#5f6b62;margin:16px 0 20px;}
.pkg li{padding:5px 0;border-bottom:1px dashed #e7eee2;}

/* Areas */
.areas{text-align:center;background:var(--forest);color:#fff;position:relative;overflow:hidden;}
.areas::before{content:"🌲 🌳 🌲 🌳 🌲 🌳 🌲 🌳 🌲 🌳 🌲 🌳 🌲 🌳 🌲 🌳 🌲 🌳 🌲 🌳";position:absolute;bottom:6px;left:0;white-space:nowrap;font-size:1.4rem;opacity:.28;animation:treescroll 30s linear infinite;}
@keyframes treescroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.areas h2{color:#fff;}
.chips{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;max-width:680px;margin:0 auto;position:relative;}
.chip{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.28);border-radius:999px;padding:8px 18px;font-size:.9rem;transition:background .2s;}
.chip:hover{background:rgba(255,255,255,.3);}

.final{text-align:center;background:linear-gradient(140deg,var(--leaf),var(--forest));color:#fff;}
.final h2{color:#fff;}
.final p{max-width:460px;margin:0 auto 24px;opacity:.94;}
.final .btn{background:#fff;color:var(--forest);}

footer{background:#14231a;color:#bccbbf;padding:44px 0 22px;text-align:center;font-size:.93rem;}
footer .logo{color:#fff;margin-bottom:8px;display:inline-block;}
footer a{color:var(--lime);}
footer .byline{margin-top:16px;font-size:.8rem;opacity:.6;}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
@media(min-width:760px){
  nav ul{display:flex;gap:24px;list-style:none;font-size:.93rem;font-weight:600;}
  nav a:hover{color:var(--leaf);}
  .hero-inner{grid-template-columns:1.15fr .85fr;align-items:center;padding:90px 0 170px;}
  .hero h1{font-size:2.9rem;}
  .svc-grid{grid-template-columns:1fr 1fr;}
  .mini-revs{grid-template-columns:repeat(3,1fr);}
  .pkg-grid{grid-template-columns:repeat(3,1fr);}
}

/* Marius owner-preview + ROI additions */
.owner-preview{position:sticky;top:0;z-index:90;display:flex;gap:8px;align-items:center;justify-content:center;flex-wrap:wrap;background:#111;color:#fff;padding:9px 14px;font:700 12px/1.35 "Segoe UI",Arial,sans-serif;text-align:center}.owner-preview span,.owner-preview a{border:1px solid rgba(255,255,255,.25);border-radius:999px;padding:3px 8px;color:#fff}.owner-preview a{text-decoration:none}.roi-snapshot{padding:56px 0;background:#fff;color:#202020}.roi-card{max-width:980px;margin:0 auto;border:2px solid rgba(0,0,0,.08);border-radius:18px;padding:28px;background:linear-gradient(135deg,#fff,#f7f4ee);box-shadow:0 18px 48px rgba(0,0,0,.12)}.roi-card h2{text-align:left;margin-bottom:12px}.roi-card .kicker,.roi-card .card-kicker{font:900 12px/1.2 "Segoe UI",Arial,sans-serif;text-transform:uppercase;letter-spacing:2px;color:#9a5b22;margin-bottom:8px}.roi-grid{display:grid;gap:16px}.roi-card ul{margin:10px 0 0 20px}.roi-card li{margin:4px 0}.roi-card .fine{font-size:.88rem;opacity:.78;margin-top:10px}.roi-card .owner-call{display:inline-block;margin-top:14px;background:#111;color:#fff;border-radius:8px;padding:12px 16px;font-weight:900;text-decoration:none}.template-note{font-size:.84rem;opacity:.78;margin-top:12px}.sample-badge{display:inline-block;margin-bottom:12px;border:1px solid currentColor;border-radius:999px;padding:6px 12px;font:800 12px/1 "Segoe UI",Arial,sans-serif;letter-spacing:1px;text-transform:uppercase}.footer-sample{margin-top:16px;font-size:.8rem;opacity:.75}@media(min-width:760px){.roi-grid{grid-template-columns:1.05fr .95fr}.owner-preview{top:0}}@media(max-width:759px){.owner-preview{position:static}.roi-card{border-radius:0}.roi-card h2{text-align:left}}