/* Roadlens visual system, locked Sep 26 2026. Shared by every page except the guides. */
:root{
  --asphalt:#192321;--warm:#F3F3E9;--lime:#D9F568;--slate:#6B6F72;--mist:#B5BDB6;
  --surface:#232E29;--line:#D9DDD4;--line-dark:#3B4841;
  --max:1280px;--pad:64px;--section:96px;--gap:48px;--nav:88px;
  --s1:8px;--s2:16px;--s3:24px;--s4:32px;--s5:48px;--s6:64px;--s7:96px;
  --r-btn:6px;--r-card:8px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:var(--nav)}
body{font-family:"Figtree",system-ui,-apple-system,"Segoe UI",sans-serif;background:var(--warm);color:var(--asphalt);font-size:18px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,picture,video,iframe,svg{display:block;max-width:100%}
a{color:inherit}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
.wrap{width:100%;max-width:var(--max);margin-inline:auto;padding-inline:var(--pad)}
section{padding-block:var(--section)}
.dark{background:var(--asphalt);color:var(--warm)}
.eyebrow{font-size:12px;font-weight:600;line-height:1.4;letter-spacing:.14em;text-transform:uppercase;color:var(--slate)}
.dark .eyebrow{color:var(--lime)}
h1,h2,h3{font-weight:700}
.display{font-size:64px;font-weight:800;line-height:1.02;letter-spacing:-.04em}
.h2{font-size:48px;line-height:1.1;letter-spacing:-.03em}
.h3{font-size:24px;line-height:1.2}
.lede{font-size:20px;line-height:1.5;color:var(--slate)}
.dark .lede,.dark .muted{color:var(--mist)}
.muted{color:var(--slate)}
.caption{font-size:13px;line-height:1.45;color:var(--slate)}
.dark .caption{color:var(--mist)}
.ic{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.75;transition:transform .2s;flex:none}
/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s1);height:48px;padding:0 24px;border-radius:var(--r-btn);font-family:inherit;font-weight:600;font-size:16px;line-height:1.25;text-decoration:none;border:1.5px solid transparent;cursor:pointer;transition:filter .2s,background .2s,color .2s;white-space:nowrap}
.btn-primary{background:var(--lime);color:var(--asphalt)}
.btn-primary:hover{filter:brightness(.95)}
.btn-outline{border-color:var(--asphalt);color:var(--asphalt);background:transparent}
.btn-outline:hover{background:var(--asphalt);color:var(--warm)}
.dark .btn-outline{border-color:var(--warm);color:var(--warm)}
.dark .btn-outline:hover{background:var(--warm);color:var(--asphalt)}
.btn:hover .ic,.link-arrow:hover .ic{transform:translateX(3px)}
.link-arrow{display:inline-flex;align-items:center;gap:var(--s1);font-weight:600;font-size:16px;line-height:1.25;text-decoration:none;padding-bottom:4px;border-bottom:1.5px solid currentColor}
:focus-visible{outline:2px solid var(--asphalt);outline-offset:3px}
.dark :focus-visible{outline-color:var(--lime)}
/* nav */
.nav{position:sticky;top:0;z-index:30;height:var(--nav);background:var(--warm);border-bottom:1px solid transparent;transition:border-color .2s}
.nav.scrolled{border-bottom-color:var(--line)}
.nav .wrap{height:100%;display:flex;align-items:center;gap:var(--s4)}
.brand{display:block;flex:none}
.logo{display:block;width:auto;color:var(--asphalt)}
.brand .logo{height:40px}
.links{margin-left:auto;display:flex;align-items:center;gap:var(--s4)}
.links a:not(.btn){font-size:15px;font-weight:500;line-height:1.4;text-decoration:none}
.links a:not(.btn):hover,.links a[aria-current]{text-decoration:underline;text-underline-offset:6px}
.nav .btn{height:44px}
/* footer */
.site-footer{position:relative;overflow:hidden;padding-top:var(--s7)}
.foot-cta{position:relative;min-height:400px;padding-bottom:var(--s5)}
.foot-cta .display{max-width:760px;margin-top:var(--s2)}
.foot-cta .lede{margin-top:var(--s3);color:var(--warm)}
.foot-cta .btn{margin-top:var(--s4)}
.foot-road{position:absolute;right:calc(var(--pad) * -1 - 40px);bottom:0;width:min(46vw,640px);height:auto;pointer-events:none}
.foot-row{display:flex;justify-content:space-between;align-items:center;gap:var(--s3);border-top:1px solid var(--line-dark);padding-top:var(--s3);position:relative}
.foot-row p{font-size:16px;color:var(--warm)}
.foot-links{display:flex;flex-wrap:wrap;gap:var(--s1) var(--s4)}
.foot-links a{font-size:16px;text-decoration:none;color:var(--warm)}
.foot-links a:hover{color:var(--lime)}
.foot-mark{margin:var(--s5) 0 var(--s4)}
.foot-mark .logo{width:100%;height:auto;color:var(--warm)}
.foot-bottom{display:flex;justify-content:space-between;align-items:center;gap:var(--s3);border-top:1px solid var(--line-dark);padding:var(--s3) 0 var(--s4);font-size:14px;color:var(--mist)}
.foot-bottom a{color:var(--warm);text-decoration:none}
.foot-bottom a:hover{color:var(--lime)}
.foot-bottom nav{display:flex;align-items:center;gap:var(--s3)}
.foot-bottom .sep{width:1px;height:16px;background:var(--line-dark)}
.reveal{opacity:0;transform:translateY(16px);transition:opacity .6s ease,transform .6s ease}
.reveal.in{opacity:1;transform:none}
/* forms (pilot page) */
.form{display:flex;flex-direction:column;gap:var(--s2);border:1px solid var(--line);border-radius:var(--r-card);padding:var(--s4);background:var(--warm)}
.form-row{display:flex;gap:var(--s2)}
.form-row input{flex:1;min-width:0}
.form label{display:block;margin-bottom:6px;font-size:13px;font-weight:600;letter-spacing:.02em}
.form input,.form textarea{font-family:inherit;font-weight:400;font-size:16px;line-height:1.4;color:var(--asphalt);background:#FBFBF6;border:1px solid var(--line);border-radius:var(--r-btn);padding:12px 16px;width:100%;outline:none;transition:border-color .2s}
.form input{height:48px}
.form ::placeholder{color:var(--slate);opacity:1}
.form input:focus,.form textarea:focus{border-color:var(--asphalt)}
.form textarea{resize:vertical;min-height:140px}
.form .btn{align-self:flex-start}
.form .btn[disabled]{opacity:.6;cursor:default}
.hp{position:absolute;left:-9999px;height:0;width:0;padding:0;border:0;overflow:hidden}
.form-status{font-size:14px;min-height:1.4em;color:var(--slate)}
.form-status a{font-weight:600}
@media(max-width:1100px){:root{--pad:48px}.display{font-size:56px}}
@media(max-width:900px){
  :root{--pad:24px;--section:56px;--gap:32px;--nav:72px}
  body{font-size:16px}
  .links a:not(.btn){display:none}
  .nav .btn{height:40px;padding:0 16px;font-size:15px}
  .brand .logo{height:34px}
  .display{font-size:40px}
  .h2{font-size:32px}.h3{font-size:22px}.lede{font-size:18px}
  .foot-cta{min-height:0}
  .foot-road{display:none}
  .foot-row,.foot-bottom{flex-direction:column;align-items:flex-start}
  .foot-links{gap:var(--s1) var(--s3)}
  .form{padding:20px}
}
@media(max-width:480px){.form-row{flex-direction:column}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}.btn,.ic{transition:none}}