/* Lead sites — "field inspection report" system.
   Primary reference: Timescale (Refero 520e6739) — stark white canvas, black ink structure, thin rules,
   hard 5px offset black shadow on feature cards, mono for technical labels, one accent for key data,
   one filled action colour. Fonts swapped off Geist (AI-default list) to Schibsted Grotesk + JetBrains Mono.
   Per-niche accent/action set on <html data-niche>. */
:root{
  --canvas:#fafafa; --paper:#ffffff; --ink:#0b0b0b; --ink-2:#3d3d3d; --muted:#6c6c6c; --rule:#b3b3b3; --hair:#e3e3e3;
  --accent:#b8401a; --action:#f5ff80; --action-ink:#0b0b0b; --tint:#f6efe9;
  --f-display:"Schibsted Grotesk",system-ui,sans-serif; --f-mono:"JetBrains Mono",ui-monospace,monospace;
  --f-body:"Public Sans",system-ui,sans-serif;
  --r-btn:4px; --r-card:12px; --shadow:5px 5px 0 0 var(--ink);
  --s1:8px; --s2:16px; --s3:24px; --s4:40px; --s5:64px; --s6:96px;
  --max:1180px; --read:700px;
}
html[data-niche=crane]{--accent:#e8551e; --action:#ffd21f; --tint:#fff4e8}
html[data-niche=septic]{--accent:#1d6b58; --action:#f5ff80; --tint:#eaf4f0}
html[data-niche=tree]{--accent:#3b6a24; --action:#f5ff80; --tint:#eef3e8}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
body{margin:0;background:var(--canvas);color:var(--ink);font:400 17px/1.6 var(--f-body);letter-spacing:-.005em}
img,svg{display:block;max-width:100%}
a{color:inherit;text-underline-offset:3px;text-decoration-thickness:1px}
a:hover{color:var(--accent)}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.wrap{max-width:var(--max);margin:0 auto;padding:0 20px}
.mono{font-family:var(--f-mono);font-size:13px;letter-spacing:.02em;text-transform:uppercase}
h1,h2,h3{font-family:var(--f-display);line-height:1.08;letter-spacing:-.025em;margin:0;text-wrap:balance}
h1{font-size:clamp(38px,6.2vw,76px);font-weight:800}
h2{font-size:clamp(28px,3.6vw,44px);font-weight:750}
h3{font-size:21px;font-weight:700;letter-spacing:-.015em}
p{margin:0 0 var(--s2);text-wrap:pretty}

/* nav */
.nav{position:sticky;top:0;z-index:20;background:var(--canvas);border-bottom:1px solid var(--ink)}
.nav .wrap{display:flex;align-items:center;gap:var(--s3);height:64px}
.brand{display:flex;flex-direction:column;text-decoration:none;line-height:1.1;margin-right:auto}
.brand b{font:800 18px/1.1 var(--f-display);letter-spacing:-.02em}
.brand span{font:500 11px/1.3 var(--f-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.nav nav{display:flex;gap:var(--s3)}
.nav nav a{text-decoration:none;font-weight:600;font-size:15px}
@media (max-width:900px){.nav nav{display:none}}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:10px 24px;border:1px solid var(--ink);
  border-radius:var(--r-btn);font:650 16px/1 var(--f-display);text-decoration:none;cursor:pointer;background:var(--paper);color:var(--ink);
  transition:transform .15s ease,box-shadow .15s ease}
.btn:hover{transform:translate(-2px,-2px);box-shadow:3px 3px 0 0 var(--ink);color:var(--ink)}
.btn:active{transform:none;box-shadow:none}
.btn-go{background:var(--action);color:var(--action-ink)}
.btn-ink{background:var(--ink);color:#fff}.btn-ink:hover{color:#fff}
.nav .btn{min-height:42px;padding:8px 16px;white-space:nowrap}
@media (max-width:600px){.nav .wrap{gap:12px;height:60px}.brand b{font-size:15.5px}.brand span{font-size:10px}.nav .btn{padding:8px 12px;font-size:15px}}

/* hero: headline left, the free check right (value above the fold) */
.hero{border-bottom:1px solid var(--ink);background:
  linear-gradient(var(--hair) 1px,transparent 1px) 0 0/100% 32px,linear-gradient(90deg,var(--hair) 1px,transparent 1px) 0 0/32px 100%,var(--canvas)}
.hero .wrap{display:grid;grid-template-columns:1fr 1fr;gap:var(--s5);align-items:start;padding-top:var(--s5);padding-bottom:var(--s5)}
.hero .tag{display:inline-block;border:1px solid var(--accent);color:var(--accent);border-radius:999px;padding:4px 12px;margin-bottom:var(--s3);background:var(--paper)}
.hero h1 em{font-style:normal;color:var(--accent)}
.hero .sub{font-size:19px;color:var(--ink-2);max-width:520px;margin-top:var(--s3)}
.hero .facts{display:flex;flex-wrap:wrap;gap:var(--s1) var(--s3);margin-top:var(--s3);padding:0;list-style:none}
.hero .facts li::before{content:"■ ";color:var(--accent)}
.hero .intro{font-size:16px;color:var(--ink-2);margin:0 0 14px;max-width:520px}
@media (min-width:901px){.hero .lead{position:sticky;top:112px;padding-top:var(--s3)}}
@media (max-width:900px){.hero .wrap{grid-template-columns:1fr;gap:var(--s4);padding-top:var(--s4);padding-bottom:var(--s4)}}

/* inspection card (the tool) */
.card{background:var(--paper);border:1px solid var(--ink);border-radius:var(--r-card);box-shadow:var(--shadow)}
.tool{padding:0;overflow:hidden}
.tool header{display:flex;justify-content:space-between;align-items:center;padding:14px 20px;border-bottom:1px solid var(--ink);background:var(--tint)}
.tool header b{font:700 17px/1.2 var(--f-display)}
.tool .q{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;padding:11px 20px;border-bottom:1px solid var(--hair)}
.tool .q p{margin:0;font-weight:600;line-height:1.35}
.tool .q small{display:block;font-weight:400;color:var(--muted);font-size:13.5px;line-height:1.4;margin-top:2px}
.tool header .mono{white-space:nowrap}
.yn{display:flex;border:1px solid var(--ink);border-radius:var(--r-btn);overflow:hidden}
.yn button{min-width:52px;min-height:44px;border:0;background:var(--paper);font:600 14px var(--f-mono);cursor:pointer}
.yn button+button{border-left:1px solid var(--ink)}
.yn button[aria-pressed=true]{background:var(--ink);color:#fff}
.tool .foot{padding:16px 20px;display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.tool .count{color:var(--muted)}
.verdict{display:none;padding:20px;border-top:1px solid var(--ink)}
.verdict.on{display:block;animation:stamp .35s cubic-bezier(.2,.8,.2,1)}
@keyframes stamp{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.verdict .stamp{display:inline-block;border:2px solid currentColor;padding:4px 10px;transform:rotate(-2deg);margin-bottom:10px}
.verdict[data-level=low] .stamp{color:#2b6a2b}.verdict[data-level=watch] .stamp{color:#9a6a00}.verdict[data-level=urgent] .stamp{color:#b3261e}
.verdict h3{margin-bottom:8px}
.tool .fields{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:16px 20px}
.tool .fields label{display:flex;flex-direction:column;gap:6px;font-weight:600;font-size:15px}
.out{margin:0 20px 16px;padding:14px;border:1px dashed var(--ink);border-radius:var(--r-btn);background:var(--tint)}

/* forms */
input,select,textarea{font:400 16px/1.4 var(--f-body);padding:12px;border:1px solid var(--ink);border-radius:var(--r-btn) 0 0 var(--r-btn);background:var(--paper);color:var(--ink);width:100%}
textarea{min-height:110px;resize:vertical}
.hp{position:absolute;left:-9999px}

/* sections = numbered report entries */
.band{padding:var(--s6) 0;border-bottom:1px solid var(--ink)}
.band.tint{background:var(--tint)}
.entry{display:grid;grid-template-columns:200px 1fr;gap:var(--s4);padding:var(--s4) 0;border-top:1px solid var(--rule)}
.entry:first-child{border-top:0}
.entry .num{color:var(--accent)}
.entry h2{font-size:clamp(26px,3vw,36px);margin-bottom:var(--s3)}
.entry .body{max-width:var(--read)}
.entry ul,.prose ul{padding-left:0;list-style:none;margin:0 0 var(--s2)}
.entry li,.prose li{padding:6px 0 6px 22px;position:relative;border-bottom:1px solid var(--hair)}
.entry li::before,.prose li::before{content:"";position:absolute;left:0;top:15px;width:10px;height:2px;background:var(--accent)}
@media (max-width:800px){.entry{grid-template-columns:1fr;gap:var(--s2)}}
.diagram{padding:var(--s4) 0}
.diagram figure{margin:0}
.diagram figcaption{margin-top:var(--s2);color:var(--muted)}
.diagram svg{width:100%;height:auto}

/* ledger lists (services, areas, guides) */
.ledger{list-style:none;margin:var(--s4) 0 0;padding:0;border-top:1px solid var(--ink)}
.ledger a{display:grid;grid-template-columns:64px 1fr auto;gap:var(--s3);align-items:center;padding:20px 4px;border-bottom:1px solid var(--ink);text-decoration:none;transition:background .15s,padding .15s}
.ledger a:hover{background:var(--paper);padding-left:12px;color:var(--ink)}
.ledger .t{font:700 clamp(19px,2.2vw,24px)/1.2 var(--f-display);letter-spacing:-.015em}
.ledger .d{display:block;font:400 15px/1.45 var(--f-body);color:var(--muted);margin-top:4px}
.ledger .arrow{font:500 20px var(--f-mono);transition:transform .15s}
.ledger a:hover .arrow{transform:translateX(4px);color:var(--accent)}
@media (max-width:600px){.ledger a{grid-template-columns:44px 1fr auto;gap:12px}}
.head-row{display:flex;justify-content:space-between;align-items:end;gap:var(--s3);flex-wrap:wrap}
.head-row p{max-width:520px;color:var(--ink-2);margin:0}

/* cost table */
.table{width:100%;border-collapse:collapse;margin:var(--s3) 0;background:var(--paper);border:1px solid var(--ink)}
.table th,.table td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--hair);vertical-align:top}
.table th{font:600 12px var(--f-mono);letter-spacing:.04em;text-transform:uppercase;background:var(--tint);border-bottom:1px solid var(--ink)}
.table td.r{font:600 16px var(--f-mono);white-space:nowrap;color:var(--accent)}
.table td.s{color:var(--muted);font-size:14px}
.table-scroll{overflow-x:auto}

/* faq */
.faq details{border-bottom:1px solid var(--ink)}
.faq summary{list-style:none;cursor:pointer;padding:20px 40px 20px 0;font:700 19px/1.3 var(--f-display);position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:4px;top:16px;font:400 26px var(--f-mono);transition:transform .2s}
.faq details[open] summary::after{transform:rotate(45deg);color:var(--accent)}
.faq details p{max-width:var(--read);padding-bottom:var(--s2)}

/* get matched */
.match{display:grid;grid-template-columns:.9fr 1.1fr;gap:var(--s5);align-items:start}
.match form{padding:var(--s3);display:grid;gap:14px}
.match label{display:flex;flex-direction:column;gap:6px;font-weight:600;font-size:15px}
.match .row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.steps{list-style:none;padding:0;margin:var(--s3) 0;counter-reset:s}
.steps li{counter-increment:s;display:grid;grid-template-columns:40px 1fr;gap:12px;padding:12px 0;border-bottom:1px solid var(--rule)}
.steps li::before{content:counter(s,decimal-leading-zero);font:600 14px var(--f-mono);color:var(--accent);padding-top:3px}
.note{font-size:14px;color:var(--muted)}
.ok{display:none;padding:var(--s3)}.ok.on{display:block}
@media (max-width:900px){.match{grid-template-columns:1fr;gap:var(--s4)}.match .row,.tool .fields{grid-template-columns:1fr}}

/* article pages */
.crumbs{padding:var(--s3) 0 0;color:var(--muted)}
.crumbs a{text-decoration:none}
.page-head{padding:var(--s4) 0 var(--s5);border-bottom:1px solid var(--ink)}
.page-head .lede{font-size:20px;color:var(--ink-2);max-width:var(--read);margin-top:var(--s3)}
.prose{max-width:var(--read);padding:var(--s5) 0}
.prose h2{font-size:clamp(24px,2.8vw,32px);margin:var(--s5) 0 var(--s2)}
.prose h2:first-child{margin-top:0}
.inline-cta{margin:var(--s5) 0;padding:var(--s3);display:flex;gap:var(--s3);align-items:center;justify-content:space-between;flex-wrap:wrap}
.inline-cta p{margin:0;font:700 19px/1.3 var(--f-display);max-width:420px}
.related{padding:var(--s5) 0;border-top:1px solid var(--ink)}

/* footer */
footer{background:var(--ink);color:#e9e9e9;padding:var(--s5) 0 var(--s4)}
footer a{color:#fff}
footer .cols{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:var(--s4)}
footer .disc{border:1px solid #555;border-radius:var(--r-card);padding:var(--s3);font-size:15px;line-height:1.55;color:#cfcfcf}
footer ul{list-style:none;padding:0;margin:var(--s2) 0 0}
footer li{padding:4px 0}
footer .base{margin-top:var(--s4);padding-top:var(--s3);border-top:1px solid #333;color:#9a9a9a;font-size:14px}
@media (max-width:800px){footer .cols{grid-template-columns:1fr}}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
