:root{
  --leafmask:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjkgNyA4MyA5MyI+PHBhdGggZD0iTTQ5LjggOC4zIEw0NC43IDE2LjcgTDQxLjEgMjMuOCBMNDAuMCAyNS4xIEwzOC43IDI1LjEgTDM0LjIgMjMuMSBMMzMuMyAyMy40IEwzMy40IDI5LjAgTDM2LjEgNDIuMCBMMzYuMSA0NC4zIEwzNS41IDQ1LjEgTDM0LjYgNDUuMSBMMzMuNSA0NC40IEwyOS40IDQwLjUgTDI1LjkgMzcuOSBMMjUuMiAzNy45IEwyNC45IDM4LjIgTDI0LjAgNDAuNiBMMjMuNCA0MS4wIEwxMS40IDM4LjIgTDEwLjEgMzguMyBMMTAuMiAzOS42IEwxNC4xIDUyLjAgTDE0LjUgNTQuNCBMMTMuNiA1NS44IEw5LjkgNTcuOCBMOS45IDU4LjcgTDEzLjIgNjIuNCBMMTcuNiA2Ni4zIEwyNC4yIDcxLjIgTDI2LjEgNzMuNSBMMjYuMSA3NC45IEwyNS4yIDc2LjIgTDIwLjEgODAuNiBMMjAuMCA4MS4zIEwyMC41IDgyLjAgTDIyLjQgODMuMCBMMjYuMiA4NC4zIEwzMi41IDg1LjUgTDM4LjMgODUuMiBMNDUuNSA4My4yIEw0Ny4wIDgzLjUgTDQ3LjcgODQuMiBMNDguNCA4Ni4yIEw0Ny40IDk3LjggTDQ4LjMgOTguNCBMNTEuOCA5OC40IEw1Mi44IDk3LjggTDUyLjAgODYuNCBMNTIuNyA4NC4zIEw1My40IDgzLjYgTDU0LjggODMuMiBMNjEuNyA4NS4xIEw2NC42IDg1LjUgTDY4LjMgODUuNSBMNzMuNyA4NC41IEw3Ny45IDgzLjAgTDgwLjIgODEuNiBMODAuMyA4MC43IEw3NC44IDc1LjcgTDc0LjMgNzMuOSBMNzQuOSA3Mi40IEw3Ni4wIDcxLjMgTDg1LjkgNjMuNiBMODguOCA2MC43IEw5MC40IDU4LjYgTDkwLjEgNTcuNyBMODYuNiA1NS44IEw4NS44IDU0LjcgTDg2LjAgNTIuNyBMODkuNSA0MS42IEw5MC4xIDM4LjQgTDg4LjggMzguMiBMNzYuOSA0MS4wIEw3Ni4yIDQwLjUgTDc1LjMgMzguMSBMNzQuNSAzNy45IEw3Mi4wIDM5LjYgTDY2LjYgNDQuNyBMNjUuNiA0NS4yIEw2NC44IDQ1LjAgTDY0LjQgNDQuNSBMNjQuMyA0Mi40IEw2Ni44IDMwLjIgTDY3LjEgMjYuNSBMNjYuOSAyMy4zIEw2Ni4wIDIzLjEgTDYxLjYgMjUuMSBMNjAuNCAyNS4xIEw1OS40IDI0LjEgTDU2LjcgMTguNyBMNTAuNCA4LjNaIi8+PC9zdmc+");
  --green:#1C422F; --green-2:#24533B; --green-deep:#12301F;
  --amber:#D27C2D; --amber-ink:#A85A17; --amber-soft:#F3D3AE;
  --cream:#FEF7E9; --cream-2:#FAEEDA; --leaf:#FFF0D7; --white:#FFFDF8;
  --text:#1F2B24; --muted:#5E6A61; --line:rgba(28,66,47,.14); --line-2:rgba(28,66,47,.26);
  --serif:'Gambetta', 'Iowan Old Style', Georgia, serif;
  --sans:'Satoshi', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --r:28px; --r-sm:16px;
  --ease:cubic-bezier(.2,.7,.2,1);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth; scroll-padding-top:90px}
body{margin:0; background:var(--cream); color:var(--text); font-family:var(--sans); font-size:17px; line-height:1.6; -webkit-font-smoothing:antialiased}
img{max-width:100%; display:block}
a{color:inherit}
h1,h2,h3{font-family:var(--serif); font-weight:500; line-height:1.05; letter-spacing:-.02em; margin:0; color:var(--green); text-wrap:balance}
p{margin:0}
:focus-visible{outline:2px solid var(--amber); outline-offset:3px; border-radius:6px}
::selection{background:var(--amber-soft)}
.wrap{max-width:1240px; margin:0 auto; padding-inline:clamp(20px,4vw,48px)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.eyebrow{display:inline-flex; align-items:center; gap:10px; font-size:13px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--amber-ink)}
.eyebrow svg{width:16px; height:18px}

/* buttons */
.btn{display:inline-flex; align-items:center; gap:10px; font:700 15.5px/1 var(--sans); padding:17px 26px; border-radius:999px; text-decoration:none; border:0; cursor:pointer; transition:transform .25s var(--ease), background-color .2s, box-shadow .25s, color .2s}
.btn svg{width:16px; height:16px; transition:transform .25s var(--ease)}
.btn:hover svg{transform:translateX(3px)}
.btn-green{background:var(--green); color:var(--leaf)}
.btn-green:hover{background:var(--green-2); transform:translateY(-2px); box-shadow:0 14px 28px -14px rgba(28,66,47,.6)}
.btn-amber{background:var(--amber); color:#fff}
.btn-amber:hover{background:#BF6D21; transform:translateY(-2px); box-shadow:0 14px 28px -14px rgba(210,124,45,.7)}
.btn-ghost{background:transparent; color:var(--green); box-shadow:inset 0 0 0 1.5px var(--line-2)}
.btn-ghost:hover{box-shadow:inset 0 0 0 1.5px var(--green)}
.btn-light{background:var(--leaf); color:var(--green)}
.btn-light:hover{background:#fff; transform:translateY(-2px)}

/* announcement + nav */
.announce{background:var(--green); color:var(--leaf); font-size:14px; text-align:center; padding:9px 16px}
.announce b{color:var(--amber-soft)}
.announce a{color:var(--leaf); font-weight:700; text-underline-offset:3px}
header{position:sticky; top:0; z-index:40; background:rgba(254,247,233,.86); backdrop-filter:saturate(1.4) blur(14px); -webkit-backdrop-filter:saturate(1.4) blur(14px); border-bottom:1px solid transparent; transition:border-color .3s, background-color .3s}
header.scrolled{border-bottom-color:var(--line); background:rgba(254,247,233,.95)}
.nav{display:flex; align-items:center; justify-content:space-between; gap:24px; height:78px}
.logo{display:inline-flex; align-items:center; gap:12px; text-decoration:none; line-height:1}
.logo .mark{width:44px; height:47px; flex-shrink:0; transition:transform .5s cubic-bezier(.3,1.5,.5,1)}
.logo:hover .mark{transform:rotate(-8deg)}
.logo .w{display:flex; flex-direction:column; gap:2px}
.logo .w1{font-family:var(--serif); font-size:24px; font-weight:500; color:var(--green); letter-spacing:-.015em}
.logo .w2{font-family:var(--sans); font-size:18px; font-weight:700; color:var(--amber); letter-spacing:-.01em}
.links{display:flex; gap:6px}
.links a{text-decoration:none; font-size:15px; font-weight:500; color:var(--green); padding:9px 14px; border-radius:999px; transition:background-color .2s}
.links a:hover{background:rgba(28,66,47,.07)}
.nav .btn{padding:13px 20px; font-size:14.5px}
.menu{display:none; width:46px; height:46px; border-radius:50%; border:1.5px solid var(--line-2); background:transparent; color:var(--green); cursor:pointer; align-items:center; justify-content:center}
.menu svg{width:20px;height:20px}
@media (max-width:980px){ .links{display:none} .menu{display:inline-flex} .mob.open{display:block} }
@media (max-width:340px){ .nav .btn{display:none} }
@media (max-width:420px){ .nav .btn{padding:11px 15px; font-size:13.5px} .nav .btn svg{display:none} .menu{width:42px;height:42px} .logo .w1{font-size:21px} .logo .w2{font-size:16px} .logo .mark{width:38px;height:40.6px} }

/* hero */
.hero{padding:clamp(40px,6vw,80px) 0 clamp(56px,7vw,96px); position:relative}
.hero-grid{display:grid; grid-template-columns:1.02fr 1fr; gap:clamp(32px,5vw,72px); align-items:center}
.hero h1{font-size:clamp(50px,7.6vw,104px); margin:22px 0 26px}
.hero h1 em{font-style:italic; color:var(--amber)}
.hero .lead{font-size:clamp(18px,1.6vw,20.5px); color:var(--muted); max-width:44ch; margin-bottom:34px}
.hero .actions{display:flex; gap:12px; flex-wrap:wrap}
.ticks{display:flex; flex-wrap:wrap; gap:10px; margin-top:38px; padding:0; list-style:none}
.ticks li{display:inline-flex; align-items:center; gap:8px; font-size:14.5px; font-weight:500; color:var(--green); background:var(--white); border:1px solid var(--line); padding:8px 14px 8px 10px; border-radius:999px}
.ticks svg{width:18px; height:18px; color:var(--amber)}
.hero-media{position:relative; aspect-ratio:1/1.04}
.hero-photo{position:absolute; inset:0; border-radius:22%/21%; overflow:hidden; box-shadow:0 40px 80px -40px rgba(18,48,31,.55); background:var(--cream-2)}
.hero-photo img{width:100%; height:100%; object-fit:cover; transform:scale(1.06); transition:transform 1.6s var(--ease)}
.loaded .hero-photo img{transform:scale(1)}
.float{position:absolute; background:var(--white); border-radius:20px; box-shadow:0 24px 48px -24px rgba(18,48,31,.45); padding:16px 18px; display:flex; gap:12px; align-items:center}
.float .ic{width:42px; height:42px; border-radius:12px; display:grid; place-items:center; background:var(--green); color:var(--leaf); flex-shrink:0}
.float .ic svg{width:20px;height:20px}
.float b{display:block; font-size:15px; color:var(--green)}
.float span{font-size:13.5px; color:var(--muted)}
.f1{left:-28px; bottom:9%; animation:bob 6s ease-in-out infinite}
.f2{right:-18px; top:8%; flex-direction:column; align-items:flex-start; gap:2px; padding:16px 20px; animation:bob 7s ease-in-out -2s infinite}
.f2 .k{font-size:12px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--amber-ink)}
.f2 .v{font-family:var(--serif); font-size:40px; line-height:1; color:var(--green)}
.f2 .v small{font-family:var(--sans); font-size:13px; color:var(--muted); margin-left:4px}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@media (max-width:900px){ .hero-grid{grid-template-columns:1fr} .hero-media{max-width:560px; width:100%; margin:8px auto 0} .f1{left:-6px} .f2{right:-6px} }

/* marquee */
.marquee{background:var(--green); color:var(--leaf); overflow:hidden; padding:20px 0; border-block:1px solid var(--green-deep)}
.track{display:flex; width:max-content; gap:44px; animation:slide 38s linear infinite}
.track span{display:inline-flex; align-items:center; gap:44px; font-family:var(--serif); font-size:clamp(22px,2.4vw,30px); white-space:nowrap}
.track span::after{content:""; width:18px; height:20px; background:var(--amber); -webkit-mask:var(--leafmask) center/contain no-repeat; mask:var(--leafmask) center/contain no-repeat}
@keyframes slide{to{transform:translateX(-50%)}}

/* sections */
section{position:relative}
.sec{padding:clamp(80px,10vw,136px) 0}
.head{display:flex; justify-content:space-between; align-items:end; gap:32px; flex-wrap:wrap; margin-bottom:clamp(40px,5vw,64px)}
.head h2{font-size:clamp(40px,5.4vw,68px); margin-top:16px; max-width:14ch}
.head p{max-width:42ch; color:var(--muted); font-size:18px}

/* services */
.svc{display:grid; grid-template-columns:repeat(3,1fr); gap:22px}
.card{background:var(--white); border-radius:var(--r); overflow:hidden; border:1px solid var(--line); display:flex; flex-direction:column; text-decoration:none; transition:transform .4s var(--ease), box-shadow .4s var(--ease)}
.card:hover{transform:translateY(-6px); box-shadow:0 30px 60px -36px rgba(18,48,31,.5)}
.card .ph{aspect-ratio:4/3; overflow:hidden}
.card .ph img{width:100%; height:100%; object-fit:cover; transition:transform .9s var(--ease)}
.card:hover .ph img{transform:scale(1.05)}
.card .bd{padding:26px 26px 28px; display:flex; flex-direction:column; gap:10px; flex:1}
.card .tag{font-size:12.5px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--amber-ink)}
.card h3{font-size:31px}
.card p{color:var(--muted); font-size:16px; flex:1}
.card .go{display:inline-flex; align-items:center; gap:8px; font-weight:700; font-size:15px; color:var(--green); margin-top:8px}
.card .go svg{width:15px;height:15px; transition:transform .25s}
.card:hover .go svg{transform:translateX(4px)}
@media (max-width:900px){ .svc{grid-template-columns:1fr} .card{display:grid; grid-template-columns:1fr} }

/* checklist */
.incl{background:var(--cream-2); border-radius:var(--r); padding:clamp(28px,4vw,52px); margin-top:22px; display:grid; grid-template-columns:.8fr 2fr; gap:40px}
.incl h3{font-size:34px}
.incl > div:first-child p{color:var(--muted); margin-top:12px; font-size:16px}
.incl-cols{display:grid; grid-template-columns:repeat(4,1fr); gap:28px}
.incl-cols h4{font:700 13px/1.2 var(--sans); letter-spacing:.12em; text-transform:uppercase; color:var(--green); margin:0 0 12px}
.incl-cols ul{list-style:none; margin:0; padding:0}
.incl-cols li{font-size:15px; color:var(--muted); padding:8px 0 8px 22px; border-top:1px solid var(--line); position:relative}
.incl-cols li::before{content:""; position:absolute; left:0; top:15px; width:10px; height:6px; border-left:2px solid var(--amber); border-bottom:2px solid var(--amber); transform:rotate(-45deg)}
@media (max-width:1060px){ .incl{grid-template-columns:1fr} .incl-cols{grid-template-columns:repeat(2,1fr)} }
@media (max-width:520px){ .incl-cols{grid-template-columns:1fr} }

/* how */
.how{background:var(--green); color:var(--leaf); overflow:hidden}
.how h2{color:var(--leaf)}
.how .head p{color:rgba(255,240,215,.75)}
.how .eyebrow{color:var(--amber-soft)}
.steps{display:grid; grid-template-columns:repeat(3,1fr); gap:22px; counter-reset:s}
.step{border-radius:var(--r); padding:34px 30px 36px; background:rgba(255,240,215,.05); border:1px solid rgba(255,240,215,.12); position:relative; transition:background-color .3s}
.step:hover{background:rgba(255,240,215,.09)}
.step .n{font-family:var(--serif); font-style:italic; font-size:88px; line-height:.9; color:var(--amber); display:block; margin-bottom:28px}
.step h3{color:var(--leaf); font-size:30px; margin-bottom:12px}
.step p{color:rgba(255,240,215,.75); font-size:16px}
.how .ghost{position:absolute; right:-120px; top:-60px; width:520px; opacity:.05; pointer-events:none}
@media (max-width:860px){ .steps{grid-template-columns:1fr} }

/* estimate */
.est{display:grid; grid-template-columns:1.25fr 1fr; gap:22px; align-items:stretch}
.est-form{background:var(--white); border:1px solid var(--line); border-radius:var(--r); padding:clamp(24px,3.4vw,40px); display:flex; flex-direction:column; gap:28px}
.grp > .lbl{display:block; font-weight:700; font-size:14px; color:var(--green); margin-bottom:12px}
.opts{display:flex; flex-wrap:wrap; gap:10px}
.opt{position:relative}
.opt input{position:absolute; opacity:0; inset:0; margin:0; cursor:pointer}
.opt span{display:inline-flex; align-items:center; gap:8px; padding:12px 18px; border-radius:999px; border:1.5px solid var(--line-2); font-size:15px; font-weight:500; color:var(--green); background:var(--cream); transition:all .2s; cursor:pointer}
.opt span em{font-style:normal; font-size:13px; color:var(--amber-ink); font-weight:700}
.opt:hover span{border-color:var(--green)}
.opt input:checked + span{background:var(--green); color:var(--leaf); border-color:var(--green)}
.opt input:checked + span em{color:var(--amber-soft)}
.opt input:focus-visible + span{outline:2px solid var(--amber); outline-offset:2px}
.receipt{background:var(--green); color:var(--leaf); border-radius:var(--r); padding:clamp(26px,3.4vw,40px); display:flex; flex-direction:column; position:relative; overflow:hidden}
.receipt .k{font-size:13px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--amber-soft)}
.receipt .big{font-family:var(--serif); font-size:clamp(64px,7vw,92px); line-height:1; margin:12px 0 4px; font-variant-numeric:tabular-nums}
.receipt .sub{font-size:14.5px; color:rgba(255,240,215,.7); margin-bottom:26px}
.rows{list-style:none; padding:0; margin:0 0 28px; font-size:15px}
.rows li{display:flex; justify-content:space-between; gap:16px; padding:11px 0; border-top:1px dashed rgba(255,240,215,.22); font-variant-numeric:tabular-nums}
.rows li span:first-child{color:rgba(255,240,215,.75)}
.rows li.tot{border-top:1px solid rgba(255,240,215,.45); font-weight:700; font-size:16.5px}
.rows li.tot span:first-child{color:var(--leaf)}
.receipt .note{font-size:13.5px; color:rgba(255,240,215,.65); margin-top:16px}
.receipt .btn{align-self:flex-start; margin-top:auto}
.bump{animation:bump .35s var(--ease)}
@keyframes bump{0%{transform:translateY(6px); opacity:.4}100%{transform:none; opacity:1}}
@media (max-width:900px){ .est{grid-template-columns:1fr} }

