/* Bottleneck Audit landing page (/audit) — loads after css/main.css and reuses
   its brand tokens, FAQ and footer styles. CSS-only, no GSAP: ad traffic lands
   here on mobile, so it stays light. */

/* main.css's nav is transparent over the hero; give it a backing here */
.lp nav{background:rgba(12,22,16,.94);border-bottom:1px solid var(--line)}

.lp-main{max-width:1180px;margin:0 auto;padding:130px 40px 40px}
.lp-hero{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:64px;align-items:start}
.lp-hero h1{
  font-family:var(--mono);font-weight:800;font-size:clamp(30px,4.4vw,56px);
  line-height:1.06;letter-spacing:-0.04em;max-width:16ch;margin-bottom:26px;
}
.lp-hero h1 em{font-style:normal;color:var(--brass)}
.lp-lead{font-size:19px;color:var(--dim);max-width:46ch}
.lp-lead strong{color:var(--white);font-weight:500}
/* Jump-to-form button: only shown once the form stacks below the hero (see media query) */
.lp-jump{display:none;margin-top:26px;padding:16px 26px;font-size:13px;text-align:center;min-height:48px}
.lp-points{list-style:none;margin-top:34px;border-top:1px solid var(--line)}
.lp-points li{display:grid;grid-template-columns:44px 1fr;gap:10px;padding:16px 0;border-bottom:1px solid var(--line);font-size:16px}
.lp-points .n{font-family:var(--mono);font-size:11px;color:var(--brass);padding-top:4px}

/* ---------- FORM ---------- */
.lp-form{background:var(--g1);border:1px solid var(--line);border-radius:12px;padding:30px 28px;scroll-margin-top:90px}
.lp-form h2{font-size:22px;margin-bottom:6px}
.lp-form .sub{color:var(--dim);font-size:15px;margin-bottom:22px}
.field{margin-bottom:16px}
.field label{display:block;font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--dim);margin-bottom:7px}
.field input,.field textarea{
  width:100%;background:var(--g0);border:1px solid var(--sage);border-radius:6px; /* sage: 4.9:1 on g0, 4.5:1 on g1 (WCAG 1.4.11) */
  padding:12px 14px;color:var(--white);font-family:var(--sans);font-size:16px; /* 16px stops iOS zoom */
}
.field textarea{min-height:110px;resize:vertical}
.field input:focus,.field textarea:focus{outline:2px solid var(--brass);outline-offset:2px;border-color:var(--brass)}
.field [aria-invalid="true"]{border-color:#D9826B;box-shadow:0 0 0 1px #D9826B} /* 2px-weight red so it reads apart from sage resting and brass focus */
.field .err{display:block;color:#E59A86;font-size:13px;margin-top:6px}
.field .err:empty{display:none}
.vh{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.lp-form .btn{width:100%;padding:17px 20px;font-size:13px;border:0;cursor:pointer;text-align:center}
.lp-form .btn[disabled]{opacity:.6;cursor:wait}
.form-msg{color:#E59A86;font-size:14px;margin-top:14px}
.form-msg:empty{display:none}
.form-msg a,.privacy a{color:var(--brass)}
.privacy{color:var(--dim);font-size:13px;margin-top:14px}

/* ---------- SECTIONS ---------- */
.lp-sec{padding:110px 0 0}
.lp-sec h2{margin-bottom:34px}
.proof-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.proof-card{
  display:flex;flex-direction:column;gap:12px;background:var(--g1);border:1px solid var(--line);
  border-radius:12px;padding:24px;text-decoration:none;color:var(--white);
  transition:border-color .2s,background .2s;
}
.proof-card:hover{border-color:rgba(190,162,106,0.55);background:var(--g2)}
.proof-card .k{font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--brass)}
.proof-card h3{font-size:19px;line-height:1.25}
.proof-card p{color:var(--dim);font-size:15px;flex:1}
.proof-card .go{font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--dim)}
.lp .faqs{margin-top:0}
.lp-cta{text-align:center;padding:100px 0 90px}
.lp-cta h2{margin:0 auto 30px}
.lp-cta .btn{padding:18px 34px;font-size:13px}

/* ---------- THANK YOU ---------- */
.lp-thanks{max-width:720px;margin:0 auto;padding:170px 24px 120px}
.lp-thanks h1{font-family:var(--mono);font-weight:800;font-size:clamp(30px,4.4vw,52px);line-height:1.08;letter-spacing:-0.04em;margin-bottom:24px}
.lp-thanks p{color:var(--dim);font-size:18px;max-width:52ch;margin-bottom:18px}
.lp-thanks ol{margin:30px 0 40px;list-style:none;border-top:1px solid var(--line)}
.lp-thanks li{padding:16px 0;border-bottom:1px solid var(--line);display:grid;grid-template-columns:44px 1fr;gap:10px}
.lp-thanks li .n{font-family:var(--mono);font-size:11px;color:var(--brass);padding-top:4px}
.lp-thanks a{color:var(--brass)}
.lp-book{background:var(--g1);border:1px solid var(--line);border-radius:12px;padding:26px 28px;margin:30px 0 0}
.lp-book h2{font-size:20px;max-width:none;margin-bottom:16px}
.lp-thanks .lp-book .btn{color:var(--g0);padding:17px 30px;font-size:13px}
.lp-thanks .lp-book p{font-size:15px;margin:14px 0 0}

@media(max-width:860px){
  .lp-main{padding:100px 22px 30px}
  .lp-hero{grid-template-columns:1fr;gap:36px}
  .lp-lead{font-size:17px}
  .lp-jump{display:block}
  .proof-grid{grid-template-columns:1fr}
  .lp-sec{padding-top:80px}
  .lp-form{padding:24px 20px}
  .lp-thanks{padding:130px 22px 90px}
  .lp-book{padding:22px 20px}
  .lp-thanks .lp-book .btn{display:block;text-align:center}
}