/* home page — ported 1:1 from fieldbench-web-home.html */

/* hero */
.hero{padding:84px 0 0;text-align:center}
.hero .kick{font-size:13px;color:var(--blue);font-weight:500;letter-spacing:.05em}
.hero h1{font-size:54px;font-weight:500;letter-spacing:-.025em;line-height:1.12;margin:18px auto 0;max-width:820px}
.hero .sub{font-size:17px;color:var(--pewter);max-width:640px;margin:20px auto 0;line-height:1.6}
.hero .ctas{display:flex;gap:12px;justify-content:center;margin-top:30px}
.hero .ctas .primary{height:46px;padding:0 28px;font-size:15px}
.hero .ctas .tint{height:46px;padding:0 24px;font-size:15px}
.hero .meta{margin-top:14px;font-size:12.5px;color:var(--silver)}
.hero .meta b{color:var(--pewter);font-weight:400}

/* hero app shot */
.shot{margin:52px auto 0;max-width:1040px;border:1px solid var(--cloud);border-radius:10px;overflow:hidden;text-align:left;font-size:11px}
.s-tb{height:34px;display:flex;align-items:center;gap:12px;padding:0 14px;background:var(--bg);border-bottom:1px solid var(--cloud)}
.s-tb .lg{display:flex;align-items:center;gap:7px;font-size:10px;letter-spacing:.14em;font-weight:500;color:var(--pewter)}
.s-tb .lg i{width:13px;height:13px;border-radius:3px;display:block;background:url('/favicon.svg') center/contain no-repeat}
.s-tab{display:flex;align-items:center;gap:6px;height:26px;padding:0 11px;background:var(--white);border:1px solid var(--cloud);border-bottom:0;border-radius:4px 4px 0 0;margin-top:8px;align-self:flex-end;font-size:11px}
.s-tab .k{font-family:var(--mono);font-size:8.5px;color:var(--blue);text-transform:uppercase}
.s-tool{height:36px;display:flex;align-items:center;gap:10px;padding:0 14px;background:var(--white);border-bottom:1px solid var(--cloud)}
.s-ctl{display:flex;height:24px;border:1px solid var(--cloud);border-radius:var(--r);overflow:hidden;font-family:var(--mono);font-size:10px;color:var(--carbon)}
.s-ctl span{display:flex;align-items:center;padding:0 9px}
.s-ctl span+span{border-left:1px solid var(--cloud)}
.s-lens{display:flex;height:24px;border:1px solid var(--cloud);border-radius:var(--r);overflow:hidden;font-size:10.5px}
.s-lens span{display:flex;align-items:center;padding:0 10px;color:var(--pewter)}
.s-lens .on{background:var(--blue-tint);color:var(--blue);font-weight:500}
.s-run{margin-left:auto;display:flex;align-items:center;gap:6px;font-size:10.5px;color:var(--pewter)}
.s-run i{width:5px;height:5px;border-radius:50%;background:var(--green);display:block}
.s-main{display:grid;grid-template-columns:1fr 300px;background:var(--white)}
.s-rows{border-right:1px solid var(--cloud)}
.s-row{display:grid;grid-template-columns:88px 40px 40px 1fr 210px;align-items:center;height:25px;padding:0 12px;border-bottom:1px solid rgba(23,26,32,.045);font-family:var(--mono);font-size:10px;color:var(--silver)}
.s-row .d.tx{color:var(--amber);font-weight:500}.s-row .d.rx{color:#1989FA;font-weight:500}
.s-row .f{display:flex;gap:7px;font-size:10px}
.s-row .f .a{color:var(--f-addr);font-weight:500}.s-row .f .fc{color:var(--f-func);font-weight:500}.s-row .f .t{color:var(--graphite);font-family:var(--sans);font-size:10.5px}
.s-row .tag{margin-left:auto;font-size:8.5px;letter-spacing:.06em}
.s-row .tag.ok{color:var(--green)}
.s-row .tag.err{color:var(--red);background:#D9342B14;border-radius:20px;padding:1.5px 7px}
.s-row.err{background:#D9342B08;box-shadow:inset 2px 0 0 var(--blue)}
.s-ai{padding:12px 14px;display:flex;flex-direction:column;gap:9px}
.s-ai .h{display:flex;gap:7px;font-family:var(--mono);font-size:8.5px;letter-spacing:.12em;color:var(--blue);text-transform:uppercase}
.s-ai p{font-size:11px;line-height:1.55;color:var(--graphite)}
.s-ai p b{font-family:var(--mono);font-weight:500;color:var(--red);font-size:10.5px}
.s-ai .c{display:flex;gap:8px;font-size:10.5px;color:var(--graphite);border-bottom:1px solid rgba(23,26,32,.04);padding:5px 0}
.s-ai .c i{font-style:normal;font-family:var(--mono);font-size:9px;color:var(--blue)}
.shotcap{font-size:12px;color:var(--silver);margin-top:12px}

/* story 3 steps */
.story{padding:96px 0 30px}
.sec-kick{font-size:13px;color:var(--blue);font-weight:500;text-align:center}
.sec-h2{font-size:34px;font-weight:500;letter-spacing:-.02em;text-align:center;margin-top:12px}
.sec-sub{font-size:15px;color:var(--pewter);text-align:center;margin-top:12px}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:44px}
.step{background:var(--bg);border:1px solid var(--cloud);border-radius:12px;padding:26px 24px}
.step .n{font-family:var(--mono);font-size:11px;color:var(--blue);letter-spacing:.1em}
.step h3{font-size:17px;font-weight:500;margin-top:10px}
.step p{font-size:13.5px;color:var(--pewter);margin-top:8px;line-height:1.6}

/* features */
.features{padding:80px 0 20px}
.fgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:44px}
.fcard{border:1px solid var(--cloud);border-radius:12px;padding:24px 22px}
.fcard .ic{width:34px;height:34px;border-radius:8px;background:var(--blue-tint);color:var(--blue);display:flex;align-items:center;justify-content:center;font-size:15px}
.fcard h3{font-size:15.5px;font-weight:500;margin-top:14px}
.fcard p{font-size:13px;color:var(--pewter);margin-top:7px;line-height:1.6}

/* compare */
.compare{padding:80px 0 20px}
.ctable{margin-top:44px;border:1px solid var(--cloud);border-radius:12px;overflow:hidden}
.crow{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;align-items:center}
.crow>div{padding:13px 20px;font-size:13.5px;border-bottom:1px solid var(--cloud)}
.crow:last-child>div{border-bottom:none}
.crow.head>div{background:var(--bg);font-weight:500;font-size:13px}
.crow.head .us{color:var(--blue)}
.crow .lbl{color:var(--graphite)}
.crow .v{font-family:var(--mono);font-size:12px;color:var(--pewter);text-align:center}
.crow .v.y{color:var(--blue);font-weight:500}
.crow .v.n{color:#C4C6C9}
.cfoot{font-size:12px;color:var(--silver);margin-top:12px}

/* pricing */
.pricing{padding:80px 0 30px}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:44px;align-items:stretch}
.pcard{border:1px solid var(--cloud);border-radius:12px;padding:28px 26px;display:flex;flex-direction:column;background:var(--white)}
.pcard.hot{border-color:var(--blue);position:relative}
.pcard .flag{position:absolute;top:-11px;left:24px;background:var(--blue);color:#fff;font-size:10.5px;font-weight:500;letter-spacing:.06em;padding:3px 10px;border-radius:20px}
.pcard h3{font-size:15px;font-weight:500}
.pcard .price{margin-top:14px;display:flex;align-items:baseline;gap:8px}
.pcard .price b{font-size:38px;font-weight:500;letter-spacing:-.02em}
.pcard .price s{font-size:16px;color:var(--silver);font-weight:400}
.pcard .per{font-size:12.5px;color:var(--silver)}
.pcard .per a{color:var(--blue)}
.pcard ul{list-style:none;margin-top:18px;flex:1}
.pcard li{font-size:13px;color:var(--graphite);padding:6px 0;display:flex;gap:9px}
.pcard li i{font-style:normal;color:var(--blue);font-size:11px;padding-top:1px}
.pcard li.dim{color:var(--silver)}
.pcard li.dim i{color:#C4C6C9}
.pcard .btn{margin-top:20px;height:42px;font-size:14px}
.pcard .note{font-size:11.5px;color:var(--silver);margin-top:10px;text-align:center}
.bundle{margin-top:16px;background:var(--ash);border-radius:8px;padding:14px 18px;font-size:13px;color:var(--pewter);text-align:center}
.bundle b{color:var(--carbon);font-weight:500}
.bundle a{color:var(--blue);font-weight:500}
.guarantee{display:flex;gap:26px;justify-content:center;margin-top:22px;font-size:12.5px;color:var(--silver)}

/* faq */
.faq{padding:80px 0}
.qas{max-width:760px;margin:40px auto 0}
.qa{border-bottom:1px solid var(--cloud);padding:18px 0}
.qa h3{font-size:15px;font-weight:500}
.qa p{font-size:13.5px;color:var(--pewter);margin-top:8px;line-height:1.65}

/* footer cta + big footer (home only) */
.fcta{background:var(--bg);border-top:1px solid var(--cloud);padding:76px 0;text-align:center}
.fcta h2{font-size:32px;font-weight:500;letter-spacing:-.02em}
.fcta p{font-size:14.5px;color:var(--pewter);margin-top:10px}
.fcta .btn{margin-top:26px;height:46px;padding:0 30px;font-size:15px}
footer.big{border-top:1px solid var(--cloud);padding:44px 0 60px}
.f-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:24px}
.f-grid h5{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--silver);margin-bottom:12px;font-family:var(--mono)}
.f-grid a{display:block;font-size:13px;color:var(--pewter);padding:4px 0}
.f-brand p{font-size:12.5px;color:var(--silver);margin-top:12px;line-height:1.6;max-width:260px}
.legal{margin-top:36px;padding-top:18px;border-top:1px solid var(--cloud);font-size:12px;color:var(--silver);display:flex;gap:18px}
@media(max-width:900px){.steps,.fgrid,.cards,.f-grid{grid-template-columns:1fr}.hero h1{font-size:36px}.s-main{grid-template-columns:1fr}.s-ai{display:none}}
