
/* Layout: estimate-sheet page on graph paper. Hero = headline beside a worked offer worksheet; sections read like line items on a bid. */
:root{
  --paper:#F4F6F3; --sheet:#FFFFFF; --grid:rgba(31,78,140,.07);
  --ink:#17202B; --ink-soft:#4A5563; --rule:#D5DBDF;
  --blue:#1F4E8C; --blue-ink:#FFFFFF; --mark:#F2C230; --mark-ink:#17202B;
  --minus:#9A3B2E;
  --f-display:"Barlow Condensed","Arial Narrow",Arial,sans-serif;
  --f-body:"Public Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
  --s1:.5rem; --s2:1rem; --s3:1.5rem; --s4:2.5rem; --s5:4rem; --s6:6rem;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --paper:#0F1924; --sheet:#152230; --grid:rgba(140,180,230,.06);
  --ink:#E7ECF1; --ink-soft:#A4B0BD; --rule:#2A3A4C;
  --blue:#7FA9E3; --blue-ink:#0F1924; --mark:#F2C230; --mark-ink:#17202B; --minus:#E58E7E;
  color-scheme:dark;}}
:root[data-theme="dark"]{
  --paper:#0F1924; --sheet:#152230; --grid:rgba(140,180,230,.06);
  --ink:#E7ECF1; --ink-soft:#A4B0BD; --rule:#2A3A4C;
  --blue:#7FA9E3; --blue-ink:#0F1924; --mark:#F2C230; --mark-ink:#17202B; --minus:#E58E7E;
  color-scheme:dark;}

*{box-sizing:border-box}
body{
  background-color:var(--paper);
  background-image:linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px);
  background-size:24px 24px;
  color:var(--ink); font-family:var(--f-body); font-size:17px; line-height:1.6;
}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:10;background:var(--sheet)}
a{color:var(--blue)}
:focus-visible{outline:3px solid var(--mark);outline-offset:2px}
h1,h2,h3{font-family:var(--f-display);line-height:1.02;margin:0;text-wrap:balance;letter-spacing:.005em}
h2{font-size:clamp(2.2rem,5vw,3.4rem);font-weight:800;text-transform:uppercase}
h3{font-size:1.5rem;font-weight:700}
p{margin:0}
.wrap{max-width:1120px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.eyebrow{font-family:var(--f-mono);font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft)}
.lede{font-size:1.15rem;color:var(--ink-soft);max-width:62ch}
.hl{background:linear-gradient(transparent 58%,var(--mark) 58%,var(--mark) 92%,transparent 92%);color:inherit}

/* header */
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;background:var(--sheet);border-bottom:1px solid var(--rule)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:var(--s2);padding-block:.7rem}
.brand{font-family:var(--f-display);font-weight:800;font-size:1.45rem;text-transform:uppercase;letter-spacing:.02em;text-decoration:none;color:var(--ink);display:flex;align-items:center;gap:.5rem}
.brand-mark{width:28px;height:28px;flex:none}
.top nav{display:flex;gap:var(--s3);font-weight:600;font-size:.95rem}
.top nav a{color:var(--ink);text-decoration:none}
.top nav a:hover{color:var(--blue)}
.top-cta{display:flex;align-items:center;gap:var(--s2)}
.phone{font-family:var(--f-mono);font-weight:600;white-space:nowrap;color:var(--ink);text-decoration:none}
.btn{display:inline-block;font-family:var(--f-display);font-weight:700;font-size:1.15rem;text-transform:uppercase;letter-spacing:.04em;padding:.7rem 1.3rem;border:2px solid var(--blue);background:var(--blue);color:var(--blue-ink);text-decoration:none;cursor:pointer;border-radius:3px}
.btn:hover{filter:brightness(1.08)}
.btn.ghost{background:transparent;color:var(--blue)}
@media (max-width:880px){.top nav{display:none}}
@media (max-width:480px){.top .phone{display:none}.brand{font-size:1.1rem}.top .btn{padding:.55rem .8rem;font-size:1rem}}

/* hero */
.hero .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:var(--s5);align-items:center;padding-block:var(--s5) var(--s5)}
.hero h1{font-size:clamp(2.6rem,7vw,5rem);font-weight:800;text-transform:uppercase;margin-block:var(--s2) var(--s3)}
.hero-copy{display:flex;flex-direction:column;align-items:flex-start;min-width:0}
.hero-actions{display:flex;flex-wrap:wrap;gap:var(--s2);align-items:center;margin-top:var(--s3)}
.promises{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:var(--s3);padding:0;list-style:none}
.promises li{font-family:var(--f-mono);font-size:.82rem;border:1px solid var(--rule);background:var(--sheet);padding:.3rem .6rem;border-radius:2px}
@media (max-width:880px){.hero .wrap{grid-template-columns:1fr;gap:var(--s4);padding-block:var(--s4)}}

