/* tp-light.css — re-skins the older totalpro360.com pages (dark teal) onto the shared sister-site
 * palette (2026-10-21). Load order on each page: page <style> → /assets/site.css (shared with
 * myhomeservice360.com, owns the variables) → this file. Fallback values below only apply until
 * /assets/site.css defines them. Every color here comes from a variable.
 */
html body{background:var(--bg);color:var(--ink-2);font-family:var(--font-sans)}
body{--tl:var(--brand);--tl-light:var(--brand);--sky:var(--brand);--grad:var(--brand)}
a{color:var(--brand)}
.tlg{background:none!important;-webkit-text-fill-color:var(--ink)!important;color:var(--ink)!important}
h1,h2,h3,h4{color:var(--ink);font-family:var(--font-display)}
.lede,.dek{color:var(--ink-2)}
p,li{color:inherit}
section{border-top-color:var(--line)}
.crumb,.crumb a,.meta,.muted{color:var(--muted)}
.tag{background:var(--bg-soft);color:var(--brand);border-color:var(--line)}
.card,.free-box,.pl2,.pcard,.keypoints,.endcta{background:var(--surface)!important;border:1px solid var(--line)!important;box-shadow:var(--shadow);color:var(--ink-2)}
.free-box{border-left:5px solid var(--brand)!important}
.card p,.faq p,.status li,.pains li,.pl2 span,.pcard p{color:var(--ink-2)!important}
.pl2 span,.pcard h3,.pcard h2{color:var(--ink)!important}
.faq{border-top-color:var(--line)}
.btn,.links a.btn,.cta .btn{background:var(--brand)!important;color:var(--on-brand)!important;border:2px solid var(--brand)!important;box-shadow:none!important;border-radius:10px;font-size:16px;min-height:48px}
.btn:hover,.links a.btn:hover{background:var(--brand-hover)!important;border-color:var(--brand-hover)!important}
.btn.ghost,.links a.btn.ghost{background:var(--surface)!important;color:var(--brand)!important;border:2px solid var(--brand)!important}
.links a{background:var(--surface);border-color:var(--line);color:var(--ink-2);font-size:15px;font-weight:600}
.links a:hover{border-color:var(--brand);color:var(--brand)}
.cta{background:var(--bg-soft)!important;border-radius:16px;padding-left:16px;padding-right:16px}
.shot,figure img{border-color:var(--line)!important;background:var(--surface)!important}
figcaption{color:var(--muted)}
.status li::before,.pains li::before{color:var(--brand)}
.status .build li::before{color:var(--accent)}
.pcat{color:var(--brand)!important}
/* inline colors written for the dark theme */
[style*="color:#9ca3af"],[style*="color:#4b5563"],[style*="color:var(--gray-1)"]{color:var(--muted)!important}
[style*="color:#f2f7f7"],[style*="color:#fff"]{color:var(--ink)!important}
[style*="color:#5eead4"],[style*="color:var(--tl"],[style*="color:#d4a017"],[style*="color:var(--gold)"]{color:var(--brand)!important}
[style*="color:#f59e0b"]{color:#8a4b00!important}
#foundingStrip{background:var(--ink)!important;color:#fff!important}
#foundingStrip span{color:#fff}
.hero-mark{width:clamp(120px,28vw,168px)!important}
/* forms on the older early-access / founding pages */
input,select,textarea{background:#fff!important;color:var(--ink)!important;border:1.5px solid #b9b4a6!important}
input::placeholder,textarea::placeholder{color:#7a8190!important}
label{color:var(--ink)}

/* sister-site header/footer chrome (same markup as the generated pages) */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.lp-wrap{max-width:1040px;margin:0 auto;padding:0 20px}
.lp-aud{background:var(--ink);color:#fff;font-size:14px}
.lp-aud-in{max-width:1040px;margin:0 auto;padding:6px 20px;display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.lp-aud span{opacity:.8;margin-right:4px}
.lp-aud a{color:#fff;text-decoration:none;padding:5px 11px;border-radius:999px;border:1px solid rgba(255,255,255,.35)}
.lp-aud a.on{background:#fff;color:var(--ink);font-weight:700;border-color:#fff}
.lp-hd{background:var(--surface);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:50}
.lp-hd-in{max-width:1040px;margin:0 auto;padding:10px 20px;display:flex;align-items:center;justify-content:space-between;gap:12px}
.lp-logo{display:flex;align-items:center;gap:9px;text-decoration:none;color:var(--ink);font-weight:800;font-size:17px;letter-spacing:-.01em}
.lp-logo img{width:32px;height:32px;object-fit:contain}
.lp-nav{display:flex;align-items:center;gap:18px}
.lp-nav a{color:var(--ink-2);text-decoration:none;font-weight:600;font-size:15px}
.lp-nav a:hover{color:var(--brand)}
.lp-btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px 22px;border-radius:10px;background:var(--brand);color:var(--on-brand)!important;font-weight:700;font-size:16px;text-decoration:none;border:2px solid var(--brand);cursor:pointer;font-family:inherit}
.lp-btn:hover{background:var(--brand-hover);border-color:var(--brand-hover)}
.lp-btn-sm{min-height:42px;padding:9px 16px;font-size:15px}
.lp-btn-alt{background:var(--surface);color:var(--brand)!important}
.lp-btn-alt:hover{background:var(--bg-soft)}
.lp-crumb{font-size:14px;color:var(--muted);padding-top:18px}
.lp-crumb a{color:var(--muted)}
.lp-hero{padding:22px 0 40px}
.lp-tag{display:inline-block;font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--brand);background:var(--bg-soft);border:1px solid var(--line);padding:4px 12px;border-radius:999px}
.lp-lede{font-size:clamp(17px,2.1vw,20px);color:var(--ink-2);max-width:760px}
.lp-cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}
.lp-sec{padding:44px 0;border-top:1px solid var(--line)}
.lp-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:20px}
.lp-grid.two{grid-template-columns:repeat(2,1fr)}
.lp-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow)}
.lp-card p{margin:0;font-size:16px}
.lp-box{background:var(--surface);border:1px solid var(--line);border-left:5px solid var(--brand);border-radius:var(--radius);padding:22px;box-shadow:var(--shadow)}
.lp-fees{margin:10px 0 0;padding-left:20px}
.lp-fees li{margin-bottom:6px}
.lp-table-wrap{overflow-x:auto;margin-top:16px;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface)}
.lp-src{font-size:14px;color:var(--muted);margin-top:10px}
.lp-faq{border-top:1px solid var(--line);padding:16px 0}
.lp-faq h3{margin-bottom:4px}
.lp-faq p{margin:0}
.lp-links{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.lp-links a{display:inline-flex;align-items:center;min-height:42px;padding:8px 14px;border:1px solid var(--line);border-radius:999px;background:var(--surface);color:var(--ink-2);text-decoration:none;font-size:15px;font-weight:600}
.lp-links a:hover{border-color:var(--brand);color:var(--brand)}
.lp-soon{display:inline-block;font-size:12px;font-weight:700;color:var(--ink-2);background:var(--bg-soft);border:1px solid var(--line);border-radius:6px;padding:1px 7px;margin-left:6px;vertical-align:middle}
.lp-ft{border-top:1px solid var(--line);background:var(--surface);padding:28px 0 36px;margin-top:20px;font-size:15px;color:var(--muted)}
.lp-ft nav{display:flex;flex-wrap:wrap;gap:6px 18px;margin-bottom:10px}
.lp-ft a{color:var(--ink-2);text-decoration:none}
.lp-ft a:hover{text-decoration:underline}
.lp-ft p{margin:0}
.lp-form{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:22px;box-shadow:var(--shadow)}
.lp-form .row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.lp-form label{display:block;font-weight:700;color:var(--ink);font-size:15px;margin:12px 0 5px}
.lp-form input[type=text],.lp-form input[type=email],.lp-form input[type=tel],.lp-form input[type=password],.lp-form select{width:100%;min-height:48px;padding:11px 12px;border:1.5px solid #b9b4a6;border-radius:10px;font-size:16px;font-family:inherit;color:var(--ink);background:#fff}
.lp-form .chk{display:flex;gap:10px;align-items:flex-start;font-weight:500;font-size:15px;color:var(--ink-2);margin-top:14px}
.lp-form .chk input{width:22px;height:22px;margin-top:2px;flex:0 0 22px}
.lp-form .hint{font-size:14px;color:var(--muted);margin-top:4px}
.lp-hp{position:absolute!important;left:-10000px!important;width:1px;height:1px;overflow:hidden}
.lp-err{display:none;background:#fdecec;color:#8a1c1c;border:1px solid #f2b8b8;border-radius:10px;padding:12px 14px;margin-top:14px;font-weight:600}
.lp-split{display:grid;grid-template-columns:1.1fr .9fr;gap:28px;align-items:start}
@media (max-width:860px){.lp-grid{grid-template-columns:1fr 1fr}.lp-split{grid-template-columns:1fr}}
@media (max-width:640px){
  .lp-wrap,.lp-hd-in,.lp-aud-in{padding-left:16px;padding-right:16px}
  .lp-grid,.lp-grid.two,.lp-form .row{grid-template-columns:1fr}
  .lp-nav{gap:12px}.lp-nav a{font-size:14px}.lp-hide-sm{display:none}
  .lp-logo span{font-size:15px}
  .lp-cta .lp-btn{width:100%}
  .lp-sec{padding:34px 0}
}
@media (max-width:420px){.lp-nav .lp-nav-pricing{display:none}.lp-logo span{font-size:14px}}
@media (max-width:860px){.lp-split>div:last-child{order:-1}}
/* blog + homepage leftovers */
.keypoints li,.post p,.post li,.pcard p,.pl2 span{color:var(--ink-2)!important}
.post h2,.post h3,.pcard h3{color:var(--ink)!important}
.lede,.dek,.dek p{color:var(--ink-2)!important}
.meta,figcaption,#launch-countdown .lc-sub{color:var(--muted)!important}
.keypoints li::before{color:var(--brand)!important}
.hero-mark,.lp-logo img,.hd-brand img,.nav-brand img{border-radius:22%}
/* early-access + founding pages (their own variable names) */
body{--black:var(--bg);--gray-3:var(--ink-2);--gray-2:var(--muted);--gray-1:var(--muted);--dark-1:var(--surface);--dark-2:var(--surface);--dark-3:var(--bg-soft);--dark-4:var(--line);--dark-5:var(--bg-soft);--dark-6:var(--line);--gold-grad:var(--brand);--gold-light:var(--brand)}
.gold-text{background:none!important;-webkit-text-fill-color:var(--ink)!important;color:var(--ink)!important}
.nav-brand,.value h3,.card h2,.seg label .t,.done h2,td strong,summary,p.lead{color:var(--ink)!important}
.value,.card,.seg label,details,table,.box{background:var(--surface)!important;border-color:var(--line)!important}
.value p,.card .sub,.seg label .d,.field label.lb,.fineprint,.done p,.note,.muted,th,p{color:var(--ink-2)}
.eyebrow,.plus,.pos,.ok,.chip.on,.gaten{color:var(--brand)!important}
.msg.err,.err{color:#8a1c1c!important}
nav.nav,.nav{background:var(--surface)!important;border-color:var(--line)!important}