/* pricing */
.tiers{display:grid; grid-template-columns:repeat(4,1fr); gap:16px}
.tier{border-radius:var(--r); border:1px solid var(--line); background:var(--white); padding:30px 26px; display:flex; flex-direction:column; transition:transform .35s var(--ease), box-shadow .35s var(--ease), border-color .3s}
.tier:hover{transform:translateY(-4px); box-shadow:0 26px 50px -34px rgba(18,48,31,.5); border-color:var(--line-2)}
.tier .sz{font-size:13px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--muted)}
.tier .amt{font-family:var(--serif); font-size:58px; line-height:1; color:var(--green); margin:16px 0 4px}
.tier .amt.txt{font-size:40px; line-height:1.1; margin-top:22px; margin-bottom:12px}
.tier .from{font-size:14px; color:var(--muted)}
.tier ul{list-style:none; padding:0; margin:22px 0 26px; flex:1}
.tier li{font-size:15px; color:var(--text); padding:9px 0; border-top:1px solid var(--line)}
.tier a{font-weight:700; font-size:15px; color:var(--amber-ink); text-decoration:none; display:inline-flex; gap:8px; align-items:center}
.tier a svg{width:15px; height:15px; transition:transform .25s}
.tier a:hover svg{transform:translateX(4px)}
.tier.dark{background:var(--green); border-color:var(--green)}
.tier.dark .sz, .tier.dark .from{color:rgba(255,240,215,.7)}
.tier.dark .amt{color:var(--leaf)}
.tier.dark li{color:var(--leaf); border-color:rgba(255,240,215,.16)}
.tier.dark a{color:var(--amber-soft)}
.save{display:flex; flex-wrap:wrap; gap:12px; margin-top:22px; align-items:center}
.save .pill{padding:10px 16px; border-radius:999px; background:var(--cream-2); font-size:14.5px; color:var(--green)}
.save .pill b{color:var(--amber-ink)}
.fine{font-size:14px; color:var(--muted); margin-left:auto}
@media (max-width:1060px){ .tiers{grid-template-columns:repeat(2,1fr)} .fine{margin-left:0} }
@media (max-width:560px){ .tiers{grid-template-columns:1fr} }

/* promise */
.promise{display:grid; grid-template-columns:1fr 1.1fr; gap:clamp(32px,5vw,72px); align-items:center}
.promise .pic{border-radius:var(--r); overflow:hidden; aspect-ratio:1/1}
.promise .pic img{width:100%; height:100%; object-fit:cover}
.promise h2{font-size:clamp(40px,5vw,62px); margin:16px 0 20px}
.promise > div > p{color:var(--muted); font-size:18px; max-width:48ch}
.plist{list-style:none; padding:0; margin:34px 0 0; display:grid; gap:4px}
.plist li{display:grid; grid-template-columns:52px 1fr; gap:18px; padding:20px 0; border-top:1px solid var(--line)}
.plist .ic{width:52px; height:52px; border-radius:16px; background:var(--cream-2); color:var(--amber-ink); display:grid; place-items:center}
.plist .ic svg{width:24px; height:24px}
.plist b{display:block; font-family:var(--serif); font-weight:500; font-size:24px; color:var(--green); margin-bottom:4px; line-height:1.15}
.plist span{color:var(--muted); font-size:15.5px}
.facts{display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:28px}
.facts div{background:var(--white); border:1px solid var(--line); border-radius:var(--r-sm); padding:16px}
.facts b{display:block; font-family:var(--serif); font-size:26px; font-weight:500; color:var(--green); line-height:1.1}
.facts span{font-size:13.5px; color:var(--muted)}
@media (max-width:900px){ .promise{grid-template-columns:1fr} .promise .pic{aspect-ratio:4/3} }
@media (max-width:520px){ .facts{grid-template-columns:1fr} }

/* commercial */
.comm{border-radius:calc(var(--r) + 8px); background:var(--green-deep); color:var(--leaf); overflow:hidden; display:grid; grid-template-columns:1fr 1fr}
.comm .txt{padding:clamp(32px,5vw,64px)}
.comm .eyebrow{color:var(--amber-soft)}
.comm h2{color:var(--leaf); font-size:clamp(36px,4.4vw,56px); margin:16px 0 18px}
.comm p{color:rgba(255,240,215,.75); max-width:44ch}
.chips{display:flex; flex-wrap:wrap; gap:8px; margin:26px 0 30px; padding:0; list-style:none}
.chips li{padding:8px 14px; border-radius:999px; border:1px solid rgba(255,240,215,.25); font-size:14px}
.comm ul.c2{list-style:none; padding:0; margin:0 0 32px; display:grid; grid-template-columns:1fr 1fr; gap:14px 24px}
.comm ul.c2 li{font-size:15px; color:rgba(255,240,215,.85); padding-left:26px; position:relative}
.comm ul.c2 li::before{content:""; position:absolute; left:2px; top:7px; width:11px; height:6px; border-left:2px solid var(--amber); border-bottom:2px solid var(--amber); transform:rotate(-45deg)}
.comm .img{min-height:420px; position:relative}
.comm .img img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover}
.comm small{display:block; margin-top:12px; font-size:13.5px; color:rgba(255,240,215,.6)}
@media (max-width:900px){ .comm{grid-template-columns:1fr} .comm .img{min-height:300px; order:-1} }
@media (max-width:520px){ .comm ul.c2{grid-template-columns:1fr} }