/* worksheet */
.sheet{background:var(--sheet);border:1px solid var(--rule);box-shadow:6px 6px 0 var(--rule);padding:var(--s3);font-family:var(--f-mono);font-size:.93rem;min-width:0;transform:rotate(.6deg)}
.sheet-head{display:flex;justify-content:space-between;align-items:baseline;gap:var(--s2);border-bottom:2px solid var(--ink);padding-bottom:.5rem;margin-bottom:.4rem}
.sheet-head strong{font-family:var(--f-display);font-size:1.4rem;text-transform:uppercase;letter-spacing:.03em}
.stamp{font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;border:1.5px solid var(--minus);color:var(--minus);padding:.1rem .4rem;transform:rotate(-4deg);white-space:nowrap}
.sheet table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.sheet td{padding:.45rem 0;border-bottom:1px dashed var(--rule);vertical-align:top}
.sheet td:last-child{text-align:right;white-space:nowrap;padding-left:var(--s2)}
.sheet .sub{display:block;font-size:.76rem;color:var(--ink-soft)}
.sheet .neg{color:var(--minus)}
.sheet tr.total td{border-bottom:none;border-top:2px solid var(--ink);padding-top:.7rem;font-weight:600;font-size:1.1rem}
.sheet tr.total td:last-child span{background:var(--mark);color:var(--mark-ink);padding:.1rem .4rem}
.sheet-foot{margin-top:.8rem;font-size:.76rem;color:var(--ink-soft)}

/* sections */
section.band{padding-block:var(--s6)}
section.band.alt{background:var(--sheet);border-block:1px solid var(--rule)}
.sec-head{display:flex;flex-direction:column;gap:var(--s2);margin-bottom:var(--s4);max-width:760px}

/* compare */
.compare{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid var(--rule);background:var(--sheet)}
.compare>div{padding:var(--s3);border-right:1px solid var(--rule);display:flex;flex-direction:column;gap:.6rem;min-width:0}
.compare>div:last-child{border-right:none}
.compare .us{background:var(--paper);outline:3px solid var(--blue);outline-offset:-3px}
.compare ul{margin:0;padding-left:1.1rem;color:var(--ink-soft)}
.compare .us ul{color:var(--ink)}
@media (max-width:820px){.compare{grid-template-columns:1fr}.compare>div{border-right:none;border-bottom:1px solid var(--rule)}.compare>div:last-child{border-bottom:none}}

/* situations */
.sits{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s2)}
.sit{background:var(--sheet);border:1px solid var(--rule);padding:var(--s3);display:flex;flex-direction:column;gap:.5rem;min-width:0}
.sit .code{font-family:var(--f-mono);font-size:.75rem;color:var(--blue);letter-spacing:.1em;text-transform:uppercase}
.sit p{color:var(--ink-soft);font-size:.98rem}
.sit a.more{color:var(--blue);font-weight:600;font-size:.95rem;margin-top:auto;text-decoration:none}
.areas a{color:inherit;text-decoration:none;border-bottom:1px solid var(--blue)}
@media (max-width:880px){.sits{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.sits{grid-template-columns:1fr}}

/* steps */
.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s4);counter-reset:step;padding:0;margin:0;list-style:none}
.steps li{display:flex;flex-direction:column;gap:.6rem;border-top:3px solid var(--ink);padding-top:var(--s2);min-width:0}
.steps .n{font-family:var(--f-display);font-weight:800;font-size:3rem;line-height:1;color:var(--blue)}
.steps p{color:var(--ink-soft)}
@media (max-width:820px){.steps{grid-template-columns:1fr;gap:var(--s3)}}

/* owner */
.owner{display:grid;grid-template-columns:.8fr 1.2fr;gap:var(--s5);align-items:start}
.owner-card{background:var(--paper);border:1px solid var(--rule);padding:var(--s3);font-family:var(--f-mono);font-size:.9rem;display:flex;flex-direction:column;gap:.5rem}
.owner-card div{display:flex;justify-content:space-between;gap:var(--s2);border-bottom:1px dashed var(--rule);padding-bottom:.4rem}
.owner-card div:last-child{border-bottom:none}
.owner-card span:first-child{color:var(--ink-soft)}
.owner-card span:last-child{text-align:right}
.owner-text{display:flex;flex-direction:column;gap:var(--s2);min-width:0}
.owner-text p{max-width:62ch}
blockquote{margin:var(--s2) 0 0;padding:var(--s2) var(--s3);border-left:4px solid var(--mark);background:var(--paper);font-size:1.12rem;font-weight:500}
@media (max-width:820px){.owner{grid-template-columns:1fr;gap:var(--s4)}}

/* area */
.areas{display:flex;flex-wrap:wrap;gap:.5rem;padding:0;list-style:none;margin:var(--s3) 0 0}
.areas li{background:var(--sheet);border:1px solid var(--rule);padding:.35rem .75rem;font-weight:500}

