/* ClarGo site layout — built on modernist.css tokens. */
html{scroll-behavior:smooth;scroll-padding-top:80px}
body{min-height:100vh;display:flex;flex-direction:column;font-size:14px}
main{flex:1}
a{color:var(--color-accent-700)}a:hover{color:var(--color-accent)}
.wrap{max-width:1320px;margin:0 auto;padding-left:clamp(20px,4vw,48px);padding-right:clamp(20px,4vw,48px)}
.skip{position:absolute;left:-9999px;top:0;background:var(--color-text);color:var(--color-bg);padding:12px 16px;z-index:100}
.skip:focus{left:0}
.dim{opacity:.7}.b{font-weight:600}.nw{white-space:nowrap}
.red{color:var(--color-accent)}
/* header */
.hdr{position:sticky;top:0;z-index:20;background:var(--color-bg);border-bottom:2px solid var(--color-divider)}
.hdr-in{display:flex;align-items:center;gap:clamp(16px,3vw,40px);padding-top:16px;padding-bottom:16px}
.brand{display:flex;align-items:center;gap:10px;color:var(--color-text)!important;text-decoration:none;font-weight:800;font-size:19px;letter-spacing:-.03em;margin-right:auto}
.brand .sq{width:18px;height:18px;background:var(--color-accent);display:inline-block}
.brand.sm{font-size:18px;gap:8px;margin:0}.brand.sm .sq{width:14px;height:14px}
.nav-links{display:flex;gap:clamp(14px,2.4vw,32px);font-size:15px}
.nav-links a{color:var(--color-text);text-decoration:none;white-space:nowrap}
.nav-links a:hover,.nav-links a[aria-current=page]{color:var(--color-accent-700)}
.hdr-cta{font-size:15px;padding:12px 18px;gap:16px;white-space:nowrap}
.menu-btn{display:none;font:inherit;font-weight:800;background:none;border:1px solid var(--color-divider);padding:10px 14px;cursor:pointer;color:var(--color-text)}
@media(max-width:720px){
 .menu-btn{display:block}.hdr-cta{display:none}
 .hdr-in{flex-wrap:wrap}
 .nav-links{display:none;flex-direction:column;gap:0;width:100%;order:3;border-top:2px solid var(--color-divider);margin-top:8px}
 .nav-links.open{display:flex}
 .nav-links a{padding:14px 0;border-bottom:1px solid var(--color-divider);font-size:17px}
}
/* shared bits */
.eyebrow{font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--color-accent-700);font-weight:600}
.mb{margin-bottom:16px}.mb20{margin-bottom:20px}.mb24{margin-bottom:24px}.mb48{margin-bottom:48px}
.display{margin:0;font-weight:800;font-size:clamp(30.6px,3.91vw,56.1px);line-height:.92;letter-spacing:-.045em;text-wrap:balance}
.h2{margin:0;font-weight:800;font-size:clamp(25.5px,2.98vw,42.5px);line-height:.95;letter-spacing:-.04em}
.h2s{margin:0;font-weight:800;font-size:clamp(22.1px,2.38vw,34px);line-height:.98;letter-spacing:-.035em}
.h2m{margin:0 0 32px;font-weight:800;font-size:clamp(20.4px,2.21vw,28.9px);letter-spacing:-.03em}
.lead{margin:0;font-size:clamp(15px,1.2vw,17px);line-height:1.5;max-width:40ch;text-wrap:pretty}
.body17{margin:0;font-size:15px;line-height:1.5;max-width:40ch}.body18{margin:0;font-size:16px;line-height:1.5;max-width:44ch}.body19{margin:0;font-size:16px;line-height:1.5;max-width:44ch}
.sec{padding-top:clamp(72px,9vw,120px)}.sec.last{padding-bottom:clamp(72px,9vw,120px)}
.btnrow{display:flex;gap:12px;flex-wrap:wrap}.btnrow.tight{gap:8px}
.btn-lg{font-size:16px;padding:16px 20px}.btn-lg.wide{min-width:220px;justify-content:space-between}
.btn.spread{justify-content:space-between}
.btn-secondary{white-space:nowrap}
.btn-primary,.btn-ink{text-decoration:none}
.btn-primary,.btn-primary:hover{color:var(--color-bg)}
.btn-ink{background:var(--color-text);color:var(--color-bg)!important;font-size:16px;padding:16px 20px;min-width:240px;justify-content:space-between}
.btn-ink:hover{background:var(--color-neutral-800)}
.note{font-size:12px;opacity:.65;margin-top:12px}
/* hero */
.hero-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,520px),1fr));border-bottom:2px solid var(--color-divider)}
.hero-l{padding:clamp(48px,7vw,96px) clamp(0px,3vw,48px) clamp(48px,6vw,80px) 0;display:flex;flex-direction:column;gap:32px}
.hero-r{border-left:2px solid var(--color-divider);padding:clamp(32px,5vw,64px) 0 clamp(32px,5vw,64px) clamp(20px,3vw,48px);display:flex;align-items:center}
@media(max-width:1000px){.hero-r{border-left:0;padding-left:0;border-top:2px solid var(--color-divider)}}
.panel{width:100%;background:var(--color-surface)}
.panel-h{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;border-bottom:2px solid var(--color-divider)}
.label{font-size:11px;letter-spacing:.08em;text-transform:uppercase;opacity:.7}
.id{font-weight:800;font-size:17px}
.kv{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:12px;padding:12px 20px;border-bottom:1px solid var(--color-divider);font-size:14px}
.panel-f{padding:16px 20px;display:flex;flex-direction:column;gap:12px}
.rec{font-weight:800;font-size:18px;line-height:1.2}
.panel .btn{padding:10px 16px}
/* sections */
.aud{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));border-bottom:2px solid var(--color-divider)}
.aud-c{padding:40px 32px 48px 0;display:flex;flex-direction:column;gap:12px}
.aud-l{font-weight:800;font-size:20px;line-height:1.15;letter-spacing:-.02em;max-width:18ch}
.split-end{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:32px;align-items:end;margin-bottom:48px}
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));border-top:2px solid var(--color-text)}
.step{padding:28px 28px 48px 0;border-bottom:2px solid var(--color-divider);display:flex;flex-direction:column;gap:16px;min-height:280px}
.num{font-weight:800;font-size:34px;line-height:1;letter-spacing:-.04em;color:var(--color-accent)}
.step h3{margin:auto 0 0;font-size:19px;letter-spacing:-.02em}
.step p{margin:0;font-size:14px;line-height:1.5;max-width:30ch}
.rules{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));border-top:2px solid var(--color-text);border-left:2px solid var(--color-divider)}
.rule{padding:28px 24px 36px;border-right:2px solid var(--color-divider);border-bottom:2px solid var(--color-divider)}
.big{font-weight:800;font-size:clamp(34px,3.74vw,52.7px);line-height:1;letter-spacing:-.05em}
.rl{margin-top:12px;font-weight:600;font-size:16px}.rs{margin-top:4px;font-size:13px;opacity:.7}
.integ{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:48px;border-top:2px solid var(--color-divider);padding-top:48px}
.integ-g{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr))}
.ig{padding:0 24px 24px 0;display:flex;flex-direction:column;gap:12px;font-size:15px}
.igh{font-weight:800;font-size:16px;border-bottom:2px solid var(--color-text);padding-bottom:8px}
/* product */
.pg-hero{padding-top:clamp(56px,8vw,104px);padding-bottom:48px;border-bottom:2px solid var(--color-divider)}
.pg-hero.two{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,460px),1fr));gap:48px;align-items:end;padding-bottom:56px}
.prow{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:32px;padding:48px 0;border-bottom:2px solid var(--color-divider)}
.ptitle{display:flex;gap:20px;align-items:baseline}
.pn{font-weight:800;font-size:26px;color:var(--color-accent);letter-spacing:-.04em}
.ptitle h2{margin:0;font-size:clamp(20.4px,2.21vw,28.9px);letter-spacing:-.03em}
.pts{display:flex;flex-direction:column}
.pt{padding:10px 0;border-bottom:1px solid var(--color-divider);font-size:15px;display:flex;gap:12px}
.dash{color:var(--color-accent);font-weight:800}
.audit{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr));gap:48px;align-items:start}
/* company */
.team{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:24px}
.tm{display:flex;flex-direction:column;gap:12px}
.portrait{aspect-ratio:4/5;background:repeating-linear-gradient(135deg,var(--color-surface) 0 8px,var(--color-neutral-300) 8px 9px);display:flex;align-items:flex-end;padding:12px;font-family:ui-monospace,monospace;font-size:11px;opacity:.8}
.tmi{border-top:2px solid var(--color-text);padding-top:10px}.tn{font-weight:800;font-size:18px}.tr{font-size:14px;opacity:.7}
.princ{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));border-top:2px solid var(--color-text)}
.pr{padding:28px 28px 40px 0;border-bottom:2px solid var(--color-divider)}
.prt{font-weight:800;font-size:20px;letter-spacing:-.02em;margin-bottom:10px}.pr p{margin:0;font-size:16px;line-height:1.5;max-width:34ch}
/* pilot */
.pilot{padding-top:clamp(56px,8vw,104px);padding-bottom:clamp(56px,8vw,104px);display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,460px),1fr));gap:clamp(40px,6vw,96px)}
.pl{display:flex;flex-direction:column;gap:28px}
.tl{border-top:2px solid var(--color-text)}
.tr2{display:grid;grid-template-columns:96px 1fr;gap:16px;padding:18px 0;border-bottom:2px solid var(--color-divider);font-size:16px;line-height:1.45}
.tw{font-weight:800;font-size:15px;color:var(--color-accent-700);white-space:nowrap}
.pf{background:var(--color-surface);padding:clamp(24px,3vw,40px);align-self:start}
.pf form{display:flex;flex-direction:column;gap:18px}
.two-f{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:16px}
.form-err{margin:0;color:var(--color-accent-700);font-weight:600;font-size:14px}
.sq28{display:block;width:28px;height:28px;background:var(--color-accent);margin-bottom:16px}
.okh{font-weight:800;font-size:26px;letter-spacing:-.03em;margin-bottom:16px}
#pilot-ok{padding:24px 0}
/* banner + footer */
.banner{background:var(--color-accent);color:var(--color-bg)}
.banner-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:40px;align-items:end;padding-top:clamp(56px,8vw,112px);padding-bottom:clamp(56px,8vw,112px)}
.banner h2{margin:0;font-size:clamp(27.2px,3.91vw,62.9px);line-height:.88;letter-spacing:-.05em;max-width:11ch}
.banner-side{display:flex;flex-direction:column;gap:20px;align-items:flex-start;border-left:2px solid var(--color-bg);padding-left:32px}
.banner-side p{margin:0;font-size:16px;line-height:1.45;max-width:32ch}
@media(max-width:700px){.banner-side{border-left:0;padding-left:0;border-top:2px solid var(--color-bg);padding-top:24px}}
.ftr{border-top:2px solid var(--color-divider)}
.ftr-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:32px;font-size:14px;padding-top:40px;padding-bottom:56px}
.col{display:flex;flex-direction:column;gap:8px}.col a{color:var(--color-text)}
.col a:hover{color:var(--color-accent-700)}