@font-face{font-family:'Outfit';font-style:normal;font-weight:700;font-display:swap;
  src:url('../fonts/Outfit-Bold.woff2') format('woff2')}
@font-face{font-family:'Outfit';font-style:normal;font-weight:600;font-display:swap;
  src:url('../fonts/Outfit-SemiBold.woff2') format('woff2')}
@font-face{font-family:'DM Sans';font-style:normal;font-weight:400;font-display:swap;
  src:url('../fonts/DMSans-Regular.woff2') format('woff2')}
@font-face{font-family:'DM Sans';font-style:normal;font-weight:500;font-display:swap;
  src:url('../fonts/DMSans-Medium.woff2') format('woff2')}
/* 600 is synthesised from 500; the design only uses it for small uppercase labels. */
@font-face{font-family:'DM Sans';font-style:normal;font-weight:600;font-display:swap;
  src:url('../fonts/DMSans-Medium.woff2') format('woff2')}

/* American Tree Care. Integrity design system, lifted from the Dedicated Roofing theme.
   Same tokens, same components. Accent swap: set --green to the green values noted below. */

:root{
  --bone:#F4F0E8; --card:#FFFFFF; --card-2:#EFEAE0;
  --ink:#1A1714; --ink-2:#403A32; --muted:#6E685E; --faint:#9A9488;
  --line:#E3DCCF; --line-2:#EDE8DE;
  --char:#1A1713; --char-2:#231F19; --char-3:#2C2820; --on-char:#F4F0E8; --on-char-mut:#A9A092; --on-char-line:rgba(244,240,232,.13);
  /* Accent: American Tree Care's own palette, black / brown / green.
     Green carries every interactive element; brown is the structural second. */
  --green:#3E6B34; --green-2:#2F5427; --green-lite:#7CAA63;
  --brown:#6B4A2F; --brown-2:#54392A; --brown-lite:#9A7550;
  --disp:'Outfit',system-ui,sans-serif; --body:'DM Sans',system-ui,sans-serif;
  --wordmark:'Outfit',system-ui,sans-serif;
  --maxw:1280px;
}
/* Committed light-base brand look. Does not flip with the viewer's OS/browser theme
   (like amorroofing.net / ksinglecorp.com, which are always their brand palette). */

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--bone);color:var(--ink);font-family:var(--body);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 30px}
h1,h2,h3,h4{font-family:var(--disp);font-weight:700;letter-spacing:-.025em;line-height:1.03;text-wrap:balance;color:var(--ink)}
.eyebrow{display:inline-flex;align-items:center;gap:9px;font-family:var(--body);font-weight:600;font-size:12.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--green)}
.eyebrow::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--green)}
.pill{display:inline-flex;align-items:center;gap:9px;font-family:var(--body);font-weight:600;font-size:15px;padding:15px 26px;border-radius:100px;transition:.18s;cursor:pointer;white-space:nowrap}
.pill.solid{background:var(--green);color:#fff}
.pill.solid:hover{background:var(--green-2)}
.pill.ghost{border:1.5px solid var(--line);color:var(--ink)}
.pill.ghost:hover{border-color:var(--green);color:var(--green)}
.pill .ar{transition:.18s}.pill:hover .ar{transform:translateX(4px)}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto}}

/* utility bar */
.util{background:var(--char);color:var(--on-char-mut)}
.util .wrap{display:flex;justify-content:space-between;align-items:center;height:40px;font-size:13px;font-weight:500}
.util a{color:var(--on-char)}
.util .r span{color:var(--green-lite);font-weight:600}
@media(max-width:720px){.util .l span.hrs{display:none}}

/* header */
header{position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--bone) 90%,transparent);backdrop-filter:blur(12px);border-bottom:1px solid var(--line-2)}
.nav{display:flex;align-items:center;justify-content:space-between;height:78px}
.brand{display:flex;flex-direction:column;line-height:1}
.brand .b1{font-family:var(--disp);font-weight:700;font-size:21px;letter-spacing:-.01em;color:var(--ink)}
.brand .b1 .k{color:var(--green)}
.brand .b2{font-family:var(--body);font-weight:500;font-size:9px;letter-spacing:.24em;text-transform:uppercase;color:var(--muted);margin-top:4px}
.navlinks{display:flex;gap:30px}
.navlinks a{font-family:var(--body);font-weight:500;font-size:15px;color:var(--ink-2)}
.navlinks a:hover{color:var(--green)}
.navr{display:flex;align-items:center;gap:20px}
.navr .ph{font-family:var(--disp);font-weight:600;font-size:15px;color:var(--ink)}
.navr .ph span{color:var(--green)}
@media(max-width:960px){.navlinks,.navr .ph{display:none}}