/* faq */
.faq{display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(32px,5vw,80px); align-items:start}
.faq .side{position:sticky; top:120px}
.faq .side h2{font-size:clamp(40px,5vw,64px); margin:16px 0 18px}
.faq .side p{color:var(--muted)}
.faq .side a{color:var(--amber-ink); font-weight:700}
.qa{border-top:1px solid var(--line-2)}
.qa details{border-bottom:1px solid var(--line-2)}
.qa summary{list-style:none; cursor:pointer; display:flex; justify-content:space-between; gap:20px; align-items:center; padding:24px 0; font-family:var(--serif); font-size:clamp(21px,2vw,25px); color:var(--green); line-height:1.25}
.qa summary::-webkit-details-marker{display:none}
.qa summary:hover{color:var(--amber-ink)}
.qa .pm{width:34px; height:34px; border-radius:50%; flex-shrink:0; border:1.5px solid var(--line-2); display:grid; place-items:center; transition:transform .3s var(--ease), background-color .3s, border-color .3s}
.qa .pm svg{width:12px; height:12px}
.qa details[open] .pm{transform:rotate(45deg); background:var(--green); border-color:var(--green); color:var(--leaf)}
.qa .a{padding:0 56px 26px 0; color:var(--muted); font-size:16.5px; max-width:62ch}
@media (max-width:900px){ .faq{grid-template-columns:1fr} .faq .side{position:static} }

/* quote */
.quote{background:var(--cream-2)}
.q-grid{display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(32px,5vw,72px); align-items:start}
.q-grid h2{font-size:clamp(40px,5vw,64px); margin:16px 0 18px}
.q-grid > div > p{color:var(--muted); font-size:18px; max-width:42ch}
.q-steps{list-style:none; padding:0; margin:34px 0; display:grid; gap:14px; counter-reset:q}
.q-steps li{display:flex; gap:16px; align-items:center; font-size:16px; color:var(--green); counter-increment:q}
.q-steps li::before{content:counter(q); width:38px; height:38px; flex-shrink:0; border-radius:50%; background:var(--white); border:1px solid var(--line-2); display:grid; place-items:center; font-family:var(--serif); font-size:19px; color:var(--amber-ink)}
.contact{display:flex; flex-direction:column; gap:4px; padding:20px 22px; border-radius:var(--r-sm); background:var(--white); border:1px solid var(--line)}
.contact small{font-size:12.5px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--muted)}
.contact a{font-family:var(--serif); font-size:22px; color:var(--green); text-decoration:none; overflow-wrap:anywhere}
.form{background:var(--white); border-radius:var(--r); padding:clamp(24px,3.4vw,40px); border:1px solid var(--line); box-shadow:0 40px 80px -60px rgba(18,48,31,.5)}
.form form{display:grid; grid-template-columns:1fr 1fr; gap:16px}
.fld{display:flex; flex-direction:column; gap:7px; min-width:0}
.fld.full{grid-column:1/-1}
.fld label{font-size:13.5px; font-weight:700; color:var(--green)}
.fld label i{font-style:normal; font-weight:500; color:var(--muted)}
input, select, textarea{font:500 16px/1.3 var(--sans); color:var(--text); width:100%; padding:14px 16px; border-radius:14px; border:1.5px solid var(--line-2); background:var(--cream); transition:border-color .2s, box-shadow .2s}
input:focus, select:focus, textarea:focus{outline:none; border-color:var(--green); box-shadow:0 0 0 4px rgba(210,124,45,.18)}
textarea{min-height:110px; resize:vertical}
.form .foot{grid-column:1/-1; display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin-top:4px}
.form .foot small{font-size:13.5px; color:var(--muted)}
.ok{display:none; grid-column:1/-1; padding:16px 18px; border-radius:14px; background:rgba(28,66,47,.07); color:var(--green); font-size:15px}
.ok.show{display:block}
@media (max-width:900px){ .q-grid{grid-template-columns:1fr} }
@media (max-width:560px){ .form form{grid-template-columns:1fr} }

/* careers */
.join{display:flex; justify-content:space-between; align-items:center; gap:28px; flex-wrap:wrap; padding:clamp(28px,4vw,48px); border-radius:var(--r); border:1.5px dashed var(--line-2)}
.join h2{font-size:clamp(32px,3.6vw,44px); margin:12px 0 10px}
.join p{color:var(--muted); max-width:56ch}

/* footer */
footer{background:var(--green); color:rgba(255,240,215,.72); padding:clamp(64px,8vw,96px) 0 32px; position:relative; overflow:hidden}
footer .big{display:flex; align-items:center; gap:clamp(16px,2vw,26px); margin-bottom:56px}
footer .big .mark{width:clamp(72px,9vw,112px); height:auto; box-shadow:0 0 0 1px rgba(255,240,215,.18); border-radius:24%}
footer .big .w1{font-family:var(--serif); font-size:clamp(46px,7vw,92px); line-height:.95; color:var(--leaf); letter-spacing:-.02em}
footer .big .w2{font-family:var(--sans); font-weight:700; font-size:clamp(34px,5.4vw,72px); line-height:1; color:var(--amber); letter-spacing:-.02em}
.fgrid{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:32px; padding-top:40px; border-top:1px solid rgba(255,240,215,.14)}
.fgrid h4{font:700 12.5px/1 var(--sans); letter-spacing:.14em; text-transform:uppercase; color:var(--leaf); margin:0 0 16px}
.fgrid ul{list-style:none; padding:0; margin:0; display:grid; gap:10px; font-size:15px}
.fgrid a{text-decoration:none}
.fgrid a:hover{color:var(--leaf)}
.fgrid p{font-size:15px; max-width:32ch}
.fbot{display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-top:48px; font-size:13.5px}
footer .ghost{position:absolute; right:-80px; bottom:-140px; width:440px; opacity:.05; transform:rotate(-14deg); pointer-events:none}
@media (max-width:860px){ .fgrid{grid-template-columns:1fr 1fr} .fgrid > :first-child{grid-column:1/-1} }

/* reveal */
.js [data-r]{opacity:0; transform:translateY(22px); transition:opacity .8s var(--ease), transform .8s var(--ease); transition-delay:calc(var(--i,0)*90ms)}
.js [data-r].in{opacity:1; transform:none}
@media (prefers-reduced-motion:reduce){ *,*::before,*::after{animation:none!important; transition:none!important} html{scroll-behavior:auto} .js [data-r]{opacity:1; transform:none} }

/* ===== v2 upgrades ===== */
.progress{position:absolute; left:0; bottom:-1px; height:2px; width:100%; background:linear-gradient(90deg,var(--amber),#E9A866); transform-origin:left; transform:scaleX(0)}
.marquee:hover .track{animation-play-state:paused}

/* before / after */
.ba-wrap{display:grid; grid-template-columns:.75fr 1.25fr; gap:clamp(32px,5vw,72px); align-items:center}
.ba-wrap h2{font-size:clamp(40px,5vw,64px); margin:16px 0 18px}
.ba-wrap > div > p{color:var(--muted); font-size:18px; max-width:40ch}
.ba-points{list-style:none; padding:0; margin:28px 0 0; display:grid; gap:12px}
.ba-points li{display:flex; gap:12px; align-items:flex-start; color:var(--green); font-size:16px}
.ba-points svg{width:20px; height:20px; flex-shrink:0; margin-top:2px; color:var(--amber)}
.ba{position:relative; aspect-ratio:3/2; border-radius:var(--r); overflow:hidden; user-select:none; touch-action:pan-y; box-shadow:0 40px 80px -48px rgba(18,48,31,.6); --pos:50%; cursor:ew-resize; background:var(--cream-2)}
.ba img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; pointer-events:none}
.ba .after{clip-path:inset(0 0 0 var(--pos))}
.ba .bar{position:absolute; top:0; bottom:0; left:var(--pos); width:3px; margin-left:-1.5px; background:var(--leaf); box-shadow:0 0 0 1px rgba(18,48,31,.12)}
.ba .knob{position:absolute; top:50%; left:var(--pos); width:58px; height:58px; margin:-29px 0 0 -29px; border-radius:50%; background:var(--green); color:var(--leaf); display:grid; place-items:center; box-shadow:0 10px 26px -8px rgba(0,0,0,.45), 0 0 0 4px rgba(255,240,215,.9); transition:transform .2s}
.ba:hover .knob, .ba.drag .knob{transform:scale(1.07)}
.ba .knob svg{width:26px; height:26px}
.ba .lab{position:absolute; top:18px; padding:7px 14px; border-radius:999px; font-size:12.5px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px)}
.ba .lb{left:18px; background:rgba(18,48,31,.62); color:var(--leaf)}
.ba .la{right:18px; background:rgba(254,247,233,.86); color:var(--green)}
.ba input{position:absolute; inset:0; width:100%; height:100%; opacity:0; cursor:ew-resize; margin:0}
.ba input:focus-visible ~ .knob{outline:3px solid var(--amber); outline-offset:3px}
.ba-cap{font-size:13px; color:var(--muted); margin-top:12px}
@media (max-width:900px){ .ba-wrap{grid-template-columns:1fr} }

/* price factors */
.factors{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:22px}
.factor{padding:22px 22px 24px; border-radius:var(--r-sm); background:var(--cream-2)}
.factor b{display:block; font-family:var(--serif); font-weight:500; font-size:22px; color:var(--green); margin-bottom:6px; line-height:1.15}
.factor span{font-size:15px; color:var(--muted)}
.factors-h{display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap; align-items:end; margin-top:56px}
.factors-h h3{font-size:clamp(28px,3vw,36px)}
.factors-h p{color:var(--muted); max-width:56ch; font-size:16px}
@media (max-width:1000px){ .factors{grid-template-columns:repeat(2,1fr)} }
@media (max-width:520px){ .factors{grid-template-columns:1fr} }

/* reviews */
.rev{display:grid; grid-template-columns:1fr 1fr; gap:22px; align-items:stretch}
.rev-l{border-radius:var(--r); background:var(--green); color:var(--leaf); padding:clamp(28px,4vw,52px); position:relative; overflow:hidden; display:flex; flex-direction:column}
.rev-l h2{color:var(--leaf); font-size:clamp(36px,4.4vw,56px); margin:16px 0 18px}
.rev-l p{color:rgba(255,240,215,.78); max-width:42ch}
.rev-l .eyebrow{color:var(--amber-soft)}
.rev-l .stars{display:flex; gap:6px; margin-top:auto; padding-top:36px; color:var(--amber)}
.rev-l .stars svg{width:30px; height:30px}
.rev-l .ghost{position:absolute; right:-60px; bottom:-80px; width:280px; opacity:.06; transform:rotate(-12deg)}
.rev-f{border-radius:var(--r); background:var(--white); border:1px solid var(--line); padding:clamp(24px,3.4vw,40px)}
.rev-f h3{font-size:30px; margin-bottom:18px}
.rev-f form{display:grid; grid-template-columns:1fr 1fr; gap:14px}
.rating{grid-column:1/-1; display:flex; flex-direction:row-reverse; justify-content:flex-end; gap:4px; border:0; padding:0; margin:0}
.rating legend{font-size:13.5px; font-weight:700; color:var(--green); margin-bottom:8px; float:left; width:100%}
.rating input{position:absolute; opacity:0; width:1px; height:1px}
.rating label{cursor:pointer; color:rgba(28,66,47,.2); transition:color .15s, transform .15s}
.rating label svg{width:34px; height:34px; display:block}
.rating input:checked ~ label, .rating label:hover, .rating label:hover ~ label{color:var(--amber)}
.rating label:hover{transform:scale(1.1)}
.rating input:focus-visible + label{outline:2px solid var(--amber); outline-offset:2px; border-radius:6px}
.consent{grid-column:1/-1; display:flex; gap:10px; align-items:flex-start; font-size:14.5px; color:var(--muted); cursor:pointer}
.consent input{width:18px; height:18px; margin-top:2px; accent-color:var(--green); flex-shrink:0}
@media (max-width:900px){ .rev{grid-template-columns:1fr} }
@media (max-width:560px){ .rev-f form{grid-template-columns:1fr} }

