/* ============================================================
   Cut'N' The Green Gardening Services — Ballarat, Victoria
   POV: goldfields-suburban, cool-climate, honest working green.
   Fonts: Switzer (grotesk body) + Playfair Display italic accent (LOCKED).
   Palette derived from their own logo badge: shield green, outer-ring lime,
   and the apricot gradient behind the mascot, on warm sandstone paper.
   Signature: "the cut line" — angled mown stripes, scrubbed on scroll.
   ============================================================ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --lime:#1E6B27; --lime-2:#14501C; --lime-ink:#FFFFFF; --accent-light:#FFC57E;
  --zest:#4FDD33; --amber-ink:#7A4E12;
  --cream:#F1EFE4; --paper:#FAF8F1; --card:#FFFFFF;
  --forest:#12220F; --forest-2:#1C3418; --on-forest:#EAF2E2; --on-forest-2:rgba(234,242,226,.82);
  --ink:#16210F; --ink-2:#414F3B; --ink-3:rgba(22,33,15,.70);
  --line:rgba(22,33,15,.12); --line-2:rgba(22,33,15,.07); --line-g:rgba(234,242,226,.18);
  --maxw:1400px; --gut:clamp(1.1rem, 4vw, 3rem); --r:24px; --r-sm:14px; --r-pill:100px;
  --t-1:clamp(.74rem, .7rem + .14vw, .82rem);
  --t0:clamp(1rem, .96rem + .2vw, 1.12rem);
  --t1:clamp(1.14rem, 1rem + .55vw, 1.45rem);
  --h3:clamp(1.25rem, 1.05rem + .7vw, 1.6rem);
  --h2:clamp(2.2rem, 1.3rem + 3.4vw, 4rem);
  --h1:clamp(2.8rem, 1.2rem + 5.6vw, 6rem);
  --shadow:0 24px 60px -28px rgba(14,30,12,.40);
}
html{ -webkit-text-size-adjust:100% }
html.js [data-reveal]{opacity:0}
body{background:var(--cream);color:var(--ink);font-family:"Switzer",system-ui,sans-serif;
  font-optical-sizing:auto;font-size:var(--t0);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{display:block;max-width:100%;height:auto}a{color:inherit;text-decoration:none}
::selection{background:var(--lime);color:#fff}
:focus-visible{outline:2px solid var(--lime);outline-offset:3px}

.wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gut)}
.section{padding-block:clamp(4.5rem, 9vw, 8rem)}
.pt0{padding-top:0}
.h2{font-weight:600;font-size:var(--h2);line-height:1.04;letter-spacing:-.02em;margin-top:1.1rem}
.h2 em,.split__body em,.rcard em{font-family:"Playfair Display",Georgia,serif;font-style:italic;font-weight:500;letter-spacing:0}
.h2--light{color:var(--on-forest)}
.lead{font-size:var(--t1);line-height:1.5;color:var(--ink-2);margin-top:1.2rem;max-width:54ch}
.lead--light{color:var(--on-forest-2)}
.lead a{color:inherit;text-decoration:underline;text-underline-offset:3px}
.center{text-align:center;max-width:40ch;margin-inline:auto}
.center .h2{margin-inline:auto}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:.5rem;font-weight:600;font-size:.98rem;line-height:1;
  padding:1rem 1.6rem;border-radius:14px;cursor:pointer;border:1px solid transparent;
  transition:transform .35s cubic-bezier(.2,.7,.2,1),background .35s,color .35s,border-color .35s;white-space:nowrap}
.btn svg{width:1.05em;height:1.05em;transition:transform .35s}.btn:hover svg{transform:translateX(4px)}
.btn svg.ph{width:1em;height:1em}.btn:hover svg.ph{transform:none}
.btn:hover{transform:translateY(-2px)}
.btn--lg{padding:1.15rem 1.9rem;font-size:1.04rem}
.btn--sm{padding:.7rem 1.1rem;font-size:.86rem}
.btn--lime{background:var(--lime);color:var(--lime-ink)}.btn--lime:hover{background:var(--lime-2)}
.btn--dark{background:var(--forest);color:var(--on-forest)}.btn--dark:hover{background:#0A160A}
.btn--line{border-color:var(--line);color:var(--ink);background:transparent}.btn--line:hover{border-color:var(--ink);background:rgba(22,33,15,.05)}
.btn--ghost{background:rgba(255,255,255,.14);color:#fff;border-color:rgba(255,255,255,.4);backdrop-filter:blur(8px)}
.btn--ghost:hover{background:rgba(255,255,255,.24)}

/* NAV (floating bar, rounded corners) — logo left, links + CTA grouped right */
.nav{position:fixed;inset:.9rem 0 auto;z-index:60;padding-inline:var(--gut);transition:.4s}
.nav__pill{max-width:var(--maxw);margin-inline:auto;display:flex;align-items:center;justify-content:space-between;gap:1rem;
  background:rgba(253,252,247,.95);backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.65);
  border-radius:14px;padding:.55rem .6rem .55rem 1.05rem;box-shadow:0 14px 40px -22px rgba(14,30,12,.5)}
