/* Get Local Appeal — sales page. Modern light theme, one accent.
   No framework, no CDN, no build step. Words live in the HTML. */

:root{
  --ink:#111418;
  --ink-soft:#3c4249;
  --dark:#101216;
  --dark-2:#171a1f;
  --paper:#ffffff;
  --mist:#f5f3ef;
  --cream:#efeae0;
  --accent:#f04e23;
  --accent-deep:#c93a12;
  --line:rgba(17,20,24,.13);
  --line-light:rgba(255,255,255,.16);
  --max:1120px;
  --sans:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--sans);color:var(--ink);background:var(--paper);line-height:1.55;font-size:17px}
a{color:inherit}
.wrap{max-width:var(--max);margin:0 auto;padding:0 20px}
section{padding:76px 0}
h1,h2{font-weight:800;line-height:1.04;letter-spacing:-.025em}
h2{font-size:clamp(32px,4.8vw,48px);margin-bottom:14px}
.lede{font-size:clamp(18px,2.2vw,21px);color:var(--ink-soft);max-width:44em}
.kicker{font-size:13px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--accent-deep);margin-bottom:18px}
.step-tag{font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#8a8f96;margin-bottom:10px}

/* ---------- header ---------- */
header.site{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
header.site .wrap{display:flex;align-items:center;gap:22px;padding-top:13px;padding-bottom:13px}
.wordmark{font-size:21px;font-weight:800;letter-spacing:-.02em;text-decoration:none;white-space:nowrap}
.wordmark span{color:var(--accent)}
nav.main{margin-left:auto;display:flex;gap:20px;font-size:15px;font-weight:600}
nav.main a{text-decoration:none;color:var(--ink-soft)}
nav.main a:hover{color:var(--ink);text-decoration:underline}
.head-call{margin-left:6px;background:var(--accent);color:#fff;font-weight:700;text-decoration:none;padding:10px 18px;border-radius:999px;white-space:nowrap}
.head-call:hover{background:var(--accent-deep)}
@media (max-width:760px){nav.main{display:none}}

/* ---------- hero ---------- */
.hero{background:var(--paper);padding:88px 0 80px;border-bottom:1px solid var(--line)}
.hero h1{font-size:clamp(42px,6.8vw,72px);max-width:13em}
.hero h1 em{font-style:normal;color:var(--accent)}
.hero .lede{margin-top:22px;max-width:40em}
.hero .facts{margin-top:28px;display:flex;flex-wrap:wrap;gap:10px 26px;font-size:15.5px;color:var(--ink-soft)}
.hero .facts b{color:var(--ink)}
.cta-row{margin-top:36px;display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.btn{display:inline-block;text-decoration:none;font-weight:700;padding:15px 28px;border-radius:999px;font-size:17px}
.btn-accent{background:var(--accent);color:#fff}
.btn-accent:hover{background:var(--accent-deep)}
.btn-ghost{border:1.5px solid var(--line);color:var(--ink)}
.btn-ghost:hover{border-color:var(--ink)}
.hero .micro{margin-top:16px;font-size:14.5px;color:#7c828a}

/* ---------- problems ---------- */
.problems{background:var(--mist)}
.prob-list{margin-top:38px;border-top:1px solid var(--line)}
.prob{display:grid;grid-template-columns:1fr 1fr;gap:8px 44px;padding:26px 0;border-bottom:1px solid var(--line)}
.prob h3{font-size:21px;font-weight:750;letter-spacing:-.01em}
.prob h3::before{content:"The problem";color:var(--accent-deep);font-size:12.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;display:block;margin-bottom:6px}
.prob .fix{color:var(--ink-soft)}
.prob .fix::before{content:"The fix";color:var(--ink);font-size:12.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;display:block;margin-bottom:6px}
@media (max-width:760px){.prob{grid-template-columns:1fr}}

/* ---------- system ---------- */
.system{background:var(--paper)}
.sys-list{margin-top:40px}
.sys{display:grid;grid-template-columns:86px 1fr;gap:6px 26px;padding:28px 0;border-top:1px solid var(--line)}
.sys:last-child{border-bottom:1px solid var(--line)}
.sys .num{font-size:46px;font-weight:800;line-height:1;letter-spacing:-.03em;color:var(--accent)}
.sys h3{font-size:24px;font-weight:750;letter-spacing:-.015em;margin-bottom:6px}
.sys p{max-width:46em;color:var(--ink-soft)}
.sys .tag{display:inline-block;margin-top:10px;font-size:13.5px;font-weight:700;background:var(--dark);color:#fff;padding:4px 12px;border-radius:999px}
@media (max-width:760px){.sys{grid-template-columns:56px 1fr}.sys .num{font-size:33px}}

/* ---------- demos ---------- */
.demos{background:var(--dark);color:#fff}
.demos .kicker{color:var(--accent)}
.demos .lede{color:#c7ccd4}
.demo-card{margin-top:34px;border:1px solid var(--line-light);background:var(--dark-2);border-radius:18px;padding:30px;display:grid;grid-template-columns:1.2fr .8fr;gap:26px;align-items:center}
.demo-card h3{font-size:26px;font-weight:750;letter-spacing:-.015em;margin-bottom:8px}
.demo-card p{color:#c7ccd4;max-width:34em}
.demo-card .open{text-align:right}
@media (max-width:760px){.demo-card{grid-template-columns:1fr}.demo-card .open{text-align:left}}
.demos .honest{margin-top:18px;font-size:15px;color:#9aa1ab;max-width:52em}
.demos .try{margin-top:26px;border-left:3px solid var(--accent);padding:4px 0 4px 18px;font-size:18px;color:#e7eaee}
.demos .try b{color:#fff}

/* ---------- pricing ---------- */
.pricing{background:var(--mist)}
.price-table{margin-top:36px;border:1px solid var(--line);border-radius:16px;overflow:hidden;background:#fff}
.price-row{display:grid;grid-template-columns:1.1fr 2fr .8fr;gap:18px;padding:20px 24px;border-bottom:1px solid var(--line);align-items:baseline}
.price-row:last-child{border-bottom:none}
.price-row.head{background:var(--dark);color:#fff;font-weight:700}
.price-row .name{font-size:20px;font-weight:750;letter-spacing:-.01em}
.price-row .amt{font-size:22px;font-weight:800;text-align:right;white-space:nowrap}
.price-row .amt small{display:block;font-size:13px;font-weight:600;color:#7c828a}
.price-row.founding{background:#fff1e8}
@media (max-width:760px){
  .price-row{grid-template-columns:1fr;padding:18px}
  .price-row .amt{text-align:left}
  .price-row.head{display:none}
}
.terms{margin-top:22px;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.terms div{background:#fff;border:1px solid var(--line);border-radius:14px;padding:18px}
.terms h4{font-size:16px;margin-bottom:6px}
.terms p{font-size:15px;color:var(--ink-soft)}
@media (max-width:760px){.terms{grid-template-columns:1fr}}
.vs{margin-top:26px;font-size:16px}
.vs li{margin:8px 0 8px 20px}
.vs b{color:var(--accent-deep)}

/* ---------- founder ---------- */
.founder{background:var(--paper)}
blockquote.pledge{font-size:clamp(23px,3vw,30px);font-weight:650;line-height:1.32;letter-spacing:-.015em;max-width:22em}
.sign{margin-top:20px;font-size:16.5px;color:var(--ink-soft);max-width:40em}
.sign b{color:var(--ink);font-size:18px}

/* ---------- steps ---------- */
.steps{background:var(--paper);padding:56px 0;border-top:1px solid var(--line)}
.steps .strip{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:8px}
.steps .st{border-top:3px solid var(--accent);padding-top:12px}
.steps .st b{display:block;font-size:18px;margin-bottom:4px}
.steps .st span{font-size:15px;color:var(--ink-soft)}
@media (max-width:760px){.steps .strip{grid-template-columns:1fr 1fr}}

/* ---------- faq ---------- */
.faq{background:var(--paper);padding-top:24px}
.faq-list{margin-top:30px;border-top:1px solid var(--line)}
.faq-item{padding:22px 0;border-bottom:1px solid var(--line)}
.faq-item h3{font-size:19px;font-weight:750;margin-bottom:6px}
.faq-item p{max-width:48em;color:var(--ink-soft)}

/* ---------- final cta ---------- */
.final{background:var(--dark);color:#fff}
.final .kicker{color:var(--accent)}
.final .lede{color:#c7ccd4}
.final .micro{margin-top:16px;font-size:14.5px;color:#9aa1ab}
.btn-ghost-light{border:1.5px solid var(--line-light);color:#fff}
.btn-ghost-light:hover{border-color:#fff}

/* ---------- footer ---------- */
footer.site{background:#0a0b0d;color:#9aa1ab;padding:40px 0 110px;font-size:15px}
footer.site .wrap{display:flex;flex-wrap:wrap;gap:10px 30px;align-items:baseline}
footer.site b{color:#fff;font-size:17px}
footer.site a{color:var(--accent)}

/* ---------- mobile call bar ---------- */
.callbar{display:none}
@media (max-width:760px){
  .callbar{display:grid;grid-template-columns:1fr 1fr;position:fixed;left:0;right:0;bottom:0;z-index:60;background:var(--dark);border-top:1px solid var(--line-light)}
  .callbar a{padding:15px 10px;text-align:center;text-decoration:none;font-weight:700;color:#fff;font-size:16px}
  .callbar a.accent{background:var(--accent);color:#fff}
}