/* careers */
.car{display:grid; grid-template-columns:1fr 1fr; gap:clamp(32px,5vw,72px); align-items:start}
.car h2{font-size:clamp(40px,5vw,64px); margin:16px 0 18px}
.car > div > p{color:var(--muted); font-size:18px; max-width:46ch}
.car-cols{display:grid; grid-template-columns:1fr 1fr; gap:28px; margin-top:34px}
.car-cols h4{font:700 13px/1.2 var(--sans); letter-spacing:.12em; text-transform:uppercase; color:var(--amber-ink); margin:0 0 6px}
.car-cols dl{margin:0}
.car-cols dt{font-weight:700; color:var(--green); font-size:16px; padding-top:14px; border-top:1px solid var(--line); margin-top:12px}
.car-cols dd{margin:4px 0 0; color:var(--muted); font-size:15px}
.hire{display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:34px}
.hire div{background:var(--cream-2); border-radius:var(--r-sm); padding:18px}
.hire b{display:block; font-family:var(--serif); font-style:italic; font-size:30px; color:var(--amber); line-height:1; margin-bottom:8px}
.hire strong{display:block; color:var(--green); font-size:16px; margin-bottom:4px}
.hire span{font-size:14px; color:var(--muted)}
.chk-group{display:flex; flex-wrap:wrap; gap:8px}
@media (max-width:900px){ .car{grid-template-columns:1fr} }
@media (max-width:560px){ .car-cols, .hire{grid-template-columns:1fr} }

/* copy email */
.copy{font:700 13px/1 var(--sans); color:var(--amber-ink); background:transparent; border:1.5px solid var(--line-2); padding:8px 12px; border-radius:999px; cursor:pointer; align-self:flex-start; margin-top:8px; transition:border-color .2s}
.copy:hover{border-color:var(--amber-ink)}

/* mobile bar + top button */
.mbar{position:fixed; left:12px; right:12px; bottom:calc(12px + env(safe-area-inset-bottom,0px)); z-index:45; display:none; align-items:center; justify-content:space-between; gap:12px; padding:10px 10px 10px 18px; border-radius:999px; background:var(--green); color:var(--leaf); box-shadow:0 18px 40px -14px rgba(18,48,31,.7); transform:translateY(140%); transition:transform .4s var(--ease)}
.mbar.show{transform:none}
.mbar span{font-size:13.5px; line-height:1.25}
.mbar b{color:var(--amber-soft)}
.mbar .btn{padding:12px 18px; font-size:14px; flex-shrink:0}
@media (max-width:760px){ .mbar{display:flex} footer{padding-bottom:110px} }
.totop{position:fixed; right:24px; bottom:24px; z-index:44; width:50px; height:50px; border-radius:50%; border:0; background:var(--green); color:var(--leaf); display:grid; place-items:center; cursor:pointer; box-shadow:0 14px 30px -12px rgba(18,48,31,.7); opacity:0; visibility:hidden; transform:translateY(14px); transition:opacity .3s, transform .3s var(--ease), visibility 0s .3s, background-color .2s}
.totop.show{opacity:1; visibility:visible; transform:none; transition:opacity .3s, transform .3s var(--ease), background-color .2s}
.totop:hover{background:var(--amber)}
.totop svg{width:18px; height:18px; transform:rotate(-90deg)}
@media (max-width:760px){ .totop{display:none} }

/* ===== multi-page ===== */
.logo .w2{font-family:var(--serif); font-size:18px; margin-top:2px; font-weight:500; letter-spacing:-.015em; line-height:1}
.logo .w1{line-height:1}
footer .big .w2{font-family:var(--serif); font-weight:500; font-size:clamp(32px,4.9vw,64px); line-height:1; margin-top:4px; letter-spacing:-.02em}
@media (max-width:420px){ .logo .w2{font-size:16px} }
/* mobile menu */
.mob{display:block !important; position:absolute; left:0; right:0; top:100%; height:var(--mh, calc(100dvh - var(--hb, 120px))); background:var(--cream); border-top:1px solid var(--line); overflow-y:auto; overscroll-behavior:contain; opacity:0; visibility:hidden; clip-path:inset(0 0 100% 0); transition:clip-path .45s cubic-bezier(.7,0,.2,1), opacity .3s ease, visibility 0s linear .45s; padding:0}
.mob.open{opacity:1; visibility:visible; clip-path:inset(0 0 0 0); transition:clip-path .5s cubic-bezier(.7,0,.2,1), opacity .2s ease, visibility 0s}
.mob-in{display:flex; flex-direction:column; min-height:100%; padding-top:22px; padding-bottom:calc(28px + env(safe-area-inset-bottom,0px))}
.mob-k{font-size:12.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); margin-bottom:6px}
.mob-list{display:flex; flex-direction:column}
.mob .mi{display:flex; align-items:center; justify-content:space-between; gap:16px; padding:16px 0; border:0; border-bottom:1px solid var(--line); text-decoration:none; font-family:var(--serif); font-size:clamp(28px,8vw,36px); line-height:1.1; color:var(--green); opacity:0; transform:translateY(14px); transition:opacity .4s ease, transform .5s var(--ease), color .2s}
.mob .mi svg{width:20px; height:20px; color:var(--amber); flex-shrink:0; transition:transform .25s var(--ease)}
.mob .mi:hover svg, .mob .mi:active svg{transform:translateX(4px)}
.mob .mi[aria-current=page]{color:var(--amber-ink)}
.mob .mi[aria-current=page] span::after{content:""; display:inline-block; width:7px; height:7px; border-radius:50%; background:var(--amber); margin-left:10px; vertical-align:middle}
.mob-foot{margin-top:auto; padding-top:28px; display:flex; flex-direction:column; gap:12px; opacity:0; transform:translateY(14px); transition:opacity .4s ease, transform .5s var(--ease)}
.mob-foot .btn{justify-content:center; padding:18px 24px; font-size:16px}
.mob-foot p{font-size:14.5px; color:var(--muted); text-align:center}
.mob-foot p b{color:var(--amber-ink)}
.mob-mail{text-align:center; font-size:14.5px; font-weight:700; color:var(--green); text-decoration:none}
.mob.open .mi, .mob.open .mob-foot{opacity:1; transform:none; transition-delay:calc(.12s + var(--d,0) * 45ms)}
body.menu-open{overflow:hidden}
body.menu-open .mbar{transform:translateY(140%)}
body.menu-open header{background:var(--cream); border-bottom-color:var(--line)}
@media (min-width:981px){ .mob{display:none !important} }
/* hamburger -> X */
.menu .bars{position:relative; width:18px; height:12px; display:block}
.menu .bars i{position:absolute; left:0; width:18px; height:1.8px; border-radius:2px; background:currentColor; transition:transform .35s var(--ease), opacity .2s, top .35s var(--ease)}
.menu .bars i:nth-child(1){top:0} .menu .bars i:nth-child(2){top:5.1px} .menu .bars i:nth-child(3){top:10.2px}
.menu[aria-expanded=true]{background:var(--green); color:var(--leaf); border-color:var(--green)}
.menu[aria-expanded=true] .bars i:nth-child(1){top:5.1px; transform:rotate(45deg)}
.menu[aria-expanded=true] .bars i:nth-child(2){opacity:0}
.menu[aria-expanded=true] .bars i:nth-child(3){top:5.1px; transform:rotate(-45deg)}
.menu{transition:background-color .25s, color .25s, border-color .25s}

footer .big{justify-content:center; text-align:left}
footer .big .fleaf{width:clamp(78px,9.4vw,116px); height:auto; aspect-ratio:100/106; flex-shrink:0; overflow:visible}
.links a[aria-current=page]{background:rgba(28,66,47,.08)}
.mob a[aria-current=page]{color:var(--amber-ink)}
.phero{padding:clamp(48px,7vw,96px) 0 clamp(40px,5vw,64px); position:relative; overflow:hidden}
.phero .ghost{position:absolute; right:-80px; top:-60px; width:420px; color:var(--amber); opacity:.07; transform:rotate(12deg); pointer-events:none}
.phero h1{font-size:clamp(50px,7.4vw,100px); margin:20px 0 22px; max-width:13ch}
.phero h1 em{font-style:italic; color:var(--amber)}
.phero .lead{font-size:clamp(18px,1.6vw,20.5px); color:var(--muted); max-width:52ch}
.phero .ticks{margin-top:30px}
.crumbs{display:flex; gap:8px; align-items:center; font-size:14px; color:var(--muted); margin-bottom:22px}
.crumbs a{color:var(--green); text-decoration:none; font-weight:500}
.crumbs a:hover{color:var(--amber-ink)}
.ph-grid{display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(32px,5vw,72px); align-items:center}
.ph-img{border-radius:22%/21%; overflow:hidden; aspect-ratio:1/1; box-shadow:0 40px 80px -40px rgba(18,48,31,.55)}
.ph-img img{width:100%; height:100%; object-fit:cover}
@media (max-width:900px){ .ph-grid{grid-template-columns:1fr} .ph-img{max-width:460px; aspect-ratio:4/3; border-radius:var(--r)} }

/* home CTA band */
.ctab{border-radius:calc(var(--r) + 8px); background:var(--green); color:var(--leaf); padding:clamp(36px,5vw,72px); display:grid; grid-template-columns:1.3fr 1fr; gap:36px; align-items:center; position:relative; overflow:hidden}
.ctab .ghost{position:absolute; right:-40px; bottom:-90px; width:340px; color:var(--leaf); opacity:.06; transform:rotate(-12deg)}
.ctab h2{color:var(--leaf); font-size:clamp(40px,5vw,66px); margin:14px 0 16px}
.ctab p{color:rgba(255,240,215,.78); max-width:46ch; font-size:18px}
.ctab .eyebrow{color:var(--amber-soft)}
.ctab .side{display:flex; flex-direction:column; gap:14px; align-items:flex-start; position:relative}
.ctab .side small{color:rgba(255,240,215,.65); font-size:14px}
.ctab ol{list-style:none; padding:0; margin:0 0 10px; display:grid; gap:10px; counter-reset:c}
.ctab ol li{display:flex; gap:12px; align-items:center; counter-increment:c; font-size:15.5px}
.ctab ol li::before{content:counter(c); width:30px; height:30px; flex-shrink:0; border-radius:50%; border:1px solid rgba(255,240,215,.3); display:grid; place-items:center; font-family:var(--serif); color:var(--amber-soft)}
@media (max-width:860px){ .ctab{grid-template-columns:1fr} }

