/* Structure and motion follow frontal.so: 64px nav, 1280px framed shell, display serif, mono labels in bracket corners,
   layered SVG illustrations with hover states, reveal sweeps. Skin: Oriel Forest Morning. */
:root{
  --bg:#F4F3EE; --bg-2:#EDECE5; --surface:#FBFAF7; --white:#FFFFFF; --fg:#141B17; --fg-2:#38423D; --mut:#68706B; --faint:#9AA19C;
  --line:rgba(20,27,23,.10); --line-2:rgba(20,27,23,.16); --line-3:rgba(20,27,23,.30);
  --acc:#1F5A43; --acc-soft:#DCEBE1; --hi:#CFE6D8;
  --night:#0D1210; --nfg:#ECEFEC; --nmut:#8D9892; --nline:rgba(236,239,236,.09);
  --serif:'Instrument Serif',Georgia,serif; --sans:'Inter',system-ui,sans-serif; --mono:'JetBrains Mono',ui-monospace,monospace;
  --shell:1280px; --gut:clamp(24px,5.5556vw,80px); --ease:cubic-bezier(.16,1,.3,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--bg)}
body{background:var(--bg);color:var(--fg);font:400 15px/1.55 var(--sans);letter-spacing:-.011em;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
:focus-visible{outline:1px solid var(--acc);outline-offset:3px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.mono{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase}
.shell{width:calc(100% - var(--gut)*2);max-width:var(--shell);margin-inline:auto;border-inline:1px solid var(--line);position:relative}
.band{border-bottom:1px solid var(--line)}
.full{margin:0 calc(var(--gut)*-1)}

/* bracket corners (four real elements so they can animate) */
.bk{position:relative}
.bk > i.c{position:absolute;width:7px;height:7px;border-color:var(--bc,currentColor);border-style:solid;border-width:0;transition:transform .5s var(--ease)}
.bk > i.c.tl{top:-5px;left:-5px;border-top-width:1px;border-left-width:1px}
.bk > i.c.tr{top:-5px;right:-5px;border-top-width:1px;border-right-width:1px}
.bk > i.c.bl{bottom:-5px;left:-5px;border-bottom-width:1px;border-left-width:1px}
.bk > i.c.br{bottom:-5px;right:-5px;border-bottom-width:1px;border-right-width:1px}
.bk:hover > i.c.tl{transform:translate(-2px,-2px)}.bk:hover > i.c.tr{transform:translate(2px,-2px)}.bk:hover > i.c.bl{transform:translate(-2px,2px)}.bk:hover > i.c.br{transform:translate(2px,2px)}
.rv-b > i.c{opacity:0;transform:scale(.4)}
.rv-b.in > i.c{opacity:1;transform:none;transition:opacity .5s var(--ease),transform .7s var(--ease)}

.eyebrow{align-self:flex-start;width:max-content;display:inline-flex;align-items:center;height:24px;padding:0 9px;font:500 11px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--acc);--bc:var(--acc)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:36px;padding:0 16px;font:500 12px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;transition:background .18s,color .18s,scale .14s var(--ease)}
.btn:active{scale:.97}
.btn-dark{background:var(--fg);color:var(--bg);--bc:var(--fg)}
.btn-dark:hover{background:#26332C}
.link{font:500 12px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--acc);display:inline-flex;gap:8px;align-items:center}
.link svg{transition:transform .2s var(--ease)}
.link:hover svg{transform:translateX(3px)}
.h2{font-family:var(--serif);font-weight:400;font-size:42px;line-height:1.06;letter-spacing:-.03em}
.h2 .dim{color:var(--faint)}
.lede{color:var(--mut);font-size:15px;line-height:1.6;max-width:48ch}
.sec{padding:120px var(--gut) 0}
.sec-h{max-width:620px;margin:0 auto 64px;text-align:center}
.sec-h .h2{margin:18px 0 14px}
.sec-h .lede{margin-inline:auto}
.sec-row{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;flex-wrap:wrap;margin-bottom:56px}
.sec-row .h2{margin-top:18px;max-width:16ch}
.cap{font:500 10px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--faint)}
.rv{opacity:0;translate:0 12px;transition:opacity .8s var(--ease),translate .8s var(--ease)}
.rv.in{opacity:1;translate:0 0}