.nav.scrolled{inset:.5rem 0 auto}.nav.scrolled .nav__pill{background:#FDFCF7;box-shadow:0 16px 44px -20px rgba(14,30,12,.6)}
.nav__right{display:flex;align-items:center;gap:.6rem}
.brand{display:inline-flex;align-items:center;gap:.5rem;font-family:"Switzer",system-ui,sans-serif;white-space:nowrap}
.brand__img{height:50px;width:auto;display:block;flex:none}
.brand__txt{display:flex;flex-direction:column;line-height:1.02}
.brand__txt b{font-weight:700;font-size:.97rem;letter-spacing:.004em}
/* LOCKED: wordmark second line letter-spacing = .1em. Never increase it to "stretch" the short
   word out to the width of the line above — that reads as too spaced apart. Fixed brand constant
   on every build, like the font. Enforced by audit C4. */
.brand__txt small{font-weight:600;font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--amber-ink);margin-top:.2rem}
.brand--light{color:var(--on-forest)}
.brand--light .brand__txt small{color:var(--accent-light)}
.nav__links{display:flex;gap:1.4rem;align-items:center;margin-right:1.1rem}
.nav__links a{font-size:.88rem;font-weight:500;color:var(--ink-2);transition:.25s}
.nav__links a:hover,.nav__links a[aria-current=page]{color:var(--ink)}
/* drawer is the only nav on a phone, so it needs its own current-page affordance */
.menu__links a[aria-current=page]{color:var(--accent-light)}
.nav .btn{padding:.74rem 1.3rem;font-size:.94rem;border-radius:12px}
.navphone{font-weight:600;letter-spacing:-.01em}
.burger{display:none;width:2.8rem;height:2.8rem;border:1px solid var(--line);border-radius:50%;background:#fff;cursor:pointer;position:relative}
.brand--light .brand__img{filter:drop-shadow(0 2px 6px rgba(0,0,0,.45))}
.burger span{position:absolute;left:50%;top:50%;width:15px;height:1.6px;background:var(--ink);transform:translate(-50%,-50%);transition:.3s}
.burger span:nth-child(1){margin-top:-5px}.burger span:nth-child(3){margin-top:5px}

.menu{position:fixed;inset:0;z-index:70;background:var(--forest);color:var(--on-forest);display:flex;flex-direction:column;padding:var(--gut);transform:translateY(-100%);transition:transform .6s cubic-bezier(.76,0,.24,1);visibility:hidden}
.menu.open{transform:none;visibility:visible}
.menu__top{display:flex;align-items:center;justify-content:space-between;padding-block:.4rem}
.menu__close{width:2.8rem;height:2.8rem;border:1px solid var(--line-g);border-radius:50%;background:none;color:var(--on-forest);font-size:1.1rem;cursor:pointer}
.menu__links{margin:auto 0;display:flex;flex-direction:column;gap:.1rem}
.menu__links a{font-weight:600;font-size:clamp(2.2rem, 11vw, 3.6rem);line-height:1.24;letter-spacing:-.03em;display:flex;align-items:baseline;gap:1rem}
.menu__links a .n{font-size:.8rem;color:var(--accent-light);font-weight:600}
.menu__foot{display:flex;gap:1.4rem;flex-wrap:wrap;color:var(--on-forest-2);font-size:.95rem}

/* HERO */
/* LOCKED top padding: keeps the whole hero (nav → headline → sub → actions → proof card) inside one
   viewport so the bottom-aligned CTAs are never pushed below the fold. Do NOT raise the top clamp to
   reposition the headline (that clips the CTAs) and never set a fixed height (overflow:hidden clips).
   If a build still cuts off, trim hero__sub / hero__actions margins, not this. Enforced by audit K3d. */
.hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;overflow:hidden;color:#fff;padding:clamp(7.5rem, 10vh, 9.25rem) var(--gut) clamp(2rem, 4vw, 3.4rem)}
.hero__media{position:absolute;inset:-10% 0;z-index:0;will-change:transform}
.hero__media img{width:100%;height:100%;object-fit:cover;filter:brightness(.9)}
.hero__shade{position:absolute;inset:0;z-index:1;background:linear-gradient(95deg,rgba(11,20,13,.80) 0%,rgba(11,20,13,.58) 40%,rgba(11,20,13,.20) 72%,rgba(11,20,13,.34) 100%),linear-gradient(180deg,rgba(11,20,13,.42) 0%,rgba(11,20,13,.08) 32%,rgba(11,20,13,.72) 100%)}
.hero__in{position:relative;z-index:2;width:100%;max-width:var(--maxw);margin-inline:auto;display:flex;align-items:flex-end;justify-content:space-between;gap:2rem;flex-wrap:wrap}
.hero__copy{max-width:42rem}
.hero__h1{font-weight:600;font-size:var(--h1);line-height:.98;letter-spacing:-.025em}
.hero__h1 em{font-family:"Playfair Display",Georgia,serif;font-style:italic;font-weight:500;letter-spacing:-.01em;color:var(--accent-light)}
.hero__h1 .nb{white-space:nowrap}
.hero__sub{font-size:var(--t1);line-height:1.45;color:rgba(255,255,255,.92);margin-top:1.4rem;max-width:40ch}
.hero__actions{display:flex;flex-wrap:nowrap;gap:.8rem;margin-top:2rem}
.hero__card{display:flex;gap:.9rem;align-items:stretch;background:rgba(12,22,40,.5);backdrop-filter:blur(18px);border:1px solid rgba(255,255,255,.2);border-radius:var(--r);padding:.85rem;max-width:372px}
.hero__card-media{flex:none;width:5.4rem;border-radius:var(--r-sm);overflow:hidden}
.hero__card-media img{width:100%;height:100%;object-fit:cover}
.hero__card-body{display:flex;flex-direction:column;gap:.25rem}
.hero__card .stars{color:var(--accent-light);font-size:.82rem;letter-spacing:.08em}
.hero__card b{font-size:1.04rem;font-weight:600;line-height:1.1}
.hero__card small{color:rgba(255,255,255,.66);font-size:.74rem;line-height:1.3}
.hero__card .btn{margin-top:.5rem;align-self:flex-start}

/* TRUST BAR */
.trust{background:var(--forest);color:var(--on-forest)}
.trust__row{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;padding-block:clamp(2rem, 3.6vw, 2.8rem)}
.trust__item{display:flex;flex-direction:column;gap:.25rem;text-align:center;padding:.4rem;border-left:1px solid var(--line-g)}
.trust__item:first-child{border-left:0}
.trust__item b{font-family:"Playfair Display",Georgia,serif;font-style:italic;font-weight:500;font-size:clamp(1.8rem, 1rem + 2.4vw, 3rem);line-height:1;color:var(--accent-light)}
.trust__item b .star{font-style:normal;font-size:.46em;vertical-align:.08em;margin-left:.05em}
.trust__item span{font-size:.88rem;color:var(--on-forest-2)}

/* SPLIT (about) */
.split{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(1.6rem, 4vw, 4.5rem);align-items:center}
.split__media{border-radius:var(--r);overflow:hidden;aspect-ratio:4/5}
.split__media img{width:100%;height:100%;object-fit:cover;will-change:transform}
.split__body .h2{font-size:clamp(1.7rem, 1.1rem + 2.2vw, 2.6rem)}
.ticks{list-style:none;display:grid;gap:.8rem;margin:1.8rem 0}
.ticks li{position:relative;padding-left:2.1rem;color:var(--ink-2)}
.ticks li::before{content:"";position:absolute;left:0;top:.1rem;width:1.45rem;height:1.45rem;background:var(--lime);border-radius:50%;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l4 4 10-10'/%3E%3C/svg%3E");background-size:64%;background-position:center;background-repeat:no-repeat}

/* SERVICES */
.shead{display:flex;align-items:flex-end;justify-content:space-between;gap:1.5rem;flex-wrap:wrap;margin-bottom:clamp(2rem, 4vw, 3.2rem)}
.scards{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(.8rem, 1.5vw, 1.2rem)}
.scards--4{grid-template-columns:repeat(4,1fr)}
.scard{background:var(--card);border:1px solid var(--line-2);border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column;transition:transform .4s cubic-bezier(.2,.7,.2,1),box-shadow .4s,border-color .4s}
.scard:hover{transform:translateY(-6px);box-shadow:var(--shadow);border-color:transparent}
.scard__img{aspect-ratio:4/3;overflow:hidden;background:var(--cream)}
.scard__img img{width:100%;height:100%;object-fit:cover;transition:transform 1s cubic-bezier(.2,.7,.2,1)}
.scard:hover .scard__img img{transform:scale(1.05)}
.scard__body{padding:1.4rem 1.5rem 1.5rem;display:flex;flex-direction:column;flex:1}
.scard h3{font-size:var(--h3);font-weight:500;letter-spacing:-.02em;margin:0 0 .45rem}
.scard p{color:var(--ink-3);font-size:.95rem;margin-bottom:1.3rem}
.scard .go{margin-top:auto;width:2.6rem;height:2.6rem;border-radius:50%;background:var(--cream);display:grid;place-items:center;color:var(--lime);transition:.35s}
.scard .go svg{width:1.15rem;height:1.15rem}
.scard:hover .go{background:var(--forest);color:var(--accent-light);transform:translateX(3px)}

/* DARK FEATURE */
.feature{position:relative;overflow:hidden;color:#fff}
.feature__media{position:absolute;inset:-8% 0;z-index:0;will-change:transform}
.feature__media img{width:100%;height:100%;object-fit:cover}
.feature__shade{position:absolute;inset:0;z-index:1;background:linear-gradient(112deg,rgba(11,22,10,.92) 0%,rgba(11,22,10,.74) 46%,rgba(11,22,10,.52) 100%),linear-gradient(180deg,rgba(11,22,10,.22),rgba(11,22,10,.42))}
.feature__in{position:relative;z-index:2;padding-block:clamp(5.5rem, 11vw, 9rem);max-width:880px}
.feature__in .hero__actions{margin-top:2.2rem;flex-wrap:wrap}

/* REVIEWS / FEATURED TESTIMONIAL */
.tgrid{display:grid;grid-template-columns:1.4fr 1fr;gap:clamp(.8rem, 1.5vw, 1.2rem);margin:clamp(2.4rem, 4.5vw, 3.4rem) 0 clamp(.8rem, 1.5vw, 1.2rem)}
.tfeature{background:var(--card);border:1px solid var(--line-2);border-radius:var(--r);padding:clamp(2rem, 3vw, 3rem);display:flex;flex-direction:column;gap:1.4rem}
.tfeature .stars{color:var(--lime);font-size:1.05rem;letter-spacing:.06em}
.tfeature blockquote{font-family:"Playfair Display",Georgia,serif;font-style:italic;font-weight:400;font-size:clamp(1.4rem, 1rem + 1.4vw, 2.1rem);line-height:1.3;color:var(--ink)}
.tmeta{display:flex;align-items:center;gap:1rem;margin-top:auto}
.tavatars{display:flex;flex:none}
.tavatars i{width:2.5rem;height:2.5rem;border-radius:50%;background:var(--forest);color:var(--accent-light);display:grid;place-items:center;font-size:.72rem;font-weight:700;font-style:normal;border:2px solid var(--card);margin-left:-.65rem}
.tavatars i:first-child{margin-left:0}
.tmeta b{display:block;font-weight:600;font-size:.98rem}
.tmeta small{color:var(--ink-3);font-size:.84rem}
.tcta{background:var(--forest);color:var(--on-forest);border-radius:var(--r);padding:clamp(2rem, 3vw, 2.6rem);display:flex;flex-direction:column;gap:.9rem;justify-content:center}
.tcta h3{font-size:var(--h3);font-weight:600;letter-spacing:-.02em;line-height:1.15}
.tcta p{color:var(--on-forest-2);font-size:.96rem}
.tcta .btn{align-self:flex-start;margin-top:.3rem}
.tcta__ph{color:var(--on-forest-2);font-size:.9rem;font-weight:500}
.rgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(.8rem, 1.5vw, 1.2rem)}
.rcard{background:var(--card);border:1px solid var(--line-2);border-radius:var(--r);padding:clamp(1.7rem, 2.5vw, 2.1rem);display:flex;flex-direction:column;gap:1.2rem}
.rcard .stars{color:var(--lime);font-size:.95rem;letter-spacing:.05em}
.rcard blockquote{font-family:"Playfair Display",Georgia,serif;font-style:italic;font-weight:400;font-size:var(--t1);line-height:1.4;color:var(--ink)}
.rcard cite{margin-top:auto;font-style:normal;font-size:.85rem;color:var(--ink-3);font-weight:500}

/* GALLERY */
.gal{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:200px;gap:clamp(.6rem, 1.2vw, .9rem)}
.gal figure{position:relative;overflow:hidden;border-radius:var(--r)}
.gal img{width:100%;height:100%;object-fit:cover;transition:transform 1s cubic-bezier(.2,.7,.2,1)}
.gal figure:hover img{transform:scale(1.05)}
.gal .tag{position:absolute;top:.9rem;left:.9rem;background:var(--lime);color:#fff;font-size:.64rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:.34rem .7rem;border-radius:var(--r-pill)}
.g1{grid-column:span 5;grid-row:span 2}.g2{grid-column:span 7}.g3{grid-column:span 4}.g4{grid-column:span 3}

/* FAQ */
.faqwrap{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(1.6rem, 4vw, 4.5rem);align-items:start}
.faqhead{position:sticky;top:7rem}
.faqhead .lead{font-size:var(--t0)}
.faq details{border-bottom:1px solid var(--line);padding:1.4rem 0}.faq details:first-child{border-top:1px solid var(--line)}
.faq summary{display:flex;justify-content:space-between;gap:1.5rem;align-items:center;cursor:pointer;list-style:none;font-weight:600;font-size:var(--t1);letter-spacing:-.02em}
.faq summary::-webkit-details-marker{display:none}
.faq .pl{flex:none;width:2.1rem;height:2.1rem;border:1px solid var(--line);border-radius:50%;position:relative;transition:.3s}
.faq .pl::before,.faq .pl::after{content:"";position:absolute;left:50%;top:50%;width:.82rem;height:1.6px;background:var(--ink);transform:translate(-50%,-50%);transition:.3s}
.faq .pl::after{transform:translate(-50%,-50%) rotate(90deg)}
.faq details[open] .pl{background:var(--lime);border-color:var(--lime)}
.faq details[open] .pl::before{background:#fff}
.faq details[open] .pl::after{opacity:0}
.faq p{color:var(--ink-3);max-width:60ch;margin-top:1rem}

/* BIG CTA */
.bigcta{position:relative;overflow:hidden;color:#fff;text-align:center}
.bigcta__media{position:absolute;inset:-8% 0;z-index:0;will-change:transform}
.bigcta__media img{width:100%;height:100%;object-fit:cover}
.bigcta__shade{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(13,26,15,.52),rgba(13,26,15,.74))}
.bigcta__in{position:relative;z-index:2;padding-block:clamp(5.5rem, 12vw, 9.5rem);display:flex;flex-direction:column;align-items:center;gap:2rem}
.bigcta__h{font-weight:600;font-size:var(--h1);line-height:1;letter-spacing:-.025em;max-width:16ch}
.bigcta__h em{font-family:"Playfair Display",Georgia,serif;font-style:italic;font-weight:500;color:var(--accent-light)}
.bigcta__sub{color:rgba(255,255,255,.84);font-size:var(--t1);line-height:1.5;max-width:44ch;margin-top:-.8rem}

/* FOOTER */
.foot{background:var(--forest);color:var(--on-forest);overflow:hidden}
.foot__cols{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:1.6rem;padding-block:clamp(3.5rem, 6vw, 5rem) 2rem}
.foot__brand .brand{display:inline-flex;max-width:100%;padding:0;font-size:clamp(.82rem,4.4vw,1.08rem);letter-spacing:.1em}
.foot__brand p{color:var(--on-forest-2);font-size:.94rem;margin-top:1rem;max-width:34ch}
.foot__cols h5{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--on-forest-2);margin-bottom:1rem}
.foot__cols>div>a,.foot__cols>div>p{display:block;color:rgba(232,238,248,.78);padding:.25rem 0;font-size:.95rem}
.foot__cols a:hover{color:var(--accent-light)}
.socials{display:flex;gap:.6rem;margin-top:1.5rem}
.socials a{width:2.6rem;height:2.6rem;border-radius:50%;border:1px solid var(--line-g);display:grid;place-items:center;color:var(--on-forest-2);transition:.3s}
.socials a:hover{background:var(--lime);border-color:var(--lime);color:#fff;transform:translateY(-2px)}
.socials svg{width:1.1rem;height:1.1rem}
.foot__word{font-weight:600;line-height:.82;text-align:center;letter-spacing:-.04em;color:var(--on-forest);opacity:.09;white-space:nowrap;
  font-size:clamp(2.2rem, 12.4vw, 12rem);padding-bottom:.04em;user-select:none}
.foot__base{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center;text-align:center;padding-block:1.6rem 2.2rem;border-top:1px solid var(--line-g);font-size:.8rem;color:var(--on-forest-2)}
.callbar{position:fixed;inset:auto .8rem .8rem;z-index:55;display:none;justify-content:center;align-items:center;gap:.5rem;background:var(--lime);color:#fff;font-weight:600;padding:1rem;border-radius:14px;box-shadow:0 18px 36px -12px rgba(0,0,0,.45)}
.callbar svg{width:1.05em;height:1.05em;flex:none}

/* ABOUT PAGE — sub-hero, values grid, process steps */
.pagehero{min-height:70svh;align-items:flex-end}
.pagehero .hero__in{justify-content:flex-start}
.pagehero .hero__copy{max-width:44rem}
/* stronger left+bottom scrim so sub-page hero text stays readable over bright images */
.pagehero .hero__shade{background:linear-gradient(95deg,rgba(13,26,15,.88) 0%,rgba(13,26,15,.62) 40%,rgba(13,26,15,.22) 72%,rgba(13,26,15,.42) 100%),linear-gradient(0deg,rgba(13,26,15,.55) 0%,rgba(13,26,15,0) 50%)}
.pagehero .hero__h1{font-size:clamp(2.3rem,1.3rem + 3.7vw,4.4rem)}
.pagehero .hero__sub{font-size:clamp(1.04rem,.98rem + .34vw,1.22rem);color:rgba(255,255,255,.9);max-width:46ch}
.center--wide{max-width:52ch}

.vcards{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(.8rem,1.5vw,1.2rem);margin-top:clamp(2rem,4vw,3.2rem)}
.vcard{background:var(--card);border:1px solid var(--line-2);border-radius:var(--r);padding:clamp(1.7rem,2.5vw,2.2rem);display:flex;flex-direction:column;gap:.9rem;transition:transform .4s cubic-bezier(.2,.7,.2,1),box-shadow .4s,border-color .4s}
.vcard:hover{transform:translateY(-6px);box-shadow:var(--shadow);border-color:transparent}
.vcard__ic{width:3rem;height:3rem;border-radius:14px;background:var(--cream);color:var(--lime);display:grid;place-items:center;flex:none}
.vcard__ic svg{width:1.5rem;height:1.5rem}
.vcard h3{font-size:var(--h3);font-weight:500;letter-spacing:-.02em}
.vcard p{color:var(--ink-3);font-size:.95rem}

.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(1rem,2vw,1.8rem);margin-top:clamp(2rem,4vw,3.2rem)}
.step{position:relative;padding-top:1.7rem;border-top:2px solid var(--line)}
.step::after{content:"";position:absolute;top:-2px;left:0;width:38%;height:2px;background:var(--zest)}
.step__n{font-family:"Playfair Display",Georgia,serif;font-style:italic;font-weight:500;font-size:1.15rem;color:var(--amber-ink)}
.step h3{font-size:var(--t1);font-weight:600;letter-spacing:-.02em;margin:.7rem 0 .55rem}
.step p{color:var(--ink-3);font-size:.92rem;line-height:1.55}
@media(max-width:980px){ .vcards{grid-template-columns:1fr}.steps{grid-template-columns:repeat(2,1fr)} }
@media(max-width:560px){ .steps{grid-template-columns:1fr} }

/* SERVICE ROWS — full-width, alternating image + detail */
.srows{display:flex;flex-direction:column;gap:clamp(3rem,6.5vw,6.5rem);margin-top:clamp(2.6rem,5vw,4.5rem)}
.srow{display:grid;grid-template-columns:1.02fr 1fr;gap:clamp(1.8rem,4.5vw,5rem);align-items:center}
.srow__media{position:relative;border-radius:var(--r);overflow:hidden;aspect-ratio:5/4;box-shadow:var(--shadow)}
.srow__media img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.srow:hover .srow__media img{transform:scale(1.04)}
.srow__tag{position:absolute;top:1rem;left:1rem;background:rgba(18,34,15,.72);backdrop-filter:blur(6px);color:var(--on-forest);font-size:.66rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding:.4rem .8rem;border-radius:var(--r-pill)}
.srow__n{display:inline-block;font-family:"Playfair Display",Georgia,serif;font-style:italic;font-weight:500;font-size:1.15rem;color:var(--amber-ink);margin-bottom:.5rem}
.srow__body h2{font-size:clamp(1.7rem,1.1rem + 2.1vw,2.5rem);font-weight:600;letter-spacing:-.02em;line-height:1.06}
.srow__body .lead{margin-top:.9rem}
.srow__body .ticks{margin:1.5rem 0 1.9rem}
.srow:nth-child(even) .srow__media{order:2}
@media(max-width:980px){
  .srow{grid-template-columns:1fr;gap:1.5rem}
  .srow__media,.srow:nth-child(even) .srow__media{order:-1;aspect-ratio:16/11}
}

/* GALLERY — masonry + lightbox */
.masonry{columns:4 250px;column-gap:clamp(.6rem,1.2vw,1rem);margin-top:clamp(2rem,4vw,3.2rem)}
.masonry figure{break-inside:avoid;margin:0 0 clamp(.6rem,1.2vw,1rem);position:relative;border-radius:var(--r-sm);overflow:hidden;cursor:zoom-in;background:var(--cream)}
.masonry img{width:100%;height:auto;display:block;transition:transform 1s cubic-bezier(.2,.7,.2,1)}
.masonry figure:hover img{transform:scale(1.05)}
.masonry figure::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(14,26,12,.45));opacity:0;transition:.4s;pointer-events:none}
.masonry figure:hover::after{opacity:1}
.masonry .tag{position:absolute;top:.7rem;left:.7rem;z-index:2;background:var(--lime);color:#fff;font-size:.6rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:.32rem .65rem;border-radius:var(--r-pill);opacity:0;transform:translateY(-4px);transition:.4s}
.masonry figure:hover .tag{opacity:1;transform:none}
@media(max-width:680px){ .masonry{columns:2 140px} }

.lb{position:fixed;inset:0;z-index:90;background:rgba(7,12,22,.93);backdrop-filter:blur(6px);display:none;align-items:center;justify-content:center;padding:clamp(1rem,4vw,3rem)}
.lb.open{display:flex}
.lb img{max-width:92vw;max-height:86vh;border-radius:var(--r-sm);box-shadow:0 30px 80px -20px rgba(0,0,0,.7)}
.lb__btn{position:absolute;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.3);color:#fff;width:3rem;height:3rem;border-radius:50%;display:grid;place-items:center;cursor:pointer;transition:.3s}
.lb__btn:hover{background:rgba(255,255,255,.26)}
.lb__btn svg{width:1.3rem;height:1.3rem}
.lb__close{top:1.2rem;right:1.2rem}
.lb__prev{left:1.2rem;top:50%;transform:translateY(-50%)}
.lb__next{right:1.2rem;top:50%;transform:translateY(-50%)}
.lb__count{position:absolute;bottom:1.3rem;left:50%;transform:translateX(-50%);color:rgba(255,255,255,.72);font-size:.85rem;letter-spacing:.05em}
@media(max-width:560px){ .lb__prev{left:.4rem}.lb__next{right:.4rem} }

/* SERVICE AREAS — pills */
.arealist{list-style:none;display:flex;flex-wrap:wrap;justify-content:center;gap:.7rem;margin-top:clamp(2rem,4vw,3rem);max-width:62rem;margin-inline:auto}
.arealist li{display:inline-flex;align-items:center;gap:.55rem;background:var(--card);border:1px solid var(--line-2);border-radius:var(--r-pill);padding:.7rem 1.3rem;font-weight:500;color:var(--ink-2);font-size:.95rem}
.arealist li::before{content:"";width:.5rem;height:.5rem;border-radius:50%;background:var(--lime);flex:none}

/* FOOTER contact links with leading icon */
.foot__cols a.fcontact{display:flex;align-items:center;gap:.6rem}
.foot__cols a.fcontact svg{width:1.05em;height:1.05em;color:var(--accent-light);flex:none}

/* REVIEWS — masonry of real reviews */
.rmason{columns:3 320px;column-gap:clamp(.8rem,1.5vw,1.2rem);margin-top:clamp(2.2rem,4vw,3.4rem)}
.rmason .rcard{break-inside:avoid;margin:0 0 clamp(.8rem,1.5vw,1.2rem)}
.rmason .rcard blockquote{font-family:"Switzer",system-ui,sans-serif;font-style:normal;font-size:1rem;line-height:1.62;color:var(--ink-2)}
.rcard cite{display:flex;flex-direction:column;gap:.12rem;font-style:normal}
.rcard cite b{font-weight:600;color:var(--ink);font-size:.95rem}
.rcard cite span{font-size:.8rem;color:var(--ink-3)}
@media(max-width:680px){ .rmason{columns:1} }

/* Google + Facebook review platform buttons */
.btn--google,.btn--ls{background:#fff;color:#1f2430;border-color:#fff}
.btn--google:hover,.btn--ls:hover{background:#eef2fb}
.btn svg.gic,.btn svg.lic{width:1.2em;height:1.2em}
.btn img.lic{width:1.25em;height:1.25em;object-fit:contain;flex:none}
.btn:hover svg.gic,.btn:hover svg.lic{transform:none}

/* plain (image-free) dark CTA band — avoids clashing with an image section below */
.feature--plain{background:var(--forest)}
.feature--plain .feature__media,.feature--plain .feature__shade{display:none}

/* CONTACT — info card + form */
.contact{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(1rem,2.5vw,1.6rem);align-items:start;margin-top:clamp(2rem,4vw,3rem)}
.cinfo{background:var(--forest);color:var(--on-forest);border-radius:var(--r);padding:clamp(1.8rem,3vw,2.6rem);display:flex;flex-direction:column;gap:1.3rem}
.cinfo h2{font-size:var(--h3);font-weight:600;letter-spacing:-.02em;line-height:1.1}
.cinfo>p{color:var(--on-forest-2);font-size:.96rem;margin-top:-.4rem}
.cline{display:flex;gap:.85rem;align-items:center}
.cline .ic{width:2.7rem;height:2.7rem;border-radius:12px;background:rgba(255,197,126,.12);border:1px solid var(--line-g);display:grid;place-items:center;flex:none;color:var(--accent-light)}
.cline .ic svg{width:1.2rem;height:1.2rem}
.cline small{display:block;color:var(--on-forest-2);font-size:.74rem;text-transform:uppercase;letter-spacing:.12em;margin-bottom:.1rem}
.cline b{font-weight:600;font-size:1.02rem}
.cline a{color:inherit}.cline a:hover b{color:var(--accent-light)}
.cinfo__chips{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.2rem}
.cinfo__chips span{border:1px solid var(--line-g);color:var(--on-forest-2);border-radius:var(--r-pill);padding:.4rem .85rem;font-size:.82rem}
.cinfo__lic{margin-top:auto;color:var(--on-forest-2);font-size:.82rem;border-top:1px solid var(--line-g);padding-top:1.2rem}

.cform{background:var(--card);border:1px solid var(--line-2);border-radius:var(--r);padding:clamp(1.8rem,3vw,2.6rem);box-shadow:var(--shadow)}
.cform h2{font-size:var(--h3);font-weight:600;letter-spacing:-.02em;margin-bottom:.4rem}
.cform__intro{color:var(--ink-3);font-size:.95rem;margin-bottom:1.6rem}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.field{display:flex;flex-direction:column;gap:.4rem;margin-bottom:1.1rem}
.field label{font-size:.82rem;font-weight:600;color:var(--ink-2)}
.field input,.field select,.field textarea{width:100%;font:inherit;font-size:1rem;color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:.85rem 1rem;transition:border-color .25s,box-shadow .25s,background .25s}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--lime);box-shadow:0 0 0 3px rgba(30,107,39,.18);background:#fff}
.field textarea{resize:vertical;min-height:120px}
.field--hp{position:absolute;left:-9999px;opacity:0;height:0;margin:0}
.cform form .btn{width:100%;justify-content:center;margin-top:.3rem}
.cform__note{text-align:center;font-size:.82rem;color:var(--ink-3);margin-top:.9rem}
.cform__ok{display:none;text-align:center;padding:2.4rem 1rem}
.cform__ok .ok-ic{width:3.6rem;height:3.6rem;border-radius:50%;background:var(--lime);color:#fff;display:grid;place-items:center;margin:0 auto 1.1rem}
.cform__ok .ok-ic svg{width:1.7rem;height:1.7rem}
.cform__ok h3{font-size:var(--h3);font-weight:600;letter-spacing:-.02em;margin-bottom:.5rem}
.cform__ok p{color:var(--ink-3)}
.cform.sent form{display:none}
.cform.sent .cform__ok{display:block}
@media(max-width:880px){ .contact{grid-template-columns:1fr} .frow{grid-template-columns:1fr} }

/* reveals */
html.js [data-reveal]{transform:translateY(28px)}
html.js [data-reveal].in{opacity:1;transform:none}

/* switch to burger before the full nav gets cramped */
@media(max-width:1080px){ .nav__links,.navphone{display:none} .burger{display:block} }
@media(max-width:980px){
  .split{grid-template-columns:1fr}.split__media{aspect-ratio:16/11;order:-1}
  .scards{grid-template-columns:repeat(2,1fr)}
  .tgrid{grid-template-columns:1fr}.rgrid{grid-template-columns:1fr}
  .faqwrap{grid-template-columns:1fr}.faqhead{position:relative;top:0}
  .trust__row{grid-template-columns:repeat(2,1fr);gap:1.6rem 1rem}
  .trust__item:nth-child(3){border-left:0}
  .gal{grid-template-columns:repeat(2,1fr)}.g1,.g2,.g3,.g4{grid-column:span 1;grid-row:span 1}
  .foot__cols{grid-template-columns:1fr 1fr}.foot__brand{grid-column:1/-1}
  .hero__in{align-items:flex-start;flex-direction:column}
}
@media(max-width:560px){
  :root{--r:18px}
  .nav .btn--lime{display:none}
  .scards{grid-template-columns:1fr}
  .hero__actions{flex-wrap:wrap}.hero__actions .btn{flex:1;justify-content:center}
  /* M3: .btn is white-space:nowrap, so long labels overflow a 320px column and get sliced by
     body{overflow-x:hidden}. Dropping nowrap alone is NOT enough: it collapses min-content width,
     so flex:1 then packs both CTAs onto ONE row at half width and the labels wrap to 3 lines
     ("Get a free / quote" at iPhone width). Stack them instead, full width. Applies to every
     button row that can hold a long label, not just the hero. */
  .hero__actions{flex-direction:column;align-items:stretch}
  .hero__actions .btn{flex:none;width:100%;white-space:normal;text-align:center}
  .rbtns{width:100%}
  .rbtns .btn{flex:none;width:100%;white-space:normal;text-align:center;max-width:100%;padding-inline:1.1rem}
  .hero__h1 em{white-space:normal}
  .hero__card{display:none}
  .hero__shade{background:linear-gradient(180deg,rgba(11,20,13,.58) 0%,rgba(11,20,13,.34) 28%,rgba(11,20,13,.84) 100%)}
  .foot__cols{grid-template-columns:1fr}
  .gal{grid-template-columns:1fr;grid-auto-rows:230px}
  .callbar{display:flex}body{padding-bottom:4.6rem}
  /* M2 — the sticky call-bar is fixed to the bottom, so any hero CTA must be lifted clear of it.
     Applies to EVERY hero (home .hero AND the .pagehero sub-heroes), not just the home page:
     scoping this to the home hero alone left /services and /about burying their Call CTA on short
     phones — one of them 107% covered, i.e. entirely behind the bar. */
  .hero{padding-bottom:6rem}
}
/* M2 (short phones) — padding alone cannot solve it. Below ~720px of viewport height the hero
   content column is taller than 100svh, so the hero grows past the viewport, bottom-alignment stops
   applying and the extra padding moves the buttons not at all. Compress the hero itself and drop the
   duplicate ghost Call CTA (the sticky call-bar already carries the identical tel: action). */
@media(max-width:560px) and (max-height:720px){
  .hero{padding-top:7.25rem;padding-bottom:5.5rem}
  .hero__h1{font-size:clamp(2rem,8.4vw,2.4rem)}
  .hero__sub{font-size:1rem;margin-top:.7rem}
  .hero__actions{margin-top:1rem}
  /* Drop the duplicate ghost Call ONLY where the hero has another CTA — the call-bar already carries
     the identical tel: action. `:not(:only-child)` is deliberate: /contact's hero has the ghost Call
     as its ONLY CTA, so hiding it unconditionally leaves that hero with no call to action at all. */
  .hero .hero__actions .btn--ghost:not(:only-child){display:none}
  /* Sub-hero pages stack two full-width platform buttons, so at 320x568 the .pagehero can
     overflow 100svh and push the second CTA under the call-bar. Tighten the sub-hero only.
     Do NOT shrink .btn padding instead: that collapses the single-CTA sub-heroes to ~38px,
     under the tap-target floor (tested and rejected by the mobile lens). */
  .pagehero .hero__sub{font-size:.95rem;margin-top:.55rem}
  .pagehero .hero__actions{gap:.55rem;margin-top:.8rem}
}
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001ms!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  html.js [data-reveal]{opacity:1;transform:none}
}

/* ============================================================
   SIGNATURE — "the cut line"
   A mower pass rendered as angled mown stripes in the two logo greens.
   One band between the major sections of every page, drifted sideways by
   ScrollTrigger (transform only, so Lenis is never starved).
   ============================================================ */
.cutline{--shift:0px;position:relative;height:76px;overflow:hidden;background:var(--forest)}
.cutline::before{content:"";position:absolute;top:-45%;left:-35%;width:170%;height:190%;
  transform:translate3d(var(--shift),0,0);
  background:repeating-linear-gradient(102deg,
    rgba(79,221,51,0) 0 26px,
    rgba(79,221,51,.17) 26px 58px,
    rgba(79,221,51,0) 58px 86px,
    rgba(255,197,126,.11) 86px 114px);
  will-change:transform}
.cutline::after{content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,var(--forest),rgba(18,34,15,0) 24%,rgba(18,34,15,0) 76%,var(--forest))}
.cutline--light{background:var(--cream)}
.cutline--light::before{background:repeating-linear-gradient(102deg,
    rgba(30,107,39,0) 0 26px,
    rgba(30,107,39,.15) 26px 58px,
    rgba(30,107,39,0) 58px 86px,
    rgba(122,78,18,.11) 86px 114px)}
.cutline--light::after{background:linear-gradient(90deg,var(--cream),rgba(241,239,228,0) 24%,rgba(241,239,228,0) 76%,var(--cream))}
@media(max-width:560px){ .cutline{height:54px} }

/* the same pass, once, sweeping across the home hero photograph on load */
.hero__cut{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden}
.hero__cut span{position:absolute;top:-30%;left:0;width:32vw;height:180%;
  transform:translateX(-70vw) rotate(8deg);
  background:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.17) 46%,rgba(255,255,255,0))}

/* proof card stars pick up the logo apricot */
.hero__card .stars{color:var(--accent-light)}

/* Facebook recommendation label (no fabricated star rating on a FB card) */
.rsrc{display:inline-flex;align-items:center;gap:.5rem;font-size:.8rem;font-weight:600;letter-spacing:.01em;color:var(--amber-ink)}
.rsrc svg{width:1.05rem;height:1.05rem;flex:none;color:#1877F2}
/* featured testimonial attribution */
.tfeature cite{display:flex;flex-direction:column;gap:.15rem;font-style:normal;margin-top:-.5rem}
.tfeature cite b{font-weight:600;font-size:.98rem;color:var(--ink)}
.tfeature cite span{font-size:.82rem;color:var(--ink-3)}