:root{
  --lime:#C8E000; --ink:#0b0d0a; --ink2:#141812; --bone:#f4f5ef; --mute:#b7bbad; --line:rgba(255,255,255,.14);
  --display:"Barlow Condensed","Arial Narrow",Impact,sans-serif; --body:"Inter",system-ui,sans-serif;
  --notch:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,12px 100%,0 calc(100% - 12px));
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--body);font-weight:500;background:var(--ink);color:var(--bone);line-height:1.5;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,video{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
ul{list-style:none}
button{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--lime);outline-offset:3px}
.wrap{width:min(1180px,100% - 40px);margin-inline:auto}
h1,h2,h3,h4{font-family:var(--display);font-weight:800;text-transform:uppercase;line-height:.95;letter-spacing:.01em}
h2{font-size:clamp(2.3rem,5.4vw,4.2rem)}
.stars{color:var(--lime);letter-spacing:.1em}

.btn{display:inline-flex;align-items:center;justify-content:center;font:800 1.1rem var(--display);letter-spacing:.08em;text-transform:uppercase;padding:16px 28px;border:0;background:var(--lime);color:var(--ink);cursor:pointer;clip-path:var(--notch);transition:background .15s}
.btn:hover{background:#fff}
.btn:disabled{opacity:.6;cursor:default}
.btn.sm{padding:11px 18px;font-size:.95rem}

/* nav */
.nav{position:sticky;top:0;z-index:50;background:rgba(11,13,10,.86);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;height:68px}
.nav img{height:50px;width:auto}
.nav-r{display:flex;align-items:center;gap:22px}
.menu{display:flex;gap:30px;margin:0 auto 0 44px;font-size:.95rem;font-weight:700}
.menu a:hover{color:var(--lime)}
.burger{display:none}
section[id]{scroll-margin-top:68px}
.nav-call{font:800 1.5rem var(--display);letter-spacing:.03em;display:flex;align-items:center;gap:10px}
.nav-call span{font:700 .7rem var(--body);background:var(--lime);color:var(--ink);padding:3px 7px;letter-spacing:.04em}
.nav-call:hover{color:var(--lime)}

/* hero: the footage is the pitch, the form is the only thing asked of the visitor */
.hero{position:relative;min-height:calc(100svh - 68px);display:grid;align-items:end;overflow:hidden;isolation:isolate}
.hero-media{position:absolute;inset:0;z-index:-2;width:100%;height:100%}
.hero-media img,video.hero-media{width:100%;height:100%;object-fit:cover}
video.hero-media{opacity:0;transition:opacity .8s}
video.hero-media.on{opacity:1}
.hero:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(11,13,10,.25) 0%,rgba(11,13,10,.1) 40%,rgba(11,13,10,.88) 100%),linear-gradient(90deg,rgba(11,13,10,.6),transparent 60%)}
.hero-grid{display:grid;grid-template-columns:1fr 380px;gap:48px;align-items:end;padding-block:64px 56px}
.hero h1{font-size:clamp(3.6rem,10vw,8rem);text-shadow:0 2px 30px rgba(0,0,0,.45)}
.hero h1 span{display:block}
.hero h1 .l2{width:max-content;max-width:100%;margin-top:.06em}
.hero h1 .l2 span{background:var(--lime);color:var(--ink);text-shadow:none;padding:.04em .14em 0;margin-left:-.06em;clip-path:var(--notch)}
/* One page-load moment: the line rises, then the lime block stamps across. */
.hero h1 .l1{animation:rise .6s cubic-bezier(.2,.8,.2,1) .15s backwards}
.hero h1 .l2 span{animation:stamp .5s cubic-bezier(.7,0,.2,1) .6s backwards}
@keyframes rise{from{opacity:0;transform:translateY(40%)}}
@keyframes stamp{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
.live{display:inline-flex;align-items:center;gap:9px;margin-bottom:14px;padding:6px 12px 6px 10px;font-size:.85rem;font-weight:700;background:rgba(11,13,10,.7);backdrop-filter:blur(8px)}
.live i{width:10px;height:10px;border-radius:50%;background:var(--lime);box-shadow:0 0 0 0 rgba(200,224,0,.7);animation:ping 1.6s infinite}
@keyframes ping{to{box-shadow:0 0 0 12px rgba(200,224,0,0)}}
.hero-cta{display:none}
.proofs{display:flex;flex-wrap:wrap;gap:8px}
.ico{width:18px;height:18px;flex:none;vertical-align:-3px}
.ico.g{background:#fff;border-radius:50%;padding:3px;width:22px;height:22px;vertical-align:-5px}
.hero .lead{font-size:clamp(1.05rem,1.8vw,1.3rem);margin:16px 0 22px;color:#eef0e6;text-shadow:0 1px 12px rgba(0,0,0,.6)}
.proofline{display:inline-flex;align-items:center;gap:10px;font-size:.95rem;padding:9px 14px;background:rgba(11,13,10,.7);backdrop-filter:blur(8px);border:1px solid var(--line)}
.proofline b{font:800 1.5rem var(--display);line-height:1}
.proofline:hover{border-color:var(--lime)}

/* quote card and forms */
.qcard{background:var(--bone);color:var(--ink);padding:26px 24px 22px;box-shadow:0 30px 80px rgba(0,0,0,.5)}
.qcard h2{font-size:2.2rem;margin-bottom:14px}
.form{display:grid;gap:10px}
.form .two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.form input:not([type=radio]),.form textarea{width:100%;font:500 1rem var(--body);padding:14px 14px;border:2px solid transparent;background:#fff;color:var(--ink);border-radius:0}
.form textarea{min-height:92px;resize:vertical}
.form input:focus,.form textarea:focus{outline:0;border-color:var(--ink)}
.form ::placeholder{color:#6b7163}
.need{border:0;display:flex;flex-wrap:wrap;gap:6px}
.need legend{font-size:.82rem;font-weight:700;margin-bottom:7px;padding:0}
.need label{cursor:pointer}
.need input{position:absolute;opacity:0;pointer-events:none}
.need span{display:block;padding:9px 12px;font-size:.88rem;font-weight:700;background:#fff;border:2px solid transparent}
.need input:checked+span{background:var(--ink);color:var(--lime)}
.need input:focus-visible+span{outline:3px solid var(--lime);outline-offset:2px}
.form .btn{width:100%;margin-top:4px}
.qcard .btn,.pop-form .btn{background:var(--ink);color:var(--lime)}
.qcard .btn:hover,.pop-form .btn:hover{background:#262b21}
.hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.msg{font-size:.88rem;min-height:1.2em}.msg.err{color:#b3261e;font-weight:700}
.ok{display:none;padding:26px 8px;text-align:center}
.ok h3{font-size:2.6rem;margin-bottom:6px}

/* trust strip */
.strip{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 44px;padding:20px;background:var(--ink2);border-block:1px solid var(--line);font-size:.95rem;color:var(--mute)}
.strip li{display:flex;align-items:center;gap:8px}
.strip b{font:800 1.3rem var(--display);text-transform:uppercase;letter-spacing:.03em;color:var(--bone)}
.strip img{height:40px;width:auto}

section{padding:96px 0}
section.hero{padding:0}

/* services: pictures, one label each, tap to ask for that job */
.svc h2,.work h2{margin-bottom:30px}
.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.tile{position:relative;aspect-ratio:4/3;overflow:hidden;border:0;background:var(--ink2);cursor:pointer;text-align:left}
.tile img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.tile:after{content:"";position:absolute;inset:40% 0 0;background:linear-gradient(transparent,rgba(11,13,10,.9))}
.tile span{position:absolute;z-index:1;left:18px;bottom:14px;font:800 clamp(1.4rem,2.4vw,2rem) var(--display);text-transform:uppercase;letter-spacing:.02em;border-bottom:4px solid var(--lime);padding-bottom:2px}
.tile:hover img{transform:scale(1.05)}

/* the 138 ft pine */
section.climb{position:relative;min-height:min(86svh,760px);display:grid;align-items:end;overflow:hidden;isolation:isolate;padding:0 0 64px}
.climb-media{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover}
.climb:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,transparent 30%,rgba(11,13,10,.9))}
.climb .big{font:800 clamp(6rem,22vw,17rem)/.8 var(--display);color:var(--lime);letter-spacing:-.01em;text-shadow:0 4px 40px rgba(0,0,0,.5)}
.climb h2{font-size:clamp(1.5rem,3.2vw,2.5rem);margin:14px 0 24px}

/* before and after */
.ba{position:relative;aspect-ratio:16/9;overflow:hidden;user-select:none;touch-action:pan-y;cursor:ew-resize}
.ba img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ba .top-img{clip-path:inset(0 50% 0 0)}
.ba .handle{position:absolute;top:0;bottom:0;left:50%;width:3px;background:var(--lime);transform:translateX(-50%)}
.ba .handle:after{content:"\2194";position:absolute;top:50%;left:50%;width:54px;height:54px;border-radius:50%;background:var(--lime);color:var(--ink);display:grid;place-items:center;font-size:1.4rem;font-weight:800;transform:translate(-50%,-50%)}
.ba .tag{position:absolute;top:14px;padding:6px 12px;background:rgba(11,13,10,.78);font:800 1.1rem var(--display);text-transform:uppercase;letter-spacing:.06em}
.ba .tag.l{left:14px}.ba .tag.r{right:14px;color:var(--lime)}
.ba input{position:absolute;inset:0;width:100%;height:100%;opacity:0;pointer-events:none}
.ba img{pointer-events:none;-webkit-user-drag:none}
.ba:has(input:focus-visible){outline:3px solid var(--lime);outline-offset:3px}
.gal{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:10px}
.gal img{width:100%;aspect-ratio:4/3;object-fit:cover}

/* reviews */
section.reviews{background:var(--ink2);border-block:1px solid var(--line)}
.rev-grid{display:grid;grid-template-columns:300px 1fr;gap:64px;align-items:center}
.score a:first-child{display:grid;gap:4px}
.score b{font:800 clamp(6rem,12vw,9rem)/.85 var(--display);color:var(--lime)}
.score .stars{font-size:1.5rem}
.score .src{color:var(--mute);display:flex;align-items:center;gap:8px}
.fbrec{display:inline-block;margin-top:18px;font-weight:700;border-bottom:2px solid var(--lime)}
.score a:hover .src,.fbrec:hover{color:var(--lime)}
.fbrec .ico{margin-right:8px;width:22px;height:22px;vertical-align:-5px}
.quotes{display:grid;gap:30px}
.quotes blockquote{font:600 clamp(1.5rem,3vw,2.3rem)/1.12 var(--display);letter-spacing:.005em}
.quotes figcaption{margin-top:8px;color:var(--mute);font-size:.9rem;display:flex;align-items:center;gap:8px}

/* about */
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.about img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}
.about p{font-size:1.15rem;margin:18px 0 26px;color:#dfe2d6;max-width:30em}

/* town pages */
.hero.town{min-height:0}
.hero.town .hero-grid{padding-block:110px 56px}
.hero.town h1{font-size:clamp(2.8rem,6.6vw,5.4rem)}
.list{display:grid;grid-template-columns:1fr 1fr;gap:0 48px;margin-top:8px}
.list li{padding:18px 0;border-top:1px solid var(--line)}
.list b{display:block;font:800 1.5rem var(--display);text-transform:uppercase;letter-spacing:.02em}
.list span{color:var(--mute)}
.towns a{display:block}
.towns a:hover{color:var(--lime)}

/* where we work */
section.areas{background:var(--ink2);border-block:1px solid var(--line)}
.towns.big{margin:26px 0 0;gap:10px}
.towns.big li{font:800 1.6rem var(--display);text-transform:uppercase;letter-spacing:.03em;border-color:rgba(255,255,255,.28)}
.towns.big li>*{padding:12px 20px 10px}
.towns.big a:hover{background:var(--lime);color:var(--ink)}

/* emergency */
section.emerg{position:relative;text-align:center;isolation:isolate;background:url(img/storm-m.webp) center/cover}
.emerg:before{content:"";position:absolute;inset:0;z-index:-1;background:rgba(11,13,10,.82)}
.bignum{display:inline-block;margin:18px 0 10px;font:800 clamp(3rem,11vw,7.5rem)/1 var(--display);color:var(--ink);background:var(--lime);padding:.12em .3em .08em;clip-path:var(--notch)}
.bignum:hover{background:#fff}
.emerg p{color:var(--mute)}

/* final form */
.q-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start}
.towns{display:flex;flex-wrap:wrap;gap:8px;margin:26px 0 34px}
.towns li{border:1px solid var(--line);font-size:.9rem;font-weight:700}
.towns li>*{display:block;padding:8px 14px}
.isa{display:flex;flex-direction:column;gap:6px;width:max-content}
.isa img{height:130px;width:auto}
.isa span{font:800 .95rem var(--display);letter-spacing:.08em;text-transform:uppercase;text-align:center;line-height:1;padding:5px 0 4px;background:var(--lime);color:var(--ink)}
.quote .form input:not([type=radio]),.quote .form textarea{background:var(--ink2);color:var(--bone);border-color:var(--line)}
.quote .form input:focus,.quote .form textarea:focus{border-color:var(--lime)}
.quote .form ::placeholder{color:#8d9285}
.quote .need span{background:var(--ink2);border-color:var(--line)}
.quote .need input:checked+span{background:var(--lime);color:var(--ink);border-color:var(--lime)}
.quote .msg.err{color:#ff8f86}
.quote .ok{border:2px solid var(--lime)}
.quote .ok h3{color:var(--lime)}

footer{padding:28px 0 34px;border-top:1px solid var(--line);font-size:.88rem;color:var(--mute)}
footer .wrap{display:flex;flex-wrap:wrap;gap:8px 28px;align-items:center}
footer .flinks{gap:8px 22px;padding-bottom:18px;margin-bottom:18px;border-bottom:1px solid var(--line);color:var(--bone);font-weight:700}
footer .bp{margin-left:auto}
footer a:hover{color:var(--lime)}

/* phone dock */
.dock{position:fixed;z-index:60;left:0;right:0;bottom:0;display:none;background:var(--lime);color:var(--ink)}
.dock a,.dock button{flex:1;padding:16px;text-align:center;font:800 1.15rem var(--display);letter-spacing:.08em;text-transform:uppercase;border:0;background:none;color:var(--ink);cursor:pointer}
.dock button{border-left:2px solid var(--ink)}

/* quote pop-up */
.pop{position:fixed;inset:0;z-index:100;display:none;place-items:center;padding:16px;background:rgba(5,7,4,.72);backdrop-filter:blur(6px)}
.pop.on{display:grid;animation:fadein .3s}
@keyframes fadein{from{opacity:0}}
.pop-card{position:relative;width:min(820px,100%);max-height:calc(100svh - 32px);overflow:auto;display:grid;grid-template-columns:.85fr 1.15fr;background:var(--bone);color:var(--ink);box-shadow:0 40px 120px rgba(0,0,0,.7)}
.pop .x{position:absolute;z-index:2;right:10px;top:10px;width:40px;height:40px;border:0;background:var(--ink);color:#fff;font-size:1.5rem;line-height:1;cursor:pointer}
.pop-side{position:relative;isolation:isolate;background:url(img/hero-m-hd.webp) 50% 30%/cover;color:var(--bone);display:flex;flex-direction:column;justify-content:flex-end;padding:26px;min-height:300px}
.pop-side:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(11,13,10,.2),rgba(11,13,10,.9))}
.pop-side img{height:84px;width:auto;margin-bottom:auto;align-self:flex-start}
.pop-side h3{font-size:2.5rem;margin-bottom:10px}
.pop-side .call{font:800 1.8rem var(--display);color:var(--lime);letter-spacing:.03em}
.pop-form{padding:30px 28px 24px}
.pop-form h4{font-size:2.2rem;margin-bottom:14px}
.pop-form .fine{margin-top:12px;font-size:.78rem;color:#5c6255;text-align:center}

@media (max-width:900px){
  section{padding:64px 0}
  .nav-call{font-size:0;gap:0}.nav-call span{font-size:.75rem}
  .nav-call:after{content:"Call";font:800 1.25rem var(--display);letter-spacing:.06em;text-transform:uppercase;margin-left:8px}
  /* Phone: the first screen is all footage, one giant line and one button. */
  .hero{min-height:0;--first:calc(100svh - 68px - 56px)}
  .hero-grid{grid-template-columns:1fr;gap:0;padding-block:0 32px}
  .hero-copy{min-height:var(--first);display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;padding-bottom:22px}
  .hero-media{height:var(--first)}
  .hero:after{background:linear-gradient(180deg,rgba(11,13,10,.1) 0%,rgba(11,13,10,0) 34%,rgba(11,13,10,.9) 74%,var(--ink) var(--first))}
  .hero h1{font-size:clamp(4rem,18.5vw,6.4rem)}
  .hero .lead{margin:12px 0 16px}
  .burger{display:grid;gap:5px;width:44px;height:44px;place-content:center;border:0;background:none;cursor:pointer}
  .burger i{display:block;width:24px;height:3px;background:var(--bone)}
  .nav-r{gap:14px}
  .menu{display:none;position:absolute;left:0;right:0;top:68px;margin:0;padding:8px 20px 18px;flex-direction:column;gap:0;background:var(--ink);border-bottom:1px solid var(--line);font:800 1.7rem var(--display);text-transform:uppercase;letter-spacing:.03em}
  .menu a{padding:14px 0;border-top:1px solid var(--line)}
  .nav.open .menu{display:flex}
  .towns.big li{font-size:1.3rem}
  /* Quiet on purpose: footage, the line, one rating. The pinned bar below carries Call and Free quote. */
  .live,.hero .lead,.hero-cta,.proofs .proofline+.proofline,.nav .btn,.pop-form .fine{display:none}
  .hero h1{margin-bottom:14px}
  .proofline{padding:7px 10px;font-size:.82rem;gap:7px;border:0}.proofline b{font-size:1.25rem}
  .hero.town .hero-grid{padding-block:0 32px}
  .hero.town .hero-copy{min-height:62svh}
  .hero.town .hero-media{height:62svh}
  .hero.town h1{font-size:clamp(2.6rem,12vw,4rem)}
  .about-grid{grid-template-columns:1fr;gap:26px}
  .list{grid-template-columns:1fr}
  /* Pop-up becomes a bottom sheet so the footage stays visible above it. */
  .pop{place-items:end stretch;padding:0;background:rgba(5,7,4,.35);backdrop-filter:none}
  .pop.on .pop-card{animation:sheet .45s cubic-bezier(.2,.8,.2,1)}
  @keyframes sheet{from{transform:translateY(100%)}}
  .pop-card{width:100%;max-height:82svh;border-top:5px solid var(--lime);box-shadow:0 -20px 60px rgba(0,0,0,.6)}
  .pop-side{display:none}
  .strip{display:grid;grid-template-columns:1fr 1fr;gap:12px 16px;padding:18px 20px;font-size:.8rem}
  .strip li{display:block;line-height:1.25}.strip b{display:block;font-size:1.1rem}.strip img{display:none}
  .tiles{grid-template-columns:1fr 1fr;gap:6px}
  .tile span{left:12px;bottom:10px}
  .ba{aspect-ratio:4/3}
  .gal{gap:6px;margin-top:6px}
  .rev-grid,.q-grid{grid-template-columns:1fr;gap:36px}
  .form .two{grid-template-columns:1fr}
  .dock{display:flex}
  body{padding-bottom:56px}
  footer .bp{margin-left:0}
  .pop-card{grid-template-columns:1fr}
  .pop-form{padding:20px 18px 18px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .tile img,video.hero-media{transition:none}
  .hero h1 .l1,.hero h1 .l2 span,.live i,.pop.on .pop-card{animation:none}
  .pop.on{animation:none}
}

.q-grid .isa{margin-top:28px}