/* faq */
.faq{display:flex;flex-direction:column;border-top:2px solid var(--ink);max-width:860px}
.faq details{border-bottom:1px solid var(--rule)}
.faq summary{cursor:pointer;list-style:none;padding:var(--s2) 0;font-weight:700;font-size:1.1rem;display:flex;justify-content:space-between;gap:var(--s2)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--f-mono);color:var(--blue);font-size:1.3rem;line-height:1}
.faq details[open] summary::after{content:"–"}
.faq details p{padding-bottom:var(--s2);color:var(--ink-soft);max-width:68ch}

/* form */
.intake{display:grid;grid-template-columns:.85fr 1.15fr;gap:var(--s5);align-items:start}
.intake-side{display:flex;flex-direction:column;gap:var(--s2)}
.big-phone{font-family:var(--f-mono);font-size:clamp(1.6rem,4vw,2.2rem);font-weight:600;color:var(--ink);user-select:all}
form.case{background:var(--sheet);border:1px solid var(--rule);box-shadow:6px 6px 0 var(--rule);padding:var(--s4) var(--s3);display:grid;grid-template-columns:1fr 1fr;gap:var(--s2) var(--s3);min-width:0}
.field{display:flex;flex-direction:column;gap:.35rem;min-width:0}
.field.full{grid-column:1/-1}
label{font-family:var(--f-mono);font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft)}
label .req{color:var(--minus)}
input,select,textarea{font:inherit;font-size:1rem;color:var(--ink);background:var(--paper);border:1px solid var(--rule);border-bottom:2px solid var(--ink-soft);padding:.65rem .7rem;border-radius:2px;width:100%}
input:focus,select:focus,textarea:focus{outline:none;border-bottom-color:var(--blue);box-shadow:0 2px 0 var(--blue)}
textarea{min-height:110px;resize:vertical}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-foot{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:var(--s2);margin-top:var(--s1)}
.form-foot small{color:var(--ink-soft);flex:1 1 240px}
.msg{grid-column:1/-1;padding:var(--s2);border:1px solid var(--rule);background:var(--paper)}
.msg.ok{border-left:4px solid var(--blue)}
.msg.err{border-left:4px solid var(--minus)}
.msg strong{font-family:var(--f-display);font-size:1.4rem;text-transform:uppercase;display:block;margin-bottom:.3rem}
@media (max-width:880px){.intake{grid-template-columns:1fr;gap:var(--s4)}}
@media (max-width:560px){form.case{grid-template-columns:1fr;padding:var(--s3) var(--s2)}}

footer{padding-block:var(--s4);border-top:1px solid var(--rule);background:var(--sheet);font-size:.92rem;color:var(--ink-soft)}
footer .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--s2)}

.mobile-bar{display:none}
@media (max-width:560px){
  .mobile-bar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:6;gap:.5rem;background:var(--sheet);border-top:1px solid var(--rule);padding:.6rem max(16px,env(safe-area-inset-right,0px)) calc(.6rem + env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px))}
  .mobile-bar .btn{flex:1;text-align:center;padding:.6rem .5rem;font-size:1rem}
  footer{padding-bottom:6rem}
}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}.sheet{transform:none}}
html{scroll-behavior:smooth}
section[id],#offer{scroll-margin-top:80px}

/* inner pages */
.crumbs{font-family:var(--f-mono);font-size:.8rem;color:var(--ink-soft);display:flex;flex-wrap:wrap;gap:.4rem}
.crumbs a{color:var(--ink-soft)}
.page-hero .wrap{padding-block:var(--s5) var(--s4);display:flex;flex-direction:column;gap:var(--s2);align-items:flex-start}
.page-hero h1{font-size:clamp(2.4rem,6vw,4.2rem);font-weight:800;text-transform:uppercase;max-width:20ch}
.article{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:var(--s5);align-items:start}
.article .body{display:flex;flex-direction:column;gap:var(--s4);min-width:0}
.article .body section{display:flex;flex-direction:column;gap:var(--s2)}
.article .body h2{font-size:clamp(1.7rem,3.5vw,2.3rem)}
.article .body p{max-width:66ch}
.aside{position:sticky;top:90px;background:var(--sheet);border:1px solid var(--rule);box-shadow:6px 6px 0 var(--rule);padding:var(--s3);display:flex;flex-direction:column;gap:var(--s2)}
.aside h3{font-size:1.4rem;text-transform:uppercase}
.aside ul{margin:0;padding-left:1.1rem;color:var(--ink-soft)}
.related{display:flex;flex-wrap:wrap;gap:.5rem;padding:0;margin:0;list-style:none}
.related a{display:inline-block;background:var(--sheet);border:1px solid var(--rule);padding:.35rem .75rem;text-decoration:none;color:var(--ink);font-weight:500}
.related a:hover{border-color:var(--blue);color:var(--blue)}
.sit a{color:inherit;text-decoration:none}
.sit a.more{color:var(--blue);font-weight:600;font-size:.95rem;margin-top:auto}
.areas a{color:inherit;text-decoration:none;border-bottom:1px solid var(--blue)}
@media (max-width:880px){.article{grid-template-columns:1fr}.aside{position:static}}