/* NAV */
.nav{position:sticky;top:0;z-index:60;height:64px;background:rgba(244,243,238,.9);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.nav-in{height:64px;width:calc(100% - var(--gut)*2);max-width:var(--shell);margin-inline:auto;display:flex;align-items:center;justify-content:space-between;gap:24px}
.menu{display:flex;gap:4px;font-size:14px;color:var(--fg-2);height:100%;align-items:center}
.menu > a,.menu > .dd > button{height:36px;padding:0 12px;display:inline-flex;align-items:center;gap:6px;transition:color .15s}
.menu > a:hover,.menu > .dd > button:hover{color:var(--acc)}
.dd{position:relative;height:100%;display:flex;align-items:center}
.dd button svg{transition:transform .2s var(--ease);opacity:.55}
.dd:hover button svg,.dd:focus-within button svg{transform:rotate(180deg)}
.mega{position:absolute;top:56px;left:-14px;width:440px;background:var(--white);box-shadow:0 0 0 1px var(--line-2),0 30px 60px -30px rgba(20,27,23,.4);padding:8px;opacity:0;visibility:hidden;translate:0 -6px;transition:opacity .18s,translate .25s var(--ease),visibility .18s}
.dd:hover .mega,.dd:focus-within .mega{opacity:1;visibility:visible;translate:0 0}
.mega a{display:grid;grid-template-columns:22px 1fr;gap:12px;padding:12px;transition:background .15s}
.mega a:hover{background:var(--bg)}
.mega b{font-weight:500;font-size:14px;color:var(--fg)}
.mega span{display:block;font-size:13px;color:var(--mut);line-height:1.45;margin-top:2px}
.mega svg{margin-top:2px;color:var(--acc)}
.mega .all{border-bottom:1px solid var(--line);margin-bottom:6px;align-items:center}
@media (max-width:920px){.menu{display:none}}

/* HERO */
.hero{position:relative;height:736px;overflow:hidden;display:grid;place-items:center;isolation:isolate}
.waves{position:absolute;inset:0;width:100%;height:100%;z-index:-1}
.waves .base path{fill:none;stroke-width:1;stroke-dasharray:1;stroke-dashoffset:1;animation:draw 2.8s var(--ease) forwards}
.waves .flow path{fill:none;stroke-width:1.2;stroke-dasharray:.06 .94;stroke-dashoffset:1;animation:flow 6s linear infinite}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes flow{to{stroke-dashoffset:0}}
.hero-copy{width:min(680px,100% - 48px);text-align:center;display:flex;flex-direction:column;align-items:center;background:radial-gradient(closest-side,rgba(244,243,238,1) 55%,rgba(244,243,238,0));padding:40px 20px}
.hero h1{font-family:var(--serif);font-weight:400;font-size:60px;line-height:1;letter-spacing:-.035em;margin-top:24px;text-wrap:balance}
.hero .lede{font-size:16px;margin:18px auto 52px;max-width:46ch;text-wrap:balance}
.glint{background:linear-gradient(90deg,var(--acc),#3E9470 25%,#6FA85A 50%,#3E9470 75%,var(--acc));background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:glint 7s linear infinite}
@keyframes glint{to{background-position:-200% 0}}
.book{display:flex;width:min(420px,100%);height:44px;padding:4px 4px 4px 16px;background:var(--white);box-shadow:inset 0 0 0 1px var(--line-2);--bc:var(--fg-2)}
.book input{flex:1;min-width:0;border:0;background:transparent;font:inherit;font-size:14px;color:var(--fg);outline:none}
.book input::placeholder{color:var(--faint)}
.hero-note{margin-top:18px;font-size:13px;color:var(--mut)}
.hero-note b{color:var(--fg);font-weight:500}
@media (max-width:760px){.hero{height:auto;padding:90px 0 80px}.hero h1{font-size:40px}}

/* PROOF STRIP */
.strip{display:grid;grid-template-columns:repeat(5,1fr)}
.strip > div{padding:26px 24px 22px;border-right:1px solid var(--line);display:flex;flex-direction:column;min-height:150px;transition:background .25s}
.strip > div:hover{background:var(--surface)}
.strip > div:last-child{border-right:0}
.strip b{font-family:var(--serif);font-weight:400;font-size:38px;letter-spacing:-.035em;line-height:1}
.strip p{font-size:13px;color:var(--fg-2);margin-top:10px;line-height:1.45}
.strip .cap{margin-top:auto;padding-top:14px}
@media (max-width:1000px){.strip{grid-template-columns:1fr 1fr}.strip > div{border-bottom:1px solid var(--line)}}

/* WHAT YOU GET: three illustrations */
.cols3{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line)}
.cols3 > div{border-right:1px solid var(--line);padding:36px 34px 0;min-height:500px;display:flex;flex-direction:column;overflow:hidden}
.cols3 > div:last-child{border-right:0}
.ico{width:28px;height:28px;display:grid;place-items:center;color:var(--fg);--bc:var(--fg-2)}
.cols3 h3{font-size:16px;font-weight:500;margin:24px 0 8px}
.cols3 p{color:var(--mut);font-size:14.5px;max-width:34ch}
.stage-ill{flex:1;position:relative;display:grid;place-items:center;min-height:300px}
/* team */
.team{position:relative;width:300px;cursor:default}
.team .arcs{position:absolute;left:-200px;right:-200px;top:-30px;height:300px;width:calc(100% + 400px);pointer-events:none}
.team .hd{position:relative;display:flex;gap:12px;align-items:center;padding:12px 14px;background:var(--white);box-shadow:0 0 0 1px var(--line-2),0 18px 36px -24px rgba(20,27,23,.35);--bc:var(--fg)}
.team .hd img{width:34px;height:34px;border-radius:50%;object-fit:cover}
.team .hd b{display:block;font-weight:500;font-size:13.5px}
.team .hd span{color:var(--mut);font-size:12px}
.team .hd .live{margin-left:auto;width:7px;height:7px;border-radius:50%;background:#3E9470;box-shadow:0 0 0 4px rgba(62,148,112,.15)}
.team .rows{position:relative;margin-top:12px;display:grid;gap:4px}
.team .rows div{display:flex;justify-content:space-between;padding:9px 14px;background:rgba(255,255,255,.72);box-shadow:0 0 0 1px var(--line);font-size:13px;transition:transform .6s var(--ease),background .3s}
.team .rows div span:last-child{color:var(--mut)}
.team:hover .rows div{transform:translateX(4px)}
.team:hover .rows div:nth-child(2){transition-delay:.04s}.team:hover .rows div:nth-child(3){transition-delay:.08s}.team:hover .rows div:nth-child(4){transition-delay:.12s}
/* system */
.sys{width:100%;max-width:380px;overflow:visible;cursor:default}
.sys .plate{transition:transform .8s cubic-bezier(.2,.8,.2,1)}
.sys:hover .plate{transform:translateY(calc(var(--i) * 6px))}
.sys:hover .plate.top{transform:translateY(-8px)}
.sys text{font-family:var(--mono);font-size:10px;letter-spacing:.06em;fill:var(--fg);fill-opacity:.55}
.sys .draw{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1s var(--ease)}
.sys.in .draw{stroke-dashoffset:0}
.sys .pin{opacity:0;transition:opacity .6s .6s}
.sys.in .pin{opacity:1}
.sys .cellpulse{animation:cell 3.2s ease-in-out infinite}
@keyframes cell{0%,100%{fill-opacity:.25}50%{fill-opacity:.85}}
/* tools globe */
.tools{position:relative;width:300px;height:300px;cursor:default}
.tools .globe{position:absolute;inset:22px;transition:transform 1.2s var(--ease)}
.tools .core{position:absolute;left:50%;top:50%;width:76px;height:76px;margin:-38px 0 0 -38px;background:var(--fg);display:grid;place-items:center;box-shadow:0 20px 40px -18px rgba(20,27,23,.6);transition:transform .9s var(--ease)}
.tools .core img{width:56px}
.tools:hover .globe{transform:scale(.96) rotate(-6deg)}
.tools:hover .core{transform:scale(1.07)}
.tools .t{position:absolute;width:44px;height:44px;margin:-22px 0 0 -22px;background:var(--white);box-shadow:0 0 0 1px var(--line-2),0 10px 22px -14px rgba(20,27,23,.4);display:grid;place-items:center;transition:transform .9s var(--ease)}
.tools .t img{width:20px;height:20px;opacity:.82}
.tools:hover .t{transform:translate(calc(var(--dx) * 8px),calc(var(--dy) * 8px))}
.tools .orbit{animation:spin 60s linear infinite;transform-origin:50% 50%}
@keyframes spin{to{transform:rotate(360deg)}}
@media (max-width:980px){.cols3{grid-template-columns:1fr}.cols3 > div{border-right:0;border-bottom:1px solid var(--line)}}

/* HOW IT WORKS */
.flow-wrap{border-top:1px solid var(--line);position:relative;padding:72px var(--gut) 64px;background-image:radial-gradient(rgba(20,27,23,.11) 1px,transparent 1px);background-size:16px 16px}
.flow{display:grid;grid-template-columns:1fr 1.1fr 1fr;gap:36px;align-items:center}
.card{background:var(--white);box-shadow:0 0 0 1px var(--line-2),0 22px 44px -28px rgba(20,27,23,.35);font-size:12.5px;transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.card:hover{transform:translateY(-3px);box-shadow:0 0 0 1px var(--line-3),0 30px 50px -28px rgba(20,27,23,.4)}
.ph{display:flex;justify-content:space-between;padding:10px 12px;border-bottom:1px solid var(--line)}
.ph .mono{color:var(--mut);font-size:10px}
.acct .r{display:grid;grid-template-columns:20px 1fr 26px 46px;gap:9px;align-items:center;padding:10px 12px;border-bottom:1px solid var(--line)}
.acct .r:last-child{border-bottom:0}
.lg{width:18px;height:18px;border-radius:4px;display:grid;place-items:center;font:600 9px/1 var(--sans);color:#fff}
.tier{font-family:var(--mono);font-size:10px;color:var(--mut)}
.fitbar{height:4px;background:var(--bg-2);overflow:hidden}
.fitbar i{display:block;height:100%;background:var(--acc);transform-origin:left;transform:scaleX(0);transition:transform 1.2s var(--ease)}
.in .fitbar i{transform:scaleX(1)}
.mid{position:relative;height:270px;display:flex;flex-direction:column;justify-content:center;gap:12px;align-items:center}
.chip{position:relative;z-index:1;display:inline-flex;align-items:center;gap:8px;height:32px;padding:0 12px 0 8px;background:var(--white);box-shadow:0 0 0 1px var(--line-2);font-size:12px;color:var(--fg-2);white-space:nowrap;transition:transform .4s var(--ease)}
.chip:hover{transform:translateX(3px)}
.chip img{width:14px;height:14px;opacity:.85}
.chip.on{box-shadow:0 0 0 1px rgba(31,90,67,.45);color:var(--fg)}
.chip .d{width:6px;height:6px;border-radius:50%;background:var(--acc)}
.flowsvg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible;z-index:0}
.flowsvg path{fill:none;stroke:rgba(20,27,23,.28);stroke-width:1}
.flowsvg path.go{stroke:#1F5A43;stroke-dasharray:3 5;animation:dash 1s linear infinite}
.flowsvg rect{fill:#141B17}
.flow{position:relative;z-index:1}
.lines{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.lines path{fill:none;stroke:var(--line-3);stroke-width:1}
.lines path.go{stroke:var(--acc);stroke-dasharray:3 5;animation:dash 1s linear infinite}
@keyframes dash{to{stroke-dashoffset:-16}}
.tag-top,.tag-bot{position:absolute;left:50%;transform:translateX(-50%);padding:6px 10px;font:500 10px/1 var(--mono);letter-spacing:.1em;color:var(--mut);background:var(--bg);--bc:var(--faint);white-space:nowrap;text-transform:uppercase}
.tag-top{top:26px}.tag-bot{bottom:22px}
.pipe .bars{display:flex;gap:4px;padding:14px 12px 12px}
.pipe .bars i{height:14px;transform-origin:left;transform:scaleX(0);transition:transform 1.2s var(--ease)}
.in .pipe .bars i{transform:scaleX(1)}
.pipe .legend{padding:0 12px 12px;display:grid;gap:7px}
.pipe .legend div{display:flex;justify-content:space-between;font-size:12px}
.pipe .legend span:last-child{font-family:var(--mono);font-size:11px;color:var(--mut)}
.pipe .next{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;border-top:1px solid var(--line);font-size:12px}
.pipe .next span:last-child{background:var(--bg);padding:4px 8px;font-size:11px}
.steps4{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line)}
.steps4 > div{padding:28px 28px 40px;border-right:1px solid var(--line)}
.steps4 > div:last-child{border-right:0}
.steps4 h3{font-size:15px;font-weight:500;margin:14px 0 6px}
.steps4 p{font-size:14px;color:var(--mut)}
@media (max-width:980px){.flow{grid-template-columns:1fr}.mid{height:auto;padding:40px 0}.lines,.tag-top,.tag-bot{display:none}.steps4{grid-template-columns:1fr 1fr}}

/* SERVICES: workflow canvas */
.white{background:var(--white)}
.tabsbar{display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.tabsbar button{position:relative;height:56px;font-size:14px;color:var(--mut);border-right:1px solid var(--line);transition:color .2s,background .2s}
.tabsbar button:last-child{border-right:0}
.tabsbar button:hover{color:var(--fg)}
.tabsbar button[aria-selected="true"]{color:var(--white);background:var(--fg)}
.tabsbar button[aria-selected="true"]::before{content:"";position:absolute;left:0;right:0;top:-1px;height:2px;background:var(--acc)}
.tabbody{display:grid;grid-template-columns:.86fr 1.14fr;min-height:520px}
.tabbody .l{padding:44px var(--gut) 40px;border-right:1px solid var(--line);display:flex;flex-direction:column}
.tabbody .l h3{font-size:22px;font-weight:500;letter-spacing:-.02em;margin:16px 0 12px;max-width:22ch;line-height:1.25}
.tabbody .l p{color:var(--mut);font-size:15.5px;max-width:42ch;line-height:1.6}
.tabbody .l .link{margin-top:20px}
.tabbody ol{list-style:none;margin-top:auto;padding-top:28px;display:grid;gap:10px;font-size:15px;color:var(--fg)}
.tabbody ol li{display:flex;gap:16px}
.tabbody ol li span{font-family:var(--mono);font-size:11px;color:var(--faint);width:18px;padding-top:4px}
.canvas{position:relative;overflow:hidden;background-color:var(--surface);background-image:radial-gradient(rgba(20,27,23,.12) 1px,transparent 1px);background-size:14px 14px;padding:52px 36px 200px}
.cv{position:relative;display:grid;grid-template-columns:auto 1fr;gap:0;align-items:start;max-width:600px}
.cv .sigs{display:flex;flex-direction:column;gap:14px;padding-top:12px;align-items:flex-end;position:relative;z-index:1}
.cv .sig{display:inline-flex;align-items:center;gap:9px;height:38px;padding:0 14px 0 10px;background:var(--white);border-radius:999px;box-shadow:0 0 0 1px var(--line-2),0 8px 18px -12px rgba(20,27,23,.35);font-size:13.5px;white-space:nowrap}
.cv .sig img{width:16px;height:16px}
.cv .sig .em{width:18px;height:18px;border-radius:4px;display:grid;place-items:center;background:#E7F25A;font-size:10px}
.cv .wire{width:44px;height:120px;flex:none;position:relative}
.cv .wire svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.mail{position:relative;z-index:1;background:var(--white);box-shadow:0 0 0 1px var(--line-2),0 26px 50px -30px rgba(20,27,23,.45);font-size:14px;line-height:1.55;width:100%;max-width:350px;opacity:0;translate:0 10px;transition:opacity .5s var(--ease),translate .6s var(--ease)}
.mail.on{opacity:1;translate:0 0}
.mail .mh{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:14px 16px;border-bottom:1px solid var(--line)}
.mail .mh b{font-weight:500;display:block}
.mail .mh span{color:var(--mut);font-size:13px}
.pill{font-size:12.5px;font-weight:500;color:var(--acc);background:var(--acc-soft);padding:4px 10px;border-radius:999px;white-space:nowrap}
.mail .mb{padding:16px}
.mail .mb p+p{margin-top:10px}
.mail mark{background:var(--hi);color:inherit;padding:1px 3px}
.mail .mf{display:flex;align-items:center;gap:10px;padding:12px 16px;border-top:1px solid var(--line)}
.mail .mf img{width:26px;height:26px;border-radius:4px;object-fit:cover}
.mail .mf span{color:var(--mut);font-size:13px;flex:1}
.mail .mf .ed{flex:none;font-size:13px;padding:6px 10px;box-shadow:0 0 0 1px var(--line-2)}
.mail .mf .ap{flex:none;font-size:13px;padding:6px 10px;background:var(--fg);color:var(--white);display:inline-flex;gap:6px;align-items:center}
.seq{position:absolute;z-index:2;right:24px;bottom:22px;width:250px;background:var(--fg);color:var(--nfg);padding:16px 18px;box-shadow:0 30px 60px -28px rgba(0,0,0,.6);opacity:0;translate:0 10px;transition:opacity .5s .25s var(--ease),translate .6s .25s var(--ease)}
.seq.on{opacity:1;translate:0 0}
.seq .k{display:flex;align-items:center;gap:8px;font:500 10.5px/1 var(--mono);letter-spacing:.1em;color:var(--nmut);text-transform:uppercase}
.seq .k i{width:16px;height:16px;border-radius:3px;background:#5B5BD6;display:inline-block}
.seq b{display:block;font-weight:500;font-size:22px;letter-spacing:-.02em;margin:10px 0 2px}
.seq span{color:var(--nmut);font-size:13px}
.seq .rw{display:flex;justify-content:space-between;margin-top:14px;padding-top:12px;border-top:1px solid var(--nline);font-size:13px}
.seq .rw span:last-child{color:var(--nfg)}
.cv-cap{position:absolute;left:40px;bottom:16px}
@media (max-width:980px){.tabsbar{grid-template-columns:1fr 1fr}.tabbody{grid-template-columns:1fr}.tabbody .l{border-right:0;border-bottom:1px solid var(--line)}.cv{grid-template-columns:1fr}.cv .sigs{align-items:flex-start;margin-bottom:16px}.cv .wire{display:none}.seq{position:relative;right:auto;bottom:auto;margin-top:16px}}

/* RESULTS */
.results{display:grid;grid-template-columns:1.3fr 1fr 1fr;border-top:1px solid var(--line)}
.res{padding:36px 32px 30px;border-right:1px solid var(--line);display:flex;flex-direction:column;min-height:380px;transition:background .3s}
.res:hover{background:var(--surface)}
.res:last-child{border-right:0}
.res .big{font-family:var(--serif);font-size:64px;line-height:.95;letter-spacing:-.04em;margin:26px 0 12px}
.res p{color:var(--fg-2);font-size:15px;max-width:32ch}
.res .meas{margin-top:18px}
.res .who{margin-top:auto;padding-top:22px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:14px}
.res .who span{font-size:13px;color:var(--mut)}
.res.feat{background:var(--fg);color:var(--nfg)}
.res.feat:hover{background:#18211C}
.res.feat .eyebrow{color:#A9CDB9;--bc:#A9CDB9}
.res.feat .big{font-size:96px}
.res.feat p{color:rgba(236,239,236,.86)}
.res.feat .cap{color:var(--nmut)}
.res.feat .who{border-color:var(--nline)}
.res.feat .who span{color:var(--nmut)}
.res.feat .link{color:#A9CDB9}
.attrib{padding:18px var(--gut);border-top:1px solid var(--line);font-size:13px;color:var(--mut)}
@media (max-width:980px){.results{grid-template-columns:1fr}.res{border-right:0;border-bottom:1px solid var(--line)}}

/* FIRST 30 DAYS */
.pilot-top{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:end;padding-bottom:56px}
.promise{padding:24px 26px;background:var(--white);box-shadow:0 0 0 1px var(--line-2);--bc:var(--acc)}
.promise b{display:block;font-family:var(--serif);font-weight:400;font-size:25px;line-height:1.2;letter-spacing:-.02em}
.promise p{color:var(--mut);font-size:13.5px;margin-top:8px}
.weeks{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);position:relative}
.weeks > div{padding:28px 26px 30px;border-right:1px solid var(--line);display:flex;flex-direction:column}
.weeks > div:last-child{border-right:0}
.weeks .w{font:500 11px/1 var(--mono);letter-spacing:.08em;color:var(--acc);text-transform:uppercase}
.weeks h3{font-size:15px;font-weight:500;margin:14px 0 6px}
.weeks > div > p{font-size:14px;color:var(--mut);margin-bottom:20px}
.yd{margin-top:auto;padding:12px 14px;background:var(--acc-soft);font-size:13px;color:var(--fg-2)}
.yd .cap{color:var(--acc);display:block;margin-bottom:6px}
.prog{position:absolute;top:-1px;left:0;height:2px;width:0;background:var(--acc);transition:width 2.2s var(--ease)}
.weeks.in .prog{width:100%}
@media (max-width:980px){.pilot-top{grid-template-columns:1fr}.weeks{grid-template-columns:1fr 1fr}}

/* NIGHT (flat, line texture, no glows) */
.night{background:var(--night);color:var(--nfg)}
.night .shell{border-color:var(--nline)}
.night .lede{color:var(--nmut)}
.night .eyebrow{color:#A9CDB9;--bc:#A9CDB9}
.night .h2 .dim{color:#56615B}
.lines-tex{background-image:repeating-linear-gradient(0deg,rgba(236,239,236,.035) 0 1px,transparent 1px 6px)}
.tr-top{display:grid;grid-template-columns:1fr 1fr;gap:56px;padding:120px var(--gut) 64px;align-items:end}
.tr-grid{display:grid;grid-template-columns:1fr 1fr 1.25fr;border-top:1px solid var(--nline)}
.tr-cell{padding:30px 30px 34px;border-right:1px solid var(--nline);border-bottom:1px solid var(--nline);transition:background .3s}
.tr-cell:hover{background:rgba(236,239,236,.025)}
.tr-cell .ico{color:var(--nfg);--bc:#56615B;margin-bottom:22px}
.tr-cell b{display:block;font-size:15px;font-weight:500}
.tr-cell p{color:var(--nmut);font-size:13.5px;margin-top:6px;max-width:30ch}
.tr-diagram{grid-row:span 2;display:grid;place-items:center;padding:30px;border-bottom:1px solid var(--nline)}
.tr-diagram svg{width:100%;max-width:360px}
.tr-diagram .tile{transition:transform .5s var(--ease)}
.tr-diagram:hover .tile{transform:translateY(-3px)}
@media (max-width:980px){.tr-top{grid-template-columns:1fr}.tr-grid{grid-template-columns:1fr 1fr}.tr-diagram{grid-column:span 2;grid-row:auto}}

/* FAQ */
.faq{max-width:740px;margin:0 auto;padding-bottom:120px}
.faq details{border-top:1px solid var(--line)}
.faq details:last-child{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:18px 4px;cursor:pointer;font-size:15px;font-weight:500;transition:color .2s}
.faq summary:hover{color:var(--acc)}
.faq summary::-webkit-details-marker{display:none}
.faq summary i{font-style:normal;font-family:var(--mono);color:var(--faint);transition:transform .25s var(--ease)}
.faq details[open] summary i{transform:rotate(45deg)}
.faq details p{color:var(--mut);font-size:14.5px;padding:0 40px 20px 4px}

/* CLOSING */
.final{padding:140px 24px;text-align:center}
.final h2{font-family:var(--serif);font-weight:400;font-size:56px;line-height:1.02;letter-spacing:-.035em;max-width:15ch;margin:20px auto 0}
.final .lede{margin:16px auto 40px}
.final .book{margin:0 auto;background:rgba(236,239,236,.05);box-shadow:inset 0 0 0 1px rgba(236,239,236,.2);--bc:#8D9892}
.final .book input{color:var(--nfg)}
.final .book input::placeholder{color:var(--nmut)}
.final .btn-dark{background:var(--nfg);color:var(--night);--bc:var(--nfg)}
.final .btn-dark:hover{background:#FFFFFF}
.final .offer{margin-top:18px;font-size:13px;color:var(--nmut)}
.final .offer b{color:var(--nfg);font-weight:500}

/* FOOTER */
.foot{display:grid;grid-template-columns:1.5fr .9fr 1.2fr 1.3fr;gap:36px;padding:64px var(--gut) 40px;border-top:1px solid var(--nline)}
.foot h5{font:500 11px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--nfg);margin-bottom:18px}
.foot li{list-style:none;font-size:14px;padding:5px 0;color:var(--nmut);transition:color .15s}
.foot li a:hover{color:var(--nfg)}
.soc{display:flex;gap:14px;margin-top:22px}
.soc a{color:var(--nmut);transition:color .15s}
.soc a:hover{color:var(--nfg)}
.contact{display:flex;gap:12px;align-items:center;padding:6px 0}
.contact img{width:38px;height:38px;object-fit:cover;transition:translate .3s var(--ease)}
.contact:hover img{translate:0 -1px}
.contact b{display:block;font-weight:500;font-size:14px;color:var(--nfg)}
.contact span{font-size:12.5px;color:var(--nmut)}
.mailrow{display:flex;gap:12px;align-items:center;margin-top:10px;font-size:14px;color:var(--nfg)}
.mailrow i{width:38px;height:38px;display:grid;place-items:center;box-shadow:0 0 0 1px var(--nline);font-style:normal}
.talk{margin-top:36px}
.talk p{color:var(--nmut);font-size:14px;margin:-6px 0 14px}
.talk .book{height:42px;background:rgba(236,239,236,.04);box-shadow:inset 0 0 0 1px rgba(236,239,236,.16);--bc:#56615B}
.talk .book input{color:var(--nfg);font-size:13.5px}
.talk .btn{height:34px;background:var(--nfg);color:var(--night)}
.legal{display:flex;justify-content:space-between;padding:22px var(--gut);border-top:1px solid var(--nline);font-size:13px;color:var(--nmut)}
.legal a:hover{color:var(--nfg)}
.giant{position:relative;height:250px;overflow:hidden;display:grid;place-items:end center}
.giant img{width:92%;max-width:1100px;opacity:.06;margin-bottom:-70px}
@media (max-width:860px){.foot{grid-template-columns:1fr 1fr}.legal{flex-direction:column;gap:6px}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.waves .base path{stroke-dashoffset:0}.rv{opacity:1;translate:0 0}.rv-b > i.c{opacity:1;transform:none}.mail,.seq{opacity:1;translate:0 0}}

/* ---- revision 2026-10-25: spacing, hero label, logos, pipeline, canvas connectors, footer legal ---- */
:root{--shell:1360px;--gut:clamp(20px,2.8vw,40px)}
.hero-copy .eyebrow{align-self:center}
.sec-row .h2{max-width:24ch}
.sec-row .lede{max-width:40ch}
.tools .t img{width:24px;height:24px;opacity:1;object-fit:contain}
.chip img{width:16px;height:16px;opacity:1;object-fit:contain;border-radius:3px}
.cv .sig img{width:18px;height:18px;object-fit:contain;border-radius:3px}
.brow .tools img{object-fit:contain}
.pipe .legend div span:first-child{display:inline-flex;align-items:center;gap:8px}
.pipe .legend div span:first-child::before{content:"";width:8px;height:8px;background:var(--c,#1F5A43)}
.pipe .legend div:nth-child(1){--c:#1F5A43}.pipe .legend div:nth-child(2){--c:#5E9E7E}.pipe .legend div:nth-child(3){--c:#A9CDB9}
.cv-lines{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible;z-index:1}
.cv-lines path{fill:none;stroke:rgba(20,27,23,.35);stroke-width:1}
.cv-lines path.go{stroke:#1F5A43;stroke-dasharray:3 5;animation:dash 1s linear infinite}
.cv-lines rect{fill:#141B17}
.canvas{padding-bottom:260px !important}
.seq{right:auto !important;bottom:auto !important}
.seq .k img{width:16px;height:16px;border-radius:3px}
.legal{align-items:center;gap:24px;flex-wrap:wrap}
.legal nav{display:flex;gap:22px;flex-wrap:wrap}
.legal nav a,.legal nav button{color:var(--nmut);font-size:13px;transition:color .15s}
.legal nav a:hover,.legal nav button:hover{color:var(--nfg)}
.legal .theme{display:inline-flex;align-items:center;gap:8px}
.legal .theme i{width:8px;height:8px;border-radius:50%;background:var(--nmut)}
.mega.res{width:360px}
.legal .theme{color:var(--nmut);font-size:13px;background:none;border:0;cursor:pointer;font-family:inherit}
.legal .theme:hover{color:var(--nfg)}
.soon{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line)}
.soon > div{padding:30px var(--gut) 40px;border-right:1px solid var(--line);min-height:200px;display:flex;flex-direction:column;gap:10px}
.soon > div:last-child{border-right:0}
.soon b{font-family:var(--serif);font-weight:400;font-size:24px;letter-spacing:-.02em;line-height:1.15}
.soon p{font-size:14px;color:var(--mut)}
.pg-hero{padding:120px var(--gut) 88px;text-align:center}
.pg-hero h1{font-family:var(--serif);font-weight:400;font-size:56px;line-height:1.02;letter-spacing:-.035em;margin:22px auto 16px;max-width:16ch}
.pg-hero .lede{margin:0 auto;font-size:16px}
.pg-hero .book{margin:32px auto 0}
@media (max-width:860px){.soon{grid-template-columns:1fr}.soon > div{border-right:0;border-bottom:1px solid var(--line)}.pg-hero h1{font-size:40px}}
.foot{grid-template-columns:1.5fr .8fr 1.1fr .9fr 1.3fr}
/* HOW IT WORKS v2: Frontal loop layout (review label, account table, signal fan, pipeline, change label) */
.flow-wrap{padding:40px var(--gut)}
.hw-fit-box{position:relative;width:100%}
.hw{position:relative;width:1260px;height:470px;transform-origin:0 0}
.hw-lines{position:absolute;left:0;top:0;width:1260px;height:100%;overflow:visible;pointer-events:none}
.hw-lines path{fill:none;stroke:rgba(20,27,23,.26);stroke-width:1}
.hw-lines path.dim{stroke:rgba(20,27,23,.2)}
.hw-lines path.act{stroke:rgba(20,27,23,.6)}
.hw-lines path.go{stroke:#1F5A43;stroke-width:1.4;stroke-dasharray:4 10;animation:dash 1.1s linear infinite}
.hw-tag{position:absolute;left:50%;transform:translateX(-50%);height:36px;padding:0 18px;display:inline-flex;align-items:center;white-space:nowrap;background:var(--bg);font:500 11px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--fg);--bc:var(--fg)}
.hw-tag.bk:hover > i.c{transform:none}
.hw-top{top:22px}.hw-bot{top:412px}
.hw-card{position:absolute;top:98px;background:var(--white);box-shadow:0 0 0 1px var(--line-2),0 24px 48px -30px rgba(20,27,23,.35)}
.hw-acct{left:70px;width:300px}
.hw-pipe{left:890px;width:300px}
.hw-h{display:grid;grid-template-columns:1fr 46px 62px;align-items:center;height:46px;padding:0 16px;background:var(--bg-2);border-bottom:1px solid var(--line);font-size:14px;font-weight:500}
.hw-r{display:grid;grid-template-columns:1fr 46px 62px;align-items:center;height:42px;padding:0 16px;border-bottom:1px solid var(--line);font-size:14px}
.hw-r.act{background:#EEF4F0}
.hw-r.dim{opacity:.5}.hw-r.dim2{opacity:.26}
.hw-n{display:flex;align-items:center;gap:10px;white-space:nowrap}
.hw-lg{width:20px;height:20px;border-radius:4px;flex:none;display:grid;place-items:center;font:600 10px/1 var(--sans);color:#fff}
.hw-t{color:var(--mut);font-size:13px}
.hw-fit{display:flex;gap:3px}
.hw-fit i{width:18px;height:4px;border-radius:2px;background:var(--bg-2)}
.hw-fit i.on{background:var(--fg)}
.hw-src{display:flex;justify-content:space-between;align-items:center;height:56px;padding:0 16px;font:500 11px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--mut)}
.hw-ic{display:flex;gap:6px}
.hw-ic i{width:28px;height:28px;display:grid;place-items:center;background:var(--bg);box-shadow:0 0 0 1px var(--line)}
.hw-ic img{width:16px;height:16px;object-fit:contain}
.hw-pill{position:absolute;display:inline-flex;align-items:center;gap:10px;height:40px;padding:0 18px 0 10px;border-radius:999px;background:rgba(255,255,255,.55);box-shadow:0 0 0 1px var(--line);font-size:14px;color:var(--mut);white-space:nowrap;opacity:.6;transition:opacity .3s}
.hw-pill:hover{opacity:1}
.hw-pill.on{background:var(--white);color:var(--fg);opacity:1;box-shadow:0 0 0 1px var(--line-3),0 14px 30px -18px rgba(20,27,23,.4)}
.hw-p1{left:560px;top:178px}.hw-p2{left:584px;top:228px}.hw-p3{left:560px;top:278px}
.hw-h2{display:flex;justify-content:space-between;align-items:center;height:46px;padding:0 16px;background:var(--bg-2);border-bottom:1px solid var(--line)}
.hw-h2 b{font-size:14px;font-weight:500}
.hw-h2 span{font:500 10.5px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--mut)}
.hw-bar{display:flex;gap:4px;padding:16px 16px 12px}
.hw-bar i{height:22px;border-radius:3px;transform-origin:left;transform:scaleX(0);transition:transform 1.2s var(--ease)}
.in .hw-bar i{transform:scaleX(1)}
.hw-leg{display:grid;gap:2px;padding:4px 16px 14px}
.hw-leg div{display:flex;align-items:center;gap:10px;height:30px;font-size:14px;color:var(--fg)}
.hw-leg div::before{content:"";width:2px;height:18px;background:var(--c)}
.hw-leg svg{color:var(--fg-2);flex:none}
.hw-leg img{width:14px;height:14px}
.hw-next{display:flex;justify-content:space-between;align-items:center;gap:10px;height:56px;padding:0 16px;border-top:1px solid var(--line);font-size:14px}
.hw-next > span:first-child{display:inline-flex;align-items:center;gap:8px;color:var(--acc)}
.hw-np{background:var(--bg);box-shadow:0 0 0 1px var(--line);padding:6px 10px;font-size:12.5px;white-space:nowrap}
@media (max-width:760px){.hw{width:auto;height:auto;transform:none!important;margin:0!important;display:grid;gap:14px}.hw-lines,.hw-tag{display:none}.hw-card,.hw-pill{position:static}.hw-acct,.hw-pipe{width:100%}.hw-pill{justify-self:start;opacity:1}.hw-bar i{transform:none}}
.hw-acct{width:320px;left:60px}
.hw-pipe{width:320px;left:880px}
.hw-h,.hw-r{grid-template-columns:1fr 38px 64px}
.giant{height:auto;overflow:visible;display:block;padding:24px var(--gut) 40px;border-top:1px solid var(--nline)}
.giant img{display:block;width:100%;max-width:none;margin:0 auto;opacity:.07}
/* LOGO WALL (Frontal structure: 7 columns, label cell spans 3 in the top row) */
.logowall{display:grid;grid-template-columns:repeat(7,1fr)}
.logowall > div{height:112px;display:grid;place-items:center;padding:0 22px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.logowall > div:nth-child(7n+5),.logowall > div:nth-child(5){border-right:0}
.logowall > div:nth-child(n+6){border-bottom:0}
.logowall > div:last-child{border-right:0}
.logowall img{max-width:100%;width:auto;object-fit:contain;filter:brightness(0);opacity:.72;transition:opacity .2s}
.logowall > div:hover img{opacity:1}
.logowall .lw-k{grid-column:span 3;font:500 12px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--faint)}
.logowall .lw-k b{font-weight:500;color:var(--fg)}
@media (max-width:980px){.logowall{grid-template-columns:repeat(3,1fr)}.logowall .lw-k{grid-column:1/-1;order:-1}.logowall > div{border-right:1px solid var(--line)!important;border-bottom:1px solid var(--line)!important;height:96px}}
.tools .t img{filter:grayscale(1) contrast(1.15);transition:filter .3s}
.tools .t:hover img{filter:none}
/* NAV: compact floating bar after the hero */
.nav{transition:background .3s,border-color .3s,backdrop-filter .3s}
.nav-in{transition:max-width .5s var(--ease),height .35s var(--ease),margin .35s var(--ease),padding .35s var(--ease),background .3s,box-shadow .3s}
.brand{display:flex;align-items:center;height:36px}
.brand .wm{display:block;height:27px;width:auto}
.brand .mk{display:none;height:24px;width:24px}
.nav.compact{background:transparent;border-bottom-color:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}
.nav.compact .nav-in{max-width:780px;height:52px;margin-top:6px;padding:0 8px 0 18px;background:rgba(251,250,247,.94);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 0 0 1px var(--line-2),0 18px 40px -26px rgba(20,27,23,.35)}
.nav.compact .brand .wm{display:none}
.nav.compact .brand .mk{display:block}
.nav.compact .mega{top:50px}
/* ---- audit pass 2026-10-25: every page, 1440 / 768 / 375 ---- */
:root{--faint:#7A827C}
.cap{line-height:1.5}
h1,h2,.h2,.lede,.pg-hero p{text-wrap:balance}
p{text-wrap:pretty}
.nav-in{display:grid;grid-template-columns:1fr auto 1fr}
.nav-in > .btn{justify-self:end}
.nav-in > .burger{justify-self:end}
.burger{display:none;width:40px;height:36px;flex-direction:column;justify-content:center;align-items:center;gap:6px}
.burger span{display:block;width:18px;height:1.5px;background:var(--fg);transition:transform .25s var(--ease)}
.burger.x span:first-child{transform:translateY(3.75px) rotate(45deg)}
.burger.x span:last-child{transform:translateY(-3.75px) rotate(-45deg)}
.mnav{position:absolute;left:0;right:0;top:100%;background:var(--surface);border-bottom:1px solid var(--line);padding:8px var(--gut) 20px;display:grid;max-height:calc(100vh - 64px);overflow:auto}
.mnav[hidden]{display:none}
.mnav a{padding:12px 0;border-bottom:1px solid var(--line);font-size:15px}
.mnav .btn{margin-top:16px;border:0;justify-self:start;padding:0 18px}
@media (max-width:920px){.nav-in{grid-template-columns:auto 1fr auto auto;gap:8px}.burger{display:flex;grid-column:3}.nav-in > .btn{grid-column:4}}
@media (max-width:420px){.nav-in > .btn{display:none}}
.book:focus-within{box-shadow:inset 0 0 0 1px var(--acc),0 0 0 3px var(--acc-soft)}
.final .book:focus-within,.talk .book:focus-within{box-shadow:inset 0 0 0 1px #A9CDB9,0 0 0 3px rgba(169,205,185,.18)}
.strip b,.res .big,.nums b,.case .big,.proof .big,.trust b{letter-spacing:-.012em;font-variant-numeric:lining-nums}
.faq summary i{font-size:16px;color:var(--mut)}
.soon > div{min-height:150px}
/* footer: base 5 columns, collapse on small screens (the earlier override killed the mobile rule) */
.foot{grid-template-columns:1.6fr 1fr 1fr 1.2fr 1.4fr}
.foot a,.foot li{overflow-wrap:anywhere}
.contact img{box-shadow:0 0 0 1px var(--nline)}
.giant{padding:32px var(--gut) 36px}
.giant img{width:100%;max-width:1100px;height:auto;max-height:300px;object-fit:contain}
@media (max-width:860px){.foot{grid-template-columns:1fr 1fr}.foot > div:first-child{grid-column:1/-1}}
@media (max-width:560px){.foot > div:last-child{grid-column:1/-1}}
/* canvas: the deep bottom room is only needed where the sequencer card is absolutely placed */
@media (max-width:980px){.canvas{padding-bottom:28px !important}}
/* mobile forms stack so the placeholder never hides under the button */
@media (max-width:480px){.book{flex-wrap:wrap;height:auto;padding:4px;gap:4px}.book input{flex-basis:100%;height:40px;padding:0 12px}.book .btn{width:100%;height:40px}.faq details p{padding-right:16px}}
@media (max-width:640px){.weeks{grid-template-columns:1fr}.weeks > div{border-right:0;border-bottom:1px solid var(--line)}.steps4{grid-template-columns:1fr}.steps4 > div{border-right:0;border-bottom:1px solid var(--line)}}
@media (max-width:980px){.pains > div,.rel a,.gets > div{border-right:0!important;border-bottom:1px solid var(--line)}}
/* service template parts */
.gets{gap:0;padding:0;border-top:1px solid var(--line)}
.gets > div{box-shadow:none;background:transparent;border-right:1px solid var(--line);padding:30px var(--gut) 36px}
.gets > div:last-child{border-right:0}
.gets > div:hover{transform:none;background:var(--surface)}
.buildt .brow:last-child{border-bottom:0}
/* about */
@media (max-width:900px){.ab-hero{grid-template-columns:minmax(0,1fr)!important}.ab-hero .r{padding:40px 20px}.portrait{width:100%;max-width:300px}.ab-hero h1{font-size:40px}.nums > div:nth-child(2n){border-right:0}.nums > div:nth-child(-n+2){border-bottom:1px solid var(--line)}}
.nums p{min-height:2.9em}
/* results */
.case .k{display:flex;flex-direction:column}
.case .k .cap{margin-top:auto;padding-top:18px}
.note{padding-bottom:28px}
@media (max-width:600px){.trust .row{grid-template-columns:1fr}.trust .row div{border-right:0;border-bottom:1px solid var(--line)}}
@media (max-width:860px){.svlist .go{margin-top:12px}}
/* hero sized so both logo rows sit above the fold, as on frontal.so */
.hero{height:clamp(520px,calc(100svh - 64px - 224px),760px)}
.hero .lede{margin-bottom:40px}
.logowall{border-bottom:1px solid var(--line)}
/* ---- pass 3: globe, track record tree and numbers, tools and people, FAQ cards, footer mark, resources menu ---- */
.tools .core{width:84px;height:84px;margin:-42px 0 0 -42px;border-radius:18px;background:linear-gradient(160deg,#22302A,#141B17);box-shadow:0 0 0 1px rgba(20,27,23,.55),inset 0 1px 0 rgba(255,255,255,.08),0 22px 40px -18px rgba(20,27,23,.6)}
.tools .core img{width:34px;height:34px}
.tools .t{width:44px;height:44px;border-radius:12px;background:var(--white);box-shadow:0 0 0 1px var(--line-2),0 10px 22px -14px rgba(20,27,23,.4)}
.tools .t img{width:22px;height:22px;filter:grayscale(1) brightness(.35) contrast(1.4);opacity:.9}
.tools .t:hover img{filter:none;opacity:1}
/* track record: stack tree */
.tr-diagram{padding:44px 30px}
.stk{position:relative;width:100%;max-width:400px;margin:0 auto}
.stk-lines{position:absolute;left:0;top:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.stk-lines path{fill:none;stroke:rgba(236,239,236,.18);stroke-width:1}
.stk-head{position:relative;display:flex;align-items:center;gap:12px;width:280px;margin:0 auto;padding:14px 16px;background:#18211C;box-shadow:0 0 0 1px rgba(236,239,236,.12);--bc:#8D9892}
.stk-head img{width:22px;height:22px}
.stk-head b{display:block;font-size:14px;font-weight:500;color:var(--nfg)}
.stk-head span{font-size:12.5px;color:var(--nmut)}
.stk-grid{position:relative;display:grid;grid-template-columns:repeat(4,1fr);row-gap:22px;margin-top:44px}
.tt{display:flex;flex-direction:column;align-items:center;gap:9px}
.tt i{width:56px;height:56px;border-radius:14px;display:grid;place-items:center;background:#1A231E;box-shadow:0 0 0 1px rgba(236,239,236,.1);font-style:normal;transition:transform .4s var(--ease),background .3s}
.tt i:hover{transform:translateY(-2px);background:#202B25}
.tt img{width:26px;height:26px;object-fit:contain;filter:grayscale(1) brightness(1.9);opacity:.92}
.tt span{font:500 10px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--nmut)}
.tt.more i{background:transparent;box-shadow:none;outline:1px dashed rgba(169,205,185,.5);color:#A9CDB9;font-size:18px}
.tt.more span{color:#A9CDB9}
.tr-nums{display:grid;grid-template-columns:repeat(5,1fr);border-bottom:1px solid var(--nline)}
.tr-nums > div{padding:30px 26px 32px;border-right:1px solid var(--nline)}
.tr-nums > div:last-child{border-right:0}
.tr-nums b{display:block;font-family:var(--serif);font-weight:400;font-size:40px;line-height:1;letter-spacing:-.012em;color:var(--nfg)}
.tr-nums p{font-size:13.5px;color:var(--nmut);margin-top:12px;max-width:24ch}
@media (max-width:980px){.tr-nums{grid-template-columns:1fr 1fr}.tr-nums > div{border-bottom:1px solid var(--nline)}.tr-nums > div:nth-child(2n){border-right:0}}
/* tools and people */
.tlogos{display:grid;grid-template-columns:repeat(9,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.tlogos > div{height:92px;display:grid;place-items:center;border-right:1px solid var(--line)}
.tlogos > div:last-child{border-right:0}
.tlogos img{width:28px;height:28px;object-fit:contain;filter:grayscale(1) brightness(.35) contrast(1.3);opacity:.8;transition:filter .3s,opacity .3s}
.tlogos > div:hover img{filter:none;opacity:1}
.quotes{display:grid;grid-template-columns:repeat(3,1fr)}
.quotes figure{padding:34px 32px 36px;border-right:1px solid var(--line);display:flex;flex-direction:column;gap:26px}
.quotes figure:last-child{border-right:0}
.quotes blockquote{font-size:15px;line-height:1.62;color:var(--fg-2)}
.quotes figcaption{margin-top:auto;display:flex;align-items:center;gap:12px}
.quotes .av{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--fg);color:var(--bg);font:500 12px/1 var(--sans)}
.quotes b{display:block;font-size:14px;font-weight:500}
.quotes em{font-style:normal;font-size:12.5px;color:var(--mut)}
@media (max-width:980px){.tlogos{grid-template-columns:repeat(3,1fr)}.tlogos > div{border-bottom:1px solid var(--line)}.quotes{grid-template-columns:1fr}.quotes figure{border-right:0;border-bottom:1px solid var(--line)}}
/* FAQ: filled rows, bracket corners on the open one (frontal pattern) */
.faq details{border:0!important;background:var(--surface);margin-bottom:4px;position:relative}
.faq details:last-child{border:0!important}
.faq summary{padding:20px 22px}
.faq details p{padding:0 56px 22px 22px}
.faq details[open]{background:var(--white);box-shadow:0 0 0 1px var(--line)}
.faq details[open]::before,.faq details[open]::after{content:"";position:absolute;width:7px;height:7px;border-color:var(--fg-2);border-style:solid;pointer-events:none}
.faq details[open]::before{top:-4px;left:-4px;border-width:1px 0 0 1px}
.faq details[open]::after{bottom:-4px;right:-4px;border-width:0 1px 1px 0}
/* footer mark: present, not dominant */
.giant{padding:28px var(--gut) 32px}
.giant img{max-height:150px;width:auto;max-width:100%;margin:0 auto;opacity:.08}
/* resources menu: two groups plus a featured card */
.mega.res{width:560px;display:grid;grid-template-columns:1fr 170px;gap:8px}
.mg-cols{display:grid;grid-template-columns:1fr 1fr}
.mg-h{display:block;padding:10px 12px 4px;font:500 10px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--mut)}
.mega a.mg-feat{display:flex;flex-direction:column;justify-content:flex-end;gap:6px;padding:16px;background:var(--fg);color:var(--nfg)}
.mega a.mg-feat:hover{background:#26332C}
.mega a.mg-feat b{color:var(--nfg);font-family:var(--serif);font-weight:400;font-size:21px;line-height:1.1}
.mega a.mg-feat span{color:var(--nmut);margin:0}
.mega a.mg-feat .cap{color:#A9CDB9}
.tools .t img{width:22px;height:22px;filter:none;opacity:.86}
.tools .t:hover img{filter:none;opacity:1}
.tlogos img{width:30px;height:30px;filter:none;opacity:.72}
.tlogos > div:hover img{filter:none;opacity:1}
.tt img{filter:invert(1);opacity:.88}
.tools .core img{width:62px;height:auto}
.nav.compact .brand .wm{display:block;height:22px}
.stk-head{justify-content:center;text-align:center}
.stk-lines{width:auto;height:auto}
/* resource listings */
.rgrid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line)}
.rgrid.g4{grid-template-columns:repeat(4,1fr)}
.rgrid article{padding:30px 30px 34px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:10px;transition:background .25s}
.rgrid article:hover{background:var(--surface)}
.rgrid:not(.g4) article:nth-child(3n),.rgrid.g4 article:nth-child(4n){border-right:0}
.rgrid h3{font-family:var(--serif);font-weight:400;font-size:25px;line-height:1.12;letter-spacing:-.015em}
.rgrid p{font-size:14px;color:var(--mut)}
.rgrid .tag{align-self:flex-start;font:500 10.5px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--acc);background:var(--acc-soft);padding:5px 8px}
.rgrid .meta{margin-top:auto;padding-top:8px;font:500 10.5px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--mut)}
.rgrid .api img{width:36px;height:36px;object-fit:contain;margin-bottom:6px}
.rgrid .api h3{font-family:var(--sans);font-size:16px;font-weight:500;letter-spacing:-.01em}
.rgrid .vid .thumb{position:relative;aspect-ratio:16/9;background:linear-gradient(150deg,#22302A,#0F1A15);margin-bottom:8px;display:grid;place-items:center}
.rgrid .vid .thumb i{width:46px;height:46px;border-radius:50%;background:rgba(236,239,236,.12);box-shadow:0 0 0 1px rgba(236,239,236,.25);position:relative}
.rgrid .vid .thumb i::after{content:"";position:absolute;left:18px;top:14px;border-left:13px solid #ECEFEC;border-top:9px solid transparent;border-bottom:9px solid transparent}
.rgrid .vid .dur{position:absolute;right:10px;bottom:10px;font:500 11px/1 var(--mono);color:#ECEFEC;background:rgba(0,0,0,.45);padding:4px 6px}
@media (max-width:980px){.rgrid,.rgrid.g4{grid-template-columns:1fr 1fr}.rgrid article{border-right:1px solid var(--line)!important}.rgrid article:nth-child(2n){border-right:0!important}}
@media (max-width:600px){.rgrid,.rgrid.g4{grid-template-columns:1fr}.rgrid article{border-right:0!important}}
/* pass 4 */
@media (max-width:900px){.portrait{width:100%!important;max-width:300px!important}}
.legal{display:grid;grid-template-columns:1fr auto 1fr}
.legal .theme{justify-self:end}
@media (max-width:860px){.legal{grid-template-columns:1fr;justify-items:start;gap:10px}.legal .theme{justify-self:start}}
.faq details[open]::before,.faq details[open]::after{display:none}
.faq details[open]{background:
 linear-gradient(var(--fg-2),var(--fg-2)) left top/8px 1px no-repeat,linear-gradient(var(--fg-2),var(--fg-2)) left top/1px 8px no-repeat,
 linear-gradient(var(--fg-2),var(--fg-2)) right top/8px 1px no-repeat,linear-gradient(var(--fg-2),var(--fg-2)) right top/1px 8px no-repeat,
 linear-gradient(var(--fg-2),var(--fg-2)) left bottom/8px 1px no-repeat,linear-gradient(var(--fg-2),var(--fg-2)) left bottom/1px 8px no-repeat,
 linear-gradient(var(--fg-2),var(--fg-2)) right bottom/8px 1px no-repeat,linear-gradient(var(--fg-2),var(--fg-2)) right bottom/1px 8px no-repeat,var(--white)}
.tlogos img[alt="salesforce"]{width:40px;height:40px}
.tlogos img[alt="linkedin"]{width:24px;height:24px}
.tlogos img[alt="n8n"]{width:36px}
@media (max-width:980px){.logowall > div{padding:0 12px}}
/* track record proof panel (replaces the stack tree and the number row) */
.tr-proof{width:100%;max-width:380px;padding:30px 30px 28px;background:#141C18;box-shadow:0 0 0 1px rgba(236,239,236,.1);--bc:#56615B}
.tr-proof .cap{color:var(--nmut)}
.tr-big{display:block;font-family:var(--serif);font-weight:400;font-size:76px;line-height:1;letter-spacing:-.015em;color:var(--nfg);margin:16px 0 22px}
.tr-row{display:grid;grid-template-columns:96px 1fr;gap:14px;padding:14px 0;border-top:1px solid var(--nline);align-items:baseline}
.tr-row span{font-family:var(--serif);font-size:22px;color:#A9CDB9;letter-spacing:-.01em}
.tr-row p{font-size:13.5px;color:var(--nmut)}
.tr-proof .link{margin-top:16px;color:#A9CDB9}
.tr-proof .link svg{width:10px;max-width:10px}
/* ---- mobile pass 2026-10-25 ---- */
/* hero: the fold-height rule is desktop only; on phones the hero grows with its content */
@media (max-width:760px){.hero{height:auto!important;padding:64px 0 56px}.hero-copy{padding:24px 0}}
/* mobile menu: Services and Resources collapse behind toggles */
.mnav .mg{border-bottom:1px solid var(--line)}
.mnav .mg summary{list-style:none;display:flex;justify-content:space-between;align-items:center;padding:12px 0;font-size:15px;cursor:pointer}
.mnav .mg summary::-webkit-details-marker{display:none}
.mnav .mg summary::after{content:"";width:8px;height:8px;border-right:1.5px solid var(--fg-2);border-bottom:1.5px solid var(--fg-2);transform:translateY(-2px) rotate(45deg);transition:transform .2s var(--ease)}
.mnav .mg[open] summary::after{transform:translateY(2px) rotate(-135deg)}
.mnav .mg > div{display:grid;padding:0 0 8px 14px}
.mnav .mg > div a{padding:9px 0;border-bottom:0;font-size:14.5px;color:var(--fg-2)}
/* services canvas on phones: stacked, with the wires drawn as a dashed spine */
@media (max-width:980px){
  .cv .sigs{position:relative;margin-bottom:30px!important}
  .cv .sigs::after{content:"";position:absolute;left:30px;bottom:-30px;height:30px;border-left:1.5px dashed #1F5A43}
  .canvas .seq{position:relative!important;left:auto!important;top:auto!important;margin-top:30px!important}
  .canvas .seq::before{content:"";position:absolute;left:30px;top:-30px;height:30px;border-left:1.5px dashed #1F5A43}
  .cv-lines{display:none}
  .cv-cap{position:static!important;display:block;margin-top:20px}
  .mail .mf img + span{display:none}
  .mail .mf .ap{margin-left:auto}
}
/* how it works on phones: same spine between table, signals and pipeline */
@media (max-width:760px){
  .hw{gap:30px!important}
  .hw-card,.hw-pill{position:relative!important}
  .hw > .hw-pill::before,.hw > .hw-pipe::before{content:"";position:absolute;left:30px;top:-31px;height:30px;border-left:1.5px dashed rgba(20,27,23,.35)}
  .hw > .hw-p2::before,.hw > .hw-pipe::before{border-left-color:#1F5A43}
  .hw-pill{max-width:100%;white-space:normal}
}
@media (max-width:760px){.hw-card,.hw-pill{left:auto!important;top:auto!important}.hw-acct,.hw-pipe{width:100%!important}.hw{height:auto!important}}
@media (max-width:600px){.bk-steps{gap:6px!important;margin-bottom:28px!important}.bk-steps div{font-size:9px!important;letter-spacing:.05em!important}.trust .row{grid-template-columns:1fr!important}.trust .row div{border-right:0!important;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:baseline;gap:12px;text-align:left}.trust .row div:last-child{border-bottom:0}}
/* android pass: fill orphan grid cells, thumb-sized tap targets */
@media (max-width:980px){
  .logowall > div:last-child{grid-column:span 2}
  .tabsbar button:last-child{grid-column:1/-1;border-right:0}
}
@media (max-width:760px){
  .foot li{padding:0}
  .foot li a{display:block;padding:11px 0}
  .soc a{display:grid;place-items:center;width:44px;height:44px;margin-left:-13px}
  .legal nav a,.legal .theme{display:inline-flex;align-items:center;min-height:44px}
  .link{min-height:44px}
  .ldoc a{display:inline-block;padding:10px 0}
}