/* HERO */
.hero{position:relative;min-height:92vh;display:flex;align-items:center;overflow:hidden}
.hero img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.hero::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(104deg,rgba(18,15,12,.9) 0%,rgba(18,15,12,.66) 46%,rgba(18,15,12,.28) 100%)}
.hero .wrap{position:relative;z-index:2;padding:70px 30px;width:100%}
.badge{display:inline-flex;align-items:center;gap:9px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);backdrop-filter:blur(4px);padding:8px 15px;border-radius:100px;font-family:var(--body);font-weight:600;font-size:12.5px;letter-spacing:.05em;color:#F4F0E8;text-transform:uppercase}
.badge b{color:var(--green-lite)}
.hero h1{color:#fff;font-size:clamp(34px,5vw,60px);max-width:17ch;margin:20px 0 0;line-height:1.02}
.hero p.sub{color:#E4DED3;font-size:clamp(16px,1.7vw,18.5px);max-width:52ch;margin:20px 0 30px;line-height:1.6}
.hero .ctas{display:flex;gap:13px;flex-wrap:wrap;align-items:center}
.hero .micro{margin-top:22px;color:#CFC7B9;font-size:14px}
.hero .stars{margin-top:26px;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.hero .stars .s{color:var(--green-lite);font-size:16px;letter-spacing:2px}
.hero .stars .t{color:#EDE7DB;font-size:14px;font-weight:500}
.hero .badges{margin-top:30px;padding-top:22px;border-top:1px solid rgba(255,255,255,.14);display:flex;gap:10px 26px;flex-wrap:wrap;font-size:13px;font-weight:500;color:#D8D1C4}
.hero .badges b{color:#fff;font-weight:600}
.reveal{opacity:0;transform:translateY(18px);animation:rise .8s cubic-bezier(.2,.7,.2,1) forwards}
.d1{animation-delay:.04s}.d2{animation-delay:.14s}.d3{animation-delay:.24s}.d4{animation-delay:.34s}.d5{animation-delay:.44s}
@keyframes rise{to{opacity:1;transform:none}}

/* sticky sub-hero bar */
.subbar{background:var(--card-2);border-bottom:1px solid var(--line)}
.subbar .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:15px 30px;flex-wrap:wrap}
.subbar .t{font-size:14.5px;font-weight:500;color:var(--ink-2)}
.subbar .t b{color:var(--ink);font-weight:600}
.subbar .a{display:flex;align-items:center;gap:16px}
.subbar .call{font-family:var(--disp);font-weight:600;color:var(--ink)}
.subbar .call span{color:var(--green)}
@media(max-width:720px){.subbar .t{display:none}}

/* sections */
section.blk{padding:100px 0;background:var(--bone)}
section.blk.alt{background:var(--card)}
.sec-head{max-width:64ch}
.sec-head h2{font-size:clamp(30px,4.3vw,48px);margin:14px 0 0}
.sec-head p.lead{color:var(--muted);font-size:19px;margin-top:16px;line-height:1.6}
.sec-top{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;flex-wrap:wrap}

/* SERVICES image cards */
.svcgrid{display:grid;grid-template-columns:1.6fr 1fr 1fr;grid-auto-rows:236px;gap:14px;margin-top:44px}
.scard{position:relative;border-radius:14px;overflow:hidden;display:flex;align-items:flex-end;isolation:isolate}
.scard.big{grid-row:span 2}
.scard img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;transition:.6s}
.scard:hover img{transform:scale(1.05)}
.scard::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(18,15,12,.10) 22%,rgba(18,15,12,.55) 62%,rgba(18,15,12,.90) 100%)}
.scard .c{position:relative;z-index:2;padding:24px;color:#fff;width:100%}
.scard h3{color:#fff;font-size:22px;margin-bottom:6px}
.scard.big h3{font-size:30px}
.scard p{color:#E7E1D6;font-size:13.5px;line-height:1.45;max-width:40ch}
.scard .go{margin-top:13px;display:inline-flex;align-items:center;gap:7px;font-family:var(--disp);font-weight:600;font-size:13.5px;color:#fff}
.scard .go .ar{color:var(--green-lite);transition:.18s}.scard:hover .go .ar{transform:translateX(4px)}
.scard.nophoto{background:var(--char-2)}.scard.nophoto::after{display:none}
.scard.nophoto .c{border:1px solid var(--on-char-line);border-radius:14px;height:100%;display:flex;flex-direction:column;justify-content:flex-end}
@media(max-width:900px){.svcgrid{grid-template-columns:1fr 1fr;grid-auto-rows:210px}.scard.big{grid-row:span 1}}
@media(max-width:560px){.svcgrid{grid-template-columns:1fr}}

/* INSPECTION feature (dark) */
.feat{background:var(--char);color:var(--on-char);padding:100px 0}
.feat .grid{display:grid;grid-template-columns:1fr 1fr;gap:0;align-items:stretch}
.feat .ph{position:relative;min-height:560px;border-radius:14px;overflow:hidden}
.feat .ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.feat .ph .bignum{position:absolute;left:26px;bottom:40px;z-index:2;font-family:var(--disp);font-weight:700;font-size:100px;color:#fff;line-height:.85;letter-spacing:-.04em;text-shadow:0 2px 24px rgba(0,0,0,.45)}
.feat .ph .bignum small{display:block;font-family:var(--body);font-size:13px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--green-lite);margin-top:8px}
.feat .tx{padding:8px 0 8px 60px;display:flex;flex-direction:column;justify-content:center}
.feat .eyebrow{color:var(--green-lite)}.feat .eyebrow::before{background:var(--green-lite)}
.feat h2{color:#fff;font-size:clamp(28px,3.6vw,42px);margin:16px 0 16px}
.feat .intro{color:var(--on-char-mut);font-size:18px;line-height:1.6;margin-bottom:26px}
.steps{display:flex;flex-direction:column}
.step{display:grid;grid-template-columns:auto 1fr;gap:16px;padding:18px 0;border-top:1px solid var(--on-char-line)}
.step:last-child{border-bottom:1px solid var(--on-char-line)}
.step .n{font-family:var(--disp);font-weight:700;font-size:15px;color:var(--green-lite)}
.step .k{font-family:var(--body);font-weight:600;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--on-char-mut);margin-bottom:3px}
.step .t{font-family:var(--disp);font-weight:600;font-size:18px;color:#fff}
.feat .lnk{margin-top:26px;display:inline-flex;align-items:center;gap:9px;color:var(--green-lite);font-family:var(--disp);font-weight:600;font-size:15px}
.feat .lnk:hover{gap:14px}
@media(max-width:880px){.feat .grid{grid-template-columns:1fr}.feat .ph{min-height:340px}.feat .tx{padding:36px 0 0}}

/* CERT grid */
.certs{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);border-radius:14px;overflow:hidden;margin-top:44px;background:var(--card)}
.cert{padding:30px 24px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:6px}
.cert .t{font-family:var(--disp);font-weight:700;font-size:16px;color:var(--ink)}
.cert .s{font-size:12.5px;color:var(--muted);letter-spacing:.02em}
.cert .ic{width:34px;height:34px;border-radius:8px;background:var(--green);opacity:.14;margin-bottom:8px}
@media(max-width:860px){.certs{grid-template-columns:repeat(2,1fr)}}

/* MATERIALS */
.mats{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:44px}
.mcard{position:relative;border-radius:14px;overflow:hidden;min-height:380px;display:flex;align-items:flex-end;isolation:isolate}
.mcard img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;transition:.6s}
.mcard:hover img{transform:scale(1.04)}
.mcard::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(18,15,12,.05) 25%,rgba(18,15,12,.82) 100%)}
.mcard .c{position:relative;z-index:2;padding:26px;color:#fff}
.mcard .k{font-family:var(--body);font-weight:600;font-size:11.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--green-lite)}
.mcard h3{color:#fff;font-size:25px;margin:8px 0 7px}
.mcard p{color:#E7E1D6;font-size:14px;line-height:1.5}
.mcard .go{margin-top:13px;display:inline-flex;align-items:center;gap:7px;font-family:var(--disp);font-weight:600;font-size:13.5px;color:#fff}
.mcard .go .ar{color:var(--green-lite);transition:.18s}.mcard:hover .go .ar{transform:translateX(4px)}
@media(max-width:820px){.mats{grid-template-columns:1fr}.mcard{min-height:280px}}

/* HONEST band */
.honest{background:var(--brown);color:#fff}
.honest .wrap{padding:76px 30px;display:grid;grid-template-columns:auto 1fr;gap:36px;align-items:center}
.honest .mk{font-family:var(--disp);font-weight:700;font-size:96px;line-height:.6;color:rgba(255,255,255,.55)}
.honest .q{font-family:var(--disp);font-weight:700;font-size:clamp(24px,3.3vw,38px);line-height:1.15;letter-spacing:-.02em;max-width:24ch}
.honest .attr{margin-top:14px;font-size:15px;color:rgba(255,255,255,.85)}
@media(max-width:720px){.honest .wrap{grid-template-columns:1fr;gap:12px;padding:54px 30px}.honest .mk{font-size:64px}}

/* REVIEWS band (honest, no fabricated quotes) */
.revs{background:var(--char);color:var(--on-char)}
.revs .wrap{padding:84px 30px;display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.revs .eyebrow{color:var(--green-lite)}.revs .eyebrow::before{background:var(--green-lite)}
.revs h2{color:#fff;font-size:clamp(28px,3.6vw,44px);margin:14px 0 18px}
.revs p{color:var(--on-char-mut);font-size:18px;line-height:1.6;margin-bottom:26px}
.revs .rating{display:flex;align-items:center;gap:14px;margin-bottom:12px}
.revs .rating .s{color:var(--green-lite);font-size:22px;letter-spacing:3px}
.revs .rating .n{font-family:var(--disp);font-weight:700;font-size:20px;color:#fff}
.revs .panel{background:var(--char-2);border:1px solid var(--on-char-line);border-radius:16px;padding:34px}
.revs .panel .big{font-family:var(--disp);font-weight:700;font-size:64px;color:#fff;line-height:1}
.revs .panel .sub{color:var(--on-char-mut);font-size:15px;margin-top:6px}
.revs .panel .row{margin-top:22px;padding-top:20px;border-top:1px solid var(--on-char-line);display:flex;justify-content:space-between;font-size:14px;color:var(--on-char)}
@media(max-width:820px){.revs .wrap{grid-template-columns:1fr;gap:26px}}

/* AREA + FAQ */
.area{display:grid;grid-template-columns:1fr 1.15fr;gap:46px;align-items:center}
.towns{display:flex;flex-wrap:wrap;gap:9px;margin-top:22px}
.towns span{font-weight:500;font-size:14px;padding:8px 15px;border:1px solid var(--line);border-radius:100px;color:var(--ink-2)}
.towns span.hq{border-color:var(--green);color:var(--green)}
.area .ph{border-radius:14px;overflow:hidden;min-height:340px;position:relative}
.area .ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
@media(max-width:820px){.area{grid-template-columns:1fr;gap:24px}}

.faq{margin-top:14px}
details{border-bottom:1px solid var(--line);padding:6px 0}
summary{list-style:none;cursor:pointer;padding:18px 4px;font-family:var(--disp);font-weight:600;font-size:19px;color:var(--ink);display:flex;justify-content:space-between;align-items:center;gap:16px}
summary::-webkit-details-marker{display:none}
summary .pl{color:var(--green);font-size:24px;font-weight:600;transition:.2s}
details[open] summary .pl{transform:rotate(45deg)}
details .a{padding:0 4px 20px;color:var(--muted);font-size:16px;line-height:1.6;max-width:74ch}

/* FINAL CTA */
.final{position:relative;overflow:hidden}
.final img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.final::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,rgba(18,15,12,.94),rgba(18,15,12,.7) 55%,rgba(18,15,12,.4))}
.final .wrap{position:relative;z-index:2;padding:104px 30px;color:#fff}
.final h2{color:#fff;font-size:clamp(32px,4.6vw,56px);max-width:16ch}
.final p{color:#E4DED3;font-size:19px;max-width:46ch;margin:18px 0 30px}
.final .ctas{display:flex;gap:13px;flex-wrap:wrap}
.final .note{margin-top:22px;font-size:13.5px;color:#C6BEB0}

/* FOOTER */
footer{background:var(--char);color:var(--on-char)}
footer .wrap{padding:64px 30px 28px}
.ftop{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:34px;padding-bottom:34px;border-bottom:1px solid var(--on-char-line)}
footer .brand .b1{color:#fff}footer .brand .b2{color:var(--on-char-mut)}
footer .tag{margin-top:15px;font-size:14px;color:var(--on-char-mut);max-width:32ch;line-height:1.55}
footer .col h2{font-family:var(--body);font-weight:600;font-size:11.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--on-char-mut);margin-bottom:14px}
footer .col a,footer .col p{display:block;font-size:14.5px;color:var(--on-char);margin-bottom:9px}
footer .col a:hover{color:var(--green-lite)}
.fbot{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;padding-top:22px;font-size:12.5px;color:var(--on-char-mut)}
@media(max-width:820px){.ftop{grid-template-columns:1fr 1fr}}



/* ---- inner-page components ---- */

.statrow{display:flex;gap:0;margin-top:32px;flex-wrap:nowrap}
.statrow .st{padding-right:18px;margin-right:18px;border-right:1px solid rgba(255,255,255,.22)}
.statrow .st:last-child{border:none;margin:0;padding:0}
.statrow .n{font-family:var(--disp);font-weight:700;font-size:36px;color:#fff;line-height:1;white-space:nowrap}
.statrow .l{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:#CFC7B9;margin-top:5px;max-width:13ch;line-height:1.25}
@media(max-width:720px){.statrow .l{max-width:none}}
.proc{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:44px}
.pstep{background:var(--bone);border:1px solid var(--line);border-radius:14px;padding:26px}
.pstep .n{font-family:var(--disp);font-weight:700;font-size:15px;color:#fff;background:var(--brown);width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center}
.pstep h3{font-size:18px;margin:16px 0 8px}
.pstep p{font-size:14px;color:var(--muted);line-height:1.5}
.whocards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:44px}
.who{background:var(--bone);border:1px solid var(--line);border-radius:14px;padding:26px}
.who .k{font-family:var(--body);font-weight:600;font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--green);margin-bottom:10px}
.who h3{font-size:17px;margin-bottom:8px}
.who p{font-size:14px;color:var(--muted);line-height:1.5}
.co-list{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px}
.co-list span{font-weight:500;padding:12px 19px;border:1px solid var(--line);border-radius:100px;background:var(--card);color:var(--ink-2);font-size:15px}
.co-wrap{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;margin-top:8px}
@media(max-width:900px){.proc,.whocards{grid-template-columns:1fr 1fr}.co-wrap{grid-template-columns:1fr;gap:24px}}
@media(max-width:560px){.proc,.whocards{grid-template-columns:1fr}}
.tldr{background:var(--card);border:1px solid var(--line);border-left:5px solid var(--green);border-radius:14px;padding:26px 32px;display:grid;grid-template-columns:auto 1fr;gap:28px;align-items:start}
.tldr .tag{font-family:var(--disp);font-weight:800;font-size:14px;letter-spacing:.06em;color:var(--green);white-space:nowrap;padding-top:3px}
.tldr ul{list-style:none;display:flex;flex-direction:column;gap:11px}
.tldr li{position:relative;padding-left:21px;font-size:15.5px;line-height:1.5;color:var(--ink-2)}
.tldr li::before{content:"";position:absolute;left:2px;top:9px;width:6px;height:6px;border-radius:50%;background:var(--green)}
.tldr li b{color:var(--ink);font-weight:700}
@media(max-width:640px){.tldr{grid-template-columns:1fr;gap:14px}}

/* reviews band renders light */
.revs{background:var(--bone);color:var(--ink)}
.revs h2{color:var(--ink)}.revs p{color:var(--muted)}
.revs .panel{background:var(--card);border-color:var(--line)}
.revs .panel .big{color:var(--ink)}.revs .panel .sub{color:var(--muted)}
.revs .panel .row{border-color:var(--line);color:var(--ink-2)}.revs .rating .n{color:var(--ink)}

/* ---- header + footer brand (logo J) ---- */
.atc-brand{display:flex;align-items:center;gap:11px;text-decoration:none}
.atc-brand .atc-mk{width:34px;height:38px;flex:0 0 auto;display:block}
.atc-wm{display:flex;flex-direction:column;line-height:1}
.atc-wm .l1{font-family:var(--wordmark);font-weight:700;font-size:20px;letter-spacing:-.025em;color:var(--ink);white-space:nowrap}
.atc-wm .l2{font-family:var(--body);font-weight:600;font-size:8.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);margin-top:6px}
footer .atc-wm .l1{color:#fff}
footer .atc-wm .l2{color:var(--on-char-mut)}
/* Duncan's real logo: wordmark in header, full dog mark in footer */

@media(max-width:600px){}


@media(max-width:600px){}
.navlinks a.current{color:var(--green)}

/* ---- credential icons ---- */
.cert .ic{width:42px;height:42px;border-radius:11px;background:rgba(62,107,52,.13);opacity:1;display:flex;align-items:center;justify-content:center;margin-bottom:11px}
.cert .ic svg{width:23px;height:23px;stroke:var(--green);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.cert .ic svg .fill{fill:var(--green);stroke:none}

/* ---- honest band: left-aligned at body, wider quote (3 lines), mark on top ---- */
.honest .wrap{display:block;padding:74px 30px}
.honest .mk{font-size:84px;line-height:.4;color:rgba(255,255,255,.5);display:block;margin-bottom:2px}
.honest .q{max-width:54ch;font-size:clamp(23px,2.9vw,34px)}
.honest .attr{margin-top:16px;max-width:none}

/* ---- service-page hero with lead form ---- */
.hero.svc{min-height:auto}
.hero.svc .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center;padding-top:90px;padding-bottom:74px}
.hero.svc h1{font-size:clamp(30px,4vw,48px);max-width:17ch}
.hero.svc .sub{max-width:46ch}
@media(max-width:960px){.hero.svc .wrap{grid-template-columns:1fr;gap:30px}}
/* ---- lead form card ---- */
.lead-form{position:relative;background:var(--card);border-radius:18px;padding:26px 24px;box-shadow:0 24px 60px rgba(18,15,12,.30);display:flex;flex-direction:column;gap:10px}
.lead-form .lf-title{font-family:var(--disp);font-weight:800;font-size:21px;color:var(--ink);letter-spacing:-.02em;line-height:1.05}
.lead-form .lf-sub{font-size:13px;color:var(--muted);margin-bottom:6px;line-height:1.4}
.lead-form label{display:flex;flex-direction:column;gap:5px;font-family:var(--body);font-weight:600;font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-2)}
.lead-form label .opt{color:var(--faint);text-transform:none;letter-spacing:0;font-weight:500}
.lead-form input,.lead-form textarea{font-family:var(--body);font-weight:400;font-size:15.5px;color:var(--ink);background:var(--bone);border:1px solid var(--line);border-radius:9px;padding:11px 13px;text-transform:none;letter-spacing:0;width:100%}
.lead-form input:focus,.lead-form textarea:focus{outline:none;border-color:var(--green);box-shadow:0 0 0 3px rgba(62,107,52,.18)}
.lead-form .lf-btn{justify-content:center;margin-top:5px;border:none;cursor:pointer;width:100%}
.lead-form .lf-fine{font-size:12.5px;color:var(--muted);text-align:center;margin-top:2px}
.lead-form .lf-fine a{color:var(--green);font-weight:600}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.lead-banner{border-radius:12px;padding:15px 22px;font-size:15px;font-weight:500}
.lead-banner-wrap{background:var(--bone)}
.lead-banner-wrap .wrap{padding:22px 30px 0}
.lead-banner.ok{background:#E8F3EC;color:#2E6B45;border:1px solid #cfe6d7}
.lead-banner.err{background:#FCEEEE;color:#9B3B3B;border:1px solid #f0d5d5}

/* ---- page summary standfirst (replaces the TL;DR card) ---- */
.pagesum{font-family:var(--body);font-weight:400;font-size:15px;line-height:1.55;color:var(--muted);max-width:none}
.pagesum b{color:inherit;font-weight:400}

/* ---- nav dropdown ---- */
.navlinks .has-sub{position:relative}
.navlinks .has-sub > a .car{font-size:9px;color:var(--muted);margin-left:3px;display:inline-block}
.navlinks .submenu{position:absolute;top:calc(100% + 10px);left:-14px;min-width:214px;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:8px;box-shadow:0 20px 46px rgba(18,15,12,.16);display:flex;flex-direction:column;gap:2px;opacity:0;visibility:hidden;transform:translateY(6px);transition:.18s;z-index:60}
.navlinks .submenu::before{content:"";position:absolute;top:-12px;left:0;right:0;height:14px}
.navlinks .has-sub:hover .submenu{opacity:1;visibility:visible;transform:none}
.navlinks .submenu a{padding:9px 13px;border-radius:8px;font-size:14.5px;color:var(--ink-2);white-space:nowrap}
.navlinks .submenu a:hover{background:var(--bone);color:var(--green)}
.navlinks .has-sub > a:hover .car{color:var(--green)}

/* ===== mobile nav + sticky CTA + mobile polish ===== */
.navtoggle{position:absolute;opacity:0;width:0;height:0;pointer-events:none}
.hamb{display:none}.mobile-menu{display:none}.mobile-cta{display:none}
@media(max-width:960px){
  .schedule-cta{display:none}
  .hamb{display:flex;flex-direction:column;justify-content:center;align-items:flex-end;gap:5px;width:44px;height:44px;cursor:pointer;margin-left:auto;background:none;border:none;padding:0}
  .hamb span{display:block;height:2px;width:24px;background:var(--ink);border-radius:2px;transition:.22s}
  .nav-open .hamb span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .nav-open .hamb span:nth-child(2){opacity:0}
  .nav-open .hamb span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  .mobile-menu{display:flex;flex-direction:column;position:fixed;inset:0;background:var(--bone);z-index:200;padding:18px 24px 40px;transform:translateX(100%);transition:transform .26s cubic-bezier(.2,.7,.2,1);overflow-y:auto}
  .nav-open .mobile-menu{transform:none}
  .mm-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;padding-bottom:14px;border-bottom:1px solid var(--line)}
  .mm-close{font-size:34px;line-height:1;color:var(--ink);cursor:pointer;padding:0 6px;background:none;border:none}
  html.nav-open{overflow:hidden}
  .mobile-menu > a{padding:14px 4px;font-family:var(--disp);font-weight:600;font-size:19px;color:var(--ink);border-bottom:1px solid var(--line-2)}
  .mobile-menu .mm-call{color:var(--green);border-bottom:none;margin-top:8px}
  .mobile-menu .pill{margin-top:12px;justify-content:center;font-size:16px}
  .mobile-cta{display:grid;grid-template-columns:1fr 1.35fr;position:fixed;left:0;right:0;bottom:0;z-index:150;box-shadow:0 -6px 22px rgba(18,15,12,.2)}
  .mobile-cta a{display:flex;align-items:center;justify-content:center;gap:8px;padding:16px 10px;font-family:var(--disp);font-weight:700;font-size:15.5px}
  .mobile-cta .mc-call{background:var(--char);color:#fff}
  .mobile-cta .mc-sched{background:var(--green);color:#fff}
  body{padding-bottom:56px}
  .hero .wrap{padding:52px 24px}
  .hero.svc .wrap{padding-top:38px;padding-bottom:44px}
  .statrow{flex-direction:column;align-items:flex-start;gap:0;margin-top:24px}
  .statrow .st{border-right:none;border-bottom:1px solid rgba(255,255,255,.15);margin:0;padding:11px 0;width:100%}
  .statrow .st:last-child{border-bottom:none}
  .feat .steps .step, .proc, .whocards, .certs{}
}

/* ---- real review cards (home) ---- */
.revs .wrap{display:block}
.revs-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;margin-bottom:38px}
.revs-rate{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.revs-rate .s{color:var(--green);font-size:20px;letter-spacing:2px}
.revs-rate-t{font-family:var(--disp);font-weight:600;font-size:15px;color:var(--ink)}
.revcards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.revcard{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:26px;display:flex;flex-direction:column;box-shadow:0 6px 22px rgba(26,23,20,.06)}
.revs.alt{background:var(--card)}
.revs.alt .revcard{background:var(--bone);box-shadow:none}
.revcard .rstars{color:var(--green);font-size:15px;letter-spacing:2px;margin-bottom:12px}
.revcard blockquote{font-size:15.5px;line-height:1.55;color:var(--ink-2);margin-bottom:16px;flex:1}
.revcard .rname{display:block;font-family:var(--disp);font-weight:700;font-size:15px;color:var(--ink)}
.revcard .rmeta{font-size:12.5px;color:var(--muted);margin-top:2px}
@media(max-width:820px){.revs-head{margin-bottom:26px}.revcards{grid-template-columns:1fr}}

/* ============================================================
   American Tree Care additions
   ============================================================ */

/* text wordmark (no logo file yet) */
.atc-brand .atc-mk{width:44px;height:44px;flex:0 0 auto;display:block}
.atc-star{fill:none;stroke:var(--ink);stroke-width:2.6;stroke-miterlimit:10}
.atc-tree{fill:var(--green)}
footer .atc-star{fill:none;stroke:#fff}
footer .atc-tree{fill:var(--green-lite)}
.mm-top .atc-mk{width:34px;height:34px}
.atc-wm .l1{font-size:20px}
.atc-wm .l1 .k{color:var(--ink)}
footer .atc-wm .l1 .k{color:#fff}
@media(max-width:400px){.atc-wm .l1{font-size:16px}.atc-wm .l2{font-size:7px}}

/* phone stack in the contact column */
.phones{display:flex;flex-direction:column;gap:14px;margin-top:8px}
.phones .pline{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.phones .num{font-family:var(--disp);font-weight:700;font-size:23px;color:var(--ink);letter-spacing:-.02em}
.phones .num:hover{color:var(--green)}
.phones .lbl{font-family:var(--body);font-weight:600;font-size:11px;letter-spacing:.13em;text-transform:uppercase;color:var(--muted)}
.phones .lbl.hot{color:var(--green)}

/* contact split */
.contact-wrap{display:grid;grid-template-columns:1fr 1.02fr;gap:56px;align-items:start}
.contact-facts{display:flex;flex-direction:column;gap:26px;margin-top:26px}
.cfact{display:grid;grid-template-columns:auto 1fr;gap:15px;align-items:start}
.cfact .ic{width:38px;height:38px;border-radius:10px;background:rgba(62,107,52,.13);display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.cfact .ic svg{width:19px;height:19px;stroke:var(--green);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.cfact .k{font-family:var(--body);font-weight:600;font-size:11px;letter-spacing:.13em;text-transform:uppercase;color:var(--muted);margin-bottom:4px}
.cfact .v{font-size:16px;color:var(--ink-2);line-height:1.5}
.cfact .v a{color:var(--green);font-weight:600}
.contact-wrap .lead-form{box-shadow:0 18px 48px rgba(18,15,12,.10);border:1px solid var(--line);padding:30px 28px}
.lead-form .lf-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media(max-width:960px){.contact-wrap{grid-template-columns:1fr;gap:34px}}
@media(max-width:480px){.lead-form .lf-row{grid-template-columns:1fr}}

/* proof strip */
.proof{background:var(--char);color:var(--on-char)}
.proof .wrap{padding:30px;display:grid;grid-template-columns:repeat(4,1fr);gap:26px}
.proof .p{display:flex;flex-direction:column;gap:4px}
.proof .n{font-family:var(--disp);font-weight:700;font-size:32px;color:#fff;line-height:1;letter-spacing:-.03em}
.proof .n small{font-size:17px;color:var(--green-lite);margin-left:2px}
.proof .l{font-size:12.5px;letter-spacing:.05em;text-transform:uppercase;color:var(--on-char-mut);line-height:1.3}
@media(max-width:820px){.proof .wrap{grid-template-columns:1fr 1fr;gap:22px}}

/* review cards: two real reviews sit at 2-up, not 3 */
.revcards.two{grid-template-columns:1fr 1fr}
@media(max-width:820px){.revcards.two{grid-template-columns:1fr}}
.revcard .rlong{font-size:14.5px}

/* mockup ribbon */



/* ---- real job photos ---- */
.gal{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin-top:44px}
.gal figure{position:relative;border-radius:12px;overflow:hidden;background:var(--card-2);margin:0}
.gal img{width:100%;height:100%;object-fit:cover;display:block;transition:.5s}
.gal figure:hover img{transform:scale(1.04)}
.gal figure{aspect-ratio:3/4}
.gal figcaption{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:26px 14px 12px;
  background:linear-gradient(180deg,rgba(18,15,12,0),rgba(18,15,12,.85));
  color:#fff;font-family:var(--body);font-weight:500;font-size:12.5px;line-height:1.35}
@media(max-width:1000px){.gal{grid-template-columns:repeat(3,1fr)}}
@media(max-width:560px){.gal{grid-template-columns:repeat(2,1fr)}}
.gal-note{margin-top:16px;font-size:13.5px;color:var(--muted)}


/* ============================================================
   WordPress theme additions
   ============================================================ */

/* skip link */
.skip{position:absolute;left:-9999px;top:0;z-index:300;background:var(--char);color:#fff;
  padding:12px 18px;border-radius:0 0 10px 0;font-weight:600;font-size:14px}
.skip:focus{left:0}

/* the inline SVG brand mark */
.atc-brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.atc-mk{width:44px;height:44px;flex:0 0 auto;display:block}
.atc-star{fill:none;stroke:var(--ink);stroke-width:2.6;stroke-miterlimit:10}
.atc-tree{fill:var(--green)}
footer .atc-star{stroke:#fff}
footer .atc-tree{fill:var(--green-lite)}
.mobile-menu .atc-star{stroke:var(--ink)}
.atc-wm{display:flex;flex-direction:column;line-height:1}
.atc-wm .l1{font-family:var(--disp);font-weight:700;font-size:20px;letter-spacing:-.025em;
  color:var(--ink);white-space:nowrap}
.atc-wm .l2{font-family:var(--body);font-weight:600;font-size:8.5px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--muted);margin-top:6px}
footer .atc-wm .l1{color:#fff}
footer .atc-wm .l2{color:var(--on-char-mut)}
.mm-mk{width:34px;height:34px}
@media(max-width:400px){.atc-wm .l1{font-size:16px}.atc-wm .l2{font-size:7px}.atc-mk{width:36px;height:36px}}

/* section lead paragraph */
.lead{color:var(--muted);font-size:18px;line-height:1.6;margin-top:14px}
.lead.narrow{max-width:34ch;margin:0}
.area-h{font-size:clamp(28px,3.6vw,42px);margin-top:14px}
.area-note{margin-top:20px;font-size:15px;color:var(--muted)}

/* ghost pill sitting on a photo */
.pill.ghost.onphoto{color:#fff;border-color:rgba(255,255,255,.5)}
.pill.ghost.onphoto:hover{border-color:#fff;color:#fff}
.eyebrow.lite{color:var(--green-lite)}
.eyebrow.lite::before{background:var(--green-lite)}

/* feature big number (was .big27) */
.feat .ph .bignum{position:absolute;left:26px;bottom:40px;z-index:2;font-family:var(--disp);
  font-weight:700;font-size:100px;color:#fff;line-height:.85;letter-spacing:-.04em;
  text-shadow:0 2px 24px rgba(0,0,0,.45)}
.feat .ph .bignum small{display:block;font-family:var(--body);font-size:13px;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;color:var(--green-lite);margin-top:8px}
@media(max-width:600px){.feat .ph .bignum{font-size:64px;left:18px;bottom:24px}}

/* review card semantics */
.revcard blockquote{margin:0;font-size:15.5px;line-height:1.55;color:var(--ink-2);
  margin-bottom:16px;flex:1}
.revcard figcaption{display:block}
.revcard .rmeta{display:block}

/* footer contact column: tappable phone numbers */
footer .col .fbig{font-family:var(--disp);font-weight:700;font-size:17px;color:#fff;margin-bottom:6px}
footer .col .fbig:hover{color:var(--green-lite)}

/* images always behave */
img{max-width:100%;height:auto}
.hero img.bg,.final img.bg{height:100%}
.scard img,.gal img,.feat .ph img,.area .ph img{height:100%}

/* WP admin bar offset */
body.admin-bar header{top:32px}
@media(max-width:782px){body.admin-bar header{top:46px}}

/* respect reduced motion for the hero reveal */
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;animation:none}}


/* ============================================================
   Mobile corrections
   ============================================================ */

/* 1. The off-canvas menu is translated off to the right. A transformed fixed
      element still extends the scrollable area, which is what was letting the
      whole page slide left to right. Take it out of layout until it opens. */
.mobile-menu{visibility:hidden}
.nav-open .mobile-menu{visibility:visible}
html,body{overflow-x:hidden;max-width:100%}

/* 2. Long unbroken strings (the email, the licence number) must wrap rather
      than push the column wider than the screen. */
footer .col a,footer .col p,.cfact .v,.cfact .v a,.lf-fine,.phones .num{
  overflow-wrap:anywhere;word-break:break-word}
footer .col{min-width:0}
.ftop{min-width:0}

/* 3. The hero badge was running past the viewport on small phones. Let it wrap
      and drop a step in size instead of forcing one line. */
.badge{white-space:normal;line-height:1.35}
@media(max-width:560px){
  .badge{font-size:11px;letter-spacing:.03em;padding:7px 13px}
  .hero .badges{gap:8px 18px;font-size:12.5px}
  .hero .stars .t{font-size:13px}
}
@media(max-width:400px){
  .badge{font-size:10.5px}
}

/* 4. Belt and braces: nothing inside the page grid may exceed its track. */
.wrap{min-width:0}
.svcgrid,.certs,.proc,.gal,.revcards,.contact-wrap,.area{min-width:0}
.scard,.cert,.pstep,.revcard,.gal figure{min-width:0}

/* 5. Footer on a phone: two columns squeezed the contact details so hard that
      the phone numbers broke mid-digit. One column below 560px. */
@media(max-width:560px){
  .ftop{grid-template-columns:1fr;gap:30px;padding-bottom:28px}
  footer .col h2{margin-bottom:10px}
  footer .tag{max-width:none}
}
/* A phone number must never wrap. The email may, anywhere. */
footer .col .fbig,.phones .num{white-space:nowrap;overflow-wrap:normal;word-break:keep-all}
footer .col a[href^="mailto"]{overflow-wrap:anywhere}

/* 6. Once the grid drops out of 3 columns the "big" card is the same box as the
      rest, so it must not keep the larger heading. */
@media(max-width:900px){
  .scard.big h3{font-size:22px}
}

/* ---------------------------------------------------------------------------
   7. Answer block. The short, factual "in short" panel near the top of every
   service page: a direct answer on the left, a spec card of quick facts on the
   right. Written for people skimming and for AI answer engines quoting.
   -------------------------------------------------------------------------*/
.ans{display:grid;grid-template-columns:1.15fr .85fr;gap:52px;align-items:start}
.ans-main h2{font-family:var(--disp);font-weight:600;font-size:clamp(24px,2.6vw,34px);
  line-height:1.18;color:var(--ink);margin:10px 0 16px;max-width:22ch}
.ans-lead{font-size:17.5px;line-height:1.62;color:var(--ink-2);max-width:56ch}
.ans-lead + .ans-lead{margin-top:14px}
.ans-facts{background:var(--card);border:1px solid var(--line);border-radius:14px;
  padding:6px 22px;box-shadow:0 1px 2px rgba(26,23,20,.04)}
.ans-facts .row{display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:baseline;
  padding:15px 0;border-bottom:1px solid var(--line-2)}
.ans-facts .row:last-child{border-bottom:0}
.ans-facts .k{font-family:var(--body);font-weight:600;font-size:11.5px;letter-spacing:.11em;
  text-transform:uppercase;color:var(--muted);white-space:nowrap}
.ans-facts .v{font-size:15.5px;line-height:1.5;color:var(--ink);text-align:right}
.ans-facts .v b{font-family:var(--disp);font-weight:600}
@media(max-width:900px){
  .ans{grid-template-columns:1fr;gap:30px}
  .ans-facts .row{grid-template-columns:1fr;gap:4px;padding:13px 0}
  .ans-facts .v{text-align:left}
}

/* Cross-link service cards, used at the bottom of every service page. */
.xlink .scard h3{font-size:20px}

/* ---------------------------------------------------------------------------
   8. Texting. Ammon wants photos texted to the cell: it is the fastest route
   to a quote for him and the lowest-effort action for the customer. So text
   gets a real button and its own slot on the mobile bar, not just a label.
   -------------------------------------------------------------------------*/
.textcta{margin-top:22px}
.textnote{margin-top:12px;font-size:14.5px;line-height:1.55;color:var(--muted);max-width:44ch}
@media(max-width:900px){
  /* Call | Text | Estimate. Text is the middle slot so it reads as the default. */
  .mobile-cta{grid-template-columns:.85fr 1.05fr 1.1fr}
  .mobile-cta a{padding:15px 6px;font-size:14px}
  .mobile-cta .mc-text{background:var(--brown);color:#fff}
}
@media(max-width:360px){
  .mobile-cta a{font-size:12.5px;padding:14px 4px}
}

/* ---------------------------------------------------------------------------
   9. Sub bar. It used to wrap onto a second line whenever the sentence ran
   long, which read as a layout break rather than a design. Desktop now holds
   one row and the text shrinks instead of wrapping the buttons down. Service
   pages carry the form in the hero, so their sub bar drops the CTA entirely
   (.solo) and the sentence gets the full width.
   -------------------------------------------------------------------------*/
.subbar .wrap{flex-wrap:nowrap}
.subbar .t{min-width:0}
.subbar .a{flex:0 0 auto;white-space:nowrap}
.subbar.solo .wrap{justify-content:flex-start}
.subbar.solo .t{max-width:none}
@media(max-width:900px){
  .subbar .wrap{flex-wrap:wrap;gap:12px}
  .subbar .a{width:100%;justify-content:space-between}
}

/* ---------------------------------------------------------------------------
   10. Thank-you page. A real destination after a submit, not a banner.
   -------------------------------------------------------------------------*/
.thanks{padding-top:64px}
.thanks-in{max-width:640px;margin:0 auto;text-align:center}
.thanks-tick{width:62px;height:62px;margin:0 auto 22px;border-radius:50%;
  background:var(--green);display:flex;align-items:center;justify-content:center}
.thanks-tick svg{width:30px;height:30px;fill:none;stroke:#fff;stroke-width:2.4;
  stroke-linecap:round;stroke-linejoin:round}
.thanks-in h1{font-family:var(--disp);font-weight:700;font-size:clamp(28px,4.4vw,42px);
  line-height:1.12;color:var(--ink);margin:10px 0 16px}
.thanks-in .lead{margin:0 auto;max-width:52ch}
.thanks-in .ctas{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:28px}
.thanks-note{margin-top:22px;font-size:14.5px;color:var(--muted)}

/* iOS Safari lets a fixed, translated-off-screen panel be panned to even when
   overflow-x is hidden. This pins the horizontal axis shut. */
html,body{overscroll-behavior-x:none}
.mobile-menu{pointer-events:none}
.nav-open .mobile-menu{pointer-events:auto}