/* quote page */
.qp{display:grid; grid-template-columns:1.35fr .9fr; gap:22px; align-items:start}
.qp .form form{display:block}
.qp .form{box-shadow:0 40px 80px -60px rgba(18,48,31,.5)}
.fs{border:0; padding:0; margin:0 0 30px; display:grid; grid-template-columns:1fr 1fr; gap:16px}
.fs legend{grid-column:1/-1; font-family:var(--serif); font-size:28px; color:var(--green); margin-bottom:6px; padding:0; display:flex; align-items:center; gap:12px}
.fs legend span{width:32px; height:32px; border-radius:50%; background:var(--cream-2); display:inline-grid; place-items:center; font-family:var(--sans); font-size:14px; font-weight:700; color:var(--amber-ink)}
.fs + .fs{padding-top:30px; background:linear-gradient(var(--line),var(--line)) top/100% 1px no-repeat}
.grp2{grid-column:1/-1}
.grp2 > .lbl{display:block; font-size:13.5px; font-weight:700; color:var(--green); margin-bottom:10px}
.qside{position:sticky; top:104px; display:flex; flex-direction:column; gap:16px}
.qside .receipt{min-height:0}
.qside .first{display:flex; justify-content:space-between; gap:12px; align-items:center; margin-top:-8px; margin-bottom:6px; padding:12px 14px; border-radius:14px; background:rgba(210,124,45,.16); font-size:14.5px}
.qside .first b{font-family:var(--serif); font-size:22px; font-weight:500; color:var(--amber-soft)}
.infocard{border-radius:var(--r); padding:26px 26px 28px; background:var(--white); border:1px solid var(--line)}
.infocard h3{font-size:26px; margin:12px 0 10px}
.infocard p{color:var(--muted); font-size:15.5px}
.infocard.dark{background:var(--green); border-color:var(--green)}
.infocard.dark h3{color:var(--leaf)}
.infocard.dark p{color:rgba(255,240,215,.78)}
.infocard.dark .eyebrow{color:var(--amber-soft)}
.mini-faq details{border-top:1px solid var(--line)}
.mini-faq summary{list-style:none; cursor:pointer; padding:14px 0; font-weight:700; color:var(--green); font-size:15.5px; display:flex; justify-content:space-between; gap:12px}
.mini-faq summary::-webkit-details-marker{display:none}
.mini-faq summary::after{content:"+"; font-weight:500; color:var(--amber-ink); font-size:20px; line-height:1}
.mini-faq details[open] summary::after{content:"–"}
.mini-faq p{padding:0 0 14px; font-size:15px; color:var(--muted)}
@media (max-width:980px){ .qp{grid-template-columns:1fr} .qside{position:static} }
@media (max-width:560px){ .fs{grid-template-columns:1fr} }

/* careers page */
.cards2{display:grid; grid-template-columns:1fr 1fr; gap:22px}
.lcard{border-radius:var(--r); padding:clamp(26px,3.4vw,40px); background:var(--white); border:1px solid var(--line)}
.lcard h3{font-size:34px; margin-bottom:8px}
.lcard .item{display:grid; grid-template-columns:44px 1fr; gap:16px; padding:18px 0; border-top:1px solid var(--line)}
.lcard .item:first-of-type{margin-top:16px}
.lcard .ic{width:44px; height:44px; border-radius:14px; background:var(--cream-2); color:var(--amber-ink); display:grid; place-items:center}
.lcard .ic svg{width:22px; height:22px}
.lcard b{display:block; color:var(--green); font-size:17px; margin-bottom:2px}
.lcard span{color:var(--muted); font-size:15px}
.apply-grid{display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(32px,5vw,72px); align-items:start}
.apply-grid h2{font-size:clamp(40px,5vw,64px); margin:16px 0 18px}
.apply-grid > div > p{color:var(--muted); font-size:18px; max-width:40ch}
@media (max-width:900px){ .cards2, .apply-grid{grid-template-columns:1fr} }

/* wordmark: "Cleaning" centred under "Maple Co" (same fonts) */
.logo .w, footer .big .w{align-items:center; text-align:center}
footer .big>div{text-align:center}

/* hero: Home / Office switch */
.seg{display:flex; align-items:center; gap:22px; margin-bottom:22px}
.seg svg{width:16px; height:18px; color:var(--amber); margin-right:-6px}
.seg button{font:700 13px/1 var(--sans); letter-spacing:.14em; text-transform:uppercase; color:var(--muted); background:none; border:0; border-bottom:2px solid transparent; padding:6px 0; cursor:pointer; transition:color .25s var(--ease), border-color .25s var(--ease)}
.seg button[aria-pressed="true"]{color:var(--amber-ink); border-bottom-color:var(--amber)}
.seg button:not([aria-pressed="true"]):hover{color:var(--green)}
.hero-photo img{transition:opacity .35s var(--ease), transform 1.6s var(--ease)}
.hero-photo img.swap{opacity:0}
/* service areas */
.areas{margin-top:18px; display:flex; flex-direction:column; gap:10px}
.areas b{font-family:var(--serif); font-weight:500; font-size:20px; color:var(--green)}
.areas ul{display:flex; flex-wrap:wrap; gap:8px; margin:0; padding:0; list-style:none}
.areas li{font-size:14.5px; font-weight:500; color:var(--green); background:var(--white); border:1px solid var(--line); border-radius:999px; padding:7px 14px}
.areas span{font-size:13.5px; color:var(--muted)}

/* smoother cards: the reveal delay and slow fade no longer apply once a card has appeared */
.js [data-r].rdy{transition-delay:0s}
.js .card[data-r].rdy{transition:transform .45s var(--ease), box-shadow .45s var(--ease)}
.card .ph img{transition:transform .7s var(--ease)}
@media (hover:hover){
  .js .card[data-r].rdy:hover{transform:translateY(-6px); box-shadow:0 30px 60px -36px rgba(18,48,31,.5)}
  .card .ph img{will-change:transform}
}
.card{contain:layout paint}
@media (max-width:900px){ header{backdrop-filter:none; -webkit-backdrop-filter:none; background:rgba(254,247,233,.97)} }
/* wordmark: "Cleaning" smaller than "Maple Co", whole block no taller than the leaf mark */
.logo .mark{width:44px; height:47px}
.logo .w{gap:3px}
.logo .w1{font-size:25px; line-height:1}
.logo .w2{font-size:14px; line-height:1; margin-top:0; letter-spacing:0}
footer .big .w1{font-size:clamp(44px,6.4vw,84px); line-height:.95}
footer .big .w2{font-size:clamp(25px,3.6vw,47px); line-height:1; margin-top:6px; letter-spacing:0}
@media (max-width:420px){ .logo .w1{font-size:22px} .logo .w2{font-size:12.5px} .logo .mark{width:38px; height:40.6px} }

.logo .w1{font-size:23px} .logo .w2{font-size:13px}
footer .big .w1{font-size:clamp(40px,5.8vw,76px)} footer .big .w2{font-size:clamp(22px,3.2vw,42px)}
@media (max-width:420px){ .logo .w1{font-size:20px} .logo .w2{font-size:11.5px} }

/* leaf a little bigger than the wording beside it */
.logo .mark{width:52px; height:55.5px}
footer .big .fleaf{width:clamp(108px,13.5vw,156px)}
@media (max-width:420px){ .logo .mark{width:46px; height:49px} }

/* lockup v3: name sits left-aligned beside the leaf and fills its height */
.logo{gap:9px}
.logo .w, footer .big .w, footer .big > div{display:flex; flex-direction:column; align-items:flex-start; text-align:left; gap:0}
.logo .mark{width:52px; height:55.5px}
.logo .w1{font-size:32px; line-height:.9; letter-spacing:-.015em}
.logo .w2{font-size:17.5px; line-height:1; margin-top:2px; margin-left:.06em; letter-spacing:0}
footer .big{gap:clamp(13px,2.1vw,25px); align-items:center}
footer .big .fleaf{width:clamp(84px,13.5vw,156px)}
footer .big .w1{font-size:clamp(52px,8.3vw,96px); line-height:.9; letter-spacing:-.015em}
footer .big .w2{font-size:clamp(28px,4.5vw,52px); line-height:1; margin-top:clamp(3px,.5vw,6px); margin-left:.06em; letter-spacing:0}
@media (max-width:420px){ .logo{gap:8px} .logo .mark{width:44px; height:47px} .logo .w1{font-size:27px} .logo .w2{font-size:14.5px; margin-top:1.5px} }
.logo .w2{margin-top:3px}
footer .big .w2{margin-top:clamp(5px,.8vw,9px)}
@media (max-width:420px){ .logo .w2{margin-top:2.5px} }

/* ===== final polish: navigation, mobile quote bar, interactions, forms ===== */
html{-webkit-tap-highlight-color:transparent; scroll-padding-top:86px}
:root{accent-color:var(--green)}
/* navigation */
.nav{transition:height .3s var(--ease)}
header.scrolled{box-shadow:0 10px 30px -22px rgba(18,48,31,.55)}
header.scrolled .nav{height:66px}
.links a{position:relative}
.links a::after{content:""; position:absolute; left:14px; right:14px; bottom:5px; height:2px; border-radius:2px; background:var(--amber); transform:scaleX(0); transform-origin:left; transition:transform .3s var(--ease)}
.links a:hover::after, .links a.on::after, .links a[aria-current=page]::after{transform:scaleX(1)}
.links a.on{color:var(--amber-ink)}
.announce a{white-space:nowrap}
@media (max-width:480px){ .announce{font-size:clamp(11.5px,3.25vw,13.5px); padding:8px 10px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis} }
/* buttons and tappable things */
.btn{-webkit-user-select:none; user-select:none}
.btn:active{transform:translateY(0) scale(.97); box-shadow:none; transition-duration:.08s}
.opt span{transition:border-color .2s, background-color .2s, color .2s, transform .15s var(--ease)}
.opt:active span{transform:scale(.96)}
.menu:active, .totop:active{transform:scale(.94)}
.qa summary{transition:color .2s}
.fgrid a, .contact a{transition:color .2s}
@media (hover:hover){
  .tier a:hover, .card .go:hover{color:var(--amber-ink)}
  .qa summary:hover{padding-left:4px}
  .qa summary{transition:color .2s, padding-left .25s var(--ease)}
}
/* forms */
input, select, textarea{transition:border-color .2s, box-shadow .2s, background-color .2s}
@media (hover:hover){ input:hover, select:hover, textarea:hover{border-color:var(--green)} }
input:focus, select:focus, textarea:focus{outline:none; background:var(--white); border-color:var(--green); box-shadow:0 0 0 2px var(--white), 0 0 0 5px rgba(210,124,45,.42)}
.fld:focus-within > label{color:var(--amber-ink)}
.fld label{transition:color .2s}
input:user-invalid, textarea:user-invalid, input.bad{border-color:#B4442B; box-shadow:0 0 0 4px rgba(180,68,43,.14)}
.fld .hint{font-size:13px; color:#B4442B; font-weight:600; display:none}
.fld.err .hint{display:block}
input::placeholder, textarea::placeholder{color:var(--muted); opacity:.7}
select{cursor:pointer}
/* mobile conversion */
@media (max-width:760px){
  .btn{min-height:50px}
  .nav .btn, .mbar .btn{min-height:44px}
  .form .foot .btn, #qForm .foot .btn, .ctab .btn, .receipt .btn{width:100%; justify-content:center}
  .hero .btn, #hC1, #hC2{justify-content:center}
  .mbar{left:10px; right:10px; padding:9px 9px 9px 18px}
  .mbar .btn{padding:13px 20px; font-size:14.5px}
  .mbar span{min-width:0}
  .mbar b.price{font-family:var(--serif); font-weight:500; font-size:21px; color:var(--leaf); letter-spacing:-.01em}
  body.typing .mbar{transform:translateY(140%)}
  .totop{bottom:calc(88px + env(safe-area-inset-bottom,0px)); right:14px; width:44px; height:44px}
}
@media (max-width:480px){ .announce .xl{display:none} .announce{text-overflow:clip} }
.mbar span{white-space:nowrap}
.logo .w1, .logo .w2, .nav .btn{white-space:nowrap}
.logo{flex-shrink:0}
@media (max-width:400px){ .nav{gap:10px} .logo{gap:7px} .logo .mark{width:40px; height:42.7px} .logo .w1{font-size:24px} .logo .w2{font-size:13px} .nav .btn{padding:11px 13px; font-size:13px} .menu{width:40px; height:40px} .mbar{padding-left:15px; gap:8px} .mbar span{font-size:12.5px} .mbar .btn{padding:13px 15px; font-size:13.5px} }
/* smaller name beside the leaf (header and footer) */
.logo .w1{font-size:27px} .logo .w2{font-size:15px; margin-top:3px}
footer .big .w1{font-size:clamp(38px,6vw,70px)} footer .big .w2{font-size:clamp(21px,3.3vw,38px); margin-top:clamp(4px,.6vw,7px)}
@media (max-width:420px){ .logo .w1{font-size:23px} .logo .w2{font-size:12.5px; margin-top:2.5px} }
@media (max-width:400px){ .logo .w1{font-size:21.5px} .logo .w2{font-size:12px} }

/* promise panel (replaces the before/after slider) */
.pledge{background:var(--white); border:1px solid var(--line); border-radius:var(--r); padding:clamp(26px,4.4vw,60px); box-shadow:0 40px 80px -60px rgba(18,48,31,.5); position:relative; overflow:hidden}
.pledge::before{content:""; position:absolute; left:0; top:0; bottom:0; width:6px; background:var(--amber)}
.pr-top{display:flex; justify-content:space-between; align-items:flex-start; gap:clamp(20px,4vw,56px)}
.pledge h2{font-size:clamp(34px,4.6vw,60px); line-height:1.04; margin:16px 0 16px; max-width:20ch; text-wrap:balance}
.pledge h2 em{color:var(--amber); font-style:italic}
.pr-top p{color:var(--muted); font-size:18px; max-width:46ch; margin:0}
.pr-seal{flex-shrink:0; display:flex; flex-direction:column; align-items:center; gap:12px; text-align:center; font-size:12.5px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--amber-ink); line-height:1.35}
.pr-seal svg{width:clamp(72px,8vw,104px); height:auto; border-radius:24%; box-shadow:0 18px 34px -18px rgba(18,48,31,.6)}
.pr-list{list-style:none; padding:0; margin:clamp(26px,3.6vw,44px) 0 0; display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(16px,2.4vw,32px); border-top:1px solid var(--line); padding-top:clamp(22px,3vw,36px)}
.pr-list li{display:flex; gap:12px; align-items:flex-start}
.pr-list svg{width:22px; height:22px; flex-shrink:0; margin-top:2px; color:var(--amber)}
.pr-list b{display:block; color:var(--green); font-size:17px; margin-bottom:4px}
.pr-list span{color:var(--muted); font-size:15.5px; line-height:1.45}
.pr-cta{display:flex; align-items:center; gap:18px; flex-wrap:wrap; margin-top:clamp(26px,3.4vw,40px)}
.pr-cta span{color:var(--muted); font-size:14.5px}
@media (max-width:760px){ .pr-list{grid-template-columns:1fr} .pr-seal{display:none} .pr-top p{font-size:17px} .pr-cta .btn{width:100%; justify-content:center} }

/* two-line menu button */
.menu .bars{height:10px}
.menu .bars i:nth-child(2){display:none}
.menu .bars i:nth-child(1){top:1px} .menu .bars i:nth-child(3){top:8px; width:12px}
.menu[aria-expanded=true] .bars i:nth-child(1){top:4.5px; transform:rotate(45deg)}
.menu[aria-expanded=true] .bars i:nth-child(3){top:4.5px; width:18px; transform:rotate(-45deg)}
@media (hover:hover){ .menu:hover .bars i:nth-child(3){width:18px} .menu:hover{border-color:var(--green)} }
.menu .bars i{transition:transform .35s var(--ease), opacity .2s, top .35s var(--ease), width .25s var(--ease)}
/* mobile menu, green panel */
.mob{background:var(--green); background-image:radial-gradient(120% 55% at 100% 0, rgba(255,240,215,.09), transparent 70%); border-top:0}
body.menu-open header{border-bottom-color:transparent}
.mob-in{padding-top:26px}
.mob-k{color:var(--amber-soft); opacity:.9; margin-bottom:2px}
.mob .mi{color:var(--leaf); border-bottom:1px solid rgba(255,240,215,.14); padding:15px 0; font-size:clamp(26px,7.2vw,34px)}
.mob .mi:last-child{border-bottom:0}
.mob .mi span{display:block; min-width:0}
.mob .mi small{display:block; font-family:var(--sans); font-size:13.5px; font-weight:500; line-height:1.3; letter-spacing:0; color:rgba(254,247,233,.62); margin-top:6px}
.mob .mi svg{width:40px; height:40px; padding:10px; border-radius:50%; border:1.5px solid rgba(255,240,215,.26); color:var(--amber-soft); transition:transform .25s var(--ease), background-color .2s, border-color .2s, color .2s}
.mob .mi:hover svg, .mob .mi:active svg{transform:none; background:var(--amber); border-color:var(--amber); color:#fff}
.mob .mi:active{opacity:.85}
.mob .mi[aria-current=page], .mob a[aria-current=page]{color:var(--amber-soft)}
.mob .mi[aria-current=page] span::after{display:none}
.mob-foot{border-top:1px solid rgba(255,240,215,.14); padding-top:22px; margin-top:auto}
.mob-foot p{color:rgba(254,247,233,.72)} .mob-foot p b{color:var(--amber-soft)}
.mob-mail{color:var(--leaf)}

/* ===== max pass: readable colours, bigger tap areas, small refinements ===== */
:root{--amber-ink:#9C5213; --amber-btn:#B2621A; --amber-btn-h:#9C5213; --amber-d:#C4701F}
.btn-amber{background:var(--amber-btn)}
.btn-amber:hover{background:var(--amber-btn-h); box-shadow:0 14px 28px -14px rgba(156,82,19,.7)}
.hero h1 em, .phero h1 em, .pledge h2 em, h1 em, h2 em{color:var(--amber-d)}
.dark h2 em, .how h2 em, footer em{color:var(--amber-soft)}
.announce a{display:inline-block; padding:6px 2px; margin:-6px 0}
.fgrid ul{gap:2px}
.fgrid li a, .fgrid a{display:inline-block; padding:7px 0}
.fbot a{display:inline-block; padding:8px 0}
.tier a{padding:10px 0; margin:-4px 0}
.crumbs a{display:inline-block; padding:9px 0}
.seg button{padding:12px 0}
.copy{padding:12px 16px}
.contact a{display:inline-block; padding:6px 0}
.card .go, .lnk{padding:8px 0}
@media (max-width:760px){ .fgrid ul{gap:0} .fgrid li a, .fgrid a{padding:11px 0} .mob-mail{padding:10px 0} }
.rev-l .note{margin-top:auto; padding-top:32px; display:flex; align-items:center; gap:12px; color:var(--amber-soft); font-size:14.5px; font-weight:600}
.rev-l .note svg{width:22px; height:22px; flex-shrink:0}
.ok .copyreq{font:700 14px/1.25 var(--sans); text-align:center; margin:12px 0 0; display:inline-flex; align-items:center; background:var(--green); color:var(--leaf); border:0; border-radius:999px; padding:13px 18px; cursor:pointer}
.ok .copyreq:active{transform:scale(.97)}

/* quote-first pricing: summary card and pricing guide */
.qcard .qsum{font-family:var(--serif); font-size:clamp(28px,3.4vw,38px); line-height:1.1; color:var(--leaf); margin:10px 0 14px; letter-spacing:-.01em}
.qcard .rows li span:last-child{text-align:right; max-width:60%}
.qcard .guide{font-size:14.5px; line-height:1.5; color:rgba(254,247,233,.78); margin:16px 0 20px; padding:12px 14px; border-radius:14px; background:rgba(255,240,215,.08)}
.qcard .guide b{color:var(--leaf); font-weight:700}
.qcard .btn{align-self:stretch; justify-content:center}
.pguide{display:grid; grid-template-columns:1.25fr 1fr; gap:clamp(16px,2.4vw,28px); align-items:stretch}
.pg-list{background:var(--white); border:1px solid var(--line); border-radius:var(--r); padding:clamp(22px,3vw,36px)}
.pg-list h3, .pg-cta h3{font-size:clamp(24px,2.6vw,30px); margin:0 0 14px}
.pg-list ul{list-style:none; margin:0; padding:0}
.pg-list li{display:flex; justify-content:space-between; align-items:baseline; gap:16px; padding:14px 0; border-top:1px solid var(--line); font-size:16.5px; color:var(--green)}
.pg-list li span:first-child{font-weight:600}
.pg-list li span:last-child{color:var(--muted); text-align:right; font-variant-numeric:tabular-nums}
.pg-list p{font-size:13.5px; color:var(--muted); margin:14px 0 0; line-height:1.5}
.pg-cta{background:var(--green); color:var(--leaf); border-radius:var(--r); padding:clamp(22px,3vw,36px); display:flex; flex-direction:column}
.pg-cta .eyebrow{color:var(--amber-soft)} .pg-cta .eyebrow svg{color:var(--amber-soft)}
.pg-cta h3{color:var(--leaf); margin-top:14px}
.pg-cta ul{list-style:none; margin:0 0 24px; padding:0; display:grid; gap:12px}
.pg-cta li{display:flex; gap:10px; align-items:flex-start; font-size:15.5px; line-height:1.4; color:rgba(254,247,233,.86)}
.pg-cta li svg{width:20px; height:20px; flex-shrink:0; margin-top:1px; color:var(--amber-soft)}
.pg-cta .btn{margin-top:auto; justify-content:center}
.save{margin-top:clamp(18px,2.4vw,28px)}
@media (max-width:860px){ .pguide{grid-template-columns:1fr} .pg-list li{flex-direction:column; gap:2px; align-items:flex-start} .pg-list li span:last-child{text-align:left} }

/* welcome bonus strip (quiet promo) */
.welcome{display:flex; align-items:center; justify-content:space-between; gap:clamp(18px,3vw,40px); flex-wrap:wrap; margin-top:clamp(18px,2.4vw,28px); padding:clamp(20px,2.8vw,32px); border-radius:var(--r); background:var(--parch,#FAEEDA); border:1px dashed rgba(156,82,19,.45)}
.welcome h3{font-size:clamp(24px,2.6vw,30px); margin:10px 0 8px}
.welcome p{margin:0; color:var(--muted); font-size:16px; max-width:56ch}
.wl-t{flex:1 1 320px; min-width:0}
.wl-a{display:flex; flex-direction:column; gap:10px; align-items:flex-start}
.wl-a small{font-size:13px; color:var(--muted)}
.opt.first{display:flex} .opt.first span{white-space:normal; line-height:1.35; border-radius:16px; text-align:left}
@media (max-width:760px){ .wl-a{width:100%} .wl-a .btn{width:100%; justify-content:center} }

/* no-price layout: factors first, wide quote band */
.fh{font-size:clamp(22px,2.4vw,28px); margin:0 0 16px}
.pg-cta.wide{margin-top:clamp(18px,2.4vw,28px); display:grid; grid-template-columns:auto 1fr auto; grid-template-areas:"e l b" "h l b"; column-gap:clamp(20px,4vw,56px); align-items:center}
.pg-cta.wide .eyebrow{grid-area:e; align-self:end} .pg-cta.wide h3{grid-area:h; align-self:start; margin-bottom:0}
.pg-cta.wide ul{grid-area:l; margin:0} .pg-cta.wide .btn{grid-area:b; margin-top:0}
@media (max-width:900px){ .pg-cta.wide{display:flex} .pg-cta.wide ul{margin:16px 0 22px} }

.callbtn{justify-content:center}
.pg-cta .callbtn{margin-top:10px}
.pg-cta.wide .btn.callbtn{grid-area:auto}
.calllink{font-weight:700; color:var(--green); font-size:15px; padding:6px 0}
.mob-call{font-size:16px}
[hidden]{display:none !important}
@media (max-width:900px){ .pg-cta.wide .eyebrow, .pg-cta.wide h3{align-self:flex-start} }

/* quote-or-call design: quick form on the home page, call buttons */
.ctab{align-items:start}
.ctab > div > ol{margin-top:26px}
.quick{background:var(--white); color:var(--text); border-radius:var(--r); padding:clamp(20px,2.6vw,30px); display:flex; flex-direction:column; gap:14px; width:100%; box-shadow:0 30px 60px -40px rgba(0,0,0,.6)}
.quick h3{font-size:clamp(24px,2.4vw,28px); color:var(--green); margin:0 0 2px}
.quick .k2{display:grid; grid-template-columns:1fr 1fr; gap:12px}
.quick .btn{justify-content:center; width:100%}
.quick small{font-size:13.5px; color:var(--muted); line-height:1.45}
.quick small a{color:var(--amber-ink); font-weight:700}
.ctab .side .quick small{color:var(--muted)}
.quick .ok{margin:0}
@media (max-width:420px){ .quick .k2{grid-template-columns:1fr} }
.hcall{font-weight:700; font-size:15px; color:var(--green); text-decoration:none; padding:11px 14px; border-radius:999px; border:1.5px solid var(--line-2); white-space:nowrap}
.hcall:hover{border-color:var(--green)}
@media (max-width:560px){ .hcall{display:none !important} }
.mcall{font-weight:700; font-size:14.5px; color:var(--leaf); text-decoration:none; padding:12px 16px; border-radius:999px; border:1.5px solid rgba(255,240,215,.4); flex-shrink:0; order:2}
.mbar .btn{order:3}
.has-phone .mbar span br, .has-phone .mbar span br + *{display:none}
.has-phone .mbar > span{font-size:0; min-width:0; overflow:hidden}
.has-phone .mbar > span b{font-size:13px; white-space:normal; line-height:1.2; display:block}
.has-phone .mbar > span b.price{font-size:18px}
.links a{white-space:nowrap}
.has-phone .links{gap:0} .has-phone .links a{padding:9px 10px} .has-phone .links a::after{left:10px; right:10px}
@media (max-width:1180px){ .has-phone .hcall{font-size:0; padding:11px 12px} .has-phone .hcall::before{content:"Call"; font-size:15px} }

#estimate .welcome{margin-top:clamp(22px,3vw,36px)}

/* Google and Facebook links */
.social{display:flex; gap:10px; flex-wrap:wrap; margin-top:14px}
.social a{display:inline-flex; align-items:center; gap:8px; padding:10px 14px; border-radius:999px; border:1.5px solid rgba(255,240,215,.28); color:var(--leaf); text-decoration:none; font-weight:600; font-size:14.5px; transition:background-color .2s, border-color .2s}
.social a:hover{background:rgba(255,240,215,.1); border-color:rgba(255,240,215,.5)}
.social svg, .fu-links svg{width:18px; height:18px; flex-shrink:0}
.findus{display:flex; align-items:center; justify-content:space-between; gap:clamp(18px,3vw,40px); flex-wrap:wrap; padding:clamp(22px,3vw,36px); border-radius:var(--r); background:var(--white); border:1px solid var(--line)}
.findus h3{font-size:clamp(24px,2.6vw,30px); margin:10px 0 6px}
.findus p{margin:0; color:var(--muted); font-size:16px}
.fu-links{display:flex; gap:10px; flex-wrap:wrap}
.fu-links .btn{gap:10px}
@media (max-width:760px){ .fu-links{width:100%} .fu-links .btn{width:100%; justify-content:center} }

/* where we clean: check my area */
.areacheck{margin-top:8px; padding:16px; border-radius:18px; background:var(--white); border:1px solid var(--line); display:flex; flex-direction:column; gap:10px}
.areacheck label{font-size:15px; font-weight:600; color:var(--green)}
.ac-row{display:flex; gap:10px}
.ac-row input{flex:1; min-width:0}
.ac-row .btn{flex-shrink:0; padding:14px 20px}
@media (max-width:520px){ .ac-row{flex-direction:column} .ac-row .btn{width:100%; justify-content:center} }

/* coming soon strip */
.soon{display:flex; align-items:center; gap:clamp(14px,2.4vw,28px); flex-wrap:wrap; margin-top:clamp(16px,2vw,24px); padding:clamp(18px,2.4vw,26px) clamp(18px,2.6vw,30px); border-radius:var(--r); border:1px dashed var(--line-2); background:transparent}
.tagsoon{font-size:12px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--amber-ink); background:var(--parch,#FAEEDA); border:1px solid rgba(156,82,19,.3); padding:7px 12px; border-radius:999px; white-space:nowrap}
.soon-t{flex:1 1 300px; min-width:0}
.soon h3{font-size:clamp(22px,2.3vw,26px); margin:0 0 4px}
.soon p{margin:0; color:var(--muted); font-size:15.5px}
.soon + .incl{margin-top:clamp(16px,2vw,24px)}
@media (max-width:760px){ .soon .btn{width:100%; justify-content:center} }

/* footer "Find us" column (appears when a link is set) */
.fgrid:has(.fsocial:not([hidden])){grid-template-columns:1.3fr 1fr 1fr 1.15fr .8fr}
@media (max-width:1000px){ .fgrid:has(.fsocial:not([hidden])){grid-template-columns:1fr 1fr 1fr} .fgrid:has(.fsocial:not([hidden])) > :first-child{grid-column:1/-1} }
@media (max-width:860px){ .fgrid:has(.fsocial:not([hidden])){grid-template-columns:1fr 1fr} }
.fu-links{max-width:560px; justify-content:flex-end}

a.float{text-decoration:none; cursor:pointer; transition:transform .25s var(--ease), box-shadow .25s}
a.float:hover{transform:translateY(-3px)}
a.float .v{white-space:nowrap}

/* quote badge styled like the photo-checked badge */
.f2.f2b{flex-direction:row; align-items:center; gap:12px; padding:16px 18px}
.f2.f2b .ic{background:var(--green); color:var(--leaf)}
a.float.f2b:hover .ic{background:var(--green-2,#16382A)}
.f2.f2b b{display:block; font-size:15px; color:var(--green); white-space:nowrap}
.f2.f2b span span{font-size:13.5px; color:var(--muted); white-space:nowrap}

/* quote badge v3: green card, cream words, orange arrow that invites a tap */
.f2.f2b{background:var(--green); gap:16px; padding:14px 14px 14px 22px; border-radius:999px; box-shadow:0 22px 44px -18px rgba(18,48,31,.75), 0 0 0 4px rgba(254,247,233,.9)}
.f2.f2b b{font-family:var(--serif); font-weight:500; font-size:24px; line-height:1.05; color:var(--leaf); letter-spacing:-.01em}
.f2.f2b span span{font-size:13px; color:var(--amber-soft); margin-top:3px; display:block}
.f2.f2b .ic{order:2; width:46px; height:46px; border-radius:50%; background:var(--amber-btn); color:#fff; position:relative; transition:transform .25s var(--ease), background-color .2s}
.f2.f2b .ic svg{width:20px; height:20px}
.f2.f2b .ic::after{content:""; position:absolute; inset:0; border-radius:50%; border:2px solid var(--amber); opacity:0; animation:qring 2.6s ease-out infinite}
@keyframes qring{0%{transform:scale(1); opacity:.7} 70%,100%{transform:scale(1.55); opacity:0}}
a.float.f2b:hover .ic{background:var(--amber); transform:translateX(3px)}
a.float.f2b:active{transform:scale(.97)}
@media (prefers-reduced-motion:reduce){ .f2.f2b .ic::after{animation:none} }
@media (max-width:420px){ .f2.f2b{padding:11px 11px 11px 18px; gap:12px} .f2.f2b b{font-size:21px} .f2.f2b .ic{width:40px; height:40px} }

/* quote badge v4: finer finish */
.f2.f2b{background:linear-gradient(135deg,#27573D 0%,#1C422F 55%,#163827 100%); gap:18px; padding:13px 13px 13px 24px; box-shadow:0 26px 50px -18px rgba(18,48,31,.8), 0 0 0 3px rgba(254,247,233,.95), inset 0 1px 0 rgba(255,255,255,.14)}
.f2.f2b b{font-size:27px; line-height:1}
.f2.f2b b em{font-style:italic; color:#EDB171}
.f2.f2b span span{color:rgba(254,247,233,.86); font-size:13.5px; margin-top:5px; letter-spacing:.005em}
.f2.f2b .ic{width:50px; height:50px; background:linear-gradient(135deg,#D27C2D,#B2621A); box-shadow:0 8px 18px -6px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,255,255,.3)}
.f2.f2b .ic svg{width:22px; height:22px}
a.float.f2b{transition:transform .3s var(--ease), box-shadow .3s}
a.float.f2b:hover{transform:translateY(-4px); box-shadow:0 34px 60px -20px rgba(18,48,31,.85), 0 0 0 3px #fff, inset 0 1px 0 rgba(255,255,255,.14)}
a.float.f2b:hover .ic{background:linear-gradient(135deg,#E08A38,#C4701F); transform:translateX(3px)}
a.float.f2b:focus-visible{outline:3px solid var(--amber); outline-offset:5px}
@media (max-width:420px){ .f2.f2b{padding:10px 10px 10px 18px; gap:12px} .f2.f2b b{font-size:22px} .f2.f2b span span{font-size:12.5px; margin-top:3px} .f2.f2b .ic{width:42px; height:42px} }
.f2.f2b b em{font-size:1.2em; line-height:.9; margin-right:1px}
/* badge v5: clean upright "Free" */
.f2.f2b b em{font-family:var(--sans); font-style:normal; font-weight:800; font-size:1.04em; line-height:1; letter-spacing:-.025em; margin-right:2px}
@media (max-width:340px){ .f2.f2b{gap:9px; padding-left:15px} .f2.f2b b{font-size:19px} .f2.f2b span span{font-size:11.5px} .f2.f2b .ic{width:38px; height:38px} }
#faq p a, .foot a{overflow-wrap:anywhere}
/* footer: Find us always shown, between Services/Company and Contact */
.fgrid{grid-template-columns:1.3fr 1fr 1fr .8fr 1.2fr}
.fgrid .fsocial a:not([href]){cursor:default}
.fgrid .fsocial a:not([href]):hover{color:inherit}
@media (max-width:1000px){
  .fgrid{grid-template-columns:1fr 1fr}
  .fgrid > :first-child, .fgrid > .fsocial, .fgrid > .fsocial + div{grid-column:1/-1}
  .fgrid .fsocial ul{display:flex; flex-wrap:wrap; gap:0 26px}
}
/* badge v6: "Free" in the same font as "quote" */
.f2.f2b b em{font-family:inherit; font-style:normal; font-weight:inherit; font-size:1em; line-height:inherit; letter-spacing:inherit; margin-right:0}
/* badge v7: white card like "Photo-checked", same larger size */
.f2.f2b{background:var(--white); border-radius:22px; padding:14px 14px 14px 22px; box-shadow:0 26px 50px -22px rgba(18,48,31,.55), 0 0 0 1px rgba(28,66,47,.06)}
.f2.f2b b{color:var(--green)}
.f2.f2b b em{color:var(--amber-d)}
.f2.f2b span span{color:var(--muted)}
.f2.f2b .ic{border-radius:15px; box-shadow:0 8px 16px -8px rgba(178,98,26,.7), inset 0 1px 0 rgba(255,255,255,.3)}
.f2.f2b .ic::after{border-radius:15px}
a.float.f2b:hover{box-shadow:0 34px 60px -22px rgba(18,48,31,.6), 0 0 0 1px rgba(28,66,47,.1)}
@media (max-width:420px){ .f2.f2b{border-radius:19px; padding:11px 11px 11px 17px} .f2.f2b .ic, .f2.f2b .ic::after{border-radius:13px} }
/* badge v8: card shape, green again */
.f2.f2b{background:linear-gradient(135deg,#27573D 0%,#1C422F 55%,#163827 100%); box-shadow:0 26px 50px -20px rgba(18,48,31,.8), 0 0 0 3px rgba(254,247,233,.95), inset 0 1px 0 rgba(255,255,255,.12)}
.f2.f2b b{color:var(--leaf)}
.f2.f2b b em{color:#EDB171}
.f2.f2b span span{color:rgba(254,247,233,.86)}
.f2.f2b .ic{box-shadow:0 8px 18px -6px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,255,255,.3)}
a.float.f2b:hover{box-shadow:0 34px 60px -20px rgba(18,48,31,.85), 0 0 0 3px #fff, inset 0 1px 0 rgba(255,255,255,.14)}
/* "Call for a quote" box: same family as the Free quote badge */
.callrow{margin-top:22px}
.callbox{display:inline-flex; align-items:center; gap:16px; padding:13px 26px 13px 13px; border-radius:22px; text-decoration:none; background:linear-gradient(135deg,#27573D 0%,#1C422F 55%,#163827 100%); box-shadow:0 22px 44px -22px rgba(18,48,31,.75), inset 0 1px 0 rgba(255,255,255,.12); transition:transform .3s var(--ease), box-shadow .3s; max-width:100%}
.callbox .ic{width:50px; height:50px; border-radius:15px; display:grid; place-items:center; flex-shrink:0; color:#fff; background:linear-gradient(135deg,#D27C2D,#B2621A); box-shadow:0 8px 18px -6px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,255,255,.3)}
.callbox .ic svg{width:22px; height:22px}
.callbox .tx{display:flex; flex-direction:column; min-width:0}
.callbox b{font-family:var(--serif); font-weight:500; font-size:25px; line-height:1.05; letter-spacing:-.01em; color:var(--leaf); white-space:nowrap}
.callbox b em{font-style:normal; color:#EDB171}
.callbox .tx > span{font-size:14px; margin-top:5px; color:rgba(254,247,233,.86); white-space:nowrap}
.callbox.on .tx > span{font-size:17px; font-weight:700; letter-spacing:.01em; color:#fff; font-variant-numeric:tabular-nums}
.callbox.on:hover{transform:translateY(-3px); box-shadow:0 30px 54px -22px rgba(18,48,31,.85), inset 0 1px 0 rgba(255,255,255,.14)}
.callbox.on:active{transform:scale(.98)}
.callbox:focus-visible{outline:3px solid var(--amber); outline-offset:4px}
.callbox:not(.on){cursor:default}
.callbox.light{background:var(--white); box-shadow:0 22px 44px -22px rgba(0,0,0,.55); margin-top:26px}
.callbox.light b{color:var(--green)} .callbox.light b em{color:var(--amber-d)}
.callbox.light .tx > span{color:var(--muted)} .callbox.light.on .tx > span{color:var(--green)}
@media (max-width:420px){ .callbox{gap:13px; padding:11px 20px 11px 11px; border-radius:19px} .callbox .ic{width:44px; height:44px; border-radius:13px} .callbox b{font-size:22px} }
.hero .callrow{margin:20px 0 4px}
/* call box v2: a pill that sits beside the main button, same height */
.callrow{margin-top:20px}
.callbox{gap:13px; padding:6px 24px 6px 6px; border-radius:999px; min-height:56px; box-shadow:0 14px 30px -16px rgba(18,48,31,.7), inset 0 1px 0 rgba(255,255,255,.12)}
.callbox .ic{width:44px; height:44px; border-radius:50%; box-shadow:0 6px 14px -6px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,255,255,.3)}
.callbox .ic svg{width:19px; height:19px}
.callbox b{font-family:var(--sans); font-weight:700; font-size:15.5px; line-height:1.15; letter-spacing:0; color:var(--leaf)}
.callbox b em{color:inherit}
.callbox .tx > span{font-size:12.5px; margin-top:2px; color:rgba(254,247,233,.8)}
.callbox.on .tx{flex-direction:column-reverse}
.callbox.on b{font-size:12.5px; font-weight:600; color:rgba(254,247,233,.82); margin-top:1px}
.callbox.on .tx > span{font-size:17px; font-weight:700; margin-top:0; color:#fff; line-height:1.15}
.callbox.light{margin-top:28px; box-shadow:0 14px 30px -16px rgba(0,0,0,.6)}
.callbox.light b{color:var(--green)} .callbox.light b em{color:inherit}
.callbox.light.on b{color:var(--muted)} .callbox.light.on .tx > span{color:var(--green)}
.hero .actions{align-items:center; row-gap:14px}
.hero .actions .btn{min-height:56px}
.hlink{flex-basis:100%; font-weight:700; font-size:15px; color:var(--green); text-decoration:underline; text-decoration-color:rgba(28,66,47,.3); text-underline-offset:4px; padding:6px 0; width:fit-content; flex-grow:0}
.hlink:hover{text-decoration-color:var(--amber)}
@media (max-width:420px){ .callbox{gap:13px; padding:6px 22px 6px 6px; border-radius:999px} .callbox .ic{width:44px; height:44px; border-radius:50%} .callbox b{font-size:15.5px} .callbox.on b{font-size:12.5px} }
@media (max-width:560px){ .hero .actions .btn, .hero .actions .callbox{width:100%} .hero .actions .callbox{justify-content:flex-start} }
@media (max-width:560px){ .hero .actions .callbox{justify-content:center; padding-right:50px} }
/* call button v3: matched pair with the main button */
.hero .actions .btn, .hero .actions .callbox{min-height:60px}
.hero .actions .btn-amber{padding-left:30px; padding-right:28px; font-size:16.5px; box-shadow:0 14px 30px -16px rgba(178,98,26,.9), inset 0 1px 0 rgba(255,255,255,.22)}
.callbox{gap:14px; padding:7px 28px 7px 7px; min-height:60px; box-shadow:0 14px 30px -16px rgba(18,48,31,.75), 0 0 0 1px rgba(28,66,47,.08), inset 0 1px 0 rgba(255,255,255,.14)}
.callbox .ic{width:46px; height:46px; position:relative}
.callbox .ic svg{width:20px; height:20px}
.callbox.on .ic::after{content:""; position:absolute; inset:0; border-radius:50%; border:2px solid var(--amber); opacity:0; animation:qring 2.6s ease-out infinite}
.callbox b{font-size:16px}
.callbox.on b{font-size:12.5px; letter-spacing:.01em}
.callbox.on .tx > span{font-size:18.5px; letter-spacing:.015em}
.callbox.on:hover .ic{transform:rotate(-12deg) scale(1.05)}
.callbox .ic{transition:transform .25s var(--ease)}
.callbox.light{box-shadow:0 16px 34px -18px rgba(0,0,0,.65), inset 0 0 0 1px rgba(28,66,47,.06)}
@media (prefers-reduced-motion:reduce){ .callbox.on .ic::after{animation:none} }
@media (max-width:420px){ .callbox{padding:7px 24px 7px 7px} .callbox .ic{width:46px; height:46px} .callbox b{font-size:16px} .callbox.on b{font-size:12.5px} }
@media (max-width:560px){ .hero .actions .callbox{padding-right:53px} }
@media (max-width:360px){ .hero .actions .callbox{padding-right:18px; justify-content:flex-start} .callbox{max-width:100%} .callbox:not(.on) .tx > span{font-size:12px} .callbox b{font-size:15px} }
/* two "coming soon" services side by side */
.soon-grid{display:grid; grid-template-columns:1fr 1fr; gap:clamp(14px,1.8vw,20px); margin-top:clamp(16px,2vw,24px)}
.soon-grid .soon{margin-top:0; flex-direction:column; align-items:flex-start; gap:14px}
.soon-grid .soon-t{flex:1 1 auto}
.soon-grid + .incl{margin-top:clamp(16px,2vw,24px)}
@media (max-width:860px){ .soon-grid{grid-template-columns:1fr} }
/* call chip v4: small and quiet, under the main buttons */
.hero .actions .btn{min-height:0} .hero .actions .btn-amber{padding:17px 26px; font-size:15.5px; box-shadow:none}
.hero .callrow{margin:16px 0 0}
.callbox, .callbox.light{gap:9px; padding:4px 15px 4px 4px; min-height:38px; border-radius:999px; background:var(--white); box-shadow:inset 0 0 0 1.5px rgba(28,66,47,.14); margin-top:0}
.callbox .ic{width:30px; height:30px; box-shadow:none}
.callbox .ic svg{width:14px; height:14px}
.callbox.on .ic::after{display:none}
.callbox .tx, .callbox.on .tx{flex-direction:row; align-items:baseline; gap:7px; flex-wrap:wrap}
.callbox b, .callbox.on b, .callbox.light b, .callbox.light.on b{font-family:var(--sans); font-size:13.5px; font-weight:600; color:var(--muted); margin:0; letter-spacing:0}
.callbox .tx > span, .callbox.light .tx > span{font-size:13px; margin:0; color:var(--muted)}
.callbox.on .tx > span, .callbox.light.on .tx > span{font-size:14.5px; font-weight:700; color:var(--green); letter-spacing:.01em; line-height:1.2}
.callbox.on:hover{transform:none; box-shadow:inset 0 0 0 1.5px var(--green)}
.callbox.on:hover .ic{transform:none}
.ctab .callbox.light{margin-top:24px; box-shadow:none}
@media (max-width:560px){ .hero .actions .callbox, .hero .callrow .callbox{width:auto; padding:4px 15px 4px 4px} }
@media (max-width:420px){ .callbox{padding:4px 14px 4px 4px; gap:9px} .callbox .ic{width:30px; height:30px; border-radius:50%} .callbox b{font-size:13.5px} .callbox.on b{font-size:13.5px} }
@media (max-width:360px){ .hero .actions .callbox{padding-right:14px} .callbox b{font-size:13px} .callbox:not(.on) .tx > span{font-size:12.5px} }
.callbox .tx{row-gap:0; line-height:1.25} .callbox{padding-top:5px; padding-bottom:5px}
.callbox .tx, .callbox.on .tx{flex-wrap:nowrap}
@media (max-width:350px){ .callbox .tx, .callbox.on .tx{flex-wrap:wrap} }
@media (max-width:380px){ .callbox .tx, .callbox.on .tx{flex-wrap:wrap} }
/* four service cards */
@media (min-width:1081px){ .svc{grid-template-columns:repeat(4,1fr); gap:16px} .svc .card .bd{padding:20px 20px 22px} .svc .card h3{font-size:24px} .svc .card p{font-size:15px} }
@media (min-width:901px) and (max-width:1080px){ .svc{grid-template-columns:1fr 1fr} }
/* hero buttons back to their natural width on phones; call link stays underneath */
@media (max-width:560px){ .hero .actions .btn{width:auto} .hero .actions{flex-direction:column; align-items:flex-start} }
/* call link: green phone icon */
.callbox .ic{background:linear-gradient(135deg,#27573D,#1C422F); color:var(--leaf)}
/* Free quote badge: no cream outline, green right to the edge */
.f2.f2b{box-shadow:0 26px 50px -20px rgba(18,48,31,.8), inset 0 1px 0 rgba(255,255,255,.12)}
a.float.f2b:hover{box-shadow:0 34px 60px -20px rgba(18,48,31,.85), inset 0 1px 0 rgba(255,255,255,.14)}